/* AlertaDosar — stiluri comune. Fără stiluri inline (CSP style-src 'self'). */
:root {
  --bg: #f4f6fa;
  --surface: #ffffff;
  --surface-2: #f8fafc;
  --border: #e2e7ef;
  --border-strong: #cbd3df;
  --text: #0f1b2d;
  --text-2: #4a5872;
  --text-3: #7a879c;
  --brand: #13294b;
  --brand-2: #1d3d6e;
  --accent: #2456d6;
  --accent-hover: #1b45b3;
  --accent-soft: #e8eefc;
  --amber: #e89a0c;
  --amber-soft: #fdf3dd;
  --green: #138a4f;
  --green-soft: #e3f5ea;
  --red: #c4322b;
  --red-soft: #fbe6e5;
  --shadow: 0 1px 2px rgba(15, 27, 45, .06), 0 4px 14px rgba(15, 27, 45, .06);
  --shadow-lg: 0 10px 40px rgba(15, 27, 45, .18);
  --radius: 12px;
  --radius-sm: 8px;
  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --mono: ui-monospace, "SFMono-Regular", "Cascadia Mono", Consolas, monospace;
  --nav-w: 248px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0b1220;
    --surface: #121b2d;
    --surface-2: #0f1727;
    --border: #22304a;
    --border-strong: #31415f;
    --text: #e8edf6;
    --text-2: #aab6cb;
    --text-3: #7d8aa3;
    --brand: #0a1426;
    --brand-2: #16284a;
    --accent: #5b8cff;
    --accent-hover: #7aa2ff;
    --accent-soft: #1a2a4d;
    --amber: #f2b33d;
    --amber-soft: #3a2c10;
    --green: #3cc480;
    --green-soft: #12301f;
    --red: #ff6b63;
    --red-soft: #3a1513;
    --shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 4px 14px rgba(0, 0, 0, .25);
    color-scheme: dark;
  }
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--text);
  font: 15px/1.5 var(--font); -webkit-font-smoothing: antialiased;
}
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3 { line-height: 1.25; margin: 0 0 .5rem; letter-spacing: -.01em; }
h1 { font-size: 1.6rem; }
h2 { font-size: 1.2rem; }
h3 { font-size: 1rem; }
p { margin: 0 0 .75rem; }
.muted { color: var(--text-2); }
.small { font-size: .85rem; }
.mono { font-family: var(--mono); font-size: .9em; }
.hidden { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 45%, transparent); outline-offset: 2px; }

/* ───── Butoane și formulare ───── */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
  min-height: 40px; padding: .5rem 1rem; border-radius: var(--radius-sm);
  border: 1px solid var(--border-strong); background: var(--surface); color: var(--text);
  font: 600 .92rem var(--font); cursor: pointer; white-space: nowrap; text-decoration: none;
  transition: background .15s, border-color .15s, color .15s;
}
.btn > svg { width: 1.05em; height: 1.05em; flex: none; }
.btn:hover { background: var(--surface-2); text-decoration: none; }
.btn:disabled { opacity: .55; cursor: not-allowed; }
.btn-primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn-primary:hover { background: var(--accent-hover); }
/* „Caută live” (verde) și „Monitorizează căutarea” (chihlimbar): culori proprii, distincte de „Caută”; textul rămâne
   în culoarea normală (contrast bun în ambele teme), culoarea o dau fundalul, bordura și iconița */
.btn-live { background: var(--green-soft); border-color: color-mix(in srgb, var(--green) 55%, var(--border)); color: var(--text); }
.btn-live > svg { color: var(--green); }
.btn-live:hover:not(:disabled) { background: color-mix(in srgb, var(--green) 22%, var(--green-soft)); border-color: var(--green); }
.btn-monitor { background: var(--amber-soft); border-color: color-mix(in srgb, var(--amber) 55%, var(--border)); color: var(--text); }
.btn-monitor > svg { color: var(--amber); }
.btn-monitor:hover:not(:disabled) { background: color-mix(in srgb, var(--amber) 22%, var(--amber-soft)); border-color: var(--amber); }
.btn-danger { color: var(--red); border-color: color-mix(in srgb, var(--red) 40%, var(--border)); }
.btn-danger:hover { background: var(--red-soft); }
.btn-ghost { background: transparent; border-color: transparent; color: var(--text-2); }
.btn-ghost:hover { background: var(--surface-2); color: var(--text); }
.btn-sm { min-height: 32px; padding: .3rem .7rem; font-size: .84rem; }
.btn-block { width: 100%; }
.btn-row { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }

label { display: block; font-weight: 600; font-size: .85rem; color: var(--text-2); margin-bottom: .3rem; }
input, select, textarea {
  width: 100%; min-height: 42px; padding: .55rem .75rem; border-radius: var(--radius-sm);
  border: 1px solid var(--border-strong); background: var(--surface); color: var(--text);
  font: 400 .95rem var(--font);
}
textarea { min-height: 96px; resize: vertical; font-family: var(--mono); font-size: .85rem; }
input:focus, select:focus, textarea:focus { border-color: var(--accent); outline: 3px solid var(--accent-soft); outline-offset: 0; }
input[type="checkbox"] { width: 18px; height: 18px; min-height: 0; accent-color: var(--accent); vertical-align: middle; }
.check { display: flex; align-items: center; gap: .5rem; font-weight: 500; color: var(--text); margin: 0; }
.field { margin-bottom: .9rem; }
.hint { font-size: .8rem; color: var(--text-3); margin-top: .25rem; }
.grid { display: grid; gap: .9rem 1rem; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.grid-2 { display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { display: grid; gap: 1rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* Câmpurile din grile: etichetă / câmp / indicație pe aceleași rânduri în toate coloanele (subgrid), astfel încât
   câmpurile vecine au aceeași margine de sus chiar dacă o etichetă are două rânduri sau un câmp are indicație. */
.grid-2 > .field:not(:has(> :nth-child(4))), .grid-3 > .field:not(:has(> :nth-child(4))) {
  display: grid; grid-row: span 3; grid-template-rows: subgrid; row-gap: 0; align-content: start; margin-bottom: 0;
}
.grid-2 > .field > label, .grid-3 > .field > label { align-self: end; }
.field-extra > .hint:first-child { margin-top: .25rem; }
.grid-2:has(> .field) > :not(.field), .grid-3:has(> .field) > :not(.field) { grid-row: span 3; }
.span-2 { grid-column: span 2; }

/* ───── Carduri, insigne, alerte ───── */
.card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 1.25rem; }
.card + .card { margin-top: 1rem; }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.card-head h2, .card-head h3 { margin: 0; }
.badge {
  display: inline-flex; align-items: center; gap: .3rem; padding: .1rem .55rem; border-radius: 999px;
  font-size: .75rem; font-weight: 700; background: var(--surface-2); color: var(--text-2); border: 1px solid var(--border);
  white-space: nowrap;
}
.badge-blue { background: var(--accent-soft); color: var(--accent); border-color: transparent; }
.badge-green { background: var(--green-soft); color: var(--green); border-color: transparent; }
.badge-amber { background: var(--amber-soft); color: var(--amber); border-color: transparent; }
.badge-red { background: var(--red-soft); color: var(--red); border-color: transparent; }
.dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; display: inline-block; }
.alert { border-radius: var(--radius-sm); padding: .8rem 1rem; border: 1px solid; margin-bottom: 1rem; }
.alert-amber { background: var(--amber-soft); border-color: color-mix(in srgb, var(--amber) 35%, transparent); }
.alert-red { background: var(--red-soft); border-color: color-mix(in srgb, var(--red) 35%, transparent); }
.alert-blue { background: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 30%, transparent); }
.alert-green { background: var(--green-soft); border-color: color-mix(in srgb, var(--green) 35%, transparent); }
.pre-wrap { white-space: pre-wrap; overflow-wrap: anywhere; max-width: 100%; margin: .5rem 0 0; }
.grant-preview:empty { display: none; }
.grant-preview { margin-top: 1rem; display: grid; gap: .6rem; }
.grant-note { margin: .4rem 0 .8rem; display: grid; gap: .2rem; }
.diag-status dd .badge { margin: 0; }
.empty { text-align: center; padding: 2.5rem 1rem; color: var(--text-3); }
.empty strong { display: block; color: var(--text-2); margin-bottom: .25rem; font-size: 1rem; }

/* ───── Tabele (devin carduri pe telefon) ───── */
.table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius-sm); }
table { width: 100%; border-collapse: collapse; font-size: .9rem; }
th, td { text-align: left; padding: .65rem .8rem; border-bottom: 1px solid var(--border); vertical-align: top; }
th { background: var(--surface-2); color: var(--text-2); font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; white-space: nowrap; }
tbody tr:last-child td { border-bottom: 0; }
tr.clickable { cursor: pointer; }
tr.clickable:hover td { background: var(--surface-2); }
tr.unread td:first-child { box-shadow: inset 3px 0 0 var(--amber); }
tr.unread td { font-weight: 600; }
/* sortare: antetul e un buton pe toată celula; pe telefon (antet ascuns) apare selectorul „Sortează după” */
th:has(> .th-sort) { padding: 0; }
.th-sort { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: .35rem; width: 100%; min-height: 44px;
  padding: .65rem .8rem; cursor: pointer; font: inherit; color: inherit; text-transform: inherit; letter-spacing: inherit; white-space: nowrap; }
.th-sort:hover { color: var(--text); background: var(--surface-3, var(--border)); }
.th-sort:focus-visible { outline: 2px solid var(--accent, var(--blue)); outline-offset: -2px; }
.th-sort .sort-ind { font-size: .7rem; opacity: .45; }
.th-sort.on { color: var(--text); }
.th-sort.on .sort-ind { opacity: 1; }
th.actions .th-sort { justify-content: flex-end; }
.table-sort { display: none; }
td .clamp { display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nowrap { white-space: nowrap; }

/* ───── Layout aplicație ───── */
.shell { display: grid; grid-template-columns: var(--nav-w) minmax(0, 1fr); min-height: 100vh; min-height: 100dvh; }
.sidebar {
  background: var(--brand); color: #dfe7f5; padding: 1.25rem 1rem; position: sticky; top: 0; height: 100vh; height: 100dvh;
  display: flex; flex-direction: column; gap: 1.5rem;
}
.brand { display: flex; align-items: center; gap: .65rem; color: #fff; font-weight: 800; font-size: 1.15rem; letter-spacing: -.01em; text-decoration: none; }
.brand:hover { text-decoration: none; }
.brand img { width: 34px; height: 34px; border-radius: 9px; }
.brand small { display: block; font-weight: 500; font-size: .72rem; color: #9fb0cf; letter-spacing: 0; }
.nav { display: flex; flex-direction: column; gap: .2rem; }
.nav a {
  display: flex; align-items: center; gap: .7rem; padding: .6rem .75rem; border-radius: var(--radius-sm);
  color: #c8d3e8; font-weight: 600; font-size: .93rem; text-decoration: none;
}
.nav a:hover { background: rgba(255, 255, 255, .07); color: #fff; }
.nav a[aria-current="page"] { background: rgba(255, 255, 255, .12); color: #fff; }
.nav svg { width: 19px; height: 19px; flex: none; }
.nav .count { margin-left: auto; background: var(--amber); color: #1d1300; border-radius: 999px; font-size: .72rem; padding: 0 .45rem; font-weight: 800; }
.sidebar-foot { margin-top: auto; font-size: .82rem; color: #9fb0cf; display: flex; flex-direction: column; gap: .5rem; }
.sidebar-foot .who { color: #fff; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-foot a { color: #c8d3e8; }
.main { padding: 1.75rem clamp(1rem, 3vw, 2.5rem) 3rem; min-width: 0; }
.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; flex-wrap: wrap; }
.page-head p { margin: 0; }
.topbar { display: none; }

.stats { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); margin-bottom: 1rem; }
.stat { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 1rem 1.1rem; box-shadow: var(--shadow); }
.stat .label { font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; color: var(--text-3); font-weight: 700; }
.stat .value { font-size: 1.7rem; font-weight: 800; letter-spacing: -.02em; margin-top: .2rem; }
.meter { height: 8px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--border); overflow: hidden; margin-top: .4rem; }
.meter > span { display: block; height: 100%; background: var(--accent); width: 0; transition: width .3s; }
.meter.warn > span { background: var(--amber); }
.meter.full > span { background: var(--red); }

.tabs { display: flex; gap: .25rem; border-bottom: 1px solid var(--border); margin-bottom: 1rem; overflow-x: auto; scrollbar-width: none; }
.tabs button { background: none; border: 0; border-bottom: 2px solid transparent; padding: .6rem .9rem; font: 600 .9rem var(--font); color: var(--text-2); cursor: pointer; white-space: nowrap; }
.tabs button[aria-selected="true"] { color: var(--accent); border-color: var(--accent); }

/* căutarea: spațiu clar între rândul ÎCCJ (sau ultimul rând de câmpuri) și butoane */
.iccj-row { margin-top: .9rem; }
.search-actions { margin-top: 1.25rem; }
.pager { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1rem; flex-wrap: wrap; }
/* rafinarea rezultatelor: căutare în rezultate + fațete (pe telefon, câte unul pe rând) */
.refine-bar { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: .25rem 0 .9rem; }
.refine-bar select { flex: 0 1 13rem; min-width: 0; min-height: 44px; }
.refine-bar .btn { min-height: 44px; }
.refine-in { flex: 1 1 16rem; min-width: 0; display: flex; align-items: center; gap: .45rem; padding: 0 .7rem; min-height: 44px;
  border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); }
.refine-in:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.refine-in input { flex: 1 1 auto; min-width: 0; border: 0; outline: 0; background: transparent; padding: .55rem 0; font: inherit; font-size: 16px; color: inherit; box-shadow: none; }
.refine-in svg { width: 18px; height: 18px; flex: none; color: var(--text-3); }
[aria-busy="true"] .table-wrap { opacity: .55; transition: opacity .15s; }
@media (max-width: 700px) {
  .refine-bar { flex-direction: column; align-items: stretch; }
  .refine-bar select, .refine-in { flex: 1 1 auto; width: 100%; }
}
.list { display: grid; gap: .75rem; }
.monitor { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem 1rem; align-items: start; }
.monitor .title { font-weight: 700; display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.monitor .meta { font-size: .83rem; color: var(--text-3); display: flex; gap: .9rem; flex-wrap: wrap; }
.monitor.paused { opacity: .7; }
.kv { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: .45rem 1.2rem; font-size: .92rem; margin: 0; }
.kv dt { color: var(--text-3); font-weight: 600; }
.kv dd { margin: 0; overflow-wrap: anywhere; }
.timeline { list-style: none; padding: 0; margin: 0; border-left: 2px solid var(--border); }
.timeline li { position: relative; padding: 0 0 1rem 1.1rem; }
.timeline li::before { content: ""; position: absolute; left: -7px; top: .35rem; width: 12px; height: 12px; border-radius: 50%; background: var(--surface); border: 2px solid var(--accent); }
.timeline li.future::before { border-color: var(--amber); background: var(--amber); }
.timeline .when { font-weight: 700; font-size: .9rem; }
.timeline .what { font-size: .88rem; color: var(--text-2); white-space: pre-line; overflow-wrap: anywhere; }
.feature-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; }
.feature-list li { display: flex; gap: .55rem; align-items: center; }
.yes { color: var(--green); font-weight: 800; }
.no { color: var(--text-3); font-weight: 800; }

/* ───── Dialog ───── */
dialog {
  border: 0; border-radius: var(--radius); padding: 0; width: min(880px, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem);
  background: var(--surface); color: var(--text); box-shadow: var(--shadow-lg);
}
dialog::backdrop { background: rgba(8, 15, 30, .55); }
.dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.25rem; border-bottom: 1px solid var(--border); position: sticky; top: 0; background: var(--surface); z-index: 1; }
.dialog-head h2 { margin: 0; font-size: 1.1rem; }
.dialog-body { padding: 1.25rem; }
.dialog-foot { display: flex; justify-content: flex-end; gap: .5rem; padding: 1rem 1.25rem; border-top: 1px solid var(--border); flex-wrap: wrap; }
.section-title { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--text-3); font-weight: 800; margin: 1.4rem 0 .6rem; }

/* ───── Notificări ───── */
.toasts { position: fixed; right: 1rem; bottom: 1rem; display: flex; flex-direction: column; gap: .5rem; z-index: 1000; max-width: min(420px, calc(100vw - 2rem)); }
.toast { background: var(--text); color: var(--surface); padding: .75rem 1rem; border-radius: var(--radius-sm); box-shadow: var(--shadow-lg); font-weight: 500; font-size: .92rem; animation: in .2s ease-out; }
.toast.error { background: var(--red); color: #fff; }
.toast.ok { background: var(--green); color: #fff; }
@keyframes in { from { transform: translateY(8px); opacity: 0; } }
.spinner { width: 18px; height: 18px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: spin .7s linear infinite; display: inline-block; }
@keyframes spin { to { transform: rotate(360deg); } }
.loading { display: flex; align-items: center; gap: .6rem; color: var(--text-2); padding: 1rem 0; }

/* ───── Pagina de autentificare ───── */
.auth { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); min-height: 100vh; min-height: 100dvh; }
.auth-hero {
  background: radial-gradient(1200px 600px at 0% 0%, #26477e 0%, transparent 60%), linear-gradient(160deg, #13294b, #0b1730);
  color: #e6edf9; padding: clamp(1.5rem, 5vw, 4rem); display: flex; flex-direction: column; gap: 2rem;
}
.auth-hero h1 { font-size: clamp(1.8rem, 3.4vw, 2.7rem); color: #fff; max-width: 18ch; letter-spacing: -.02em; }
.auth-hero .lead { font-size: 1.08rem; color: #c3d0e8; max-width: 46ch; }
.points { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; max-width: 52ch; }
.points li { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: .8rem; align-items: start; }
.points .ic { width: 36px; height: 36px; border-radius: 10px; background: rgba(255, 255, 255, .1); display: grid; place-items: center; }
.points .ic svg { width: 19px; height: 19px; }
.points strong { color: #fff; display: block; }
.points span { color: #b3c1dc; font-size: .93rem; }
.auth-hero .foot { margin-top: auto; font-size: .82rem; color: #8ea0c2; }
.auth-panel { display: grid; place-items: center; padding: clamp(1.25rem, 4vw, 3rem); }
.auth-card { width: min(420px, 100%); }
.auth-card .tabs { margin-bottom: 1.25rem; }

/* ───── Responsive ───── */
@media (max-width: 1100px) {
  .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .auth { grid-template-columns: minmax(0, 1fr); }
  .auth-hero { gap: 1.25rem; }
  .auth-hero .points, .auth-hero .foot { display: none; }
  .auth-hero .auth-links { order: 9; }
  .shell { grid-template-columns: minmax(0, 1fr); }
  .sidebar {
    position: fixed; inset: auto 0 0 0; height: auto; z-index: 50; flex-direction: row; padding: .35rem .5rem calc(.35rem + env(safe-area-inset-bottom));
    gap: 0; box-shadow: 0 -4px 20px rgba(0, 0, 0, .18);
  }
  .sidebar .brand, .sidebar-foot { display: none; }
  .nav { flex-direction: row; width: 100%; justify-content: space-around; overflow-x: auto; scrollbar-width: none; }
  .nav a { flex-direction: column; gap: .2rem; font-size: .7rem; padding: .4rem .55rem; position: relative; min-width: 64px; text-align: center; }
  .nav .count { position: absolute; top: 0; right: .45rem; margin: 0; }
  .topbar {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem; position: sticky; top: 0; z-index: 40;
    background: var(--brand); color: #fff; padding: .7rem 1rem calc(.7rem); padding-top: calc(.7rem + env(safe-area-inset-top));
  }
  .topbar .brand { font-size: 1.05rem; }
  .topbar .brand img { width: 28px; height: 28px; }
  .topbar .btn { color: #dfe7f5; border-color: rgba(255, 255, 255, .25); background: transparent; }
  .main { padding: 1.1rem 1rem calc(5.5rem + env(safe-area-inset-bottom)); }
  .grid-2 { grid-template-columns: minmax(0, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .toasts { bottom: calc(5rem + env(safe-area-inset-bottom)); right: .75rem; left: .75rem; max-width: none; }
  .search-indicator { bottom: calc(5rem + env(safe-area-inset-bottom)); right: .75rem; }
}
@media (max-width: 700px) {
  h1 { font-size: 1.35rem; }
  .card { padding: 1rem; }
  /* tabelele marcate .stack devin carduri */
  table.stack thead { display: none; }
  .table-sort { display: flex; align-items: center; gap: .6rem; padding: .6rem .9rem; border-bottom: 1px solid var(--border); background: var(--surface-2); }
  .table-sort > span { font-size: .8rem; font-weight: 600; color: var(--text-2); white-space: nowrap; }
  .table-sort select { flex: 1 1 auto; min-width: 0; min-height: 44px; }
  table.stack, table.stack tbody, table.stack tr, table.stack td { display: block; width: 100%; }
  table.stack tr { padding: .75rem .9rem; border-bottom: 1px solid var(--border); }
  table.stack td { border: 0; padding: .15rem 0; }
  table.stack td[data-label]::before { content: attr(data-label); display: block; font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; color: var(--text-3); font-weight: 700; }
  table.stack td.primary { font-weight: 700; font-size: 1rem; }
  tr.unread td:first-child { box-shadow: none; }
  tr.unread { box-shadow: inset 3px 0 0 var(--amber); }
  .grid-3 { grid-template-columns: minmax(0, 1fr); }
  .span-2 { grid-column: auto; }
  .monitor { grid-template-columns: minmax(0, 1fr); }
  .kv { grid-template-columns: minmax(0, 1fr); gap: .1rem; }
  .kv dd { margin-bottom: .5rem; }
  dialog { width: 100vw; max-width: 100vw; max-height: 100dvh; height: 100dvh; border-radius: 0; margin: 0; }
  .dialog-foot { position: sticky; bottom: 0; background: var(--surface); }
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stat .value { font-size: 1.4rem; }
}
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }
@media print { .sidebar, .topbar, .btn, .toasts { display: none !important; } .shell { display: block; } }
/* fit-content, nu auto: un dialog modal e position: fixed cu inset: 0, iar height: auto l-ar întinde pe toată înălțimea */
dialog.narrow { width: min(460px, calc(100vw - 2rem)); height: fit-content; max-height: calc(100dvh - 2rem); }
@media (max-width: 700px) { dialog.narrow { height: fit-content; max-height: calc(100dvh - 2rem); margin: auto; border-radius: var(--radius); } }
td .badge, .title .badge, h2 + .badge { margin-left: .35rem; }

/* ───── Comutator mod de căutare și extinderi ───── */
.segmented { display: inline-grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); max-width: 100%; margin-top: .5rem; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); overflow: hidden; }
.segmented button { border: 0; background: var(--surface); color: var(--text-2); font: 600 .84rem var(--font); padding: .4rem .8rem; cursor: pointer; min-height: 34px; text-align: center; white-space: normal; line-height: 1.2; }
/* pe ecrane înguste, comutatorul ocupă tot rândul, cu butoane de lățimi egale (textul lung trece pe două rânduri) */
@media (max-width: 520px) { .segmented { display: grid; width: 100%; } }
.segmented button + button { border-left: 1px solid var(--border-strong); }
.segmented button[aria-checked="true"] { background: var(--accent); color: #fff; }
.segmented button:disabled { opacity: .5; cursor: not-allowed; }
.field .check.hint { margin-top: .45rem; font-weight: 500; color: var(--text-2); font-size: .82rem; }
.expansions { background: var(--accent-soft); border-radius: var(--radius-sm); padding: .6rem .8rem; font-size: .86rem; color: var(--text-2); overflow-wrap: anywhere; }
.expansions .mono { color: var(--text); }

/* ───── Siglă (lockup) ───── */
.brand img.lockup { width: auto; height: 34px; border-radius: 0; display: block; }
.brand-stack { flex-direction: column; align-items: flex-start; gap: .3rem; }
.brand-stack small { padding-left: 2px; }
.auth-hero .brand img.lockup { height: 40px; }
.topbar .brand img.lockup { height: 28px; }
.logo-404 { display: block; margin: 0 auto 1rem; height: 48px; width: auto; }

/* ───── Notificări ───── */
.steps { margin: .5rem 0 .25rem 1.1rem; padding: 0; display: grid; gap: .25rem; }

/* ───── Pagini publice (prețuri, legal) ───── */
body.public { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; }
.public-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; background: var(--brand); padding: .8rem clamp(1rem, 4vw, 2.5rem); padding-top: calc(.8rem + env(safe-area-inset-top)); }
.public-nav { display: flex; gap: 1.2rem; }
.public-nav a { color: #dfe7f5; font-weight: 600; }
.public-nav a[aria-current="page"] { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.public-main { flex: 1; width: min(1120px, 100%); margin: 0 auto; padding: 2rem clamp(1rem, 4vw, 2rem) 3rem; }
.public-foot { display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; justify-content: center; padding: 1.2rem 1rem calc(1.2rem + env(safe-area-inset-bottom)); border-top: 1px solid var(--border); font-size: .85rem; color: var(--text-3); }
.public-foot a { color: var(--text-2); }
.pricing-intro { text-align: center; margin-bottom: 1.5rem; }
.pricing-intro .segmented { margin: .5rem auto 1rem; }
.pricing-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); align-items: stretch; margin-bottom: 1.5rem; }
/* carduri de aceeași înălțime: coloană flexibilă, butonul la bază, blocul de preț cu aceleași rânduri pe toate planurile */
.plan-card { position: relative; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 1.4rem; display: flex; flex-direction: column; gap: .9rem; height: 100%; }
/* evidențierea nu schimbă dimensiunile (bordura rămâne de 1 px; inelul e desenat cu umbră) */
.plan-card.featured { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent), var(--shadow); }
.plan-card > .plan-desc { min-height: 2.8em; margin: 0; }
.plan-card > .plan-cta { margin-top: auto; }
.plan-price-block { display: grid; gap: .35rem; }
.plan-price-block .plan-note { min-height: 1.6rem; margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
.plan-price-block .plan-tax { min-height: 2.6em; margin: 0; }
.plan-price-block .invisible { visibility: hidden; }
.plan-card h2 { margin: 0; }
.plan-flag { position: absolute; top: -.7rem; right: 1rem; }
.plan-price strong { font-size: 2rem; letter-spacing: -.02em; }
.center { text-align: center; }
.doc { max-width: 820px; }
.doc h2 { margin-top: 1.6rem; }
.doc li { margin-bottom: .35rem; }
.draft { margin: 1rem 0 1.5rem; }
.auth-links { display: flex; flex-wrap: wrap; gap: .4rem 1rem; font-size: .82rem; margin-top: 1rem; }
.auth-links a { color: #b9c7e2; }

.verify-banner { margin: 1rem clamp(1rem, 3vw, 2.5rem) 0; display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; justify-content: space-between; }
.center-card { margin: 1rem auto; }
@media (max-width: 900px) { .verify-banner { margin: .8rem 1rem 0; } }

.cookie-notice { position: fixed; left: 1rem; bottom: 1rem; z-index: 900; max-width: min(520px, calc(100vw - 2rem)); background: var(--surface); color: var(--text); border: 1px solid var(--border-strong); border-radius: var(--radius); box-shadow: var(--shadow-lg); padding: .8rem 1rem; display: flex; gap: .8rem; align-items: center; font-size: .86rem; }
.qr { display: block; width: 200px; height: 200px; background: #fff; border-radius: 8px; margin: .3rem 0 .8rem; }
pre.codes { background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: .8rem 1rem; font: 600 1rem var(--mono); line-height: 1.8; columns: 2; }
@media (max-width: 900px) { .cookie-notice { bottom: calc(4.8rem + env(safe-area-inset-bottom)); } }
.kv dd.pre { white-space: pre-wrap; }
.field-error { margin-top: .3rem; color: var(--red); font-size: .9rem; font-weight: 600; }
[aria-invalid="true"] { border-color: var(--red) !important; }
.counter { text-align: right; }
#contact-form { display: flex; flex-direction: column; gap: .2rem; }
#contact-form > .btn { align-self: flex-start; min-height: 44px; }
.gdpr-fields { border-left: 3px solid var(--accent); padding-left: .9rem; margin-bottom: .6rem; }
.hp { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }

/* Cloudflare Turnstile: widgetul apare doar dacă e nevoie de interacțiune */
.ts:empty { display: none; }
.ts { margin: 0 0 12px; min-height: 0; }
/* Turnstile rulează în pagina izolată /verificare; iframe-ul are înălțime 0 cât timp verificarea e invizibilă */
.ts-frame { display: block; width: 100%; max-width: 100%; height: 0; border: 0; background: transparent; color-scheme: dark; }
.ts-error { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 6px; padding: 8px 10px; border-radius: 8px; background: var(--red-soft); color: var(--red); font-size: .9rem; }
.ts-error.hidden { display: none; }
.verify-banner .ts { flex-basis: 100%; margin: 0; }

/* ───────── Pagina publică (prezentare) ───────── */
.skip-link { position: absolute; left: .5rem; top: .5rem; z-index: 100; background: var(--surface); color: var(--text); padding: .5rem .8rem; border-radius: var(--radius-sm); min-height: 44px; display: inline-flex; align-items: center; }
/* ascuns vizual până primește focus (de la tastatură) */
.skip-link:not(:focus) { width: 1px; height: 1px; min-height: 0; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.btn-lg { min-height: 48px; padding: .7rem 1.3rem; font-size: 1.02rem; }
.btn-accent { background: #f5b301; border-color: #f5b301; color: #13294b; font-weight: 700; }
.btn-accent:hover { background: #ffc629; color: #13294b; }
.btn-ghost-light { background: transparent; border-color: rgba(255, 255, 255, .35); color: #fff; }
.btn-ghost-light:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.landing-head { position: sticky; top: 0; z-index: 20; }
.landing-nav { align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: .4rem 1.1rem; }
.landing-nav a.btn { color: #13294b; }
.menu-toggle { display: none; align-items: center; gap: .55rem; min-height: 44px; padding: 0 .9rem; border: 1px solid rgba(255, 255, 255, .28); border-radius: 10px;
  background: transparent; color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.menu-toggle:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.menu-bars, .menu-bars::before, .menu-bars::after { display: block; width: 18px; height: 2px; border-radius: 2px; background: currentColor; transition: transform .15s ease; }
.menu-bars { position: relative; }
.menu-bars::before, .menu-bars::after { content: ""; position: absolute; left: 0; }
.menu-bars::before { top: -6px; } .menu-bars::after { top: 6px; }
.menu-toggle[aria-expanded="true"] .menu-bars { background: transparent; }
.menu-toggle[aria-expanded="true"] .menu-bars::before { top: 0; transform: rotate(45deg); }
.menu-toggle[aria-expanded="true"] .menu-bars::after { top: 0; transform: rotate(-45deg); }
.hero { background: radial-gradient(1200px 500px at 85% -10%, #2a4d86 0%, transparent 60%), var(--brand); color: #fff; }
.hero-inner { width: min(1120px, 100%); margin: 0 auto; padding: clamp(2.5rem, 7vw, 5.5rem) clamp(1rem, 4vw, 2rem); display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 2.5rem; align-items: center; }
.hero .eyebrow { color: #f5b301; font-weight: 700; letter-spacing: .02em; margin: 0 0 .6rem; }
.hero h1 { font-size: clamp(2rem, 4.6vw, 3.3rem); line-height: 1.08; letter-spacing: -.025em; margin: 0 0 1rem; max-width: 16ch; color: #fff; }
.hero .lead { font-size: clamp(1.02rem, 1.6vw, 1.15rem); color: #c9d5ec; max-width: 54ch; }
.hero-cta { margin: 1.6rem 0 .8rem; }
.hero-note { font-size: .88rem; color: #9fb0cf; margin: 0; }
.hero-visual { display: grid; gap: 1rem; justify-items: end; }
.mock-alert { width: min(360px, 100%); background: #fff; color: #0f1b2d; border-radius: 16px; padding: .9rem 1rem; box-shadow: 0 18px 50px rgba(0, 0, 0, .35); }
.mock-alert-2 { margin-right: 2.2rem; opacity: .92; max-width: calc(100% - 2.2rem); }
.mock-head { display: flex; align-items: center; gap: .5rem; font-size: .82rem; color: #4a5872; }
.mock-head strong { color: #0f1b2d; }
.mock-time { margin-left: auto; }
.mock-dot { width: 10px; height: 10px; border-radius: 50%; background: #e89a0c; }
.mock-dot-green { background: #138a4f; }
.mock-title { font-weight: 700; margin: .45rem 0 .2rem; }
.mock-text { margin: 0; font-size: .9rem; color: #4a5872; }
.mock-caption { font-size: .78rem; color: #8ea0c2; margin: 0; }
.section { padding: clamp(2.8rem, 7vw, 5rem) 0; }
.section-alt { background: var(--surface-2); border-block: 1px solid var(--border); }
.section-inner { width: min(1120px, 100%); margin: 0 auto; padding: 0 clamp(1rem, 4vw, 2rem); }
.section-inner.narrow { width: min(820px, 100%); }
.section-heading { font-size: clamp(1.5rem, 3vw, 2.1rem); letter-spacing: -.02em; text-align: center; margin: 0 0 .6rem; }
.section-lead { text-align: center; color: var(--text-2); max-width: 60ch; margin: 0 auto 2rem; }
.feature-grid { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: 1.1rem; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.feature-grid li { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.3rem; box-shadow: var(--shadow); }
.feature-grid h3 { margin: .8rem 0 .35rem; font-size: 1.05rem; }
.feature-grid p { margin: 0; color: var(--text-2); font-size: .95rem; }
.feature-ic { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); }
.feature-ic svg { width: 22px; height: 22px; }
.steps { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: 1.1rem; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); counter-reset: none; }
.steps li { text-align: center; padding: 1rem; }
.steps h3 { margin: .8rem 0 .3rem; }
.steps p { margin: 0; color: var(--text-2); }
.step-n { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--brand); color: #fff; font-weight: 800; font-size: 1.1rem; }
.landing-plans .plan-card h3 { margin: 0; font-size: 1.2rem; }
.faq { display: grid; gap: .7rem; margin-top: 1.6rem; }
.faq details { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: .9rem 1.1rem; }
.faq summary { cursor: pointer; font-weight: 700; list-style-position: outside; }
.faq details[open] summary { margin-bottom: .5rem; }
.faq p { margin: 0; color: var(--text-2); }
.cta-band { background: var(--brand); color: #fff; text-align: center; padding: clamp(2.5rem, 6vw, 4rem) 0; }
.cta-band h2 { color: #fff; margin: 0 0 .5rem; font-size: clamp(1.4rem, 3vw, 2rem); }
.cta-band p { color: #c9d5ec; margin: 0 0 1.4rem; }
/* Clienții noștri: logo-uri alb-negru, color la trecerea mouse-ului / focus */
/* „Clienții noștri” și „Prețuri” au același fundal: fără dublarea spațiului dintre ele (când testimonialele lipsesc) */
#clienti { padding-bottom: clamp(1.5rem, 4vw, 2.5rem); }
#clienti:not(.hidden) + #testimoniale.hidden + #preturi { padding-top: clamp(1.5rem, 4vw, 2.5rem); }
.clients-grid { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: 1.5rem 2rem; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); align-items: center; justify-items: center; }
/* fiecare logo într-o casetă de aceeași mărime; fundalul se alege după luminozitatea logoului (landing.js) */
.client-tile { display: flex; align-items: center; justify-content: center; width: 200px; max-width: 100%; height: 88px; padding: 14px 18px; border-radius: 12px;
  border: 1px solid var(--border); background: var(--surface); transition: border-color .2s ease, transform .2s ease; }
.client-tile.on-dark { background: #13294b; border-color: #13294b; }
.client-tile.on-light { background: #fff; border-color: var(--border); }
.client-tile img { max-width: 100%; max-height: 56px; width: auto; height: auto; object-fit: contain; }
.client-tile .client-name { font-weight: 700; color: #13294b; text-align: center; }
.clients-grid a { display: block; border-radius: 12px; }
.clients-grid a:hover .client-tile, .clients-grid a:focus-visible .client-tile { border-color: var(--accent); transform: translateY(-1px); }

@media (max-width: 900px) {
  .hero-inner { grid-template-columns: minmax(0, 1fr); }
  .hero-visual { justify-items: start; }
  .mock-alert-2 { margin-right: 0; margin-left: 1.5rem; max-width: calc(100% - 1.5rem); }
}
@media (max-width: 700px) {
  /* telefon: logo + „Meniu”; legăturile într-un panou sub antet */
  .landing-head { position: sticky; }
  .menu-toggle { display: inline-flex; }
  .landing-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 0;
    background: var(--brand); padding: .25rem clamp(1rem, 4vw, 2.5rem) 1rem; border-top: 1px solid rgba(255, 255, 255, .12); box-shadow: 0 12px 24px rgba(8, 15, 30, .35); }
  .landing-nav.open { display: flex; }
  .landing-nav a:not(.btn) { justify-content: flex-start; padding: .25rem 0; border-bottom: 1px solid rgba(255, 255, 255, .08); font-size: 1.05rem; }
  .landing-nav a.btn { margin-top: .75rem; min-height: 48px; justify-content: center; font-size: 1rem; }
  .hero-cta .btn { flex: 1 1 100%; }
}
/* Onboarding în aplicație */
.onboarding { border: 2px solid var(--accent); }
.onboarding h2 { margin-top: 0; }
.onboarding-choices { display: grid; gap: .8rem; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); margin: 1rem 0; }
.onboarding-choices button { text-align: left; display: grid; grid-template-columns: minmax(0, 1fr); gap: .25rem; padding: 1rem; height: auto; white-space: normal; align-content: start; justify-content: stretch; justify-items: start; }
.onboarding-choices strong { font-size: 1rem; }
.onboarding-choices span { color: var(--text-2); font-size: .88rem; font-weight: 400; }
/* Administrare logo-uri */
.logo-admin-row { display: grid; grid-template-columns: auto 120px minmax(0, 1fr) auto; gap: .8rem; align-items: center; padding: .7rem; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); }
.logo-admin-row.dragging { opacity: .5; }
.logo-admin-row.inactive { opacity: .6; }
.logo-admin-row .handle { cursor: grab; color: var(--text-3); user-select: none; font-size: 1.2rem; }
.logo-admin-row img { max-width: 120px; max-height: 48px; object-fit: contain; }
.logo-admin-list { display: grid; gap: .5rem; }
@media (max-width: 700px) { .logo-admin-row { grid-template-columns: auto 80px minmax(0, 1fr); } .logo-admin-row .btn-row { grid-column: 1 / -1; } }
.logo-preview { max-width: 240px; max-height: 90px; object-fit: contain; display: block; margin: 0 0 1rem; padding: 8px; border: 1px dashed var(--border-strong); border-radius: var(--radius-sm); background: #fff; }

/* ───────── Agenda, cronologie, notițe ───────── */
.agenda-bar { display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; justify-content: space-between; }
.agenda-bar select { width: auto; min-width: 160px; }
.agenda-date { display: flex; align-items: center; gap: .5rem; font-size: 1.05rem; margin: 0 0 .6rem; }
.agenda-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .4rem; }
.agenda-item { width: 100%; display: grid; grid-template-columns: 4.2rem minmax(0, 1fr); gap: .8rem; align-items: start; text-align: left; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: .7rem .8rem; color: var(--text); font: inherit; cursor: pointer; }
.agenda-item:hover, .agenda-item:focus-visible { border-color: var(--accent); }
.agenda-time { font-weight: 800; font-variant-numeric: tabular-nums; color: var(--accent); }
.agenda-main { display: grid; gap: .2rem; min-width: 0; }
.agenda-obj { color: var(--text-2); font-size: .9rem; overflow-wrap: anywhere; }
.agenda-tags { display: flex; flex-wrap: wrap; gap: .3rem .5rem; align-items: center; }
.hint-list { margin: .6rem 0; padding-left: 1.2rem; color: var(--text-2); font-size: .88rem; }
.timeline.history li.k-solutie::before { background: var(--green); border-color: var(--green); }
.timeline.history li.k-cale_atac::before { background: var(--red); border-color: var(--red); }
.timeline.history li.k-schimbare::before { border-color: var(--text-3); }
.timeline.history li.k-inregistrare::before { background: var(--brand); border-color: var(--brand); }
.notes-box textarea { width: 100%; resize: vertical; }
.grid-2.tight { gap: 0 1rem; }
@media (max-width: 700px) { .grid-2.tight { grid-template-columns: minmax(0, 1fr); } .agenda-bar select { flex: 1 1 100%; } }

/* ───────── Pagina partajată și raportul tipăribil ───────── */
.doc-page { width: min(860px, 100%); margin: 0 auto; padding: 1.5rem clamp(1rem, 4vw, 2rem) 3rem; }
.doc-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; border-bottom: 2px solid var(--brand); padding-bottom: .8rem; margin-bottom: 1rem; }
.doc-head img { height: 32px; }
.doc-meta { font-size: .82rem; color: var(--text-3); text-align: right; }
.doc-page h1 { font-size: 1.5rem; margin: .2rem 0 .8rem; }
.doc-page h2 { font-size: 1.05rem; margin: 1.4rem 0 .6rem; border-bottom: 1px solid var(--border); padding-bottom: .3rem; }
.doc-note { white-space: pre-line; background: var(--surface-2); border-left: 3px solid var(--accent); padding: .6rem .8rem; border-radius: 4px; }
.doc-foot { margin-top: 2rem; font-size: .78rem; color: var(--text-3); border-top: 1px solid var(--border); padding-top: .6rem; }
@media print {
  @page { size: A4; margin: 16mm 14mm; }
  :root { color-scheme: light; --text: #000; --text-2: #222; --text-3: #555; --surface: #fff; --surface-2: #f4f4f4; --border: #ccc; }
  body { background: #fff !important; color: #000; }
  .no-print, .sidebar, .topbar, .bottom-nav, .cookie-notice, .toasts, .page-head .btn-row { display: none !important; }
  .shell, main, .view { display: block !important; padding: 0 !important; margin: 0 !important; }
  .card { box-shadow: none !important; border: 1px solid #ccc !important; break-inside: avoid; }
  .agenda-item { border: none; padding: .2rem 0; background: none; }
  .timeline li { break-inside: avoid; }
  a { color: #000; text-decoration: none; }
  .doc-page { width: 100%; padding: 0; }
}
.doc-actions { margin-bottom: 1rem; }

.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ───────── Editorul de planuri ───────── */
.plan-grid { display: grid; gap: 0 1rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.check-list { display: grid; gap: .4rem; margin: .4rem 0 .8rem; }
.plan-group { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: .6rem .9rem .8rem; margin: 0 0 .8rem; }
.plan-group legend { font-weight: 700; font-size: .88rem; color: var(--text-2); padding: 0 .3rem; }
.check-grid { display: grid; gap: .5rem 1rem; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.limit-grid { display: grid; gap: .6rem; }
.limit-row { display: grid; grid-template-columns: minmax(0, 1fr) 9rem auto; gap: .6rem; align-items: center; }
.limit-label { font-size: .9rem; display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.bullets-editor { display: grid; gap: .5rem; margin-bottom: .8rem; }
.bullet-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .6rem; align-items: center; }
.changes { margin: .6rem 0 0; padding-left: 1.2rem; display: grid; gap: .25rem; font-size: .9rem; overflow-wrap: anywhere; }
@media (max-width: 760px) {
  .plan-grid { grid-template-columns: minmax(0, 1fr); }
  .limit-row { grid-template-columns: minmax(0, 1fr) 7.5rem; }
  .limit-row .check { grid-column: 1 / -1; }
  .bullet-row { grid-template-columns: minmax(0, 1fr); }
}

/* ───────── Telefon și tabletă (≤ 1024 px): ținte de atingere ≥ 44×44 px, text ≥ 16 px în câmpuri ───────── */
.topbar-actions { display: flex; gap: .5rem; align-items: center; }
#menu-toggle { display: none; }
@media (max-width: 1024px) {
  .btn, .btn-sm { min-height: 44px; min-width: 44px; }
  .btn-sm { padding: .45rem .8rem; font-size: .9rem; }
  input, select, textarea { font-size: 16px; min-height: 44px; }
  textarea { font-size: 16px; }
  input[type="checkbox"], input[type="radio"] { width: 22px; height: 22px; min-height: 0; flex: none; }
  .check { min-height: 44px; }
  label.check { margin: 0; }
  .segmented button, .tabs button { min-height: 44px; }
  .brand { min-height: 44px; display: inline-flex; align-items: center; }
  .faq summary { min-height: 44px; display: flex; align-items: center; }
  .public-nav a, .public-foot a, .site-foot a, .auth-links a, .sidebar-foot a { min-height: 44px; min-width: 44px; justify-content: center; display: inline-flex; align-items: center; }
  .pager .btn { min-width: 44px; }
  .dialog-head .btn { min-width: 44px; min-height: 44px; }
  .nav a { min-height: 44px; }
  .agenda-item { min-height: 44px; }
  .hint a, p a, li a, dd a, td a { padding-block: .35rem; }
}
/* Admin pe telefon: meniu pe tot ecranul în loc de bara de jos */
@media (max-width: 900px) {
  .admin-page #menu-toggle { display: inline-flex; }
  .admin-page .sidebar { display: none; }
  .admin-page .main { padding-bottom: calc(1.5rem + env(safe-area-inset-bottom)); }
  .admin-page.menu-open .sidebar {
    display: flex; flex-direction: column; position: fixed; inset: 0; top: calc(3.6rem + env(safe-area-inset-top)); z-index: 60; overflow-y: auto;
    padding: .75rem 1rem calc(1rem + env(safe-area-inset-bottom)); box-shadow: none;
  }
  .admin-page.menu-open .sidebar .nav { flex-direction: column; overflow: visible; }
  .admin-page.menu-open .sidebar .nav a { flex-direction: row; font-size: 1rem; min-width: 0; text-align: left; padding: .7rem .75rem; }
  .admin-page.menu-open .sidebar-foot { display: flex; padding-top: 1rem; }
}
/* PWA instalată (mod standalone): respectăm zonele sigure (notch, bara de gesturi) */
@supports (padding: max(0px)) {
  .public-head { padding-left: max(clamp(1rem, 4vw, 2.5rem), env(safe-area-inset-left)); padding-right: max(clamp(1rem, 4vw, 2.5rem), env(safe-area-inset-right)); }
}
@media (max-width: 900px) {
  @supports (padding: max(0px)) {
    .main { padding-left: max(1rem, env(safe-area-inset-left)); padding-right: max(1rem, env(safe-area-inset-right)); }
  }
}
/* Texte lungi (numere de dosar, nume de părți, obiecte): se rup pe rânduri, nu ies din ecran */
td, dd, .agenda-main, .monitor .title, .monitor .meta, .doc-page, .kv dd { overflow-wrap: anywhere; }
.mono { overflow-wrap: anywhere; }

/* ───────── Subsolul comun (linkuri legale, ANPC SAL, datele firmei) ───────── */
.site-foot { display: grid; gap: .6rem; justify-items: center; text-align: center; padding: 1.4rem 1rem calc(1.4rem + env(safe-area-inset-bottom)); border-top: 1px solid var(--border); font-size: .85rem; color: var(--text-3); background: var(--surface); }
.site-foot .foot-links { display: flex; flex-wrap: wrap; gap: .25rem 1.2rem; justify-content: center; }
.site-foot .foot-links a { color: var(--text-2); }
.site-foot p { margin: 0; max-width: 72ch; overflow-wrap: anywhere; }
.foot-anpc { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: center; }
.anpc-badge { display: inline-block; line-height: 0; border-radius: 4px; }
.anpc-badge img { width: 201px; height: 50px; }
.main-wrap { min-width: 0; display: flex; flex-direction: column; }
.main-wrap > .main { flex: 1; }
.app-foot { margin-top: auto; }
@media (max-width: 900px) {
  .main-wrap > .main { padding-bottom: 1.5rem; }
  .app-foot { padding-bottom: calc(5.5rem + env(safe-area-inset-bottom)); }
  .admin-page .app-foot { padding-bottom: calc(1.4rem + env(safe-area-inset-bottom)); }
}
@media print { .site-foot { display: none; } }
.wa-code { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--border); } .wa-code:empty { display: none; }
.check.consent { align-items: flex-start; gap: .7rem; font-weight: 500; line-height: 1.45; } .check.consent input { margin-top: .15rem; }

/* Prețuri: comutatorul Lunar / Anual și nota de sub preț */
.segmented .seg-hint { display: block; font-size: .72rem; font-weight: 600; color: var(--green); }
/* comutatorul Lunar / Anual: două butoane de aceeași lățime și înălțime */
#interval { display: inline-grid; grid-template-columns: 1fr 1fr; }
#interval button { min-width: 9.5rem; }
.vat-note { margin: .25rem 0 1rem; font-weight: 600; color: var(--text-2); }
.segmented button[aria-checked="true"] .seg-hint { color: inherit; opacity: .9; }
.plan-note { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; margin: -.4rem 0 0; }
.landing-plans { margin-top: 1rem; }
/* Elementele din grile și flex nu pot fi mai înguste decât conținutul lor implicit (min-width: auto):
   le permitem să se micșoreze, iar textele lungi (emailuri, ID-uri, numere de dosar) se rup pe rânduri. */
.card, .grid > *, .grid-2 > *, .grid-3 > *, .stats > *, .btn-row > :not(.btn), .page-head > * { min-width: 0; }
.page-head p, .card h2, .card p, .who { overflow-wrap: anywhere; }
.table-wrap { max-width: 100%; }
/* Pe ecrane înguste, textele lungi din butoane se rup pe rânduri (altfel împing pagina în lateral) */
@media (max-width: 700px) { .btn { white-space: normal; text-align: center; max-width: 100%; } }

/* ───────── Consimțământ cookie-uri ───────── */
.consent-banner {
  position: fixed; z-index: 90; left: max(1rem, env(safe-area-inset-left)); right: max(1rem, env(safe-area-inset-right));
  bottom: calc(1rem + env(safe-area-inset-bottom)); max-width: 720px; margin: 0 auto;
  background: var(--surface); color: var(--text); border: 1px solid var(--border-strong); border-radius: var(--radius); box-shadow: var(--shadow-lg);
  padding: 1rem 1.1rem;
}
.consent-banner.consent-inline { position: static; margin: 0 0 1.5rem; max-width: none; box-shadow: none; }
.consent-banner h2 { font-size: 1rem; margin: 0 0 .35rem; }
.consent-banner p { margin: 0 0 .8rem; font-size: .92rem; color: var(--text-2); }
.consent-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }
.consent-actions .btn { width: 100%; }
.consent-dialog .consent-cat { border-top: 1px solid var(--border); padding: .8rem 0; }
.consent-cat-head .check { gap: .6rem; }
.consent-items { margin: .3rem 0 0; padding-left: 1.1rem; font-size: .85rem; display: grid; gap: .3rem; overflow-wrap: anywhere; }
.link-btn { background: none; border: 0; padding: 0; font: inherit; color: var(--text-2); cursor: pointer; text-decoration: none; }
.link-btn:hover { text-decoration: underline; }
@media (max-width: 900px) { .app-page .consent-banner { bottom: calc(5.2rem + env(safe-area-inset-bottom)); } }
@media (max-width: 560px) { .consent-actions { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 1024px) { .site-foot .link-btn { min-height: 44px; min-width: 44px; display: inline-flex; align-items: center; } }
@media (max-width: 1024px) { details > summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; } }
@media print { .consent-banner { display: none; } }

/* căutări live asincrone: indicatorul global, progresul și „Căutările mele” */
.search-indicator { position: fixed; right: 16px; bottom: 16px; z-index: 45; max-width: calc(100vw - 32px); }
.search-indicator .btn { gap: .4rem; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-height: 44px; box-shadow: 0 6px 20px rgb(0 0 0 / .18); background: var(--surface, #fff); }
.search-indicator .spinner { width: 14px; height: 14px; border-width: 2px; }
.search-head { flex-wrap: wrap; gap: .5rem; }
.search-progress { margin: 0; font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.as-of { flex-basis: 100%; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: .25rem 0 0; }
.search-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .25rem; }
.search-list a { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; padding: .7rem .5rem; border-radius: 8px; color: inherit; text-decoration: none; min-height: 44px; overflow-wrap: anywhere; }
.search-list a:hover { background: var(--accent-soft); }

/* ───────── Statistici (grafice SVG proprii) ───────── */
:root { --viz-1: #2a78d6; --viz-2: #eb6834; --viz-3: #1baf7a; --viz-seq-0: #eef3fb; --viz-seq-1: #c9dcf5; --viz-seq-2: #93b9eb; --viz-seq-3: #5a93dd; --viz-seq-4: #2a78d6; --viz-seq-5: #1b4f93; }
@media (prefers-color-scheme: dark) {
  :root { --viz-1: #3987e5; --viz-2: #d95926; --viz-3: #199e70; --viz-seq-0: #162238; --viz-seq-1: #1c3358; --viz-seq-2: #22487d; --viz-seq-3: #2c62a8; --viz-seq-4: #3987e5; --viz-seq-5: #8db8f2; }
}
.viz-sections { display: grid; gap: 1rem; min-width: 0; }
.viz-card { min-width: 0; }
.viz-card h2 { margin-top: 0; }
.viz-filters { display: grid; gap: .75rem; }
.viz-box { position: relative; min-width: 0; }
.viz { width: 100%; height: auto; display: block; overflow: visible; }
.viz-grid { stroke: var(--border); stroke-width: 1; }
.viz-axis { fill: var(--text-3); font-size: 11px; }
.viz-line { fill: none; stroke: var(--viz-1); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.viz-prev { stroke: var(--text-3); stroke-dasharray: 4 4; }
.viz-area { fill: var(--viz-1); opacity: .12; }
.viz-cursor { stroke: var(--text-3); stroke-width: 1; }
.viz-dot { fill: var(--viz-1); stroke: var(--surface); stroke-width: 2; }
.viz-tip { position: absolute; top: 0; padding: .3rem .55rem; border-radius: 6px; background: var(--text); color: var(--surface); font-size: .8rem; pointer-events: none; white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.viz-bars { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; }
.viz-bars li { display: grid; grid-template-columns: minmax(0, 11rem) minmax(0, 1fr) auto; align-items: center; gap: .6rem; font-size: .88rem; min-height: 28px; border-radius: 6px; }
.viz-bars li.clickable { cursor: pointer; }
.viz-bars li.clickable:hover, .viz-bars li.clickable:focus-visible { background: var(--accent-soft); outline: none; }
.viz-bar-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); }
.viz-bar-track { height: 10px; background: var(--surface-2); border-radius: 4px; overflow: hidden; }
.viz-bar { display: block; height: 100%; background: var(--viz-1); border-radius: 0 4px 4px 0; }
.viz-bar-value { color: var(--text-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.viz-donut { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.viz-donut svg { width: 140px; flex: none; }
.viz-ring { fill: none; stroke-width: 22; transform: rotate(-90deg); transform-origin: 70px 70px; }
.viz-ring.viz-s1, .viz-key.viz-s1 { stroke: var(--viz-1); background: var(--viz-1); }
.viz-ring.viz-s2, .viz-key.viz-s2 { stroke: var(--viz-2); background: var(--viz-2); }
.viz-ring.viz-s3, .viz-key.viz-s3 { stroke: var(--viz-3); background: var(--viz-3); }
.viz-legend { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; font-size: .9rem; }
.viz-key { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: .45rem; vertical-align: -1px; }
.viz-tiles { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 3px; max-width: 520px; }
.viz-tile { aspect-ratio: 1; border-radius: 6px; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: .7rem; line-height: 1.1; color: var(--text); min-width: 0; }
.viz-tile b { font-size: .78rem; }
.viz-tile small { color: inherit; opacity: .85; font-size: .65rem; }
.viz-empty { background: transparent; }
.viz-l0 { background: var(--viz-seq-0); } .viz-l1 { background: var(--viz-seq-1); } .viz-l2 { background: var(--viz-seq-2); }
.viz-l3 { background: var(--viz-seq-3); color: #fff; } .viz-l4 { background: var(--viz-seq-4); color: #fff; } .viz-l5 { background: var(--viz-seq-5); color: #fff; }
.viz-data { margin-top: .75rem; }
.viz-data summary { color: var(--text-2); font-size: .88rem; }
.kpi-delta { display: block; font-size: .78rem; margin-top: .2rem; color: var(--text-2); }
.kpi-delta.up { color: var(--green); } .kpi-delta.down { color: var(--red); }
.live-dot::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--green); margin-right: .4rem; animation: pulse 1.6s infinite; }
@keyframes pulse { 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .live-dot::before { animation: none; } }
.live-lists { margin-top: .75rem; }
.vitals { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.vitals li { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; }
.funnel { list-style: none; margin: 0; padding: 0; display: grid; gap: .4rem; }
.funnel li { display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem; }
.funnel-step { min-width: 9rem; color: var(--text-2); }
.filter-chips:empty { display: none; }
@media (max-width: 700px) {
  .viz-bars li { grid-template-columns: minmax(0, 1fr) auto; }
  .viz-bar-track { grid-column: 1 / -1; grid-row: 2; }
  .viz-tile small { display: none; }
}
@media (max-width: 1024px) { .viz-bars li.clickable { min-height: 44px; } .viz-card .link-btn { min-height: 44px; min-width: 44px; display: inline-flex; align-items: center; } }

/* documentația API */
.api-op h3 { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: 0 0 .4rem; overflow-wrap: anywhere; }
.api-op code { overflow-wrap: anywhere; }
.api-get { background: var(--accent-soft); color: var(--accent); }
.api-post { background: var(--green-soft); color: var(--green); }
.api-delete { background: var(--red-soft); color: var(--red); }

/* explicația AI */
.ai-box { display: grid; gap: .6rem; }
.ai-text { background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: .8rem 1rem; }
.ai-text p { margin: 0 0 .6rem; overflow-wrap: anywhere; }
.ai-text p:last-child { margin-bottom: 0; }
.ai-progress { display: flex; align-items: center; gap: .5rem; margin: 0; }
.ai-vote[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-soft); }

/* Administrare → Plăți (Paddle) */
.copy-row { display: flex; gap: .5rem; align-items: stretch; min-width: 0; }
.copy-row input { flex: 1 1 auto; min-width: 0; }
.copy-row .btn { flex: none; white-space: nowrap; }
.btn-row.wa-actions { margin-top: 1rem; }
.key-status { display: inline-flex; flex-wrap: wrap; gap: .35rem; align-items: center; }

/* Abonamentul din cont: acțiuni de aceeași mărime, pe rânduri egale */
.billing-actions { display: grid; gap: .6rem; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); margin-top: .75rem; }
.billing-actions > .btn { width: 100%; justify-content: center; }
.invoice-list { margin-top: .75rem; }

/* Formularele de autentificare (autentificare, cont nou, resetare, parolă nouă, 2FA): același ritm vertical,
   butoane de aceeași mărime, legătura secundară centrată, cu țintă de atingere de 44 px */
.auth-card form { display: flex; flex-direction: column; gap: .9rem; }
.auth-card form > .field, .auth-card form > .ts, .auth-card form > p { margin: 0; }
.auth-card form > .ts:empty { display: none; }
.auth-card .btn-block { min-height: 44px; width: 100%; justify-content: center; }
.auth-card .form-alt { display: flex; justify-content: center; margin: 0; }
.auth-card .form-alt a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 .75rem; font-size: .9rem; }
.auth-card .ts-error { margin-top: 0; justify-content: space-between; }
.auth-card #msg:not(.hidden) { margin-bottom: .9rem; }
.pw-row { display: flex; gap: .5rem; align-items: stretch; }
.pw-row input { flex: 1 1 auto; min-width: 0; }
.pw-row .pw-toggle { flex: none; min-width: 6.5rem; min-height: 44px; justify-content: center; }
.auth-card .remember .check { min-height: 44px; cursor: pointer; }
.auth-card .remember .hint { margin-top: 0; }

/* În grile, cardurile vecine pornesc de la aceeași înălțime (fără margin-top de la „.card + .card”) și au aceeași înălțime pe rând */
.grid > .card, .grid-2 > .card, .grid-3 > .card { margin-top: 0; align-self: stretch; }

/* Instalarea ca aplicație: butonul din meniuri și indicația pentru iPhone/iPad */
.install-btn[hidden] { display: none !important; }
.sidebar-foot .install-btn { width: 100%; justify-content: center; margin-bottom: .5rem; }
.install-hint { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 60; display: flex; gap: .75rem; align-items: center; justify-content: space-between;
  padding: .75rem 1rem; background: var(--surface); color: var(--text); border: 1px solid var(--border-strong); border-radius: var(--radius); box-shadow: var(--shadow); }
.install-hint p { margin: 0; font-size: .9rem; }
.install-hint .btn { flex: 0 0 auto; min-height: 44px; }

/* Sugestia pentru ReJust: eticheta deasupra, termenii într-o casetă, butonul centrat vertical și aliniat la dreapta */
.suggestion-row { display: flex; align-items: center; justify-content: space-between; gap: .75rem 1rem; margin: .75rem 0; padding: .75rem 1rem;
  border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface-2, var(--surface)); }
.suggestion-body { display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
.suggestion-row .caption { font-size: .75rem; font-weight: 700; letter-spacing: .03em; color: var(--text-3); }
.suggestion-row .suggestion { font-weight: 600; color: var(--text); overflow-wrap: anywhere; }
.suggestion-row > .btn { flex: 0 0 auto; }
@media (max-width: 600px) { .suggestion-row { flex-direction: column; align-items: stretch; } .suggestion-row > .btn { width: 100%; justify-content: center; } }

/* Formulare din carduri: același ritm vertical (câmpuri, rânduri de câmpuri, acțiuni) */
.form-stack { display: flex; flex-direction: column; gap: .9rem; }
.form-stack > .field, .form-stack > .grid-2, .form-stack > .grid-3 { margin: 0; }
.form-stack .form-actions { margin: 0; align-items: center; }
.form-stack .form-actions .btn { min-height: 44px; }
.chips { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0; padding: 0; list-style: none; }
.chips:empty { display: none; }
.chip { display: inline-flex; align-items: center; min-height: 28px; padding: 0 .65rem; border-radius: 999px; font-size: .82rem; font-weight: 600;
  background: var(--accent-soft, var(--surface-2, var(--surface))); color: var(--text); border: 1px solid var(--border); }

/* Căutare pe telefon: butoanele unul sub altul, pe toată lățimea și de aceeași înălțime */
@media (max-width: 520px) {
  .search-actions { flex-direction: column; align-items: stretch; flex-wrap: nowrap; }
  .search-actions > .btn { width: 100%; justify-content: center; flex: 0 0 auto; height: auto; }
}

/* Coloana de acțiuni din tabele: antet, aliniere la dreapta, casetă de lățime fixă cu conținutul centrat */
th.actions, td.actions { text-align: right; width: 1%; white-space: nowrap; }
td.actions .actions-box > * { margin: 0; }
td.actions .actions-box { display: inline-flex; justify-content: center; align-items: center; gap: .4rem; min-width: 9.5rem; }
td.actions .actions-box > .btn, td.actions .actions-box > .badge { min-height: 36px; }
td.actions .actions-box > .btn-row { flex-wrap: nowrap; justify-content: center; }
@media (max-width: 700px) {
  table.stack td.actions { text-align: left; padding-top: .6rem; }
  table.stack td.actions .actions-box { display: flex; width: 100%; min-width: 0; }
  table.stack td.actions .actions-box > .btn, table.stack td.actions .actions-box > .btn-row, table.stack td.actions .actions-box > .badge { flex: 1 1 auto; justify-content: center; min-height: 44px; }
}
/* Subsolul unui card (acțiuni după un tabel sau o listă): spațiu standard deasupra, aliniat ca restul subsolurilor */
.card-foot { margin-top: 1rem; justify-content: flex-start; }

/* Pe ecrane înguste, grupurile de butoane din carduri se așază unul sub altul, pe toată lățimea, ca toate să păstreze
   înălțimea standard (un text lung nu mai trece pe două rânduri lângă un buton scurt) */
@media (max-width: 520px) {
  .card .btn-row:has(> .btn + .btn) { flex-direction: column; align-items: stretch; }
  .card .btn-row:has(> .btn + .btn) > .btn { width: 100%; justify-content: center; }
}

/* Contul: categoriile de setări (meniul lateral pe desktop; pagina „Cont” cu lista pe telefon) */
.nav-group { display: flex; flex-direction: column; gap: .1rem; margin: .1rem 0 .4rem 2.4rem; }
.nav-group .nav-sub { font-size: .86rem; padding: .35rem .6rem; min-height: 0; }
@media (max-width: 900px) { .nav-group { display: none; } }
.account-list { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr)); margin-bottom: 1rem; }
.account-link { display: flex; align-items: center; gap: .9rem; margin: 0; color: inherit; text-decoration: none; min-height: 72px; }
.account-link:hover { border-color: var(--accent); text-decoration: none; }
.account-link .ic svg { width: 22px; height: 22px; }
.account-link-text { display: flex; flex-direction: column; gap: .15rem; flex: 1 1 auto; min-width: 0; }
.account-link .chev { font-size: 1.4rem; color: var(--text-3); }
.back-link { display: none; }
@media (max-width: 900px) { .back-link { display: inline-flex; } }

/* Meniul administrării pe grupuri */
.nav .nav-label { display: block; margin: .9rem .75rem .3rem; font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: rgba(255, 255, 255, .55); }
.nav .nav-label:first-child { margin-top: .2rem; }
@media (max-width: 900px) { .nav .nav-label { display: none; } .admin-page.menu-open .sidebar .nav .nav-label { display: block; } }
/* pe telefon și tabletă, butoanele din coloana de acțiuni păstrează ținta de atingere de 44 px */
@media (max-width: 1024px) { td.actions .actions-box > .btn, td.actions .actions-box > .btn-row > .btn { min-height: 44px; } }
/* tabletă cu meniul lateral vizibil: sub-linkurile contului au și ele ținta de atingere de 44 px */
@media (max-width: 1024px) { .nav-group .nav-sub { min-height: 44px; display: flex; align-items: center; } }

/* „Cum funcționează”: trei carduri egale, centrate, legate printr-o linie; pe telefon una sub alta, cu linie verticală */
.section-lead { text-align: center; color: var(--text-2); max-width: 46rem; margin: 0 auto 2rem; font-size: 1.05rem; }
.how-steps { list-style: none; margin: 0 auto; padding: 0; display: grid; gap: 2rem; grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1040px; position: relative; }
.how-card { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: .6rem; padding: 2rem 1.4rem 1.6rem;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); height: 100%; }
.how-card h3 { margin: .2rem 0 0; font-size: 1.15rem; }
.how-card p { margin: 0; color: var(--text-2); font-size: 1rem; line-height: 1.55; }
.how-n { position: absolute; top: -18px; left: 50%; transform: translateX(-50%); display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%;
  background: var(--accent); color: #fff; font-weight: 800; font-size: 1rem; box-shadow: 0 0 0 4px var(--surface-2); }
.how-ic { width: 44px; height: 44px; color: var(--accent); margin-top: .4rem; }
.how-chips { list-style: none; margin: auto 0 0; padding: .6rem 0 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; }
.how-chips li { font-size: .8rem; font-weight: 600; padding: .25rem .65rem; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--border); color: var(--text-2); }
/* legătura dintre pași (desktop): o săgeată discretă între carduri */
.how-card + .how-card::before { content: ""; position: absolute; top: 50%; left: calc(-2rem + 6px); width: calc(2rem - 12px); height: 2px; background: var(--border-strong); }
.how-card + .how-card::after { content: ""; position: absolute; top: calc(50% - 5px); left: -12px; border: 6px solid transparent; border-left-color: var(--border-strong); }
.how-cta { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; margin-top: 2.2rem; }
.how-cta .btn { min-width: 12rem; min-height: 44px; }
@media (max-width: 860px) {
  .how-steps { grid-template-columns: minmax(0, 1fr); max-width: 520px; gap: 2.4rem; }
  .how-card + .how-card::before { top: calc(-2.4rem + 6px); left: 50%; width: 2px; height: calc(2.4rem - 22px); }
  .how-card + .how-card::after { display: none; }
}
@media (max-width: 520px) { .how-cta { flex-direction: column; align-items: stretch; } .how-cta .btn { width: 100%; } }

/* Prețuri: tabelul comparativ complet (toate funcțiile și limitele din registru) */
.pricing-compare { width: min(1120px, 100%); margin: 2.5rem auto 1.5rem; }
.pricing-compare > h2 { text-align: center; margin: 0 0 .4rem; }
.compare-group { margin-top: 1.2rem; }
.pricing-compare th:not(:first-child), .pricing-compare td.compare-val { text-align: center; white-space: nowrap; }
.pricing-compare td.primary { width: 40%; }
.pricing-compare .yes { color: var(--green); font-weight: 800; }
.compare-mobile { display: none; }
/* comutatorul de planuri (telefon): coloane egale; pe ecrane înguste, două rânduri a câte două (numele nu se taie) */
.compare-pick { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); width: 100%; margin: 1rem 0 .4rem; }
.compare-pick button { min-width: 0; min-height: 44px; padding-inline: .4rem; }
@media (max-width: 440px) {
  .compare-pick { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .compare-pick button:nth-child(odd) { border-left: 0; }
  .compare-pick button:nth-child(n + 3) { border-top: 1px solid var(--border-strong); }
}
.compare-list { display: grid; grid-template-columns: minmax(0, 1fr) auto; margin: 0; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); }
.compare-list dt, .compare-list dd { margin: 0; padding: .65rem .9rem; border-top: 1px solid var(--border); }
.compare-list dt:first-of-type, .compare-list dt:first-of-type + dd { border-top: 0; }
.compare-list dd { text-align: right; font-weight: 700; white-space: nowrap; }
@media (max-width: 700px) {
  .compare-desktop { display: none; }
  .compare-mobile { display: block; }
}

/* antetul comun nu apare în rapoartele tipărite / PDF */
@media print { .site-head { display: none !important; } }

/* Plata: magazinul (pay2) într-o fereastră modală; pe telefon ocupă tot ecranul (regula generală a dialogurilor) */
dialog.pay-dialog { width: min(620px, calc(100vw - 2rem)); height: min(900px, calc(100dvh - 2rem)); }
dialog.pay-dialog[open] { display: flex; flex-direction: column; overflow: hidden; }
dialog.pay-dialog .dialog-body { flex: 1 1 auto; min-height: 0; padding: 0; display: flex; }
.pay-frame { flex: 1 1 auto; width: 100%; height: 100%; min-height: 420px; border: 0; background: #fff; }
dialog.pay-dialog .dialog-foot { align-items: center; }
dialog.pay-dialog .pay-status { flex: 1 1 14rem; margin: 0; }
@media (max-width: 700px) { dialog.pay-dialog { width: 100vw; height: 100dvh; max-height: 100dvh; } .pay-frame { min-height: 0; } }
.plan-current { position: absolute; top: -.7rem; right: 1rem; }
.plans-chooser .segmented { margin: .5rem 0 .8rem; }
.chooser-list { display: grid; gap: .6rem; }
.chooser-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .8rem 1rem; border: 1px solid var(--border); border-radius: var(--radius); }
.chooser-row .plan-cta { width: auto; min-width: 11rem; min-height: 44px; }
.chooser-row .plan-current { position: static; transform: none; }
@media (max-width: 700px) { .chooser-row { flex-direction: column; align-items: stretch; } .chooser-row .plan-cta { width: 100%; } }

/* Cont: îndemnul de cumpărare pentru cine nu are abonament plătit */
.upgrade-card { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; border-color: color-mix(in srgb, var(--accent) 45%, var(--border)); }
.upgrade-card p { margin: .2rem 0 0; }
.upgrade-card .btn { min-height: 44px; }
@media (max-width: 700px) { .upgrade-card .btn { width: 100%; justify-content: center; } }