/* =============================================================================
   BARA DE CAUTARE PLUTITOARE

   Acelasi formular ca pe prima pagina, lipit de marginea de jos a ecranului, pe
   paginile de categorie, regiune, zona, ghid si evenimente. Se vede de cum se
   deschide pagina.

   Fundal inchis, cu formularul in varianta `hero` — cea facuta pentru fundaluri
   inchise, cu text alb si campuri translucide.

   Doua infatisari:
     • ecran lat  — bara e desfacuta, cu toate campurile pe un rand;
     • ecran ingust — un buton rotunjit; formularul se ridica peste continut abia
       la atingere. Desfacut permanent ar acoperi jumatate din ecranul unui
       telefon.
   ========================================================================== */

/* Loc sub subsol cat tine bara, altfel ultimul rand ramane sub ea.
   Se pune pe subsol, nu pe `body`: `body` are fundalul paginii, iar un gol alb
   sub subsolul inchis ar arata a greseala. Clasa vine din layout, doar pe
   paginile care chiar au bara. */
.has-float-search .site-footer { padding-bottom: 112px; }

.bt-float {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 900;                 /* sub sertarul mobil (1000) si sub modale */
    display: flex;
    justify-content: center;
    padding: 0 20px calc(18px + env(safe-area-inset-bottom, 0px));
    pointer-events: none;         /* doar bara prinde clicuri, nu si golul */
}

.bt-float-panel {
    position: relative;
    width: 100%;
    max-width: 1080px;
    pointer-events: auto;
    padding: 6px 8px;
    border-radius: 20px;
    background: rgba(15, 23, 42, .93);
    border: 1px solid rgba(255, 255, 255, .12);
    box-shadow: 0 20px 55px rgba(0, 0, 0, .35);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

/* ---------- Inaltimea, stransa la ~60% fata de formularul de pe home ----------
   Bara sta permanent peste continut, deci fiecare pixel de inaltime e luat de la
   pagina. Se strang toate cele trei straturi de spatiere — panoul, randul si
   campurile — plus marimea textului; numai asa scade cu adevarat, altfel
   ramane inaltimea data de stratul neatins.

   Regulile sunt legate de `.bt-float-panel`, deci formularul din hero-ul primei
   pagini ramane cum e. */
.bt-float-panel .bt-search-inner {
    gap: 6px;
    padding: 4px;
    border-radius: 16px;
}
.bt-float-panel .bt-search-field {
    gap: 1px;
    padding: 6px 14px;
    border-radius: 13px;
}
.bt-float-panel .bt-search-label {
    font-size: 11px;
    line-height: 1.15;
}
.bt-float-panel .bt-search-control { gap: 8px; }
.bt-float-panel .bt-search-control input,
.bt-float-panel .bt-search-control select {
    font-size: 14px;
    line-height: 1.35;
}
.bt-float-panel .bt-search-icon  { font-size: 13px; }
.bt-float-panel .bt-search-caret { font-size: 12px; }
.bt-float-panel .bt-search-submit {
    min-width: 54px;
    padding: 0 20px;
    border-radius: 13px;
    font-size: 15px;
}

/* Varianta `hero` isi pune singura un strat translucid si o rama; peste fundalul
   inchis al barii ar iesi doua suprafete una in alta. Aici suprafata e bara. */
.bt-float-panel .bt-search--hero .bt-search-inner {
    background: transparent;
    border: 0;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
.bt-float-panel .bt-search { margin: 0; }

/* Butonul strans si X-ul de inchidere — amandoua doar pe ecran ingust. Pe ecran
   lat bara e mereu desfacuta, deci n-are nici ce deschide, nici ce inchide. */
.bt-float-pill { display: none; }
.bt-float-close { display: none; }

@media (max-width: 860px) {
    /* Strans, butonul e mai scund decat bara desfacuta de pe ecran lat */
    .has-float-search .site-footer { padding-bottom: 86px; }

    .bt-float {
        flex-direction: column;
        align-items: center;
        gap: 10px;
        padding: 0 14px calc(14px + env(safe-area-inset-bottom, 0px));
    }

    .bt-float-pill {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        pointer-events: auto;
        padding: 13px 26px;
        border: 0;
        border-radius: 999px;
        background: #ff7a00;
        color: #fff;
        font: inherit;
        font-size: 15px;
        font-weight: 700;
        cursor: pointer;
        box-shadow: 0 12px 30px rgba(255, 122, 0, .35);
    }
    .bt-float-pill:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }

    /* Panoul apare doar desfacut; strans nu ocupa loc si nu prinde atingeri. */
    .bt-float-panel {
        display: none;
        padding: 14px;
        border-radius: 22px;
        max-height: 70vh;
        overflow-y: auto;
    }
    .bt-float.is-open .bt-float-panel { display: block; }
    .bt-float.is-open .bt-float-pill  { display: none; }

    /* X-ul sta pe acelasi rand cu „Cauta", la dreapta lui. Butonul de cautare
       ocupa restul randului: din `1 1 100%` devine `1 1 auto`, altfel ar cere
       singur toata latimea si X-ul ar cadea dedesubt. */
    .bt-float-panel .bt-search-submit { flex: 1 1 auto; }

    .bt-float-close {
        display: flex;
        flex: 0 0 auto;
        align-items: center;
        justify-content: center;
        /* Aceeasi inaltime, aceeasi rotunjire si acelasi decalaj ca butonul de
           langa el — vezi `.bt-search-submit` la aceeasi latime de ecran. */
        width: 54px;
        height: 54px;
        margin-top: 4px;
        padding: 0;
        border: 1px solid rgba(255, 255, 255, .18);
        border-radius: 13px;
        background: rgba(255, 255, 255, .08);
        color: #fff;
        font-size: 17px;
        line-height: 1;
        cursor: pointer;
        transition: background .2s ease, border-color .2s ease;
    }
    .bt-float-close:hover,
    .bt-float-close:active {
        background: rgba(255, 255, 255, .18);
        border-color: rgba(255, 255, 255, .35);
    }
    .bt-float-close:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
}