/* v0.31.0-rc1 (PKA evidence, staffing and reporting; ADR 0036; CV report redesign). Built only from the design tokens of tokens.css - no new colours. */

.pka-case-bar { display: flex; flex-wrap: wrap; gap: var(--space-xs); align-items: center; margin: var(--space-sm) 0; }

.pka-tab { margin-top: var(--space-md); min-width: 0; max-width: 100%; }

/* v0.31.0-rc2 (PKA-MOBILE-READINESS-OVERFLOW-001): nothing in the PKA workspace may make the PAGE wider than the viewport. Wide tables scroll inside their own container, long codes and text wrap, the
   case bar and the tabs wrap instead of pushing the layout. */
.pka-case-bar > * { max-width: 100%; }
.pka-case-bar .status-badge { white-space: normal; text-align: left; }
/* Desktop: the usual single-row tab bar (it scrolls inside itself if ever needed). Narrow screens: the tabs wrap onto several rows so every tab stays visible. */
.pka-tabs { max-width: 100%; }
@media (max-width: 90rem) { .pka-tabs { flex-wrap: wrap; overflow-x: visible; } }
.pka-tab .card, .pka-tab section, .pka-tab .alert { min-width: 0; max-width: 100%; }
.pka-tab .card, .pka-tab .alert, .pka-finding, .pka-dl dd, .pka-wrap, .stat-card { overflow-wrap: anywhere; }
.table-scroll { overflow-x: auto; max-width: 100%; }
.table-scroll .data-table { min-width: 34rem; }
.pka-wrap { min-width: 10rem; }
/* A select is as wide as its longest option (a long section title made it 3585 px): form controls never exceed their container. */
:is(.pka-tab, .pka-form) .form-grid, :is(.pka-tab, .pka-form) .form-grid > label { min-width: 0; }
:is(.pka-tab, .pka-form) select, :is(.pka-tab, .pka-form) input, :is(.pka-tab, .pka-form) textarea { max-width: 100%; box-sizing: border-box; }
.pka-form { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
/* v0.33 Stage C closeout: a hint under a field (e.g. "only the units of your PKA scope") sits on its own line, not beside the control. */
.pka-form .form-field__help { display: block; margin-top: var(--space-2xs); }

.pka-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(22rem, 100%), 1fr)); gap: var(--space-md); }

.pka-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(11rem, 100%), 1fr)); gap: var(--space-sm); margin: var(--space-sm) 0 var(--space-md); }

.pka-dl { display: grid; grid-template-columns: minmax(10rem, 17rem) 1fr; gap: var(--space-2xs) var(--space-md); margin: var(--space-sm) 0; }
.pka-dl dt { color: var(--color-text-secondary); font-weight: 600; }
.pka-dl dd { margin: 0; overflow-wrap: anywhere; }

.pka-plain-list { margin: 0; padding-left: 1.1rem; }

.pka-form { margin-top: var(--space-md); }
.pka-form .form-grid { margin-bottom: var(--space-sm); }

.pka-table-wrap { overflow-x: auto; }
.pka-table-wrap .data-table { min-width: 52rem; }

.pka-row--warning td, .pka-row--warning { background: var(--color-warning-bg); }

.pka-assignment { display: flex; flex-wrap: wrap; gap: var(--space-2xs) var(--space-xs); align-items: center; padding: var(--space-3xs) 0; }

.pka-panel { margin-top: var(--space-md); border-color: var(--color-border-strong); }

.pka-options { display: grid; gap: var(--space-2xs); margin: var(--space-sm) 0; }

.pka-picker__bar { display: flex; gap: var(--space-xs); align-items: center; }
.pka-picker__bar input { flex: 1 1 14rem; }
.pka-picker__results { list-style: none; margin: var(--space-xs) 0; padding: 0; display: grid; gap: var(--space-2xs); }
.pka-picker__results li { flex-wrap: wrap; display: flex; justify-content: space-between; gap: var(--space-sm); align-items: center; padding: var(--space-2xs) var(--space-xs); border: 1px solid var(--color-border); border-radius: 6px; background: var(--color-surface); }

.pka-split { display: grid; grid-template-columns: minmax(16rem, 22rem) minmax(0, 1fr); gap: var(--space-md); align-items: start; }
.pka-section-list ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3xs); }
.pka-section-list li { padding-left: calc(var(--depth, 0) * 0.9rem); }
.pka-section-list li > button { width: 100%; text-align: left; display: grid; gap: var(--space-3xs); padding: var(--space-xs); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 6px; cursor: pointer; color: var(--color-text-primary); font: inherit; }
.pka-section-list li.active > button { border-color: var(--color-primary); background: var(--color-primary-subtle); }
.pka-section--criterion > button { font-weight: 600; }
.pka-section-list__meta { display: flex; flex-wrap: wrap; gap: var(--space-2xs); align-items: center; font-weight: 400; }

.pka-editor textarea { width: 100%; min-height: 14rem; resize: vertical; }
.pka-editor__bar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-xs); margin: var(--space-2xs) 0 var(--space-sm); }

.pka-guidance { margin: var(--space-xs) 0 var(--space-sm); border: 1px solid var(--color-border); border-radius: 6px; padding: var(--space-xs) var(--space-sm); background: var(--color-surface-sunken); }
.pka-guidance__text { white-space: pre-wrap; font: inherit; margin: var(--space-xs) 0 0; }

.pka-findings { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-xs); }
.pka-finding { padding: var(--space-xs) var(--space-sm); border: 1px solid var(--color-border); border-left-width: 4px; border-radius: 6px; background: var(--color-surface); }
.pka-finding--counted { border-left-color: var(--color-warning-solid); }
.pka-finding--review { border-left-color: var(--color-info-solid); }

.pka-stepper { display: flex; flex-wrap: wrap; gap: var(--space-xs); list-style: none; margin: var(--space-sm) 0 var(--space-md); padding: 0; }
.pka-stepper li { display: flex; gap: var(--space-2xs); align-items: center; padding: var(--space-2xs) var(--space-sm); border: 1px solid var(--color-border); border-radius: 999px; color: var(--color-text-secondary); background: var(--color-surface); }
.pka-stepper li.active { border-color: var(--color-primary); color: var(--color-primary-text); background: var(--color-primary-subtle); font-weight: 600; }
.pka-stepper li.done { color: var(--color-success-text); border-color: var(--color-success-border); background: var(--color-success-bg); }
.pka-stepper__no { display: inline-grid; place-items: center; width: 1.4rem; height: 1.4rem; border-radius: 50%; background: var(--color-surface-sunken); font-size: .8rem; }
.pka-wizard-nav { margin-top: var(--space-md); }

/* CV description form (UI-CV-SCIENTIFIC-REPORT-REDESIGN-001) */
.cv-descriptions { max-width: 62rem; }
.cv-descriptions__field { margin: 0 0 var(--space-md); }
.cv-descriptions__field > label { display: block; font-weight: 600; margin-bottom: var(--space-3xs); }
.cv-descriptions__hint { margin: 0 0 var(--space-2xs); color: var(--color-text-secondary); font-size: .9rem; }
.cv-descriptions textarea { width: 100%; min-height: 8.5rem; resize: vertical; box-sizing: border-box; }
.cv-descriptions__meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-xs); margin-top: var(--space-3xs); }
.cv-descriptions__actions { position: sticky; bottom: 0; display: flex; flex-wrap: wrap; gap: var(--space-xs); align-items: center; padding: var(--space-sm) 0; background: linear-gradient(to top, var(--color-canvas) 70%, transparent); }
.cv-descriptions__dirty { color: var(--color-warning-text); font-weight: 600; }

@media (max-width: 52rem) {
    .pka-split { grid-template-columns: 1fr; }
    .pka-dl { grid-template-columns: 1fr; }
    .pka-picker__bar { flex-wrap: wrap; }
    .cv-descriptions__actions { position: static; }
}
