/* ============================================================================
   42-dividende.css · GRUPUL 5 · antetul de grup + „Dividende"
   namespace `xdv`   PREVIEW

   ⚠⚠ ZERO VALORI INVENTATE. Ancorele:
        20-grup2.css:45-66        `.xgh` — antetul de grup. Se REFOLOSESTE.
        20-grup2.css:82-99        titlu de sectiune, lede, card, titlu de card
        20-grup2.css:130-137      lista cu separator `--xsep`
        22-fair-value.css:71-77   `.xfv__badge` / `.xfv__chip` — pastila si aerul ei
        24-proiectii.css:109-114  `.xpj__mc` — celula de metrica
        34-financiare.css         tabelul: antet, randuri, cifre tabulare
        36-raportari.css          bento pe sase coloane
        38-riscuri.css            grila de celule si fereastra de ajutor
        verdict.css:345-357       `scroll-margin-top` 78 / 82px

   ⚠ `xdv` e namespace NOU. Ocupate: xhd xhd2 xvd xvm xvp xar xgh xan xfv xpj
     xab xdp xaf xfn xrp xrs xcz.
   ============================================================================ */

/* ══ ANTETUL GRUPULUI 5 ═════════════════════════════════════════════════════
   ⚠ `.xgh` se refoloseste, ca la grupurile 3 si 4. Distanta deasupra e aceeasi —
     62px mobil / 88px desktop, cifrele masurate din `14-argumente.css:163`.
   ⚠ FARA PASTILA DE SCOR, decizia sectiunii vechi: `dividende` nu e dimensiune
     in `dimension_scorecard`, ci componenta a lui `fundamental` SI pilon, cu
     doua valori diferite. Pilonul apare deja in antetul grupului 3. */
/* ⚠ Distanta deasupra antetului de grup NU MAI E AICI: sta o singura data,
   pe `.xgh` (`20-grup2.css`), cu marimea din `--xsp-grup` (`00-shell.css`).
   Erau sapte reguli identice in sapte fisiere, iar antetul primului grup —
   singurul fara clasa proprie — ramasese pe dinafara, cu distanta ZERO. */
.xdv__gh{ overflow-x:clip; }

/* ══ SECTIUNEA ══════════════════════════════════════════════════════════════ */
.xdv{ font-family:var(--xf); color:var(--xc-ink); letter-spacing:-.004em;
  margin-top:var(--xsp-sec,39px); overflow-x:clip; }
.xdv *{ box-sizing:border-box; }

/* ⚠⚠ TITLUL E ALB. Masurat pe randarea veche: `rgb(48,213,200)` — sectiunea
   porneste banda cu `var(--teal)`, iar `mds-design.css:417` da
   `.ch__t{color:var(--c)}`. Culoarea trece pe pastila.
   ⚠ Titlul NU e flex: pastila sta pe un rand propriu dedesubt, deci
     `::first-letter` se aplica direct pe `<h3>`. */
.xdv__t{ margin:0; font-size:var(--xt-3); font-weight:700;
  line-height:1.15; letter-spacing:-.022em; color:var(--xc-ink); }
.xdv__t::first-letter{ text-transform:uppercase; }
/* invelisul pastilei · `.xfv__badge--h` (22-fair-value.css:71-73) */
.xdv__badge{ display:flex; flex-wrap:wrap; align-items:center; gap:9px 12px;
  margin:14px 0 0; }
.xdv__chip{ flex:none; display:inline-flex; align-items:baseline; gap:7px;
  padding:5px 12px; border-radius:var(--xr-p);
  background:color-mix(in srgb, var(--bc) 16%, transparent);
  color:var(--bc); font:600 var(--xt-7)/1.2 var(--xf); font-variant-numeric:tabular-nums;
  letter-spacing:0; }
.xdv__chip em{ font-style:normal; font-weight:500; font-size:var(--xt-8);
  color:color-mix(in srgb, var(--bc) 78%, var(--xc-ink)); }
.xdv__lede{ margin:14px 0 0; font:400 var(--xf-sm)/1.55 var(--xf);
  letter-spacing:-.006em; color:var(--xc-ink); }

/* ══ BENTO · doua carduri ═══════════════════════════════════════════════════
   ⚠ Cardul de metrici are cinci celule, cel de istoric o lista si un tabel de
     opt randuri. `align-items:start`, ca cel mic sa nu ramana gol pe jumatate. */
.xdv__bento{ display:grid; grid-template-columns:repeat(6,1fr); gap:12px;
  margin:22px 0 0; align-items:start; }
.xdv__bento > *{ grid-column:span 6; min-width:0; }

/* ⚠ `--m` (metrici) si `--i` (istoric) n-au reguli proprii: exista ca sa se
   poata tinti in viitor fara sa se schimbe marcajul, si ca sa se citeasca in
   DOM care card e care. Le declar aici ca sa nu para clase orfane. */
.xdv__card--m,.xdv__card--i{ /* fara reguli proprii, deocamdata */ }
.xdv__card{ min-width:0; display:block; background:var(--xs-card);
  border-radius:28px; padding:26px 24px 28px; box-shadow:var(--xe-lift);
  scroll-margin-top:78px; }

/* ── celulele de metrica ───────────────────────────────────────────────────
   ⚠ Doua pe rand pana la 1400px de container, patru peste — acelasi prag scris
     ca la grupul 4 (38-riscuri.css), si din acelasi motiv: `auto-fit` e monoton
     si ar fi trecut prin 3, lasand o celula singura pe randul al doilea. */
.xdv__tri{ min-width:0; display:grid; gap:10px; margin:0;
  grid-template-columns:repeat(2, minmax(0, 1fr)); }
.xdv__c{ position:relative; min-width:0; padding:15px 16px;
  border-radius:var(--xr-i); background:var(--xs-inset); }
.xdv__cl{ display:block; font:500 var(--xf-sm)/1.4 var(--xf); color:var(--xc-ink2); }
.xdv__cv{ display:block; margin-top:2px; font:600 var(--xt-5)/1.1 var(--xf);
  letter-spacing:-.014em; font-variant-numeric:tabular-nums; color:var(--xc-ink); }

/* ── fereastra de ajutor · pur CSS ─────────────────────────────────────────
   ⚠⚠ CLASA E `xdv__rt`, NU `xdv__t`: `xdv__t` e TITLUL DE SECTIUNE. Am facut
      greseala asta de trei ori (`xaf__t`, `xrs__t`, era s-o fac si la `xcz`);
      o scriu inainte, nu dupa.
   ⚠ `name` si `id` poarta `uid`-ul per activ, deci CSS-ul nu se leaga de niciun
     id (R7). Sectiunea veche foloseste `dv-fx`, id fix in tot documentul. */
.xdv__rt{ position:absolute; opacity:0; pointer-events:none; }
.xdv__lb{ display:block; cursor:pointer; }
.xdv__x{ display:none; }
.xdv__tip{ display:none; }
.xdv__rt:checked ~ .xdv__x{ display:block; position:fixed; inset:0; z-index:8; }
.xdv__rt:checked ~ .xdv__tip{ display:block; position:relative; z-index:9;
  margin:12px 0 0; padding:13px 14px; border-radius:14px; background:var(--xs-track);
  font:400 var(--xt-7)/1.5 var(--xf); color:var(--xc-ink2); }
.xdv__tip b{ display:block; margin-bottom:5px; color:var(--xc-ink); font-weight:600; }
/* ⚠⚠ ICONITA „i" · REGULA UNICA, ACEEASI IN TOATE SECTIUNILE.
   MASURAT inainte: patru fisiere aveau patru reguli diferite si iconita cadea
   la +13px in Bilant, +5px in Context, +3px la Piata si 0 la Profiluri, fata de
   centrul textului. In plus, sarea in aceeasi sectiune (+13 vs +3, +5 vs +25)
   cand eticheta se rupea pe doua randuri.
   `vertical-align:middle` aliniaza mijlocul cutiei cu linia de baza PLUS
   jumatate din inaltimea literei mici — adica exact centrul optic al textului.
   E singura valoare care nu depinde de corpul de litera al etichetei, deci tine
   la 13,5px, la 15,5px si la 17px la fel.
   ⚠ `inline-block`, nu `inline-flex`: linia de baza a unei cutii flex se ia de
     la primul ei element, iar aici continutul vine dintr-un `::before` — de aia
     `baseline` dadea rezultate imprevizibile. */
.xdv__i{ display:inline-block; width:15px; height:15px; margin-left:6px;
  border-radius:50%; background:var(--xs-track); color:var(--xc-ink3);
  font:700 10px/15px var(--xf); font-style:normal; text-align:center;
  vertical-align:middle; }
.xdv__i::before{ content:"i"; }
.xdv__rt:checked ~ .xdv__lb .xdv__i{ background:var(--xc-ink); color:var(--xc-bg); }

/* ── lista de detalii ── */
/* titlu de card · aceeasi treapta ca `.xan__ct` / `.xfv__ct` / `.xpj__ct` */
.xdv__ct{ margin:0 0 16px; font-weight:600;
  font-size:var(--xt-4); line-height:1.25;
  letter-spacing:-.012em; color:var(--xc-ink); }
.xdv__ct::first-letter{ text-transform:uppercase; }

.xdv__kv{ list-style:none; margin:0; padding:0; }
.xdv__kv li{ display:flex; align-items:baseline; justify-content:space-between;
  gap:18px; padding:11px 0; font:400 var(--xf-sm)/1.4 var(--xf); color:var(--xc-ink2); }
.xdv__kv li + li{ background:var(--xsep) no-repeat top/100% 1px; }
.xdv__kv li > span::first-letter{ text-transform:uppercase; }
.xdv__kv b{ flex:none; color:var(--xc-ink); font-weight:600;
  font-variant-numeric:tabular-nums; text-align:right; }

/* ── tabelul de plati, re-imbracat ─────────────────────────────────────────
   ⚠ Marcajul e al temei (`mds_dv_tabel_istoric()`), cu clasele `.tbl .dv__tbl`
     si culorile inline pe `var(--pink)` / `var(--lime)`, care se rezolva pe
     `.mdsx`. Se re-imbraca de aici, la (0,3,0) — `.mdsx .xdv .dv__tbl` bate
     `.mdsx .tbl` indiferent de ordinea de tiparire (R5). Nu se atinge tema.
   ⚠ `overflow-x:auto` pe inveli|s: trei coloane incap pe 302px, dar la o moneda
     cu sume lungi nu mai incap, si atunci deruleaza tabelul, nu pagina (R29). */
.xdv__sc{ overflow-x:auto; margin:18px 0 0; scrollbar-width:none; }
.xdv__sc::-webkit-scrollbar{ display:none; }
.mdsx .xdv .dv__tbl{ width:100%; border-collapse:collapse;
  font-variant-numeric:tabular-nums; }
.mdsx .xdv .dv__tbl th{ padding:0 0 10px; text-align:right;
  font:600 var(--xt-8)/1 var(--xf); letter-spacing:.06em; text-transform:uppercase;
  color:var(--xc-ink3); white-space:nowrap; }
.mdsx .xdv .dv__tbl th:first-child{ text-align:left; }
.mdsx .xdv .dv__tbl td{ padding:11px 0; text-align:right;
  font:500 var(--xf-sm)/1.35 var(--xf); color:var(--xc-ink); white-space:nowrap; }
.mdsx .xdv .dv__tbl td:first-child{ text-align:left; color:var(--xc-ink2); }
.mdsx .xdv .dv__tbl tbody tr + tr td{ background:var(--xsep) no-repeat top/100% 1px; }

/* disclaimerul temei, in registrul sectiunii */
.mdsx .xdv .mds-disc{ margin:16px 0 0; padding:0; background:none;
  font:400 var(--xt-7)/1.5 var(--xf); color:var(--xc-ink3); }

/* ── plierea tabelului de plati ────────────────────────────────────────────
   ⚠ TREI RANDURI VIZIBILE, restul la buton, la AMBELE latimi. Clasa
     `.xdv__extra` e injectata in marcajul TEMEI de `x-dividende.php`, sub paza:
     daca numarul de randuri nu iese, nu se injecteaza nimic si butonul nu apare.
   ⚠ Caseta e FRATE cu invelisul tabelului: selectorul e `~`.
   ⚠ `display:none` pe randuri, nu `max-height`: aici nu e un bloc de text care
     se taie, ci randuri de tabel. */
.xdv__ft{ position:absolute; opacity:0; pointer-events:none; }
.xdv__ft:not(:checked) ~ .xdv__sc .xdv__extra{ display:none; }
/* ⚠ `overflow-anchor` — la inchidere, randurile dispar si pagina ar ramane mai
   jos. Tiparul temei, `raportari.css:578`. `mds-xdp.js` duce restul. */
.xdv__extra{ overflow-anchor:none; }
/* ⚠ BUTOANELE SI TABURILE COBOARA O TREAPTA: `--xt-7` (13,5px), nu `--xf-sm`
   (15,5px). 24 din cele 29 stateau exact la marimea prozei pe care o
   intrerup, si la 600 — adica strigau mai tare decat ce scria in ele.
   Cutia ramane neatinsa (44px inaltime, acelasi padding), deci se apasa la
   fel de usor cu degetul. */
.xdv__fx{ overflow-anchor:auto; }
.xdv__fx{ display:flex; align-items:center; justify-content:center; gap:9px;
  width:100%; margin:16px 0 0; padding:13px 16px; min-height:44px;
  border-radius:12px; background:var(--xs-inset);
  font:600 var(--xt-7)/1 var(--xf); color:var(--xc-ink); cursor:pointer;
  transition:background .15s ease; }
.xdv__fx:hover{ background:#141417; }
.xdv__fx::after{ content:""; width:9px; height:9px;
  border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  transform:translateY(-3px) rotate(45deg); transition:transform .18s ease; }
.xdv__ft:checked ~ .xdv__fx{ background:transparent; color:var(--xc-ink2); }
.xdv__ft:checked ~ .xdv__fx::after{ transform:translateY(2px) rotate(-135deg); }
.xdv__fb{ display:none; }
.xdv__ft:checked ~ .xdv__fx .xdv__fa{ display:none; }
.xdv__ft:checked ~ .xdv__fx .xdv__fb{ display:block; }

@media (prefers-reduced-motion:reduce){
  .xdv__fx,.xdv__fx::after{ transition:none; }
}

/* ⚠ SEPARATORUL DE SUB SECTIUNE, ca la `20-grup2.css:203`. */
.mdsx .xdv + .band{ border-top:0; background-image:none; }

/* ══ DESKTOP · pragul temei, pe CONTAINER (20-grup2.css:207) ══ */
@container mdsx (min-width:900px){
  .xdv__card{ border-radius:var(--xr-c); padding:29px 31px 31px; scroll-margin-top:82px; }
  .xdv__bento{ gap:13px; }
  .xdv__bento > *{ grid-column:span 3; }
  .xdv__bento:has(> :only-child) > *{ grid-column:span 6; }
  .xdv__tri{ gap:11px; }
}

@container mdsx (min-width:1400px){
  /* patru celule pe un rand, cand chiar e loc */
  .xdv__tri{ grid-template-columns:repeat(4, minmax(0, 1fr)); }
}