:root{
  --navy:#1F3864; --teal:#0E7C7B; --plum:#6A2C70; --grey:#F2F2F2; --border:#d9d9d9;
}
*{box-sizing:border-box;}
body{font-family:Segoe UI, Arial, sans-serif; margin:0; color:#222; background:#fafafa;}
.topbar{display:flex; align-items:center; gap:24px; background:var(--navy); color:#fff; padding:10px 20px;}
.brand{display:flex; align-items:center; gap:8px; font-weight:700;}
.brand-mark{background:var(--plum); border-radius:6px; padding:4px 8px; font-size:.85rem;}
.mainnav{display:flex; gap:14px; flex-wrap:wrap; flex:1;}
.mainnav a{color:#fff; text-decoration:none; font-size:.9rem; opacity:.9;}
.mainnav a:hover{opacity:1; text-decoration:underline;}
.account{display:flex; align-items:center; gap:10px; font-size:.85rem;}
.account form{margin:0;}
.account button{background:none; border:1px solid #fff; color:#fff; border-radius:4px; padding:4px 10px; cursor:pointer;}
.content{padding:24px; max-width:1200px; margin:0 auto;}
.footer{text-align:center; color:#888; font-size:.8rem; padding:20px;}
h1{color:var(--navy); font-size:1.5rem;}
h2{color:var(--teal); font-size:1.15rem; margin-top:28px;}
table{width:100%; border-collapse:collapse; background:#fff; margin-top:10px;}
th,td{border:1px solid var(--border); padding:8px 10px; font-size:.88rem; text-align:left;}
th{background:var(--navy); color:#fff;}
tr:nth-child(even) td{background:var(--grey);}
.badge{display:inline-block; padding:2px 8px; border-radius:10px; font-size:.75rem; font-weight:600;}
.badge-complete{background:#DFF5E1; color:#1E7A34;}
.badge-inprogress{background:#FFF2CC; color:#8A6D00;}
.badge-notstarted{background:#eee; color:#666;}
.badge-blocked{background:#FBE0E0; color:#B12525;}
.card-row{display:flex; gap:16px; flex-wrap:wrap; margin-top:10px;}
.card{background:#fff; border:1px solid var(--border); border-radius:8px; padding:16px; min-width:200px; flex:1;}
.card .kpi{font-size:1.8rem; font-weight:700; color:var(--navy);}
.card .label{font-size:.8rem; color:#666; text-transform:uppercase; letter-spacing:.03em;}
.btn{display:inline-block; background:var(--teal); color:#fff; border:none; padding:8px 14px; border-radius:5px; cursor:pointer; text-decoration:none; font-size:.9rem;}
.btn:hover{opacity:.9;}
.btn-secondary{background:#888;}
.btn-danger{background:#B12525;}
form.inline{display:inline;}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px; max-width:760px;}
.form-grid label{font-weight:600; font-size:.85rem; display:block; margin-bottom:4px;}
.form-grid input, .form-grid select, .form-grid textarea{width:100%; padding:6px 8px; border:1px solid var(--border); border-radius:4px;}
.progress-bar{background:#eee; border-radius:8px; height:14px; overflow:hidden; width:100%;}
.progress-fill{background:var(--teal); height:100%;}
.validation-summary{color:#B12525; margin-bottom:10px;}
.fill-field{background:#fff; border:1px solid var(--border); border-radius:6px; padding:12px 14px; margin-bottom:12px; max-width:760px;}
.fill-field label{font-weight:600; font-size:.9rem; display:block; margin-bottom:4px;}
.fill-field input[type="text"], .fill-field input[type="number"], .fill-field input[type="date"], .fill-field select, .fill-field textarea{width:100%; padding:6px 8px; border:1px solid var(--border); border-radius:4px;}
.field-help{font-size:.8rem; color:#777; font-style:italic; margin-bottom:6px;}
.radio-option{display:block; font-weight:normal; font-size:.9rem; margin:4px 0;}
.radio-option input{width:auto; margin-right:6px;}

.triage-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 20px;
}

    .triage-summary > div {
        background: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        padding: 14px;
    }

    .triage-summary strong {
        display: block;
        color: #1e293b;
        font-size: 1.4rem;
    }

    .triage-summary span {
        color: #64748b;
        font-size: 0.85rem;
    }

.submission-list {
    display: grid;
    gap: 16px;
}

.submission-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    overflow: hidden;
}

.submission-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 16px;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.submission-title {
    color: #0f172a;
    font-size: 1rem;
    font-weight: 700;
}

.submission-subtitle {
    color: #64748b;
    font-size: 0.85rem;
    margin-top: 4px;
    overflow-wrap: anywhere;
}

    .submission-subtitle span {
        margin: 0 4px;
    }

.submission-card-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
    gap: 20px;
    padding: 16px;
}

.attachment-panel,
.classification-panel {
    min-width: 0;
}

    .attachment-panel h3 {
        margin-top: 0;
        font-size: 0.95rem;
    }

.attachment-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .attachment-list li {
        padding: 10px 0;
        border-bottom: 1px solid #f1f5f9;
    }

.attachment-name {
    display: block;
    color: #334155;
    font-size: 0.9rem;
    overflow-wrap: anywhere;
}

.attachment-meta {
    display: block;
    color: #64748b;
    font-size: 0.78rem;
    margin-top: 3px;
}

.classification-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.field-label {
    display: block;
    color: #64748b;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.field-value {
    display: block;
    color: #1e293b;
    margin-top: 3px;
    overflow-wrap: anywhere;
}

.resolution-note {
    margin-top: 14px;
    padding: 10px;
    background: #f8fafc;
    border-radius: 6px;
    color: #475569;
    font-size: 0.85rem;
}

.resolve-details {
    margin-top: 16px;
    border-top: 1px solid #e2e8f0;
    padding-top: 12px;
}

    .resolve-details summary {
        cursor: pointer;
        color: #1d4ed8;
        font-weight: 600;
    }

.resolve-form {
    display: grid;
    gap: 10px;
    margin-top: 12px;
}

    .resolve-form label {
        display: grid;
        gap: 5px;
        color: #334155;
        font-size: 0.85rem;
        font-weight: 600;
    }

    .resolve-form select,
    .resolve-form textarea {
        width: 100%;
        box-sizing: border-box;
        border: 1px solid #cbd5e1;
        border-radius: 6px;
        padding: 8px;
        font: inherit;
    }

.status {
    display: inline-block;
    border-radius: 999px;
    padding: 5px 9px;
    font-size: 0.75rem;
    font-weight: 700;
    white-space: nowrap;
}

.status-success {
    background: #dcfce7;
    color: #166534;
}

.status-ready {
    background: #dbeafe;
    color: #1d4ed8;
}

.status-warning {
    background: #ffedd5;
    color: #9a3412;
}

.status-danger {
    background: #fee2e2;
    color: #991b1b;
}

.empty-state {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    color: #64748b;
    padding: 28px;
    text-align: center;
}

.muted {
    color: #94a3b8;
    font-size: 0.85rem;
}

@media (max-width: 900px) {
    .triage-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .submission-card-body {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .triage-summary {
        grid-template-columns: 1fr;
    }

    .submission-card-header {
        display: block;
    }

        .submission-card-header .status {
            margin-top: 10px;
        }

    .classification-row {
        grid-template-columns: 1fr;
    }
}

.attachment-item {
    display: grid;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid #f1f5f9;
}

.attachment-resolution-form {
    display: grid;
    grid-template-columns: minmax(120px, 160px) minmax(120px, 1fr) auto;
    gap: 8px;
    align-items: center;
}

    .attachment-resolution-form select,
    .attachment-resolution-form input {
        min-width: 0;
        width: 100%;
        box-sizing: border-box;
        border: 1px solid #cbd5e1;
        border-radius: 6px;
        padding: 7px;
    }

@media (max-width: 700px) {
    .attachment-resolution-form {
        grid-template-columns: 1fr;
    }
}

.attachment-link {
    color: #1d4ed8;
    cursor: pointer;
    text-decoration: underline;
}

    .attachment-link:hover {
        color: #1e40af;
    }

/* Target the AI Suggested Score column by header text */
.ingestion-page .criteria-grading-table th:nth-child(3),
.ingestion-page .criteria-grading-table td:nth-child(3) {
    max-width: 480px; /* fixed width */
    min-width: 300px; /* ensures minimum */
    white-space: normal; /* allow wrapping */
}