/* Top Header Styling */

.header-top {
    background: #ffffff;
    border-bottom: 1px solid #e9ecef;
    padding: 0.75rem 0; /* 12px → 0.75rem */
}

/* University Logo Section */
.header-logo-section a {
    display: flex;
    align-items: center;
    gap: 0.75rem; /* 12px → 0.75rem */
    text-decoration: none;
}

.logo-image {
    flex-shrink: 0;
}

.logo-image img {
    width: 3.125rem; /* 50px → 3.125rem */
    height: 3.5625rem; /* 57px → 3.5625rem */
    object-fit: contain;
    display: block;
}

.logo-text {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
}

.logo-text .university-name {
    font-size: 0.8125rem; /* 13px → 0.8125rem */
    font-weight: 600;
    color: #000000;
    text-transform: uppercase;
    letter-spacing: 0.019em; /* ~0.3px */
    display: block;
}

.header-logo-section a:hover .university-name {
    color: #333333;
}

/* Contact Information */
.header-contact-info .d-flex {
    gap: 2rem; /* 32px → 2rem */
}

.contact-group {
    display: flex;
    flex-direction: column;
    gap: 0.375rem; /* 6px → 0.375rem */
    justify-content: flex-start;
}

.contact-phone .phone-number {
    font-size: 1rem; /* 16px → 1rem */
    font-weight: 700;
    color: #2c5aa0;
    text-decoration: none;
    white-space: nowrap;
}

.contact-phone .phone-number:hover {
    color: #1a4082;
    text-decoration: none;
}

.contact-phone .phone-number:visited,
.contact-phone .phone-number:focus {
    color: #2c5aa0;
}

.contact-link {
    display: flex;
    align-items: center;
    gap: 0.3125rem; /* 5px → 0.3125rem */
}

.contact-link i {
    color: #2c5aa0;
    font-size: 0.875rem; /* 14px → 0.875rem */
}

.contact-link .contact-btn {
    color: #2c5aa0;
    text-decoration: none;
    font-size: 1.2rem; /* Kept as user-specified 1.2rem */
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    background: none;
    border: none;
    padding: 0;
    min-height: auto;
    transition: all 0.3s ease;
}

.contact-link .contact-btn:hover {
    color: #1a4082;
    text-decoration: none;
}

.contact-link .contact-btn:visited,
.contact-link .contact-btn:focus {
    color: #2c5aa0;
}

.contact-address,
.contact-email {
    display: flex;
    align-items: flex-start;
    gap: 0.3125rem; /* 5px → 0.3125rem */
}

.contact-address i,
.contact-email i {
    color: #2c5aa0;
    font-size: 0.875rem; /* 14px → 0.875rem */
    margin-top: 0.125rem; /* 2px → 0.125rem */
}

.contact-address a,
.contact-email a {
    color: #2c5aa0;
    text-decoration: none;
    font-size: 0.875rem; /* 14px → 0.875rem */
    transition: all 0.3s ease;
}

.contact-address a:hover,
.contact-email a:hover {
    color: #1a4082;
    text-decoration: none;
}

/* Language Switcher */
.language-switcher {
    display: flex;
    gap: 0.5rem; /* 8px → 0.5rem */
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
}

.language-switcher .lang-item {
    list-style: none;
}

.language-switcher .lang-item a {
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: var(--transition-base);
}

.language-switcher .lang-item a img {
    width: 1.875rem; /* 30px → 1.875rem */
    height: 1.875rem; /* 30px → 1.875rem */
    border-radius: var(--radius-sm);
    object-fit: cover;
    opacity: 0.5;
    transition: var(--transition-base);
}

.language-switcher .lang-item.current-lang a img,
.language-switcher .lang-item a:hover img {
    opacity: 1;
}

/* Responsive: Hide second contact group on tablets and smaller */
@media (max-width: 991px) {
    .contact-group:nth-child(2) {
        display: none !important;
    }
}

/* Mobile Responsive */
@media (max-width: 767px) {
    .header-top {
        padding: 0.625rem 0; /* 10px → 0.625rem */
    }
    
    .header-logo-section a {
        gap: 0.5rem; /* 8px → 0.5rem */
    }
    
    .logo-image img {
        width: 2.5rem; /* 40px → 2.5rem */
        height: 2.875rem; /* 46px → 2.875rem */
    }
    
    .logo-text .university-name {
        font-size: 0.6875rem; /* 11px → 0.6875rem */
    }
    
    .contact-phone .phone-number {
        font-size: 0.875rem; /* 14px → 0.875rem */
    }
    
    .header-contact-info .d-flex {
        gap: 1rem; /* 16px → 1rem */
    }
    
    .contact-group {
        gap: 0.25rem; /* 4px → 0.25rem */
    }
    
    .language-switcher {
        gap: 0.375rem; /* 6px → 0.375rem */
    }
    
    .language-switcher .lang-item a img {
        width: 1.5rem; /* 24px → 1.5rem */
        height: 1.5rem; /* 24px → 1.5rem */
    }
}

/* Extra Small Devices */
@media (max-width: 575px) {
    .header-top {
        padding: 0.5rem 0; /* More compact on small screens */
    }
    
    .header-top .container {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    
    .header-top .d-flex {
        flex-wrap: wrap;
        gap: 0.5rem;
    }
    
    .header-logo-section {
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 0.5rem;
    }
    
    .header-contact-info {
        flex: 0 0 auto;
        order: 2;
    }
    
    .header-language {
        flex: 0 0 auto;
        order: 3;
        margin-left: auto;
    }
    
    .header-contact-info .d-flex {
        flex-direction: column;
        gap: 0.5rem; /* 8px → 0.5rem */
    }
    
    .logo-text .university-name {
        font-size: 0.625rem; /* 10px → 0.625rem */
    }
    
    .logo-image img {
        width: 2rem; /* 32px → 2rem */
        height: 2.3125rem; /* 37px → 2.3125rem */
    }
    
    .contact-phone .phone-number {
        font-size: 0.75rem;
    }
}

/* Tablet Landscape */
@media (min-width: 768px) and (max-width: 991px) {
    .header-contact-info .d-flex {
        gap: 1.5rem; /* 24px → 1.5rem */
    }
}

/* Large Screens */
@media (min-width: 992px) {
    .header-top {
        padding: 0.875rem 0; /* 14px → 0.875rem */
    }
}
