/**
 * Navbar Hover Enhancement - TeslaServer Theme
 * باز شدن منو با hover به جای فقط click
 */

/* Desktop Hover Effect for Dropdowns */
@media (min-width: 1200px) {
    /* Primary Navbar Dropdowns */
    .main-navbar-wrapper .navbar-nav .dropdown:hover > .dropdown-menu {
        display: block !important;
        animation: fadeInDown 0.3s ease-in-out;
    }
    
    /* Account Dropdown (Secondary) */
    .main-navbar-wrapper .navbar-nav .account:hover > .dropdown-menu {
        display: grid !important;
        animation: fadeInDown 0.3s ease-in-out;
    }
    
    /* Smooth transition for dropdown toggle */
    .main-navbar-wrapper .dropdown-toggle {
        transition: color 0.2s ease, background-color 0.2s ease;
    }
    
    /* Highlight dropdown when hovering */
    .main-navbar-wrapper .dropdown:hover > .dropdown-toggle {
        color: #0080FF !important;
    }
    
    /* Prevent dropdown from closing when hovering over it */
    .main-navbar-wrapper .dropdown-menu:hover {
        display: block !important;
    }
    
    .main-navbar-wrapper .navbar-nav .account .dropdown-menu:hover {
        display: grid !important;
    }
}

/* Animation for dropdown appearance */
@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Dropdown styling is now in header-redesign.css */

/* Navbar links hover effect */
.main-navbar-wrapper .navbar-nav .nav-link,
.main-navbar-wrapper .navbar-nav > li > a {
    transition: color 0.2s ease;
    position: relative;
}

.main-navbar-wrapper .navbar-nav .nav-link:hover,
.main-navbar-wrapper .navbar-nav > li > a:hover {
    color: #0080FF !important;
}

/* Underline effect on hover */
.main-navbar-wrapper .navbar-nav > li > a:not(.dropdown-toggle)::after {
    content: '';
    position: absolute;
    bottom: 6px;
    left: 0;
    right: 0;
    height: 2px;
    background: #0080FF;
    transform: scaleX(0);
    transition: transform 0.3s ease;
}

.main-navbar-wrapper .navbar-nav > li > a:not(.dropdown-toggle):hover::after {
    transform: scaleX(1);
}

/* Mobile - Keep click behavior */
@media (max-width: 1199px) {
    /* On mobile, keep the default click behavior */
    .main-navbar-wrapper .dropdown-menu {
        display: none !important;
    }
    
    .main-navbar-wrapper .dropdown.show > .dropdown-menu {
        display: block !important;
    }
    
    .main-navbar-wrapper .navbar-nav .account.show > .dropdown-menu {
        display: grid !important;
    }
}

/* Improve navbar spacing */
.main-navbar-wrapper .navbar-nav > li {
    margin: 0 0.25rem;
}

.main-navbar-wrapper .navbar-nav > li > a {
    padding: 0.75rem 1rem !important;
    border-radius: 6px;
}

/* Account dropdown specific styling */
.main-navbar-wrapper .account > a {
    font-weight: 600;
    color: #1e293b;
}

.main-navbar-wrapper .account:hover > a {
    color: #0080FF !important;
}

/* Dropdown menu right alignment fix */
.main-navbar-wrapper .dropdown-menu-right {
    right: 0;
    left: auto;
}

/* RTL Support */
[dir="rtl"] .main-navbar-wrapper .dropdown-item:hover {
    transform: translateX(3px);
}

[dir="rtl"] .main-navbar-wrapper .dropdown-menu-right {
    right: auto;
    left: 0;
}

/* Accessibility - Keep keyboard navigation */
.main-navbar-wrapper .dropdown-toggle:focus {
    outline: 2px solid #0080FF;
    outline-offset: 2px;
}

.main-navbar-wrapper .dropdown-item:focus {
    background-color: #e3f2fd;
    color: #0080FF;
    outline: none;
}

/* Prevent FOUC (Flash of Unstyled Content) */
.main-navbar-wrapper .dropdown-menu {
    opacity: 1;
}

/* Smooth transition for dropdown appearance */
@media (min-width: 1200px) {
    .main-navbar-wrapper .dropdown-menu {
        transition: opacity 0.2s ease, transform 0.2s ease;
    }
}