/* Viceroy Bali SMS — styles-extras continued.
 * Split from styles-extras.css on 20260902 when that file crossed the 500-line rule.
 * Loaded immediately after it, so the cascade is unchanged.
 */

/* ---- Boot skeleton (src/boot.jsx) ----
   Shown for the moment between the page arriving and the data landing. Deliberately shows
   structure and no numbers: a wrong figure that then changes is worse than no figure. */
.boot-shell{pointer-events:none;user-select:none}
.boot-sk{display:block;border-radius:7px;background:var(--chip);position:relative;overflow:hidden}
.boot-sk::after{content:'';position:absolute;inset:0;transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--ink) 7%,transparent),transparent);
  animation:boot-shimmer 1.25s infinite}
@keyframes boot-shimmer{100%{transform:translateX(100%)}}

.boot-nav{display:flex;flex-direction:column;gap:11px;padding:8px 14px}
.boot-sk-nav{height:15px;background:rgba(255,255,255,.09)}
.boot-sk-nav::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.10),transparent)}
.boot-sk-group{height:10px;width:38%;margin-top:16px;background:rgba(255,255,255,.06)}
.boot-sk-group::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent)}

.boot-sk-search{height:42px;width:min(440px,42vw);border-radius:10px}
.boot-sk-avatar{height:34px;width:34px;border-radius:50%}
.boot-sk-h1{height:30px;width:min(360px,52vw);margin-bottom:11px}
.boot-sk-sub{height:14px;width:min(280px,40vw)}
.boot-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin-top:26px}
.boot-card{padding:20px;min-height:118px}
.boot-card-wide{margin-top:14px;min-height:190px}
.boot-sk-card{height:100%;min-height:76px;border-radius:9px}
.boot-card-wide .boot-sk-card{min-height:148px}

@media (prefers-reduced-motion:reduce){ .boot-sk::after{animation:none} }

/* ---- Global search: server-side document-content hits ---- */
.sp-tag{display:inline-block;margin-left:8px;padding:1px 7px;border-radius:9px;font-size:10px;
  font-weight:600;letter-spacing:.02em;background:var(--chip);color:var(--muted);vertical-align:middle;white-space:nowrap}
.sp-sub mark{background:color-mix(in srgb,var(--amber) 38%,transparent);color:inherit;border-radius:2px;padding:0 1px}

/* ---- Certification period lens (Library / Records) ---- */
.period-sel{font-weight:600;border-color:var(--green-700);color:var(--green-700)}
.period-sel:focus{outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--green-700) 22%,transparent)}

/* ---- compulsory expiry choice on upload ---- */
.req-star{color:var(--risk);font-weight:700}
.req-hint{display:inline-flex;align-items:center;gap:5px;color:var(--risk) !important;font-weight:600}

/* ---- Audit View: auditor-facing notes + print ---- */
.ai-notes{margin:8px 15px 12px;padding:9px 12px;border-left:3px solid var(--gold-d);background:var(--chip);
  font-size:12.5px;line-height:1.6;color:var(--ink-2);white-space:pre-wrap}
.ai-notes-l{display:block;font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:var(--muted);margin-bottom:3px}
/* Printing the Audit View: flatten the fixed-height shell (same fix as body.printing-guide). */
@media print{
  body.printing-audit .sidebar,
  body.printing-audit .topbar,
  body.printing-audit .audit-banner,
  body.printing-audit .page-head button{display:none !important}
  body.printing-audit .shell{display:block;height:auto}
  body.printing-audit .main{display:block;overflow:visible}
  body.printing-audit .content{overflow:visible;height:auto;padding:0}
  body.printing-audit{background:#fff}
  body.printing-audit .audit-group{border:0;box-shadow:none;break-inside:auto}
  body.printing-audit .audit-item{break-inside:avoid}
  body.printing-audit .ai-doc{cursor:default}
}

/* ---- RnA one-page status summary ---- */
.ph-actions{display:flex;gap:9px;align-items:center}
.rna-sum-modal{max-width:820px}
.rna-sum-table{border-collapse:collapse;width:100%;font-size:13px}
.rna-sum-table th,.rna-sum-table td{padding:8px 11px;border-bottom:1px solid var(--border);text-align:left}
.rna-sum-table th{font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);background:var(--chip)}
.rna-sum-table tfoot td{font-weight:700;border-top:2px solid var(--ink);border-bottom:none}
.rs-c{text-align:center !important;width:86px}
.rs-strong{font-weight:700}
.rs-zero{color:var(--muted);opacity:.5}
.rs-critical{color:#fff;background:var(--risk);border-radius:6px;font-weight:700}
.rs-high{color:var(--risk);font-weight:700}
.rs-medium{color:var(--amber);font-weight:600}
.rs-low{color:var(--ok);font-weight:600}
.rna-sum-note{margin:14px 2px 0;font-size:12px;color:var(--muted);line-height:1.5}

/* ---- Milestone Report ---- */
.rm-ms{margin-bottom:22px}
.rm-ms-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:8px}
.rm-ms-head h3{margin:0;font-size:15px}
.rm-ms-stats{font-size:12.5px;color:var(--muted);white-space:nowrap}
.rm-ms-over{color:var(--risk)}
.rm-row-over td{color:var(--risk)}
.rm-empty{color:var(--muted);font-size:13.5px;padding:16px 0}

/* ---- criterion drawer: save failure (item 10 — was console-only) ---- */
.drawer-err{display:flex;align-items:center;gap:8px;margin:0 20px 10px;padding:10px 13px;border-radius:9px;
  background:color-mix(in srgb,var(--risk) 12%,transparent);color:var(--risk);font-size:13px;font-weight:600}

/* Phase 4 (2026-09-02): the readiness ring is period-aware, so it has to say which window it
   was computed through. Same tinted treatment as .cycle-banner so the two read as one idea. */
.readiness-lens{display:inline-flex;align-items:center;gap:6px;margin:2px 0 10px;padding:4px 10px;
  border-radius:999px;font-size:11.5px;font-weight:600;
  color:var(--sC);background:color-mix(in srgb,var(--sC) 12%,transparent)}
.readiness-lens svg{flex:0 0 auto}
.dash-head-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.dash-period-sel{min-width:210px}
@media (max-width:640px){ .dash-head-actions{width:100%} .dash-period-sel{flex:1 1 100%} }

/* Audit View second layer (2026-09-03): criterion code clusters inside a section, e.g. D2.
   Only rendered where a section's codes are genuinely two-level — see clustersOf(). */
.audit-cluster{border-top:1px solid var(--border)}
.audit-cluster:first-child{border-top:0}
.audit-cluster-head{display:flex;align-items:center;gap:9px;padding:9px 16px;cursor:pointer;
  user-select:none;background:color-mix(in srgb,var(--green-700) 4%,transparent)}
.audit-cluster-head:hover{background:color-mix(in srgb,var(--green-700) 8%,transparent)}
.audit-cluster-head .cg-count{margin-left:auto}

/* Back to top (2026-09-03). Fixed to the viewport rather than the scroller, so it stays put
   while main.content scrolls under it. Hidden in print and for anyone who prefers less motion. */
.btt-anchor{position:absolute;width:0;height:0;overflow:visible}
.btt{position:fixed;right:22px;bottom:22px;z-index:60;
  width:40px;height:40px;border-radius:999px;border:1px solid var(--border);
  background:var(--card,#fff);color:var(--ink-2,#3a3a36);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 3px 14px rgba(0,0,0,.16);transition:transform .15s,background .15s}
.btt svg{transform:rotate(180deg)}          /* chevron down, flipped to point up */
.btt:hover{background:var(--hover,#f6f6f4);transform:translateY(-2px)}
.btt:focus-visible{outline:2px solid var(--sD);outline-offset:2px}
@media print{ .btt{display:none} }
@media (prefers-reduced-motion:reduce){ .btt{transition:none} }

/* Collapsible criteria in Audit View (2026-09-03). A closed row is a single compact line; the
   base .ai-head carries margin-bottom for the open state, so it is removed when closed. */
.audit-item:not(.ai-open){padding:8px 20px}
.audit-item:not(.ai-open) .ai-head{margin-bottom:0}
.audit-item.ai-open{background:color-mix(in srgb,var(--green-700) 3%,transparent)}
.ai-head:hover{background:color-mix(in srgb,var(--green-700) 6%,transparent)}
.ai-count{font-size:11px;color:var(--muted);white-space:nowrap}
.ai-count-0{color:var(--risk-d)}          /* nothing on file — worth seeing while closed */
.ai-more{padding:2px 8px 4px}
.ai-more-btn{background:none;border:0;padding:0;cursor:pointer;font:inherit;font-size:12px;
  color:var(--green-700);text-decoration:underline;text-underline-offset:2px}
.ai-more-btn:hover{color:var(--gold-d)}
.ai-more-btn:focus-visible{outline:2px solid var(--sD);outline-offset:2px;border-radius:3px}

/* Evidence grouped by category inside an open criterion (2026-09-04). Third and last collapse
   level: section -> criterion -> category. Indented under the criterion so the nesting reads. */
.ai-groups{padding-left:6px}
.ai-filter{display:flex;align-items:center;gap:7px;margin:2px 8px 9px;padding:5px 10px;
  border:1px solid var(--border);border-radius:8px;background:var(--card,#fff);max-width:420px}
.ai-filter input{flex:1;border:0;outline:0;background:none;font:inherit;font-size:12.5px;color:inherit;min-width:0}
.ai-filter-n{font-size:11px;color:var(--muted);white-space:nowrap}
.ai-group{border-top:1px solid var(--border)}
.ai-group:first-of-type{border-top:0}
.ai-group-head{display:flex;align-items:center;gap:8px;padding:7px 10px;cursor:pointer;user-select:none}
.ai-group-head:hover{background:color-mix(in srgb,var(--green-700) 6%,transparent)}
.ai-group-name{font-size:12.5px;font-weight:600}
.ai-group-n{margin-left:auto;font-size:11px;color:var(--muted)}
.ai-group-body{padding-bottom:6px}
@media print{ .ai-filter{display:none} }

/* Capability-denied panel (2026-09-04) — pm_view and any future enforced capability. */
.cap-denied{padding:56px 24px;text-align:center}
.cap-denied p{margin:10px 0 0;font-size:14px;font-weight:600}
.cap-denied-sub{font-weight:400 !important;color:var(--muted);font-size:12.5px !important;max-width:420px;margin:6px auto 0 !important}

/* ---- Risk & Action: Print dropdown + printable documents (20260907) ---- */
/* The menu reuses .popover from styles.css; these rules only position it under the button
   and style the option rows. */
.rna-print-wrap{position:relative;display:inline-block}
.rna-print-caret{margin-left:2px;opacity:.7}
.rna-print-pop{width:270px;padding:6px;right:0}
.rna-print-opt{display:block;width:100%;text-align:left;padding:9px 10px;border-radius:8px;
  font-size:13px;font-weight:500;color:var(--ink-2);transition:.12s}
.rna-print-opt:hover{background:var(--chip);color:var(--ink)}

.rp-count{font-size:11.5px;color:var(--muted);margin-bottom:10px}
.rp-table td,.rp-table th{vertical-align:top;text-align:left}
.rp-table .rp-num{width:1%;white-space:nowrap;text-align:center;font-variant-numeric:tabular-nums}
.rp-table .rp-wide{min-width:190px}
.rp-table tr.rp-done td{color:var(--muted)}
.rp-pill{display:inline-block;font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:99px;white-space:nowrap}
.rp-identified{color:var(--amber-d);background:var(--amber-bg)}
.rp-ongoing{color:var(--green-700);background:color-mix(in srgb,var(--green-700) 12%,transparent)}
.rp-implemented{color:var(--ok);background:var(--ok-bg)}
/* The dropdown must never appear on paper. */
@media print{ .rna-print-wrap{display:none !important} }