/* Project-specific styling layered on top of Pico.css */
:root {
    --pico-font-size: 100%;
    /* Brand / theme tokens */
    --brand:        #0f766e;   /* teal-700 */
    --brand-dark:   #115e59;
    --brand-tint:   #ecfdf5;
    --side-bg:      #0f172a;   /* slate-900 */
    --side-bg-2:    #1e293b;   /* slate-800 */
    --side-fg:      #cbd5e1;   /* slate-300 */
    --side-fg-dim:  #64748b;   /* slate-500 */
    --side-active:  #14b8a6;   /* teal-500 */
    --sidebar-w:    248px;
    --pico-primary: var(--brand);
    --pico-primary-hover: var(--brand-dark);
}

footer.container { margin-top: 2rem; opacity: 0.7; }

/* ============================================================
   App shell — sidebar + topbar + content
   ============================================================ */
.app-shell { display: flex; min-height: 100vh; align-items: stretch; }

.sidebar {
    width: var(--sidebar-w); flex: 0 0 var(--sidebar-w);
    background: linear-gradient(180deg, var(--side-bg) 0%, var(--side-bg-2) 100%);
    color: var(--side-fg); display: flex; flex-direction: column;
    position: sticky; top: 0; height: 100vh; overflow-y: auto;
}
.sidebar .brand {
    display: flex; align-items: center; gap: 0.6rem; text-decoration: none;
    padding: 1rem 1.1rem; color: #fff; border-bottom: 1px solid rgba(255,255,255,0.08);
}
.brand-mark {
    background: var(--brand); color: #fff; font-weight: 800; letter-spacing: 0.02em;
    padding: 0.3rem 0.5rem; border-radius: 8px; font-size: 0.95rem;
}
.brand-text { display: flex; flex-direction: column; line-height: 1.1; font-weight: 700; }
.brand-text small { color: var(--side-fg-dim); font-weight: 500; font-size: 0.68rem; }

.side-nav { flex: 1 1 auto; padding: 0.6rem 0.5rem; }
.nav-group {
    color: var(--side-fg-dim); font-size: 0.68rem; text-transform: uppercase;
    letter-spacing: 0.07em; font-weight: 700; margin: 0.9rem 0.7rem 0.3rem;
}
.nav-item {
    display: flex; align-items: center; gap: 0.6rem; text-decoration: none;
    color: var(--side-fg); padding: 0.5rem 0.7rem; border-radius: 8px;
    font-size: 0.9rem; margin-bottom: 0.1rem;
}
.nav-item:hover { background: rgba(255,255,255,0.06); color: #fff; }
.nav-item.active { background: var(--brand); color: #fff; font-weight: 600; }
.nav-ico { width: 1.2rem; text-align: center; font-size: 0.95rem; opacity: 0.95; }
.side-foot { padding: 0.7rem 1.1rem; color: var(--side-fg-dim); border-top: 1px solid rgba(255,255,255,0.08); }

.app-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.topbar {
    position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 0.8rem;
    background: var(--pico-background-color); border-bottom: 1px solid var(--pico-muted-border-color);
    padding: 0.6rem 1.4rem; min-height: 3.1rem;
}
.topbar-title { font-size: 1rem; }
.topbar-spacer { flex: 1 1 auto; }
.nav-burger { display: none; width: auto; margin: 0; padding: 0.2rem 0.6rem; background: transparent; color: var(--pico-color); border: 1px solid var(--pico-muted-border-color); }
.app-main { flex: 1 1 auto; padding: 1.4rem 1.6rem; max-width: 1180px; width: 100%; }
.app-foot { padding: 1rem 1.6rem; opacity: 0.6; }

.scrim { display: none; }

/* Auth pages (login / register) — no sidebar, centered card */
.app-shell.no-nav { display: block; }
.app-shell.no-nav .app-main { max-width: none; display: flex; justify-content: center; align-items: flex-start; padding-top: 4rem; min-height: 80vh; }
.auth-card { width: 100%; max-width: 360px; border: 1px solid var(--pico-muted-border-color); border-radius: 14px; padding: 1.6rem 1.6rem 1.2rem; background: var(--pico-card-background-color); box-shadow: 0 8px 30px rgba(0,0,0,0.06); }
.auth-brand { font-size: 1.1rem; margin-bottom: 0.6rem; }
.auth-card h3 { margin: 0.2rem 0 0.9rem; }
.auth-error { background: #f8d7da; color: #842029; padding: 0.5rem 0.7rem; border-radius: 8px; font-size: 0.88rem; }
.auth-ok { background: #d1e7dd; color: #0f5132; padding: 0.5rem 0.7rem; border-radius: 8px; font-size: 0.9rem; }

/* User avatar (sidebar foot + topbar) */
.avatar { display: inline-flex; align-items: center; justify-content: center; width: 1.9rem; height: 1.9rem; border-radius: 50%; background: var(--brand); color: #fff; font-size: 0.72rem; font-weight: 700; flex: 0 0 auto; }
.side-user { display: flex; align-items: center; gap: 0.55rem; padding: 0.6rem 1.1rem; border-top: 1px solid rgba(255,255,255,0.08); color: var(--side-fg); }
.side-user-meta { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.side-user-meta strong { font-size: 0.85rem; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.side-user-meta small { color: var(--side-fg-dim); text-transform: capitalize; }
.topbar-user { display: inline-flex; align-items: center; gap: 0.6rem; }
.logout-link { font-size: 0.85rem; }

/* Team / read-only (M-Collab) */
.ro-banner { background: #fff3cd; color: #7a5b00; padding: 0.5rem 0.8rem; border-radius: 8px; font-size: 0.9rem; }
.team-list { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; margin-bottom: 0.6rem; }
.team-member { display: inline-flex; align-items: center; gap: 0.15rem; }
.team-del-form { display: inline; margin: 0; }
.team-del-form .bld-icon { padding: 0 0.35rem; }

/* Live presence (M-Collab Stage 4) */
.presence-bar { display: flex; align-items: center; gap: 0.3rem; min-height: 1.9rem; margin: 0.2rem 0 0.6rem; }
.presence-label { color: var(--pico-muted-color); margin-right: 0.15rem; }
.presence-avatar { width: 1.7rem; height: 1.7rem; background: #475569; border: 2px solid var(--pico-background-color); box-shadow: 0 0 0 1px var(--pico-muted-border-color); }
.presence-avatar + .presence-avatar { margin-left: -0.5rem; }
.item-attr { color: var(--pico-muted-color); font-size: 0.72rem; }
.item-attr:not(:empty) { display: block; margin-top: 0.1rem; }

/* Off-canvas sidebar on narrow screens (phone / tablet portrait) */
@media (max-width: 920px) {
    .nav-burger { display: inline-block; }
    .sidebar {
        position: fixed; left: 0; top: 0; z-index: 40; height: 100vh;
        transform: translateX(-100%); transition: transform 0.22s ease;
        box-shadow: 2px 0 16px rgba(0,0,0,0.35);
    }
    body.nav-open .sidebar { transform: translateX(0); }
    body.nav-open .scrim {
        display: block; position: fixed; inset: 0; z-index: 30; background: rgba(0,0,0,0.45);
    }
    .app-main { padding: 1rem; }
}

/* ============================================================
   Status chips / badges (C·NC·NA, draft/published, generic)
   ============================================================ */
.chip {
    display: inline-block; padding: 0.08rem 0.55rem; border-radius: 999px;
    font-size: 0.72rem; font-weight: 700; letter-spacing: 0.02em; line-height: 1.5;
    border: 1px solid transparent; vertical-align: middle;
}
.chip-ok      { background: #d1e7dd; color: #0f5132; }
.chip-bad     { background: #f8d7da; color: #842029; }
.chip-muted   { background: #e2e3e5; color: #41464b; }
.chip-info    { background: #cfe2ff; color: #084298; }
.chip-warn    { background: #fff3cd; color: #7a5b00; }
.chip-brand   { background: var(--brand-tint); color: var(--brand-dark); border-color: #99f6e4; }
.status-draft     { background: #fff3cd; color: #7a5b00; }
.status-published { background: #d1e7dd; color: #0f5132; }
.status-archived  { background: #e2e3e5; color: #41464b; }
.status-baseline  { background: #cfe2ff; color: #084298; }

/* Dashboard KPI cards */
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 1rem; margin: 0.5rem 0 1.2rem; }
.kpi { border: 1px solid var(--pico-muted-border-color); border-radius: 12px; padding: 0.9rem 1.1rem; background: var(--pico-card-background-color); }
.kpi .kpi-val { font-size: 1.7rem; font-weight: 800; line-height: 1.1; color: var(--brand-dark); }
.kpi .kpi-lbl { color: var(--pico-muted-color); font-size: 0.82rem; margin-top: 0.2rem; }
.kpi.kpi-alert .kpi-val { color: #b02a37; }
.quick-actions { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 0.5rem 0 1.4rem; }
.quick-actions a[role=button] { width: auto; }

/* Read-only checklist view */
.ck-machine { border: 1px solid var(--pico-muted-border-color); border-radius: 10px; margin: 0.8rem 0; }
.ck-machine > summary { font-weight: 700; padding: 0.7rem 1rem; cursor: pointer; }
.ck-section { padding: 0.2rem 1rem 0.6rem; }
.ck-item { padding: 0.35rem 0; border-bottom: 1px dashed var(--pico-muted-border-color); }
.ck-item .interp { margin-top: 0.25rem; }

/* --- Machine inspection header --- */
.machine-header {
    position: sticky; top: 0; z-index: 10;
    background: var(--pico-background-color);
    padding: 0.5rem 0; border-bottom: 1px solid var(--pico-muted-border-color);
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem;
}
.machine-header hgroup { margin: 0; }
.overall { min-width: 280px; }
.overall progress { margin-bottom: 0.25rem; }

/* --- Accordion sections --- */
details.section { border: 1px solid var(--pico-muted-border-color); border-radius: 8px; margin: 0.6rem 0; padding: 0 0.8rem; }
details.section > summary { font-size: 1.05rem; padding: 0.7rem 0; cursor: pointer; }
.sec-badge { color: var(--pico-muted-color); font-weight: normal; }
.group-title { margin: 0.8rem 0 0.3rem; color: var(--pico-primary); text-transform: uppercase; font-size: 0.8rem; letter-spacing: 0.04em; }

/* --- Item row --- */
.item { padding: 0.45rem 0; border-bottom: 1px dashed var(--pico-muted-border-color); }
.item-main { display: flex; align-items: flex-start; gap: 1rem; }
.item-text { flex: 1 1 auto; min-width: 0; line-height: 1.3; }
.item-text .guidance { display: block; color: var(--pico-muted-color); font-style: italic; margin-top: 0.1rem; font-size: 0.85rem; }
.item-comment { margin-top: 0.3rem; margin-bottom: 0; font-size: 0.88rem; padding: 0.35rem 0.5rem; }
.item-hint { color: #dc3545; font-size: 0.8rem; min-height: 0; }
.item-hint:not(:empty) { margin-top: 0.2rem; }

/* --- C / NC / N/A buttons: compact, fixed width so the spec text gets the room --- */
.resp-buttons { display: flex; flex: 0 0 200px; width: 200px; border-radius: 6px; overflow: hidden; border: 1px solid var(--pico-muted-border-color); }
.resp-btn {
    flex: 1 1 0; width: auto; min-width: 0; display: block;
    border: none; background: var(--pico-card-background-color);
    color: var(--pico-color); padding: 0.3rem 0.2rem; margin: 0; cursor: pointer;
    font-weight: 600; font-size: 0.85rem; border-radius: 0; line-height: 1.4;
}
.resp-btn + .resp-btn { border-left: 1px solid var(--pico-muted-border-color); }
.resp-btn:hover { filter: brightness(1.15); }
.resp-c.active  { background: #198754; color: #fff; }
.resp-nc.active { background: #dc3545; color: #fff; }
.resp-na.active { background: #6c757d; color: #fff; }

/* --- Status pills --- */
.pill { display: inline-block; padding: 0.05rem 0.45rem; border-radius: 10px; font-size: 0.78rem; font-weight: 600; }
.pill-c  { background: #d1e7dd; color: #0f5132; }
.pill-nc { background: #f8d7da; color: #842029; }
.pill-na { background: #e2e3e5; color: #41464b; }

.prog-line { display: flex; align-items: center; gap: 0.5rem; }

/* --- M5: companion-document badges (cross-references + annex tags) --- */
.item-badges { display: inline-flex; flex-wrap: wrap; gap: 0.25rem; margin-top: 0.25rem; vertical-align: middle; }
.src-pill {
    display: inline-block; padding: 0.02rem 0.4rem; border-radius: 6px;
    font-size: 0.68rem; font-weight: 600; line-height: 1.5;
    color: var(--src, #475569); background: color-mix(in srgb, var(--src, #475569) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--src, #475569) 35%, transparent);
}
.src-pill.src-strong { color: #fff; background: var(--src, #475569); border-color: var(--src, #475569); }
.ref-pill {
    display: inline-block; padding: 0.02rem 0.4rem; border-radius: 6px;
    font-size: 0.68rem; font-weight: 600; color: #475569;
    background: #eef2f7; border: 1px solid #d7dee8;
}
.crit-pill { display: inline-block; padding: 0.02rem 0.4rem; border-radius: 6px; font-size: 0.68rem; font-weight: 700; }
.crit-C { background: #f8d7da; color: #842029; }
.crit-M { background: #fff3cd; color: #7a5b00; }
.crit-m { background: #e2e3e5; color: #41464b; }

/* Per-source section filter */
.src-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem; margin: 0.5rem 0 0.75rem; }
.src-filter-label { font-size: 0.8rem; color: var(--pico-muted-color); }
.src-chip {
    padding: 0.1rem 0.6rem; margin: 0; border-radius: 14px; font-size: 0.76rem; font-weight: 600;
    cursor: pointer; background: var(--pico-card-background-color);
    border: 1px solid color-mix(in srgb, var(--src, #94a3b8) 50%, var(--pico-muted-border-color));
    color: var(--pico-color); width: auto;
}
.src-chip.active { background: var(--src, #334155); color: #fff; border-color: var(--src, #334155); }
.section-hidden { display: none !important; }

/* --- M6 Checklist Builder (checklist-style editor) --- */
.builder-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.builder-head form { margin: 0; }
.bld-add { display: flex; gap: 0.4rem; align-items: center; margin: 0.5rem 0; }
.bld-add input, .bld-add select { margin: 0; }
.bld-add button { width: auto; white-space: nowrap; }
.bld-inline { display: inline-flex; gap: 0.3rem; align-items: center; margin: 0; flex-wrap: wrap; }
.bld-inline input, .bld-inline select { margin: 0; }
.bld-inline button { width: auto; }
.bld-actions { display: inline-flex; gap: 0.25rem; align-items: center; flex-wrap: wrap; margin-top: 0.3rem; }
.bld-actions form { margin: 0; display: inline; }
.bld-actions button { width: auto; padding: 0.15rem 0.5rem; font-size: 0.8rem; margin: 0; }
.bld-archived { opacity: 0.7; }
.bld-archived-block { margin-top: 1rem; }

.bld-area-head { display: flex; align-items: center; gap: 0.5rem; }
.bld-area-head h3 { margin: 0; }
/* Small inline "cog" settings popovers keep the checklist clean by default. */
.bld-cog { display: inline-block; }
.bld-cog > summary { list-style: none; cursor: pointer; color: var(--pico-muted-color); font-size: 0.85rem; padding: 0 0.3rem; }
.bld-cog > summary::-webkit-details-marker { display: none; }
.bld-cog[open] { background: var(--pico-card-sectioning-background-color); border-radius: 6px; padding: 0.4rem; margin: 0.2rem 0; }
.bld-subadd { margin-left: 0.5rem; }
.sec-count { color: var(--pico-muted-color); font-size: 0.8rem; font-weight: normal; }

.bld-sub { display: flex; align-items: center; gap: 0.4rem; }
.bld-sub .group-title { margin: 0.4rem 0 0.2rem; }

/* Spec row — looks like a checklist item, actions appear on hover/focus. */
.bld-spec { padding: 0.2rem 0.3rem; border-bottom: 1px solid var(--pico-card-border-color); }
.bld-spec-main { display: flex; align-items: center; gap: 0.5rem; }
.bld-spec-text { flex: 1; }
.bld-spec-actions { display: inline-flex; align-items: center; gap: 0.15rem; opacity: 0.35; transition: opacity 0.15s; }
.bld-spec:hover .bld-spec-actions, .bld-spec:focus-within .bld-spec-actions { opacity: 1; }
.bld-spec-actions form { margin: 0; display: inline-flex; }
.bld-icon { width: auto; margin: 0; padding: 0.05rem 0.4rem; font-size: 0.85rem; border-radius: 4px; background: transparent; border: 1px solid var(--pico-muted-border-color); color: var(--pico-color); cursor: pointer; }
.bld-icon:hover { background: var(--pico-secondary-background); }
.bld-del:hover { background: #f8d7da; color: #842029; }
.bld-move select { width: auto; margin: 0; padding: 0.05rem 0.3rem; font-size: 0.78rem; max-width: 12rem; }
.bld-edit { margin: 0.25rem 0 0.4rem; }
.bld-edit > summary { cursor: pointer; font-size: 0.78rem; color: #0a66c2; }
.bld-edit label { font-size: 0.8rem; }
.bld-edit textarea, .bld-edit input, .bld-edit select { margin-bottom: 0.3rem; }
.bld-edit button { width: auto; }
.bld-edit-foot { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.reviewed-chk { font-size: 0.8rem; color: var(--pico-muted-color); display: inline-flex; align-items: center; gap: 0.3rem; }
.reviewed-chk input { width: auto; margin: 0; }
/* Stale-translation flag: amber border + amber label only (keep the text readable). */
.stale-flag { color: #f59e0b; font-weight: 700; cursor: help; }
.bld-edit label.stale { color: #f59e0b; }
.bld-edit label.stale textarea { border-color: #f59e0b; border-width: 2px; }
.stale-tag { color: #f59e0b; font-size: 0.72rem; font-weight: 700; }

/* --- M6b suggestions --- */
.sug { padding: 0.6rem 0.8rem; }
.sug > header { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.sug-field { color: var(--pico-muted-color); font-size: 0.78rem; }
.sug-why { margin: 0.2rem 0; color: var(--pico-muted-color); }
.sug-current pre { white-space: pre-wrap; font-size: 0.8rem; background: var(--pico-card-sectioning-background-color); padding: 0.4rem; border-radius: 4px; }
.sug-form { margin: 0.3rem 0 0.2rem; }
.sug-form textarea { margin-bottom: 0.3rem; }
.sug-actions { display: inline-block; }
.sug-actions button { width: auto; }
.sug-reject { display: inline-block; margin-left: 0.5rem; }
.sug-reject button { width: auto; }

/* --- M6 item interpretation + language toggle --- */
.interp { display: block; color: #1d3a66; background: #eef5ff; border-left: 3px solid #4f93e6; padding: 1px 6px; margin-top: 2px; border-radius: 3px; font-style: normal; }
.lang-toggle { display: flex; gap: 0.3rem; align-items: center; margin: 0.3rem 0 0.6rem; }
.lang-toggle small { color: var(--pico-muted-color); }
.lang-chip { padding: 0.05rem 0.5rem; border-radius: 12px; font-size: 0.78rem; text-decoration: none; border: 1px solid var(--pico-muted-border-color); color: var(--pico-color); }
.lang-chip.active { background: #334155; color: #fff; border-color: #334155; }

/* --- Participants editor --- */
.participant-row { display: flex; gap: 0.5rem; align-items: center; margin-bottom: 0.4rem; }
.participant-row input { margin-bottom: 0; }
.participant-row .p-name { flex: 2; }
.participant-row .p-position { flex: 2; }
.participant-row .p-email { flex: 3; }
.participant-row .p-remove { flex: 0 0 auto; width: auto; padding: 0.3rem 0.6rem; margin: 0; background: #dc3545; border-color: #dc3545; }
.title-preview { font-family: var(--pico-font-family-monospace, monospace); color: var(--pico-primary); }

/* --- Special sections (Punch list / Conclusion) --- */
details.section.special { border-color: var(--pico-primary); }
.refresh-btn, .signoff-btn { width: auto; display: inline-block; padding: 0.2rem 0.6rem; margin: 0 0 0 0.5rem; font-size: 0.8rem; }
.punch-table td, .punch-table th, .signoff-table td, .signoff-table th { padding: 0.35rem 0.5rem; font-size: 0.9rem; }
.punch-table code { font-size: 0.8rem; }
.signed { color: #198754; font-weight: 600; }

/* --- Go / No-Go decision buttons --- */
.decision-buttons { display: inline-flex; border-radius: 6px; overflow: hidden; border: 1px solid var(--pico-muted-border-color); }
.decision-btn {
    width: auto; display: block; border: none; margin: 0; cursor: pointer; font-weight: 700;
    padding: 0.4rem 1.4rem; background: var(--pico-card-background-color); color: var(--pico-color); border-radius: 0;
}
.decision-btn + .decision-btn { border-left: 1px solid var(--pico-muted-border-color); }
.decision-go.active   { background: #198754; color: #fff; }
.decision-nogo.active { background: #dc3545; color: #fff; }

/* --- Inspection nav (dedicated menu / tabs) --- */
.ins-nav { display: flex; flex-wrap: wrap; gap: 0.3rem; margin: 0.4rem 0 1rem; border-bottom: 1px solid var(--pico-muted-border-color); padding-bottom: 0.4rem; }
.ins-nav a { padding: 0.35rem 0.8rem; border-radius: 6px 6px 0 0; text-decoration: none; font-size: 0.9rem; color: var(--pico-color); }
.ins-nav a:hover { background: var(--pico-card-background-color); }
.ins-nav a.active { background: var(--pico-primary); color: #fff; font-weight: 600; }

/* --- Punch list table --- */
.punch-table { table-layout: fixed; }
.punch-table th, .punch-table td { vertical-align: top; }
.punch-table textarea, .punch-table input { margin-bottom: 0; font-size: 0.85rem; padding: 0.3rem 0.4rem; }
.punch-table col.c-ref { width: 3.5rem; }
/* The five entry columns share equal width. */
.punch-table col.c-finding,
.punch-table col.c-action,
.punch-table col.c-owner,
.punch-table col.c-deadline,
.punch-table col.c-done { width: 19%; }
.punch-table input[type="date"] { width: 100%; }
.finding { border-bottom: 1px dotted var(--pico-muted-color); cursor: help; }
.blocking-flag { display: flex; align-items: center; gap: 0.3rem; font-size: 0.72rem; color: #dc3545; margin-top: 0.25rem; }
.blocking-flag input[type=checkbox] { width: auto; margin: 0; }
tr.done-row { opacity: 0.6; }
tr.done-row td:first-child code { text-decoration: line-through; }

/* --- Auto-growing textareas (comments / actions): grow with content, no scrollbar --- */
textarea.autogrow { resize: none; overflow: hidden; }

/* --- Attachments (photos & documents) --- */
.attachments { margin-top: 0.4rem; }
.att-actions { display: flex; gap: 0.5rem; margin-bottom: 0.4rem; }   /* static, on top */
.att-actions form { margin: 0; }
.att-add { display: inline-block; cursor: pointer; font-size: 0.8rem; padding: 0.35rem 0.7rem;
    border: 1px dashed var(--pico-muted-border-color); border-radius: 6px; }
.att-add:hover { background: var(--pico-card-background-color); }

/* Photos: responsive grid (rows & columns), each with a caption */
.att-photos { display: flex; flex-wrap: wrap; gap: 0.6rem; margin-bottom: 0.4rem; }
.att { margin: 0; width: 140px; display: flex; flex-direction: column; gap: 0.2rem; }
.att img { width: 140px; height: 100px; object-fit: cover; border-radius: 6px; border: 1px solid var(--pico-muted-border-color); cursor: zoom-in; }
.att-caption { font-size: 0.75rem !important; padding: 0.25rem 0.35rem !important; margin: 0 !important; }
.att-del { width: auto; padding: 0.1rem 0.45rem; margin: 0; align-self: flex-start; background: #dc3545; border-color: #dc3545; font-size: 0.72rem; }

/* Documents: plain list, title only */
.att-docs { list-style: none; padding: 0; margin: 0; }
.att-docs li { display: flex; align-items: center; gap: 0.5rem; padding: 0.15rem 0; font-size: 0.9rem; }
.att-docs li small { color: var(--pico-muted-color); }
.att-docs .att-del { align-self: auto; padding: 0 0.4rem; }

/* M6c — external assessments */
.ext-source { border: 1px solid var(--pico-muted-border-color); border-radius: 6px; margin: 0.6rem 0; padding: 0 0.8rem; }
.ext-source > summary { padding: 0.6rem 0; cursor: pointer; display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.ext-topic { border-top: 1px solid var(--pico-muted-border-color); padding: 0.4rem 0 0.8rem; }
.ext-conclusion { display: grid; grid-template-columns: 8rem 10rem 1fr; gap: 0.6rem; align-items: start; }
.ext-conclusion label { font-size: 0.78rem; margin: 0; }
.ext-conclusion input, .ext-conclusion select, .ext-conclusion textarea { margin-bottom: 0; }
.ext-conclusion .ext-obs { grid-column: 3 / 4; }
@media (max-width: 720px) { .ext-conclusion { grid-template-columns: 1fr; } .ext-conclusion .ext-obs { grid-column: auto; } }
.ext-findings { margin: 0.5rem 0 0.2rem; padding-left: 0.2rem; }
.ext-finding { display: flex; gap: 0.5rem; align-items: center; margin-bottom: 0.3rem; }
.ext-finding textarea { flex: 1; margin: 0; }
.ext-finding .blocking-flag { margin-top: 0; white-space: nowrap; }
.ext-finding .ext-del { padding: 0 0.4rem; margin: 0; align-self: center; }
.ext-add-finding { padding: 0.1rem 0.6rem; font-size: 0.8rem; }
.ext-refs { margin-top: 0.4rem; }
.ext-ref-list { margin: 0.3rem 0; padding-left: 1.1rem; font-size: 0.82rem; color: var(--pico-muted-color); }
.ext-ref-list li { margin-bottom: 0.2rem; }
.crit-badge { display: inline-block; background: #b45309; color: #fff; border-radius: 3px; padding: 0 0.3rem; font-size: 0.7rem; font-weight: 600; margin-right: 0.2rem; }

/* M6c — qualification protocols */
.qual-card { border: 1px solid var(--pico-muted-border-color); border-radius: 6px; margin: 0.6rem 0; padding: 0.6rem 0.9rem; }
.qual-card > header { margin-bottom: 0.4rem; }
.qual-when { float: right; }
.qual-ref { font-size: 0.85rem; background: var(--pico-card-sectioning-background-color); border-radius: 5px; padding: 0.4rem 0.7rem; margin-bottom: 0.5rem; }
.qual-ref p { margin: 0.15rem 0; }
.qual-conclusion { display: grid; grid-template-columns: 9rem 11rem; gap: 0.5rem 0.8rem; align-items: start; }
.qual-conclusion .qual-text { grid-column: 1 / 3; }
.qual-conclusion label { font-size: 0.78rem; margin: 0; }
.qual-conclusion select, .qual-conclusion textarea { margin-bottom: 0; }
@media (max-width: 720px) { .qual-conclusion { grid-template-columns: 1fr; } .qual-conclusion .qual-text { grid-column: auto; } }

/* Qualification results table (acceptance criteria) */
.qual-results-wrap { margin: 0.4rem 0 0.6rem; }
.qual-results-wrap > summary { cursor: pointer; font-size: 0.9rem; padding: 0.2rem 0; }
.qr-table { font-size: 0.85rem; margin: 0.4rem 0; }
.qr-table th, .qr-table td { padding: 0.25rem 0.4rem; vertical-align: middle; }
.qr-table th { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; color: var(--pico-muted-color); }
.qr-table input, .qr-table select { margin: 0; padding: 0.2rem 0.4rem; font-size: 0.85rem; }
.qr-fixed { color: var(--pico-color); }
.qr-unit { white-space: nowrap; color: var(--pico-muted-color); }
.qr-verdict { width: auto; min-width: 5rem; }
.qr-verdict.v-pass { background: #d1e7dd; }
.qr-verdict.v-fail { background: #f8d7da; }
.qr-table .bld-icon { padding: 0.05rem 0.4rem; }
.qr-c-param { width: 30%; } .qr-c-spec { width: 24%; } .qr-c-result { width: 28%; } .qr-c-verdict { width: 10%; }
.qr-interp { display: block; color: var(--pico-muted-color); font-style: italic; font-size: 0.76rem; margin-top: 0.15rem; line-height: 1.25; }
.qr-interp-input { font-size: 0.78rem !important; margin-top: 0.2rem; }
.qr-kind { width: auto !important; min-width: 6rem; font-size: 0.75rem; margin-top: 0.2rem; }
.qr-measure { display: flex; align-items: center; gap: 0.3rem; }
.qr-unit-input { max-width: 4.5rem; }
.qr-observation { width: 100%; }
.qr-assess { background: color-mix(in srgb, #fff3cd 30%, transparent); }
.qr-assess .qr-c-result, .qr-row.qr-assess td:nth-child(3) { font-style: normal; }

/* Coverage / redundancy view */
.cov-table td { vertical-align: top; }
.cov-item { line-height: 1.3; }
.cov-rel { margin-bottom: 0.35rem; font-size: 0.88rem; }
.cov-rel .chip { margin-right: 0.25rem; }
.cov-kw { color: var(--pico-muted-color); font-size: 0.72rem; }

/* Spelling & grammar (LanguageTool) helper */
.gram-wrap { margin: 0.1rem 0 0.4rem; }
.gram-btn { width: auto; padding: 0.05rem 0.5rem; font-size: 0.72rem; margin: 0; opacity: 0.55; }
.gram-btn:hover { opacity: 1; }
.gram-out { margin-top: 0.25rem; }
.gram-out .gram-ok { color: #198754; }
.gram-out .gram-off { color: var(--pico-muted-color); font-style: italic; }
.gram-match { font-size: 0.8rem; margin-bottom: 0.25rem; }
.gram-match small { display: block; color: #842029; margin-bottom: 0.15rem; }
.gram-fix { width: auto; padding: 0.05rem 0.5rem; margin: 0 0.25rem 0.2rem 0; font-size: 0.78rem;
    background: var(--brand-tint); color: var(--brand-dark); border: 1px solid #99f6e4; border-radius: 6px; }
.gram-fix:hover { background: #99f6e4; }