/* Navbar styling */
.no-caret::after {
  display: none !important;
}

/* When drawer is open, elevate the entire navbar above the backdrop.
   Critical fix: .navbar-collapse lives inside #mainNavbar's stacking context
   (z-index 1030). The backdrop was at z-index 1040 which is ABOVE 1030, causing
   the backdrop to intercept all clicks before they reached the drawer. */
#mainNavbar.drawer-active {
    z-index: 1045 !important;
}


#mainNavbar {
    transition: all 0.3s ease;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    background: transparent !important;
    box-shadow: none !important;
}

/* Dark mode navbar in top state */
.dark #mainNavbar {
    background: rgba(15, 23, 42, 0.95) !important;
    backdrop-filter: blur(10px);
}

.dark #mainNavbar .navbar-nav .nav-link {
    color: #f8fafc !important;
}

.dark #mainNavbar .navbar-nav .nav-link:hover,
.dark #mainNavbar .navbar-nav .nav-link:focus,
.dark #mainNavbar .navbar-nav .nav-link.active {
    color: #a855f7 !important;
}

.dark #mainNavbar .navbar-toggler-icon,
.dark #mainNavbar .navbar-toggler-icon::before,
.dark #mainNavbar .navbar-toggler-icon::after {
    background-color: #f8fafc;
}

/* ========== Light Mode ========== */
#mainNavbar.navbar-scrolled {
    background: rgba(255, 255, 255, 0.70) !important;
    backdrop-filter: blur(10px);
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

#mainNavbar.navbar-scrolled .navbar-nav .nav-link:hover,
#mainNavbar.navbar-scrolled .navbar-nav .nav-link:focus,
#mainNavbar.navbar-scrolled .navbar-nav .nav-link.active {
    color: #7c3aed !important;
}

#mainNavbar.navbar-scrolled .navbar-nav .nav-link {
    color: #212529 !important;
}

/* Scrolled state colors */
#mainNavbar.navbar-scrolled .navbar-toggler-icon,
#mainNavbar.navbar-scrolled .navbar-toggler-icon::before,
#mainNavbar.navbar-scrolled .navbar-toggler-icon::after {
    background-color: #212529;
}

/* ========== Dark Mode ========== */
[data-theme="dark"] #mainNavbar.navbar-scrolled,
.dark #mainNavbar.navbar-scrolled,
html[data-bs-theme="dark"] #mainNavbar.navbar-scrolled {
    background: rgba(15, 23, 42, 0.70) !important;
    backdrop-filter: blur(10px);
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.3) !important;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

[data-theme="dark"] #mainNavbar.navbar-scrolled .navbar-nav .nav-link:hover,
[data-theme="dark"] #mainNavbar.navbar-scrolled .navbar-nav .nav-link:focus,
[data-theme="dark"] #mainNavbar.navbar-scrolled .navbar-nav .nav-link.active,
.dark #mainNavbar.navbar-scrolled .navbar-nav .nav-link:hover,
.dark #mainNavbar.navbar-scrolled .navbar-nav .nav-link:focus,
.dark #mainNavbar.navbar-scrolled .navbar-nav .nav-link.active,
html[data-bs-theme="dark"] #mainNavbar.navbar-scrolled .navbar-nav .nav-link:hover,
html[data-bs-theme="dark"] #mainNavbar.navbar-scrolled .navbar-nav .nav-link:focus,
html[data-bs-theme="dark"] #mainNavbar.navbar-scrolled .navbar-nav .nav-link.active {
    color: #a855f7 !important;
}

[data-theme="dark"] #mainNavbar.navbar-scrolled .navbar-nav .nav-link,
.dark #mainNavbar.navbar-scrolled .navbar-nav .nav-link,
html[data-bs-theme="dark"] #mainNavbar.navbar-scrolled .navbar-nav .nav-link {
    color: #f8fafc !important;
}

/* Dark Mode Scrolled state colors */
[data-theme="dark"] #mainNavbar.navbar-scrolled .navbar-toggler-icon,
[data-theme="dark"] #mainNavbar.navbar-scrolled .navbar-toggler-icon::before,
[data-theme="dark"] #mainNavbar.navbar-scrolled .navbar-toggler-icon::after,
.dark #mainNavbar.navbar-scrolled .navbar-toggler-icon,
.dark #mainNavbar.navbar-scrolled .navbar-toggler-icon::before,
.dark #mainNavbar.navbar-scrolled .navbar-toggler-icon::after,
html[data-bs-theme="dark"] #mainNavbar.navbar-scrolled .navbar-toggler-icon,
html[data-bs-theme="dark"] #mainNavbar.navbar-scrolled .navbar-toggler-icon::before,
html[data-bs-theme="dark"] #mainNavbar.navbar-scrolled .navbar-toggler-icon::after {
    background-color: #f8fafc;
}

.navbar-nav .nav-link {
    padding: 0.5rem 0.75rem;
    transition: all 0.2s ease;
    font-size: 1rem;
    color: #71767f !important;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus {
    color: #7c3aed !important;
}

.navbar-nav .nav-link.active {
    color: #7c3aed !important;
}





/* Burger menu icon animation */
.navbar-toggler {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    padding: 0.375rem 0.5rem;
    position: relative;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.navbar-toggler:focus {
    box-shadow: none !important;
}

.navbar-toggler-icon {
    background-image: none !important;
    position: relative;
    width: 24px;
    height: 18px;
    transition: all 0.3s ease;
}

/* Hamburger lines */
.navbar-toggler-icon,
.navbar-toggler-icon::before,
.navbar-toggler-icon::after {
    display: block;
    content: '';
    height: 2px;
    background-color: #71767f;
    border-radius: 1px;
    transition: all 0.3s ease;
}

.navbar-toggler-icon::before,
.navbar-toggler-icon::after {
    position: absolute;
    width: 100%;
    left: 0;
}

.navbar-toggler-icon::before {
    top: -8px;
}

.navbar-toggler-icon::after {
    bottom: -8px;
}



/* Animation to X when menu is open */
.navbar-toggler.menu-open .navbar-toggler-icon {
    background-color: transparent !important;
}

.navbar-toggler.menu-open .navbar-toggler-icon::before {
    transform: rotate(45deg);
    top: 0;
    background-color: #7c3aed;
}

.navbar-toggler.menu-open .navbar-toggler-icon::after {
    transform: rotate(-45deg);
    bottom: 0;
    background-color: #7c3aed;
}

/* Navigation icons */
.nav-icon {
    width: 36px !important;
    height: 36px !important;
}

/* Desktop spacing fix */
@media (min-width: 1200px) {
    .navbar-nav.ms-auto {
        gap: 0.5rem;
    }
    
    .navbar-nav.ms-auto .nav-item {
        margin-left: 0.25rem;
    }
}

/* Dropdown menu styling */
.dropdown-menu {
    border: none;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
    margin-top: 0.5rem;
    border-radius: 8px;
}

.dropdown-item {
    padding: 0.5rem 1rem;
    transition: all 0.2s ease;
    font-size: 0.9rem;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: rgba(137, 81, 233, 0.1);
    color: #7c3aed;
}

/* Desktop language dropdown specific */
@media (min-width: 1200px) {
    #langDropdown + .dropdown-menu {
        min-width: 180px;
        right: 0 !important;
        left: auto !important;
    }
    
    #accountDropdown + .dropdown-menu {
        min-width: 160px;
        right: 0 !important;
        left: auto !important;
    }
}

/* RTL Support for Navbar */

[dir="rtl"] #mainNavbar .navbar-nav .nav-link {
    text-align: right;
}

[dir="rtl"] #mainNavbar .dropdown-menu {
    text-align: right;
}

[dir="rtl"] #mainNavbar .dropdown-item {
    text-align: right;
}

[dir="rtl"] #mainNavbar .dropdown-item i {
    margin-left: 0.5rem;
    margin-right: 0;
}

[dir="rtl"] #mainNavbar .nav-link i {
    margin-left: 0.5rem;
    margin-right: 0;
}


/* RTL Desktop dropdown positioning */
@media (min-width: 1200px) {
    [dir="rtl"] #langDropdown + .dropdown-menu {
        right: auto !important;
        left: 0 !important;
    }
    
    [dir="rtl"] #accountDropdown + .dropdown-menu {
        right: auto !important;
        left: 0 !important;
    }
    
    [dir="rtl"] #langDropdownMd + .dropdown-menu {
        right: auto !important;
        left: 0 !important;
    }
    
    [dir="rtl"] #accountDropdownMd + .dropdown-menu {
        right: auto !important;
        left: 0 !important;
    }
    
    /* RTL Utility buttons spacing on LG screens */
    [dir="rtl"] .navbar-nav.ms-auto {
        gap: 0.5rem;
    }
    
    [dir="rtl"] .navbar-nav.ms-auto .nav-item {
        margin-right: 0.25rem;
        margin-left: 0;
    }
}

/* RTL Mobile menu positioning */
@media (max-width: 1199.98px) {
    [dir="rtl"] .navbar-collapse {
        left: 15px;
        right: 15px;
    }
    
    [dir="rtl"] .navbar-nav .nav-link {
        text-align: right;
    }
    
    [dir="rtl"] .navbar-nav .nav-link i {
        margin-left: 0.5rem;
        margin-right: 0;
    }
    
    [dir="rtl"] .navbar-nav.ms-auto {
        text-align: center;
    }
}

/* RTL Mobile dropdown arrow */
@media (max-width: 767.98px) {
    [dir="rtl"] .navbar-nav .dropdown-toggle::after {
        margin-left: 0;
        margin-right: 0.5rem;
    }
}

/* Mobile menu styling - Enhanced */
@media (max-width: 1199.98px) {
    #mainNavbar {
        background: rgba(255, 255, 255, 0.98) !important;
        backdrop-filter: blur(10px);
    }
    
    .dark #mainNavbar {
        background: rgba(15, 23, 42, 0.98) !important;
        backdrop-filter: blur(10px);
    }
    
    /* Completely transform .navbar-collapse to an Ultra-Premium Offcanvas Drawer */
    .navbar-collapse {
        position: fixed !important;
        top: 0 !important;
        bottom: 0 !important;
        right: 0 !important;
        left: auto !important;
        width: 340px !important;
        max-width: 92vw !important;
        height: 100dvh !important;
        /* Ultra-Premium Glassmorphism */
        background: rgba(255, 255, 255, 0.95) !important;
        backdrop-filter: blur(20px) saturate(180%) !important;
        -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
        box-shadow: -10px 0 40px rgba(0, 0, 0, 0.08) !important;
        border-left: 1px solid rgba(124, 58, 237, 0.15) !important;
        /* z-index is relative to #mainNavbar's stacking context. */
        z-index: 1 !important;
        margin-top: 0 !important;
        padding: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
        /* Hidden by default via transform — Bootstrap's .show class shows it */
        visibility: hidden !important;
        transform: translate3d(100%, 0, 0) !important;
        transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), visibility 0s linear 0.4s !important;
        border-radius: 0 !important;
    }
    
    /* RTL Drawer position and slide */
    [dir="rtl"] .navbar-collapse {
        right: auto !important;
        left: 0 !important;
        box-shadow: 10px 0 40px rgba(0, 0, 0, 0.08) !important;
        border-left: none !important;
        border-right: 1px solid rgba(124, 58, 237, 0.15) !important;
        transform: translate3d(-100%, 0, 0) !important;
    }
    
    .dark .navbar-collapse {
        background: rgba(15, 23, 42, 0.96) !important;
        box-shadow: -10px 0 40px rgba(0, 0, 0, 0.35) !important;
        border-left: 1px solid rgba(168, 85, 247, 0.2) !important;
    }
    
    [dir="rtl"].dark .navbar-collapse,
    .dark [dir="rtl"] .navbar-collapse {
        border-left: none !important;
        border-right: 1px solid rgba(168, 85, 247, 0.2) !important;
    }
    
    /* Bootstrap Show state: slide into view */
    .navbar-collapse.show {
        visibility: visible !important;
        transform: translate3d(0, 0, 0) !important;
        transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), visibility 0s linear 0s !important;
    }
    
    /* Collapsing: keep full height, let JS/transform handle animation */
    .navbar-collapse.collapsing {
        height: 100dvh !important;
        visibility: visible !important;
        transform: translate3d(100%, 0, 0) !important;
        transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
    }
    [dir="rtl"] .navbar-collapse.collapsing {
        transform: translate3d(-100%, 0, 0) !important;
    }
    
    /* Main navigation items & Dynamic Premium Branding */
    .navbar-nav:first-of-type {
        padding: 0.75rem 1rem 1rem 1rem !important;
    }
    
    .navbar-nav:first-of-type::before {
        content: ''; display: none !important;
        display: block;
        font-size: 1.5rem;
        font-weight: 800;
        letter-spacing: -0.5px;
        background: linear-gradient(135deg, #7c3aed, #a855f7);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        margin-bottom: 2rem;
        padding: 0 0.75rem;
    }
    [dir="rtl"] .navbar-nav:first-of-type::before {
        content: 'منتوراكس';
        font-family: inherit;
    }

    
    .navbar-nav .nav-item {
        margin: 0 0 0.2rem 0;
        border: none !important;
    }
    
    .navbar-nav .nav-link {
        color: #334155 !important;
        padding: 0.75rem 1rem !important;
        font-size: 0.95rem;
        font-weight: 600;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: relative;
        overflow: hidden;
        transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.25s ease, color 0.25s ease !important;
    }
    
    /* Glowing Indicator Pill next to active/hovered link */
    .navbar-nav .nav-link::before {
        content: ''; display: none !important;
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%) scaleY(0);
        width: 4px;
        height: 50%;
        background: #7c3aed;
        border-radius: 0 4px 4px 0;
        transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
        transform-origin: center left;
    }
    [dir="rtl"] .navbar-nav .nav-link::before {
        left: auto;
        right: 0;
        border-radius: 4px 0 0 4px;
        transform-origin: center right;
        background: #a855f7;
    }
    
    .dark .navbar-nav .nav-link {
        color: #cbd5e1 !important;
    }
    
    .navbar-nav .nav-link:hover,
    .navbar-nav .nav-link:focus,
    .navbar-nav .nav-link.active {
        color: #7c3aed !important;
        background-color: rgba(124, 58, 237, 0.05) !important;
        transform: translateX(6px);
    }
    [dir="rtl"] .navbar-nav .nav-link:hover,
    [dir="rtl"] .navbar-nav .nav-link:focus,
    [dir="rtl"] .navbar-nav .nav-link.active {
        color: #a855f7 !important;
        background-color: rgba(168, 85, 247, 0.06) !important;
        transform: translateX(-6px);
    }
    
    .navbar-nav .nav-link:hover::before,
    .navbar-nav .nav-link.active::before {
        transform: translateY(-50%) scaleY(1);
    }
    
    .dark .navbar-nav .nav-link:hover,
    .dark .navbar-nav .nav-link:focus,
    .dark .navbar-nav .nav-link.active {
        color: #c084fc !important;
        background-color: rgba(168, 85, 247, 0.08) !important;
    }
    
    /* Elegant Arrow Chevron overrides inside responsive drawer */
    .navbar-collapse .dropdown-toggle::after {
        content: '→' !important;
        border: none !important;
        font-family: inherit !important;
        font-size: 1.15rem !important;
        font-weight: 600 !important;
        transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.25s ease !important;
        display: inline-block !important;
        margin: 0 !important;
        opacity: 0.5;
    }
    [dir="rtl"] .navbar-collapse .dropdown-toggle::after {
        content: '←' !important;
    }
    .navbar-collapse .nav-link:hover .dropdown-toggle::after {
        transform: translateX(4px);
        opacity: 0.95;
    }
    [dir="rtl"] .navbar-collapse .nav-link:hover .dropdown-toggle::after {
        transform: translateX(-4px);
        opacity: 0.95;
    }
    
    /* Hide right utilities in main menu if already persistent in header */
    .navbar-nav.ms-auto {
        display: none !important;
    }
    
    /* Mobile Drawer Brand Header styling */
    .drawer-brand-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
        margin-bottom: 0.5rem !important;
        padding-bottom: 0.6rem !important;
    }
    .dark .drawer-brand-header {
        border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    }
    }
    }
}

/* Restored global rules (accidentally deleted during mobile redesign) */
.dropdown-toggle[aria-expanded="true"] + .dropdown-menu {
    display: block !important;
}

@media (min-width: 1200px) {
  .nested-dropdown .dropdown-menu {
    top: 0;
    left: 100%;
    margin-left: 0.125rem;
  }

  .nested-dropdown .dropdown-toggle::after {
    transform: rotate(-90deg); /* arrow points right */
  }
}


/* ===== Submenu Slide-in Panels =====
   IMPORTANT RULES:
   1. .nav-item.dropdown must be position:static — removes it as containing block.
   2. .dropdown-menu must be position:absolute — NOT fixed.
      Reason: when .navbar-collapse has transform applied (.show state),
      it becomes the containing block for ANY position:fixed descendants.
      This breaks the panel's top/left/width. Using position:absolute with
      overflow-x:hidden on the parent clips the hidden state correctly. */
@media (max-width: 1199.98px) {


    /* Remove Bootstrap's position:relative from nav-item so the drawer
       becomes the containing block for the dropdown-menu */
    .navbar-collapse .nav-item.dropdown {
        position: static !important;
    }

    /* Submenu panel fills the drawer exactly via absolute positioning */
    .navbar-collapse .dropdown-menu {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        min-height: 100% !important;
        background: rgba(255, 255, 255, 0.95) !important;
        backdrop-filter: blur(20px) saturate(180%) !important;
        -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
        z-index: 5 !important;
        margin: 0 !important;
        padding: 5.5rem 1.25rem 2rem 1.25rem !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        display: block !important;
        /* Hidden: pushed to the right — parent overflow-x:hidden clips it */
        visibility: hidden !important;
        transform: translate3d(100%, 0, 0) !important;
        transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
                    visibility 0s linear 0.4s !important;
    }

    [dir="rtl"] .navbar-collapse .dropdown-menu {
        left: 0 !important;
        right: 0 !important;
        transform: translate3d(-100%, 0, 0) !important;
    }

    .dark .navbar-collapse .dropdown-menu {
        background: rgba(15, 23, 42, 0.96) !important;
    }

    /* Slide-in state: panel covers the main menu list */
    .navbar-collapse .dropdown-menu.slide-in {
        visibility: visible !important;
        transform: translate3d(0, 0, 0) !important;
        transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
                    visibility 0s linear 0s !important;
    }

    /* Dropdown items */
    .navbar-collapse .dropdown-item {
        display: block !important;
        padding: 0.95rem 1rem !important;
        font-size: 1rem !important;
        font-weight: 500 !important;
        color: #334155 !important;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
        border-radius: 8px !important;
        transition: all 0.2s ease !important;
        white-space: normal !important;
        background: transparent !important;
    }
    .dark .navbar-collapse .dropdown-item {
        color: #cbd5e1 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
    }
    .navbar-collapse .dropdown-item:last-child {
        border-bottom: none !important;
    }
    .navbar-collapse .dropdown-item:hover,
    .navbar-collapse .dropdown-item:focus {
        background-color: rgba(124, 58, 237, 0.07) !important;
        color: #7c3aed !important;
    }
    .dark .navbar-collapse .dropdown-item:hover,
    .dark .navbar-collapse .dropdown-item:focus {
        background-color: rgba(168, 85, 247, 0.1) !important;
        color: #a855f7 !important;
    }

    /* Chevron caret inside drawer */
    .navbar-collapse .navbar-nav .dropdown-toggle::after {
        border: none !important;
        content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%2371767f' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'%3E%3C/polyline%3E%3C/svg%3E") !important;
        display: inline-block !important;
        vertical-align: middle !important;
        margin-left: 0.4rem !important;
        transition: none !important;
        width: 15px !important;
        height: 15px !important;
    }
    [dir="rtl"] .navbar-collapse .navbar-nav .dropdown-toggle::after {
        margin-left: 0 !important;
        margin-right: 0.4rem !important;
        content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%2371767f' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='15 18 9 12 15 6'%3E%3C/polyline%3E%3C/svg%3E") !important;
    }
}

/* Backdrop: invisible click-catcher only. No dim, no blur.
   Sits below navbar (z-index 1029) but captures clicks on the page area
   to close the drawer when the user clicks outside it. */
.nav-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: transparent;
    z-index: 1029;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.35s ease;
}
.nav-backdrop.show {
    opacity: 1;
    pointer-events: auto;
}
body.nav-open-active {
    overflow: hidden !important;
}

/* ========== Search Results Styling ========== */
#searchResults {
  border: none !important;
}

#searchResults .list-group-item {
  border: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  padding: 0.75rem 1rem;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease;
}

#searchResults .list-group-item:last-child {
  border-bottom: none;
}

#searchResults .list-group-item:hover,
#searchResults .list-group-item.active {
  background-color: rgba(124, 58, 237, 0.1) !important;
  color: #7c3aed !important;
}

#searchResults .list-group-item a {
  color: inherit;
  display: block;
  width: 100%;
}

#searchResults .list-group-item.active a,
#searchResults .list-group-item:hover a {
  color: #7c3aed !important;
}

/* Search hit highlighting */
#searchResults .search-hit,
#searchResults mark.search-hit {
  background-color: rgba(124, 58, 237, 0.2);
  color: inherit;
  padding: 0 2px;
  border-radius: 2px;
}

#searchResults .list-group-item.active .search-hit,
#searchResults .list-group-item:hover .search-hit {
  background-color: rgba(124, 58, 237, 0.35);
  color: #5b21b6;
}

/* Skeleton for search loading */
#searchResults .skel-list-item {
  height: 1rem;
  border-radius: 4px;
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
}

@keyframes shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}