:root {
    --navy: #2e478f;
    --navy-dark: #1f326c;
    --red: #d71920;
    --ink: #18181b;
    --muted: #606776;
    --line: #d9dde6;
    --surface: #ffffff;
    --surface-soft: #f5f7fb;
    --success: #176b3a;
    --warning: #8a5a00;
    --danger: #a61b24;
    --radius: 14px;
    --shadow: 0 10px 30px rgba(31, 50, 108, 0.08);
}

* { box-sizing: border-box; }
html { color-scheme: light; }
body { margin: 0; font-family: Arial, Helvetica, sans-serif; color: var(--ink); background: var(--surface-soft); line-height: 1.5; }
a { color: var(--navy-dark); }
a:hover { color: var(--red); }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
img { max-width: 100%; }

.auth-body { min-height: 100vh; background: linear-gradient(145deg, #eef2fb, #ffffff 58%, #f9ecec); }
.auth-main { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.auth-card { width: min(100%, 460px); background: var(--surface); border: 1px solid var(--line); border-radius: 20px; box-shadow: 0 22px 60px rgba(31, 50, 108, 0.16); padding: 34px; }
.auth-logo { display: block; width: 100%; margin: 0 auto 24px; }
.auth-card h1 { margin: 10px 0 18px; font-size: 1.75rem; }
.banner-message { margin: 0; padding: 12px 14px; border-left: 4px solid var(--red); background: #f6f8ff; color: var(--navy-dark); font-weight: 700; }
.auth-actions { display: flex; justify-content: center; gap: 16px; margin-top: 16px; }
.code-input { text-align: center; letter-spacing: 0.35em; font-size: 1.6rem; font-weight: 700; }

.site-header { position: sticky; top: 0; z-index: 20; display: grid; grid-template-columns: minmax(280px, auto) 1fr auto; align-items: center; gap: 18px; padding: 10px 24px; color: #fff; background: var(--navy-dark); box-shadow: 0 4px 18px rgba(0,0,0,.14); }
.brand { display: flex; align-items: center; gap: 12px; color: #fff; text-decoration: none; font-weight: 700; white-space: nowrap; }
.brand:hover { color: #fff; }
.brand img { width: 180px; background: #fff; border-radius: 4px; }
.brand span { font-size: 1.05rem; }
.primary-nav { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 4px; }
.primary-nav a { color: #fff; text-decoration: none; padding: 9px 10px; border-radius: 7px; font-size: .92rem; }
.primary-nav a:hover, .primary-nav a.active { background: rgba(255,255,255,.15); }
.nav-divider { height: 24px; width: 1px; margin: 0 4px; background: rgba(255,255,255,.35); }
.nav-toggle { display: none; border: 1px solid rgba(255,255,255,.45); color: #fff; background: transparent; border-radius: 7px; padding: 8px 12px; }
.user-menu { display: flex; align-items: center; justify-content: flex-end; gap: 8px; white-space: nowrap; font-size: .9rem; }
.user-menu form { margin: 0; }
.role-pill, .badge { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; font-weight: 700; }
.role-pill { padding: 3px 8px; background: rgba(255,255,255,.16); }
.badge { min-width: 20px; min-height: 20px; padding: 1px 6px; background: var(--red); color: #fff; font-size: .75rem; }

.site-main { width: min(1500px, calc(100% - 36px)); margin: 0 auto; padding: 30px 0 50px; }
.site-footer { padding: 22px; text-align: center; color: var(--muted); font-size: .9rem; }
.page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.page-heading h1 { margin: 0; font-size: clamp(1.7rem, 3vw, 2.4rem); line-height: 1.12; }
.page-heading p:not(.eyebrow) { margin: 8px 0 0; color: var(--muted); }
.eyebrow { margin: 0 0 5px; color: var(--red); font-size: .78rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.balance-chip { min-width: 190px; padding: 14px 18px; border-radius: var(--radius); color: #fff; background: var(--navy); box-shadow: var(--shadow); }
.balance-chip span, .balance-chip strong { display: block; }
.balance-chip span { font-size: .82rem; opacity: .86; }
.balance-chip strong { font-size: 1.25rem; }

.card, .admin-section { margin-bottom: 22px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.card { padding: 24px; }
.card h2, .card h3 { margin-top: 0; }
.card-header { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.card-header h2 { margin: 0; }
.nested-card { margin: 0; box-shadow: none; background: var(--surface-soft); }
.error-card { max-width: 720px; margin: 50px auto; text-align: center; }

.stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 22px; }
.stat-card { min-height: 135px; display: flex; flex-direction: column; justify-content: center; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); text-decoration: none; }
.stat-card strong { color: var(--navy-dark); font-size: 2.2rem; line-height: 1; }
.stat-card span { margin-top: 10px; color: var(--muted); font-weight: 700; }
.stat-card:hover { transform: translateY(-2px); border-color: #aab5d7; }
.summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.summary-grid div { padding: 15px; border-radius: 10px; background: var(--surface-soft); }
.summary-grid span, .summary-grid strong { display: block; }
.summary-grid span { color: var(--muted); font-size: .85rem; }
.summary-grid strong { margin-top: 4px; color: var(--navy-dark); }

/* Compact grouped summary metrics used on administration screens.
   Keep high-level counts together instead of rendering a full-width row per value. */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 14px;
    margin-bottom: 22px;
}
.compact-stats {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: var(--shadow);
}
.compact-stats .stat-card {
    min-height: 96px;
    padding: 16px 18px;
    border: 0;
    border-right: 1px solid var(--line);
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    transform: none;
}
.compact-stats .stat-card:last-child { border-right: 0; }
.compact-stats .stat-card:hover {
    transform: none;
    border-color: var(--line);
    background: var(--surface-soft);
}
.compact-stats .stat-card span {
    order: 1;
    margin: 0 0 7px;
    color: var(--muted);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .03em;
    text-transform: uppercase;
}
.compact-stats .stat-card strong {
    order: 2;
    color: var(--navy-dark);
    font-size: 1.85rem;
    line-height: 1;
}

@media (max-width: 1180px) {
    .compact-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .compact-stats .stat-card { border-bottom: 1px solid var(--line); }
    .compact-stats .stat-card:nth-child(3n) { border-right: 0; }
    .compact-stats .stat-card:nth-last-child(-n+3) { border-bottom: 0; }
}

@media (max-width: 680px) {
    .compact-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .compact-stats .stat-card:nth-child(3n) { border-right: 1px solid var(--line); }
    .compact-stats .stat-card:nth-child(2n) { border-right: 0; }
    .compact-stats .stat-card:nth-last-child(-n+3) { border-bottom: 1px solid var(--line); }
    .compact-stats .stat-card:nth-last-child(-n+2) { border-bottom: 0; }
}

@media (max-width: 420px) {
    .compact-stats { grid-template-columns: 1fr; }
    .compact-stats .stat-card,
    .compact-stats .stat-card:nth-child(2n),
    .compact-stats .stat-card:nth-child(3n) {
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }
    .compact-stats .stat-card:last-child { border-bottom: 0; }
}

.alert { margin-bottom: 18px; padding: 13px 16px; border: 1px solid; border-radius: 10px; }
.alert-success { color: var(--success); background: #eef9f2; border-color: #a9d7ba; }
.alert-warning { color: var(--warning); background: #fff8e7; border-color: #e8cd8a; }
.alert-error { color: var(--danger); background: #fff0f1; border-color: #e8a9ae; }
.alert-info { color: var(--navy-dark); background: #eef3ff; border-color: #b9c7ed; }

.field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
.field label, .decision-form label { color: #333846; font-weight: 700; }
.field small, .help-text, small { color: var(--muted); font-weight: 400; }
input:not([type="radio"]):not([type="checkbox"]), select, textarea { width: 100%; min-height: 42px; padding: 9px 11px; border: 1px solid #b8bfce; border-radius: 8px; background: #fff; color: var(--ink); }
textarea { resize: vertical; }
input:focus, select:focus, textarea:focus, button:focus-visible, a:focus-visible { outline: 3px solid rgba(46,71,143,.25); outline-offset: 2px; border-color: var(--navy); }
input[type="radio"], input[type="checkbox"] { width: 18px; height: 18px; min-width: 18px; min-height: 18px; padding: 0; margin: 0; flex: 0 0 18px; accent-color: var(--navy); }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; align-items: start; }
.two-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.three-columns { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.full-span, .form-grid .field-wide, .form-grid > .form-actions, .form-grid > .form-section-heading { grid-column: 1 / -1; }

.form-card { overflow: hidden; }
.form-section-heading { margin: 8px 0 16px; padding: 13px 15px; border-left: 4px solid var(--navy); border-radius: 8px; background: var(--surface-soft); }
.form-section-heading:first-of-type { margin-top: 0; }
.form-section-heading h3 { margin: 0; color: var(--navy-dark); font-size: 1rem; }
.form-section-heading p { margin: 3px 0 0; color: var(--muted); font-size: .88rem; }
.form-grid > .form-actions { padding-top: 4px; }
.form-grid .checkbox-grid.field, .form-grid .field.checkbox-grid { align-self: stretch; }

/* Quick Counter job picker. This is an in-page combobox instead of a native
   select so long job descriptions cannot create an OS-level popup that spans
   beyond the browser window on multi-monitor workstations. */
.job-combobox { position: relative; width: 100%; min-width: 0; max-width: 100%; }
.job-combobox-input { width: 100%; max-width: 100%; }
.job-combobox-menu { position: absolute; z-index: 80; top: calc(100% + 5px); left: 0; right: 0; width: 100%; max-width: 100%; max-height: min(360px, 50vh); overflow-x: hidden; overflow-y: auto; padding: 5px; border: 1px solid #aeb9d8; border-radius: 9px; background: #fff; box-shadow: 0 12px 28px rgba(20,31,55,.18); }
.job-combobox-option { display: block; width: 100%; max-width: 100%; padding: 9px 10px; border: 0; border-radius: 6px; background: transparent; color: var(--ink); text-align: left; cursor: pointer; white-space: normal; overflow-wrap: anywhere; }
.job-combobox-option + .job-combobox-option { margin-top: 2px; }
.job-combobox-option strong, .job-combobox-option span { display: block; max-width: 100%; }
.job-combobox-option span { margin-top: 2px; color: var(--muted); font-size: .84rem; line-height: 1.3; }
.job-combobox-option:hover, .job-combobox-option.is-active { background: var(--surface-soft); color: var(--navy-dark); }
.job-combobox-option[hidden] { display: none; }
.stat-card small { margin-top: 8px; color: var(--navy); font-weight: 700; }
.stat-card:hover small { color: var(--red); }

.check-group { display: flex; flex-wrap: wrap; gap: 12px 24px; margin: 6px 0 18px; padding: 16px; border: 1px solid var(--line); border-radius: 10px; }
.check-group legend { padding: 0 6px; font-weight: 700; }
.check-group label, .checkbox-field label { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; }
.checkbox-field { justify-content: center; }
.form-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 6px; }
.search-form { display: flex; gap: 10px; margin-bottom: 20px; }
.search-form input { flex: 1; }
.employee-search-form { display: grid; grid-template-columns: minmax(280px, 1fr) minmax(200px, 240px) auto; gap: 12px; align-items: end; }
.employee-search-field, .employee-status-field { display: flex; min-width: 0; flex-direction: column; gap: 6px; }
.employee-search-field label, .employee-status-field label { color: #333846; font-weight: 700; }
.employee-search-input, .employee-status-filter { width: 100%; min-width: 0; }
.employee-search-actions { display: flex; gap: 10px; align-items: center; }

.button { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 9px 15px; border: 1px solid #aeb9d8; border-radius: 8px; color: var(--navy-dark); background: #fff; cursor: pointer; text-decoration: none; font-weight: 700; line-height: 1.2; }
.button:hover { color: var(--red); border-color: var(--red); }
.button-primary { color: #fff; background: var(--navy); border-color: var(--navy); }
.button-primary:hover { color: #fff; background: var(--navy-dark); }
.button-secondary { color: var(--navy-dark); background: #fff; border-color: #aeb9d8; }
.button-secondary:hover { color: var(--red); border-color: var(--red); }
.button-small { min-height: 34px; padding: 6px 10px; font-size: .86rem; }
.button-full { width: 100%; }
.button-link { min-height: auto; padding: 5px; color: var(--navy-dark); background: transparent; border: 0; text-decoration: underline; }

.table-wrap { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 12px 11px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { color: #3d4350; background: #f4f6fa; font-size: .78rem; letter-spacing: .04em; text-transform: uppercase; }
tbody tr:hover { background: #fafbfe; }
.empty-cell { padding: 25px; color: var(--muted); text-align: center; }
.table-note { max-width: 360px; margin: 8px 0 0; color: var(--muted); font-size: .88rem; }
.wide-table { min-width: 900px; }
.status { display: inline-flex; padding: 4px 9px; border-radius: 999px; font-size: .78rem; font-weight: 800; }
.status-submitted { color: #725000; background: #fff1c2; }
.status-approved { color: var(--success); background: #dff4e7; }
.status-declined { color: var(--danger); background: #ffe0e2; }
.decision-form { min-width: 250px; display: grid; gap: 8px; }
.decision-form label { display: grid; gap: 4px; font-size: .8rem; }
.decision-form input, .decision-form select, .decision-form textarea { min-height: 35px; padding: 6px 8px; font-size: .88rem; }

.resource-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.resource-card { min-height: 250px; display: flex; flex-direction: column; justify-content: space-between; gap: 22px; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.resource-card h2 { margin: 8px 0; }
.resource-card p { color: var(--muted); }
.resource-type { color: var(--red); font-size: .75rem; font-weight: 800; letter-spacing: .12em; }
.resource-list { display: grid; gap: 8px; padding: 0; list-style: none; }
.resource-list li { display: flex; justify-content: space-between; gap: 10px; padding: 10px 12px; border-radius: 8px; background: var(--surface-soft); }

.admin-section { overflow: hidden; }
.admin-section > summary { display: flex; align-items: center; gap: 10px; padding: 18px 22px; color: var(--navy-dark); cursor: pointer; font-size: 1.1rem; font-weight: 800; list-style: none; }
.admin-section > summary::-webkit-details-marker { display: none; }
.admin-section > summary::before { content: '+'; display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; color: #fff; background: var(--navy); }
.admin-section[open] > summary::before { content: '−'; }
.admin-section[open] > summary { border-bottom: 1px solid var(--line); }
.section-content { padding: 22px; }
.summary-count { margin-left: auto; display: inline-flex; min-width: 28px; height: 28px; align-items: center; justify-content: center; border-radius: 999px; color: #fff; background: var(--red); font-size: .8rem; }
.admin-split { display: grid; grid-template-columns: minmax(0, .9fr) minmax(380px, 1.1fr); gap: 22px; align-items: start; }
.equal-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.nested-form { margin-top: 22px; padding: 20px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); }
.assignment-list { max-height: 420px; overflow: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; }
.assignment-list label { display: flex; align-items: center; gap: 8px; padding: 7px; border-radius: 6px; }
.assignment-list label:hover { background: #eef2fb; }
.filter-bar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px; margin-bottom: 18px; }
.filter-bar a { padding: 8px 13px; border: 1px solid var(--line); border-radius: 999px; background: #fff; text-decoration: none; font-weight: 700; }
.filter-bar a.active { color: #fff; background: var(--navy); border-color: var(--navy); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

@media (max-width: 1220px) {
    .site-header { grid-template-columns: auto auto 1fr; }
    .brand span { display: none; }
    .primary-nav { position: absolute; top: 100%; left: 0; right: 0; display: none; flex-direction: column; align-items: stretch; padding: 10px 20px 18px; background: var(--navy-dark); box-shadow: 0 12px 20px rgba(0,0,0,.18); }
    .primary-nav.open { display: flex; }
    .primary-nav a { padding: 11px; }
    .nav-divider { width: 100%; height: 1px; margin: 5px 0; }
    .nav-toggle { display: inline-flex; justify-self: start; }
    .user-menu { justify-self: end; }
    .admin-split { grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
    .site-header { grid-template-columns: 1fr auto; padding: 9px 12px; }
    .brand img { width: 150px; }
    .nav-toggle { grid-column: 2; grid-row: 1; }
    .user-menu { grid-column: 1 / -1; justify-self: stretch; justify-content: space-between; padding-top: 7px; border-top: 1px solid rgba(255,255,255,.18); }
    .site-main { width: min(100% - 22px, 1500px); padding-top: 20px; }
    .page-heading, .card-header { flex-direction: column; align-items: stretch; }
    .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .summary-grid, .resource-grid, .form-grid, .two-columns, .three-columns, .equal-columns { grid-template-columns: 1fr; }
    .full-span { grid-column: auto; }
    .assignment-list { grid-template-columns: 1fr; }
    .card, .section-content { padding: 17px; }
    .search-form { flex-wrap: wrap; }
    .search-form input { flex-basis: 100%; }
    .employee-search-form { grid-template-columns: 1fr; }
    .employee-search-actions { justify-content: flex-start; }
}

@media (max-width: 520px) {
    .auth-main { padding: 12px; }
    .auth-card { padding: 22px 18px; }
    .employee-search-actions { display: grid; grid-template-columns: 1fr 1fr; }
    .employee-search-actions .button:only-child { grid-column: 1 / -1; }
    .site-header { position: relative; }
    .brand img { width: 132px; }
    .user-menu > span:first-child { max-width: 120px; overflow: hidden; text-overflow: ellipsis; }
    .stat-grid { grid-template-columns: 1fr; }
    .stat-card { min-height: 105px; }
    .button { width: 100%; }
    .user-menu .button { width: auto; }
    .auth-actions { flex-direction: column; align-items: center; }
    .balance-chip { width: 100%; }
    .check-group { flex-direction: column; }
}

/* Portal 0.2 workflow additions */
.environment-banner{background:#8b1e2d;color:#fff;text-align:center;font-weight:700;padding:.45rem 1rem;letter-spacing:.04em}
.summary-grid-wide{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.request-balances{margin-bottom:1.25rem;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.request-balances>div{background:#fff;border:1px solid #d8dee9;border-radius:10px;padding:1rem}
.request-builder .field-action{display:flex;flex-direction:column;justify-content:flex-end}
.request-warning{margin:1rem 0}
.row-overage{background:#fff0f1}
.overage-text{color:#b00020;font-weight:700}
.inline-form{display:inline}
.row-actions{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}
.button-danger{background:#a61b2b;color:#fff;border-color:#a61b2b}
.button-danger:hover{background:#821421}
.link-button{border:0;background:transparent;color:#29458f;text-decoration:underline;cursor:pointer;margin-left:.5rem;padding:0;font:inherit;font-size:.85rem}
.detail-list{display:grid;gap:.8rem;margin:1rem 0 0}
.detail-list>div{display:grid;grid-template-columns:minmax(150px,220px) 1fr;gap:1rem;padding:.65rem 0;border-top:1px solid #e4e7ed}
.detail-list dt{font-weight:700;color:#3e4a60}.detail-list dd{margin:0}
.decision-card{border-left:5px solid #29458f}
.change-list{margin:0;display:grid;gap:.5rem}.change-list>div{display:grid;grid-template-columns:130px 1fr;gap:.5rem}.change-list dt{font-weight:700}.change-list dd{margin:0}
.status-awaiting-manager,.status-awaiting-final,.status-amendment-pending,.status-cancellation-pending{background:#fff1c7;color:#6b4a00}
.status-final-approved{background:#dff5e5;color:#166534}.status-cancelled,.status-manager-declined,.status-final-declined{background:#fbe1e5;color:#8b1e2d}
@media(max-width:760px){.detail-list>div,.change-list>div{grid-template-columns:1fr}.row-actions{min-width:180px}}

/* Portal 0.4 news and password self-service additions */
.news-section { overflow: hidden; }
.news-bulletin { color: var(--ink); }
.news-bulletin header { padding-bottom: 1rem; margin-bottom: 1.15rem; border-bottom: 1px solid var(--line); }
.news-bulletin h3 { margin: 0 0 .45rem; font-size: clamp(1.35rem, 2vw, 1.8rem); color: var(--navy-dark); }
.news-meta { margin: 0; color: var(--muted); font-size: .92rem; }
.news-body { line-height: 1.72; white-space: normal; overflow-wrap: anywhere; }
.news-bulletin-featured { padding: 1.2rem 1.25rem; border: 1px solid #cfd8ea; border-left: 5px solid var(--navy); border-radius: 10px; background: #fbfcff; }
.news-bulletin-detail { max-width: 1000px; }
.news-empty { padding: 2rem 1rem; text-align: center; border: 1px dashed var(--line); border-radius: 10px; background: var(--surface-soft); }
.news-empty h3 { margin: 0 0 .35rem; color: var(--navy-dark); }
.news-empty p { margin: 0; color: var(--muted); }
.status-active { color: var(--success); background: #dff4e7; }
.status-expired { color: #6b4a00; background: #fff1c7; }
.status-disabled { color: var(--danger); background: #ffe0e2; }

/* Portal 0.5 scheduled news, Manage dropdown, and payslip imports */
.primary-nav .nav-dropdown { position: relative; }
.primary-nav .nav-dropdown > summary { display: flex; align-items: center; gap: 6px; padding: 9px 10px; border-radius: 7px; color: #fff; cursor: pointer; font-size: .92rem; list-style: none; user-select: none; }
.primary-nav .nav-dropdown > summary::-webkit-details-marker { display: none; }
.primary-nav .nav-dropdown > summary::after { content: '▾'; font-size: .7rem; opacity: .8; }
.primary-nav .nav-dropdown[open] > summary::after { content: '▴'; }
.primary-nav .nav-dropdown > summary:hover,
.primary-nav .nav-dropdown.active > summary,
.primary-nav .nav-dropdown[open] > summary { background: rgba(255,255,255,.15); }
.nav-dropdown-menu { min-width: 210px; padding: 7px; border: 1px solid rgba(255,255,255,.2); border-radius: 9px; background: var(--navy-dark); box-shadow: 0 16px 30px rgba(0,0,0,.25); }
.nav-dropdown-menu a { display: flex; align-items: center; justify-content: space-between; width: 100%; }

.nav-subdropdown { margin: 2px 0; }
.nav-subdropdown > summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 10px; border-radius: 7px; color: #fff; cursor: pointer; list-style: none; font-size: .9rem; }
.nav-subdropdown > summary::-webkit-details-marker { display: none; }
.nav-subdropdown > summary::after { content: '›'; opacity: .8; font-weight: 800; }
.nav-subdropdown[open] > summary::after { content: '⌄'; }
.nav-subdropdown > summary:hover, .nav-subdropdown[open] > summary { background: rgba(255,255,255,.12); }
.nav-subdropdown-menu { margin: 2px 0 4px 10px; padding-left: 8px; border-left: 2px solid rgba(255,255,255,.18); }
.nav-subdropdown-menu a { padding-left: 10px; font-size: .88rem; }
.bulletin-attribution { margin-top: 4px; color: var(--muted); font-size: .82rem; }
.bulletin-editor { color: var(--navy-dark); }
.form-note { color: var(--muted); font-size: .9rem; }
.status-scheduled { color: var(--navy-dark); background: #e5ecff; }
.status-imported { color: var(--success); background: #dff4e7; }
.status-duplicate { color: #5a4a00; background: #fff1c7; }
.status-needs-review { color: #8a4a00; background: #ffe7c4; }
.status-failed { color: var(--danger); background: #ffe0e2; }
.import-status-card code, .import-detail-list code { overflow-wrap: anywhere; }
.import-detail-list dd { min-width: 0; }
.button:disabled { cursor: not-allowed; opacity: .55; }

@media (min-width: 1221px) {
    .nav-dropdown-menu { position: absolute; top: calc(100% + 7px); right: 0; z-index: 40; }
}

@media (max-width: 1220px) {
    .primary-nav .nav-dropdown { width: 100%; }
    .primary-nav .nav-dropdown > summary { padding: 11px; }
    .nav-dropdown-menu { position: static; margin: 2px 0 8px 14px; border-color: rgba(255,255,255,.16); box-shadow: none; }
    .nav-dropdown-menu a { padding-left: 16px; }
}


/* Portal 0.6 employee training records */
.status-current, .status-no-expiry { color: var(--success); background: #dff4e7; }
.status-renewal-due { color: #6b4a00; background: #fff1c7; }
.training-attachment-list { margin: 0; padding-left: 18px; }
.training-attachment-list li + li { margin-top: 4px; }
.training-existing-documents { margin-top: 16px; }


/* Portal 0.7 employee numbers, manager display, yearly usage, and negative balances */
.negative-hours { color: var(--danger) !important; }
.muted-text { color: var(--muted); }
.current-year-usage { margin-top: .65rem; }
.current-year-usage + form { margin-top: 1.25rem; }
.field input[readonly] { background: var(--surface-soft); color: var(--muted); cursor: not-allowed; }
.field input:disabled, .field select:disabled, .field textarea:disabled { background: var(--surface-soft); color: var(--muted); cursor: not-allowed; opacity: 1; }
[data-required-setting] > span { display:flex; align-items:center; gap:8px; font-weight:700; }

.page-heading-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.reminder-form code, .form-note code { overflow-wrap: anywhere; }
@media (max-width: 760px) {
    .page-heading-actions { width: 100%; }
    .page-heading-actions .button { width: 100%; }
}

/* Portal 0.10.2 request-history alignment */
td.request-row-actions { vertical-align: middle; }
.request-row-actions-inner { display: flex; align-items: center; flex-wrap: wrap; gap: .4rem; }
.request-row-actions-inner .inline-form { display: inline-flex; margin: 0; }
@media (max-width: 760px) {
    .request-row-actions-inner { min-width: 180px; }
}

/* Sign-in processing feedback and duplicate-submit protection. */
.button-spinner {
    display: none;
    width: 1rem;
    height: 1rem;
    margin-left: .55rem;
    border: 2px solid rgba(255, 255, 255, .45);
    border-top-color: #fff;
    border-radius: 50%;
    animation: login-button-spin .75s linear infinite;
}
.button[aria-busy="true"] .button-spinner { display: inline-block; }
.login-processing {
    margin: 12px 0 0;
    color: var(--muted);
    font-size: .92rem;
    text-align: center;
}
@keyframes login-button-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    .button-spinner { animation: none; }
}

/* Portal 0.13.5 job-change currency fields. */
.currency-input {
    display: flex;
    align-items: stretch;
    width: 100%;
}
.currency-input > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
    padding: 0 .7rem;
    border: 1px solid var(--line);
    border-right: 0;
    border-radius: 7px 0 0 7px;
    background: var(--surface-soft);
    color: var(--muted);
    font-weight: 700;
}
.currency-input > input {
    min-width: 0;
    border-radius: 0 7px 7px 0;
}


/* Portal 0.16 Group Benefits management */
.benefit-rate-table { min-width: 760px; }
.benefit-rate-table td:first-child { width: 42%; font-weight: 700; }
.benefit-rate-table input { min-width: 160px; }
.benefit-master-groups { align-items: start; margin-top: 22px; }
.benefit-fieldset { min-width: 0; margin: 0; padding: 18px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); }
.benefit-fieldset legend { padding: 0 7px; color: var(--navy-dark); font-weight: 800; }
.benefit-input-table { min-width: 650px; margin-bottom: 18px; }
.benefit-input-table td:first-child { width: 42%; font-weight: 700; }
.benefit-input-table select { min-width: 220px; }
.compact-check { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.compact-check input { width: 18px; min-height: 18px; }
.benefit-overrides { margin: 18px 0; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); }
.benefit-overrides > summary { padding: 14px 16px; cursor: pointer; color: var(--navy-dark); font-weight: 800; }
.benefit-overrides > .form-grid { padding: 0 16px 4px; }
.benefit-calculation-table { min-width: 1120px; }
.number-cell { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.payroll-value { color: var(--navy-dark); font-weight: 800; background: #eef3ff; }
.benefit-total-row td { border-top: 2px solid #aeb9d8; font-weight: 800; }
.group-benefit-filter { grid-template-columns: minmax(260px, 1fr) minmax(180px, 230px) minmax(360px, auto); }
.group-benefit-filter .employee-search-actions { flex-wrap: wrap; }
.payroll-toggle { min-height: 42px; padding: 8px 11px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.benefit-summary-grid { margin: 18px 0; }
@media (max-width: 1050px) {
    .group-benefit-filter { grid-template-columns: 1fr; }
    .benefit-master-groups { grid-template-columns: 1fr; }
}
.benefit-division-summary table { min-width: 780px; }
.benefit-division-summary td:first-child { font-weight: 700; }

/* Portal 0.16.4 Group Benefits display refinements. */
.benefit-calculation-assumptions {
    grid-template-columns: repeat(2, minmax(160px, 240px));
    justify-content: start;
    margin: 0 0 18px;
}
.benefit-rate-table th.number-cell,
.benefit-calculation-table th.number-cell,
.benefit-division-summary th.number-cell,
.wide-table th.number-cell {
    text-align: right;
}

/* Toolcrib Portal additions */
.inventory-chip { min-width: 210px; padding: 14px 18px; border-radius: var(--radius); color: #fff; background: var(--navy); box-shadow: var(--shadow); }
.inventory-chip span, .inventory-chip strong { display: block; }
.inventory-chip span { font-size: .82rem; opacity: .86; }
.inventory-chip strong { font-size: 1.25rem; }
.module-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.module-card { display: block; min-height: 150px; padding: 22px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); text-decoration: none; }
.module-card:hover { transform: translateY(-2px); border-color: #aab5d7; }
.module-card h3 { margin: 0 0 8px; color: var(--navy-dark); }
.module-card p { margin: 0; color: var(--muted); }
.qty-good { color: var(--success); font-weight: 800; }
.qty-low { color: var(--warning); font-weight: 800; }
.qty-empty { color: var(--danger); font-weight: 800; }
.toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; margin-bottom: 18px; }
.toolbar .field { margin: 0; min-width: 180px; flex: 1; }
.code { font-family: Consolas, "Courier New", monospace; font-size: .92em; }
@media (max-width: 900px) { .module-grid { grid-template-columns: 1fr; } }

/* Toolcrib Portal 0.2.0 multi-site and transaction workflow additions */
.status-neutral { color: var(--navy-dark); background: #e9eef8; }
.toolcrib-user-menu { gap: 10px; flex-wrap: wrap; }
.site-switcher { display: flex; align-items: center; gap: 7px; margin: 0; }
.site-switcher label { color: rgba(255,255,255,.82); font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.site-switcher select { min-width: 150px; padding: 7px 30px 7px 9px; border: 1px solid rgba(255,255,255,.28); border-radius: 7px; color: #fff; background: var(--navy-dark); }
.transaction-actions { justify-content: flex-end; }
.transaction-form-card { max-width: 1050px; }
.transaction-form { grid-template-columns: repeat(2,minmax(220px,1fr)); }
.transaction-form .field-wide { grid-column: 1 / -1; }
.transaction-form .form-actions { grid-column: 1 / -1; }
.inline-filter { display: flex; align-items: end; gap: 10px; flex-wrap: wrap; margin: 0 0 20px; padding: 14px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-soft); }
.inline-filter .field { min-width: 260px; margin: 0; }
.workflow-list { margin: 0; padding-left: 1.35rem; }
.workflow-list li + li { margin-top: .55rem; }
.empty-state { padding: 2rem 1rem; text-align: center; }
.empty-state h1,.empty-state h2 { color: var(--navy-dark); }
.detail-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; margin-bottom: 18px; }
.email-po-details { display: grid; gap: 0; margin: 0 0 20px; max-width: 760px; }
.email-po-details > div { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 18px; padding: 11px 0; border-bottom: 1px solid var(--line); }
.email-po-details > div:first-child { border-top: 1px solid var(--line); }
.email-po-details dt { margin: 0; font-weight: 700; color: #333846; }
.email-po-details dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 640px) {
    .email-po-details > div { grid-template-columns: 1fr; gap: 3px; }
}

.status-active { color: var(--success); background: #dff4e7; }
.status-disabled { color: var(--danger); background: #ffe0e2; }
@media (max-width: 980px) {
    .toolcrib-user-menu { width: 100%; justify-content: flex-start; }
    .site-switcher { width: 100%; }
    .site-switcher select { flex: 1; }
    .transaction-form,.detail-grid { grid-template-columns: 1fr; }
    .transaction-form .field-wide,.transaction-form .form-actions { grid-column: auto; }
}

/* Toolcrib 0.4 serialized service, receiving, and scan workflows */
.status-warning { color: #6b4a00; background: #fff1c7; }
.status-danger { color: var(--danger); background: #ffe0e2; }
.serial-summary-grid .stat-card { display: flex; flex-direction: column; justify-content: center; gap: .65rem; }
.serial-summary-grid .stat-card > span:not(.status) { font-size: 1.05rem; font-weight: 700; color: var(--navy-dark); }
.serial-detail-grid { align-items: start; }
.serial-action-card { border-top: 4px solid var(--navy); }
.receive-row { background: #f8faff; }
.receive-row > td { padding-top: 12px; padding-bottom: 16px; }
.receive-line-form { margin: 0; }
.receive-line-fields { display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)); gap: 12px; align-items: end; }
.receive-line-fields .field-wide { grid-column: span 2; }
.receive-line-fields .form-actions { margin: 0; align-self: end; }
.inspection-form { min-width: 330px; margin: 0; }
.inspection-form > input[type="text"], .inspection-form > input:not([type]) { width: 100%; }
.inspection-form .row-actions { margin-top: 7px; }
@media (max-width: 980px) {
    .receive-line-fields { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
}
@media (max-width: 640px) {
    .receive-line-fields { grid-template-columns: 1fr; }
    .receive-line-fields .field-wide { grid-column: auto; }
    .inspection-form { min-width: 220px; }
}
.status-good { color: var(--success); background: #dff4e7; }

/* Toolcrib 0.5 operational candidate */
.checkbox-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:10px 16px; }
.compact-form { margin-top:18px; padding-top:18px; border-top:1px solid var(--line); }
.inline-form { display:inline-flex; gap:8px; align-items:center; margin:0; }
.top-gap { margin-top:18px; }
.report-tabs { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:18px; }
.danger-zone { border-top:4px solid var(--danger); }
.scan-field input { font-size:1.2rem; font-family:Consolas,"Courier New",monospace; }
.label-sheet { display:flex; justify-content:center; padding:30px; }
.tool-label { width:4in; min-height:2in; border:1px solid #111; padding:.18in; background:#fff; color:#111; text-align:center; }
.label-company { font-weight:800; letter-spacing:.05em; font-size:.75rem; }
.label-title { font-size:1.45rem; font-weight:900; margin-top:.06in; }
.label-subtitle { font-size:.8rem; min-height:.35in; }
.label-barcode svg { width:100%; max-height:.72in; }
.label-scan-text { font:700 .8rem Consolas,"Courier New",monospace; letter-spacing:.08em; }
.label-detail { margin-top:.04in; font-size:.72rem; }
@media print {
  .no-print,.site-header,.primary-nav,.footer,.flash-stack { display:none !important; }
  body,.page-shell,.page-content { background:#fff !important; margin:0 !important; padding:0 !important; box-shadow:none !important; }
  .card { box-shadow:none !important; break-inside:avoid; }
  .label-sheet { padding:0; }
  .tool-label { border:1px solid #000; }
}

/* Toolcrib 0.5.5 purchasing workflow */
.select-column { width: 72px; }
.table-input-quantity { width: 110px; min-width: 90px; min-height: 36px; padding: 6px 8px; }
.page-form-actions { margin-top: 18px; }


/* Toolcrib 0.5.8 purchase-order email review */
.email-po-card { max-width: 920px; }
.email-po-card-header { padding-bottom: 1rem; border-bottom: 1px solid var(--line); }
.email-po-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border: 1px solid var(--line);
    border-radius: 10px;
    overflow: hidden;
    background: var(--surface-soft);
    margin-top: 1rem;
}
.email-po-summary-item {
    display: grid;
    gap: .35rem;
    min-width: 0;
    padding: 1rem 1.1rem;
    background: #fff;
}
.email-po-summary-item:nth-child(2) { border-left: 1px solid var(--line); }
.email-po-summary-attachment {
    grid-column: 1 / -1;
    border-top: 1px solid var(--line);
}
.email-po-summary-label {
    color: var(--muted);
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.email-po-summary-item strong { overflow-wrap: anywhere; color: var(--ink); }
.email-po-actions {
    display: flex;
    gap: .75rem;
    align-items: center;
    margin-top: 1.15rem;
    padding-top: 1rem;
    border-top: 1px solid var(--line);
}
@media (max-width: 760px) {
    .email-po-summary { grid-template-columns: 1fr; }
    .email-po-summary-item:nth-child(2) { border-left: 0; border-top: 1px solid var(--line); }
    .email-po-summary-attachment { grid-column: auto; }
    .email-po-actions .button { width: 100%; }
}

/* Toolcrib 0.5.10 edit-navigation visibility */
.edit-target { scroll-margin-top: 18px; }

/* Users & Access: keep the selected edit panel visible below the fixed portal header. */
.edit-user-target { scroll-margin-top: 96px; }

/* Toolcrib 0.5.14 keep long workflow forms visible after search/save actions. */
.workflow-target { scroll-margin-top: 96px; }


/* Toolcrib Portal 0.5.12 long-page loading feedback. */
.page-loading-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(15, 30, 67, .46);
    backdrop-filter: blur(1px);
}
.page-loading-overlay[hidden] { display: none; }
.page-loading-panel {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 5px 14px;
    align-items: center;
    width: min(430px, 100%);
    padding: 22px 24px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: 0 18px 45px rgba(15, 30, 67, .28);
    color: var(--navy-dark);
}
.page-loading-panel strong { font-size: 1.08rem; }
.page-loading-note { grid-column: 2; color: var(--muted); font-size: .92rem; }
.page-loading-spinner {
    grid-row: 1 / span 2;
    width: 30px;
    height: 30px;
    border: 3px solid #d9dfef;
    border-top-color: var(--navy);
    border-radius: 50%;
    animation: page-loading-spin .8s linear infinite;
}
body.is-page-loading { cursor: wait; }
body.is-page-loading .site-header,
body.is-page-loading main,
body.is-page-loading .site-footer { pointer-events: none; }
@keyframes page-loading-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    .page-loading-spinner { animation: none; border-top-color: #d9dfef; }
}

/* Shared inventory-style compact controls. */
.adjustment-percent-input { width: 8rem; max-width: 100%; text-align: right; }
.adjustment-percent-input-table { min-height: 38px; padding: 6px 8px; }
.inventory-summary-controls {
    display: grid;
    grid-template-columns: max-content max-content minmax(360px, 1fr);
    align-items: end;
    column-gap: 28px;
    row-gap: 14px;
}
.inventory-summary-setting { min-width: 0; }
.inventory-summary-setting-label { display: block; margin-bottom: 6px; color: #333846; font-weight: 700; }
.inventory-summary-control-pair {
    display: grid;
    grid-template-columns: minmax(0, auto) max-content;
    align-items: center;
    gap: 10px;
    width: max-content;
    max-width: 100%;
}
.inventory-summary-setting:first-of-type .inventory-summary-control-pair {
    grid-template-columns: 360px max-content;
}
.inventory-summary-setting:nth-of-type(2) .inventory-summary-control-pair {
    grid-template-columns: 8rem max-content;
}
.inventory-summary-control-pair select,
.inventory-summary-control-pair input { min-width: 0; width: 100%; }
.inventory-summary-control-pair .button { width: auto; white-space: nowrap; }
.inventory-summary-adjustment-action {
    display: grid;
    grid-template-columns: minmax(0, 1fr) max-content;
    align-items: center;
    gap: 12px;
    min-width: 0;
}
.inventory-summary-adjustment-action .muted { max-width: 540px; }
.inventory-summary-adjustment-action .button { width: auto; white-space: nowrap; }
@media (max-width: 1280px) {
    .inventory-summary-controls { grid-template-columns: max-content max-content; }
    .inventory-summary-adjustment-action { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
    .inventory-summary-controls { grid-template-columns: 1fr; align-items: stretch; }
    .inventory-summary-setting:first-of-type .inventory-summary-control-pair,
    .inventory-summary-setting:nth-of-type(2) .inventory-summary-control-pair {
        grid-template-columns: minmax(0, 1fr) max-content;
        width: 100%;
    }
    .inventory-summary-adjustment-action { grid-column: auto; }
}
@media (max-width: 640px) {
    .inventory-summary-control-pair,
    .inventory-summary-setting:first-of-type .inventory-summary-control-pair,
    .inventory-summary-setting:nth-of-type(2) .inventory-summary-control-pair,
    .inventory-summary-adjustment-action {
        grid-template-columns: 1fr;
        width: 100%;
    }
    .inventory-summary-control-pair .button,
    .inventory-summary-adjustment-action .button { justify-self: start; }
}


/* 0.5.32 table paging */
.table-pagination{display:grid;grid-template-columns:1fr minmax(320px,auto) 1fr;align-items:center;gap:14px;margin-top:14px}.pagination-actions-right{text-align:right}.pagination-center{display:flex;flex-direction:column;align-items:center;gap:7px}.pagination-summary{font-weight:700;color:var(--muted,#5b6475);white-space:nowrap}.pagination-row-count{font-weight:500}.pagination-pages{display:flex;align-items:center;justify-content:center;gap:5px;flex-wrap:wrap}.pagination-number{display:inline-flex;min-width:30px;height:30px;align-items:center;justify-content:center;padding:0 7px;border:1px solid var(--border,#ccd4e0);border-radius:6px;text-decoration:none;background:#fff;color:inherit;font-weight:700}.pagination-number:hover{border-color:var(--primary,#24418a)}.pagination-current{background:var(--primary,#24418a);border-color:var(--primary,#24418a);color:#fff}.pagination-ellipsis{padding:0 2px;color:var(--muted,#5b6475)}.pagination-jump{display:flex;align-items:flex-end;gap:6px}.pagination-jump label{display:flex;align-items:center;gap:6px;font-size:.9rem;color:var(--muted,#5b6475);white-space:nowrap}.pagination-jump input{width:72px;padding:6px 8px}.pagination-disabled{opacity:.45;pointer-events:none;cursor:default}@media(max-width:760px){.table-pagination{grid-template-columns:1fr 1fr}.pagination-center{grid-column:1/-1;grid-row:1}.pagination-actions-left{grid-column:1;grid-row:2}.pagination-actions-right{grid-column:2;grid-row:2}.pagination-row-count{display:none}}

/* 0.5.34 package-to-base inventory cleanup */
.stacked-action-form{display:grid;gap:.4rem;min-width:220px;margin-bottom:.4rem}.stacked-action-form input[type="text"],.stacked-action-form input:not([type]){max-width:280px}.form-help{margin:.75rem 0 0;color:var(--muted,#5f6b76);font-size:.9rem}

/* QMS Portal 0.1.0 additions */
.qms-stat-grid { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.qms-module-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:18px; }
.qms-module-card { display:block; padding:20px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:var(--shadow); text-decoration:none; color:var(--ink); }
.qms-module-card:hover { border-color:#b7c3dd; transform:translateY(-1px); }
.qms-module-card h3 { margin:0 0 8px; color:var(--navy-dark); }
.qms-module-card p { margin:0; color:var(--muted); }
.record-section { margin-top:22px; }
.record-section h2 { margin:0 0 12px; color:var(--navy-dark); }
.record-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.record-grid .full { grid-column:1/-1; }
.form-divider { grid-column:1/-1; padding:10px 0 4px; border-bottom:2px solid var(--navy); color:var(--navy-dark); font-weight:800; }
.status-open,.status-investigating-root-cause,.status-implementing-corrective-action { color:#6b4a00;background:#fff1c7; }
.status-verification-of-effectiveness,.status-risk-and-opportunity-analysis { color:var(--navy-dark);background:#e5ecff; }
.status-closed,.status-current,.status-complete { color:var(--success);background:#dff4e7; }
.status-past-due,.status-overdue { color:var(--danger);background:#ffe0e2; }
.qms-number { font-family:Consolas,Monaco,monospace; font-weight:700; }
.document-meta { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:10px; }
.legacy-badge { display:inline-flex; padding:2px 7px; border-radius:999px; background:#eef1f7; color:var(--muted); font-size:.78rem; font-weight:700; }
@media(max-width:760px){.record-grid{grid-template-columns:1fr}.record-grid .full{grid-column:auto}}
.legacy-field-notice { padding:10px 12px; border:1px dashed var(--line); border-radius:8px; background:#f8f9fc; color:var(--muted); }
.wrap-cell { max-width:460px; white-space:normal; overflow-wrap:anywhere; }
.checkbox-grid label { display:flex; align-items:flex-start; gap:8px; padding:10px; border:1px solid var(--line); border-radius:8px; background:#fff; }
.checkbox-grid label span { display:block; margin-left:4px; }
.document-meta > div { display:grid; gap:4px; }
.document-meta .muted { font-size:.78rem; text-transform:uppercase; letter-spacing:.05em; }
pre { overflow:auto; padding:14px; border-radius:8px; background:#10182d; color:#f3f6ff; }
/* QMS Portal 0.1.5 Customer Satisfaction */
.status-positive { color:var(--success); background:#dff4e7; }
.status-negative { color:var(--danger); background:#ffe0e2; }
.status-ofi { color:#6b4a00; background:#fff1c7; }
.status-fyi,.status-unspecified { color:var(--navy-dark); background:#e9eef8; }

/* 0.3.0 historical form record presentation */
.detail-label { display:block; margin-bottom:4px; color:var(--muted); font-size:.78rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.record-detail-list { display:grid; gap:0; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#fff; }
.record-detail-row { display:grid; grid-template-columns:minmax(220px,32%) minmax(0,1fr); border-bottom:1px solid var(--line); }
.record-detail-row:last-child { border-bottom:0; }
.record-detail-label { padding:12px 14px; background:#f7f9fb; font-weight:800; }
.record-detail-value { padding:12px 14px; white-space:normal; overflow-wrap:anywhere; }
.filter-bar .grow { flex:1 1 320px; }
.filter-actions { display:flex; align-items:flex-end; gap:8px; }
.filter-bar .field { min-width:220px; margin-bottom:0; }
@media (max-width:760px) { .record-detail-row { grid-template-columns:1fr; } .record-detail-label { border-bottom:1px solid var(--line); } }

/* 0.4.0 - migrated QMS manual content */
.imported-qms-content { line-height: 1.62; overflow-wrap: anywhere; }
.imported-qms-content h1,.imported-qms-content h2,.imported-qms-content h3,.imported-qms-content h4 { margin-top: 1.25em; }
.imported-qms-content table { width:100%; border-collapse:collapse; margin:1rem 0 1.5rem; }
.imported-qms-content th,.imported-qms-content td { border:1px solid var(--border); padding:.65rem .75rem; vertical-align:top; text-align:left; }
.imported-qms-content th { background:var(--surface-2); }
.imported-qms-content img { max-width:100%; height:auto; }
.imported-qms-content a { overflow-wrap:anywhere; }
.qms-page-links { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:.65rem; }
.qms-page-links > a { display:flex; flex-direction:column; gap:.2rem; padding:.8rem .9rem; border:1px solid var(--border); border-radius:.55rem; text-decoration:none; }
.qms-page-links > a:hover { background:var(--surface-2); }

/* QMS Portal 0.5.0 - document control modernization */
.filter-panel { display:grid; gap:14px; }
.filter-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:12px; align-items:end; }
.filter-grid .grow { grid-column:span 2; }
.checkbox-field { display:flex; align-items:flex-end; min-height:42px; }
.checkbox-field label { display:flex; align-items:center; gap:8px; min-height:42px; margin:0; }
.check-col { width:64px; text-align:center; }
.check-col + th { min-width:260px; }
.document-bulk-form { display:grid; gap:18px; }
.bulk-panel { border-top:3px solid var(--navy); }
.bulk-metadata-grid { grid-template-columns:repeat(4,minmax(0,1fr)); align-items:start; gap:14px 16px; }
.bulk-metadata-grid .field { margin-bottom:0; align-self:start; }
.bulk-metadata-grid .form-help { margin-top:2px; }
@media(max-width:1050px){.bulk-metadata-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:620px){.bulk-metadata-grid{grid-template-columns:1fr;}}
.file-meta { max-width:420px; overflow-wrap:anywhere; }
.status-imported-review { color:#6b4a00; background:#fff1c7; }
.status-controlled { color:var(--success); background:#dff4e7; }
.status-reference { color:var(--navy-dark); background:#e5ecff; }
.status-historical,.status-archived,.status-superseded { color:var(--muted); background:#eef1f7; }
.pagination { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:14px; color:var(--muted); font-weight:700; }
.section-heading-row { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:12px; }
.section-heading-row h2 { margin:0; }
.document-link-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr)); gap:12px; }
.document-link-card { display:flex; flex-direction:column; gap:5px; min-width:0; overflow:hidden; text-decoration:none; color:var(--ink); }
.document-link-card:hover { border-color:#b7c3dd; transform:translateY(-1px); }
.document-link-card strong { color:var(--navy-dark); }
.document-link-card strong, .document-link-card span { min-width:0; max-width:100%; overflow-wrap:anywhere; word-break:break-word; }
@media(max-width:760px){.filter-grid .grow{grid-column:auto}.pagination,.section-heading-row{align-items:flex-start;flex-direction:column}}

/* QMS Portal 0.6.0 - production readiness and workflow integration */
.my-work-card { margin-top:18px; }
.mini-stat-row { display:flex; flex-wrap:wrap; gap:8px; }
.mini-stat-row span { display:inline-flex; align-items:center; gap:5px; padding:7px 10px; border-radius:999px; background:#eef2fb; color:var(--navy-dark); font-size:.86rem; }
.work-columns { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.work-columns h3 { margin:0; color:var(--navy-dark); }
.work-list { display:grid; border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.work-list a { display:grid; gap:3px; padding:11px 12px; color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line); background:#fff; }
.work-list a:last-child { border-bottom:0; }
.work-list a:hover { background:#f7f9fd; }
.compact-empty { padding:18px 12px; }
.row-overdue { background:#fff5f5; }
.row-overdue:hover { background:#ffeded; }
.control-summary-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:0 0 16px; }
.control-summary-grid > div { display:grid; gap:4px; padding:12px; border:1px solid var(--line); border-radius:9px; background:var(--surface-soft); }
.control-summary-grid .muted { text-transform:uppercase; letter-spacing:.04em; font-size:.75rem; font-weight:800; }
.control-summary-grid small { color:var(--muted); }
.role-list { display:grid; gap:8px; }
.role-list-item { display:grid; gap:4px; padding:12px 13px; border:1px solid var(--line); border-radius:9px; color:var(--ink); text-decoration:none; }
.role-list-item:hover,.role-list-item.active { border-color:#9fafd3; background:#f3f6fc; }
.role-list-item strong { color:var(--navy-dark); }
.role-list-item span,.role-list-item small { color:var(--muted); }
.permission-groups { display:grid; gap:14px; margin:16px 0; }
.permission-group { border:1px solid var(--line); border-radius:10px; padding:12px; }
.permission-group legend { padding:0 7px; color:var(--navy-dark); font-weight:800; }
.permission-option { display:grid; grid-template-columns:auto 1fr; align-items:start; gap:10px; padding:9px 7px; border-radius:7px; }
.permission-option:hover { background:#f7f9fd; }
.permission-option span { display:grid; gap:2px; }
.permission-option small { color:var(--muted); }
.permission-option em { color:#8b1e2d; font-size:.78rem; font-style:normal; font-weight:700; }
.permission-locked { opacity:.7; }
.readiness-banner { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:0 0 18px; padding:20px 22px; border:1px solid var(--line); border-left:6px solid #6b7280; border-radius:var(--radius); background:#fff; box-shadow:var(--shadow); }
.readiness-banner h2 { margin:3px 0 6px; }
.readiness-banner p:last-child { margin:0; color:var(--muted); }
.readiness-banner > strong { font-size:1.1rem; letter-spacing:.08em; }
.readiness-banner.ready { border-left-color:var(--success); background:#f5fcf7; }
.readiness-banner.ready > strong { color:var(--success); }
.readiness-banner.not-ready { border-left-color:#b7791f; background:#fffaf0; }
.readiness-banner.not-ready > strong { color:#8a5a10; }
.audit-details { min-width:300px; font-family:Consolas,Monaco,monospace; font-size:.82rem; }
@media(max-width:980px){.work-columns,.control-summary-grid{grid-template-columns:1fr}.readiness-banner{align-items:flex-start;flex-direction:column}}
.record-fieldset { margin:0; padding:0; border:0; min-width:0; }
.record-fieldset:disabled input,.record-fieldset:disabled select,.record-fieldset:disabled textarea { color:var(--ink); opacity:1; background:#f7f9fb; cursor:default; }

/* 0.7.0 workbench / migration UX */
.document-family-card .suggested-row{background:rgba(25,118,210,.06)}
.family-select{display:flex;align-items:center;gap:.45rem;font-weight:700;white-space:nowrap}
.compact-filter{box-shadow:none;border:0;padding:0;margin:0 0 1rem}

/* QMS Portal 0.9.0 - denser administration and migration presentation */
.metric-group { margin: 0 0 18px; }
.metric-group-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0 2px 8px; }
.metric-group-heading h2 { margin:0; color:var(--navy-dark); font-size:1rem; }
.metric-group-heading span { color:var(--muted); font-size:.84rem; }
.compact-stats-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.compact-stats-4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.compact-stats-5 { grid-template-columns:repeat(5,minmax(0,1fr)); }
.compact-stats-6 { grid-template-columns:repeat(6,minmax(0,1fr)); }
.admin-metric-strip { margin-bottom:18px; }
.compact-admin-section { margin-bottom:18px; box-shadow:var(--shadow); }
.compact-admin-section > summary { padding:14px 18px; font-size:1rem; }
.compact-admin-section .section-content { padding:18px; }
.dense-card { padding:0; overflow:hidden; }
.dense-table th,.dense-table td { padding:8px 9px; vertical-align:middle; }
.dense-table td .muted { font-size:.82rem; line-height:1.25; }
.action-bar-card { padding:14px 16px; }
.section-actions { margin-top:12px; }
.compact-form-card { padding:18px; }
.compact-checkbox-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:8px; }
.compact-checkbox-grid label { padding:8px 9px; }
.compact-checkbox-grid strong,.compact-checkbox-grid small { display:block; }
.development-lock { display:flex; align-items:center; gap:8px; }
.migration-metric-section { margin-bottom:18px; }
.migration-metric-section .compact-stats { margin-bottom:0; }
.migration-note-list { margin:8px 0 0; color:var(--muted); font-size:.9rem; }
.dashboard-metrics .stat-card { text-decoration:none; }
.dashboard-metrics .stat-card strong { font-size:1.75rem; }
.dashboard-metrics .stat-card span { font-size:.74rem; }

@media (max-width:1180px) {
  .compact-stats-4,.compact-stats-5,.compact-stats-6 { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:680px) {
  .metric-group-heading { align-items:flex-start; flex-direction:column; gap:3px; }
  .compact-stats-2,.compact-stats-4,.compact-stats-5,.compact-stats-6 { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:420px) {
  .compact-stats-2,.compact-stats-4,.compact-stats-5,.compact-stats-6 { grid-template-columns:1fr; }
}

/* QMS Portal 0.10.0 - operational workbench, bounded ERP job picker and record history */
.record-grid > *, .form-grid > * { min-width: 0; }
.job-combobox { position: relative; width: 100%; min-width: 0; max-width: 100%; }
.job-combobox-input { width: 100%; min-width: 0; max-width: 100%; text-overflow: ellipsis; }
.job-combobox-menu {
    position: absolute;
    z-index: 120;
    top: calc(100% + 5px);
    left: 0;
    right: 0;
    width: auto;
    min-width: 0;
    max-width: min(100%, calc(100vw - 48px));
    max-height: min(360px, 52vh);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 5px;
    border: 1px solid #aeb9d8;
    border-radius: 9px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(20,31,55,.18);
}
.job-combobox-option { display:block; width:100%; max-width:100%; padding:9px 10px; border:0; border-radius:6px; background:transparent; color:var(--ink); text-align:left; cursor:pointer; white-space:normal; overflow-wrap:anywhere; }
.job-combobox-option + .job-combobox-option { margin-top:2px; }
.job-combobox-option strong,.job-combobox-option span { display:block; max-width:100%; }
.job-combobox-option span { margin-top:2px; color:var(--muted); font-size:.84rem; line-height:1.3; }
.job-combobox-option:hover,.job-combobox-option.is-active { background:var(--surface-soft); color:var(--navy-dark); }
.job-combobox-option[hidden] { display:none; }

.closeout-readiness .compact-stats { margin-bottom: 10px; }
.closeout-readiness .stat-card strong { font-size:1.25rem; }
.closeout-readiness .alert { margin:10px 0 0; }

.history-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; align-items:start; }
.history-panel { margin-bottom:0; min-width:0; }
.record-note-form { margin-bottom:16px; padding-bottom:16px; border-bottom:1px solid var(--line); }
.record-note-form .field { margin-bottom:10px; }
.history-list { display:grid; gap:0; border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.history-item { min-width:0; padding:12px 13px; background:#fff; border-bottom:1px solid var(--line); }
.history-item:last-child { border-bottom:0; }
.history-meta { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; color:var(--navy-dark); }
.history-meta span { color:var(--muted); font-size:.8rem; white-space:nowrap; }
.history-text { margin-top:7px; overflow-wrap:anywhere; line-height:1.5; }
.history-by { margin-top:3px; color:var(--muted); font-size:.84rem; }
.history-detail { display:flex; flex-wrap:wrap; gap:6px 12px; margin-top:7px; color:var(--muted); font-size:.82rem; }
.history-detail span { overflow-wrap:anywhere; }

#my-ncrs,#my-actions,#my-documents { scroll-margin-top:96px; }

@media (max-width:900px) {
    .history-grid { grid-template-columns:1fr; }
}
@media (max-width:520px) {
    .job-combobox-menu { max-width:calc(100vw - 28px); }
    .history-meta { flex-direction:column; gap:2px; }
}
.job-combobox-empty { padding:14px 10px; color:var(--muted); text-align:center; font-size:.88rem; }
.job-combobox-context { margin-top:6px; color:var(--warning); font-size:.82rem; font-weight:700; }

/* 0.11.0-dev native QMS Form Designer */
.form-instructions { padding:12px 14px; border-left:4px solid var(--navy); background:var(--surface-soft); border-radius:8px; line-height:1.5; }
.form-instructions strong { display:block; margin-bottom:4px; }
.choice-stack { display:flex; flex-wrap:wrap; align-items:center; gap:8px 24px; padding:6px 0 8px; }
.choice-option { display:inline-flex !important; flex:0 0 auto; align-items:center !important; gap:8px; max-width:100%; margin:0; padding:3px 0; font-weight:500; line-height:1.35; cursor:pointer; }
.choice-stack .choice-option input[type="radio"],
.choice-stack .choice-option input[type="checkbox"],
.score-question-list .choice-option input[type="checkbox"] {
    flex:0 0 18px; width:18px !important; height:18px !important; min-width:18px !important; min-height:18px !important; max-width:18px; padding:0 !important; margin:0 !important; border:0; accent-color:var(--navy);
}
.choice-option span { display:inline !important; min-width:0; margin:0 !important; overflow-wrap:anywhere; }
.section-heading-row { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:14px; }
.section-heading-row h2 { margin-bottom:3px; }
.designer-field-list { display:grid; gap:12px; }
.designer-field-card { padding:14px 16px; scroll-margin-top:108px; }
.designer-field-summary { display:flex; justify-content:space-between; gap:16px; align-items:center; }
.designer-field-summary > div:first-child { display:flex; flex-wrap:wrap; align-items:center; gap:8px; min-width:0; }
.designer-field-order { display:inline-flex; width:28px; height:28px; align-items:center; justify-content:center; border-radius:50%; background:var(--surface-soft); color:var(--navy-dark); font-weight:800; font-size:.82rem; }
.field-type-chip,.required-chip { display:inline-flex; align-items:center; border-radius:999px; padding:3px 8px; font-size:.75rem; font-weight:700; background:var(--surface-soft); color:var(--muted); }
.required-chip { background:#fff3cd; color:#745b00; }
.designer-field-help { margin:8px 0 0 36px; overflow-wrap:anywhere; }
.designer-choice-preview { margin:7px 0 0 36px; color:var(--muted); font-size:.84rem; overflow-wrap:anywhere; }
.designer-field-editor { margin-top:12px; border-top:1px solid var(--line); padding-top:10px; }
.designer-field-editor > summary { cursor:pointer; font-weight:700; color:var(--navy); }
.designer-field-editor .compact-form { margin-top:14px; }
.compact-actions { flex-wrap:nowrap; }
.compact-actions form { margin:0; }
.danger-inline-form { margin-top:8px; }
.form-designer-add,.form-designer-create { margin-top:18px; }
.version-history { margin-top:18px; }
.checkbox-field { justify-content:flex-end; }
.checkbox-field > span { display:flex; align-items:center; gap:8px; min-height:40px; }
.checkbox-field input { width:auto; }
.status-draft { background:#fff3cd; color:#745b00; }
.status-published { background:#dff5e5; color:#175d2c; }
.status-superseded,.status-retired { background:#eef0f3; color:#505866; }
@media(max-width:760px){
  .section-heading-row,.designer-field-summary { align-items:stretch; flex-direction:column; }
  .designer-field-help,.designer-choice-preview { margin-left:0; }
}
.score-field-settings{border-top:1px solid var(--border,#d8dde3);padding-top:.75rem}
.score-question-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.35rem .75rem;margin:.35rem 0 .5rem}
.score-question-list .choice-option{align-items:flex-start}

/* QMS Portal 0.12.0 - Form Designer density and category workflow */
.designer-summary-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0 0 18px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: var(--shadow);
}
.designer-summary-strip > div {
    min-width: 0;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 16px;
    border-right: 1px solid var(--line);
}
.designer-summary-strip > div:last-child { border-right: 0; }
.designer-summary-strip span {
    min-width: 0;
    color: var(--muted);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .025em;
}
.designer-summary-strip strong {
    flex: 0 0 auto;
    color: var(--navy-dark);
    font-size: 1.25rem;
    line-height: 1;
}
.designer-detail-summary { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.form-designer-filter { margin-bottom: 14px; }
.form-designer-filter .filter-grid { align-items: end; }

@media (max-width: 1100px) {
    .designer-summary-strip,
    .designer-detail-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .designer-summary-strip > div:nth-child(2n) { border-right: 0; }
    .designer-summary-strip > div:nth-child(n+3) { border-top: 1px solid var(--line); }
}
@media (max-width: 620px) {
    .designer-summary-strip,
    .designer-detail-summary { grid-template-columns: 1fr; }
    .designer-summary-strip > div { border-right: 0; border-top: 1px solid var(--line); }
    .designer-summary-strip > div:first-child { border-top: 0; }
}
.document-lifecycle-strip { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.document-lifecycle-strip > a {
    min-width: 0;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 9px;
    padding: 12px 14px;
    border-right: 1px solid var(--line);
    color: inherit;
    text-decoration: none;
}
.document-lifecycle-strip > a:last-child { border-right: 0; }
.document-lifecycle-strip > a:hover { background: var(--surface-soft); }
.document-lifecycle-strip > a span { min-width: 0; color: var(--muted); font-size: .74rem; font-weight: 800; }
.document-lifecycle-strip > a strong { flex: 0 0 auto; color: var(--navy-dark); font-size: 1.15rem; }
@media (max-width: 1180px) {
    .document-lifecycle-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .document-lifecycle-strip > a:nth-child(3n) { border-right: 0; }
    .document-lifecycle-strip > a:nth-child(n+4) { border-top: 1px solid var(--line); }
}
@media (max-width: 680px) {
    .document-lifecycle-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .document-lifecycle-strip > a:nth-child(3n) { border-right: 1px solid var(--line); }
    .document-lifecycle-strip > a:nth-child(2n) { border-right: 0; }
    .document-lifecycle-strip > a:nth-child(n+3) { border-top: 1px solid var(--line); }
}

/* QMS Portal 0.12.2 - flexible numeric fields and clearer alert conditions */
.number-field-settings {
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 12px 14px;
    background: var(--surface-soft);
}
.number-settings-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
    margin-top: 8px;
    align-items: start;
}
.number-settings-summary {
    display: block;
    margin-top: 8px;
    font-weight: 700;
    color: var(--navy-dark);
}
.number-entry-control {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}
.number-entry-control input[type="number"] {
    flex: 1 1 auto;
    min-width: 0;
}
.number-affix {
    flex: 0 0 auto;
    font-weight: 800;
    color: var(--navy-dark);
}
.alert-condition-builder {
    border-left: 3px solid var(--navy);
    padding: 12px 14px;
    background: var(--surface-soft);
    border-radius: 8px;
}
.alert-condition-grid {
    display: grid;
    grid-template-columns: minmax(220px, 2fr) minmax(140px, .8fr) minmax(220px, 1.5fr);
    gap: 12px;
    margin-top: 8px;
    align-items: start;
}
@media (max-width: 1100px) {
    .number-settings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .alert-condition-grid { grid-template-columns: 1fr 1fr; }
    .alert-condition-grid .field:last-child { grid-column: 1 / -1; }
}
@media (max-width: 680px) {
    .number-settings-grid,.alert-condition-grid { grid-template-columns: 1fr; }
    .alert-condition-grid .field:last-child { grid-column: auto; }
}

/* 0.12.3-dev: preserve Formidable scale questions as compact horizontal radio scales. */
.choice-scale { display:flex; flex-wrap:wrap; align-items:flex-start; gap:8px 14px; }
.choice-scale .choice-option { flex-direction:column; justify-content:flex-start; gap:3px; min-width:24px; text-align:center; }
.choice-scale .choice-option span { font-size:.86rem; line-height:1.1; }
@media (max-width:640px) {
    .choice-scale { gap:10px 12px; }
    .choice-scale .choice-option { min-width:28px; }
}

/* 0.12.3-dev: document family variants and source/released workbench. */
.document-family-model { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.document-variant-input { min-width: 210px; }
.family-review-help { margin: -4px 0 14px; padding: 10px 12px; border-left: 3px solid var(--navy); background: var(--surface-soft); border-radius: 6px; }
@media (max-width: 1100px) {
    .document-family-model { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
    .document-family-model { grid-template-columns: 1fr; }
    .document-variant-input { min-width: 0; }
}

/* QMS Portal 0.12.3.1 - review clarity and filter alignment */
.current-release-choice{display:flex;align-items:center;gap:7px;font-weight:700;line-height:1.25;min-width:150px}
.current-release-choice input[type="radio"]{flex:0 0 auto}
.current-release-choice + .form-help{margin-top:5px}
.family-review-guidance{margin:10px 0 12px;padding:10px 12px;border-left:3px solid var(--navy);background:var(--surface-soft);color:var(--muted)}

/* QMS Portal 0.13.0 - managed QMS manual content and Quality Review Centre. */
.qms-editor-card { overflow: visible; }
.qms-editor-toolbar {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin:0 0 12px;
    padding:10px;
    border:1px solid var(--line);
    border-radius:10px;
    background:var(--surface-soft);
}
.qms-document-link-tool {
    display:grid;
    grid-template-columns:minmax(280px,1fr) auto;
    gap:10px;
    align-items:end;
    margin-bottom:6px;
}
.qms-document-link-tool .field { margin-bottom:0; }
.qms-rich-editor {
    min-height:420px;
    margin-top:12px;
    padding:20px 22px;
    overflow:auto;
    border:1px solid var(--line);
    border-radius:10px;
    background:#fff;
    line-height:1.6;
    outline:none;
}
.qms-rich-editor:focus { border-color:var(--navy); box-shadow:0 0 0 3px rgba(31,62,133,.10); }
.qms-rich-editor > :first-child { margin-top:0; }
.qms-rich-editor > :last-child { margin-bottom:0; }
.imported-qms-content img,
.qms-rich-editor img { max-width:100%; height:auto; }
.qms-inline-document {
    font-weight:800;
    color:var(--navy);
    text-decoration:underline;
    text-decoration-thickness:1px;
    text-underline-offset:2px;
}
.qms-inline-document-missing,
.qms-broken-legacy-link { color:var(--danger); text-decoration-style:dashed; }
.qms-migrated-link-repaired { text-decoration-style:dotted; }
.qms-broken-legacy-media { max-width:100%; }
.qms-missing-media-note {
    display:block;
    max-width:720px;
    margin:12px 0;
    padding:12px 14px;
    border:1px dashed #c85858;
    border-radius:8px;
    background:#fff4f4;
    color:#8a2929;
    font-weight:700;
}
.qms-content-form .checkbox-field { justify-content:flex-start; }
.qms-content-form .checkbox-field label { display:flex; align-items:center; gap:8px; }
.qms-content-form .checkbox-field input { width:auto; min-height:0; }

@media(max-width:760px){
    .qms-document-link-tool { grid-template-columns:1fr; }
    .qms-rich-editor { min-height:320px; padding:16px; }
}
.qms-rich-editor .qms-broken-legacy-media {
    display:block;
    width:220px !important;
    height:56px !important;
    min-height:56px;
    border:1px dashed #c85858;
    background:#fff4f4;
}

/* QMS Portal 0.13.1 - QMS content density, PDF previews, and polished tables. */
.compact-stats { display:grid; }
.compact-stats .stat-card small {
    order:3;
    margin-top:7px;
    color:var(--muted);
    font-size:.78rem;
    font-weight:600;
    line-height:1.35;
}
.qms-content-summary { margin-bottom:18px; }

.qms-pdf-preview {
    width:min(560px,100%);
    margin:18px 0 24px;
    border:1px solid var(--line);
    border-radius:10px;
    overflow:hidden;
    background:#fff;
    box-shadow:0 5px 18px rgba(15,30,67,.08);
}
.qms-pdf-preview-frame {
    position:relative;
    width:100%;
    aspect-ratio:4 / 3;
    min-height:260px;
    background:var(--surface-soft);
}
.qms-pdf-preview-frame iframe {
    width:100%;
    height:100%;
    min-height:260px;
    border:0;
    background:#fff;
}
.qms-pdf-preview figcaption {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:14px;
    padding:12px 14px;
    border-top:1px solid var(--line);
    background:#fff;
}
.qms-pdf-preview figcaption > div { min-width:0; display:grid; gap:2px; }
.qms-pdf-preview figcaption strong { color:var(--navy-dark); overflow-wrap:anywhere; }
.qms-pdf-preview figcaption span { color:var(--muted); font-size:.84rem; }
.qms-document-preview-placeholder {
    display:block;
    max-width:560px;
    margin:12px 0;
    padding:14px 16px;
    border:1px dashed #9daacb;
    border-radius:9px;
    background:#f5f7fc;
    color:var(--navy-dark);
    font-weight:800;
    text-decoration:none;
}

.qms-table-builder {
    display:grid;
    grid-template-columns:120px 120px minmax(250px,1fr) auto;
    gap:10px;
    align-items:end;
    margin:-4px 0 12px;
    padding:12px;
    border:1px solid var(--line);
    border-radius:10px;
    background:var(--surface-soft);
}
.qms-table-builder[hidden] { display:none; }
.qms-table-builder .field { margin:0; min-width:0; }
.qms-table-edit-tools {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:7px;
    margin:0 0 12px;
}
.qms-table-edit-tools select { width:auto; min-width:230px; min-height:36px; padding:6px 9px; }

.imported-qms-content table,
.qms-rich-editor table {
    width:100%;
    margin:1.15rem 0 1.6rem;
    border-collapse:separate;
    border-spacing:0;
    overflow:hidden;
    border:1px solid #cbd5df;
    border-radius:6px;
    background:#fff;
}
.imported-qms-content table th,
.imported-qms-content table td,
.qms-rich-editor table th,
.qms-rich-editor table td {
    padding:.7rem .8rem;
    border:0;
    border-right:1px solid #d8dee6;
    border-bottom:1px solid #d8dee6;
    vertical-align:top;
    text-align:left;
}
.imported-qms-content table tr > :last-child,
.qms-rich-editor table tr > :last-child { border-right:0; }
.imported-qms-content table tbody tr:last-child > *,
.qms-rich-editor table tbody tr:last-child > * { border-bottom:0; }
.imported-qms-content table thead th,
.qms-rich-editor table thead th,
.imported-qms-content table.qms-table-blue thead th,
.qms-rich-editor table.qms-table-blue thead th,
.imported-qms-content table.qms-table-compact thead th,
.qms-rich-editor table.qms-table-compact thead th {
    background:#d9ebf5;
    color:#111827;
    font-weight:800;
}
.imported-qms-content table tbody tr:nth-child(even) td,
.qms-rich-editor table tbody tr:nth-child(even) td,
.imported-qms-content table.qms-table-blue tbody tr:nth-child(even) td,
.qms-rich-editor table.qms-table-blue tbody tr:nth-child(even) td,
.imported-qms-content table.qms-table-compact tbody tr:nth-child(even) td,
.qms-rich-editor table.qms-table-compact tbody tr:nth-child(even) td { background:#f4f4f4; }
.imported-qms-content table.qms-table-plain thead th,
.qms-rich-editor table.qms-table-plain thead th { background:#fff; }
.imported-qms-content table.qms-table-plain tbody tr:nth-child(even) td,
.qms-rich-editor table.qms-table-plain tbody tr:nth-child(even) td { background:#fff; }
.imported-qms-content table.qms-table-compact th,
.imported-qms-content table.qms-table-compact td,
.qms-rich-editor table.qms-table-compact th,
.qms-rich-editor table.qms-table-compact td { padding:.45rem .55rem; font-size:.9rem; }

@media(max-width:800px){
    .qms-table-builder { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .qms-table-builder .row-actions { grid-column:1 / -1; }
    .qms-pdf-preview figcaption { align-items:flex-start; flex-direction:column; }
}
@media(max-width:520px){
    .qms-table-builder { grid-template-columns:1fr; }
    .qms-table-builder .row-actions { grid-column:auto; }
    .qms-pdf-preview-frame,.qms-pdf-preview-frame iframe { min-height:220px; }
}

/* QMS Portal 0.13.1.1 - shared filter alignment and QMS cross-links. */
.filter-bar > .filter-actions,
.filter-bar > .row-actions {
    align-self:flex-end;
    min-height:42px;
    margin:0;
    align-items:stretch;
}
.filter-bar > .button,
.filter-bar > .filter-actions .button,
.filter-bar > .row-actions .button {
    height:42px;
    min-height:42px;
    padding:9px 15px;
    border-radius:8px;
    box-sizing:border-box;
}
.qms-content-link-tool {
    display:grid;
    grid-template-columns:minmax(280px,1fr) auto;
    gap:10px;
    align-items:end;
    margin-bottom:6px;
}
.qms-content-link-tool .field { margin-bottom:0; }
.qms-inline-page {
    font-weight:800;
    color:var(--navy);
    text-decoration:underline;
    text-decoration-thickness:1px;
    text-underline-offset:2px;
}
.qms-inline-page-missing { color:var(--danger); text-decoration-style:dashed; }
@media(max-width:760px){
    .qms-content-link-tool { grid-template-columns:1fr; }
}

/* QMS Portal 0.13.1.7 - editor document-reference controls, colour palettes, and selection-safe formatting. */
.qms-editor-format-help { margin:-5px 0 12px; }
.qms-colour-control { position:relative; }
.qms-colour-toggle { min-width:92px; }
.qms-colour-palette {
    position:absolute;
    z-index:30;
    top:calc(100% + 6px);
    left:0;
    display:grid;
    grid-template-columns:repeat(6,28px);
    gap:6px;
    width:max-content;
    max-width:min(260px,calc(100vw - 40px));
    padding:9px;
    border:1px solid #aab5d7;
    border-radius:9px;
    background:#fff;
    box-shadow:0 8px 24px rgba(23,36,72,.18);
}
.qms-colour-palette[hidden] { display:none; }
.qms-colour-swatch {
    width:28px;
    height:28px;
    min-width:28px;
    padding:0;
    border:1px solid #8993aa;
    border-radius:5px;
    cursor:pointer;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.45);
}
.qms-colour-swatch:hover,.qms-colour-swatch:focus-visible { outline:2px solid var(--navy); outline-offset:2px; }
.qms-palette-none { background:#fff; color:#b4232d; font-size:20px; line-height:1; font-weight:800; }
.qms-palette-ink { background:#18181b; } .qms-palette-navy { background:#1f356f; }
.qms-palette-blue { background:#2e478f; } .qms-palette-sky { background:#2563a9; }
.qms-palette-cyan { background:#0e7490; } .qms-palette-teal { background:#0f766e; }
.qms-palette-green { background:#2f6f3e; } .qms-palette-lime { background:#4d7c0f; }
.qms-palette-red { background:#d71920; } .qms-palette-coral { background:#c2413a; }
.qms-palette-orange { background:#c65d00; } .qms-palette-gold { background:#c89000; }
.qms-palette-yellow { background:#fff3a3; } .qms-palette-purple { background:#6b3fa0; }
.qms-palette-violet { background:#7c3aed; } .qms-palette-magenta { background:#a21caf; }
.qms-palette-brown { background:#7c4a2d; } .qms-palette-grey { background:#4b5563; }
.qms-palette-lightgrey { background:#9ca3af; }
.qms-palette-green-light { background:#d9f2df; } .qms-palette-blue-light { background:#dce8ff; }
.qms-palette-cyan-light { background:#d7f3f7; } .qms-palette-red-light { background:#ffdcdc; }
.qms-palette-orange-light { background:#ffe4c2; } .qms-palette-purple-light { background:#eadcff; }
.qms-palette-pink-light { background:#ffdff0; } .qms-palette-grey-bg { background:#e5e7eb; }

.qms-reference-edit-tools {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin:10px 0 4px;
    padding:10px 12px;
    border:1px solid #aab5d7;
    border-radius:9px;
    background:#f5f7fc;
}
.qms-reference-edit-tools[hidden] { display:none; }
.qms-reference-edit-tools > div:first-child { min-width:0; display:grid; gap:2px; }
.qms-reference-edit-tools strong { color:var(--navy-dark); }
.qms-reference-edit-tools span { color:var(--muted); font-size:.86rem; overflow-wrap:anywhere; }
.qms-rich-editor .qms-document-preview-placeholder {
    display:inline-flex;
    align-items:center;
    min-height:38px;
    margin:4px 0;
    padding:8px 11px;
    border:1px solid #aab5d7;
    border-radius:8px;
    background:#f5f7fc;
    color:var(--navy-dark);
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
    user-select:none;
}
.qms-rich-editor .qms-document-preview-placeholder::before { content:'PDF'; display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; min-width:34px; white-space:nowrap; margin-right:8px; padding:2px 6px; border-radius:4px; background:#dfe5f6; color:var(--navy-dark); font-size:.72rem; line-height:1.25; letter-spacing:.04em; }
.qms-rich-editor .qms-editor-reference-selected { outline:3px solid rgba(46,71,143,.20); outline-offset:2px; }

.qms-fg-ink { color:#18181b; } .qms-fg-navy { color:#1f356f; } .qms-fg-blue { color:#2e478f; }
.qms-fg-sky { color:#2563a9; } .qms-fg-cyan { color:#0e7490; } .qms-fg-teal { color:#0f766e; }
.qms-fg-green { color:#2f6f3e; } .qms-fg-lime { color:#4d7c0f; } .qms-fg-red { color:#d71920; }
.qms-fg-coral { color:#c2413a; } .qms-fg-orange { color:#c65d00; } .qms-fg-gold { color:#8a5a00; }
.qms-fg-purple { color:#6b3fa0; } .qms-fg-violet { color:#7c3aed; } .qms-fg-magenta { color:#a21caf; }
.qms-fg-brown { color:#7c4a2d; } .qms-fg-grey { color:#4b5563; } .qms-fg-lightgrey { color:#7b8494; }
.qms-bg-none { background-color:transparent; }
.qms-bg-yellow { background-color:#fff3a3; } .qms-bg-green { background-color:#d9f2df; }
.qms-bg-blue { background-color:#dce8ff; } .qms-bg-cyan { background-color:#d7f3f7; }
.qms-bg-red { background-color:#ffdcdc; } .qms-bg-orange { background-color:#ffe4c2; }
.qms-bg-purple { background-color:#eadcff; } .qms-bg-pink { background-color:#ffdff0; }
.qms-bg-grey { background-color:#e5e7eb; }

@media(max-width:760px){
    .qms-reference-edit-tools { align-items:flex-start; flex-direction:column; }
    .qms-reference-edit-tools .row-actions { width:100%; }
    .qms-colour-palette { grid-template-columns:repeat(5,28px); }
}

/* Backward compatibility for colour markup saved by 0.13.1.5-dev. */
.qms-text-default { color:#18181b; }
.qms-text-blue { color:#2e478f; }
.qms-text-red { color:#d71920; }
.qms-text-grey { color:#4b5563; }
.qms-text-gold { color:#8a5a00; }
/* QMS Portal 0.13.1.8 - keep editor formatting and active-table controls available while editing long QMS pages. */
.qms-editor-sticky-controls {
    position:sticky;
    top:var(--qms-editor-sticky-top,72px);
    z-index:19;
    margin:0 0 12px;
    padding:8px;
    border:1px solid #c6cee0;
    border-radius:11px;
    background:rgba(255,255,255,.97);
    box-shadow:0 6px 18px rgba(31,50,108,.12);
}
.qms-editor-sticky-controls .qms-editor-toolbar { margin:0 0 7px; }
.qms-editor-sticky-controls .qms-table-edit-tools { margin:0; padding:0 2px 1px; }
@media(max-width:700px){
    .qms-editor-sticky-controls { position:static; }
}
@media print {
    .qms-editor-sticky-controls { position:static; box-shadow:none; }
}


/* QMS 0.14.0.2 long-page workflow continuity.
   Native fragment navigation lands below the fixed portal navigation instead
   of hiding the working-section heading underneath it. */
.workflow-return-target { scroll-margin-top: 108px; }
@media (max-width: 760px) {
    .workflow-return-target { scroll-margin-top: 18px; }
}


/* 0.15.0 feature-complete portal review */
.review-checklist-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.metric-link{display:flex;align-items:center;justify-content:space-between;gap:16px;text-decoration:none;color:inherit;min-width:0}
.metric-link span{font-weight:600;min-width:0}
.metric-link strong{font-size:1.45rem;white-space:nowrap}
@media (max-width:760px){.review-checklist-grid{grid-template-columns:1fr}.metric-link{align-items:flex-start}}

.status-review { color:#6b4a00; background:#fff1c7; }

/* 0.15.0.2 acceptance review: restore the useful legacy QMS framework inside
   the Quality Management System menu while keeping the overall portal nav lean. */
.qms-framework-menu {
    width: min(460px, calc(100vw - 32px));
    max-height: min(78vh, 760px);
    overflow-y: auto;
    overscroll-behavior: contain;
}
.qms-framework-menu .qms-menu-search {
    margin-bottom: 5px;
    font-weight: 800;
    border-bottom: 1px solid rgba(255,255,255,.16);
}
.qms-menu-group + .qms-menu-group { margin-top: 5px; }
.qms-framework-menu .qms-menu-section {
    font-weight: 800;
    background: rgba(255,255,255,.06);
}
.qms-framework-menu .qms-menu-page {
    padding-left: 24px;
    font-size: .86rem;
    color: rgba(255,255,255,.9);
}
.qms-framework-menu .qms-menu-page::before {
    content: '–';
    margin-right: 7px;
    color: rgba(255,255,255,.55);
}
.qms-menu-resources {
    margin-top: 8px;
    padding-top: 7px;
    border-top: 1px solid rgba(255,255,255,.18);
}
.qms-menu-resources > span {
    display: block;
    padding: 5px 10px;
    color: rgba(255,255,255,.7);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}
@media (max-width:1220px) {
    .qms-framework-menu { width: auto; max-height: none; overflow: visible; }
    .qms-framework-menu .qms-menu-page { padding-left: 30px; }
}

.qms-release-meta{display:flex;align-items:center;justify-content:space-between;gap:18px;width:100%;margin:0 0 20px;color:#8a909c;font-size:.86rem;font-weight:400}
@media(max-width:700px){.qms-release-meta{flex-direction:column;align-items:flex-start;gap:2px}}


/* 0.15.1.1: named browser-tab wrapper for authenticated PDF previews. */
.document-viewer-html,.document-viewer-body{width:100%;height:100%;margin:0;overflow:hidden;background:#eef2f8}
.document-viewer-body{min-height:100%;padding:0}
.document-viewer-frame{display:block;width:100%;height:100vh;border:0;background:#fff}

.form-designer-section { margin-bottom:18px; }
.form-designer-section .record-section:last-child { margin-bottom:0; }
.form-designer-section .form-designer-create { margin-top:0; }
