/* ═══════════════════════════════════════════════════════════════════════════
   LOOM INDICA — loom-nav-fix.css
   Append this AFTER loom-nav.css in every page.

   HOW TO ADD:
     <link rel="stylesheet" href="../assets/css/loom-nav.css">
     <link rel="stylesheet" href="../assets/css/loom-nav-fix.css">  ← add this

   WHY THIS EXISTS:
   loom-nav.css sets pointer-events:none on .li-search-input so the "overlay
   handles interaction" — but that only works once LoomLiveSearch.init() is
   called. This file makes the search bar functional in all states, and fixes
   a few z-index and overflow issues with the mega menu.
═══════════════════════════════════════════════════════════════════════════ */

/* ── FIX: Restore pointer events on the header search input ── */
.li-search-wrap .li-search-input {
  pointer-events: auto !important;
  cursor: text !important;
}

/* ── FIX: Make the whole search wrap a proper click target ── */
.li-search-wrap {
  cursor: text;
  position: relative;
}

/* ── FIX: Keyboard hint label (Ctrl+K) ── */
/* .li-search-wrap::after {
  content: 'Ctrl K';
  position: absolute;
  right: 54px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 10px;
  font-weight: 700;
  color: var(--loom-text-muted, #6C6C80);
  background: var(--loom-bg-warm, #F3EDE1);
  border: 1px solid var(--loom-border, #E8E2D8);
  border-radius: 4px;
  padding: 2px 6px;
  letter-spacing: 0.04em;
  pointer-events: none;
  display: none;
} */
@media (min-width: 992px) {
  .li-search-wrap::after { display: block; }
}

/* ── FIX: Mega menu must sit above the sticky header ── */
.li-mega-wrapper {
  z-index: 9999 !important;
}

/* ── FIX: nav bar needs overflow:visible for dropdowns to escape ── */
.li-nav-bar,
.li-nav-bar .container {
  overflow: visible !important;
}

/* ── FIX: Search overlay z-index above everything including header ── */
#loom-search-overlay {
  z-index: 10000 !important;
}

/* ── FIX: .li-search-input inside overlay has correct styles ── */
.so-input {
  pointer-events: auto !important;
  cursor: text !important;
}

/* ── ENHANCEMENT: Search wrap focus ring is visible ── */
.li-search-wrap:focus-within {
  border-color: var(--loom-primary, #3D2B6B) !important;
  box-shadow: 0 0 0 3px rgba(61, 43, 107, 0.10) !important;
}

/* ── ENHANCEMENT: Animate the search wrap on hover ── */
.li-search-wrap:hover {
  border-color: var(--loom-primary-light, #5A4090);
  transition: border-color 0.2s;
}

/* ── FIX: mega sidebar header text clipping ── */
.li-mega-sidebar-header {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── FIX: mega panel animation on first display ── */
.li-mega-panel.active {
  animation: fadeInPanel 0.15s ease both;
}
@keyframes fadeInPanel {
  from { opacity: 0; transform: translateX(6px); }
  to   { opacity: 1; transform: none; }
}

/* ── FIX: mobile — hide the Ctrl+K hint ── */
@media (max-width: 768px) {
  .li-search-wrap::after {
    display: none !important;
  }
}