/* ====================================================================
   DC Search — UI casuta de cautare (WordPress)
   Adaptat din website-final/_assets/search/dc-search.css.
   Suporta DOUA contexte:
     - .dc-search-box.dc-search--header  -> compact, inline in header (desktop)
     - .dc-search-box.dc-search--sidebar -> full-width, in sidebar (mobil + desktop)
   Dropdown-ul de rezultate e position:absolute sub input, z-index mare
   (apare peste continut si peste harta amanata).
   Paleta: accente #8e2b3e / #a32638; fundal alb usor transparent.
   ==================================================================== */

/* Containerul casutei: ancora de pozitionare pentru dropdown */
.dc-search-box {
  position: relative;
  box-sizing: border-box;
}
.dc-search-box *,
.dc-search-box *::before,
.dc-search-box *::after { box-sizing: border-box; }

/* Randul input + iconita lupa */
.dc-search-field {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}

.dc-search-icon {
  position: absolute;
  left: 12px;
  width: 18px;
  height: 18px;
  color: #8e2b3e;
  pointer-events: none;
  flex-shrink: 0;
}

.dc-search-input {
  width: 100%;
  padding: 10px 14px 10px 38px;
  border: 1.5px solid rgba(122, 100, 80, 0.28);
  border-radius: 22px;
  font-size: 14.5px;
  font-weight: 500;
  font-family: inherit;
  color: #2a1a10;
  background: rgba(255, 255, 255, 0.92);
  outline: none;
  transition: border-color 0.18s, background 0.18s, box-shadow 0.18s;
}
.dc-search-input::placeholder {
  color: rgba(90, 70, 52, 0.6);
  font-weight: 400;
}
.dc-search-input:focus {
  border-color: #8e2b3e;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(142, 43, 62, 0.12);
}

/* ====================================================================
   Dropdown rezultate — absolute sub input, deasupra a tot (z mare)
   ==================================================================== */
.dc-search-results {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  z-index: 100050; /* peste sidebar (100001), continut si harta amanata */
  background: #fff;
  border: 1px solid rgba(122, 100, 80, 0.18);
  border-radius: 14px;
  box-shadow: 0 14px 38px rgba(44, 36, 33, 0.18);
  overflow: hidden;
  max-height: min(70vh, 460px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.dc-search-results.dc-search-active { display: block; }

/* Categorie rezultate (mini-meniu): titlu mic deasupra fiecarui grup */
.dc-search-group + .dc-search-group { border-top: 1px solid rgba(122, 100, 80, 0.12); }
.dc-search-group-title {
  padding: 9px 14px 5px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #a3805f;
  background: rgba(248, 237, 224, 0.6);
}

.dc-search-empty {
  padding: 14px 16px;
  font-size: 13.5px;
  color: rgba(90, 70, 52, 0.85);
  font-style: italic;
  text-align: center;
}

/* Rand rezultat */
.dc-search-result {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  padding: 11px 14px;
  border-bottom: 1px solid rgba(122, 100, 80, 0.07);
  text-decoration: none;
  color: #2a1a10;
  background: transparent;
  transition: background 0.14s, color 0.14s;
  font-family: inherit;
}
.dc-search-result:last-child { border-bottom: none; }
.dc-search-result:hover,
.dc-search-result:focus {
  background: rgba(248, 237, 224, 0.9);
  color: #8e2b3e;
  outline: none;
}

.dc-search-result-icon {
  flex-shrink: 0;
  color: #8e2b3e;
  margin-top: 2px;
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.dc-search-result-text {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.dc-search-result-name {
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.3;
  word-wrap: break-word;
  color: inherit;
}
.dc-search-result-name mark {
  background: rgba(200, 165, 116, 0.45);
  color: inherit;
  padding: 0 1px;
  border-radius: 2px;
  font-weight: 700;
}

.dc-search-result-meta {
  font-size: 12.5px;
  font-weight: 500;
  color: rgba(90, 70, 52, 0.85);
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 2px;
}
.dc-search-price {
  font-weight: 700;
  color: #a32638;
}

/* ====================================================================
   CONTEXT 1 — HEADER (desktop): compact, latime limitata, inline
   ==================================================================== */
.dc-search--header {
  width: 220px;
  max-width: 34vw;
}
.dc-search--header .dc-search-input {
  padding-top: 9px;
  padding-bottom: 9px;
  font-size: 14px;
  background: rgba(255, 255, 255, 0.85);
}
/* Dropdown-ul din header se aliniaza la dreapta si nu se ingusteaza sub input */
.dc-search--header .dc-search-results {
  left: auto;
  right: 0;
  min-width: 300px;
  width: max(300px, 100%);
}

/* Pe MOBIL casuta din header RAMANE vizibila (ceruta de client), compacta.
   Pe mobil: .dc-header-right (CTA) e ascuns, iar .dc-burger e position:fixed
   (right:14px) -> lasam margin-right ca input-ul sa nu treaca pe sub hamburger.
   Se lateste la focus pentru tastare confortabila. */
@media (max-width: 781px) {
  /* font-size 16px pe TOATE input-urile de cautare = NU declanseaza zoom-ul automat
     al iOS Safari la focus (zoom-ul apare DOAR cand font-size < 16px). Pagina ramane fixa.
     !important: bate regulile mai specifice de 14px (header) / 15px (sidebar) / 14px (600px). */
  .dc-search-input { font-size: 16px !important; }

  /* STICKY: caseta search ramane vizibila la scroll (position:fixed), langa hamburgerul fix
     (.dc-burger e top:10px;right:14px;z-index:9999). Iese din fluxul header-ului. */
  .dc-search-box.dc-search--header {
    position: fixed;
    top: 10px;
    right: 64px;            /* la STANGA hamburgerului (right:14px, latime ~40px) */
    left: auto;
    z-index: 9998;          /* sub burger(9999) + sidebar(100001)/overlay(100000), peste continut */
    width: 116px;
    min-width: 116px;       /* latime de baza CONCRETA: tranzitia min-width interpoleaza px->px in AMBELE sensuri (altfel extinderea era BRUSCA: auto->232px nu se anima) */
    flex: none;
    max-width: none;
    margin: 0;
    border-radius: 22px;   /* umbra urmeaza forma pill-ului rotunjit (NU dreptunghi/chenar) */
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18); /* efect de plutire */
    transition: width 0.28s ease, min-width 0.28s ease; /* extindere/restrangere LINA (latimea reala e data de min-width) */
  }
  /* La focus, caseta se lateste pt tastare. Setam SI max-width (caseta are un clamp ascuns
     de max-width care altfel tine latimea la 116). !important garanteaza override-ul. */
  .dc-search-box.dc-search--header:focus-within {
    width: 210px !important;
    min-width: 210px !important;   /* min-width FORTEAZA latimea (width singur e blocat de flexbox) */
    max-width: calc(100vw - 80px) !important;
  }
  /* EXTINDERE LA SCROLL: cand pagina e derulata, caseta se mareste (~dublu) spre stanga.
     Sus (nescrollat) revine la 116px. dc-search.js pune clasa .dc-scrolled pe <html>. */
  html.dc-scrolled .dc-search-box.dc-search--header {
    width: 232px !important;
    min-width: 232px !important;   /* min-width FORTEAZA latimea reala (vezi mai sus) */
    max-width: calc(100vw - 80px) !important;
  }
  /* caseta nu mai e in flux => nu mai rezervam loc in header */
  .dc-header-inner { padding-right: 0; }
  /* Padding intern redus ca textul "Caută" sa incapa in caseta compacta (lupa lipita de text). */
  .dc-search--header .dc-search-input { padding: 8px 10px 8px 31px; }
  .dc-search--header .dc-search-icon { left: 9px; width: 16px; height: 16px; }
  /* Dropdown sub caseta fixed, aproape toata latimea, ancorat la dreapta */
  .dc-search--header .dc-search-results { width: calc(100vw - 24px); right: -50px; left: auto; min-width: 0; }
  /* Cand sidebar-ul e deschis, ascunde caseta fixed (altfel pluteste langa drawer) */
  body.dc-sidebar-open .dc-search-box.dc-search--header { display: none; }
}
@media (max-width: 360px) {
  .dc-search-box.dc-search--header { width: 104px; min-width: 104px; }
  .dc-search-box.dc-search--header:focus-within { width: min(172px, calc(100vw - 88px)); }
}

/* Umbra de plutire pe hamburger (vizibil mai ales pe mobil, unde e position:fixed).
   .dc-burger e definit in style.css; dc-search.css se incarca DUPA -> aceasta castiga. */
.dc-burger { box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18); }

/* ====================================================================
   CONTEXT 2 — SIDEBAR: full-width, cu separator jos
   Se aseaza in interiorul #dc-sidebar (sub header-ul de sidebar).
   ==================================================================== */
.dc-search--sidebar {
  width: 100%;
  margin: 4px 0 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(122, 100, 80, 0.12);
}
.dc-search--sidebar .dc-search-input {
  font-size: 15px;
  background: rgba(253, 246, 236, 0.96);
}
/* In sidebar dropdown-ul ramane IN FLUX (position:static) sub input — altfel ar fi
   CLIPAT de overflow-y:auto al sidebar-ului (#dc-sidebar). Curge in document si
   impinge continutul nav-ului in jos (sidebar-ul are deja scroll). */
.dc-search--sidebar .dc-search-results {
  position: static;
  margin-top: 8px;
  width: 100%;
  min-width: 0;
  max-height: calc(100vh - 230px);
  box-shadow: 0 6px 18px rgba(44, 36, 33, 0.12);
}

/* ====================================================================
   Mobile fine-tuning
   ==================================================================== */
@media (max-width: 600px) {
  .dc-search-input { font-size: 14px; padding: 10px 12px 10px 36px; }
  .dc-search-result { padding: 10px 12px; }
  .dc-search-result-name { font-size: 14px; }
}

/* Deep-link la cardurile de pe paginile „despre" (#dct-...): lasa loc pt header la scroll */
.dc-card[id] { scroll-margin-top: 90px; }

/* ====================================================================
   STICKY pe DESKTOP (>=782px): la scroll, caseta search + hamburgerul
   raman vizibile, plutind sus-dreapta (headerul e non-sticky si dispare).
   Foloseste clasa html.dc-scrolled pusa de dc-search.js (activa pe orice device).
   La inceput (nescrollat) raman in randul normal al headerului.
   ==================================================================== */
@media (min-width: 782px) {
  html.dc-scrolled .dc-search-box.dc-search--header {
    position: fixed;
    top: 12px;
    right: 70px;            /* la stanga hamburgerului fixed */
    left: auto;
    z-index: 9998;
    width: 260px;
    max-width: calc(100vw - 96px);
    margin: 0;
    border-radius: 22px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
  }
  html.dc-scrolled .dc-search-box.dc-search--header .dc-search-input {
    background: rgba(255, 255, 255, 0.96);
  }
  html.dc-scrolled .dc-burger {
    position: fixed;
    top: 12px;
    right: 16px;
    left: auto;
    z-index: 9999;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
  }
}