@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/Inter-400.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(assets/fonts/Inter-500.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(assets/fonts/Inter-600.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(assets/fonts/Inter-700.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(assets/fonts/Inter-800.ttf) format('truetype');
}

/* Visual theme only. Existing markup, data and interaction code are preserved. */
:root{--ui-font:Inter,"Segoe UI",Arial,sans-serif;--blue:#3349b8;--navy:#272c37;--ink:#272c37;--muted:#737987;--line:#e3e6ee;--page:#f2f5fb;--theme-accent:#3349b8;--theme-accent-strong:#0519a8;--theme-soft:#edf0fc}
body,.dashboard-active,body:has(#signedOutView:not([hidden])){font-family:var(--ui-font);color:#272c37;background:#f2f5fb;font-weight:400;-webkit-font-smoothing:antialiased}
button,input,select,textarea,.dashboard-sidebar nav button,#mobileNavigation nav button,.sidebar-request-group>summary,.mobile-signout{font-family:var(--ui-font)}
h1,h2,h3,h4{letter-spacing:-.035em;font-weight:600}.top-stripe{background:#3349b8;height:2px}
.dashboard-active .site-header{background:#fafbfe;border-color:#e3e6ee}.dashboard-active .header-inner{min-height:68px}.dashboard-toolbar{color:#959ba7}.dashboard-toolbar strong{color:#4a5160}.dashboard-toolbar button{display:grid;place-items:center;border-color:#e1e5ed;border-radius:6px;color:#687386;background:#fff}
.dashboard-active .dashboard-sidebar{background:#f8f9fd;border-color:#e2e6ef}.sidebar-brand{border-color:#e1e5ef}.sidebar-brand strong{font-family:var(--ui-font);font-size:13px;font-weight:700;letter-spacing:-.035em;color:#283b8b;line-height:1.4}.sidebar-brand span{font-size:9px;color:#848c9d;line-height:1.6}
.dashboard-sidebar .nav-section-label,#mobileNavigation .nav-section-label{color:#9298a5;font-size:9px;letter-spacing:.015em;font-weight:500}
.dashboard-sidebar nav button,#mobileNavigation nav button,.sidebar-request-group>summary{color:#515867;font-weight:500;font-size:12px;letter-spacing:-.015em;border-radius:5px}
.dashboard-sidebar svg,#mobileNavigation nav svg{color:#969ead}.dashboard-sidebar nav button[aria-current=page],#mobileNavigation nav button[aria-current=page]{background:#eceffd;color:#3349b8;font-weight:600}.dashboard-sidebar nav button[aria-current=page] svg,#mobileNavigation nav button[aria-current=page] svg{color:#3349b8}
.dashboard-sidebar nav button:hover,#mobileNavigation nav button:hover,.sidebar-request-group>summary:hover{background:#eff1f8}.sidebar-subnav,.sidebar-utilities{border-color:#e3e6ee}.sidebar-bottom{border-color:#e2e6ee;border-radius:6px;background:#fff}.sidebar-bottom strong{color:#3d4556;font-size:10px}.sidebar-avatar{background:#eef0fa;color:#4b5ba1;border-radius:6px}.sidebar-bottom div>span{color:#8c93a3}
.dashboard-active .page-shell{padding-top:24px}.dashboard-active .hero h1{font-size:27px;font-weight:600;color:#272c37;letter-spacing:-.04em}.dashboard-active .hero-text{color:#7b8292;font-size:12px}.dashboard-active .hero .eyebrow{color:#7d86ab;font-size:9px;letter-spacing:.04em}
.track-btn,.dashboard-active #newRequestBtn,#newRequestForm .track-btn{background:#3349b8;color:#fff;border-color:#3349b8;box-shadow:none;border-radius:6px;font-weight:600}
.track-btn:hover,.dashboard-active #newRequestBtn:hover,#newRequestForm .track-btn:hover{background:#2439a6;border-color:#2439a6}.secondary-btn,.dashboard-active #refreshBtn{background:#fff;border-color:#dde2ec;color:#535d71;border-radius:6px;box-shadow:none}.secondary-btn:hover{background:#f4f6fc;border-color:#bdc6e2}
.dashboard-active[data-workspace=overview] .hero{background:linear-gradient(110deg,#3349b8,#245bd4);border:1px solid #3c5fc4;padding:24px;border-radius:8px;gap:20px}
.dashboard-active[data-workspace=overview] .hero h1{color:#fff;font-size:27px}.dashboard-active[data-workspace=overview] .hero .eyebrow{color:#d2dcff}.dashboard-active[data-workspace=overview] .hero-text{color:#dfe7ff}.dashboard-active[data-workspace=overview] #newRequestBtn{background:#fff;color:#243b99;border-color:#fff}.dashboard-active[data-workspace=overview] #refreshBtn{background:#ffffff12;border-color:#ffffff50;color:#fff}.dashboard-active[data-workspace=overview] #refreshBtn:hover{background:#ffffff24}
.dashboard-active .employee-requests{margin-top:20px}.dashboard-active .dashboard-stat{border-color:#e2e6ef;border-radius:8px;box-shadow:none;padding:18px}.dashboard-active .dashboard-stat[aria-pressed=true]{border-color:#ccd5f4;box-shadow:none}.dashboard-stat:hover{background:#fafbff!important;border-color:#b2bfef!important;transform:none}.dashboard-stat>span{font-size:12px;color:#697487}.dashboard-stat>strong{font-size:32px;font-weight:600;color:#272c37;letter-spacing:-.04em}.dashboard-stat small{font-size:10px;color:#9199a8}.stat-symbol{background:#eff2fd;color:#4a60bd;border-radius:6px;width:28px;height:28px}
.chart-card,.dashboard-list{border-color:#e2e6ef;border-radius:8px;box-shadow:none}.chart-heading h2,.dashboard-list h2{color:#303745;font-size:18px;font-weight:600;letter-spacing:-.03em}.chart-heading .eyebrow,.dashboard-list-heading .eyebrow{color:#8a93a8;letter-spacing:.03em}.chart-heading>span,.chart-footnote,.dashboard-list-heading p{color:#8a93a3}.dashboard-total{background:#eef1fa;color:#687cac;border-radius:6px;font-size:10px}.donut-center strong{color:#303b56}.donut-center span,.chart-legend button{color:#7c87a1}.chart-legend strong{color:#354a87}.chart-legend small{color:#8f9bb2}
.donut-wrap svg circle:nth-child(2){stroke:#3349b8}.donut-wrap svg circle:nth-child(3){stroke:#8fa2dc}.donut-wrap svg circle:nth-child(4){stroke:#d6def2}.chart-legend button:nth-child(1) i{background:#3349b8!important}.chart-legend button:nth-child(2) i{background:#8fa2dc!important}.chart-legend button:nth-child(3) i{background:#d6def2!important}.stage-bar-track{background:#edf0f7}.stage-bar-track i{background:#7b91cf}.stage-bar-row{color:#7e8aa0}.stage-bar-row strong{color:#516699}
.dashboard-active .employee-controls label,.submission-controls label{color:#747e90;font-size:11px}.dashboard-active .employee-controls input,.dashboard-active .employee-controls select,.submission-controls input,.submission-controls select{border-color:#e0e5ef;border-radius:6px;color:#454f62;font-size:12px;background-color:#fff}.dashboard-active input::placeholder{color:#919bac;opacity:1}.dashboard-clear{color:#6476aa}.dashboard-results-head>p{color:#7b8495}
.dashboard-table-head,.submission-table-head,.request-table-heading,#requestReview thead th{background:#edf1f9;color:#72809a;border-color:#e3e8f1;font-weight:500}.dashboard-active .employee-request-row,.submission-row{border-color:#e9ecf3;color:#566279}.dashboard-active .employee-request-row:hover,.submission-row:hover{background:#f8faff}.employee-request-row>span:first-child strong,.dashboard-item-summary>strong,.submission-row strong{color:#38475f;font-weight:500}.employee-request-row small,.submission-row small,.submission-reference{color:#8d9ab0}.row-open{border-color:#e2e8f2;background:#fafbff;color:#8997b2;border-radius:5px}.employee-request-row:hover .row-open,.submission-row:hover .row-open{background:#edf1fe;border-color:#c9d3f4;color:#3349b8}.dashboard-pagination{border-color:#e7ebf3;color:#8390a5}
#newRequestDialog,.submission-detail-dialog{color:#45536b;border-color:#e0e6f0;border-radius:10px;box-shadow:0 20px 65px #26365325}#newRequestDialog::backdrop,.submission-detail-dialog::backdrop{background:#26365166}#newRequestDialog .request-dialog-head{border-color:#e7ebf4;background:#fff}.request-dialog-head h2{color:#303b50;font-family:var(--ui-font);font-size:22px;font-weight:600;letter-spacing:-.035em}.request-dialog-head .eyebrow{color:#7d89a9;font-size:9px;letter-spacing:.07em}.request-header-description,.request-requester{color:#8895ac}.request-steps{border-color:#e7ebf4}.request-steps li{color:#939db0}.request-steps li>span{background:#f0f3fa;color:#8d9bb3}.request-steps li[aria-current=step]{color:#3349b8}.request-steps li[aria-current=step]>span{background:#3349b8;color:#fff}
#newRequestForm label,#requestReview h3,#requestReview h4,.request-items-heading h3{color:#48566e;font-weight:500}#newRequestForm input,#newRequestForm select,#newRequestForm textarea{font-family:var(--ui-font);color:#526078;border-color:#e0e7f1;border-radius:5px}#newRequestForm input[readonly]{background:#f7f9fd;color:#8a97ae}#newRequestForm .request-edit-item input,#newRequestForm .request-edit-item select{border-color:#e0e7f2;color:#526078;font-size:11px}#newRequestForm .request-edit-item:nth-child(even){background:#fbfcff}.request-items-table,.review-table-frame{border-color:#e1e7f2}.request-table-heading b{color:#b35a76}.request-table-heading>span{border-color:#e1e7f2}.request-add-row{background:#eef2ff;color:#526dc1}.request-add-row:hover{background:#e5ebfe}.request-items-heading button{background:#f9faff;color:#526dc1;border-color:#cfdaf9}.request-form-actions{box-shadow:0 -1px #e5eaf3}.request-form-actions .secondary-btn{color:#647796}
#requestReview table{color:#687b98}#requestReview th,#requestReview td{border-color:#e4eaf4}.submission-notice,#newRequestDialog[data-step=review] .submission-notice{background:#f2f5fd;color:#7d90b0;border-color:#dfe7f8}.submission-notice.is-success{background:#eef7f2;border-color:#c6e2d1;color:#2f6f48}
.dashboard-active .site-footer{background:#fff;border-color:#e3e7ef;color:#8492a7}.dashboard-active .footer-company,.dashboard-active .footer-portal{color:#8996ab}#mobileNavigation{background:#f8f9fd;border-color:#e1e5f0}.mobile-nav-head{color:#424e69;border-color:#e3e7f1}
.login-brand strong{color:#303b50}.login-intro h2{color:#303b50}.login-preview{background:#f2f5fb}.login-preview h3{color:#3349b8}
@media(max-width:1050px){#newRequestForm .request-edit-item input,#newRequestForm .request-edit-item select{font-size:14px}}
@media(max-width:600px){.dashboard-active .hero h1,.dashboard-active[data-workspace=overview] .hero h1{font-size:24px}.dashboard-active[data-workspace=overview] .hero{padding:20px 16px}.dashboard-active .hero-text{font-size:12px}.dashboard-active #newRequestBtn,.dashboard-active #refreshBtn{font-size:11px;padding-inline:12px}.dashboard-active .employee-controls input,.dashboard-active .employee-controls select,.submission-controls input,.submission-controls select,#newRequestForm input,#newRequestForm select,#newRequestForm .request-edit-item input,#newRequestForm .request-edit-item select{font-size:16px}.sidebar-brand strong{font-size:13px}.request-dialog-head h2{font-size:20px}}


/* SLDCC dashboard status colors + contrast update (2026-09-14)
   In progress = blue, For delivery = amber, Completed = green.
   Muted copy is intentionally darker for better readability. */
:root{
  --muted:#5f6978;
  --status-progress:#3349b8;
  --status-delivery:#d99a24;
  --status-delivery-ink:#9a6200;
  --status-delivery-soft:#fff5dc;
  --status-completed:#2f8a57;
  --status-completed-ink:#276f49;
  --status-completed-soft:#eaf7ef;
}

/* Request-status donut and legend */
.donut-wrap svg circle:nth-child(2){stroke:var(--status-progress)!important}
.donut-wrap svg circle:nth-child(3){stroke:var(--status-delivery)!important}
.donut-wrap svg circle:nth-child(4){stroke:var(--status-completed)!important}
.chart-legend button:nth-child(1) i{background:var(--status-progress)!important}
.chart-legend button:nth-child(2) i{background:var(--status-delivery)!important}
.chart-legend button:nth-child(3) i{background:var(--status-completed)!important}
.chart-legend button:nth-child(1) strong{color:var(--status-progress)!important}
.chart-legend button:nth-child(2) strong{color:var(--status-delivery-ink)!important}
.chart-legend button:nth-child(3) strong{color:var(--status-completed-ink)!important}

/* Matching accents on the overview statistic cards */
.dashboard-stat[data-bucket="progress"] .stat-symbol{background:#eef1ff;color:var(--status-progress)}
.dashboard-stat[data-bucket="delivery"] .stat-symbol{background:var(--status-delivery-soft);color:var(--status-delivery-ink)}
.dashboard-stat[data-bucket="delivered"] .stat-symbol{background:var(--status-completed-soft);color:var(--status-completed-ink)}
.dashboard-stat[data-bucket="progress"][aria-pressed="true"]{border-color:#aeb9ed!important}
.dashboard-stat[data-bucket="delivery"][aria-pressed="true"]{border-color:#e4bf72!important}
.dashboard-stat[data-bucket="delivered"][aria-pressed="true"]{border-color:#9dceb1!important}

/* Darker secondary text throughout dashboard/navigation */
.dashboard-toolbar{color:#687283}
.sidebar-brand span{color:#697587}
.dashboard-sidebar .nav-section-label,#mobileNavigation .nav-section-label{color:#727b89}
.dashboard-sidebar nav button,#mobileNavigation nav button,.sidebar-request-group>summary{color:#465264}
.dashboard-sidebar svg,#mobileNavigation nav svg{color:#6c7889}
.sidebar-bottom div>span{color:#697587}
.dashboard-active .hero-text{color:#626d7d}
.dashboard-stat>span{color:#556274}
.dashboard-stat small{color:#667181}
.chart-heading .eyebrow,.dashboard-list-heading .eyebrow{color:#697486}
.chart-heading>span,.chart-footnote,.dashboard-list-heading p{color:#667181}
.donut-center span,.chart-legend button{color:#5e6979}
.chart-legend small{color:#697586}
.stage-bar-row{color:#626f80}
.dashboard-active .employee-controls label,.submission-controls label{color:#596779}
.dashboard-active input::placeholder{color:#737e8e;opacity:1}
.dashboard-results-head>p{color:#626e7e}
.dashboard-table-head,.submission-table-head,.request-table-heading,#requestReview thead th{color:#606d80}
.dashboard-active .employee-request-row,.submission-row{color:#46566b}
.employee-request-row small,.submission-row small,.submission-reference{color:#68768a}
.dashboard-pagination{color:#657286}
.dashboard-active .site-footer,.dashboard-active .footer-company,.dashboard-active .footer-portal{color:#697587}

/* Darker form helper copy and review text */
.request-dialog-head .eyebrow{color:#65728a}
.request-header-description,.request-requester{color:#5f6d80}
.request-steps li{color:#667487}
.request-steps li>span{color:#68788f}
#newRequestForm label{color:#3f4d61}
#newRequestForm label>span,#newRequestForm label small{color:#637185}
#newRequestForm input,#newRequestForm select,#newRequestForm textarea{color:#3f4c60}
#newRequestForm input::placeholder,#newRequestForm textarea::placeholder{color:#778294;opacity:1}
#newRequestForm input[readonly]{color:#5c697c}
#newRequestForm .request-edit-item input,#newRequestForm .request-edit-item select{color:#46556a}
#requestReview{color:#46566b}
#requestReview table{color:#526278}
#requestReview dt{color:#637185}
.request-form-actions>span{color:#5f6e82}
.submission-notice,#newRequestDialog[data-step="review"] .submission-notice{color:#596c84}