/* --- glass-nav.css --- */

/* 1. Global Navigation Layout Fixes */
.nav-navs {
    display: flex;
    justify-content: space-between; /* Pushes text left, icons right */
    align-items: center;
    width: 100%;
}

/* Make selectors stronger to override Tabi's default "gap: 1px" */
.navbar .nav-navs ul.nav-list-text, 
.navbar .nav-navs ul.nav-list-icons {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Force the breathing room between text buttons */
.navbar .nav-navs ul.nav-list-text {
    gap: 1.5rem !important; /* The !important forces Tabi to back off */
}

/* Keep icons tightly packed */
.navbar .nav-navs ul.nav-list-icons {
    gap: 0 !important; 
}

/* 2. Glassy Effect: Applied ONLY to Text Buttons */
.nav-button:not(.social-btn):not(.switcher-btn):not(.menu-icon) {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    
    /* Brighter Base Glass State */
    background: rgba(250, 250, 250, var(--glassy-base-opacity)); /* Brighter white tint */
    backdrop-filter: blur(12px); /* Stronger blur */
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--bcg-grad-violette-soft);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2); /* Subtle shadow to make it pop */
}

/* 3. Glassy Hover Effect: Text Buttons Only */
.nav-button:not(.social-btn):not(.switcher-btn):not(.menu-icon):hover {
    background: rgba(255, 255, 255,var(--glassy-stronger-opacity)) !important; /* Noticeably brighter on hover */
    border-color: var(--bcg-grad-violette-soft) !important; 
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.35);
}

/* 4. Icon & Switcher Buttons Styling */
.social-btn, 
.switcher-btn, 
.menu-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    transition: transform 0.2s ease;
    padding: 0.1rem !important;
    margin: 0 !important; 
}

.social-btn:hover, 
.switcher-btn:hover, 
.menu-icon:hover {
    transform: scale(1.25);
}

/* 5. Unified Icon Sizing */
.nav-button img, 
.nav-button svg, 
.language-switcher-icon, 
.theme-switcher {
    width: 24px !important;
    height: 24px !important;
    display: block;
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(149deg) brightness(108%) contrast(101%);
}

/* 6. Fix for Tabi defaults (Bigger Nav Buttons) */
.nav-links {
    padding: 0.8rem 1.5rem !important; /* Increased padding for a larger click area */
    font-size: 1.05em; /* Slightly larger text */
    color: var(--text-color) !important;
    text-decoration: none !important;
    line-height: 1; 
}

/* Ensure tabi's default hover background is removed */
.nav-links:hover, .no-hover-padding:hover {
    background-color: transparent !important;
}

/* 7. Switcher Center Alignment */
.language-switcher, 
.theme-switcher-wrapper {
    margin: 0 !important;
    display: flex;
    align-items: center;
}

/* 8. Stop icons from turning white/changing color on hover */

/* Fix for the search icon (inline SVG) */
.menu-icon:hover svg {
    fill: var(--text-color) !important;
    color: var(--text-color) !important;
}

/* Fix for the language switcher globe (Tabi uses a CSS mask background for this) */
.language-switcher .language-switcher-icon:hover {
    background: var(--text-color) !important;

    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(149deg) brightness(108%) contrast(101%);
}

/* --- Force crush padding on icon-only links --- */

/* Overrides the large .nav-links padding for the social/icon buttons */
.navbar .nav-navs ul.nav-list-icons .social-btn a.nav-links,
.navbar .nav-navs ul.nav-list-icons .social-btn a.no-hover-padding,
.navbar .nav-navs ul.nav-list-icons .menu-icon div {
    padding: 0.4rem !important; /* Dramatically smaller padding */
    margin: 0 !important;
}

/* Ensure the wrapper <li> also has no extra padding/margin */
.social-btn, 
.switcher-btn, 
.menu-icon {
    padding: 0 !important;
    margin: 0 !important;
}

.language-switcher-icon {
    margin-right: 0.4rem !important;
}