:root{
  --bf-bg:#f4f7fb;
  --bf-surface:#ffffff;
  --bf-surface-soft:#f8fbff;
  --bf-line:#e6edf5;
  --bf-text:#172033;
  --bf-muted:#738197;
  --bf-primary:#2952cc;
  --bf-primary-dark:#1f45b8;
  --bf-success:#16a34a;
  --bf-warning:#f59e0b;
  --bf-danger:#ef4444;
  --bf-radius:20px;
  --bf-shadow:0 14px 40px rgba(15,23,42,.08);
}
*{box-sizing:border-box}
html,body{min-height:100%}
body.bf-body{
  margin:0;
  font-family:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:linear-gradient(180deg,#f8fbff 0%,#f1f5fb 100%);
  color:var(--bf-text);
}
a{text-decoration:none}
.bf-shell{display:flex;min-height:100vh}
.bf-sidebar{
  width:280px;flex:0 0 280px;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);
  border-right:1px solid var(--bf-line);padding:22px 16px;display:flex;flex-direction:column;gap:18px;
}
.bf-brand{display:flex;align-items:center;gap:14px;padding:4px 8px}
.bf-brand-mark{
  width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,var(--bf-primary),#5a7cff);
  display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:22px;box-shadow:0 10px 24px rgba(41,82,204,.25);
}
.bf-brand-title{font-weight:800;letter-spacing:-.03em;font-size:18px}
.bf-brand-subtitle{font-size:12px;color:var(--bf-muted)}
.bf-user{
  display:flex;align-items:center;gap:12px;background:var(--bf-surface-soft);border:1px solid var(--bf-line);
  border-radius:18px;padding:12px;
}
.bf-user-avatar{
  width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:#dbe6ff;color:var(--bf-primary);font-weight:800;
}
.bf-user-name{font-weight:700}
.bf-user-role{text-transform:capitalize;color:var(--bf-muted);font-size:13px}
.bf-nav{display:flex;flex-direction:column;gap:6px}
.bf-link{
  display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;color:#334155;
  font-weight:600;border:1px solid transparent;transition:.18s ease;
}
.bf-link:hover{background:#f5f8ff;border-color:#dde7ff;color:var(--bf-primary)}
.bf-link.is-active{background:linear-gradient(135deg,#eef3ff 0%,#e8f0ff 100%);color:var(--bf-primary);border-color:#d9e4ff}
.bf-main{flex:1;min-width:0;padding:24px 28px}
.bf-topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px}
.bf-eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.12em;font-weight:800;color:var(--bf-muted)}
.bf-page-title{font-size:28px;font-weight:800;letter-spacing:-.04em}
.bf-pill{
  display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;border:1px solid var(--bf-line);
  background:#fff;box-shadow:var(--bf-shadow);font-weight:700;color:#334155
}
.bf-content{max-width:1600px}
.card,.hr-card,.bf-panel{background:rgba(255,255,255,.96)!important;border:none!important;border-radius:var(--bf-radius)!important;box-shadow:var(--bf-shadow)!important}
.card-header{background:transparent!important;border-bottom:1px solid var(--bf-line)!important;padding:18px 22px!important;font-weight:800}
.card-body{padding:22px!important}
.table{--bs-table-bg:transparent;--bs-table-striped-bg:#f8fbff;--bs-table-hover-bg:#f4f8ff}
.table thead th{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--bf-muted);font-weight:800;border-bottom:1px solid var(--bf-line)!important;padding:16px 18px}
.table td{padding:15px 18px;border-color:#eef3f8;vertical-align:middle}
.form-control,.form-select{border-radius:14px;border:1px solid #d8e2ee;padding:.8rem .95rem}
.form-control:focus,.form-select:focus{border-color:#bad0ff;box-shadow:0 0 0 4px rgba(41,82,204,.11)}
.form-label{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--bf-muted)}
.btn{border-radius:14px;font-weight:700;padding:.78rem 1rem}
.btn-dark,.btn-primary{background:linear-gradient(135deg,var(--bf-primary),var(--bf-primary-dark));border-color:var(--bf-primary)}
.btn-outline-dark,.btn-outline-secondary{background:#fff;border-color:#d8e2ee;color:#334155}
.btn-outline-dark:hover,.btn-outline-secondary:hover{background:#f8fbff;border-color:#cdd7e5;color:var(--bf-primary)}
.alert{border:none;border-radius:16px;padding:14px 16px;box-shadow:var(--bf-shadow)}
.badge{border-radius:999px;padding:.55em .8em;font-weight:700}
.display-6{font-weight:800;letter-spacing:-.04em}
.text-muted{color:var(--bf-muted)!important}
.metric-card{display:flex;flex-direction:column;gap:8px}
.metric-label{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--bf-muted);font-weight:800}
.metric-value{font-size:34px;font-weight:800;letter-spacing:-.04em}
.metric-sub{color:var(--bf-muted);font-size:13px}
.section-title{font-size:22px;font-weight:800;letter-spacing:-.03em}
.quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.quick-link{display:flex;align-items:center;gap:12px;padding:16px;border-radius:18px;background:var(--bf-surface-soft);border:1px solid var(--bf-line);color:#334155;font-weight:700}
.quick-link i{font-size:18px;color:var(--bf-primary)}
.timeline-item{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid #eef3f8}
.timeline-dot{width:12px;height:12px;border-radius:50%;background:var(--bf-primary);margin-top:6px;flex:0 0 12px}
.kpi-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
@media (max-width: 1199px){.quick-grid,.kpi-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 991.98px){
  .bf-sidebar{position:fixed;left:0;top:0;bottom:0;z-index:1035;transform:translateX(-100%);transition:transform .2s ease}
  .bf-sidebar.is-open{transform:translateX(0)}
  body.bf-sidebar-open::before{content:"";position:fixed;inset:0;background:rgba(15,23,42,.35);z-index:1030}
  .bf-main{padding:18px}
}
@media (max-width: 767.98px){
  .quick-grid,.kpi-strip{grid-template-columns:1fr}
  .bf-page-title{font-size:22px}
  .card-body{padding:18px!important}
}
