/* ============================================================
   Badola Ops Platform — Brand Theme & Layout Fixes
   Brand colors: Navy #1A237E | Yellow #FFE800 | Red #C8102E
   ============================================================ */

/* ── CSS Variables ─────────────────────────────────────────── */
:root {
  --badola-navy:       #1A237E;
  --badola-navy-dark:  #0D1660;
  --badola-navy-light: #283593;
  --badola-yellow:     #FFE800;
  --badola-yellow-dim: rgba(255, 232, 0, 0.15);
  --badola-red:        #C8102E;
  --badola-red-dim:    rgba(200, 16, 46, 0.12);
  --sidebar-width:     260px;
}

/* ── 1. Fix content hidden behind fixed header ─────────────── */
.nk-wrap {
  padding-top: 65px !important;
}

/* ── 2. Sidebar Brand Theme ────────────────────────────────── */
.nk-sidebar.nk-sidebar-fixed {
  top: 0 !important;
  height: 100vh !important;
  overflow-y: hidden;
  background: var(--badola-navy) !important;
  border-right: 3px solid var(--badola-yellow) !important;
}

/* Sidebar head (logo area) */
.nk-sidebar-head {
  background: var(--badola-navy-dark) !important;
  border-bottom: 2px solid var(--badola-yellow) !important;
  padding: 0 20px !important;
  min-height: 65px;
  display: flex;
  align-items: center;
}

/* Logo sizing */
.nk-sidebar-logo .logo-img {
  max-height: 42px;
  width: auto;
}

/* Sidebar menu text & icons — white on navy */
.nk-sidebar .nk-menu-link,
.nk-sidebar .nk-menu-text,
.nk-sidebar .nk-menu-icon em,
.nk-sidebar .nk-menu-icon .icon {
  color: rgba(255, 255, 255, 0.80) !important;
}

/* Section headings (e.g. "Operations", "Fleet") */
.nk-sidebar .overline-title,
.nk-sidebar .overline-title.text-primary-alt {
  color: var(--badola-yellow) !important;
  font-weight: 700;
  letter-spacing: 0.08em;
  opacity: 1 !important;
}

/* Active / current menu item */
.nk-sidebar .nk-menu-item.active > .nk-menu-link,
.nk-sidebar .nk-menu-item.current-page > .nk-menu-link {
  background: var(--badola-yellow) !important;
  color: var(--badola-navy) !important;
  border-radius: 6px;
  font-weight: 700;
}
.nk-sidebar .nk-menu-item.active > .nk-menu-link,
.nk-sidebar .nk-menu-item.active > .nk-menu-link:hover,
.nk-sidebar .nk-menu-item.current-page > .nk-menu-link,
.nk-sidebar .nk-menu-item.current-page > .nk-menu-link:hover,
.nk-sidebar .nk-menu-item.active .nk-menu-text,
.nk-sidebar .nk-menu-item.current-page .nk-menu-text {
  color: var(--badola-navy) !important;
}
.nk-sidebar .nk-menu-item.active > .nk-menu-link .nk-menu-icon em,
.nk-sidebar .nk-menu-item.current-page > .nk-menu-link .nk-menu-icon em {
  color: var(--badola-navy) !important;
}

/* Hover effect */
.nk-sidebar .nk-menu-link:hover {
  background: rgba(255, 232, 0, 0.12) !important;
  color: #fff !important;
  border-radius: 6px;
}
.nk-sidebar .nk-menu-link:hover .nk-menu-icon em {
  color: var(--badola-yellow) !important;
}

/* Sub-menu arrow / toggle icon */
.nk-sidebar .nk-menu-toggle::after {
  border-color: rgba(255,255,255,0.5) !important;
}

/* ── 3. Topbar / Header Brand Theme ────────────────────────── */
.nk-header.nk-header-fixed {
  background: #fff !important;
  border-bottom: 3px solid var(--badola-navy) !important;
  box-shadow: 0 2px 8px rgba(26,35,126,0.08) !important;
}

/* Logo abbreviation on mobile */
.logo-abbr {
  color: var(--badola-navy) !important;
}

/* ── 4. Primary colour override — Navy ─────────────────────── */
.btn-primary {
  background-color: var(--badola-navy) !important;
  border-color: var(--badola-navy) !important;
  color: #fff !important;
}
.btn-primary:hover, .btn-primary:focus {
  background-color: var(--badola-navy-dark) !important;
  border-color: var(--badola-navy-dark) !important;
}

.text-primary { color: var(--badola-navy) !important; }
.bg-primary    { background-color: var(--badola-navy) !important; }
.bg-primary-dim { background-color: rgba(26,35,126,0.12) !important; }
.border-primary { border-color: var(--badola-navy) !important; }

/* Badge */
.badge.bg-primary, .badge-primary {
  background-color: var(--badola-navy) !important;
}

/* Links */
a.link-primary, .link.link-primary {
  color: var(--badola-navy) !important;
}

/* Alerts button */
.btn-outline-primary {
  color: var(--badola-navy) !important;
  border-color: var(--badola-navy) !important;
}
.btn-outline-primary:hover {
  background-color: var(--badola-navy) !important;
  color: #fff !important;
}

/* User avatar */
.user-avatar.bg-primary {
  background-color: var(--badola-navy) !important;
}

/* ── 5. Accent: Yellow callouts & highlights ───────────────── */
.badge-warning, .badge.bg-warning {
  background-color: var(--badola-yellow) !important;
  color: var(--badola-navy) !important;
}

/* ── 6. Accent: Red for danger/alerts ─────────────────────── */
.btn-danger {
  background-color: var(--badola-red) !important;
  border-color: var(--badola-red) !important;
}
.badge-danger, .badge.bg-danger {
  background-color: var(--badola-red) !important;
}

/* ── 7. Form focus rings ────────────────────────────────────── */
.form-control:focus,
.form-select:focus {
  border-color: var(--badola-navy) !important;
  box-shadow: 0 0 0 3px rgba(26,35,126,0.15) !important;
}

/* ── 8. Card border accent ──────────────────────────────────── */
.card {
  border-top: 2px solid transparent;
  transition: border-color 0.2s;
}
.card:hover {
  border-top-color: var(--badola-navy);
}

/* ── 9. Page title colour ───────────────────────────────────── */
.nk-block-title.page-title {
  color: var(--badola-navy) !important;
}

/* ── 10. Sidebar scroll fixes ───────────────────────────────── */
.nk-sidebar-element:not(.nk-sidebar-head) {
  display: flex;
  flex-direction: column;
  flex: 1 1 0;
  height: calc(100vh - 65px);
  overflow: hidden;
}
.nk-sidebar-content {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-height: 0;
}
.nk-sidebar-menu[data-simplebar] {
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto !important;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

/* ── 11. Spacing & Polish ───────────────────────────────────── */
.nk-content {
  padding-top: 15px !important;
  padding-bottom: 20px !important;
}
.nk-content-body {
  padding-top: 10px !important;
}
.nk-block-head {
  padding-bottom: 1.25rem;
}

/* ── 12. DataTables scroll fix ──────────────────────────────── */
.dataTables_wrapper { overflow-x: auto; }
.dataTables_wrapper .dataTables_scrollBody { overflow-x: auto !important; }
div.dataTables_wrapper div.dataTables_length { padding-top: 6px; }

/* ── 13. Prevent sidebar scroll-jump ───────────────────────── */
.nk-sidebar, .nk-sidebar-fixed,
.nk-sidebar-element, .nk-sidebar-content,
.nk-sidebar-menu {
  overscroll-behavior: contain;
  scroll-behavior: auto !important;
}
.nk-body { overscroll-behavior-y: none; }

/* ── 14. Responsive ─────────────────────────────────────────── */
@media (max-width: 991.98px) {
  .nk-wrap { padding-top: 65px !important; }
}

/* ── 15. Modal button sizing ─────────────────────────────────── */
.modal .modal-footer .btn,
.modal .modal-footer button,
.modal-footer .btn,
.nk-modal .btn {
  min-height: 42px !important;
  padding: 0.5rem 1.5rem !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
}

/* ── 16. Sidebar sub-menu (child) container ────────────────── */
.nk-sidebar .nk-menu-sub {
  background: #fff !important;
  border-radius: 8px;
  margin: 5px 12px 10px 12px !important;
  padding: 8px 0 !important;
  box-shadow: inset 0 2px 4px rgba(0,0,0,0.05), 0 4px 12px rgba(0,0,0,0.15) !important;
  border: 1px solid rgba(255, 232, 0, 0.3) !important;
}

/* Sub-menu item links & text — Navy for contrast on white */
.nk-sidebar .nk-menu-sub .nk-menu-link,
.nk-sidebar .nk-menu-sub .nk-menu-text,
.nk-sidebar .nk-menu-sub .nk-menu-icon em {
  color: var(--badola-navy) !important;
  font-weight: 500 !important;
}

/* Sub-menu hover — Light yellow wash */
.nk-sidebar .nk-menu-sub .nk-menu-link:hover {
  background: var(--badola-yellow-dim) !important;
  color: var(--badola-navy) !important;
}

/* Sub-menu active item — Solid yellow background */
.nk-sidebar .nk-menu-sub .nk-menu-item.active > .nk-menu-link,
.nk-sidebar .nk-menu-sub .nk-menu-item.active > .nk-menu-link .nk-menu-text,
.nk-sidebar .nk-menu-sub .nk-menu-item.active > .nk-menu-link .nk-menu-icon em {
  background: var(--badola-yellow) !important;
  color: var(--badola-navy) !important;
  font-weight: 700 !important;
}

/* Sub-menu toggle arrow color correction */
.nk-sidebar .nk-menu-item.has-sub.active > .nk-menu-toggle::after {
  border-color: rgba(255,255,255,0.8) !important;
}