@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

/* ── Tokens ─────────────────────────────────────────────── */
:root {
  --bw-navy:   #1E3A8A;
  --bw-dark:   #172e70;
  --bw-sky:    #0EA5E9;
  --bw-slate:  #475569;
  --bw-border: #CBD5E1;
  --bw-bg:     #F1F5F9;
  --bw-white:  #FFFFFF;
  --bw-text:   #0F172A;

  /* Override Bootstrap font vars — no element targeting needed.
     Bootstrap reads these vars on body/components automatically.
     Icon fonts set font-family directly on their elements with
     !important, so they are never affected by these vars.      */
  --bs-body-font-family:     'Inter', system-ui, sans-serif;
  --bs-font-sans-serif:      'Inter', system-ui, sans-serif;
  --bs-app-sidebar-base-bg-color:   #1E3A8A;
  --bs-app-sidebar-base-border-end: 1px solid #172e70;
}

/* Force Bootstrap font vars in both themes */
html[data-bs-theme=light],
html[data-bs-theme=dark] {
  --bs-body-font-family:            'Inter', system-ui, sans-serif;
  --bs-font-sans-serif:             'Inter', system-ui, sans-serif;
  --bs-app-sidebar-base-bg-color:   #1E3A8A !important;
  --bs-app-sidebar-base-border-end: 1px solid #172e70 !important;
}

/* ══════════════════════════════════════════════════════════
   SIDEBAR — always navy regardless of theme
   ══════════════════════════════════════════════════════════ */
#kt_app_sidebar,
.app-sidebar {
  background-color: #1E3A8A !important;
  border-right: 1px solid #172e70 !important;
}
#kt_app_sidebar_logo,
.app-sidebar-logo {
  background-color: #1E3A8A !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}
#kt_app_sidebar .menu-link,
.app-sidebar .menu-link {
  color: rgba(255,255,255,0.82) !important;
  border-radius: 6px !important;
  transition: background 0.15s;
}
#kt_app_sidebar .menu-link:hover,
#kt_app_sidebar .menu-link.active,
.app-sidebar .menu-link:hover,
.app-sidebar .menu-link.active {
  background-color: rgba(255,255,255,0.10) !important;
  color: #fff !important;
}
#kt_app_sidebar .menu-title,
.app-sidebar .menu-title  { color: rgba(255,255,255,0.90) !important; }
#kt_app_sidebar .menu-heading,
.app-sidebar .menu-heading {
  color: rgba(255,255,255,0.42) !important;
  font-size: 0.65rem !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}
#kt_app_sidebar .menu-arrow,
.app-sidebar .menu-arrow { color: rgba(255,255,255,0.45) !important; }

/* Sidebar icon paths — scoped strictly inside sidebar only  */
#kt_app_sidebar .path1::before,
.app-sidebar .path1::before { color: rgba(255,255,255,0.38) !important; }
#kt_app_sidebar .path2::before,
.app-sidebar .path2::before { color: rgba(255,255,255,0.85) !important; }
#kt_app_sidebar .path3::before,
.app-sidebar .path3::before { color: rgba(255,255,255,0.85) !important; }
#kt_app_sidebar .path4::before,
.app-sidebar .path4::before { color: rgba(255,255,255,0.38) !important; }
#kt_app_sidebar .menu-link.active .path1::before,
#kt_app_sidebar .menu-link.active .path2::before,
#kt_app_sidebar .menu-link.active .path3::before,
#kt_app_sidebar .menu-link.active .path4::before,
.app-sidebar .menu-link.active .path1::before,
.app-sidebar .menu-link.active .path2::before,
.app-sidebar .menu-link.active .path3::before,
.app-sidebar .menu-link.active .path4::before {
  color: rgba(255,255,255,0.95) !important;
}

/* ══════════════════════════════════════════════════════════
   LIGHT MODE
   ══════════════════════════════════════════════════════════ */
html:not([data-bs-theme=dark]) {
  --bs-app-bg-color: #F1F5F9;
}
html:not([data-bs-theme=dark]) #kt_app_header,
html:not([data-bs-theme=dark]) .app-header {
  background-color: #FFFFFF !important;
  border-bottom: 1px solid #CBD5E1 !important;
  box-shadow: 0 1px 3px rgba(15,23,42,0.07) !important;
}
html:not([data-bs-theme=dark]) #kt_app_content,
html:not([data-bs-theme=dark]) .app-content,
html:not([data-bs-theme=dark]) .app-main,
html:not([data-bs-theme=dark]) .app-wrapper {
  background-color: #F1F5F9 !important;
}
html:not([data-bs-theme=dark]) .card {
  background-color: #FFFFFF !important;
  border: 1px solid #CBD5E1 !important;
  border-radius: 10px !important;
  box-shadow: 0 1px 3px rgba(15,23,42,0.08) !important;
}
html:not([data-bs-theme=dark]) .card-header {
  background-color: #FFFFFF !important;
  border-bottom: 1px solid #CBD5E1 !important;
}
html:not([data-bs-theme=dark]) a       { color: #1E3A8A !important; }
html:not([data-bs-theme=dark]) a:hover { color: #172e70 !important; }
html:not([data-bs-theme=dark]) .table-hover tbody tr:hover {
  background-color: rgba(30,58,138,0.04) !important;
}

/* ══════════════════════════════════════════════════════════
   DARK MODE — accents only, SFTPGo handles surfaces
   ══════════════════════════════════════════════════════════ */
html[data-bs-theme=dark] #kt_app_header,
html[data-bs-theme=dark] .app-header {
  background-color: #1C1D22 !important;
  border-bottom: 1px solid #2B2C33 !important;
  box-shadow: none !important;
}
html[data-bs-theme=dark] .card  { border-color: #2B2C33 !important; border-radius: 10px !important; }
html[data-bs-theme=dark] a      { color: #60a5fa !important; }
html[data-bs-theme=dark] a:hover{ color: #93c5fd !important; }
html[data-bs-theme=dark] .table-hover tbody tr:hover {
  background-color: rgba(255,255,255,0.04) !important;
}

/* ══════════════════════════════════════════════════════════
   SHARED — both modes
   ══════════════════════════════════════════════════════════ */
.form-control:focus, .form-select:focus {
  border-color: #0EA5E9 !important;
  box-shadow: 0 0 0 3px rgba(14,165,233,0.18) !important;
}
.btn-primary {
  background-color: #1E3A8A !important;
  border-color: #1E3A8A !important;
  color: #fff !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
}
.btn-primary:hover, .btn-primary:focus {
  background-color: #172e70 !important;
  border-color: #172e70 !important;
}
.btn-light-primary {
  color: #1E3A8A !important;
  background-color: rgba(30,58,138,0.08) !important;
}
.btn-light-primary:hover {
  background-color: #1E3A8A !important;
  color: #fff !important;
}
.badge.bg-primary { background-color: #1E3A8A !important; }
.badge.bg-info    { background-color: #0EA5E9 !important; }
.nav-line-tabs .nav-link.active {
  color: #1E3A8A !important;
  border-bottom-color: #1E3A8A !important;
}
.nav-pills .nav-link.active      { background-color: #1E3A8A !important; }
.page-item.active .page-link     { background-color: #1E3A8A !important; border-color: #1E3A8A !important; }
.table thead th {
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
}
::-webkit-scrollbar       { width: 6px; height: 6px; }
::-webkit-scrollbar-thumb { background: #94a3b8; border-radius: 3px; }
::-webkit-scrollbar-track { background: transparent; }

/* ── btn-primary as anchor: enforce white text in both modes ── */
/* Specificity (0,2,2) beats the a{color} rules at (0,1,2)     */
html:not([data-bs-theme=dark]) a.btn-primary,
html:not([data-bs-theme=dark]) a.btn-primary:hover,
html:not([data-bs-theme=dark]) a.btn-primary:focus,
html:not([data-bs-theme=dark]) a.btn-primary:active,
html:not([data-bs-theme=dark]) a.btn-primary:visited,
html[data-bs-theme=dark] a.btn-primary,
html[data-bs-theme=dark] a.btn-primary:hover,
html[data-bs-theme=dark] a.btn-primary:focus,
html[data-bs-theme=dark] a.btn-primary:active,
html[data-bs-theme=dark] a.btn-primary:visited {
  color: #fff !important;
}