/* Temu ERP — Deep Ocean Enterprise theme */
:root{
  --ink:#14213d;
  --muted:#64748b;
  --line:#dbe4f0;
  --bg:#f3f6fb;
  --nav:#071a35;
  --orange:#f97316;
  --green:#059669;
  --red:#dc2626;
  --amber:#d97706;
  --blue:#1d4ed8;
  --purple:#6d5dfc;
  --surface:#ffffff;
  --surface-soft:#f7f9fc;
  --nav-hover:#102d54;
  --nav-active:#164e8a;
  --shadow:0 8px 24px rgba(15,39,75,.07);
}

body{
  color:var(--ink);
  background:
    radial-gradient(circle at 86% -10%,rgba(37,99,235,.06),transparent 28rem),
    var(--bg);
  font-feature-settings:"tnum" 1;
}

.login-shell{
  background:
    radial-gradient(circle at 18% 16%,rgba(59,130,246,.28),transparent 32rem),
    radial-gradient(circle at 84% 82%,rgba(14,165,233,.16),transparent 28rem),
    linear-gradient(135deg,#06152d,#0b2b56 55%,#123f72);
}
.login-card{
  border:1px solid rgba(255,255,255,.7);
  border-radius:20px;
  box-shadow:0 30px 90px rgba(0,14,41,.38);
}
.brand-mark,.logo span{
  background:linear-gradient(145deg,#2563eb,#0ea5e9);
  box-shadow:0 8px 18px rgba(37,99,235,.25);
}
.login-card input,.login-card select{min-height:46px}

.app{grid-template-columns:264px 1fr}
aside{
  background:linear-gradient(180deg,#06172f 0%,#081d3a 58%,#07162b 100%);
  border-right:1px solid rgba(148,163,184,.12);
  padding:22px 16px;
  box-shadow:8px 0 28px rgba(6,23,47,.08);
}
.logo{padding:1px 8px 27px;font-size:19px}
.logo small{color:#8fa6c4}
.nav-group-title{color:#6380a4;margin-top:8px}
.nav-btn{
  color:#b9c9dd;
  min-height:44px;
  padding:11px 13px;
  border-radius:9px;
  transition:background .16s ease,color .16s ease,transform .16s ease;
}
.nav-btn:hover{background:var(--nav-hover);color:#fff;transform:translateX(2px)}
.nav-btn.active{
  background:linear-gradient(90deg,#174b82,#123b69);
  color:#fff;
  box-shadow:inset 3px 0 #60a5fa,0 8px 20px rgba(0,0,0,.12);
}
.ghost{border-color:#29496e;color:#c7d5e6}

header{
  height:78px;
  border-bottom:1px solid #dfe7f2;
  padding:0 30px;
  box-shadow:0 3px 16px rgba(15,39,75,.035);
}
header h2{font-size:22px;color:#102443}
.user-pill b{background:#e8f1ff;color:#1d4ed8;border:1px solid #cfe0fb}
#content{padding:24px 28px 38px}

.toolbar,.card,.kpi{
  border-color:#dce5f0;
  border-radius:13px;
  box-shadow:var(--shadow);
}
.toolbar{padding:17px 18px}
.card{padding:21px}
.kpi{padding:19px 18px;background:linear-gradient(180deg,#fff,#fbfdff)}
.kpi:before{width:4px;background:#94a3b8}
.kpi:nth-child(2):before{background:#0ea5e9}
.kpi:nth-child(3):before{background:#2563eb}
.kpi:nth-child(4):before{background:#6366f1}
.kpi:nth-child(5):before{background:#10b981}
.kpi span{color:#65758b;font-weight:650}
.kpi strong{color:#102443;letter-spacing:-.4px}
.section-head h3{color:#102443;font-size:17px}

input,select,textarea{
  border-color:#cbd8e8;
  border-radius:8px;
  min-height:41px;
  color:#14213d;
  transition:border-color .15s ease,box-shadow .15s ease;
}
input:focus,select:focus,textarea:focus{
  outline:none;
  border-color:#3b82f6;
  box-shadow:0 0 0 3px rgba(59,130,246,.13);
}
.primary{
  background:linear-gradient(135deg,#2563eb,#1d4ed8);
  border-radius:8px;
  box-shadow:0 7px 16px rgba(37,99,235,.22);
}
.primary:hover{filter:brightness(1.06)}
.secondary{border-color:#cbd8e8;color:#29425f}
.text-btn{color:#1d4ed8;font-weight:650}

table{font-size:12.5px}
th{
  background:#edf3fa;
  color:#42556e;
  border-bottom-color:#ccd9e8;
  padding:11px 10px;
  font-weight:800;
}
td{border-bottom-color:#e4eaf2;padding:11px 10px}
tbody tr:nth-child(even){background:#fbfcfe}
tbody tr:hover{background:#eef5ff}
.total-row,.review-autosum td{
  background:#eaf2ff!important;
  color:#173b6d;
  border-top:2px solid #3b82f6!important;
}
.derived{background:#f3f7fc}
.clickable-row:hover{background:#eaf3ff!important}
.inline-five-detail>td{background:#f2f6fb}
.inline-five-box{border-color:#cfdceb;box-shadow:inset 4px 0 #2563eb}

.welcome-banner,.executive-banner{
  background:
    radial-gradient(circle at 88% 15%,rgba(96,165,250,.23),transparent 18rem),
    linear-gradient(120deg,#071a35,#0d3765 58%,#13518c);
  border:1px solid rgba(96,165,250,.2);
  box-shadow:0 16px 34px rgba(7,26,53,.16);
}
.eyebrow{color:#7dd3fc}
.analysis-hero{background:linear-gradient(120deg,#071a35,#0e3b6b)}
.submit-ring{border-top-color:#38bdf8}
.tab.active,.chip.active{background:#164e8a;border-color:#164e8a}
.me-row{background:#eaf3ff!important;box-shadow:inset 3px 0 #2563eb}
.progress i{background:linear-gradient(90deg,#2563eb,#38bdf8)}
.persistent-workflow-alert{border-color:#f3c76a;border-left-color:#d97706;background:#fff9e9}
.admin-permission-card{border-top-color:#2563eb}
.permission-checklist label:has(input:checked),.checkbox-list label:has(input:checked){
  border-color:#60a5fa;
  background:#eff6ff;
}
.toast{background:#071a35;border:1px solid #24466f}

.status.draft{color:#92400e;background:#fef3c7}
.status.submitted{color:#1d4ed8;background:#dbeafe}
.status.approved{color:#047857;background:#d1fae5}
.status.returned{color:#b91c1c;background:#fee2e2}

@media(max-width:900px){
  .app{display:block}
  aside{width:min(86vw,320px)}
  header{
    min-height:68px;
    padding:9px 12px;
    background:rgba(255,255,255,.96);
    backdrop-filter:blur(12px);
  }
  .mobile-menu-btn{
    border-color:#cbd8e8;
    background:#edf4ff;
    color:#174b82;
  }
  #content{padding:12px 11px 92px}
  .grid-kpi{gap:9px}
  .kpi{min-height:101px;padding:14px 12px}
  .card{padding:14px;border-radius:11px}
  .toolbar{padding:12px}
  .actions{
    bottom:10px;
    border-color:#cbd8e8;
    background:rgba(255,255,255,.96);
    box-shadow:0 12px 30px rgba(15,39,75,.18);
    backdrop-filter:blur(12px);
  }
  .table-wrap th:first-child{background:#edf3fa}
}

@media(max-width:560px){
  header h2{font-size:17px}
  .grid-kpi,.compact-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kpi strong{font-size:18px}
  .kpi em{font-size:10px}
  .toolbar{grid-template-columns:1fr 1fr}
  .welcome-banner,.executive-banner{padding:18px}
}

/* A sample layout: information architecture, not only a palette swap */
.enterprise-header-tools{display:flex;align-items:center;gap:7px;margin-left:auto;padding-right:12px;border-right:1px solid var(--line)}
.enterprise-header-tools button{position:relative;width:38px;height:38px;border:0;border-radius:9px;background:transparent;color:#18314f;font-size:21px;cursor:pointer}
.enterprise-header-tools button:hover{background:#edf4ff;color:#1d4ed8}
.enterprise-header-tools i{position:absolute;right:0;top:-2px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:#2563eb;color:white;font:700 10px/18px Inter,sans-serif}
.enterprise-a-content{max-width:none!important}
.a-overview-heading{min-height:0;padding:3px 2px 13px!important;margin:0 0 4px!important;border:0!important;border-radius:0!important;color:var(--ink)!important;background:transparent!important;box-shadow:none!important}
.a-overview-heading .eyebrow{display:none}
.a-overview-heading h2{margin:0 0 5px!important;font-size:19px!important;color:#102443}
.a-overview-heading p{color:var(--muted)!important}
.a-overview-heading .submit-ring{width:auto;height:auto;border:0;border-radius:10px;padding:9px 15px;background:#edf4ff;color:#174b82}
.a-overview-heading .submit-ring span{margin:0;color:#64748b}
.a-overview-heading .primary{align-self:center}
.a-section-card{overflow:hidden}
.a-section-card>.section-head{margin:-21px -21px 15px;padding:16px 18px 13px;border-bottom:1px solid var(--line);background:#fff}
.a-filter-panel{border:1px solid var(--line);box-shadow:none;background:#fff}
.a-primary-metrics{grid-template-columns:repeat(4,minmax(180px,1fr))}
.a-primary-metrics .kpi{min-height:150px;padding:20px 20px 46px}
.kpi-sparkline{position:absolute;left:18px;right:18px;bottom:12px;width:calc(100% - 36px);height:27px;opacity:.96}
.kpi-sparkline polyline{fill:none;stroke:#1769ff;stroke-width:1.7;vector-effect:non-scaling-stroke}
.kpi:nth-child(2n) .kpi-sparkline polyline{stroke:#0ea5e9}
.kpi:nth-child(3n) .kpi-sparkline polyline{stroke:#2563eb}
.kpi:before{display:none}
.kpi strong{font-size:28px;margin-top:12px}
.grid-kpi:not(.a-primary-metrics) .kpi{min-height:123px;padding-bottom:42px}
.grid-kpi:not(.a-primary-metrics) .kpi strong{font-size:22px}
.split{grid-template-columns:minmax(0,2fr) minmax(280px,1fr)}
.ranking-table th,.ranking-table td{height:46px}
.tabs{padding:5px;border:1px solid var(--line);border-radius:10px;background:#fff;width:max-content;max-width:100%}
.tab{border:0}
.summary-list dl{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.summary-list dl div{display:block;padding:17px;background:#fff}
.summary-list dd{font-size:20px;margin-top:8px}

@media(max-width:1100px){.a-primary-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){
  .enterprise-header-tools{display:none}
  .a-section-card>.section-head{margin:-14px -14px 13px;padding:14px}
  .a-primary-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .a-primary-metrics .kpi{min-height:120px;padding:14px 12px 38px}
  .kpi strong,.a-primary-metrics .kpi strong{font-size:20px}
  .split{grid-template-columns:1fr}
  .summary-list dl{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .a-overview-heading{display:block!important}
  .a-overview-heading h2{font-size:18px!important}
  .a-overview-heading .primary{width:100%;margin-top:12px}
  .a-primary-metrics .kpi{min-height:115px}
  .kpi-sparkline{left:11px;width:calc(100% - 22px)}
  .summary-list dl{grid-template-columns:1fr 1fr}
}

/* Explicit A dashboard and employee workspace */
.a-page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:14px}
.a-page-heading>div:first-child>span{font-size:10px;font-weight:900;letter-spacing:1.4px;color:#2563eb}
.a-page-heading h2{margin:4px 0;font-size:21px;color:#102443}
.a-page-heading p{margin:0;color:var(--muted);font-size:12px}
.a-date-actions{display:flex;align-items:center;gap:14px}.a-date-actions input{width:155px}
.a-core-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:14px}
.a-metric{position:relative;min-height:190px;padding:21px 21px 51px;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:var(--shadow)}
.a-metric-top{display:flex;justify-content:space-between;color:#334155;font-weight:800}.a-metric-top small{color:#94a3b8;font-weight:600}
.a-metric strong{display:block;margin:20px 0 8px;color:#102443;font-size:31px;letter-spacing:-.7px}.a-metric em{font-size:12px;font-style:normal;color:#059669}
.a-metric svg{position:absolute;left:20px;right:20px;bottom:15px;width:calc(100% - 40px);height:32px}.a-metric polyline{fill:none;stroke:#1769ff;stroke-width:2;vector-effect:non-scaling-stroke}
.a-metric.negative strong,.a-metric.negative em{color:#dc2626}.a-metric.negative polyline{stroke:#ef4444}
.a-details{padding:0!important;margin-bottom:14px}.a-details summary{display:flex;justify-content:space-between;padding:15px 18px;cursor:pointer;font-weight:800;color:#17345b;list-style:none}.a-details summary span{font-size:12px;color:#2563eb}
.a-details[open] summary{border-bottom:1px solid var(--line)}.a-detail-grid{display:grid;grid-template-columns:repeat(7,minmax(120px,1fr));gap:0;padding:0 8px 8px}
.a-detail-metric{padding:14px 12px;border-right:1px solid #e7edf5;border-bottom:1px solid #e7edf5}.a-detail-metric span{display:block;color:#64748b;font-size:11px}.a-detail-metric b{display:block;margin-top:7px;color:#17345b;font-size:16px}.a-detail-metric.good b{color:#059669}.a-detail-metric.danger b{color:#dc2626}
.a-dashboard-grid{display:grid;grid-template-columns:minmax(460px,1.18fr) minmax(430px,1fr) minmax(250px,.56fr);gap:14px}
.a-employee-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(300px,1fr);gap:14px}
.a-dashboard-grid>.card,.a-employee-grid>.card{margin:0;min-width:0}.a-dashboard-grid .section-head,.a-employee-grid .section-head{padding-bottom:13px;border-bottom:1px solid var(--line)}
.a-panel-filter{display:flex;justify-content:space-between;align-items:center;margin:-5px 0 8px;color:#64748b;font-size:12px}
.a-ranking th,.a-ranking td{padding:9px 8px}.a-ranking td{height:44px}
.a-trend-chart{display:flex;align-items:end;gap:13px;height:250px;padding:35px 5px 0;border-bottom:1px solid var(--line);background:repeating-linear-gradient(to top,transparent 0,transparent 49px,#edf1f6 50px)}
.a-trend-col{position:relative;display:flex;flex:1;height:205px;align-items:center;justify-content:end;flex-direction:column}.a-trend-col b{font-size:9px;color:#50647c;white-space:nowrap}.a-trend-col i{display:block;width:min(32px,70%);min-height:6px;margin:5px 0;background:linear-gradient(#3b82f6,#1769ff);border-radius:4px 4px 0 0}.a-trend-col i.negative{background:linear-gradient(#fb7185,#dc2626)}.a-trend-col span{font-size:10px;color:#64748b}
.a-chart-summary{display:grid;grid-template-columns:1fr 1fr;margin-top:14px}.a-chart-summary>div{padding:8px 15px;border-right:1px solid var(--line)}.a-chart-summary span{display:block;color:#64748b;font-size:11px}.a-chart-summary b{display:block;margin-top:6px;font-size:19px}
.a-reminder-list{display:grid;gap:9px}.a-reminder-list button{display:flex;align-items:center;gap:10px;width:100%;padding:12px 10px;border:1px solid var(--line);border-radius:10px;background:#fff;text-align:left;cursor:pointer}.a-reminder-list button:hover{background:#f5f9ff;border-color:#b8cdf0}.a-reminder-list i{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;font-style:normal;font-weight:900}.a-reminder-list i.danger{background:#fee2e2}.a-reminder-list i.warning{background:#ffedd5;color:#d97706}.a-reminder-list i.purple{background:#ede9fe;color:#7c3aed}.a-reminder-list i.blue{background:#dbeafe;color:#2563eb}.a-reminder-list span{min-width:0;flex:1}.a-reminder-list b,.a-reminder-list small{display:block}.a-reminder-list small{margin-top:3px;color:#94a3b8}.a-reminder-list strong{color:#94a3b8;font-size:20px}
.a-ratio-list{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:15px}.a-ratio-list>div{padding:13px;border:1px solid var(--line);border-radius:9px;background:#f8fbff}.a-ratio-list span{display:block;font-size:11px;color:#64748b}.a-ratio-list b{display:block;margin-top:5px;font-size:18px;color:#17345b}
.a-employee-link{display:block;border:0;background:transparent;padding:0;color:#123d70;text-align:left;cursor:pointer;font-weight:800}.a-employee-link:hover{color:#1769ff}.a-employee-link small{display:block;margin-top:3px;color:#6b86a6;font-size:9px;font-weight:650}

@media(max-width:1380px){.a-dashboard-grid{grid-template-columns:1fr 1fr}.a-reminder-panel{grid-column:1/-1}.a-reminder-list{grid-template-columns:repeat(4,1fr)}.a-detail-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:1000px){.a-core-grid{grid-template-columns:repeat(2,1fr)}.a-dashboard-grid,.a-employee-grid{grid-template-columns:1fr}.a-reminder-list{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.a-page-heading{display:block}.a-date-actions{margin-top:12px;display:grid;grid-template-columns:1fr}.a-date-actions input,.a-date-actions button{width:100%}.a-core-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.a-metric{min-height:145px;padding:14px 12px 39px}.a-metric strong{font-size:20px;margin:13px 0 6px}.a-metric-top small{display:none}.a-metric svg{left:11px;bottom:9px;width:calc(100% - 22px);height:24px}.a-detail-grid{grid-template-columns:repeat(2,1fr)}.a-reminder-list{grid-template-columns:1fr}.a-trend-chart{height:220px;gap:6px;overflow-x:auto}.a-trend-col{min-width:42px}.a-chart-summary{grid-template-columns:1fr}.a-ratio-list{grid-template-columns:1fr 1fr}}