/* ===== Platforma de check-in — design system v2 ===== */
:root {
  --bg: #f6f5f1;          /* hartie calda (S1) */
  --bg-2: #edebe5;
  --card: #ffffff;
  --ink: #101a20;         /* cerneala siglei */
  --ink-2: #5b6879;
  --line: #dfe5e3;
  --line-2: #cdd6d2;

  --brand: #0a4534;       /* verdele adanc din sigla — butoane, accente */
  --brand-2: #08392b;     /* hover / apasat */
  --brand-3: #0f6b4f;     /* accent mediu, focus */
  --mint: #7fd4b0;        /* menta siglei — DOAR pe suprafete inchise */
  --bar: #131c18;         /* bara de sus: cerneala verde-neagra (sigla: 9,9:1) */
  --brand-soft: #e2efe9;
  --brand-ghost: #f2f8f5;

  --gold: #c99441;
  --gold-soft: #f9efdd;

  --error: #b3261e;
  --error-soft: #fdecea;
  --ok: #1e6b3a;
  --ok-soft: #e6f4ea;
  --warn-ink: #8a5a10;
  --warn-soft: #fdf3e3;
  --warn-line: #ecd6a8;

  --radius: 14px;
  --radius-sm: 9px;
  --shadow: 0 1px 2px rgba(22, 34, 43, .06), 0 6px 24px rgba(22, 34, 43, .07);
  --shadow-lg: 0 2px 6px rgba(22, 34, 43, .08), 0 18px 48px rgba(22, 34, 43, .12);
  --grad-brand: linear-gradient(135deg, #0c4a39 0%, #0a4534 100%);
  --grad-btn: linear-gradient(180deg, #0d503e 0%, #0a4534 100%);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial,
    "Noto Sans", sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: var(--ink);
  background: var(--bg);
}
.container { max-width: 780px; margin: 0 auto; padding: 0 18px; }
.container.wide { max-width: 1120px; }
main.container { padding-top: 28px; padding-bottom: 56px; min-height: 62vh; }
h1 { font-size: 26px; line-height: 1.25; letter-spacing: -.015em; margin: 8px 0 16px; }
h2 { font-size: 19px; letter-spacing: -.01em; margin: 0 0 12px; }
h3 { font-size: 16px; margin: 20px 0 8px; }
.lead { color: var(--ink-2); margin-top: -8px; font-size: 16.5px; }
.muted-text { color: var(--ink-2); font-size: 14px; }
.small { font-size: 13px; }
.center { text-align: center; }
/* --- Bara de sus --- */
.topbar {
  background: var(--bar);
  color: #fff;
  position: relative;
}
.topbar-inner { display: flex; align-items: center; justify-content: space-between; min-height: 60px; gap: 12px; position: relative; z-index: 1; }
/* Spatiul liber cerut de manualul marcii: cel putin o patrime din latura
   patratului (26px / 4 ≈ 7px) — de aceea gap-ul nu scade sub atat. */
.brand { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 17.5px; color: #fff; text-decoration: none; letter-spacing: -.01em; }
.brand-logo { display: block; flex: none; }
/* Wordmark in doua tonuri pe fundal inchis: „Easy" alb, „Check" menta. */
.brand-name .bn-1 { color: #fff; }
.brand-name .bn-2 { color: #7fd4b0; }
.topnav { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.topnav a {
  color: #fff; text-decoration: none; padding: 7px 12px; border-radius: 8px; font-size: 15px;
  transition: background .15s ease;
}
.topnav a:hover { background: rgba(255, 255, 255, .14); }
.topnav a.cta {
  background: var(--mint); color: var(--ink); font-weight: 800;
}
.topnav a.cta:hover { background: #97e0c2; color: var(--ink); }
.topnav a.lang { font-weight: 700; opacity: .7; }
.topnav a.lang.on { opacity: 1; background: rgba(255, 255, 255, .18); }
/* Comutatorul de limba de pe fluxul oaspetelui: butoane adevarate, cu numele
   limbii scris intreg. Limba CURENTA e butonul plin, cealalta are chenar gros
   (cerinta operatorului, 11.09.2026). Stingerea la 0,7 de mai sus, pastrata pe
   paginile publice, facea din limba spre care ai vrea sa treci un buton care
   arata stricat, adica exact butonul pe care oaspetele trebuie sa-l apese. */
.topnav a.lang-btn {
  font-weight: 700; padding: 6px 12px; line-height: 1.2; border-radius: 999px;
  border: 2px solid rgba(255, 255, 255, .62);
}
.topnav a.lang-btn:hover { background: rgba(255, 255, 255, .2); }
.topnav a.lang-btn.on { background: #fff; color: var(--ink); border-color: #fff; }
.topnav a.lang-btn.on:hover { background: #fff; color: var(--ink); }
/* --- Subsol --- */
.footer { border-top: 1px solid var(--line); padding: 16px 0 20px; color: var(--ink-2); font-size: 14px; background: rgba(255, 255, 255, .45); }
.footer a { color: var(--ink-2); }
/* Centrate: randul de legaturi statea la stanga, in timp ce randul de sub el
   (SAL / firma / NETOPIA) e distribuit pe toata latimea — de aici senzatia
   de subsol strambat. (semnalat de operator, 23.08.2026) */
.footer-links { display: flex; gap: 6px 22px; flex-wrap: wrap; margin-bottom: 6px;
  justify-content: center; text-align: center; }
.footer-links a { text-decoration: none; font-weight: 600; }
.footer-links a:hover { color: var(--brand); text-decoration: underline; }
.footer-company { font-size: 12.5px; color: #7b8794; line-height: 1.5; }
/* Subsolul, pe trei coloane: SAL stanga, firma la mijloc, NETOPIA dreapta
   (13.08.2026). Inainte, patru benzi una sub alta, aliniate la stanga —
   246 px de subsol pentru continut care incape pe doua randuri. */
.footer-cols { display: flex; align-items: center; justify-content: space-between;
  gap: 14px 32px; flex-wrap: wrap; margin: 8px 0; }
.footer-sal { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.footer-cols .footer-company { text-align: center; line-height: 1.6; }
.footer-sal svg { display: block; }
.footer-pay { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.footer-pay .small { line-height: 1.2; }
/* Paginile de oaspete n-au cele trei coloane: acolo raman un link si randul
   firmei, care stateau lipite de marginea din stanga a unui container mai lat
   decat fisa de deasupra. Subsolul tine latimea paginii si se centreaza sub
   ea (semnalat pe viu, 20.08.2026). */
.footer-simplu .footer-company { text-align: center; }
@media (max-width: 700px) {
/* pe telefon coloanele se aseaza una sub alta, toate la stanga */
.footer-cols { justify-content: flex-start; }
.footer-pay { align-items: flex-start; }
.footer-cols .footer-company { text-align: left; }
}
/* --- Carduri --- */
.card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 26px;
  margin-bottom: 22px;
}
/* --- Formulare --- */
label { display: block; font-weight: 600; font-size: 14px; margin-bottom: 4px; color: #26313c; }
.hint { font-weight: 400; color: var(--ink-2); }
.req { color: var(--error); }
input[type=text], input[type=date], input[type=email], input[type=tel], input[type=url],
input[type=password], input[type=number], input[type=search], input[type=month], select, textarea {
  width: 100%; padding: 11px 13px; font-size: 16px; color: var(--ink);
  border: 1px solid var(--line-2); border-radius: var(--radius-sm);
  background: #fcfdfc; font-family: inherit;
  transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
input[type=file] { width: 100%; font-size: 14px; padding: 8px 0; }
textarea { min-height: 84px; resize: vertical; }
input:focus, select:focus, textarea:focus {
  outline: none; border-color: var(--brand-3); background: #fff;
  box-shadow: 0 0 0 3.5px rgba(23, 131, 106, .16);
}
.field { margin-bottom: 16px; }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
/* Doua campuri pe acelasi rand se aliniaza la CASETE, nu la etichete: cand
   eticheta din stanga are un rand de lamurire in plus (e-mailul are, telefonul
   nu), caseta vecina statea mai sus si randul parea stramb (semnalat pe viu,
   21.08.2026). Celulele grilei au aceeasi inaltime din oficiu; impingem
   continutul celulei mai scurte la BAZA ei, iar casetele — ultimul lucru din
   fiecare eticheta — ajung pe aceeasi linie. Nu umblam INAUNTRUL etichetei
   (o coloana flex acolo ar rupe steluta obligatoriului pe rand propriu). */
.grid2 > .field, .grid3 > .field, .grid4 > .field {
  display: flex; flex-direction: column; justify-content: flex-end;
}
.grid3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0 18px; }
@media (max-width: 620px) {
.grid2, .grid3, .grid4 { grid-template-columns: 1fr; }
}
/* Campurile inactive se vad ca atare: fond gri, text sters — altfel o valoare
   care nu se aplica (cota TVA la neplatitori) pare in vigoare. */
input:disabled, select:disabled, textarea:disabled {
  background: var(--bg-2); color: var(--ink-2); border-color: var(--line);
  cursor: not-allowed; opacity: .75;
}
.checkline { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; font-size: 15px; margin-bottom: 8px; }
.checkline input { margin-top: 3px; flex-shrink: 0; width: 18px; height: 18px; accent-color: var(--brand); }
/* --- Butoane --- */
.btn {
  display: inline-block; padding: 12px 22px; font-size: 15.5px; font-weight: 700;
  color: #fff; background: var(--grad-btn); border: 1px solid var(--brand-2);
  border-radius: 10px; cursor: pointer; text-decoration: none; text-align: center;
  font-family: inherit; letter-spacing: .01em;
  box-shadow: 0 1px 2px rgba(10, 69, 52, .3), 0 4px 14px rgba(10, 69, 52, .18);
  transition: transform .12s ease, box-shadow .15s ease, filter .15s ease;
}
.btn:hover { filter: brightness(1.06); transform: translateY(-1px); box-shadow: 0 2px 4px rgba(10, 69, 52, .3), 0 8px 22px rgba(10, 69, 52, .22); }
.btn:active { transform: translateY(0); }
.btn.secondary {
  background: #fff; color: var(--brand-2); border-color: var(--line-2); box-shadow: 0 1px 2px rgba(22, 34, 43, .07);
}
.btn.secondary:hover { background: var(--brand-ghost); filter: none; }
.btn.sm { padding: 7px 14px; font-size: 14px; border-radius: 8px; }
.btn.block { display: block; width: 100%; }
.btn[disabled] { opacity: .55; cursor: not-allowed; transform: none; }
.actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 20px; align-items: center; }
/* Un formular de un singur buton, asezat CHIAR IN RANDUL textului: „iesiti" din
   mesajul de pe suport a devenit formular (iesirea cu destinatie cere POST cu
   jeton), iar propozitia trebuie sa curga ca inainte. Butonul are infatisarea
   unei legaturi, dar ramane buton: e o actiune, nu o navigare. Marimea minima
   de atins ramane a randului, ca la orice legatura din text. */
.form-inline { display: inline; }
.btn-link {
  -webkit-appearance: none; appearance: none; background: none; border: 0;
  padding: 0; margin: 0; font: inherit; color: inherit;
  text-decoration: underline; cursor: pointer;
}
.btn-link:hover { text-decoration: none; }
.btn-link:focus-visible { outline: 2px solid var(--brand-3); outline-offset: 2px; }
/* --- Alerte --- */
.alert { padding: 13px 16px; border-radius: 10px; margin-bottom: 16px; font-size: 15px; border: 1px solid; border-left-width: 4px; }
.alert-error { background: var(--error-soft); color: var(--error); border-color: #f2c3bf; border-left-color: var(--error); }
/* Randul care spune ca nu s-a pierdut nimic la schimbarea limbii (11.09.2026).
   Nu e o alerta: nu s-a intamplat nimic rau, doar se spune de ce acordurile de
   mai jos au ramas nebifate. De aceea ton linistit, nu rosu. */
.ci-draft-note {
  margin-bottom: 16px; padding: 11px 14px; font-size: 14.5px;
  background: var(--brand-ghost); color: var(--ink-2);
  border: 1px solid var(--brand-soft); border-radius: var(--radius-sm);
}
/* --- Tabele --- */
.table-wrap { overflow-x: auto; border-radius: var(--radius-sm); }
table.list { width: 100%; border-collapse: collapse; font-size: 14.5px; }
table.list th, table.list td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
table.list th { font-size: 12.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-2); background: #f7f9f7; }
table.list tr:hover td { background: var(--brand-ghost); }
table.list a { color: var(--brand); font-weight: 700; text-decoration: none; }
table.list a:hover { text-decoration: underline; }
/* --- Definiții (detalii fișă) --- */
/* minmax(0, ...), nu 1fr simplu: minimul unei piste „1fr" e min-content, iar
   o valoare lunga si fara spatii (un e-mail de 70 de caractere, o adresa
   intreaga) umfla coloana peste ecran si trage toata pagina la scroll
   orizontal. Perechea obligatorie e ruperea cuvantului: fara ea, textul iese
   oricum din casuta (gasit pe fisa unui oaspete strain, 19.09.2026). */
dl.detail { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 7px 16px; margin: 0; }
dl.detail dt { font-weight: 600; font-size: 14px; color: var(--ink-2); }
dl.detail dd { margin: 0; }
dl.detail dt, dl.detail dd { overflow-wrap: anywhere; }
@media (max-width: 620px) {
dl.detail { grid-template-columns: minmax(0, 1fr); }
dl.detail dt { margin-top: 8px; }
}
/* --- Semnătură --- */
.sig-wrap {
  border: 1.5px dashed var(--line-2); border-radius: var(--radius-sm); background: #fff; position: relative;
  transition: border-color .15s ease;
}
.sig-wrap:hover { border-color: var(--brand-3); }
.sig-wrap canvas { display: block; width: 100%; height: 180px; border-radius: var(--radius-sm); touch-action: none; cursor: crosshair; }
.sig-placeholder {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 8px;
  color: #b6c0bc; font-size: 15px; pointer-events: none; font-style: italic;
}
.sig-tools { margin-top: 8px; }
/* --- Login / auth --- */
.login-card { max-width: 430px; margin: 52px auto; }
/* --- Statistici --- */
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 14px; margin-bottom: 22px; }
.stat {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 16px 18px; box-shadow: var(--shadow); position: relative; overflow: hidden;
}
.stat::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
  background: linear-gradient(180deg, var(--brand-3), var(--brand-2));
  border-radius: 4px 0 0 4px;
}
.stat .n {
  font-size: 28px; font-weight: 800; line-height: 1.2; letter-spacing: -.02em;
  background: linear-gradient(135deg, var(--brand-3), var(--brand-2));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.stat .l { font-size: 13px; color: var(--ink-2); }
/* --- Text juridic --- */
.legal h2 { margin-top: 26px; }
.legal p, .legal li { font-size: 15px; }
.ghid-article h2 { margin-top: 28px; }
.ghid-article p, .ghid-article li { font-size: 15px; }
.ghid-article table.list { margin: 14px 0; }
.ghid-rezumat {
  background: var(--brand-ghost); border-left: 4px solid var(--brand);
  border-radius: 8px; padding: 14px 18px; margin: 16px 0 22px;
}
.ghid-rezumat p { margin: 0; font-weight: 600; }
.ghid-toc {
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  padding: 14px 18px; margin: 0 0 22px; max-width: 420px;
}
.ghid-toc-title { margin: 0 0 8px; font-weight: 700; font-size: 13.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--brand-2); }
.ghid-toc ul { margin: 0; padding: 0; list-style: none; }
.ghid-toc li { margin: 4px 0; }
.ghid-faq-title { margin-top: 32px; }
.ghid-faq details { border-bottom: 1px solid var(--line); padding: 12px 0; }
.ghid-faq summary { cursor: pointer; font-weight: 600; }
.ghid-faq p { margin: 10px 0 0; }
/* „Citește și": articolele înrudite ca pastile, nu ca text subliniat
   (cerința operatorului, 03.09.2026). Blocul îl construiește app/ghid.php
   din paragraful cu linkuri, la randare — nimic de schimbat în articole. */
.ghid-citeste {
  margin: 30px 0 8px; padding: 16px 18px;
  background: var(--brand-ghost); border: 1px solid var(--line); border-radius: var(--radius-sm);
}
.ghid-citeste-titlu {
  margin: 0 0 10px; font-weight: 700; font-size: 13.5px; text-transform: uppercase;
  letter-spacing: .06em; color: var(--brand-2);
}
.ghid-citeste-lista { display: flex; flex-wrap: wrap; gap: 8px; }
.ghid-citeste-lista a {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 14px; border-radius: 999px;
  background: var(--card); color: var(--brand); border: 1px solid #bcd8cd;
  font-size: 14px; font-weight: 600; line-height: 1.3;
  text-decoration: none; transition: background .15s, color .15s, border-color .15s;
}
.ghid-citeste-lista a::after { content: "\2192"; font-weight: 400; }
.ghid-citeste-lista a:hover, .ghid-citeste-lista a:focus-visible {
  background: var(--brand); color: #fff; border-color: var(--brand); text-decoration: none;
}
/* Linkurile de AFILIERE si dezvaluirea lor (18.09.2026). Linkul se marcheaza
   singur in parser (rel="sponsored"), iar nota apare automat sub corpul
   articolului: amandoua stau in cod, nu in textul scris de mana, ca sa nu se
   uite la al doilea articol. Nota ramane discreta: e o obligatie legala, nu
   un mesaj de vanzare. */
.ghid-corp a.link-afiliere::after {
  content: "\2197"; font-size: .85em; margin-left: 3px; opacity: .7;
}
.ghid-afiliere {
  margin: 18px 0 0; padding: 10px 14px;
  background: var(--brand-ghost); border: 1px solid var(--line); border-radius: var(--radius);
  color: var(--ink-2); font-size: 13px; line-height: 1.5;
}
/* Atributul hidden invinge ORICE display din clase (.btn etc.) — fara asta,
   un buton ascuns din JS ramane pe ecran pentru ca .btn ii forteaza display. */
[hidden] { display: none !important; }
.step {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 22px; box-shadow: var(--shadow); position: relative;
}
.step .num {
  width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: var(--grad-brand); color: #fff; font-weight: 800; font-size: 16px; margin-bottom: 10px;
  box-shadow: 0 3px 8px rgba(10, 69, 52, .3);
}
.step h3 { margin: 0 0 6px; font-size: 15.5px; }
.step p { margin: 0; font-size: 14px; color: var(--ink-2); }
.fisa-unit { font-size: 13px; text-align: left; margin-bottom: 14px; line-height: 1.4; }
.fisa-ref { font-size: 12px; color: var(--ink-2); text-align: right; }
table.fisa-grid { width: 100%; border-collapse: collapse; margin: 12px 0; }
table.fisa-grid th, table.fisa-grid td { border: 1px solid #9aa4b5; padding: 7px 9px; text-align: left; font-size: 13.5px; }
table.fisa-grid th { background: #f0f3f7; font-weight: 600; width: 38%; }
.fisa-sig-row { display: flex; justify-content: space-between; gap: 24px; margin-top: 22px; }
.fisa-sig { flex: 1; text-align: center; }
.fisa-sig .line { border-bottom: 1px solid var(--ink); min-height: 64px; display: flex; align-items: flex-end; justify-content: center; }
.fisa-sig img { max-height: 64px; max-width: 220px; }
.fisa-sig .cap { font-size: 12px; color: var(--ink-2); margin-top: 4px; }
@media print {
@page { margin: 0; size: A4; }
/* Marginea 0 a paginii lasa browserul FARA loc pentru antetele lui
     (data/ora sus, URL-ul jos) — documentele ies curate, ca dintr-un soft de
     facturare. Marginile vizuale le da fiecare .fisa, deci se pastreaza si la
     tiparirea mai multor fise, pagina cu pagina. */
body { background: #fff; }
.topbar, .tabbar, .footer, .no-print, .alert, .skip { display: none !important; }
main.container { padding: 0; max-width: 100%; }
}
.auth-head { display: flex; justify-content: center; margin: -4px 0 8px; }
.auth-head svg { width: 128px; height: auto; }
.done-art { display: flex; justify-content: center; margin: 4px 0 10px; }
.done-art svg { width: 190px; height: auto; }
/* --- Autentificare cu Google --- */
.btn.google {
  background: #fff; color: #3c4043; border: 1px solid var(--line-2);
  display: flex; align-items: center; justify-content: center; gap: 10px;
  box-shadow: 0 1px 2px rgba(22, 34, 43, .08);
}
.btn.google:hover { background: #f7f9fc; filter: none; }
.or-sep {
  display: flex; align-items: center; gap: 12px; margin: 16px 0;
  color: var(--ink-2); font-size: 13px;
}
.or-sep::before, .or-sep::after { content: ""; flex: 1; height: 1px; background: var(--line); }
/* ===== Reparatii CSP + accesibilitate (audit UX) ===== */
/* Utilitare care inlocuiesc stilurile inline blocate de CSP (style-src 'self') */
.u-upper {text-transform:uppercase}
.u-m0 {margin:0}
/* Focus vizibil la navigarea cu tastatura */
:where(a,button,summary,[tabindex]):focus-visible {outline:3px solid var(--brand-3);outline-offset:2px;border-radius:6px}
input:focus,select:focus,textarea:focus {border-color:var(--brand-2);box-shadow:0 0 0 3px rgba(23,131,106,.45)}
/* Dimensiuni minime de text — publicul 45+ (podea: 13px) */
.small {font-size:14px}
.muted-text {font-size:15px}
.footer-company {font-size:13px;color:#5b6879}
.sig-placeholder {color:#7b8794}
/* Pagina curenta in navigatie */
.topnav a[aria-current="page"] {background:rgba(255,255,255,.18);font-weight:600}
@media(pointer:coarse) {
.btn.sm {min-height:44px}
.topnav a {min-height:44px;display:inline-flex;align-items:center}
}
@media(forced-colors:active) {
.stat .n,.price-card .price,.hero-copy h1 .accent,.story-copy h1 .accent {
    -webkit-text-fill-color:currentColor;color:CanvasText;background:none}
}
.field-optional {font-weight:400;color:var(--ink-2);font-size:14px}
/* ===== Suport: fir de discutie ===== */
.nav-pill {display:inline-flex;align-items:center;justify-content:center;min-width:19px;height:19px;
  padding:0 5px;margin-left:5px;border-radius:999px;background:var(--mint);color:var(--ink);
  font-size:12px;font-weight:800}
.msg {padding:13px 15px;border:1px solid var(--line);border-radius:12px;background:#fff}
/* ===== Accesibilitate: skip link + text doar pentru cititoare de ecran ===== */
.skip {position:absolute;left:-9999px}
.skip:focus {left:12px;top:12px;z-index:100;background:#fff;color:var(--brand);
  padding:12px 18px;border-radius:10px;box-shadow:var(--shadow-lg);font-weight:700}
/* Pe paginile PUBLICE, bara de sus ramane FIXA la derulare (sticky) si
   pastreaza Autentificare + Cont nou si pe telefon — vizitatorul care
   citeste pagina de preturi are mereu drumul spre cont la un deget. */
.topbar-fix {position:sticky;top:0;z-index:60;box-shadow:0 2px 10px rgba(16,26,32,.18)}
@media(max-width:900px) {
.topnav {display:none}
.topnav.topnav-public {display:flex;flex-wrap:nowrap;gap:2px}
.topnav.topnav-public a {padding:6px 9px;font-size:13.5px;white-space:nowrap}
/* Pe telefon, pe fluxul oaspetelui, se aprind DOAR butoanele de limba: regula
   de deasupra stingea tot randul, iar exceptia paginilor publice nu salva fisa
   de cazare, deci butonul de limba pur si simplu nu exista acolo (reclamatia
   unei gazde, 11.09.2026). „Contul meu" si „Iesire" raman ascunse: trei lucruri
   in aceeasi bara nu incap pe un ecran de telefon. */
.topnav.topnav-lang {display:flex;flex-wrap:nowrap;gap:6px;justify-content:flex-end;align-items:center}
.topnav.topnav-lang > :not(.lang-btn) {display:none}
.topnav.topnav-lang a.lang-btn {padding:6px 11px;font-size:13.5px;white-space:nowrap}
/* Pe paginile de calator ramane aprinsa si „Iesire": cine isi deschide contul
   de pe un telefon imprumutat trebuie sa se poata deconecta de acolo. Pe fisa
   de cazare nu se adauga clasa, deci bara ramane doar cu limbile. */
.topnav.topnav-lang.topnav-exit > a.nav-exit {display:inline-block;font-size:13.5px;white-space:nowrap}
}
@media(max-width:900px) {
.table-wrap {overflow:visible;border:0;background:none}
table.list,table.list tbody,table.list tr,table.list td {display:block;width:100%}
table.list thead {position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
table.list tr {background:#fff;border:1px solid var(--line);border-radius:12px;
    box-shadow:var(--shadow);margin-bottom:12px;padding:10px 14px}
table.list td {border:0;border-top:1px solid var(--line);padding:9px 0;
    display:grid;grid-template-columns:40% minmax(0, 1fr);gap:10px;align-items:baseline;font-size:15px}
table.list td:first-child {border-top:0;grid-template-columns:1fr;font-weight:700;font-size:16px}
table.list td::before {content:attr(data-label);font-size:13px;font-weight:700;color:var(--ink-2)}
table.list td:first-child::before,table.list td:not([data-label])::before {display:none}
table.list td:not([data-label]) {display:block}
table.list td:empty {display:none}
/* In tabelul stivuit, celula valorii are 60% din card: o pastila lunga
   („tipul notificarii necitit (limba contului)") iesea din card, fiindca
   .badge e nowrap (vazut de operator pe telefon, 08.09.2026). Aici se rupe. */
table.list td > * {min-width:0}
table.list td .badge {white-space:normal;overflow-wrap:anywhere;text-align:left;line-height:1.35}
/* Insigna e o PASTILA, nu un bloc. Ca element de grila al celulei se intindea
   pe toata coloana valorii („verificată" cat tot cardul, langa un „cod trimis"
   stramt cat textul), iar regula de mai jos pentru linkurile din tabel
   („padding:6px 0") ii lua padding-ul orizontal si textul se lipea de marginea
   pastilei. Amandoua vazute de operator pe telefon, 13.09.2026. */
table.list td > .badge {justify-self:start}
table.list td .badge, table.list td a.badge:not(.btn) {padding:5px 12px}
/* Popoverul deschis ia toata latimea cardului, nu doar coloana valorii (60%):
   randul IGI (numele oaspetelui + „descarcă poza" + butonul) nu incape acolo
   si iesea din card, cu textul taiat la marginea ecranului. */
table.list td:has(.ext-pop[open]) {grid-template-columns:1fr}
}
/* ===== Clase folosite în pagini care nu aveau stil ===== */
.brand-name {font-weight:800;letter-spacing:-.012em}
.nav-switch {font-weight:700}
/* Codul de la ușă, afișat în dreptul sosirii */
.access-inline {display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:5px;font-size:13px}
/* Prelungirea unui acces, direct de pe rândul sosirii */
.ext-pop { position: relative; display: inline-block; }
.ext-pop > summary { cursor: pointer; font-size: 12px; color: var(--brand-3);
  text-decoration: underline; list-style: none; white-space: nowrap; }
.ext-pop > summary::-webkit-details-marker { display: none; }
/* Un summary cu clasa .btn arata si sta ca un buton adevarat, in linie cu
   butoanele vecine — invinge stilul implicit de link marunt al popoverului. */
.ext-pop > summary.btn { font-size: 13px; color: inherit; display: inline-flex;
  align-items: center; list-style: none; text-decoration: none; }
.ext-pop > summary.btn.secondary { color: var(--brand-2); }
.ext-form { position: absolute; z-index: 30; right: 0; top: calc(100% + 6px); width: 240px;
  display: grid; gap: .5rem; padding: 12px; text-align: left;
  background: var(--card); border: 1px solid var(--line-2); border-radius: 12px; box-shadow: var(--shadow);
  /* Popoverul poate sta intr-un td.nowrap (celula „Pleaca"/„Sejur"): fara
     resetul asta, textul dinauntru mosteneste nowrap si iese din cutie. */
  white-space: normal; }
.ext-form label { display: grid; gap: 3px; }
.ext-form select, .ext-form input { margin: 0; width: 100%; }
.ext-form p { margin: 0; }
@media (max-width: 900px) {
.ext-form { position: static; width: auto; }
/* Pe telefon fereastra nu mai pluteste, ci curge in pagina — dar ramanea
     inchisa intr-un rand de actiuni ingust si ajungea la 69px, cu campurile
     nefolosibile. Deschisa, ia toata latimea randului. */
.ext-pop[open] { width: 100%; }
.actions .ext-pop[open], .cal-act .ext-pop[open] { flex: 1 1 100%; }
.ext-form { min-width: 0; }
/* Eticheta care infasoara campul e ea insasi element flex si se strange la
     latimea textului — de acolo campuri de 87px in care nu incape un nume de
     firma. „min-width: 0" scoate limita implicita de continut. */
.ext-form label, .ext-form .field { width: 100%; min-width: 0; }
.ext-form form { display: block; }
table.list td a:not(.btn) { display: inline-block; padding: 6px 0; }
/* Legatura de intoarcere din contul de calator e o actiune de sine
     statatoare, nu un cuvant intr-o propozitie. */
p.muted-text.small > a[href*="host/index.php"] { display: inline-block; padding: 10px 0; }
/* Legaturile care deschid ferestre („redenumeste", „sterge", „modifica")
     erau linii de text de 19px inaltime. */
.ext-pop > summary { min-height: 40px; display: inline-flex; align-items: center; }
/* Campurile ingustate pentru desktop nu au de ce sa ramana asa: pe un ecran
     de 375px, o valoare mai lunga decat cutia devine text taiat. */
input[type="text"], input[type="email"], input[type="url"], input[type="search"],
  input[type="date"], input[type="number"], input[type="password"], select, textarea {
    max-width: 100%;
  }
.field input:not(.st-input), .field select, .field textarea { width: 100%; }
/* Bifele raman bife: latirea de mai sus e pentru cutiile de text, nu pentru
     checkbox-urile din .checkline, pe care le-ar intinde pe tot randul. */
.field .checkline input { width: 18px; }
/* Legaturile care sunt de fapt actiuni de sine statatoare, nu cuvinte intr-o
     propozitie: le dam inaltime de atins. Cele din interiorul unui paragraf
     raman cum sunt — acolo padding-ul ar rupe randurile. */
p > a.u-cta, .alert > a, .lead > a[href*="index.php"] { display: inline-block; padding: 10px 0; }
}
tr:has(.ext-pop[open]) td { overflow: visible; }
/* Butoanele-link din interiorul tabelelor: „table.list a" le fura culoarea
   (specificitate mai mare decat .btn) si textul ajunge verde pe verde. */
table.list a.btn { color: #fff; }
table.list a.btn.secondary, table.list a.btn.ghost { color: var(--brand-2); }
/* Capul panoului: patru carduri, aceeasi latime SI aceeasi inaltime.
   Un singur pas de spatiere (--gap-panou), folosit deopotriva intre coloane si
   intre randuri, ca golurile sa fie egale pe amandoua directiile. */
:root { --gap-panou: 22px; }
/* Raportul tiparibil: fiecare fisa pe PAGINA ei, ca in dosarul de evidenta */
.fisa-multi .fisa { page-break-after: always; break-after: page; margin-bottom: 28px; }
.fisa-multi .fisa:last-child { page-break-after: auto; break-after: auto; }
/* Fisa ANAF: etichetele sectiunilor pe cel mult doua randuri, tabelul cu
   Nr. crt. ingust (3 cifre), numele lat, capul de tabel compact. */
/* Tabelul de LINII al facturii: lat la descriere, ingust la numere. Fara el,
   latimea globala de 38% a th-urilor (gandita pentru etichetele fisei) umfla
   absurd coloana „#". Banii stau la dreapta, ca in orice factura. */
table.fisa-grid.fisa-factura th { width: auto; }
table.fisa-grid.fisa-factura th:first-child:not([colspan]), table.fisa-grid.fisa-factura td:first-child:not([colspan]) {
  width: 30px; text-align: center; }
table.fisa-grid.fisa-factura th:nth-child(n+3), table.fisa-grid.fisa-factura td:nth-child(n+3) {
  width: 12%; text-align: right; white-space: nowrap; }
table.fisa-grid.fisa-factura tr > td:last-child { text-align: right; }
/* ---------------- Galeria-slideshow (pagina publica + formularul de check-in):
   rulare automata ~10s/poza + sageti, partajate intre pagina.php si c.php —
   vezi assets/gallery.js. Dimensiunea galeriei (inaltime/aspect-ratio) se
   stabileste separat, pe containerul fiecarei pagini (.pg-hero / .prop-hero
   mai jos), ca acelasi markup sa se comporte diferit vizual in cele doua
   locuri. */
.pg-slides { position: relative; }
.pg-slides-track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
  scrollbar-width: none; -ms-overflow-style: none; }
.pg-slides-track::-webkit-scrollbar { display: none; }
.pg-slides-slide { flex: 0 0 100%; margin: 0; scroll-snap-align: center; }
.pg-slides-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pg-slides-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
  width: 38px; height: 38px; display: flex; align-items: center; justify-content: center;
  border: none; border-radius: 50%; background: rgba(20, 32, 26, .5); color: #fff;
  font-size: 20px; line-height: 1; cursor: pointer; }
.pg-slides-arrow:hover { background: rgba(20, 32, 26, .75); }
.pg-slides-prev { left: 10px; }
.pg-slides-next { right: 10px; }
.pg-slides-dot { width: 10px; height: 10px; padding: 0; border: none; border-radius: 50%; background: #cfe0d8; cursor: pointer; }
.pg-slides-dot:hover, .pg-slides-dot:focus-visible, .pg-slides-dot.on { background: var(--brand); }
/* harta cu pinul unitatii */
.pg-harta { max-width: 100%; height: auto; border-radius: 12px; display: block; }
form .pg-harta { cursor: crosshair; }
/* harta din fila Setari: strat de dale care aluneca sub un pin fix */
form[data-harta] .pg-harta { cursor: pointer; }

/* Plasa de degradare (23.08.2026, dupa fereastra vazuta de operator la
   actualizarea 7.204.0): daca fisierul de context nu se incarca dintr-un
   motiv oarecare, bara de telefon trebuie sa DISPARA, nu sa apara pe desktop.
   Implicitul ei sta deci in temelie; style-app.css o re-arata pe mobil, iar
   fiind incarcat DUPA temelie, castiga la egalitate de specificitate. */
.tabbar { display: none; }

/* --- Bannerul de consimtamant (GA4; vezi consent.js) --- */
.consent-banner {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
  background: var(--card); border-top: 1px solid var(--line);
  box-shadow: 0 -6px 24px rgba(16, 26, 32, .10);
  padding: 14px 18px;
}
.consent-inner {
  max-width: 1120px; margin: 0 auto;
  display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
}
.consent-inner p { margin: 0; flex: 1 1 340px; font-size: 14.5px; }
.consent-btns { display: flex; gap: 10px; }
@media (max-width: 620px) {
  .consent-btns { width: 100%; }
  .consent-btns .btn { flex: 1; }
}
.consent-panou {
  max-width: 1120px; margin: 12px auto 0; padding-top: 12px;
  border-top: 1px solid var(--line);
  display: flex; flex-direction: column; gap: 10px;
}
.consent-scop { display: flex; gap: 10px; align-items: flex-start; font-size: 14.5px; cursor: pointer; }
.consent-scop input { margin-top: 3px; flex-shrink: 0; }
/* ===== Calculatorul de taxe (/calculator-impozit-regim-hotelier) ===== */
.calc-form {margin:18px 0 6px;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--bg)}
.calc-campuri {display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.calc-campuri label {display:grid;gap:4px}
.calc-campuri input {margin:0;width:100%}
.calc-rezumat {margin:14px 0 18px;font-size:16.5px;line-height:1.6}
.calc-rezultate {display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-bottom:22px}
.calc-card {padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:#fff}
.calc-card h2 {margin:0 0 6px;font-size:17px}
.calc-ramane {margin:0 0 10px;display:flex;flex-direction:column;gap:2px}
.calc-suma {font-size:24px;font-weight:800;color:var(--brand-2);line-height:1.2}
.calc-linii {list-style:none;margin:0 0 10px;padding:0;display:grid;gap:6px;font-size:14px}
.calc-linii li {display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.calc-linii li > span {color:var(--ink-2)}
.calc-linii li > strong {white-space:nowrap}
.calc-total {border-top:1px solid var(--line);padding-top:6px;margin-top:2px}
.calc-pag .ghid-faq {margin-bottom:18px}
/* Drumul banilor, deasupra rezultatelor: comisionul platformelor pe rândul lui */
.calc-flux {width:100%;border-collapse:collapse;margin:0 0 10px;font-size:15px}
.calc-flux th {text-align:left;font-weight:500;color:var(--ink-2);padding:7px 0}
.calc-flux td {text-align:right;font-weight:700;padding:7px 0;white-space:nowrap}
.calc-flux .calc-minus td {color:var(--ink-2);font-weight:600}
.calc-flux .calc-flux-total th, .calc-flux .calc-flux-total td {
  border-top:1px solid var(--line);padding-top:9px;color:var(--ink);font-weight:800}
.calc-flux caption {text-align:left;padding:0 0 6px;font-size:13.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:.06em;color:var(--brand-2)}
/* Clasa exista doar in style-app.css, care NU se incarca pe paginile publice:
   un „sr-only" pus pe un landing ramanea vizibil (vazut la calculator,
   19.09.2026). Sta aici, in foaia comuna, ca sa nu mai scape nimic. */
.sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* Bifa de sub câmpuri (costul salariatului la micro) ia tiparul .checkline,
   ca sa aiba aceeasi culoare de brand ca restul bifelor; aici se adauga doar
   explicatia de sub eticheta. */
.calc-bifa {margin:12px 0 0;cursor:pointer}
.calc-bifa > span {display:grid;gap:2px}
.calc-card .calc-bifa {margin-top:10px;padding-top:10px;border-top:1px solid var(--line);font-size:14px}