/* Portal cabinet — stil minimalist, responsive (folosit și pe telefon). Bază: aplicația de taxe. */

:root {
  --fundal: #f4f5f7;
  --card: #ffffff;
  --text: #1f2430;
  --text-slab: #6b7280;
  --accent: #1d4ed8;
  --accent-inchis: #163aa0;
  --ok: #15803d;
  --ok-fundal: #dcfce7;
  --atentie: #b45309;
  --atentie-fundal: #fef3c7;
  --pericol: #b91c1c;
  --linie: #e5e7eb;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  background: var(--fundal);
  color: var(--text);
}

.wrap { max-width: 1060px; margin: 0 auto; padding: 0 16px; }

/* ---- antet ---- */
.topbar { background: #111827; color: #fff; }
.topbar .wrap { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; padding-top: .6rem; padding-bottom: .6rem; }
.brand { font-weight: 700; letter-spacing: .02em; color: #fff !important; padding-left: 0 !important; }
.topbar nav { display: flex; gap: .25rem; flex-wrap: wrap; }
.topbar a { color: #d1d5db; text-decoration: none; padding: .35rem .7rem; border-radius: 6px; }
.topbar a:hover { background: #1f2937; color: #fff; }
.topbar a.activ { background: var(--accent); color: #fff; }

main { padding: 1.2rem 16px 2rem; }
h1 { font-size: 1.45rem; margin: .4rem 0 1rem; }
h1 .an { color: var(--text-slab); font-weight: 400; font-size: 1.1rem; }
h2 { font-size: 1.05rem; margin: 0 0 .8rem; }

/* ---- carduri ---- */
.card {
  background: var(--card);
  border: 1px solid var(--linie);
  border-radius: 10px;
  padding: 1rem 1.1rem;
  margin-bottom: 1.1rem;
}
.coloane { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; align-items: start; }
@media (max-width: 860px) { .coloane { grid-template-columns: 1fr; } }

/* ---- KPI ---- */
.kpi-rand { display: grid; grid-template-columns: repeat(4, 1fr); gap: .8rem; margin-bottom: 1.1rem; }
@media (max-width: 860px) { .kpi-rand { grid-template-columns: repeat(2, 1fr); } }
.kpi {
  background: var(--card);
  border: 1px solid var(--linie);
  border-radius: 10px;
  padding: .7rem .9rem;
  display: flex; flex-direction: column; gap: .15rem;
}
.kpi-eticheta { font-size: .78rem; color: var(--text-slab); text-transform: uppercase; letter-spacing: .03em; }
.kpi-valoare { font-size: 1.15rem; font-weight: 700; white-space: nowrap; }

/* ---- Personal Taxe ---- */
.card-personal-taxe { border-top: 3px solid var(--accent); }
.sold-mare { font-size: 2rem; font-weight: 800; margin: .2rem 0 0; }
.sold-sub { margin: 0 0 .9rem; color: var(--text-slab); font-size: .9rem; }
.descompunere { border: 1px dashed var(--linie); border-radius: 8px; padding: .6rem .8rem; margin-bottom: .8rem; }
.rand-suma { display: flex; justify-content: space-between; gap: 1rem; padding: .25rem 0; }
.rand-accent { background: var(--atentie-fundal); border-radius: 8px; padding: .5rem .8rem; margin: .6rem 0; font-size: 1.05rem; }

.tabel-simplu { width: 100%; border-collapse: collapse; font-size: .92rem; margin-top: .4rem; }
.tabel-simplu td { padding: .3rem 0; border-bottom: 1px solid var(--linie); }
.tabel-simplu tr:last-child td { border-bottom: 0; }

/* ---- tabele ---- */
.scroll-x { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: .95rem; }
th, td { text-align: left; padding: .5rem .6rem; border-bottom: 1px solid var(--linie); vertical-align: top; }
th { font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; color: var(--text-slab); }
td.nr, th.nr { text-align: right; white-space: nowrap; }
tr.inactiv td { color: var(--text-slab); }
tr.platit td { color: var(--text-slab); }
tr.restanta td { background: #fffbeb; }
small { color: var(--text-slab); }

/* ---- formulare ---- */
.formular label { display: flex; flex-direction: column; gap: .25rem; font-size: .9rem; font-weight: 600; }
.formular small { font-weight: 400; }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem 1rem; }
.grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem 1rem; }
@media (max-width: 720px) { .grid2, .grid3 { grid-template-columns: 1fr; } .col2, .col3 { grid-column: auto; } }
.col2 { grid-column: span 2; }
.col3 { grid-column: span 3; }

input, select, textarea, button {
  font: inherit;
  padding: .5rem .6rem;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  background: #fff;
  color: var(--text);
  max-width: 100%;
}
input:focus, select:focus, textarea:focus { outline: 2px solid var(--accent); outline-offset: 1px; }

button {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
  cursor: pointer;
  font-weight: 600;
}
button:hover { background: var(--accent-inchis); }
.btn-secundar {
  display: inline-block; padding: .5rem .8rem; border: 1px solid #cbd5e1;
  border-radius: 7px; text-decoration: none; color: var(--text); background: #fff;
}
.btn-link {
  background: none; border: none; color: var(--accent); padding: 0;
  text-decoration: underline; font-weight: 400; font-size: .9rem; cursor: pointer;
}
.btn-link:hover { background: none; color: var(--accent-inchis); }
.btn-pericol { color: var(--pericol); }
.actiuni { display: flex; gap: .6rem; align-items: center; }
.actiuni-rand { white-space: nowrap; }
.actiuni-rand a { color: var(--accent); font-size: .9rem; }
.actiuni-rand form { margin-left: .4rem; }
.inline { display: inline-flex; gap: .35rem; align-items: center; }
.incaseaza input[type="date"] { padding: .3rem .4rem; font-size: .85rem; }
.incaseaza button { padding: .3rem .6rem; font-size: .85rem; }

.filtre { display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: .8rem; }
.filtre label { display: flex; gap: .4rem; align-items: center; font-size: .9rem; font-weight: 600; }
.rand-titlu { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }

/* ---- diverse ---- */
.badge { display: inline-block; padding: .1rem .5rem; border-radius: 99px; font-size: .8rem; white-space: nowrap; }
.badge-ok { background: var(--ok-fundal); color: var(--ok); }
.badge-atentie { background: var(--atentie-fundal); color: var(--atentie); }

.flash { padding: .6rem .9rem; border-radius: 8px; margin-bottom: 1rem; }
.flash-ok { background: var(--ok-fundal); color: var(--ok); }
.flash-eroare { background: #fee2e2; color: var(--pericol); }

/* ---- grafic cu bare (venituri pe luni) ---- */
.grafic-bare { display: flex; gap: 6px; align-items: flex-end; padding-top: 1.4rem; }
.gb-col { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; }
.gb-plot {
  height: 170px; width: 100%;
  display: flex; flex-direction: column; justify-content: flex-end; align-items: center;
  gap: .2rem;
}
.gb-bara {
  width: 100%; max-width: 44px; flex-shrink: 0;
  background: var(--accent);
  border-radius: 4px 4px 0 0;
}
.gb-col:hover .gb-bara { background: var(--accent-inchis); }
.gb-val { font-size: .72rem; color: var(--text-slab); white-space: nowrap; flex-shrink: 0; }
.gb-max .gb-val { color: var(--text); font-weight: 600; }
.grafic-ani .gb-bara { max-width: 60px; }
.gb-eticheta {
  font-size: .72rem; color: var(--text-slab); white-space: nowrap;
  width: 100%; text-align: center; border-top: 1px solid var(--linie); padding-top: .3rem; margin-top: 0;
}
@media (max-width: 560px) {
  .gb-val { font-size: .6rem; }
  .gb-eticheta { font-size: .6rem; }
  .grafic-bare { gap: 3px; }
  .gb-an { display: none; }  /* pe mobil anul nu mai încape lângă lună */
}

/* ---- statistici: tabel top clienți cu bare proporționale ---- */
.tabel-top .celula-bara {
  background: linear-gradient(to right, #dbeafe var(--bara, 0%), transparent var(--bara, 0%));
  border-radius: 4px;
}
.badge-tip { background: var(--fundal); color: var(--text-slab); border: 1px solid var(--linie); }
.rand-rest td { color: var(--text-slab); font-style: italic; }

/* ---- statistici: bare stivuite PF/PJ + legendă ---- */
.legenda { display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: .7rem; font-size: .85rem; color: var(--text-slab); }
.chip { display: inline-flex; align-items: center; gap: .35rem; }
.chip-culoare { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.chip-pj { background: var(--accent); }
.chip-pf { background: #ea580c; }
.chip-na { background: #9ca3af; }
.stive { display: flex; flex-direction: column; gap: .45rem; }
.stiva-rand { display: flex; align-items: center; gap: .6rem; }
.stiva-an { width: 3.2rem; font-size: .85rem; color: var(--text-slab); text-align: right; flex-shrink: 0; }
.stiva-bara { flex: 1; display: flex; gap: 2px; height: 22px; border-radius: 4px; overflow: hidden; }
.seg { display: flex; align-items: center; justify-content: center; color: #fff; font-size: .72rem; font-weight: 600; min-width: 0; }
.seg-pj { background: var(--accent); }
.seg-pf { background: #ea580c; }
.seg-na { background: #9ca3af; }
.stiva-total { width: 3.4rem; font-size: .8rem; color: var(--text-slab); flex-shrink: 0; }

.gol { color: var(--text-slab); }
.indiciu { color: var(--text-slab); font-size: .88rem; }
.sumar-filtru { font-size: .92rem; }
.subsol { color: var(--text-slab); font-size: .82rem; padding-bottom: 1.5rem; }

/* ======================================================================
   Portal — adăugiri (meniu comun, utilizator, login, modulul Dosare)
   ====================================================================== */
.topbar .meniu-inactiv { color: #6b7280; padding: .35rem .7rem; cursor: default; }
.utilizator { margin-left: auto; display: flex; align-items: center; gap: .6rem; color: #d1d5db; font-size: .9rem; }
.btn-iesire { background: transparent; border: 1px solid #374151; color: #d1d5db; padding: .3rem .7rem; font-weight: 400; font-size: .85rem; }
.btn-iesire:hover { background: #1f2937; color: #fff; }
@media (max-width: 720px) { .utilizator { margin-left: 0; width: 100%; justify-content: space-between; } }

.login-cutie { max-width: 380px; margin: 3rem auto; }
.login-cutie h1 { text-align: center; }
.login-cutie .formular { display: flex; flex-direction: column; gap: .9rem; }
.login-cutie input { width: 100%; }
.login-cutie button { width: 100%; padding: .65rem; }

.badge-pericol { background: #fee2e2; color: var(--pericol); }
.badge-manual { background: #ede9fe; color: #6d28d9; }
.lista-simpla { list-style: none; margin: 0; padding: 0; }
.lista-simpla li { padding: .45rem 0; border-bottom: 1px solid var(--linie); display: flex; gap: .7rem; align-items: baseline; flex-wrap: wrap; }
.lista-simpla li:last-child { border-bottom: 0; }
.data-termen { font-weight: 600; white-space: nowrap; min-width: 7.5rem; }

/* ---- Dosare: listă ---- */
textarea { width: 100%; resize: vertical; }
.filtre-dosare { display: grid; grid-template-columns: minmax(14rem, 2fr) repeat(auto-fit, minmax(8rem, 1fr)); gap: .6rem .8rem; align-items: end; }
.filtre-dosare label { display: flex; flex-direction: column; gap: .2rem; font-size: .85rem; font-weight: 600; }
.filtre-dosare select, .filtre-dosare input { width: 100%; }
@media (max-width: 1000px) { .filtre-dosare { grid-template-columns: 1fr 1fr; } .filtre-dosare .cautare { grid-column: span 2; } }
.tabel-dosare td div { margin-top: .2rem; display: flex; gap: .3rem; flex-wrap: wrap; }
.tabel-dosare a { color: var(--accent); text-decoration: none; }
a { color: var(--accent); }

/* ---- Dosare: fișă ---- */
.antet-dosar h1 { margin-bottom: .2rem; display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.subtitlu { margin: 0 0 .6rem; color: var(--text-slab); }
.info-dosar { margin-top: .8rem; border-top: 1px solid var(--linie); padding-top: .8rem; }
.info-dosar > div { display: flex; flex-direction: column; gap: .2rem; }
.text-pericol { color: var(--pericol); }
h3 { font-size: .85rem; text-transform: uppercase; letter-spacing: .03em; color: var(--text-slab); margin: 1rem 0 .4rem; }
.etapa h2 { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.tabel-sedinte td.nr { text-align: left; }
tr.viitor td { background: #eff6ff; }
details summary { cursor: pointer; color: var(--accent); font-size: .85rem; }
.dispozitiv { font-size: .88rem; background: var(--fundal); border-radius: 6px; padding: .5rem .7rem; margin-top: .3rem; }
.analiza-hotarare { margin-top: .4rem; font-size: .9rem; }
.comunicare { margin-top: .4rem; flex-wrap: wrap; }
.comunicare label { display: inline-flex; gap: .4rem; align-items: center; font-size: .85rem; }
.propunere { background: var(--atentie-fundal); border-radius: 8px; padding: .6rem .8rem; margin-bottom: .8rem; display: flex; flex-direction: column; gap: .4rem; }
.propunere p { margin: 0; }
li.restant .data-termen { color: var(--pericol); }
li.indeplinit { color: var(--text-slab); text-decoration: line-through; }
li.indeplinit form { text-decoration: none; }
/* pe telefon, lista de dosare devine carduri (fără scroll orizontal) */
@media (max-width: 720px) {
  .tabel-dosare tr:first-child { display: none; }
  .tabel-dosare, .tabel-dosare tbody, .tabel-dosare tr, .tabel-dosare td { display: block; width: 100%; }
  .tabel-dosare tr { border-bottom: 1px solid var(--linie); padding: .6rem 0; }
  .tabel-dosare td { border: 0; padding: .1rem 0; }
  .tabel-dosare td.nr { text-align: left; }
  .tabel-dosare td.nr::before { content: "Următorul termen: "; color: var(--text-slab); font-size: .85rem; }
  .tabel-dosare td:empty { display: none; }
}
/* coloanele grilei se pot micșora sub lățimea conținutului (ex. un select cu nume lungi de clienți) */
.coloane > *, .grid2 > *, .grid3 > *, .filtre-dosare > * { min-width: 0; }
.formular select, .formular input:not([type="hidden"]):not([type="date"]) { width: 100%; }
/* pe telefon, ședințele: data + completul pe un rând, soluția dedesubt pe toată lățimea */
@media (max-width: 720px) {
  .tabel-sedinte tr:first-child { display: none; }
  .tabel-sedinte, .tabel-sedinte tbody { display: block; width: 100%; }
  .tabel-sedinte tr { display: flex; flex-wrap: wrap; gap: 0 .6rem; border-bottom: 1px solid var(--linie); padding: .5rem 0; }
  .tabel-sedinte td { border: 0; padding: .1rem 0; }
  .tabel-sedinte td:last-child { flex-basis: 100%; }
  .tabel-sedinte td.nr br { display: none; }
  .tabel-sedinte td.nr small { margin-left: .3rem; }
}

/* ---- Termene ---- */
.flash-atentie { background: var(--atentie-fundal); color: var(--atentie); }
.lista-termene { list-style: none; margin: 0; padding: 0; }
.lista-termene li { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr) auto; gap: .4rem 1rem; padding: .65rem 0; border-bottom: 1px solid var(--linie); align-items: start; }
.lista-termene li:last-child { border-bottom: 0; }
.lt-data { display: flex; flex-direction: column; gap: .15rem; align-items: flex-start; }
.lt-meta { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; margin-top: .2rem; font-size: .88rem; }
.lt-actiuni { display: flex; gap: .7rem; align-items: center; white-space: nowrap; font-size: .9rem; }
.lista-termene li.restant .lt-data strong { color: var(--pericol); }
.lista-termene li.indeplinit .lt-corp > div:first-child { text-decoration: line-through; color: var(--text-slab); }
.btn-bifa { padding: .3rem .7rem; font-size: .85rem; background: var(--ok); border-color: var(--ok); }
.btn-bifa:hover { background: #166534; }
@media (max-width: 720px) {
  .lista-termene li { grid-template-columns: minmax(0, 1fr); }
  .lt-data { flex-direction: row; gap: .5rem; align-items: center; }
}

/* ---- Calendar ---- */
:root { --c-portal: #1d4ed8; --c-portal-fundal: #dbeafe; --c-manual: #6d28d9; --c-manual-fundal: #ede9fe;
        --c-calculat: #b45309; --c-calculat-fundal: #fef3c7; }
.cal-bara { display: flex; gap: .8rem 1.2rem; flex-wrap: wrap; align-items: center; }
.cal-vederi, .cal-nav { display: flex; gap: .25rem; }
.cal-vederi a, .cal-nav a { padding: .35rem .75rem; border: 1px solid var(--linie); border-radius: 7px; text-decoration: none; color: var(--text); background: #fff; }
.cal-vederi a.activ { background: var(--accent); color: #fff; border-color: var(--accent); }
.cal-filtre { display: flex; gap: .5rem .8rem; flex-wrap: wrap; align-items: center; margin-left: auto; }
.cal-filtre .chip { font-size: .88rem; cursor: pointer; }
.cal-filtre select { max-width: 14rem; }
.chip-portal { background: var(--c-portal); } .chip-manual { background: var(--c-manual); } .chip-calculat { background: var(--c-calculat); }

.ev { display: block; border-left: 3px solid; border-radius: 5px; padding: .3rem .5rem; margin: .3rem 0; font-size: .88rem; text-decoration: none; color: var(--text); }
.ev a { color: inherit; text-decoration: none; }
.ev-portal { border-color: var(--c-portal); background: var(--c-portal-fundal); }
.ev-manual { border-color: var(--c-manual); background: var(--c-manual-fundal); }
.ev-calculat { border-color: var(--c-calculat); background: var(--c-calculat-fundal); }
.ev-restant { outline: 1px solid var(--pericol); }
.ev-indeplinit { opacity: .55; text-decoration: line-through; }
.ev-ora { font-variant-numeric: tabular-nums; color: var(--text-slab); }
.ev-extra { font-size: .82rem; color: var(--text-slab); margin-top: .1rem; }
.ev-extra a { color: var(--accent); }

.cal-zi-lista { padding: .3rem 0 .6rem; border-bottom: 1px solid var(--linie); }
.cal-zi-lista:last-child { border-bottom: 0; }
.cal-zi-lista h3 { margin: .4rem 0 .2rem; }
.cal-zi-lista.azi h3 { color: var(--accent); }

.cal-saptamana { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .5rem; margin-bottom: 1.1rem; }
.cal-zi { background: var(--card); border: 1px solid var(--linie); border-radius: 10px; padding: .5rem; min-height: 9rem; }
.cal-zi.weekend { background: #fafafa; }
.cal-zi.azi { border-color: var(--accent); box-shadow: inset 0 3px 0 var(--accent); }
.cal-zi-cap { display: flex; justify-content: space-between; align-items: center; font-size: .85rem; color: var(--text-slab); }
.cal-zi.azi .cal-zi-cap strong { color: var(--accent); }
.cal-plus { text-decoration: none; color: var(--text-slab); font-size: 1.1rem; line-height: 1; padding: 0 .3rem; border-radius: 5px; }
.cal-plus:hover { background: var(--fundal); color: var(--accent); }
@media (max-width: 860px) {
  .cal-saptamana { grid-template-columns: minmax(0, 1fr); }
  .cal-zi { min-height: 0; }
}

.cal-luna { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 1px; background: var(--linie);
            border: 1px solid var(--linie); border-radius: 10px; overflow: hidden; margin-bottom: .5rem; }
.cal-luna-cap { background: var(--fundal); text-align: center; font-size: .78rem; text-transform: uppercase; color: var(--text-slab); padding: .3rem 0; }
.cal-luna-zi { background: var(--card); min-height: 6.5rem; padding: .3rem; min-width: 0; }
.cal-luna-zi.alta-luna { background: #fafafa; }
.cal-luna-zi.alta-luna .cal-luna-nr { color: #c0c4cc; }
.cal-luna-nr { font-size: .85rem; color: var(--text); text-decoration: none; display: inline-block; min-width: 1.6rem; text-align: center; border-radius: 99px; }
.cal-luna-zi.azi .cal-luna-nr { background: var(--accent); color: #fff; }
.cal-luna-ev .ev { margin: .15rem 0; padding: .1rem .3rem; font-size: .75rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-mai-mult { font-size: .75rem; }
.cal-puncte { display: none; gap: 2px; justify-content: center; margin-top: .2rem; }
.cal-puncte i { width: 6px; height: 6px; border-radius: 99px; display: inline-block; }
.punct-portal { background: var(--c-portal); } .punct-manual { background: var(--c-manual); } .punct-calculat { background: var(--c-calculat); }
@media (max-width: 720px) {
  .cal-luna-zi { min-height: 3.2rem; text-align: center; }
  .cal-luna-ev { display: none; }
  .cal-puncte { display: flex; }
  .cal-filtre { margin-left: 0; }
}
.link-mic { font-size: .9rem; }

/* ---- Clienți, Setări ---- */
.taburi { display: flex; gap: .25rem; flex-wrap: wrap; margin-bottom: 1rem; border-bottom: 1px solid var(--linie); }
.taburi a { padding: .5rem .9rem; text-decoration: none; color: var(--text-slab); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.taburi a.activ { color: var(--accent); border-bottom-color: var(--accent); font-weight: 600; }
.formular .bifa, .filtre .bifa { flex-direction: row; align-items: center; gap: .4rem; font-weight: 400; }
.formular .bifa input { width: auto; }
.formular h2 { margin: .6rem 0 0; }
.filtre .cautare-lata { flex: 1 1 16rem; }
.filtre .cautare-lata input { width: 100%; }
.tabel-reguli input[type="text"] { width: 6rem; }
.tabel-reguli td { vertical-align: middle; }
.tabel-clienti td .badge { margin-left: .3rem; }
@media (max-width: 720px) {
  .tabel-clienti tr:first-child { display: none; }
  .tabel-clienti, .tabel-clienti tbody, .tabel-clienti tr, .tabel-clienti td { display: block; width: 100%; }
  .tabel-clienti tr { border-bottom: 1px solid var(--linie); padding: .5rem 0; }
  .tabel-clienti td { border: 0; padding: .05rem 0; }
  .tabel-clienti td.nr { text-align: left; display: inline-block; width: auto; margin-right: 1rem; }
  .tabel-clienti td.nr:nth-of-type(4)::before { content: "Dosare: "; color: var(--text-slab); }
  .tabel-clienti td.nr:nth-of-type(5)::before { content: "Termene: "; color: var(--text-slab); }
  .tabel-clienti td:empty { display: none; }
}
@media (max-width: 720px) {
  .tabel-reguli tr:first-child { display: none; }
  .tabel-reguli, .tabel-reguli tbody { display: block; width: 100%; }
  .tabel-reguli tr { display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr); gap: .3rem .5rem;
                     border-bottom: 1px solid var(--linie); padding: .6rem 0; align-items: center; }
  .tabel-reguli td { border: 0; padding: 0; }
  .tabel-reguli td:nth-child(2) { grid-column: span 2; }
  .tabel-reguli td:nth-child(3) { grid-column: 2 / span 2; }
  .tabel-reguli td:nth-child(4) { grid-column: 2; }
  .tabel-reguli td:nth-child(5) { grid-column: 3; }
  .tabel-reguli td:nth-child(6) { grid-column: 2; }
  .tabel-reguli select, .tabel-reguli input[type="text"], .tabel-reguli input[type="time"] { width: 100%; }
}
@media (max-width: 720px) {
  .tabel-reguli td:nth-child(n+3)::before { display: block; font-size: .72rem; color: var(--text-slab); text-transform: uppercase; letter-spacing: .03em; }
  .tabel-reguli td:nth-child(3)::before { content: "Mod"; }
  .tabel-reguli td:nth-child(4)::before { content: "Zile înainte"; }
  .tabel-reguli td:nth-child(5)::before { content: "Repetare"; }
  .tabel-reguli td:nth-child(6)::before { content: "Ora"; }
}
.rol-mic { color: #9ca3af; font-size: .78rem; }
.info-dosar { grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); }
.responsabil { color: var(--text-slab); }