/* ======================================================================
   KAFCO Admin — Brand Override Stylesheet
   ----------------------------------------------------------------------
   Target:    AdminLTE 3 (Bootstrap 4)
   Load:      LAST, after adminlte.min.css and custom.css
   Applies:   All admin pages — navbar, sidebar, cards, tables, forms
   Matches:   Storefront brand system (kafco-brand.css)

   Do not edit adminlte.min.css. Do not edit custom.css.
   All brand changes live here.
   ====================================================================== */

:root {
  /* Brand palette — must match kafco-brand.css on storefront */
  --kaf-navy:          #1B2A4A;
  --kaf-navy-2:        #243658;
  --kaf-orange:        #F47B20;
  --kaf-orange-hover:  #E06A10;
  --kaf-orange-soft:   #FEF0E6;
  --kaf-orange-ring:   rgba(244,123,32,.22);
  --kaf-blue:          #4A7BA7;
  --kaf-blue-pale:     #EBF3FA;
  --kaf-off:           #F8F9FC;
  --kaf-border:        #E2E8F0;
  --kaf-border-strong: #CBD5E0;
  --kaf-text:          #1B2A4A;
  --kaf-text2:         #4A5578;
  --kaf-text3:         #8A95B0;
  --kaf-white:         #FFFFFF;
  --kaf-shadow-sm:     0 1px 3px rgba(27,42,74,.05);
  --kaf-shadow:        0 2px 12px rgba(27,42,74,.06);
  --kaf-shadow-lg:     0 8px 24px rgba(27,42,74,.10);
  --kaf-nav-height:    60px;
}

/* =========================================================
   1. BODY / WRAPPER
   ========================================================= */
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI',
               Roboto, Oxygen, Ubuntu, sans-serif;
  color: var(--kaf-text);
  background-color: var(--kaf-off);
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
}
.wrapper { background-color: var(--kaf-off); }

#loading .lds-ring div {
  border-color: var(--kaf-orange) transparent transparent transparent;
}

/* =========================================================
   2. TOP NAVBAR
   ========================================================= */
.main-header.navbar {
  background-color: var(--kaf-white) !important;
  border-bottom: 1px solid var(--kaf-border) !important;
  box-shadow: var(--kaf-shadow-sm);
  min-height: var(--kaf-nav-height);
  padding: 0 16px;
}
.main-header .nav-link {
  color: var(--kaf-text2) !important;
  transition: color .15s ease, background .15s ease;
  border-radius: 8px;
  padding: 8px 12px;
}
.main-header .nav-link:hover {
  color: var(--kaf-orange) !important;
  background: var(--kaf-orange-soft);
}
.main-header .nav-link i { font-size: 17px; }
.main-header .badge-danger {
  background: #E53E3E; padding: 5px 10px; border-radius: 8px;
  font-weight: 600; font-size: 11px; letter-spacing: .3px;
}
.main-header .badge-success {
  background: var(--kaf-orange); padding: 5px 10px;
  border-radius: 8px; font-weight: 600;
}
.main-header .dropdown-menu {
  border: 1px solid var(--kaf-border); border-radius: 12px;
  box-shadow: var(--kaf-shadow-lg); padding: 6px; margin-top: 6px;
}
.main-header .dropdown-item {
  border-radius: 8px; padding: 8px 12px;
  color: var(--kaf-text); font-weight: 500; font-size: 13px;
}
.main-header .dropdown-item:hover {
  background: var(--kaf-orange-soft); color: var(--kaf-orange);
}
.main-header [data-widget="pushmenu"] i {
  color: var(--kaf-navy); font-size: 17px;
}

/* =========================================================
   3. SIDEBAR — white surface, navy text, orange accents
   ========================================================= */
.main-sidebar,
.main-sidebar.sidebar-dark-primary,
.main-sidebar.sidebar-dark-indigo,
.main-sidebar.sidebar-dark-navy,
.main-sidebar.sidebar-light-primary {
  background-color: var(--kaf-white) !important;
  border-right: 1px solid var(--kaf-border);
  box-shadow: var(--kaf-shadow-sm);
}
.main-sidebar .sidebar {
  padding: 8px 0 20px;
  scrollbar-width: thin;
  scrollbar-color: var(--kaf-border) transparent;
}
.main-sidebar .sidebar::-webkit-scrollbar { width: 6px; }
.main-sidebar .sidebar::-webkit-scrollbar-thumb {
  background: var(--kaf-border); border-radius: 6px;
}

/* Brand area (logo) */
.main-sidebar .brand-link {
  background: var(--kaf-white) !important;
  border-bottom: 1px solid var(--kaf-border) !important;
  color: var(--kaf-navy) !important;
  height: var(--kaf-nav-height);
  padding: 10px 16px;
  display: flex; align-items: center; gap: 10px;
  transition: background .15s ease;
}
.main-sidebar .brand-link:hover { background: var(--kaf-orange-soft) !important; }
.main-sidebar .brand-image {
  max-height: 36px; margin-top: 0; margin-right: 8px;
  border-radius: 8px; box-shadow: none; opacity: 1;
}
.main-sidebar .brand-text {
  color: var(--kaf-navy) !important;
  font-weight: 800; font-size: 17px; letter-spacing: -0.2px;
}

/* Section headers */
.nav-sidebar .nav-header {
  color: var(--kaf-text3) !important;
  background: transparent !important;
  font-size: 11px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase;
  padding: 16px 20px 6px; margin: 0;
}

/* Top-level items */
.nav-sidebar > .nav-item { margin: 0; }
.nav-sidebar > .nav-item > .nav-link {
  color: var(--kaf-text) !important;
  background: transparent;
  border: none !important;
  box-shadow: none !important;
  border-radius: 10px;
  margin: 2px 10px;
  padding: 9px 12px;
  font-weight: 500; font-size: 14px;
  transition: background .15s ease, color .15s ease;
  display: flex; align-items: center;
}
.nav-sidebar > .nav-item > .nav-link p {
  color: inherit !important;
  font-weight: 500 !important; font-size: 14px !important;
  margin: 0;
}
.nav-sidebar > .nav-item > .nav-link:hover {
  background: var(--kaf-orange-soft) !important;
  color: var(--kaf-orange) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
.nav-sidebar > .nav-item > .nav-link:hover p { color: var(--kaf-orange) !important; }

/* Active top-level — solid orange pill */
.main-sidebar .nav-sidebar > .nav-item > .nav-link.active,
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active,
.sidebar-dark-indigo .nav-sidebar > .nav-item > .nav-link.active,
.sidebar-light-primary .nav-sidebar > .nav-item > .nav-link.active {
  background: var(--kaf-orange) !important;
  color: var(--kaf-white) !important;
  box-shadow: 0 4px 12px var(--kaf-orange-ring) !important;
  border-color: var(--kaf-orange) !important;
}
.main-sidebar .nav-sidebar > .nav-item > .nav-link.active p,
.sidebar-light-primary .nav-sidebar > .nav-item > .nav-link.active p {
  color: var(--kaf-white) !important;
}
.nav-sidebar > .nav-item > .nav-link.active::before { display: none !important; }

/* Icons — all states */
.nav-sidebar .nav-icon {
  color: var(--kaf-text3) !important;
  width: 20px; text-align: center;
  margin-right: 10px; font-size: 15px;
  transition: color .15s ease; opacity: 1;
}
.nav-sidebar > .nav-item > .nav-link:hover .nav-icon { color: var(--kaf-orange) !important; }
.nav-sidebar > .nav-item > .nav-link.active .nav-icon { color: var(--kaf-white) !important; }

/* Neutralise AdminLTE utility colour classes on sidebar icons */
.nav-sidebar .nav-icon.text-primary,
.nav-sidebar .nav-icon.text-success,
.nav-sidebar .nav-icon.text-info,
.nav-sidebar .nav-icon.text-warning,
.nav-sidebar .nav-icon.text-danger,
.nav-sidebar .nav-icon.text-secondary {
  color: var(--kaf-text3) !important;
}
.nav-sidebar > .nav-item > .nav-link:hover .nav-icon[class*="text-"] { color: var(--kaf-orange) !important; }
.nav-sidebar > .nav-item > .nav-link.active .nav-icon[class*="text-"] { color: var(--kaf-white) !important; }

/* Right chevron */
.nav-sidebar .nav-link > .right {
  margin-left: auto; color: var(--kaf-text3);
  transition: transform .2s ease; font-size: 11px;
}
.nav-sidebar .menu-open > .nav-link > .right { transform: rotate(-90deg); }
.nav-sidebar > .nav-item > .nav-link.active .right { color: var(--kaf-white); }

/* Submenu (nav-treeview) */
.nav-sidebar .nav-treeview {
  margin: 2px 10px 6px 30px;
  padding-left: 8px;
  border-left: 2px solid var(--kaf-border);
}
.nav-treeview > .nav-item > .nav-link {
  color: var(--kaf-text2) !important;
  background: transparent !important;
  border: none !important; box-shadow: none !important;
  border-radius: 8px;
  margin: 1px 0; padding: 7px 10px;
  font-size: 13px; font-weight: 500;
  display: flex; align-items: center;
}
.nav-treeview > .nav-item > .nav-link p {
  color: inherit !important;
  font-size: 13px !important; font-weight: 500 !important;
  margin: 0;
}
.nav-treeview > .nav-item > .nav-link:hover,
.nav-treeview > .nav-item > .nav-link.active {
  background: var(--kaf-orange-soft) !important;
  color: var(--kaf-orange) !important;
  border-color: transparent !important;
}
.nav-treeview > .nav-item > .nav-link:hover p,
.nav-treeview > .nav-item > .nav-link.active p {
  color: var(--kaf-orange) !important;
}
.nav-treeview > .nav-item > .nav-link.active { font-weight: 600; }
.nav-treeview > .nav-item > .nav-link.active p { font-weight: 600 !important; }
.nav-treeview > .nav-item > .nav-link.active::before { display: none !important; }
.nav-treeview .nav-icon { color: var(--kaf-text3) !important; font-size: 11px; }
.nav-treeview > .nav-item > .nav-link:hover .nav-icon,
.nav-treeview > .nav-item > .nav-link.active .nav-icon { color: var(--kaf-orange) !important; }

/* =========================================================
   4. CONTENT AREA & HEADER
   ========================================================= */
.content-wrapper {
  background-color: var(--kaf-off) !important;
  min-height: calc(100vh - var(--kaf-nav-height));
}
.content-header { padding: 18px 20px 10px; }
.content-header h1 {
  font-size: 22px; font-weight: 700;
  color: var(--kaf-navy); margin: 0 0 4px;
  letter-spacing: -0.3px;
}
.content-header .breadcrumb {
  background: transparent; padding: 0; margin: 0; font-size: 12px;
}
.content-header .breadcrumb-item a {
  color: var(--kaf-text2); text-decoration: none; font-weight: 500;
}
.content-header .breadcrumb-item a:hover { color: var(--kaf-orange); }
.content-header .breadcrumb-item.active { color: var(--kaf-orange); font-weight: 600; }
.content-header .breadcrumb-item + .breadcrumb-item::before {
  color: var(--kaf-text3); content: "/";
}
.content { padding: 8px 20px 24px; }

/* =========================================================
   5. CARDS
   ========================================================= */
.card {
  background: var(--kaf-white);
  border: 1px solid var(--kaf-border) !important;
  border-radius: 14px !important;
  box-shadow: var(--kaf-shadow);
  margin-bottom: 20px;
  overflow: hidden;
}
.card.card-primary,
.card.card-info,
.card.card-success,
.card.card-warning,
.card.card-danger,
.card.card-outline.card-primary,
.card.card-outline.card-info,
.card.card-outline.card-success,
.card.card-outline.card-warning,
.card.card-outline.card-danger {
  border-top: 3px solid var(--kaf-orange) !important;
}
.card .card-header {
  background: var(--kaf-white);
  border-bottom: 1px solid var(--kaf-border);
  padding: 14px 20px;
  border-radius: 14px 14px 0 0 !important;
}
.card .card-title {
  color: var(--kaf-navy); font-weight: 700;
  font-size: 15px; margin: 0; letter-spacing: -0.2px;
}
.card .card-body { padding: 20px; }
.card .card-footer {
  background: var(--kaf-off);
  border-top: 1px solid var(--kaf-border);
  padding: 14px 20px;
  border-radius: 0 0 14px 14px !important;
}
.card-tools .btn-tool { color: var(--kaf-text2); }
.card-tools .btn-tool:hover { color: var(--kaf-orange); }

/* AdminLTE small-box (stat tiles) */
.small-box {
  border-radius: 14px; box-shadow: var(--kaf-shadow);
  border: 1px solid var(--kaf-border); overflow: hidden;
}
.small-box > .small-box-footer {
  background: rgba(0,0,0,.08); color: rgba(255,255,255,.9);
  padding: 8px 12px; font-size: 12px; font-weight: 600;
}
.small-box.bg-info    { background: var(--kaf-blue) !important;   color: #fff; }
.small-box.bg-warning { background: var(--kaf-orange) !important; color: #fff; }
.small-box.bg-success { background: #22B364 !important;            color: #fff; }
.small-box.bg-danger  { background: #E53E3E !important;            color: #fff; }

/* Info box */
.info-box {
  background: var(--kaf-white);
  border-radius: 12px;
  border: 1px solid var(--kaf-border);
  box-shadow: var(--kaf-shadow-sm);
}
.info-box-text   { color: var(--kaf-text2); font-weight: 600; font-size: 12px; }
.info-box-number { color: var(--kaf-navy); font-weight: 700; }

/* =========================================================
   6. BUTTONS
   ========================================================= */
.btn {
  font-weight: 600; border-radius: 10px;
  padding: 8px 16px; font-size: 13px; letter-spacing: .1px;
  transition: transform .1s ease, box-shadow .15s ease, background .15s ease;
}
.btn:active { transform: translateY(1px); }
.btn-primary,
.btn-primary:not(:disabled):not(.disabled):active {
  background: var(--kaf-orange) !important;
  border-color: var(--kaf-orange) !important;
  color: #fff !important;
  box-shadow: 0 2px 8px var(--kaf-orange-ring);
}
.btn-primary:hover, .btn-primary:focus {
  background: var(--kaf-orange-hover) !important;
  border-color: var(--kaf-orange-hover) !important;
  box-shadow: 0 4px 12px var(--kaf-orange-ring);
}
.btn-secondary {
  background: var(--kaf-white) !important;
  border: 1px solid var(--kaf-border-strong) !important;
  color: var(--kaf-text) !important;
}
.btn-secondary:hover {
  background: var(--kaf-off) !important; color: var(--kaf-navy) !important;
}
.btn-outline-primary {
  color: var(--kaf-orange) !important;
  border-color: var(--kaf-orange) !important;
  background: transparent !important;
}
.btn-outline-primary:hover { background: var(--kaf-orange) !important; color: #fff !important; }
.btn-success { background: #22B364 !important; border-color: #22B364 !important; }
.btn-success:hover { background: #1CA257 !important; border-color: #1CA257 !important; }
.btn-danger  { background: #E53E3E !important; border-color: #E53E3E !important; }
.btn-danger:hover  { background: #C93232 !important; border-color: #C93232 !important; }
.btn-info    { background: var(--kaf-blue) !important; border-color: var(--kaf-blue) !important; }
.btn-info:hover    { background: #3C668C !important; border-color: #3C668C !important; }
.btn-warning { background: var(--kaf-orange) !important; border-color: var(--kaf-orange) !important; color: #fff !important; }
.btn-sm { padding: 5px 10px; font-size: 12px; border-radius: 8px; }
.btn-lg { padding: 11px 20px; font-size: 15px; border-radius: 12px; }

/* =========================================================
   7. FORMS
   ========================================================= */
.form-control, .custom-select {
  border: 1.5px solid var(--kaf-border) !important;
  border-radius: 10px !important;
  padding: 9px 12px; font-size: 14px;
  color: var(--kaf-text); background: var(--kaf-white);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.form-control:focus, .custom-select:focus {
  border-color: var(--kaf-orange) !important;
  box-shadow: 0 0 0 3px var(--kaf-orange-ring) !important;
  outline: none;
}
.form-control::placeholder { color: var(--kaf-text3); }
label, .form-label {
  color: var(--kaf-text); font-weight: 600; font-size: 13px;
  margin-bottom: 6px;
}
.input-group-text {
  background: var(--kaf-off);
  border: 1.5px solid var(--kaf-border);
  color: var(--kaf-text2); border-radius: 10px;
}

/* iCheck */
.icheck-primary > input:first-child:checked + label::before,
.icheck-primary > input:first-child:checked + input[type="hidden"] + label::before {
  background-color: var(--kaf-orange) !important;
  border-color: var(--kaf-orange) !important;
}
.custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--kaf-orange) !important;
  border-color: var(--kaf-orange) !important;
}
.custom-control-input:focus ~ .custom-control-label::before {
  box-shadow: 0 0 0 3px var(--kaf-orange-ring) !important;
}

/* Bootstrap Switch */
.bootstrap-switch { border-radius: 999px !important; border-color: var(--kaf-border); }
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info {
  background: var(--kaf-orange) !important; color: #fff !important;
}

/* Select2 */
.select2-container--bootstrap4 .select2-selection {
  border: 1.5px solid var(--kaf-border) !important;
  border-radius: 10px !important; min-height: 40px;
}
.select2-container--bootstrap4.select2-container--focus .select2-selection {
  border-color: var(--kaf-orange) !important;
  box-shadow: 0 0 0 3px var(--kaf-orange-ring) !important;
}
.select2-container--bootstrap4 .select2-results__option--highlighted {
  background-color: var(--kaf-orange) !important; color: #fff !important;
}
.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice {
  background: var(--kaf-orange-soft) !important;
  border: 1px solid var(--kaf-orange) !important;
  color: var(--kaf-orange) !important; border-radius: 6px;
}

/* =========================================================
   8. TABLES
   ========================================================= */
.table { background: var(--kaf-white); color: var(--kaf-text); margin-bottom: 0; }
.table thead th {
  background: var(--kaf-off);
  color: var(--kaf-text2); font-weight: 700;
  font-size: 12px; letter-spacing: .3px; text-transform: uppercase;
  border-bottom: 1px solid var(--kaf-border); border-top: none;
  padding: 12px 14px;
}
.table tbody tr { transition: background .15s ease; }
.table tbody tr:hover { background: var(--kaf-off) !important; }
.table tbody td {
  padding: 14px; vertical-align: middle;
  border-top: 1px solid var(--kaf-border); font-size: 13px;
}
.table-striped tbody tr:nth-of-type(odd) { background-color: rgba(248,249,252,.5); }

.bootstrap-table .fixed-table-toolbar { padding: 10px 0; }
.bootstrap-table .fixed-table-toolbar .btn { border-radius: 8px !important; }
.bootstrap-table .fixed-table-toolbar .search input {
  border: 1.5px solid var(--kaf-border);
  border-radius: 10px; padding: 8px 12px;
}
.pagination .page-item.active .page-link {
  background: var(--kaf-orange) !important;
  border-color: var(--kaf-orange) !important;
  color: #fff !important;
}
.pagination .page-link {
  color: var(--kaf-text);
  border: 1px solid var(--kaf-border);
  border-radius: 8px !important;
  margin: 0 2px; padding: 6px 12px; font-weight: 600;
}
.pagination .page-link:hover {
  background: var(--kaf-orange-soft);
  color: var(--kaf-orange);
  border-color: var(--kaf-orange);
}

/* =========================================================
   9. BADGES, ALERTS, TABS
   ========================================================= */
.badge {
  padding: 5px 10px; border-radius: 8px;
  font-weight: 600; font-size: 11px; letter-spacing: .3px;
}
.badge-primary   { background: var(--kaf-orange) !important;   color: #fff !important; }
.badge-info      { background: var(--kaf-blue-pale) !important; color: var(--kaf-blue) !important; }
.badge-success   { background: #E0F5EA !important;              color: #168749 !important; }
.badge-warning   { background: var(--kaf-orange-soft) !important; color: var(--kaf-orange-hover) !important; }
.badge-danger    { background: #FDECEC !important;              color: #B8262E !important; }
.badge-secondary { background: var(--kaf-off) !important;       color: var(--kaf-text2) !important; }

.alert {
  border-radius: 12px;
  border: 1px solid var(--kaf-border);
  padding: 14px 18px; font-weight: 500;
}
.alert-info    { background: var(--kaf-blue-pale); color: var(--kaf-blue); border-color: var(--kaf-blue); }
.alert-success { background: #E0F5EA; color: #168749; border-color: #22B364; }
.alert-warning { background: var(--kaf-orange-soft); color: var(--kaf-orange-hover); border-color: var(--kaf-orange); }
.alert-danger  { background: #FDECEC; color: #B8262E; border-color: #E53E3E; }

.nav-tabs { border-bottom: 1px solid var(--kaf-border); }
.nav-tabs .nav-link {
  color: var(--kaf-text2); font-weight: 600;
  border: none; border-bottom: 2px solid transparent;
  border-radius: 0; padding: 10px 14px;
}
.nav-tabs .nav-link:hover { color: var(--kaf-orange); border-color: transparent; }
.nav-tabs .nav-link.active {
  color: var(--kaf-orange); background: transparent;
  border-bottom: 2px solid var(--kaf-orange);
}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  background: var(--kaf-orange); color: #fff; border-radius: 10px;
}

/* =========================================================
   10. MODALS
   ========================================================= */
.modal-content {
  border: 1px solid var(--kaf-border);
  border-radius: 16px;
  box-shadow: var(--kaf-shadow-lg);
  overflow: hidden;
}
.modal-header {
  background: var(--kaf-white);
  border-bottom: 1px solid var(--kaf-border);
  padding: 16px 20px;
}
.modal-title { color: var(--kaf-navy); font-weight: 700; font-size: 16px; }
.modal-body { padding: 20px; }
.modal-footer {
  background: var(--kaf-off);
  border-top: 1px solid var(--kaf-border);
  padding: 14px 20px;
}
.modal .close { color: var(--kaf-text2); opacity: .8; }
.modal .close:hover { color: var(--kaf-orange); opacity: 1; }

/* =========================================================
   11. FOOTER, DROPDOWNS, LINKS, UTIL
   ========================================================= */
.main-footer {
  background: var(--kaf-white);
  border-top: 1px solid var(--kaf-border);
  color: var(--kaf-text3); font-size: 12px; padding: 12px 20px;
}
.main-footer a { color: var(--kaf-orange); font-weight: 600; text-decoration: none; }

.dropdown-menu {
  border: 1px solid var(--kaf-border);
  border-radius: 12px;
  box-shadow: var(--kaf-shadow-lg);
  padding: 6px; font-size: 13px;
}
.dropdown-item {
  border-radius: 8px; padding: 8px 12px;
  color: var(--kaf-text); font-weight: 500;
  transition: background .12s ease;
}
.dropdown-item:hover, .dropdown-item:focus {
  background: var(--kaf-orange-soft); color: var(--kaf-orange);
}
.dropdown-divider { border-top-color: var(--kaf-border); margin: 4px 0; }

a { color: var(--kaf-orange); }
a:hover { color: var(--kaf-orange-hover); }
.nav-link, .nav-link:hover,
.dropdown-item, .dropdown-item:hover,
.breadcrumb-item a, .page-link { color: inherit; }

.text-primary { color: var(--kaf-orange) !important; }
.text-info    { color: var(--kaf-blue) !important; }
.text-success { color: #22B364 !important; }
.text-warning { color: var(--kaf-orange) !important; }
.text-danger  { color: #E53E3E !important; }
.text-muted   { color: var(--kaf-text3) !important; }
.bg-primary   { background: var(--kaf-orange) !important; }
.bg-info      { background: var(--kaf-blue) !important; }

hr { border-top-color: var(--kaf-border); }
code, kbd, samp {
  background: var(--kaf-off); padding: 1px 5px;
  border-radius: 4px; font-size: 12px; color: var(--kaf-navy);
}

/* SweetAlert2 */
.swal2-popup { border-radius: 16px !important; box-shadow: var(--kaf-shadow-lg) !important; }
.swal2-title { color: var(--kaf-navy) !important; font-weight: 700 !important; }
.swal2-styled.swal2-confirm {
  background: var(--kaf-orange) !important;
  border-radius: 10px !important;
  padding: 10px 20px !important; font-weight: 600 !important;
}
.iziToast { border-radius: 12px !important; box-shadow: var(--kaf-shadow-lg) !important; }

/* =========================================================
   12. RESPONSIVE & PRINT
   ========================================================= */
@media (max-width: 991.98px) {
  .content-header { padding: 14px 16px 8px; }
  .content-header h1 { font-size: 20px; }
  .content { padding: 8px 16px 20px; }
  .card .card-body { padding: 16px; }
  .card .card-header { padding: 12px 16px; }
}

@media print {
  .main-sidebar, .main-header, .main-footer, .card-tools { display: none !important; }
  .content-wrapper { margin-left: 0 !important; }
  .card { box-shadow: none !important; border: 1px solid #000 !important; }
}

/* === end of kafco-admin.css === */

/* ===== Active state specificity fix =====
   AdminLTE's sidebar-light-primary fights our orange bg.
   body prefix beats it without touching any HTML.
   ========================================= */
body .main-sidebar .nav-sidebar > .nav-item > .nav-link.active,
body .main-sidebar .nav-sidebar > .nav-item > .nav-link.active:hover {
  background-color: #F47B20 !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(244,123,32,.3) !important;
}
body .main-sidebar .nav-sidebar > .nav-item > .nav-link.active p,
body .main-sidebar .nav-sidebar > .nav-item > .nav-link.active .nav-icon,
body .main-sidebar .nav-sidebar > .nav-item > .nav-link.active .right {
  color: #ffffff !important;
}

/* ===== Action buttons alignment fix =====
   btn-xs was dropped in Bootstrap 4.
   Re-define it + make all action-btn a
   uniform 32x32 square icon button so
   they grid neatly regardless of how many
   appear per cell.
   ========================================= */

/* Bootstrap 3 compat — btn-xs */
.btn-xs {
  padding: 0 !important;
  font-size: 13px !important;
  line-height: 1 !important;
  border-radius: 8px !important;
}

/* All action buttons — fixed square */
a.action-btn,
button.action-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  padding: 0 !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  margin: 2px 2px !important;
  flex-shrink: 0;
}

/* Table cell containing action buttons — flex wrap */
.table td:has(a.action-btn),
.table td:has(button.action-btn) {
  white-space: nowrap;
  vertical-align: middle;
}

/* btn-dark → navy (not black) */
.btn-dark {
  background: var(--kaf-navy) !important;
  border-color: var(--kaf-navy) !important;
  color: #fff !important;
}
.btn-dark:hover {
  background: var(--kaf-navy-2) !important;
  border-color: var(--kaf-navy-2) !important;
}

/* overflow:hidden on .card clips select dropdowns and
   bootstrap-table column-toggle menus — remove it.
   Border-radius works fine without it in modern browsers. */
.card { overflow: visible !important; }

/* Keep overflow clipping only where it's actually needed */
.card .card-header { overflow: hidden; }
.card img { max-width: 100%; }

/* ── Dashboard visual polish ───────────────────────────────────────── */

/* Stronger section labels */
.kd-section-label {
    font-size: 11.5px !important;
    font-weight: 800 !important;
    color: #4A5578 !important;
    border-left: 3px solid #F47B20;
    padding-left: 8px !important;
    margin-bottom: 14px !important;
}

/* KPI cards — slightly taller, more breathing room */
a.kd-kpi, .kd-kpi {
    padding: 20px 22px !important;
    border-radius: 16px !important;
}
.kd-kpi-value { font-size: 28px !important; }
.kd-kpi-icon  { width: 52px !important; height: 52px !important; font-size: 22px !important; }

/* Pipeline — bigger counts, more height */
.kd-pipeline { padding: 20px 24px !important; }
.kd-pipeline-stage { padding: 16px 8px !important; border-radius: 14px !important; }
.kd-pipeline-count { font-size: 32px !important; }

/* Revenue cards — slightly taller */
.kd-revenue { padding: 22px 24px !important; }
.kd-rev-val  { font-size: 24px !important; }

/* AI panel — more padding */
.kd-ai-panel { padding: 22px 26px !important; min-height: 280px !important; }

/* Seller boxes — match pipeline height */
.kd-seller-box { padding: 16px 18px !important; border-radius: 14px !important; }
.kd-seller-val { font-size: 32px !important; }

/* Alert cards — more prominent */
.kd-alert { padding: 16px 18px !important; border-radius: 14px !important; border-left-width: 5px !important; }
.kd-alert-count { font-size: 26px !important; }

/* Content wrapper — remove default top padding so header sits flush */
.content-wrapper > .content { padding-top: 20px !important; }
.kd-content { padding-top: 24px !important; }