:root{--bg:#f5f7fb;--panel:#ffffff;--ink:#172033;--muted:#6b7280;--line:#e7ebf3;--brand:#123f7a;--brand2:#2964b8;--soft:#eef4ff}
body{background:var(--bg);color:var(--ink)}
.topbar{background:linear-gradient(135deg,var(--brand),var(--brand2));box-shadow:0 8px 30px rgba(10,30,70,.18)}
.navbar-dark .navbar-nav .nav-link{padding:.55rem .8rem;border-radius:.8rem;color:#dce7ff}
.navbar-dark .navbar-nav .nav-link.active,.navbar-dark .navbar-nav .nav-link:hover{background:rgba(255,255,255,.14);color:#fff}
.main-wrap{min-height:calc(100vh - 64px)}
.sidebar{width:260px;background:#fff;border-right:1px solid var(--line)}
.sidebar-title{letter-spacing:.12em;color:var(--muted);font-weight:700}
.sidebar-link{border-radius:.8rem;color:#334155;padding:.75rem .85rem}
.sidebar-link.active,.sidebar-link:hover{background:var(--soft);color:var(--brand);font-weight:600}
.content{flex:1;min-width:0}.page-head{gap:1rem}.breadcrumbs{letter-spacing:.02em}.card-elev,.metric-card,.detail-hero{background:var(--panel);border:1px solid var(--line);border-radius:1.2rem;box-shadow:0 14px 34px rgba(15,23,42,.05)}
.metric-card{padding:1.1rem 1.2rem;display:flex;flex-direction:column;gap:.2rem;min-height:120px}.metric-card span,.eyebrow{font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:700}.metric-card strong{font-size:1.7rem;line-height:1.1}.metric-card small{color:var(--muted)}
.detail-hero{padding:1.3rem 1.4rem;display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem}.detail-hero h2{margin:0;font-size:1.55rem}.hero-meta{color:var(--muted);margin-top:.35rem}
.card-header{background:#fff;border-bottom:1px solid var(--line);padding:1rem 1.2rem;font-weight:700;border-radius:1.2rem 1.2rem 0 0}.card-body{padding:1.15rem 1.2rem}
.table> :not(caption)>*>*{padding:.85rem .9rem;border-color:var(--line)} .table thead th{font-size:.79rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700;background:#fbfcfe}
.badge{padding:.5rem .7rem;font-weight:600}.approval-step,.stat-pair,.mini-stat{display:flex;justify-content:space-between;align-items:center;padding:.7rem .1rem;border-bottom:1px dashed var(--line)}.approval-step:last-child,.stat-pair:last-child,.mini-stat:last-child{border-bottom:0}.stat-pair span,.mini-stat span{color:var(--muted)}
.notif-dot{position:absolute;top:-6px;right:-10px;background:#ef4444;border-radius:999px;padding:.1rem .35rem;font-size:.7rem;line-height:1;color:#fff}.login-shell{background:radial-gradient(circle at top left,#dbeafe,#f8fbff 45%,#eef2ff)}.login-card{width:min(460px,92vw);border-radius:1.4rem}.brand-badge{width:62px;height:62px;border-radius:18px;margin:0 auto;background:linear-gradient(135deg,var(--brand),var(--brand2));display:grid;place-items:center;color:#fff;font-weight:800;font-size:1.2rem;box-shadow:0 16px 40px rgba(18,63,122,.28)}
.btn{border-radius:.85rem}.btn-primary{background:linear-gradient(135deg,var(--brand),var(--brand2));border:none}.btn-primary:hover{filter:brightness(1.05)} .form-control,.form-select{border-radius:.85rem;padding:.72rem .85rem;border-color:#d9e1ef}.form-control:focus,.form-select:focus{box-shadow:0 0 0 .2rem rgba(41,100,184,.12);border-color:#8eb1e6}
.mini-stats{background:#f8fafc;border:1px solid var(--line);border-radius:1rem;padding:.6rem 1rem}.quick-actions .btn{white-space:nowrap}
@media (max-width: 992px){.sidebar{display:none}.content{padding:1rem!important}.navbar-nav{display:none!important}}
.chip{display:inline-flex;align-items:center;padding:.25rem .55rem;border-radius:999px;background:#eef2f7;color:#516072;font-size:.72rem;font-weight:700;margin-right:.25rem}.chip-good{background:#e9f8ef;color:#157347}.chip-warn{background:#fff3cd;color:#8a6d3b}.timeline-item{padding:.7rem 0;border-bottom:1px dashed var(--line)}.timeline-item:last-child{border-bottom:0}.table .btn-sm{padding:.35rem .6rem}.card-elev .table-responsive{border-radius:0 0 1.2rem 1.2rem}.form-check-input{margin-top:.3rem}

/* v9 integrated enhancements */
@media (max-width: 768px){
  .app-shell .sidebar{position:static;width:100%;height:auto}
  .app-shell .content{margin-left:0}
  .table{font-size:.92rem}
  .card-elev{border-radius:18px}
}
.code-chip{font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace; background:#f8f9fa; padding:.15rem .45rem; border-radius:.5rem;}
.metric-soft{background:linear-gradient(135deg,#fff7e6,#ffffff); border:1px solid #f1e4b8;}

.sidebar{transition:all .2s ease}.analytics-grid canvas{max-height:320px}.card-elev .display-6{font-weight:700}.detail-hero{background:linear-gradient(135deg,#ffffff,#f8fbff)}.chart-tile{min-height:360px}.table thead th{position:sticky;top:0;z-index:1}.kpi-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.filter-chip{display:inline-block;padding:.35rem .65rem;background:#eef4ff;border-radius:999px;font-size:.78rem;font-weight:700;color:#214f91} @media(max-width:768px){.kpi-strip{grid-template-columns:repeat(2,1fr)} .detail-hero{padding:1rem}.page-head{flex-direction:column;align-items:flex-start!important}}

/* v10 executive intelligence */
.eyebrow{display:inline-block;padding:.28rem .6rem;border-radius:999px;background:#eef4ff;color:#214f91;margin-bottom:.55rem}
.card-elev canvas{min-height:260px}
.page-head h1{font-weight:800;letter-spacing:-.02em}
.card-elev .card-header{display:flex;justify-content:space-between;align-items:center}
.metric-card{position:relative;overflow:hidden}.metric-card:after{content:"";position:absolute;inset:auto -40px -40px auto;width:120px;height:120px;background:radial-gradient(circle,rgba(41,100,184,.08),transparent 60%)}
.table-responsive{max-height:none}


body.theme-dark .sidebar{background:#0f172a;border-right-color:var(--line)}
body.theme-dark .sidebar-link{color:#cbd5e1}
body.theme-dark .sidebar-link.active,body.theme-dark .sidebar-link:hover{background:rgba(255,255,255,.08);color:#fff}
body.theme-dark .card-header{background:#111827}
body.theme-dark .table thead th{background:#0b1220;color:#cbd5e1}
body.theme-dark .table,body.theme-dark .table td,body.theme-dark .table th{color:var(--ink)}
body.theme-dark .mini-stats{background:#0b1220}
body.theme-dark .dropdown-menu{background:#111827;border-color:var(--line)}
body.theme-dark .dropdown-item,body.theme-dark .dropdown-item-text{color:#e5eefc}
body.theme-dark .dropdown-divider{border-top-color:var(--line)}
body.density-compact .table>:not(caption)>*>*{padding:.55rem .65rem}
body.density-compact .card-body{padding:.9rem 1rem}
body.density-compact .metric-card{min-height:96px;padding:.9rem 1rem}

/* V21.1 PO print/export support */
@media print {
  .topbar,.sidebar,.page-head,.quick-actions,.no-print,.mini-stats { display:none !important; }
  .content { padding:0 !important; width:100% !important; }
  .main-wrap { display:block !important; }
  .print-po { box-shadow:none !important; border:0 !important; }
  body { background:#fff !important; }
}

/* V21.2 profile/preferences, validation and responsive shell */
.mobile-menu-btn{position:fixed;z-index:1030;left:1rem;bottom:1rem;border-radius:999px;box-shadow:0 12px 30px rgba(0,0,0,.18)}
.is-invalid{border-color:#dc3545!important;box-shadow:0 0 0 .15rem rgba(220,53,69,.12)!important}
.form-label{font-weight:700;color:var(--ink)}
.dropdown-menu .dropdown-item i{color:var(--brand2)}
@media(max-width:991.98px){
  .topbar{position:sticky;top:0;z-index:1020;flex-wrap:wrap;gap:.5rem}.topbar .navbar-nav{overflow-x:auto;max-width:100%;white-space:nowrap}.topbar .d-flex.align-items-center{margin-left:auto}.main-wrap{display:block!important}.sidebar{display:none!important}.content{padding:1rem!important;width:100%}.page-head{gap:.75rem}.quick-actions{width:100%}.card-body{padding:1rem}.table-responsive{overflow-x:auto}.table{min-width:720px}.kpi-strip{grid-template-columns:1fr 1fr}.row.g-3>[class*="col-"]{margin-bottom:.25rem}
}
@media(max-width:575.98px){
  .navbar-brand{font-size:1rem}.topbar .nav-link{font-size:.82rem;padding:.35rem .45rem}.content{padding:.85rem!important}.page-head h1{font-size:1.35rem}.kpi-strip{grid-template-columns:1fr}.metric-card,.card-elev{border-radius:14px}.btn{white-space:normal}.table{font-size:.82rem}.dropdown-menu{max-width:95vw}
}

/* =========================================================
   V21.5 Enterprise Product Experience Polish
   ========================================================= */
:root{--radius-xl:22px;--shadow-soft:0 18px 55px rgba(15,23,42,.10);--shadow-card:0 10px 30px rgba(15,23,42,.08)}
body{letter-spacing:.005em;background:radial-gradient(circle at top left, color-mix(in srgb,var(--soft) 55%,transparent), transparent 38%),var(--bg);}
.app-shell{min-height:100vh}.topbar{background:linear-gradient(135deg,var(--brand),var(--brand2));box-shadow:0 10px 28px rgba(15,23,42,.22);backdrop-filter:blur(16px)}
.navbar-brand{letter-spacing:.02em}.topbar .nav-link{border-radius:999px;padding:.42rem .72rem;transition:.18s ease}.topbar .nav-link:hover,.topbar .nav-link.active{background:rgba(255,255,255,.16);color:#fff!important}.btn-warning-soft{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.25);color:#fff}.btn-warning-soft:hover{background:#fff;color:var(--brand)}
.global-search-mini{position:relative;align-items:center;min-width:330px;max-width:420px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);border-radius:999px;padding:.15rem .65rem;color:#fff}.global-search-mini i{opacity:.9}.global-search-mini .form-control{background:transparent;border:0;color:#fff;box-shadow:none}.global-search-mini .form-control::placeholder{color:rgba(255,255,255,.75)}
.sidebar{position:sticky;top:68px;align-self:flex-start;min-height:calc(100vh - 68px);background:linear-gradient(180deg,var(--panel),color-mix(in srgb,var(--panel) 86%,var(--soft)));border-right:1px solid var(--line);box-shadow:8px 0 28px rgba(15,23,42,.05)}.sidebar-title{color:var(--muted);font-weight:800;letter-spacing:.12em}.sidebar-link{border-radius:14px;color:var(--ink);padding:.65rem .75rem;transition:all .18s ease}.sidebar-link:hover{background:var(--soft);transform:translateX(2px)}.sidebar-link.active{background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;box-shadow:0 10px 24px color-mix(in srgb,var(--brand) 24%,transparent)}
.content{background:transparent}.page-head{background:rgba(255,255,255,.52);border:1px solid rgba(255,255,255,.55);border-radius:var(--radius-xl);padding:1.1rem 1.25rem;box-shadow:var(--shadow-card);backdrop-filter:blur(14px)}.theme-dark .page-head{background:rgba(17,24,39,.65);border-color:var(--line)}.breadcrumbs{text-transform:uppercase;letter-spacing:.12em;font-weight:700}.card-elev{border:1px solid color-mix(in srgb,var(--line) 80%,transparent);border-radius:var(--radius-xl);box-shadow:var(--shadow-card);overflow:hidden;background:var(--panel)}.card-elev .card-header{background:linear-gradient(180deg,color-mix(in srgb,var(--soft) 78%,var(--panel)),var(--panel));border-bottom:1px solid var(--line);font-weight:800;color:var(--ink)}
.metric-card{border-radius:var(--radius-xl);background:linear-gradient(145deg,var(--panel),color-mix(in srgb,var(--soft) 55%,var(--panel)));border:1px solid var(--line);box-shadow:var(--shadow-card);padding:1.1rem}.metric-card span{display:block;color:var(--muted);font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;font-weight:800}.metric-card strong{font-size:2rem;line-height:1.1}.metric-card.glossy{position:relative;overflow:hidden}.metric-card.glossy:before{content:"";position:absolute;inset:-30% -10% auto auto;width:140px;height:140px;background:radial-gradient(circle,rgba(255,255,255,.5),transparent 62%);transform:rotate(25deg)}.metric-card.danger{--soft:#fff1f2}.metric-card.success{--soft:#ecfdf5}
.experience-hero{border-radius:28px;padding:1.5rem 1.65rem;background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;box-shadow:0 18px 55px color-mix(in srgb,var(--brand) 35%,transparent);display:flex;justify-content:space-between;gap:1rem;align-items:center}.experience-hero h2{font-size:2rem;margin:0}.experience-hero p{margin:.25rem 0 0;color:rgba(255,255,255,.82)}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.75rem;font-weight:900;color:color-mix(in srgb,#fff 72%,var(--soft))}.hero-actions{display:flex;gap:.55rem;flex-wrap:wrap}.command-card{min-height:320px}.empty-state{text-align:center;padding:2rem 1rem;color:var(--muted)}.empty-state h5{color:var(--ink);font-weight:800}.empty-icon{width:54px;height:54px;border-radius:18px;background:var(--soft);color:var(--brand);display:grid;place-items:center;margin:0 auto .8rem;font-size:1.5rem}.search-result-card{display:block;height:100%;padding:1.15rem;border-radius:20px;background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow-card);text-decoration:none;color:var(--ink);transition:.18s ease}.search-result-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-soft)}.search-result-card p{color:var(--muted);margin:0}.search-page{position:sticky;top:78px;z-index:5}.table{--bs-table-bg:transparent}.table thead th{position:sticky;top:0;z-index:2;background:color-mix(in srgb,var(--panel) 92%,var(--soft));font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);border-bottom:1px solid var(--line)}.table tbody tr{transition:background .14s ease}.table tbody tr:hover{background:color-mix(in srgb,var(--soft) 48%,transparent)}.badge{font-weight:750}.form-control,.form-select{border-radius:14px;border-color:var(--line);padding:.66rem .78rem}.form-control:focus,.form-select:focus{border-color:var(--brand2);box-shadow:0 0 0 .2rem color-mix(in srgb,var(--brand2) 18%,transparent)}.btn{border-radius:14px;font-weight:700}.btn-sm{border-radius:11px}.alert{border-radius:18px;border:0;box-shadow:var(--shadow-card)}
.theme-dark .card-elev,.theme-dark .metric-card,.theme-dark .search-result-card{background:#111827;color:var(--ink)}.theme-dark .table thead th{background:#111827}.theme-dark .list-group-item{background:#111827;color:var(--ink);border-color:var(--line)}.theme-dark .form-control,.theme-dark .form-select{background:#0f172a;color:var(--ink);border-color:var(--line)}
@media(max-width:991.98px){.experience-hero{display:block}.hero-actions{margin-top:1rem}.global-search-mini{display:none!important}.page-head{display:block!important}.sidebar{display:none!important}.main-wrap{display:block!important}.content{padding:1rem!important}.table{min-width:760px}.card-elev{border-radius:18px}}
@media(max-width:575.98px){.experience-hero{padding:1.2rem;border-radius:20px}.experience-hero h2{font-size:1.45rem}.metric-card strong{font-size:1.55rem}.page-head{padding:1rem}.quick-actions .btn{width:100%}.table-responsive{border-radius:16px}.search-page{position:static}}
@media print{.topbar,.sidebar,.mobile-menu-btn,.quick-actions,.no-print,.offcanvas{display:none!important}.content{padding:0!important}.page-head{box-shadow:none;border:0}.card-elev{box-shadow:none;border:1px solid #ddd}.print-po{box-shadow:none!important;border:0!important}.table thead th{position:static;background:#f3f4f6!important;color:#111!important}}