/* =================================================================
   GLOBAL MENU SYSTEM - UNIFIED NAVIGATION STYLING
   ================================================================= */

/* Reset all existing menu/navigation styles */
.nav-btn, .navbar-nav .nav-link, .navbar .nav-link, .nav-link,
.horizontal-nav-container .nav-btn, .nav-actions .nav-btn,
.dropdown-toggle, .navbar .dropdown-toggle, .nav-dropdown .dropdown-toggle {
    /* Remove existing styles */
    background: none !important;
    border: none !important;
    color: inherit !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    text-decoration: none !important;
    outline: none !important;
    font-weight: inherit !important;
}

/* =================================================================
   MENU ITEMS - WHITE TEXT, BOLD FOR ACTIVE
   ================================================================= */

/* All menu items - default white text */
.nav-btn, .navbar-nav .nav-link, .navbar .nav-link, .nav-link,
.horizontal-nav-container .nav-btn, .nav-actions .nav-btn,
.dropdown-toggle, .navbar .dropdown-toggle, .nav-dropdown .dropdown-toggle,
a.nav-btn, a.nav-link, button.nav-btn, button.dropdown-toggle {
    /* Typography */
    color: #ffffff !important;
    font-weight: 500 !important;
    font-size: 0.9rem !important;
    text-decoration: none !important;
    
    /* Layout */
    padding: 0.75rem 1rem !important;
    border-radius: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    margin: 0 0.25rem !important;
    
    /* Interactions */
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    white-space: nowrap !important;
    background: transparent !important;
    border: 1px solid transparent !important;
}

/* Text inside menu items - force white */
.nav-btn span, .navbar-nav .nav-link span, .navbar .nav-link span, .nav-link span,
.horizontal-nav-container .nav-btn span, .nav-actions .nav-btn span,
.dropdown-toggle span, .navbar .dropdown-toggle span, .nav-dropdown .dropdown-toggle span,
a.nav-btn span, a.nav-link span, button.nav-btn span, button.dropdown-toggle span,
.nav-btn .nav-text, .navbar-nav .nav-link .nav-text, .navbar .nav-link .nav-text, .nav-link .nav-text,
.horizontal-nav-container .nav-btn .nav-text, .nav-actions .nav-btn .nav-text,
.dropdown-toggle .nav-text, .navbar .dropdown-toggle .nav-text, .nav-dropdown .dropdown-toggle .nav-text {
    color: #ffffff !important;
    font-weight: inherit !important;
}

/* Menu items hover - transparent white background */
.nav-btn:hover, .navbar-nav .nav-link:hover, .navbar .nav-link:hover, .nav-link:hover,
.horizontal-nav-container .nav-btn:hover, .nav-actions .nav-btn:hover,
.dropdown-toggle:hover, .navbar .dropdown-toggle:hover, .nav-dropdown .dropdown-toggle:hover,
a.nav-btn:hover, a.nav-link:hover, button.nav-btn:hover, button.dropdown-toggle:hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.15) !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
    transform: translateY(-1px) !important;
    text-decoration: none !important;
}

/* Hover text inside menu items - force white */
.nav-btn:hover span, .navbar-nav .nav-link:hover span, .navbar .nav-link:hover span, .nav-link:hover span,
.horizontal-nav-container .nav-btn:hover span, .nav-actions .nav-btn:hover span,
.dropdown-toggle:hover span, .navbar .dropdown-toggle:hover span, .nav-dropdown .dropdown-toggle:hover span,
a.nav-btn:hover span, a.nav-link:hover span, button.nav-btn:hover span, button.dropdown-toggle:hover span,
.nav-btn:hover .nav-text, .navbar-nav .nav-link:hover .nav-text, .navbar .nav-link:hover .nav-text, .nav-link:hover .nav-text,
.horizontal-nav-container .nav-btn:hover .nav-text, .nav-actions .nav-btn:hover .nav-text,
.dropdown-toggle:hover .nav-text, .navbar .dropdown-toggle:hover .nav-text, .nav-dropdown .dropdown-toggle:hover .nav-text {
    color: #ffffff !important;
    font-weight: inherit !important;
}

/* Active menu items - bold white text */
.nav-btn.active, .navbar-nav .nav-link.active, .navbar .nav-link.active, .nav-link.active,
.horizontal-nav-container .nav-btn.active, .nav-actions .nav-btn.active,
.dropdown-toggle.active, .navbar .dropdown-toggle.active, .nav-dropdown .dropdown-toggle.active,
a.nav-btn.active, a.nav-link.active, button.nav-btn.active, button.dropdown-toggle.active {
    color: #ffffff !important;
    font-weight: 700 !important;
    background: rgba(255, 255, 255, 0.2) !important;
    border-color: rgba(255, 255, 255, 0.4) !important;
    text-decoration: none !important;
}

/* Active text inside menu items - force white and bold */
.nav-btn.active span, .navbar-nav .nav-link.active span, .navbar .nav-link.active span, .nav-link.active span,
.horizontal-nav-container .nav-btn.active span, .nav-actions .nav-btn.active span,
.dropdown-toggle.active span, .navbar .dropdown-toggle.active span, .nav-dropdown .dropdown-toggle.active span,
a.nav-btn.active span, a.nav-link.active span, button.nav-btn.active span, button.dropdown-toggle.active span,
.nav-btn.active .nav-text, .navbar-nav .nav-link.active .nav-text, .navbar .nav-link.active .nav-text, .nav-link.active .nav-text,
.horizontal-nav-container .nav-btn.active .nav-text, .nav-actions .nav-btn.active .nav-text,
.dropdown-toggle.active .nav-text, .navbar .dropdown-toggle.active .nav-text, .nav-dropdown .dropdown-toggle.active .nav-text {
    color: #ffffff !important;
    font-weight: 700 !important;
}

/* Active menu items hover - maintain bold styling */
.nav-btn.active:hover, .navbar-nav .nav-link.active:hover, .navbar .nav-link.active:hover, .nav-link.active:hover,
.horizontal-nav-container .nav-btn.active:hover, .nav-actions .nav-btn.active:hover,
.dropdown-toggle.active:hover, .navbar .dropdown-toggle.active:hover, .nav-dropdown .dropdown-toggle.active:hover,
a.nav-btn.active:hover, a.nav-link.active:hover {
    color: #ffffff !important;
    font-weight: 700 !important;
    background: rgba(255, 255, 255, 0.25) !important;
    border-color: rgba(255, 255, 255, 0.5) !important;
    transform: translateY(-1px) !important;
}

/* =================================================================
   DROPDOWN MENUS - BLACK TEXT ON WHITE BACKGROUND
   ================================================================= */

/* Reset dropdown menu styling */
.dropdown-menu {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Dropdown menu container */
.dropdown-menu, .nav-dropdown .dropdown-menu, .navbar .dropdown-menu {
    background: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15) !important;
    padding: 0.5rem 0 !important;
    margin-top: 0.5rem !important;
    min-width: 200px !important;
}

/* Dropdown items - black text on white background */
.dropdown-menu .dropdown-item, .nav-dropdown .dropdown-menu .dropdown-item, .navbar .dropdown-menu .dropdown-item {
    color: #212529 !important;
    background: transparent !important;
    font-weight: 500 !important;
    font-size: 0.9rem !important;
    padding: 0.75rem 1rem !important;
    border: none !important;
    text-decoration: none !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
}

/* Dropdown items hover - bold text */
.dropdown-menu .dropdown-item:hover, .nav-dropdown .dropdown-menu .dropdown-item:hover, .navbar .dropdown-menu .dropdown-item:hover {
    color: #212529 !important;
    background: rgba(0, 0, 0, 0.05) !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

/* Active dropdown items - bold text */
.dropdown-menu .dropdown-item.active, .nav-dropdown .dropdown-menu .dropdown-item.active, .navbar .dropdown-menu .dropdown-item.active {
    color: #212529 !important;
    background: rgba(0, 0, 0, 0.08) !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

/* Active dropdown items hover - maintain bold styling */
.dropdown-menu .dropdown-item.active:hover, .nav-dropdown .dropdown-menu .dropdown-item.active:hover, .navbar .dropdown-menu .dropdown-item.active:hover {
    color: #212529 !important;
    background: rgba(0, 0, 0, 0.1) !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

/* =================================================================
   DROPDOWN TOGGLES - SPECIAL STYLING
   ================================================================= */

/* Dropdown toggle arrows */
.dropdown-toggle::after {
    border-top-color: #ffffff !important;
    margin-left: 0.5rem !important;
    transition: transform 0.2s ease !important;
}

/* Dropdown toggle when open */
.dropdown-toggle[aria-expanded="true"]::after {
    transform: rotate(180deg) !important;
}

/* =================================================================
   BRAND AND LOGO STYLING
   ================================================================= */

/* Navbar brand - no menu styling */
.navbar-brand, .navbar-brand:hover, .navbar-brand:focus, .navbar-brand:active {
    color: #ffffff !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    padding: 0.5rem 0 !important;
    margin-right: 2rem !important;
}

/* =================================================================
   MOBILE RESPONSIVE ADJUSTMENTS
   ================================================================= */

@media (max-width: 768px) {
    /* Mobile menu items */
    .nav-btn, .navbar-nav .nav-link, .navbar .nav-link, .nav-link,
    .horizontal-nav-container .nav-btn, .nav-actions .nav-btn,
    .dropdown-toggle, .navbar .dropdown-toggle, .nav-dropdown .dropdown-toggle {
        padding: 0.6rem 0.8rem !important;
        font-size: 0.85rem !important;
        margin: 0.1rem !important;
    }
    
    /* Mobile dropdown menus */
    .dropdown-menu, .nav-dropdown .dropdown-menu, .navbar .dropdown-menu {
        margin-top: 0.25rem !important;
        min-width: 180px !important;
    }
    
    .dropdown-menu .dropdown-item, .nav-dropdown .dropdown-menu .dropdown-item, .navbar .dropdown-menu .dropdown-item {
        padding: 0.6rem 0.8rem !important;
        font-size: 0.85rem !important;
    }
}

/* =================================================================
   ICON STYLING IN MENUS
   ================================================================= */

/* Icons in menu items */
.nav-btn i, .navbar-nav .nav-link i, .navbar .nav-link i, .nav-link i,
.horizontal-nav-container .nav-btn i, .nav-actions .nav-btn i,
.dropdown-toggle i, .navbar .dropdown-toggle i, .nav-dropdown .dropdown-toggle i {
    width: 16px !important;
    height: 16px !important;
    stroke-width: 2.5 !important;
    color: #ffffff !important;
    stroke: #ffffff !important;
}

/* Icons in dropdown items */
.dropdown-menu .dropdown-item i, .nav-dropdown .dropdown-menu .dropdown-item i, .navbar .dropdown-menu .dropdown-item i {
    width: 16px !important;
    height: 16px !important;
    stroke-width: 2.5 !important;
    color: #212529 !important;
    stroke: #212529 !important;
}

/* =================================================================
   OVERRIDE EXISTING CONFLICTING STYLES
   ================================================================= */

/* Override any existing button/nav styling that conflicts */
.navbar .btn, .navbar button, .nav-actions .btn, .nav-actions button {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    color: #ffffff !important;
    font-weight: 500 !important;
}

.navbar .btn:hover, .navbar button:hover, .nav-actions .btn:hover, .nav-actions button:hover {
    background: rgba(255, 255, 255, 0.15) !important;
    border-color: rgba(255, 255, 255, 0.5) !important;
    color: #ffffff !important;
    font-weight: 500 !important;
}

/* Override any problematic yellow or other colored active states */
.nav-link.active {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.2) !important;
    font-weight: 700 !important;
}

/* Force override for any Bootstrap or framework conflicts */
.navbar-dark .navbar-nav .nav-link,
.navbar-dark .navbar-nav .nav-link:focus,
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link.active,
.navbar-dark .navbar-nav .nav-link.show,
.navbar-dark .navbar-brand,
.navbar-dark .navbar-brand:focus,
.navbar-dark .navbar-brand:hover {
    color: #ffffff !important;
}

/* Override any text color issues in navigation */
.navbar .nav-link,
.navbar .nav-btn,
.navbar .dropdown-toggle,
.horizontal-nav-container .nav-btn,
.horizontal-nav-container .dropdown-toggle {
    color: #ffffff !important;
}

.navbar .nav-link *,
.navbar .nav-btn *,
.navbar .dropdown-toggle *,
.horizontal-nav-container .nav-btn *,
.horizontal-nav-container .dropdown-toggle * {
    color: #ffffff !important;
}

/* Specific override for button text content */
.navbar button,
.navbar .btn,
.horizontal-nav-container button,
.horizontal-nav-container .btn {
    color: #ffffff !important;
}

.navbar button *,
.navbar .btn *,
.horizontal-nav-container button *,
.horizontal-nav-container .btn * {
    color: #ffffff !important;
}

/* Ensure proper spacing and alignment */
.horizontal-nav-container {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.25rem !important;
    flex-wrap: wrap !important;
}

.nav-dropdown {
    position: relative !important;
    display: inline-block !important;
}

/* =================================================================
   FOOTER TEXT STYLING - WHITE TEXT ON DARK BACKGROUND
   ================================================================= */

/* Footer container with light blue background */
.footer, footer, .site-footer, .main-footer, .modern-footer {
    color: #ffffff !important;
    background: linear-gradient(135deg, #1488CC 0%, #2B7EDB 100%) !important;
    background-color: #1488CC !important;
}

/* All footer text elements */
.footer *, footer *, .site-footer *, .main-footer *,
.footer p, footer p, .site-footer p, .main-footer p,
.footer a, footer a, .site-footer a, .main-footer a,
.footer span, footer span, .site-footer span, .main-footer span,
.footer div, footer div, .site-footer div, .main-footer div,
.footer h1, footer h1, .site-footer h1, .main-footer h1,
.footer h2, footer h2, .site-footer h2, .main-footer h2,
.footer h3, footer h3, .site-footer h3, .main-footer h3,
.footer h4, footer h4, .site-footer h4, .main-footer h4,
.footer h5, footer h5, .site-footer h5, .main-footer h5,
.footer h6, footer h6, .site-footer h6, .main-footer h6 {
    color: #ffffff !important;
}

/* Footer links */
.footer a:hover, footer a:hover, .site-footer a:hover, .main-footer a:hover,
.footer a:focus, footer a:focus, .site-footer a:focus, .main-footer a:focus {
    color: rgba(255, 255, 255, 0.8) !important;
    text-decoration: none !important;
}

/* Dark background footer text fix */
.bg-dark, .bg-primary, .bg-secondary, .navbar-dark {
    color: #ffffff !important;
}

.bg-dark *, .bg-primary *, .bg-secondary *, .navbar-dark * {
    color: #ffffff !important;
}

/* Copyright and bottom footer text */
.copyright, .copyright-text, .footer-copyright,
.footer-bottom, .footer-bottom *, 
.site-info, .site-info * {
    color: #ffffff !important;
}

/* Social icons in footer */
.footer .social-icon, footer .social-icon, .site-footer .social-icon, .main-footer .social-icon,
.footer .fab, footer .fab, .site-footer .fab, .main-footer .fab,
.footer .fa, footer .fa, .site-footer .fa, .main-footer .fa {
    color: #ffffff !important;
}

/* Modern footer specific overrides */
.modern-footer, .modern-footer * {
    color: #ffffff !important;
}

.footer-content, .footer-content * {
    color: #ffffff !important;
}

.footer-brand, .footer-brand * {
    color: #ffffff !important;
}

.footer-description {
    color: rgba(255, 255, 255, 0.8) !important;
}

.footer-links, .footer-links * {
    color: #ffffff !important;
}

.footer-column h4 {
    color: #ffffff !important;
}

.footer-column a {
    color: rgba(255, 255, 255, 0.7) !important;
}

.footer-column a:hover {
    color: #ffffff !important;
}

.footer-bottom-content, .footer-bottom-content * {
    color: rgba(255, 255, 255, 0.8) !important;
}

/* Help Center link override */
.help-center-link, .help-center-link * {
    color: #ffffff !important;
}

/* Any remaining dark text overrides */
.text-dark, .text-muted, .text-secondary {
    color: #ffffff !important;
}

/* Force override for any remaining black text */
[style*="color: black"], [style*="color: #000"], [style*="color: rgb(0, 0, 0)"] {
    color: #ffffff !important;
}

/* =================================================================
   REMOVE EXTRA SPACE BELOW FOOTER
   ================================================================= */

/* Remove default body margins and ensure footer sits at bottom */
body {
    margin: 0 !important;
    padding: 0 !important;
    min-height: 100vh !important;
}

html {
    margin: 0 !important;
    padding: 0 !important;
}

/* Ensure footer has no extra margins */
.modern-footer, .footer, footer, .site-footer, .main-footer {
    margin-bottom: 0 !important;
    padding-bottom: var(--space-xl) !important;
}

/* Remove any extra spacing from body or main containers */
.container, .container-fluid, main, #main-content {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* Fix any potential overflow or extra height issues */
.wrapper, .page-wrapper, .content-wrapper {
    min-height: calc(100vh - 60px) !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* Ensure no extra space from Bootstrap or other frameworks */
.row:last-child, .col:last-child, .section:last-child {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* =================================================================
   DASHBOARD TOUR CARD WHITE TEXT
   ================================================================= */

/* Dashboard tour/onboarding welcome card text override */
.onboarding-welcome,
.onboarding-welcome.active,
.dashboard-tour-card,
.tour-card {
    color: #ffffff !important;
}

.onboarding-welcome *,
.onboarding-welcome.active *,
.dashboard-tour-card *,
.tour-card * {
    color: #ffffff !important;
    text-shadow: none !important;
}

/* Remove text highlighting/selection background issues */
.onboarding-welcome *::selection,
.onboarding-welcome.active *::selection,
.dashboard-tour-card *::selection,
.tour-card *::selection {
    background: rgba(255, 255, 255, 0.2) !important;
    color: #ffffff !important;
}

/* Specific elements that might have conflicting colors */
.onboarding-welcome h1, .onboarding-welcome h2, .onboarding-welcome h3,
.onboarding-welcome h4, .onboarding-welcome h5, .onboarding-welcome h6,
.onboarding-welcome p, .onboarding-welcome span, .onboarding-welcome div,
.onboarding-welcome strong, .onboarding-welcome em, .onboarding-welcome b,
.dashboard-tour-card h1, .dashboard-tour-card h2, .dashboard-tour-card h3,
.dashboard-tour-card h4, .dashboard-tour-card h5, .dashboard-tour-card h6,
.dashboard-tour-card p, .dashboard-tour-card span, .dashboard-tour-card div,
.dashboard-tour-card strong, .dashboard-tour-card em, .dashboard-tour-card b {
    color: #ffffff !important;
    background: none !important;
    background-color: transparent !important;
}

/* Override Bootstrap and framework text utilities */
.onboarding-welcome .text-dark,
.onboarding-welcome .text-black,
.onboarding-welcome .text-body,
.onboarding-welcome .text-muted,
.onboarding-welcome .text-secondary,
.onboarding-welcome .text-primary,
.dashboard-tour-card .text-dark,
.dashboard-tour-card .text-black,
.dashboard-tour-card .text-body,
.dashboard-tour-card .text-muted,
.dashboard-tour-card .text-secondary,
.dashboard-tour-card .text-primary {
    color: #ffffff !important;
}

/* Force override for computed styles and inline styles */
.onboarding-welcome *[style*="color: black"],
.onboarding-welcome *[style*="color: #000"],
.onboarding-welcome *[style*="color: rgb(0, 0, 0)"],
.onboarding-welcome *[style*="color:black"],
.onboarding-welcome *[style*="color:#000"],
.onboarding-welcome *[style*="color:rgb(0,0,0)"] {
    color: #ffffff !important;
}