/* ===== KopDes Soft Red (SB Admin 2 facelift) ===== */
:root{
  --kp-bg: #fafafa;
  --kp-surface: #ffffff;
  --kp-border: #e5e7eb;
  --kp-muted: #6b7280;
  --kp-text: #111827;

  --kp-primary-700:#b91c1c;
  --kp-primary-600:#dc2626;
  --kp-primary-500:#ef4444;
  --kp-primary-100:#fee2e2;
  --kp-primary-50:#fef2f2;

  --kp-success:#10b981;  /* opsional */
  --kp-warning:#f59e0b;
  --kp-danger:#ef4444;
  --kp-info:#0ea5e9;

  --kp-radius: 1rem; /* 16px */
  --kp-shadow: 0 6px 18px rgba(17,24,39,.06);
}

html, body{
  background: var(--kp-bg);
  color: var(--kp-text);
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji", sans-serif;
}

/* Cards & tables */
.card{
  border: 1px solid var(--kp-border) !important;
  border-radius: var(--kp-radius) !important;
  box-shadow: var(--kp-shadow);
}
.table thead th{
  background: var(--kp-primary-50);
  border-bottom: 1px solid var(--kp-border);
}

/* Buttons (override Bootstrap primary) */
.btn-primary, .progress-bar,
.btn-primary:disabled,
.btn-primary.disabled{
  background: var(--kp-primary-600);
  border-color: var(--kp-primary-600);
}
.btn-primary:hover{ 
  background: var(--kp-primary-700); 
  border-color: var(--kp-primary-700); }
.btn-outline-primary{
  color: var(--kp-primary-600);
  border-color: var(--kp-primary-600);}
.btn-outline-primary:hover{
  background: var(--kp-primary-600);
  color: #fff;
}

/* Links, badges */
a{ color: var(--kp-primary-700); }
a:hover{ color: var(--kp-primary-600); text-decoration: none; }
.badge-primary{ background: var(--kp-primary-600); }
.badge-warning{ background: var(--kp-warning); }
.badge-danger{ background: var(--kp-danger); }
.badge-success{ background: var(--kp-success); }

/* Forms */
.form-control, .custom-select{
  border-radius: .75rem;
  border-color: var(--kp-border);
}
.form-control:focus{
  box-shadow: 0 0 0 .2rem rgba(220,38,38,.15);
  border-color: var(--kp-primary-600);
}

/* default (biarkan saja) */
.topbar, .navbar{
  background: var(--kp-surface);
  border-bottom: 1px solid var(--kp-border);
}
.topbar .nav-item .nav-link, .navbar .nav-link{ color: var(--kp-text); }
.topbar .dropdown-menu{
  border: 1px solid var(--kp-border);
  border-radius: .75rem;
  box-shadow: var(--kp-shadow);
}

/* override untuk topbar dengan background bendera */
.navbar.custom-topbar { background: #ED1C24 !important; }

/* Sidebar */
#accordionSidebar{
  background: var(--kp-surface) !important;
  background-image: none !important; /* disable sbadmin2 gradient */
  border-right: 1px solid var(--kp-border);
}
.sidebar .sidebar-brand{
  height: 4rem;
  font-weight: 700;
  letter-spacing: .4px;
  color: var(--kp-primary-700) !important;
}
.sidebar .nav-item .nav-link{
  color: #374151;
  padding: .65rem .95rem;
  border-radius: .75rem;
  margin: .2rem .5rem;
}
.sidebar .nav-item.active > .nav-link,
.sidebar .nav-item .nav-link:hover{
  background: var(--kp-primary-50);
  color: var(--kp-primary-700);
}
.sidebar .nav-item .collapse .collapse-inner{
  border-radius: .75rem;
  background: #fff;
  border: 1px solid var(--kp-border);
}

/* Footer */
footer.sticky-footer{
  background: var(--kp-surface);
  border-top: 1px solid var(--kp-border);
}

/* Utilities */
.rounded-2xl{ border-radius: 1rem !important; }
.text-muted{ color: var(--kp-muted) !important; }

/* Optional: dark mode via data-theme="dark" on <html> */
html[data-theme="dark"]{
  --kp-bg:#0b0b0c; --kp-surface:#111214; --kp-border:#1f2124; --kp-text:#f3f4f6; --kp-muted:#9ca3af;
}
html[data-theme="dark"] .topbar, html[data-theme="dark"] .navbar,
html[data-theme="dark"] #accordionSidebar, html[data-theme="dark"] footer.sticky-footer{
  background: var(--kp-surface) !important;
  border-color: var(--kp-border);
}
html[data-theme="dark"] .card{ background: var(--kp-surface); border-color: var(--kp-border); }
html[data-theme="dark"] .table thead th{ background: rgba(239,68,68,.08); }