/* =====================================================================
hotel.css — pagina unei unități (hotel.php): galerie foto, antet
(nume/stele/adresă), listă de tarife și secțiuni de text (descriere,
detalii, facilități). Se încarcă după css/common.css și css/rezultate.css
(de-acolo se refolosesc .results-layout/.results-sidebar/.map-placeholder/
.unit-address/.stars — sidebar-ul cu cartușul de căutare + harta e identic
cu cel din cautare.php).
===================================================================== */
.hotel-page{ padding:22px 0 56px; }
/* fără asta, un rând de poze mici mai lat decât coloana (vezi .hotel-gallery-thumbs
mai jos) forța coloana grid "1fr" a .results-main să se lărgească după conținut
(comportamentul implicit min-width:auto al elementelor de grid) — pagina se lărgea
peste viewport în loc ca .hotel-gallery-thumbs să deruleze intern, cum trebuia */
.results-main{ min-width:0; }
.hotel-not-found{ text-align:center; padding:60px 0; display:flex; flex-direction:column; align-items:center; gap:14px; }
.hotel-not-found p{ color:var(--ink-soft); }
/* ---------- galerie ---------- */
.hotel-gallery-main-wrap{ position:relative; }
.hotel-gallery-main{
width:100%; height:clamp(220px, 42vw, 420px); border-radius:var(--radius-md);
overflow:hidden; background:var(--mist);
}
.hotel-gallery-main img, .hotel-gallery-main svg{ width:100%; height:100%; object-fit:cover; display:block; }
/* săgețile de pe poza mare refolosesc .carousel-nav/.carousel-prev/.carousel-next
din rezultate.css (aceleași butoane rotunde, poziționate absolut peste poză) */
.hotel-gallery-thumbs-row{ display:flex; align-items:center; gap:6px; margin-top:10px; min-width:0; }
.hotel-gallery-thumbs-row[hidden]{ display:none; }
.thumbs-scroll{
flex:0 0 auto; width:26px; height:26px; border-radius:50%; border:1.5px solid var(--line);
background:#fff; color:var(--primary); font-weight:700; display:flex; align-items:center; justify-content:center;
}
.thumbs-scroll:hover{ border-color:var(--primary); color:var(--primary-dark); }
.hotel-gallery-thumbs{
display:flex; gap:8px; overflow-x:auto; scroll-behavior:smooth; padding-bottom:2px;
-webkit-overflow-scrolling:touch; min-width:0; flex:1 1 auto;
}
.hotel-gallery-thumbs button{
flex:0 0 auto; width:74px; height:56px; border-radius:var(--radius-sm); overflow:hidden;
border:2px solid transparent; padding:0; background:var(--mist); opacity:.7;
}
.hotel-gallery-thumbs button img{ width:100%; height:100%; object-fit:cover; display:block; }
.hotel-gallery-thumbs button:hover{ opacity:1; }
.hotel-gallery-thumbs button.active{ border-color:var(--accent); opacity:1; }
/* ---------- antet unitate ---------- */
.hotel-title-row{ margin-top:20px; }
.hotel-name-row{ display:flex; align-items:baseline; flex-wrap:wrap; gap:10px; }
.hotel-name-row h1{ font-size:clamp(1.3rem, 3.2vw, 1.9rem); }
.hotel-name-row .stars{ margin-bottom:0; font-size:.95rem; }
.hotel-title-row .unit-address{ margin-top:6px; font-size:.86rem; }
.hotel-apropiere-btn{ margin-top:12px; }
/* ---------- secțiuni generice (tarife / descriere / detalii / facilități) ---------- */
.hotel-section{ margin-top:28px; padding-top:22px; border-top:1px solid var(--line); }
.hotel-section h2{ font-size:1.15rem; margin-bottom:14px; }
/* NU white-space:pre-line aici — textul e deja trecut prin nl2br() în PHP (fiecare
linie nouă e deja un
real); pre-line ar interpreta ȘI caracterul \n rămas
după
, dublând vizual fiecare linie goală (2
-> spațiu cât 3-4 rânduri) */
.hotel-text{ color:var(--ink); line-height:1.65; }
/* ---------- tarife ---------- */
.hotel-rates-note{ color:var(--ink-soft); font-size:.9rem; }
/* cartușul de selectare a perioadei — reutilizează .sc-field/.date-field/.date-btn/
.calendar-panel/.cal-* din common.css (aceleași stiluri ca-n bara laterală); doar
lățimea câmpurilor de dată e specifică aici (în bara laterală vine din .sc-row-dates,
pe care acest formular nu îl are) */
.hotel-recheck-dates{
display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap;
background:var(--mist); border:1px solid var(--line); border-radius:var(--radius-sm);
padding:12px 14px; margin-bottom:18px;
}
.hc-date-field{ flex:0 1 160px; min-width:140px; margin-top:0; }
/* la fel ca #checkoutCalendar în bara laterală (common.css) — fără asta, calendarul de
Plecare (280px lățime) poate ieși din ecran pe dreapta, fiindcă acest câmp nu mai stă
mereu lângă marginea din stânga a rândului, cum stătea în bara laterală îngustă */
#hcCheckoutCalendar{ left:auto; right:0; }
/* câmpul „Camere / ocupare" al cartușului de re-căutare — buton scurt (rezumat text) +
panou tip .calendar-panel (aceeași clasă, ca hcToggleCalendar()/click-în-afară din
common.js să-l închidă la fel ca pe calendare), doar puțin mai lat (camere_fields au
nevoie de mai mult spațiu decât o grilă de calendar) */
.hc-camere-field{ flex:0 1 200px; min-width:160px; margin-top:0; }
#hcCamereBtn{ text-align:left; white-space:normal; line-height:1.25; }
.hc-camere-panel{ width:320px; right:0; left:auto; }
.hc-camere-panel .roomcount-field{ max-width:none; margin-bottom:10px; }
/* #roomBlocks (bara laterală) e stilat direct pe ID în common.css — #hcRoomBlocks e
widget-ul propriu al acestui formular (variabilă JS separată, hcRooms), are nevoie de
aceeași regulă, repetată pe propriul ID */
#hcRoomBlocks{ display:flex; flex-direction:column; gap:10px; margin-top:12px; }
.rate-list{ display:flex; flex-direction:column; gap:10px; }
/* regula generală [hidden]{display:none!important} e în css/common.css (comun tuturor
paginilor) — acoperă și .rate-row/.rate-list/.rate-toggle-btn de-aici, fără să mai fie
nevoie de o excepție separată pe fiecare selector cu display propriu */
/* „Mai multe oferte” / „Vezi toate ofertele” (admin) — vezi js/hotel.js
(hotelToggleMaiMulte()/hotelToggleOferteBrute()) */
.rate-toggle-btn{ margin-top:10px; }
.rate-toggle-admin{ margin-left:10px; border-style:dashed; } /* vizual distinct — doar SUNT_ADMIN */
/* rând de tarif, pe grid (nu flex) ca să putem rearanja info/preț/buton pe breakpoint-uri
fără să duplicăm marcajul — vezi cele două media query-uri de mai jos */
.rate-row{
display:grid;
grid-template-columns: 1fr auto;
grid-template-areas: "info price" "btn btn";
align-items:center;
gap:8px 14px;
border:1px solid var(--line); border-radius:var(--radius-sm); padding:12px 14px;
}
.rate-info{ grid-area:info; display:flex; flex-direction:column; gap:2px; min-width:0; }
.rate-name{ font-weight:700; color:var(--primary-dark); font-size:.92rem; }
.rate-meal{ font-size:.78rem; color:var(--ink-soft); }
.rate-price{
grid-area:price; justify-self:end;
font-family:var(--font-display); font-size:1.1rem; font-weight:600; color:var(--primary-deep);
white-space:nowrap;
}
/* butonul „Rezervă" e acum într-un