/* App-owned styles: everything this application adds on top of the
   prototype. register.css stays a verbatim copy of the prototype's
   <style> blocks (Docs/adr/0003; test/views/layout-shell.test.ts checks
   it byte for byte) -- new rules go here, built on its tokens. */

/* Evidence log: the tip box shown before a save and again in the history. */
.tip{margin-top:8px;padding:10px 12px;border-radius:8px;border:1px solid var(--line);display:grid;gap:4px}
.tip b{display:block;margin-bottom:2px}
.attached{padding:8px 10px;border:1px dashed var(--line);border-radius:8px}
[data-dropzone].over{outline:2px dashed var(--accent);outline-offset:4px}
.progress-bar{height:6px;border-radius:3px;background:var(--accent);transition:width .2s}
.feedback{margin-top:6px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.feedback details{display:inline}

/* Sign-in: one centred card in the prototype's own language -- the rail's
   brand block, its field and button styles, its crit banner. */
.signin{min-height:100vh;display:grid;place-items:center;padding:24px 16px;background:var(--ground)}
.signin-card{width:100%;max-width:400px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:28px 28px 20px}
.signin-brand{display:flex;flex-direction:column;gap:2px;margin-bottom:24px}
.signin-brand b{font-size:15px;font-weight:600;letter-spacing:-.01em}
.signin-brand span{font-family:var(--mono);font-size:10px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.09em}
.signin h1{font-size:20px;font-weight:600;letter-spacing:-.015em;margin:0 0 6px}
.signin .lead{margin:0 0 18px;color:var(--ink-2)}
.signin .banner{margin-bottom:16px}
.banner.note{border-color:var(--accent-line);background:var(--accent-soft)}
.banner.note .bi{color:var(--accent-ink)}
.top .signout{margin:0}
.signin-actions{margin:0 0 12px}
.signin .field input{width:100%;padding:9px 11px;border:1px solid var(--line-strong);border-radius:var(--r);background:var(--surface);color:var(--ink);font:inherit;font-size:14px}
.signin .field input:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}
.signin .btn.pri{width:100%;justify-content:center;padding:9px 12px;font-size:13.5px}
/* "or" between the e-mail form and the holding's Okta button (2026-10-05). */
.signin-or{display:flex;align-items:center;gap:10px;margin:14px 0;color:var(--ink-3);font-size:12px}
.signin-or::before,.signin-or::after{content:"";flex:1;border-top:1px solid var(--line)}
.signin form[action="/auth/start/holding"] .btn{width:100%;justify-content:center;padding:9px 12px;font-size:13.5px}
.signin-foot{margin-top:20px;padding-top:14px;border-top:1px solid var(--line);font-family:var(--mono);font-size:10.5px;line-height:1.55;color:var(--ink-3)}
.signin .ph .btn{margin-left:auto}
.ph .btn + .btn{margin-left:0}
form.inline{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap;margin:4px 0}
form.inline input{padding:4px 6px;border:1px solid var(--line-strong);border-radius:var(--r);font:inherit;font-size:12px}

/* Links (2026-09-25). The prototype navigates with buttons, the app with
   real links: without these rules the browser's default blue, visited
   purple and underline leak in -- unreadable in dark mode. */
a,a:visited{color:var(--accent);text-decoration:underline;text-decoration-color:var(--accent-line);text-underline-offset:2px}
a:hover{text-decoration-color:currentColor}
a.nav,a.nav:visited{color:var(--ink-2);text-decoration:none}
a.nav:hover,a.nav[aria-current="true"]{color:var(--ink)}
a.btn,a.btn:visited{color:var(--ink);text-decoration:none}
a.btn.pri,a.btn.pri:visited{color:var(--accent-ink)}
a.strong,a.strong:visited{color:var(--ink);text-decoration:none;font-weight:600}
a.strong:hover{text-decoration:underline}

/* Native form controls (date pickers, selects, checkboxes) follow the
   theme: register.css pins :root{color-scheme:light}, which left white
   date fields in dark mode. */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){color-scheme:dark}}
:root[data-theme="dark"]{color-scheme:dark}

/* Upload evidence (spec 2026-09-29-evidence-ai-upload): a generous drop area and one card per file. */
/* Evidence upload, redesigned (spec 2026-10-06-evidence-upload-redesign-design). */
.upload-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.upload-step{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.upload-step b{display:block;font-size:13.5px;margin-bottom:2px}
.upload-step span:not(.upload-step-num){font-size:12.5px;color:var(--ink-2)}
.upload-step-num{flex:0 0 26px;height:26px;border-radius:50%;background:var(--accent);color:var(--accent-ink,#fff);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px}
.upload-grid{display:grid;grid-template-columns:minmax(260px,1fr) 2fr;gap:16px;align-items:start}
/* the evidence page: one way in, above the table */
.upload-cta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;border-bottom:1px solid var(--line)}
@media (max-width:767.98px){.upload-cta .btn{width:100%;justify-content:center}}
.due-list{list-style:none;margin:0;padding:0}
.due-list li{display:flex;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line);font-size:13px}
.due-list li:last-child{border-bottom:0}
.due-text{flex:1;display:flex;flex-direction:column}
.due-text .sub{font-size:12px;color:var(--ink-3)}
.due-action{font-size:12px;white-space:nowrap}
.due-dot{width:10px;height:10px;border-radius:50%;flex:0 0 10px;background:var(--line-strong)}
/* Fills, not the text colours: a dot must read at a glance. */
.due-dot.open,.dot.d-open{background:var(--ci-blue)}
.due-dot.crit{background:#D64545}.due-dot.warn{background:#E0A526}.due-dot.good{background:#4C9A2A}
.dropzone{border:2px dashed var(--accent);border-radius:14px;padding:30px 16px;text-align:center;background:var(--accent-soft)}
.dropzone label{display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;margin-bottom:10px}
.dropzone-icon{font-size:30px;line-height:1}
.dropzone-big{font-size:17px;font-weight:600}
.dropzone-small{font-size:12.5px;color:var(--ink-2)}
.dropzone.js label{margin-bottom:0}
.dropzone.js input[type="file"]{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.upload-trust{font-size:12px;color:var(--ink-3);margin-top:10px}
.upload-context{font-size:13px;margin:0 0 10px}
.ai-badge{font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px;background:var(--accent);color:var(--accent-ink,#fff)}
.ai-sentence{font-size:15px;line-height:1.5;margin:0 0 12px}
.ai-note{font-size:12.5px;color:var(--ink-2);margin:-6px 0 12px}
.ai-question{display:flex;gap:8px;align-items:flex-start;background:var(--warn-soft,#FFF6DD);border:1px solid var(--warn-line,#F0D58A);border-radius:8px;padding:10px 12px;margin-bottom:10px;font-size:13px}
.card-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:12px 0 4px}
.card-actions [data-discard]{margin-left:auto}
.corrections{margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:8px}
.upload-progress{list-style:none;margin:0;padding:0;font-size:13px}
.upload-progress li{padding:4px 0;color:var(--ink-3)}
.upload-progress li.done{color:var(--ink)}
.upload-progress li.done::before{content:"✓ ";color:var(--good,#4C9A2A);font-weight:700}
.upload-progress li.now::before{content:"◌ ";color:var(--accent)}
.saved-body{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;font-size:14px}
.saved-next{margin-top:4px;font-size:13px}
@media (max-width: 900px){.upload-grid{grid-template-columns:1fr}.upload-steps{grid-template-columns:1fr}}
.upload-card .ph{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.tip-feedback{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:4px}

/* Document type checklist (spec 2026-09-30-document-types-completeness):
   shared by the holding's preview/trial and the company's upload card. */
.checklist ul{list-style:none;padding:0}
.check-row{margin:.4rem 0}
/* "It is in there" on the upload card (spec 2026-09-30-document-completeness-upload): a quiet disclosure under the row. */
.in-there{margin:.3rem 0 .5rem}
.in-there summary{cursor:pointer}
.in-there label{display:block;margin:.4rem 0}
.in-there textarea{width:100%;min-height:3.2em}
.completeness{margin:14px 0}
/* Admin → Email notifications (spec 2026-09-30-mail-notifications): rows in the status card, two template columns. */
.notify-row{display:grid;grid-template-columns:minmax(140px,200px) 1fr auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.notify-label{font-weight:600}
.notify-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.notify-more{margin:8px 0}
.notify-test{margin:12px 0}
.notify-cols{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media (max-width: 900px){.notify-row{grid-template-columns:1fr}.notify-actions{justify-content:flex-start}.notify-cols{grid-template-columns:1fr}}

/* Coverage matrix headings, larger than the prototype's 9.5px (owner, 2026-10-05). */
.mx th.rot{font-size:11.5px;font-weight:600;color:var(--ink-2,var(--ink))}
/* The risk register and the measures it feeds: one band (owner, 2026-10-05). */
/* The table keeps 2px between cells; a 1px shadow of the same tint on each
   pair cell fills those gaps, so the two columns read as one band. */
.mx th.pair-l,.mx th.pair-r,.mx td.pair-l,.mx td.pair-r{background:var(--accent-soft,rgba(120,143,33,.12));box-shadow:0 0 0 1px var(--accent-soft,rgba(120,143,33,.12))}
.mx td.pair-l,.mx td.pair-r{padding:3px}
.mx .pair-arrow{color:var(--accent,#788F21);font-weight:700}
/* Coverage matrix: the baseline requirements under each column heading. */
.mx th.rot small.bref{display:block;margin-top:3px;font-size:9px;font-weight:400;color:var(--ink-3,#777)}

/* Incidents per Baseline 3.6 (2026-10-02): deadlines to tick off, trigger checkboxes. */
.deadlines{margin-top:6px}
.deadlines summary{cursor:pointer;font-size:12px;color:var(--ink-2,var(--ink))}
.deadlines ul{list-style:none;margin:6px 0 0;padding:0}
.deadlines li{padding:6px 0;border-top:1px solid var(--line);font-size:12px}
.deadlines form{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:flex-end;margin-top:6px}
.deadlines form .field{margin:0;min-width:150px}
fieldset.field{border:0;padding:0;margin:0 0 13px}
fieldset.field legend{font-weight:600;margin-bottom:4px}
fieldset.field .field{margin-bottom:4px}
/* Cockpit: activities grouped as on the holding matrix (2026-10-02). */
.obgroup{margin:14px 0 4px;font-size:12px;font-weight:600;color:var(--ink-2,var(--ink));border-bottom:2px solid var(--olive,#788F21);padding-bottom:3px;text-transform:none;letter-spacing:0}
.obgroup:first-child{margin-top:0}
.sub.bref{font-size:11px;color:var(--ink-3,#777)}
tr.grp th{background:transparent;font-size:12px;font-weight:600;text-transform:none;letter-spacing:0;border-bottom:2px solid var(--olive,#788F21);padding-top:12px}
.deadlines details.resolve{margin-top:4px}
.deadlines details.resolve>summary{cursor:pointer;font-size:12px;font-weight:600;color:var(--accent,var(--ink))}

/* NIS2 Art. 21 (2026-10-02): one light per measure, 0-25 red, 50 amber, 75-100 green. */
.art21{display:inline-block;min-width:34px;padding:2px 6px;border-radius:6px;font-size:12px;font-weight:600;text-align:center;background:var(--ci-grey-100,#eee);color:var(--ink-3,#666)}
.art21.crit{background:#f6d5d1;color:#8a1c12}
.art21.warn{background:#fbe9c4;color:#7a5200}
.art21.good{background:#dfe9c3;color:#3d4a12}
.art21-matrix td,.art21-matrix th{text-align:center}
.art21-matrix td:nth-child(-n+3),.art21-matrix th:nth-child(-n+3){text-align:left}

/* A coverage-matrix cell that links somewhere (NIS2 Art. 21 → the company's details). */
a.cell{color:inherit;text-decoration:none}
a.cell:hover,a.cell:focus-visible{outline:2px solid currentColor;outline-offset:-2px}

/* Board report (spec 2026-10-05): the deck's four slides as four sections. */
.board-report .eyebrow{font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.09em;color:var(--ink-3);margin:0 0 2px}
.board-report .report-cover .confidential{font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.09em;margin-top:14px}
.board-report .refs,.board-report .plain{margin:0;padding-left:16px}
.board-report .plain{list-style:none;padding-left:0}
.board-report table.summary th[scope="row"]{white-space:nowrap;width:1%;text-transform:none;letter-spacing:0;font-weight:600}
.board-report .light-cell{white-space:nowrap}
.light{display:inline-block;width:12px;height:12px;border-radius:50%;vertical-align:-1px;border:1px solid var(--line-strong)}
.light-green{background:var(--good);border-color:var(--good)}
.light-amber{background:var(--warn);border-color:var(--warn)}
.light-red{background:var(--crit);border-color:var(--crit)}
.light-unset{background:transparent}
.board-report .register-line{margin-top:8px}
.board-report table.matrix th{font-size:11px;text-transform:none;letter-spacing:0}
.board-report table.matrix td{text-align:center;min-width:70px;height:40px}
.board-report table.matrix td.cell-low{background:var(--good-soft)}
.board-report table.matrix td.cell-medium{background:var(--na-soft,var(--ci-grey-100,#eee))}
.board-report table.matrix td.cell-high{background:var(--warn-soft)}
.board-report table.matrix td.cell-critical{background:var(--crit-soft)}
.board-report .decisions{display:grid;gap:12px}
.board-report .decision{border:1px solid var(--line);border-radius:var(--r);padding:10px 12px}
.board-report .decision-head{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.board-report .decision-head .sub{display:inline;margin-left:4px}
.board-report .decision-input{margin:8px 0 0}
.board-report .signoffs p{margin:6px 0}
.report-form textarea{width:100%;min-height:64px}
.report-form .field select{margin-top:4px}

/* Print (ADR 0006's own rule: checked by hand, recorded in the plan's ledger):
   the rail, the tab bar, the forms and buttons go; A4 landscape, one page
   per section, the lights in colour. The one-pager's note said the same. */
@media print {
  @page { size: A4 landscape; margin: 12mm; }
  html, body, .app, .main, .view { background: none !important; min-height: 0 !important; height: auto !important; box-shadow: none !important; }
  body::before, body::after { display: none !important; }
  .rail, .tabbar, .top, .board-report form, .board-report .btn, .report-head, .report-form, .board-report .report-section + .panel:not(.report-section), .board-report > p.note { display: none !important; }
  .app { display: block !important; }
  .main, .view { max-width: none !important; padding: 0 !important; margin: 0 !important; }
  .board-report { zoom: .82; }
  .board-report .report-section { break-before: page; page-break-before: always; break-inside: avoid; box-shadow: none !important; border: 1px solid #ddd; background: #fff !important; }
  .board-report .report-section:first-of-type { break-before: auto; page-break-before: auto; }
  .board-report table.matrix td { height: 28px; }
  .light, .board-report table.matrix td, .tag { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Settings -> Activities (2026-10-05): the date and its buttons on one line. */
table.activities td:last-child{white-space:nowrap}
table.activities form.inline{margin:2px 6px 2px 0;flex-wrap:nowrap}
table.activities input[type="date"]{width:auto;max-width:160px;padding:4px 6px;font-size:12px}

/* A company only for trying things out (migration 0053). */
.tag.t-test{background:transparent;border:1px dashed var(--ink-3,#777);color:var(--ink-2,#555)}