/* ======================================================================
   ECOSYSTEM BAR COMPONENT — Evident Technologies
   
   Styles for the shared DTV ecosystem navigation strip.
   Extracted from inline styles in ecosystem-bar.njk.
   ====================================================================== */

/* ── Desktop nav row ───────────────────────────────────────────────── */

.ev-nav-desktop {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

/* ── Apps menu container ───────────────────────────────────────────── */

.ev-eco-apps-wrapper {
  display: flex;
  align-items: center;
  gap: 0.375rem;
}

.ev-eco-apps-menu {
  position: relative;
}

/* ── Apps toggle button ────────────────────────────────────────────── */

.ev-eco-link--apps {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

/* ── Chevron rotation ──────────────────────────────────────────────── */

.ev-eco-link--apps .ev-eco-chevron {
  transition: transform 200ms;
}

.ev-eco-link--apps[aria-expanded="true"] .ev-eco-chevron {
  transform: rotate(180deg);
}

/* ── Dropdown panel (hidden by default, shown via JS) ──────────────── */

.ev-nav-dropdown[data-nav-apps-panel] {
  display: none;
}

/* ── Search panel input row ────────────────────────────────────────── */

.ev-search-input-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid rgb(255 255 255 / 6%);
}

/* ── Search icon ────────────────────────────────────────────────────── */

.ev-search-panel-icon {
  opacity: 0.4;
  flex-shrink: 0;
}

/* ── ESC keyboard hint ──────────────────────────────────────────────── */

.ev-search-esc-hint {
  font-size: 0.625rem;
  padding: 0.125rem 0.375rem;
  border-radius: 0.25rem;
  border: 1px solid rgb(255 255 255 / 10%);
  color: rgb(255 255 255 / 30%);
  flex-shrink: 0;
}

/* ── Search results container ──────────────────────────────────────── */

.ev-search-results {
  max-height: 20rem;
  overflow-y: auto;
  padding: 0.5rem;
}

/* ── Reduced motion ────────────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
  .ev-eco-link--apps .ev-eco-chevron {
    transition: none;
  }
}