/* Modulul E — documente, șabloane, regulament, evenimente (se încarcă după app.css) */

/* ---------- foaia A4 micșorată în pagină ---------- */
.sheet-box { position: relative; width: 100%; overflow: hidden; }
.sheet-scale { width: 210mm; transform-origin: 0 0; }
.sheet-scale .doc-sheet { margin: 0; }
.doc-frame { width: 100%; height: 297mm; border-collapse: collapse; }
.doc-frame > thead > tr > td, .doc-frame > tfoot > tr > td { height: 1px; padding: 0; border: 0; }
.doc-frame > tbody > tr > td.doc-cell { padding: 0; border: 0; vertical-align: top; height: auto; }
.doc-frame > tfoot > tr > td { vertical-align: bottom; }
.doc-body .docnr { text-align: left; margin-bottom: 4px; }
.doc-body .center, .doc-body p.center { text-align: center; }
.doc-body .right { text-align: right; }
.doc-body .small, .doc-body p.small { font-size: 10pt; color: #222; }
.doc-body h1 { font-size: 15pt; letter-spacing: .3px; margin: 10px 0 6px; }
.doc-body h1 + p.center { margin-top: -2px; margin-bottom: 12px; font-size: 11pt; }
.doc-body h3 { font-size: 12pt; margin: 12px 0 4px; text-align: left; }
.doc-body ul, .doc-body ol { margin: 0 0 8px; padding-left: 22px; }
.doc-body li { margin: 0 0 3px; text-align: justify; }
.doc-body ol.letters, .doc-body ul.letters { list-style: none; padding-left: 0; }
.doc-body table { margin: 4px 0 10px; }
.doc-body th { background: #f2f2f2; text-align: left; font-weight: 700; }
.doc-body table.sig { margin-top: 22px; }
.doc-body table.sig td, .doc-body table.plain td { border: 0; padding: 4px 0; vertical-align: top; width: 50%; font-size: 11.5pt; }
.doc-body small { font-size: 9pt; }
.doc-blank { background: #fff4d6; color: #8a5a06; border-radius: 2px; padding: 0 2px; }
.doc-sigproof { display: flex; gap: 12px; align-items: center; padding: 6mm 18mm; font: 10pt var(--font); }
.doc-sigproof img { height: 18mm; width: auto; border-bottom: 1px solid #333; }

/* ---------- tipărirea foii (body.printing-doc > .print-root, ca în app.css) ---------- */
@media screen { body > .print-root { display: none; } }
@media print {
  body.printing-doc .print-root .doc-sheet { box-shadow: none; width: auto; min-height: 0; margin: 0; }
  body.printing-doc .print-root .doc-frame { height: auto; }
  body.printing-doc .print-root .doc-frame > thead { display: table-header-group; }
  body.printing-doc .print-root .doc-frame > tfoot { display: table-footer-group; }
  body.printing-doc .print-root .doc-blank { background: none; color: #000; }
  body.printing-doc .print-root tr, body.printing-doc .print-root li { break-inside: avoid; }
  body.printing-doc .print-root table.sig { break-inside: avoid; }
}

/* ---------- vizualizarea unui document ---------- */
.docv-head { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.docv-meta .kv { grid-template-columns: minmax(110px, max-content) minmax(0, 1fr); }
@media (min-width: 900px) { .docv-meta .kv { grid-template-columns: repeat(2, minmax(110px, max-content) minmax(0, 1fr)); } }
.filev { border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg-soft); }
.filev img { display: block; max-width: 100%; max-height: 70vh; margin: 0 auto; }
.filev iframe { display: block; width: 100%; height: 70vh; border: 0; }
.sigproof { display: flex; gap: 12px; align-items: center; padding: 8px 10px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg-soft); font-size: 13px; min-width: 0; }
.sigproof img { height: 54px; width: auto; max-width: 40%; background: #fff; border-bottom: 1px solid var(--border-strong); }
.sig-mini { height: 28px; width: auto; max-width: 110px; vertical-align: middle; background: #fff; border-bottom: 1px solid var(--border); }
.modal-foot .check.left { margin-right: auto; }
.nowrap-row { flex-wrap: nowrap; gap: 4px; }
.inp.sm { height: 28px; padding: 0 6px; font-size: 13px; }
.dim { opacity: .55; transition: opacity .15s; }

/* ---------- generarea ---------- */
.gen-grid { display: grid; grid-template-columns: minmax(270px, 340px) minmax(0, 1fr); gap: 14px; align-items: start; }
.gen-form { gap: 10px; }
.gen-prev { min-width: 0; background: var(--bg); border-radius: var(--radius-sm); padding: 10px; }
@media (max-width: 900px) { .gen-grid { grid-template-columns: minmax(0, 1fr); } }

/* ---------- dosarul personal (bifele) ---------- */
.dossier { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.dossier li { display: flex; align-items: center; gap: 8px; min-width: 0; }
.dossier li.ok svg { color: var(--green); }
.dossier li.no svg { color: var(--amber); }

/* ---------- editorul de șabloane ---------- */
.tpl-grid { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 12px; align-items: start; }
@media (max-width: 1100px) { .tpl-grid { grid-template-columns: minmax(0, 1fr); } }
.tpl-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 3px; padding: 5px 6px; background: #fff; border: 1px solid var(--border); border-radius: var(--radius-sm); position: sticky; top: 44px; z-index: 5; }
.tb { min-width: 30px; height: 28px; padding: 0 6px; border: 1px solid transparent; border-radius: 6px; background: none; cursor: pointer; font-size: 13px; color: var(--text); display: inline-flex; align-items: center; justify-content: center; }
.tb:hover { background: var(--bg); border-color: var(--border); }
.tb-sep { width: 1px; height: 20px; background: var(--border); margin: 0 3px; }
.tpl-ed-wrap { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-sm); box-shadow: var(--shadow); max-width: 210mm; width: 100%; margin: 0 auto; overflow: hidden; }
.tpl-band { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 16px; border-bottom: 3px solid #e2001a; }
.tpl-band img { height: 26px; width: auto; }
.tpl-band span { font-size: 11px; color: var(--text-faint); }
.tpl-ed { min-height: 60vh; padding: 14px 22px 30px; outline: none; font-family: "Times New Roman", Georgia, serif; font-size: 12pt; line-height: 1.45; color: #000; overflow-wrap: anywhere; }
.tpl-ed:focus { box-shadow: inset 0 0 0 2px rgba(27, 106, 201, .2); }
.tpl-ed table td, .tpl-ed table th { min-width: 30px; }
.tpl-src { min-height: 60vh; font-size: 12px; border: 0; border-radius: 0; }
.tpl-side { position: sticky; top: 44px; display: flex; flex-direction: column; gap: 8px; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 8px 10px 10px; max-height: calc(100vh - 60px); overflow-y: auto; min-width: 0; }
@media (max-width: 1100px) { .tpl-side { position: static; max-height: none; } .tpl-toolbar { top: 0; } }
.tpl-side .tabs { flex-wrap: wrap; }
.ph-list { display: flex; flex-direction: column; gap: 1px; max-height: 55vh; overflow-y: auto; }
.ph-g { font-size: 11px; font-weight: 750; text-transform: uppercase; letter-spacing: .3px; color: var(--text-faint); padding: 8px 2px 3px; }
.ph { display: flex; flex-direction: column; align-items: flex-start; gap: 0; padding: 4px 6px; border: 0; border-radius: 6px; background: none; cursor: pointer; text-align: left; min-width: 0; }
.ph:hover { background: var(--brand-soft); }
.ph code { font-size: 11.5px; color: var(--brand-dark); overflow-wrap: anywhere; }
.ph small { font-size: 11.5px; color: var(--text-weak); }
.vlist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.vlist li { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border: 1px solid var(--border-soft); border-radius: 6px; }
.vlist li.on { background: var(--green-bg); border-color: transparent; }
.vlist small { display: block; color: var(--text-weak); font-size: 11.5px; }
.fld-card { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 8px; display: flex; flex-direction: column; gap: 6px; background: var(--bg-soft); }
.hint-box code, .stack small code { font-size: 11.5px; background: var(--bg); padding: 0 3px; border-radius: 3px; }

/* ---------- regulament și luare la cunoștință ---------- */
.policy-text { white-space: pre-wrap; font-size: 13.5px; line-height: 1.55; background: var(--bg-soft); border: 1px solid var(--border-soft); border-radius: var(--radius-sm); padding: 10px 12px; max-height: 50vh; overflow-y: auto; overflow-wrap: anywhere; }
.ack-head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding: 8px 10px; background: var(--bg-soft); border-radius: var(--radius-sm); font-size: 13px; }
.ack-head .prog { min-width: 160px; }
.ack-paper { gap: 8px; }
.ret-tbl td small { display: block; }
.tbl tr.changed td { background: #fffaf0; }

/* ---------- modul tabletă (semnare / declarații) — ca în macheta 7 ---------- */
.tab-mode { position: fixed; inset: 0; z-index: 120; background: rgba(15, 20, 30, .55); display: flex; align-items: stretch; justify-content: center; padding: 2vh 12px; }
.tab-frame { width: min(860px, 100%); background: #151b24; border-radius: 26px; padding: 18px; display: flex; box-shadow: var(--shadow-pop); }
.tab-screen { flex: 1; min-width: 0; background: #fff; border-radius: 14px; display: flex; flex-direction: column; overflow: hidden; }
.tab-top { display: flex; align-items: flex-start; gap: 10px; padding: 14px 18px 8px; border-bottom: 1px solid var(--border-soft); }
.tab-top h2 { font-size: 20px; font-weight: 800; letter-spacing: .3px; }
.tab-top .kicker { font-size: 11.5px; font-weight: 700; color: var(--brand-dark); text-transform: uppercase; letter-spacing: .4px; }
.tab-body { flex: 1 1 auto; overflow-y: auto; padding: 12px 18px; display: flex; flex-direction: column; gap: 10px; min-height: 0; }
.tab-sign { border-top: 1px solid var(--border-soft); padding: 10px 18px 14px; display: flex; flex-direction: column; gap: 8px; background: #fff; }
.tab-sign .sigpad { border-color: #f1b3b9; background: #fffafa; }
.tab-text { min-height: 220px; font-size: 16px; line-height: 1.5; }
.tab-sign .row > .btn.big { margin-left: auto; }
.tab-read { max-height: none; flex: 1 1 auto; font-size: 15px; }
.check.big { font-size: 15px; align-items: flex-start; }
.check.big input { width: 22px; height: 22px; flex: none; }
.btn.big { height: 46px; padding: 0 22px; font-size: 15.5px; }
.inp.big { height: 48px; font-size: 17px; }
.sig-label { font-size: 12px; font-weight: 650; color: var(--text-weak); }
.tab-people { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px; }
.tab-person { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--border-strong); border-radius: 12px; background: #fff; text-align: left; cursor: pointer; min-height: 62px; min-width: 0; }
.tab-person:hover { border-color: var(--brand); background: var(--brand-soft); }
.tab-person b { display: block; font-size: 15px; }
.tab-person small { display: block; color: var(--text-weak); font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tab-person span { min-width: 0; }
.tab-who { display: flex; align-items: center; gap: 10px; padding: 8px 10px; background: var(--bg-soft); border-radius: 10px; }
.tab-who b { display: block; font-size: 16px; }
.tab-who small { color: var(--text-weak); }
@media (max-width: 760px) { .tab-mode { padding: 0; } .tab-frame { border-radius: 0; padding: 0; } .tab-screen { border-radius: 0; } }

/* ---------- evenimente ---------- */
.ev-types { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }
.ev-types .rc-body b { display: inline-flex; align-items: center; gap: 5px; }
.ev-plist { list-style: none; margin: 0 0 8px; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.ev-plist li { display: flex; align-items: center; gap: 8px; padding: 4px 6px; border: 1px solid var(--border-soft); border-radius: 8px; min-width: 0; flex-wrap: wrap; }
.ev-add { flex-wrap: wrap; }
.ev-desc { white-space: pre-wrap; margin-top: 10px; padding: 10px 12px; background: var(--bg-soft); border: 1px solid var(--border-soft); border-radius: var(--radius-sm); font-size: 13.5px; overflow-wrap: anywhere; }
.ev-photos { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 6px; margin-bottom: 8px; }
.ev-photo { padding: 0; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; background: var(--bg); cursor: pointer; aspect-ratio: 1; }
.ev-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ev-docs, .ev-hist, .stmts { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.ev-docs li { display: flex; align-items: center; gap: 8px; min-width: 0; }
.ev-docs .link-btn { text-align: left; font-weight: 600; }
.ev-hist li { display: flex; flex-direction: column; padding: 3px 0; border-bottom: 1px solid var(--border-soft); }
.ev-hist li:last-child { border-bottom: 0; }
.ev-hist small { color: var(--text-faint); font-size: 11.5px; }
.stmts li { padding: 8px 0; border-bottom: 1px solid var(--border-soft); display: flex; flex-direction: column; gap: 4px; }
.stmts li:last-child { border-bottom: 0; }
.stmt-text { white-space: pre-wrap; font-size: 13px; background: var(--bg-soft); border-radius: 6px; padding: 6px 8px; overflow-wrap: anywhere; }
.flow { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; }
.flow li { display: flex; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--border-soft); position: relative; min-width: 0; }
.flow li:last-child { border-bottom: 0; }
.fs-ic { flex: none; width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--bg); color: var(--text-weak); margin-top: 1px; }
.fs-done .fs-ic, .fs-done_late .fs-ic { background: var(--green-bg); color: var(--green-text); }
.fs-late .fs-ic { background: var(--red-bg); color: var(--red-text); }
.fs-due .fs-ic { background: var(--amber-bg); color: var(--amber-text); }
.fs-skipped, .fs-na { opacity: .6; }
.fs-body { display: flex; flex-direction: column; gap: 2px; font-size: 13px; }
.fs-body small { font-size: 11.5px; }
.fs-date { font-size: 12px; font-weight: 700; white-space: nowrap; }
.fs-hint { color: var(--text-weak); }
.fs-act { gap: 4px; margin-top: 3px; }
.btn.sm.brand { background: var(--brand); border-color: var(--brand); color: #fff; }
