:root{
  --bg:#060B1A;
  --panel:#0A1226;
  --text:#E8EEF7;
  --muted:#A9B4C7;
  --border:rgba(255,255,255,.08);
  --accent:#2D6BFF;
  --warn:#FFCC66;
}
html,body{height:100%;}
body{
  margin:0;
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial;
  background: radial-gradient(1200px 700px at 50% 80%, rgba(45,107,255,.18), transparent 60%),
              radial-gradient(900px 500px at 20% 20%, rgba(54,211,153,.10), transparent 55%),
              var(--bg);
  color:var(--text);
}
a{color:#9DB7FF;text-decoration:none}
a:hover{text-decoration:underline}
.sidebar{
  position:fixed; top:0; left:0; bottom:0;
  width:280px; padding:22px 16px;
  background: linear-gradient(180deg, rgba(10,18,38,.92), rgba(6,11,26,.94));
  border-right:1px solid var(--border);
}
.brand{display:flex; gap:12px; align-items:center; margin-bottom:18px;}
.brand .title{font-weight:700;}
.menu h6{font-size:12px;color:var(--muted);margin:18px 10px 10px;text-transform:uppercase;letter-spacing:.12em}
.menu a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;color:var(--text);opacity:.92;}
.menu a.active,.menu a:hover{background:rgba(45,107,255,.10);}
.content{margin-left:280px;padding:26px 26px 60px;}
.cardx{background:rgba(10,18,38,.75);border:1px solid var(--border);border-radius:18px;box-shadow:0 12px 40px rgba(0,0,0,.25);}
.cardx .card-header{padding:16px 18px;border-bottom:1px solid var(--border);}
.cardx .card-body{padding:18px}
.btn-primary{background:var(--accent);border-color:var(--accent);border-radius:999px;padding:10px 16px;}
.btn-outline-light{border-radius:999px;}
.table{color:var(--text);}
.table thead th{color:var(--muted);border-bottom:1px solid var(--border);}
.table td,.table th{border-top:1px solid var(--border);vertical-align:middle;}
.badge{border-radius:999px;padding:.38rem .6rem;}
.badge.bg-soft{background:rgba(45,107,255,.12);border:1px solid rgba(45,107,255,.22);color:#BFD1FF;}
.input-dark,.form-control,.form-select{background:rgba(7,12,26,.65)!important;border:1px solid var(--border)!important;color:var(--text)!important;border-radius:12px!important;}
.form-control::placeholder{color:rgba(169,180,199,.65)}
.kpi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.kpi .tile{padding:14px 16px}
.kpi .label{color:var(--muted);font-size:12px;letter-spacing:.04em}
.kpi .value{font-size:26px;font-weight:800}
.footer-note{color:rgba(169,180,199,.7);font-size:12px}
@media (max-width: 992px){.sidebar{position:static;width:auto;border-right:none}.content{margin-left:0}.kpi{grid-template-columns:1fr}}


/* Icons in sidebar */
.menu a{display:flex; align-items:center; gap:.35rem;}
.menu a i{opacity:.9;}
@media (max-width: 992px){
  .sidebar .brand{justify-content:flex-start;}
  .menu{display:flex; flex-wrap:wrap; gap:8px;}
  .menu h6{flex-basis:100%; margin-top:10px;}
  .menu a{flex:1 1 auto; min-width:160px;}
}


/* Dark-mode legibility */
.text-muted, .form-text{
  color: rgba(232,238,247,.72) !important;
}

/* Import layout (prevents button overlap) */
.import-grid{
  display:grid;
  grid-template-columns: 1.45fr .55fr;
  gap:14px;
  align-items:start;
}
.import-side .cardx{position:sticky; top:16px;}
@media (max-width: 992px){
  .import-grid{grid-template-columns:1fr;}
  .import-side .cardx{position:static;}
}

/* Slightly tighter buttons on tables */
.table .btn{padding:6px 10px;}


/* --- Accessibility / Contrast fixes --- */
.text-muted, .form-text, .form-check-label, .form-label {
  color: rgba(232,238,247,.78) !important;
}
.table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--text);
  --bs-table-border-color: var(--border);
  --bs-table-striped-bg: rgba(255,255,255,.03);
  --bs-table-hover-bg: rgba(45,107,255,.08);
  color: var(--text) !important;
}
.table thead th { color: rgba(232,238,247,.72) !important; }
.table td, .table th { border-top: 1px solid var(--border) !important; }
.btn-outline-light { color: var(--text) !important; border-color: rgba(232,238,247,.22) !important; }
.btn-outline-light:hover { border-color: rgba(232,238,247,.35) !important; }

.btn-icon {
  width: 38px; height: 38px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px;
}

.import-grid {
  display: grid;
  grid-template-columns: 1fr minmax(260px, 420px);
  gap: 18px;
  align-items: start;
}
@media (max-width: 1100px){
  .import-grid { grid-template-columns: 1fr; }
}
.import-side { display:flex; flex-direction: column; gap: 10px; }
.import-cta { position: sticky; top: 18px; }
@media (max-width: 1100px){
  .import-cta { position: static; }
}
