/* KRYO PRO – Rapoarte de intervenție
   Layout: o coloană de lucru (telefon întâi), bară de sus fixă, bară de acțiuni jos în editor.
   Aspect alb, curat; culorile vin din logo (bleumarin → albastru gheață). */
:root{
  --bg:#f4f6f9; --surface:#ffffff; --sunk:#f8fafc; --ink:#141a26; --muted:#5d6778;
  --line:#e2e6ec; --line-strong:#cbd2dc;
  --brand:#28449c; --brand-2:#1590d8; --brand-soft:#eaf0fb; --brand-ink:#ffffff;
  --ok:#15803d; --ok-bg:#e6f4eb; --warn:#9a5a06; --warn-bg:#fcf0da; --danger:#c0262d; --danger-bg:#fdecec;
  --f-head:"Archivo","Helvetica Neue",Arial,sans-serif;
  --f-body:"Source Sans 3","Segoe UI",Roboto,system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --r:12px; --shadow:0 1px 2px rgba(20,26,38,.06),0 1px 1px rgba(20,26,38,.04);
  color-scheme:light;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.45;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
img{max-width:100%}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--brand-2);outline-offset:2px}

/* bara de sus */
.appbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:var(--surface);border-bottom:1px solid var(--line)}
.appbar-in{max-width:820px;margin:0 auto;padding:8px 16px;display:flex;align-items:center;gap:12px;min-height:60px}
.appbar .logo{height:50px;width:auto;display:block;margin-block:-4px}
.appbar .ttl{font-family:var(--f-head);font-weight:600;font-size:15px;color:var(--muted);border-left:1px solid var(--line);padding-left:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.appbar .sp{flex:1}
.who{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--muted);min-width:0}
.who b{color:var(--ink);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px}
.avatar{width:34px;height:34px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font-weight:700;font-size:14px;flex:none}
.net{font-size:12px;font-weight:600;padding:3px 9px;border-radius:99px;background:var(--warn-bg);color:var(--warn);white-space:nowrap}

main{max-width:820px;margin:0 auto;padding-inline:16px;padding-block:20px 128px}
h1,h2,h3{font-family:var(--f-head);margin:0;text-wrap:balance;letter-spacing:-.01em}
h1{font-size:26px;font-weight:700}
.sub{color:var(--muted);margin:4px 0 0;font-size:15px}

/* butoane */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 18px;border-radius:10px;border:1px solid var(--line-strong);background:var(--surface);cursor:pointer;font-weight:600;font-size:15px;white-space:nowrap;text-decoration:none}
.btn:hover{border-color:var(--brand)}
.btn.primary{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.btn.primary:hover{background:#213a86}
.btn.ok{background:var(--ok);border-color:var(--ok);color:#fff}
.btn.link{border-color:transparent;background:none;color:var(--brand);padding:0 6px}
.btn.sm{min-height:38px;padding:0 12px;font-size:14px}
.btn.danger{color:var(--danger);border-color:var(--line-strong)}
.btn.danger.armed{background:var(--danger);border-color:var(--danger);color:#fff}
.btn:disabled{opacity:.5;cursor:default}
.btn svg{width:18px;height:18px;flex:none}

/* logare */
.login{min-height:calc(100vh - 40px);display:grid;place-items:center;padding:24px 16px}
.login-card{width:100%;max-width:380px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:28px 24px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:14px}
.login-card img{height:92px;width:auto;align-self:center;margin-bottom:6px}
.login-card h1{font-size:21px;text-align:center}
.login-card .sub{text-align:center;margin:-8px 0 4px}
.demo{background:var(--brand-soft);color:var(--brand);border-radius:10px;padding:10px 12px;font-size:14px}
.msg{font-size:14px;border-radius:10px;padding:10px 12px}
.msg.err{background:var(--danger-bg);color:var(--danger)}
.msg.info{background:var(--ok-bg);color:var(--ok)}

/* listă */
.head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:18px 0}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.kpi small{display:block;color:var(--muted);font-size:13px}
.kpi b{font-family:var(--f-mono);font-size:22px;font-weight:500;font-variant-numeric:tabular-nums}
.tools{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.search{flex:1 1 240px;min-height:46px;padding:0 14px;border:1px solid var(--line-strong);border-radius:10px;background:var(--surface)}
.seg{display:inline-flex;background:var(--surface);border:1px solid var(--line-strong);border-radius:10px;padding:3px;gap:2px}
.seg button{border:0;background:none;border-radius:7px;padding:0 12px;min-height:38px;cursor:pointer;font-size:14px;color:var(--muted);font-weight:600}
.seg button[aria-pressed="true"]{background:var(--brand-soft);color:var(--brand)}
select.flt{min-height:46px;border:1px solid var(--line-strong);border-radius:10px;background:var(--surface);padding:0 10px}
.list{display:flex;flex-direction:column;gap:8px}
.item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);cursor:pointer;text-align:left;width:100%;box-shadow:var(--shadow)}
.item:hover{border-color:var(--brand)}
.item .no{font-family:var(--f-mono);font-size:13px;color:var(--brand);background:var(--brand-soft);border-radius:8px;padding:6px 8px;font-weight:500;white-space:nowrap}
.item .t{min-width:0}
.item .t strong{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.item .t span{display:block;font-size:14px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pill{font-size:12px;font-weight:700;padding:4px 10px;border-radius:99px;white-space:nowrap;letter-spacing:.02em}
.pill.ciorna{background:var(--warn-bg);color:var(--warn)}
.pill.finalizat{background:var(--ok-bg);color:var(--ok)}
.empty{background:var(--surface);border:1px dashed var(--line-strong);border-radius:var(--r);padding:36px 18px;text-align:center;color:var(--muted)}
.empty strong{display:block;color:var(--ink);font-size:17px;margin-bottom:4px}

/* editor */
.edhead{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.edhead h1{flex:1 1 auto;font-size:23px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px 16px;margin-bottom:12px;box-shadow:var(--shadow)}
.card>h2,.card summary h2{font-size:16px;font-weight:700;margin-bottom:14px;display:flex;align-items:center;gap:8px}
.card h2 .opt{font-family:var(--f-body);font-weight:400;font-size:13px;color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.grid.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.full{grid-column:1/-1}
.f{display:flex;flex-direction:column;gap:5px;min-width:0}
.f>span{font-size:13px;font-weight:600;color:var(--muted)}
.i{width:100%;min-height:46px;padding:10px 12px;border:1px solid var(--line-strong);border-radius:10px;background:var(--surface)}
textarea.i{min-height:92px;resize:vertical;line-height:1.4}
.i:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft);outline:none}
.i[readonly]{background:var(--sunk);color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{min-height:40px;padding:0 14px;border-radius:99px;border:1px solid var(--line-strong);background:var(--surface);cursor:pointer;font-size:14px;font-weight:600;color:var(--muted)}
.chip[aria-pressed="true"]{background:var(--brand);border-color:var(--brand);color:#fff}
.rows{display:flex;flex-direction:column;gap:8px}
.r{display:grid;gap:8px;align-items:center}
.r.eq{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) 42px}
.r.mat{grid-template-columns:minmax(0,1fr) 76px 80px 42px}
.r.th{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.x{width:42px;height:42px;border-radius:10px;border:1px solid var(--line);background:var(--surface);cursor:pointer;color:var(--muted);font-size:20px;line-height:1}
.x:hover{color:var(--danger);border-color:var(--danger)}
.hours{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:14px}
.hours div{background:var(--sunk);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.hours small{display:block;font-size:12px;color:var(--muted);line-height:1.25}
.hours b{font-family:var(--f-mono);font-weight:500;font-size:18px;font-variant-numeric:tabular-nums}
.hours .tot{background:var(--brand-soft);border-color:transparent}.hours .tot b{color:var(--brand)}
.check{display:inline-flex;gap:10px;align-items:center;min-height:44px;cursor:pointer;margin-top:6px;font-size:15px}
.check input{width:20px;height:20px;accent-color:var(--brand)}
.note{font-size:13px;color:var(--muted);margin:10px 0 0}
details.card summary{list-style:none;cursor:pointer}
details.card summary::-webkit-details-marker{display:none}
details.card summary h2{margin:0}
details.card summary h2::after{content:"";margin-left:auto;width:9px;height:9px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);margin-right:4px}
details.card[open] summary h2::after{transform:rotate(-135deg)}
details.card[open] summary{margin-bottom:14px}
.photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px}
.ph{position:relative;aspect-ratio:1;border-radius:10px;overflow:hidden;border:1px solid var(--line);background:var(--sunk);max-width:100%}
.ph img{width:100%;height:100%;object-fit:cover;display:block}
.ph button{position:absolute;top:5px;right:5px;width:30px;height:30px;border-radius:50%;border:0;background:rgba(20,26,38,.65);color:#fff;cursor:pointer;font-size:16px}
.addph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;aspect-ratio:1;border:1.5px dashed var(--line-strong);border-radius:10px;color:var(--brand);font-weight:600;font-size:13px;cursor:pointer;text-align:center;padding:6px}
.addph svg{width:24px;height:24px}
.addph input{display:none}
.sigs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.sig{display:flex;flex-direction:column;gap:6px;min-width:0}
.pad{position:relative;height:160px;border:1px solid var(--line-strong);border-radius:10px;background:#fff;touch-action:none}
.pad canvas{width:100%;height:100%;display:block;cursor:crosshair}
.pad .base{position:absolute;left:18px;right:18px;bottom:34px;border-top:1px dashed #b9c2ce;pointer-events:none}
.pad .base span{position:absolute;right:0;top:4px;font-size:11px;color:#98a2b0}
.sigfoot{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--muted);gap:8px}

.actions{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--surface);border-top:1px solid var(--line);padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));box-shadow:0 -4px 16px rgba(20,26,38,.05)}
.actions-in{max-width:820px;margin:0 auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.actions-in .st{flex:1 1 120px;font-size:13px;color:var(--muted)}
.bar{max-width:820px;margin:0 auto 10px;background:var(--warn-bg);color:var(--warn);border-radius:10px;padding:10px 12px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.bar span{flex:1 1 200px;font-weight:600}
.errs{max-width:820px;margin:0 auto 10px;background:var(--danger-bg);color:var(--danger);border-radius:10px;padding:10px 12px 10px 30px;font-size:14px}
.fab{position:fixed;right:16px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:25;box-shadow:0 6px 18px rgba(40,68,156,.3)}
.toast{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);background:var(--ink);color:#fff;padding:11px 18px;border-radius:99px;font-size:14px;font-weight:600;z-index:60;max-width:calc(100% - 32px);text-align:center}
.menu{position:absolute;right:16px;top:58px;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px rgba(20,26,38,.12);padding:6px;min-width:200px;z-index:40}
.menu button{display:block;width:100%;text-align:left;border:0;background:none;padding:10px 12px;border-radius:8px;cursor:pointer;font-size:15px}
.menu button:hover{background:var(--sunk)}
.menu .meta{padding:8px 12px 10px;font-size:13px;color:var(--muted);border-bottom:1px solid var(--line);margin-bottom:4px}

/* previzualizare */
.paper-wrap{overflow-x:auto;background:#dfe4ea;border-radius:var(--r);padding:16px}
.paper-wrap .rep{margin:0 auto;box-shadow:0 2px 10px rgba(20,26,38,.12)}

/* ===== Documentul (raport PDF) – mereu hârtie albă ===== */
.rep{width:794px;min-height:1123px;background:#fff;color:#1b2230;font-family:var(--f-body);font-size:12.5px;line-height:1.45;padding:40px 44px 34px;display:flex;flex-direction:column}
.rep .top{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}
.rep .top img{height:86px;width:auto}
.rep .doc{text-align:right}
.rep .doc h1{font-family:var(--f-head);font-size:25px;font-weight:700;color:#28449c;letter-spacing:.02em;margin:4px 0 8px}
.rep .doc table{margin-left:auto;border-collapse:collapse}
.rep .doc td{padding:1px 0 1px 14px;font-size:12px}
.rep .doc td:first-child{color:#6b7482}
.rep .doc td:last-child{font-family:var(--f-mono);font-weight:500;text-align:right}
.rep .rule{height:3px;background:linear-gradient(90deg,#28449c,#1590d8);margin:18px 0 16px;border-radius:2px}
.rep .parties{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.rep .party{border:1px solid #e1e5eb;border-radius:8px;padding:11px 13px}
.rep .party.cl{background:#f5f8fc;border-color:#dce5f2}
.rep .lab{font-size:9.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#28449c;margin-bottom:4px}
.rep .party .nm{font-family:var(--f-head);font-weight:700;font-size:15px;margin-bottom:2px}
.rep .party div{font-size:11.5px}
.rep .meta{display:grid;grid-template-columns:1fr 1fr 1.6fr;border:1px solid #e1e5eb;border-radius:8px;margin-top:12px}
.rep .meta>div{padding:8px 13px}.rep .meta>div+div{border-left:1px solid #e1e5eb}
.rep .meta b{font-weight:600}
.rep .sec{margin-top:16px}
.rep .sec h3{font-family:var(--f-head);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#28449c;padding-bottom:5px;border-bottom:1px solid #d6dde7;margin-bottom:7px}
.rep .txt{white-space:pre-wrap;min-height:18px}
.rep .dash{color:#a3abb7}
.rep table.t{width:100%;border-collapse:collapse}
.rep table.t th{font-size:9.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#5d6778;text-align:left;padding:6px 8px;background:#f1f4f8;border-bottom:1px solid #d6dde7}
.rep table.t td{padding:6px 8px;border-bottom:1px solid #eceff3;vertical-align:top}
.rep table.t td.n{width:34px;color:#6b7482;font-family:var(--f-mono)}
.rep table.t td.q{text-align:right;font-family:var(--f-mono);width:80px}
.rep table.t th.q{text-align:right}
.rep .cells{display:grid;border:1px solid #e1e5eb;border-radius:8px;overflow:hidden}
.rep .cells>div{padding:7px 10px;border-left:1px solid #e1e5eb}
.rep .cells>div:first-child{border-left:0}
.rep .cells small{display:block;font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:#6b7482;line-height:1.25;min-height:24px}
.rep .cells b{font-family:var(--f-mono);font-weight:500;font-size:13px}
.rep .cells .hl{background:#eef3fb}.rep .cells .hl b{color:#28449c}
.rep .c6{grid-template-columns:repeat(6,1fr)}
.rep .c3{grid-template-columns:repeat(3,1fr)}
.rep .c3>div:nth-child(n+4){border-top:1px solid #e1e5eb}
.rep .c3>div:nth-child(3n+1){border-left:0}
.rep .tags{display:inline-flex;flex-wrap:wrap;gap:5px}
.rep .tags span{background:#eaf0fb;color:#28449c;border-radius:4px;padding:1px 7px;font-size:11px;font-weight:700}
.rep .signs{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:22px}
.rep .signs>div{border:1px solid #e1e5eb;border-radius:8px;padding:10px 13px;min-height:130px;display:flex;flex-direction:column}
.rep .signs .img{flex:1;display:flex;align-items:flex-end;justify-content:center;min-height:74px;border-bottom:1px solid #c7ced8;margin-top:6px}
.rep .signs img{max-height:76px;max-width:100%}
.rep .signs .cap{font-size:10.5px;color:#6b7482;margin-top:4px;text-align:center}
.rep .pics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.rep .pics div{aspect-ratio:4/3;overflow:hidden;border-radius:6px;border:1px solid #e1e5eb}
.rep .pics img{width:100%;height:100%;object-fit:cover;display:block}
.rep .foot{margin-top:auto;padding-top:22px}
.rep .foot div{border-top:1px solid #e1e5eb;padding-top:8px;display:flex;justify-content:space-between;gap:12px;font-size:10px;color:#6b7482;flex-wrap:wrap}

h2.grp{font-size:13px;font-weight:700;margin:24px 0 10px;color:var(--muted);text-transform:uppercase;letter-spacing:.07em}
.item.usr{cursor:default}.item.usr:hover{border-color:var(--line)}
.uact{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.pill.blocat{background:var(--danger-bg);color:var(--danger)}
.pill.wait{background:var(--brand-soft);color:var(--brand)}
@media (max-width:600px){
  .item.usr{grid-template-columns:auto minmax(0,1fr)}
  .uact{grid-column:1/-1;justify-content:flex-start}
  h1{font-size:23px}
  .grid,.grid.c3{grid-template-columns:minmax(0,1fr)}
  .hours{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sigs{grid-template-columns:minmax(0,1fr)}
  .r.mat{grid-template-columns:minmax(0,1fr) 60px 68px 42px}
  .who b{display:none}
  .appbar .ttl{font-size:14px;padding-left:10px}
  .kpi b{font-size:19px}
  .paper-wrap{padding:8px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}