/* Reference design: warm industrial workspace with restrained burgundy accents. */
:root{--bg:#f4f2ef;--surface:#fbfaf8;--paper:#fff;--text:#24211f;--muted:#68635e;--line:#d6d1cb;--soft:#ede9e4;--accent-soft:#e5f1eb;--teal:#005B32;--navy:#fbfaf8;--shadow:0 8px 24px #2d231017;color:var(--text);background:var(--bg);font-family:'Segoe UI',Arial,sans-serif}
[data-theme=dark]{--bg:#171615;--surface:#1e1c1a;--paper:#25221f;--text:#eeeae5;--muted:#b7afa7;--line:#433d38;--soft:#2f2b27;--accent-soft:#173c2b;--teal:#63b98b;--navy:#1e1c1a;color-scheme:dark}
body{background:var(--bg);color:var(--text)}.shell{grid-template-columns:264px minmax(0,1fr)}.sidebar{background:var(--surface);color:var(--text);border-right:1px solid var(--line);padding:0;height:100vh;overflow:hidden}.brand{height:65px;flex-shrink:0;padding:0 19px;border-bottom:1px solid var(--line);font-size:16px;letter-spacing:-.2px;gap:12px}.brand>svg{width:33px;height:33px;color:var(--teal)}.brand small{font-size:12px;color:var(--muted);font-weight:400;letter-spacing:0;margin-top:3px}.nav{display:block;overflow:auto;padding:10px;scrollbar-width:thin}.nav-group{margin-bottom:12px}.nav-label{font-size:10px;font-weight:700;letter-spacing:1.2px;color:var(--muted);margin:0;padding:10px 10px 6px}.nav button{width:100%;color:var(--muted);padding:9px 10px;border-radius:6px;font-size:13px;min-height:38px;gap:11px}.nav button svg{width:17px;height:17px;flex-shrink:0}.nav button:hover{background:var(--soft);color:var(--text)}.nav button.active{background:var(--accent-soft);color:var(--teal);box-shadow:none;font-weight:650}.sidebar-bottom{padding:15px 19px;border-color:var(--line);color:var(--muted);font-size:11px;background:var(--surface)}.sidebar-bottom strong{color:var(--text);font-size:12px}.topbar{height:65px;padding:0 26px;background:var(--surface);gap:20px}.breadcrumb{font-size:13px;white-space:nowrap}.breadcrumb b{color:var(--text)}.account{gap:10px;font-size:12px}.avatar{background:var(--text);color:var(--paper);width:33px;height:33px}.global-search{position:relative;flex:1;max-width:410px}.global-search input{background:var(--bg);height:37px;font-size:13px}.global-search>div{position:absolute;top:42px;left:0;right:0;z-index:40;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:8px;padding:10px}.global-search>div>div{padding:10px;border-bottom:1px solid var(--line)}.global-search small{display:block;color:var(--muted);margin-top:5px}.content{padding:26px 28px 45px;max-width:1600px}.page-head{margin-bottom:22px}.eyebrow{font-size:11px;letter-spacing:1.1px;margin-bottom:6px}h1{font-size:28px;letter-spacing:-.65px}h2{font-size:16px}h3{font-size:15px}.sub{font-size:13px}.metrics{gap:14px;margin-bottom:17px}.metric{padding:17px 18px;border-radius:9px;background:var(--paper);box-shadow:0 1px 2px #2d23100a}.metric .metric-title{font-size:13px;margin-bottom:12px}.metric strong{font-size:30px}.metric small{font-size:11px}.metric-icon{background:var(--soft);color:var(--teal);right:16px;top:14px;width:30px;height:30px}.panel{background:var(--paper);border-radius:9px;margin-bottom:17px;box-shadow:0 1px 2px #2d23100a}.panel-head{padding:15px 18px}.panel-body{padding:18px}.cols{gap:17px;grid-template-columns:minmax(0,1.65fr) minmax(290px,1fr)}.btn{border-radius:6px;background:var(--paper);color:var(--text);padding:9px 13px;font-size:13px;min-height:37px}.btn:hover{background:var(--soft);border-color:var(--line)}.btn.primary{background:var(--teal);border-color:var(--teal);color:#fff}.btn.primary:hover{background:#004626}.btn.ghost{background:transparent}.btn.small{min-height:32px;padding:6px 10px;font-size:12px}.btn.danger{color:#a2303b;background:#f6e2e4}.text-link{color:var(--teal);font-size:13px}.badge{border-radius:999px;font-size:11px;padding:4px 8px;background:var(--soft);color:var(--muted)}.badge.good{background:#e4f1e9;color:#28704b}.badge.warn{background:#f7ecd9;color:#9a5b11}.badge.bad{background:#f6e2e4;color:#a2303b}.badge.blue{background:#e0edf3;color:#256786}table{font-size:13px}th{color:var(--muted);background:var(--surface);font-size:11px;padding:11px 14px;letter-spacing:.4px}td{padding:12px 14px;border-color:var(--line)}td strong{color:var(--text)}tr:hover td{background:var(--surface)}td small{font-size:11px}.workflow{background:var(--paper);border:0;border-radius:0;padding:18px;margin:0}.qms-flow{overflow:auto;gap:12px;flex-wrap:nowrap}.qms-flow .step{display:block;text-align:center;min-width:65px}.qms-flow .step:after{display:none}.step span{margin:0 auto 9px;background:var(--accent-soft);color:var(--teal)}.step b{font-size:11px;color:var(--muted);white-space:nowrap}.queue-item{border-color:var(--line);padding-left:12px}.notice{background:var(--surface);border-color:var(--line);color:var(--muted);font-size:13px}.notice.warning{background:#f7ecd9;color:#805114}.empty{color:var(--muted)}.empty strong{color:var(--text)}input,select,textarea{border-color:var(--line);background:var(--paper);color:var(--text)}input:focus,select:focus,textarea:focus{outline-color:var(--teal)}label{color:var(--muted)}dialog{background:var(--paper);color:var(--text);border-color:var(--line);box-shadow:0 22px 60px #2d231029}dialog::backdrop{background:#1a15127a;backdrop-filter:blur(2px)}.modal-head{background:var(--paper);padding:18px 22px}.modal-body{padding:22px}.detail-grid,.pre,.row-fields.test-row{background:var(--surface)}.detail-grid{gap:18px}.row-fields.test-row{grid-template-columns:1.4fr 1.3fr .6fr .9fr .8fr .8fr 1fr auto}.total{background:var(--accent-soft);color:var(--teal)}.report-bar{display:flex;align-items:center;gap:15px;padding:10px 0;font-size:13px;border-bottom:1px solid var(--line)}.report-bar span{min-width:130px}.report-bar meter{height:16px;flex:1;accent-color:var(--teal)}.report-bar strong{margin-left:auto}.login-art{background:#005B32}.login-art .brand{border:0;padding:0;font-size:23px}.login-art .eyebrow{color:#b9dfca}.login-art p{color:#d1e7db}.login-lines span{background:#75bd95}.login-form{background:var(--paper)}.mobile-toggle{display:none}#toast{background:#004626;color:white}
@media(max-width:1350px){.cols{grid-template-columns:1fr}.global-search{max-width:300px}.row-fields.test-row{grid-template-columns:repeat(4,1fr)}}
@media(max-width:1080px){.shell{grid-template-columns:220px minmax(0,1fr)}.sidebar{padding:0}.topbar{padding:0 18px}.breadcrumb{display:none}.content{padding:23px 20px}.metrics{grid-template-columns:repeat(2,1fr)}.qms-flow .step{min-width:65px}.account>span:not(.avatar){display:none}}
@media(max-width:760px){.shell{display:block}.sidebar{position:fixed;left:-270px;top:0;bottom:0;width:264px;z-index:50;transition:left .2s}.sidebar.open{left:0;box-shadow:8px 0 40px #0003}.brand small,.sidebar .nav-label,.sidebar-bottom{display:block}.nav{display:block;margin:0}.nav button{white-space:normal;text-align:left}.nav-icon{display:block}.topbar{position:sticky;top:0;z-index:20;height:60px;padding:0 10px;gap:8px}.mobile-toggle{display:block}.account{gap:0}.account .avatar{display:none}.global-search{max-width:none}.content{padding:22px 14px}.page-head{display:block}.page-head>.actions{justify-content:flex-start;margin-top:12px}.workflow.qms-flow{display:flex}.metric{padding:15px}.row-fields.test-row{grid-template-columns:1fr 1fr}.sidebar-bottom{flex-shrink:0}.brand{padding:0 18px}.theme-button{padding:8px}.page-head h1{font-size:25px}}

.sidebar-toggle{display:inline-flex;width:38px;height:38px;padding:0;font-size:19px;flex:0 0 38px}.shell,.sidebar{transition:grid-template-columns .2s ease,transform .2s ease,width .2s ease,border-color .2s ease}.shell.sidebar-collapsed{grid-template-columns:0 minmax(0,1fr)}.shell.sidebar-collapsed .sidebar{width:0;transform:translateX(-100%);border-right-color:transparent}.content.module-dashboard>.page-head{display:none}.module-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:14px}.module-heading h2{font-size:24px}.module-heading>span{font-size:12px;color:var(--muted)}.module-grid{display:grid;grid-template-columns:repeat(3,minmax(250px,1fr));gap:11px}.module-card{min-height:94px;border:1px solid var(--line);border-radius:9px;background:var(--paper);box-shadow:0 1px 2px #2d23100a;padding:17px 14px;display:grid;grid-template-columns:40px minmax(0,1fr) 18px;gap:11px;align-items:center;text-align:left;color:var(--text);transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}.module-card:hover{transform:translateY(-2px);border-color:#a9cbbb;box-shadow:0 8px 24px #005b3212;background:var(--paper)}.module-icon{width:38px;height:38px;border-radius:9px;background:var(--accent-soft);color:var(--teal);display:grid;place-items:center}.module-icon svg{width:21px;height:21px}.module-copy{display:grid;gap:6px;min-width:0}.module-copy strong{font-size:13px}.module-copy small{font-size:11px;color:var(--muted);line-height:1.45}.module-arrow{font-size:22px;color:var(--muted)}.approval-flow{display:flex;align-items:center;gap:12px;margin:0 0 20px;padding:15px 18px;background:var(--paper);border:1px solid var(--line);border-radius:9px}.approval-flow span{display:flex;align-items:center;gap:8px;font-size:13px}.approval-flow b{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:var(--accent-soft);color:var(--teal)}.approval-flow i{color:var(--muted);font-style:normal}.active-mark{font-size:12px;color:#28704b}
@media(max-width:1100px){.module-grid{grid-template-columns:repeat(2,minmax(240px,1fr))}}
@media(max-width:760px){.shell.sidebar-collapsed{display:block}.shell.sidebar-collapsed .sidebar{width:264px;transform:none}.sidebar-toggle{display:inline-flex}.module-grid{grid-template-columns:1fr}.module-heading{align-items:flex-start}.module-heading>span{display:none}.approval-flow{overflow:auto}.approval-flow span{white-space:nowrap}}
.module-card.has-module-alert{border-color:#d99caa;background:linear-gradient(0deg,#fff7f8,#fff)}
.module-copy strong{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.module-alert{font-style:normal;border-radius:999px;background:#a0182f;color:#fff;font-size:10px;line-height:1;padding:5px 7px;white-space:nowrap}
.module-bell{position:relative;width:34px;height:34px;border-radius:999px;background:#a0182f;color:#fff;display:grid;place-items:center;justify-self:end}
.module-bell svg{width:17px;height:17px}
.module-bell b{position:absolute;top:-7px;right:-7px;min-width:18px;height:18px;border-radius:999px;background:#fff;color:#a0182f;border:1px solid #e1b7bf;font-size:11px;line-height:16px;text-align:center}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}


/* ==========================================================
   MODULE HUB - PROFESSIONAL CARD GRID
   ========================================================== */

.module-hub{
    width:100%;
}

.module-hub-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
    width:100%;
    align-items:stretch;
}

.module-hub .module-card{
    position:relative;
    display:grid;
    grid-template-columns:46px minmax(0,1fr) 20px;
    align-items:center;
    gap:15px;

    width:100%;
    min-width:0;
    min-height:128px;

    padding:20px;

    text-align:left;
    color:var(--text);
    background:var(--paper);

    border:1px solid var(--line);
    border-radius:12px;

    cursor:pointer;
    appearance:none;

    box-shadow:0 1px 3px rgba(45,35,16,.05);

    transition:
        transform .16s ease,
        box-shadow .16s ease,
        border-color .16s ease,
        background .16s ease;
}

.module-hub .module-card:hover{
    transform:translateY(-2px);
    border-color:var(--teal);
    background:var(--surface);
    box-shadow:0 8px 22px rgba(45,35,16,.08);
}

.module-hub .module-card:active{
    transform:translateY(0);
}

.module-hub .module-card-icon{
    display:flex;
    align-items:center;
    justify-content:center;

    width:46px;
    height:46px;

    border-radius:10px;

    background:var(--accent-soft);
    color:var(--teal);

    font-size:20px;
    font-weight:700;
}

.module-hub .module-card-copy{
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-width:0;
}

.module-hub .module-card-copy strong{
    display:block;
    margin:0 0 7px;

    color:var(--text);

    font-size:14px;
    font-weight:700;
    line-height:1.3;
}

.module-hub .module-card-copy small{
    display:block;

    color:var(--muted);

    font-size:12px;
    line-height:1.5;
}

.module-hub .module-card-arrow{
    display:flex;
    align-items:center;
    justify-content:center;

    color:var(--teal);

    font-size:23px;
    font-weight:400;

    transition:transform .16s ease;
}

.module-hub .module-card:hover .module-card-arrow{
    transform:translateX(3px);
}


/* Large desktop */

@media (min-width:1500px){
    .module-hub-grid{
        gap:20px;
    }

    .module-hub .module-card{
        min-height:135px;
        padding:22px;
    }
}


/* Tablet */

@media (max-width:1100px){
    .module-hub-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}


/* Mobile */

@media (max-width:680px){
    .module-hub-grid{
        grid-template-columns:1fr;
        gap:12px;
    }

    .module-hub .module-card{
        min-height:105px;
        padding:16px;
    }
}



/* ============================================================
   REPORT CENTER
   ============================================================ */

.report-filter-panel {
    margin-bottom: 18px;
}

.report-filters {
    display: grid;
    grid-template-columns: repeat(3, minmax(180px, 1fr));
    gap: 14px;
    padding: 18px;
}

.report-filters label {
    display: flex;
    flex-direction: column;
    gap: 7px;
    font-size: 12px;
    font-weight: 700;
}

.report-filters input,
.report-filters select {
    width: 100%;
    min-height: 42px;
}

.report-search-field {
    grid-column: span 2;
}

.report-filter-panel > .actions {
    padding: 0 18px 18px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

@media (max-width: 1100px) {
    .report-filters {
        grid-template-columns: repeat(2, minmax(180px,1fr));
    }

    .report-search-field {
        grid-column: span 2;
    }
}

@media (max-width: 700px) {
    .report-filters {
        grid-template-columns: 1fr;
    }

    .report-search-field {
        grid-column: auto;
    }
}


/* ============================================================
   REPORT CENTER
   ============================================================ */

.report-center-links {
    margin-bottom: 16px;
}

.report-center-card {
    width: 100%;
    display: grid;
    grid-template-columns: 46px 1fr auto;
    align-items: center;
    gap: 14px;
    padding: 16px 18px;
    border: 1px solid #ddd8d1;
    border-radius: 12px;
    background: #fff;
    text-align: left;
    cursor: pointer;
}

.report-center-card:hover {
    border-color: #9aaeb7;
    box-shadow: 0 4px 16px rgba(0,0,0,.05);
}

.report-center-card strong {
    display: block;
    font-size: 14px;
    margin-bottom: 4px;
}

.report-center-card small {
    display: block;
    color: #6c7a82;
}

.report-center-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: #edf3f5;
    font-size: 20px;
}

.report-subnav {
    display: flex;
    gap: 8px;
    margin-bottom: 18px;
}

/* ==========================================================
   QUALITY SPECIFICATION - TEST FQ
   ========================================================== */

.test-fq-field{
    min-width:70px;
}

.test-fq-control{
    min-height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    padding:0 10px;
    border:1px solid var(--line, #d8d2cc);
    border-radius:7px;
    background:#fff;
}

.test-fq-control input[type="checkbox"]{
    width:17px;
    height:17px;
    margin:0;
    cursor:pointer;
}

.test-fq-control span{
    font-size:13px;
    white-space:nowrap;
}

/* Explicit legacy assignment review controls. */
#record-assignments .assignment-editor { padding:20px 24px; margin-bottom:18px; }
#record-assignments fieldset { border:1px solid var(--line); border-radius:6px; padding:10px 14px; margin:14px 0; }
#record-assignments fieldset label { display:flex; align-items:center; gap:9px; margin:8px 0; }
#record-assignments input.assignment-plant,
#record-assignments input.assignment-record { width:17px; height:17px; margin:0; flex:none; cursor:pointer; }
#record-assignments .assignment-editor textarea { min-height:80px; margin:8px 0 12px; }
