:root{
  --primary:#6366f1;
  --primary-dark:#4f46e5;
  --secondary:#ec4899;
  --accent:#10b981;
  --warning:#f59e0b;
  --danger:#ef4444;
  --info:#0ea5e9;
  --dark:#1f2937;
  --gray:#6b7280;
  --light:#f3f4f6;
  --sidebar-w:260px;
  --sidebar-w-collapsed:80px;
  --topbar-h:65px;
  --gradient:linear-gradient(135deg,#6366f1 0%,#ec4899 100%);
  --shadow:0 4px 6px -1px rgba(0,0,0,.06);
  --shadow-lg:0 10px 25px rgba(0,0,0,.08);
  --radius:12px;
}

*{box-sizing:border-box}
body{
  font-family:'Inter','Segoe UI',Arial,sans-serif;
  background:#f3f4f6;color:var(--dark);margin:0;
  font-size:.92rem;
}

/* ===== SIDEBAR ===== */
.sidebar{
  width:var(--sidebar-w);position:fixed;top:0;left:0;bottom:0;
  background:#fff;border-right:1px solid #e5e7eb;
  z-index:1000;display:flex;flex-direction:column;
  transition:width .3s,transform .3s;
  overflow:hidden;
}
.sidebar-brand{
  height:var(--topbar-h);display:flex;align-items:center;
  padding:0 1.25rem;border-bottom:1px solid #f1f5f9;gap:.65rem;
}
.sidebar-brand img{height:38px;flex-shrink:0}
.sidebar-brand .brand-text{font-weight:800;font-size:1.05rem;white-space:nowrap}
.sidebar-brand .brand-text span{
  background:var(--gradient);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}
.sidebar-nav{flex:1;overflow-y:auto;padding:1rem .75rem;scrollbar-width:thin}
.sidebar-nav::-webkit-scrollbar{width:5px}
.sidebar-nav::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:5px}

.nav-section-title{
  font-size:.7rem;font-weight:700;color:#9ca3af;
  text-transform:uppercase;letter-spacing:1.5px;
  padding:.75rem .75rem .35rem;
}
.sidebar-nav .nav-link{
  display:flex;align-items:center;gap:.75rem;
  padding:.65rem .85rem;border-radius:8px;
  color:#4b5563;font-weight:500;margin-bottom:2px;
  transition:all .2s;cursor:pointer;
}
.sidebar-nav .nav-link:hover{background:#f3f4f6;color:var(--primary)}
.sidebar-nav .nav-link.active{
  background:var(--gradient);color:#fff;
  box-shadow:0 4px 12px rgba(99,102,241,.3);
}
.sidebar-nav .nav-link i{width:20px;font-size:1rem;text-align:center}
.sidebar-nav .nav-link .badge{margin-left:auto;font-size:.65rem}
.sidebar-nav .nav-link .arrow{margin-left:auto;transition:transform .2s;font-size:.7rem}
.sidebar-nav .nav-link[aria-expanded="true"] .arrow{transform:rotate(90deg)}

.submenu{padding-left:1.5rem;list-style:none;margin:.25rem 0 0}
.submenu .nav-link{padding:.45rem .85rem;font-size:.875rem}
.submenu .nav-link::before{
  content:'';width:6px;height:6px;border-radius:50%;background:#d1d5db;
  display:inline-block;margin-right:.25rem;
}
.submenu .nav-link.active{background:#eef2ff;color:var(--primary);box-shadow:none}
.submenu .nav-link.active::before{background:var(--primary)}

.sidebar-footer{
  padding:1rem;border-top:1px solid #f1f5f9;
}
.user-card{
  display:flex;align-items:center;gap:.65rem;
  padding:.5rem;border-radius:10px;background:#f9fafb;
}
.user-card .avatar{
  width:36px;height:36px;border-radius:50%;
  background:var(--gradient);color:#fff;display:flex;
  align-items:center;justify-content:center;font-weight:700;font-size:.85rem;
  flex-shrink:0;
}
.user-card .info{flex:1;min-width:0}
.user-card .info h6{margin:0;font-size:.85rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-card .info small{color:var(--gray);font-size:.75rem}

/* Collapsed */
.sidebar.collapsed{width:var(--sidebar-w-collapsed)}
.sidebar.collapsed .brand-text,
.sidebar.collapsed .nav-section-title,
.sidebar.collapsed .nav-link span:not(.badge),
.sidebar.collapsed .arrow,
.sidebar.collapsed .badge,
.sidebar.collapsed .submenu,
.sidebar.collapsed .user-card .info{display:none}
.sidebar.collapsed .nav-link{justify-content:center}

/* ===== TOPBAR ===== */
.main-wrap{
  margin-left:var(--sidebar-w);transition:margin-left .3s;
  min-height:100vh;display:flex;flex-direction:column;
}
.sidebar.collapsed ~ .main-wrap{margin-left:var(--sidebar-w-collapsed)}
.topbar{
  height:var(--topbar-h);background:#fff;
  border-bottom:1px solid #e5e7eb;
  display:flex;align-items:center;padding:0 1.25rem;gap:1rem;
  position:sticky;top:0;z-index:999;
}
.btn-icon{
  width:40px;height:40px;border-radius:10px;border:0;background:#f3f4f6;
  color:#4b5563;display:inline-flex;align-items:center;justify-content:center;
  transition:all .2s;font-size:1rem;position:relative;
}
.btn-icon:hover{background:var(--primary);color:#fff}
.btn-icon .dot{
  position:absolute;top:8px;right:9px;width:8px;height:8px;
  background:var(--danger);border:2px solid #fff;border-radius:50%;
}
.search-box{flex:1;max-width:380px;position:relative}
.search-box input{
  width:100%;border:1px solid #e5e7eb;border-radius:10px;
  padding:.55rem 1rem .55rem 2.5rem;background:#f9fafb;font-size:.9rem;
}
.search-box input:focus{outline:none;border-color:var(--primary);background:#fff}
.search-box i{position:absolute;left:.9rem;top:50%;transform:translateY(-50%);color:#9ca3af}

.topbar .ml-auto-group{margin-left:auto;display:flex;align-items:center;gap:.5rem}
.topbar-user{
  display:flex;align-items:center;gap:.5rem;cursor:pointer;
  padding:.25rem .5rem;border-radius:10px;transition:background .2s;
}
.topbar-user:hover{background:#f3f4f6}
.topbar-user .avatar{
  width:38px;height:38px;border-radius:50%;background:var(--gradient);
  color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem;
}
.topbar-user .meta{line-height:1.1}
.topbar-user .meta strong{font-size:.85rem;display:block}
.topbar-user .meta small{font-size:.7rem;color:var(--gray)}

/* ===== CONTENT ===== */
.content{padding:1.5rem;flex:1}
.page-head{
  display:flex;align-items:center;flex-wrap:wrap;gap:1rem;
  margin-bottom:1.25rem;
}
.page-head h4{margin:0;font-weight:800}
.page-head .breadcrumb{margin:0;background:none;padding:0;font-size:.825rem}
.page-head .breadcrumb-item a{color:var(--primary);text-decoration:none}
.page-head .ml-auto{margin-left:auto;display:flex;gap:.5rem;flex-wrap:wrap}

/* Stat cards */
.stat-card{
  background:#fff;border-radius:var(--radius);padding:1.25rem;
  box-shadow:var(--shadow);border:1px solid #f1f5f9;
  display:flex;align-items:center;gap:1rem;
  position:relative;overflow:hidden;height:100%;
}
.stat-card::before{
  content:'';position:absolute;top:0;left:0;width:4px;height:100%;
  background:var(--primary);
}
.stat-card.success::before{background:var(--accent)}
.stat-card.warning::before{background:var(--warning)}
.stat-card.danger::before{background:var(--danger)}
.stat-card.info::before{background:var(--info)}

.stat-icon{
  width:50px;height:50px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(99,102,241,.1);color:var(--primary);font-size:1.3rem;
  flex-shrink:0;
}
.stat-card.success .stat-icon{background:rgba(16,185,129,.1);color:var(--accent)}
.stat-card.warning .stat-icon{background:rgba(245,158,11,.1);color:var(--warning)}
.stat-card.danger .stat-icon{background:rgba(239,68,68,.1);color:var(--danger)}
.stat-card.info .stat-icon{background:rgba(14,165,233,.1);color:var(--info)}

.stat-card .label{color:var(--gray);font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}
.stat-card .value{font-size:1.6rem;font-weight:800;line-height:1.1}
.stat-card .delta{font-size:.75rem;font-weight:600;margin-top:.15rem}
.stat-card .delta.up{color:var(--accent)}
.stat-card .delta.down{color:var(--danger)}

/* Cards */
.card-erp{
  background:#fff;border-radius:var(--radius);
  border:1px solid #f1f5f9;box-shadow:var(--shadow);
  margin-bottom:1.25rem;
}
.card-erp .card-head{
  display:flex;align-items:center;gap:.75rem;
  padding:1rem 1.25rem;border-bottom:1px solid #f1f5f9;
}
.card-erp .card-head h5{margin:0;font-weight:700;font-size:1rem}
.card-erp .card-head .ml-auto{margin-left:auto}
.card-erp .card-body{padding:1.25rem}

/* Tabs */
.nav-tabs-erp{border:0;border-bottom:1px solid #e5e7eb;gap:.25rem}
.nav-tabs-erp .nav-link{
  border:0;color:var(--gray);font-weight:600;padding:.75rem 1.1rem;
  border-radius:8px 8px 0 0;background:none;position:relative;
}
.nav-tabs-erp .nav-link:hover{color:var(--primary);background:#f9fafb}
.nav-tabs-erp .nav-link.active{
  color:var(--primary);background:none;
}
.nav-tabs-erp .nav-link.active::after{
  content:'';position:absolute;left:0;right:0;bottom:-1px;height:3px;
  background:var(--gradient);border-radius:3px 3px 0 0;
}

/* Forms */
.form-erp .form-label{font-weight:600;font-size:.85rem;margin-bottom:.35rem;color:#374151}
.form-erp .form-control,
.form-erp .form-select{
  border:1.5px solid #e5e7eb;border-radius:8px;padding:.55rem .75rem;font-size:.9rem;
}
.form-erp .form-control:focus,
.form-erp .form-select:focus{
  border-color:var(--primary);box-shadow:0 0 0 .2rem rgba(99,102,241,.12);
}
.form-erp .input-group-text{background:#f9fafb;border:1.5px solid #e5e7eb}
.form-section{
  padding:1.25rem;border:1px solid #e5e7eb;border-radius:10px;margin-bottom:1.25rem;
  background:#ffffff;box-shadow:var(--shadow-sm);
}
.form-section h6{
  font-weight:700;color:var(--primary);margin-bottom:1rem;
  display:flex;align-items:center;gap:.5rem;
}

/* Switches custom */
.form-switch .form-check-input{
  width:42px;height:22px;cursor:pointer;
}
.form-switch .form-check-input:checked{background-color:var(--primary);border-color:var(--primary)}

/* Buttons */
.btn-primary-erp{
  background:var(--gradient);color:#fff;border:0;
  padding:.5rem 1.2rem;border-radius:8px;font-weight:600;font-size:.875rem;
}
.btn-primary-erp:hover{color:#fff;box-shadow:0 6px 14px rgba(99,102,241,.3)}
.btn-soft{
  background:#eef2ff;color:var(--primary);border:0;
  padding:.5rem 1rem;border-radius:8px;font-weight:600;font-size:.875rem;
}
.btn-soft:hover{background:var(--primary);color:#fff}
.btn-soft.success{background:rgba(16,185,129,.12);color:var(--accent)}
.btn-soft.warning{background:rgba(245,158,11,.12);color:var(--warning)}
.btn-soft.danger{background:rgba(239,68,68,.12);color:var(--danger)}

/* Badges status */
.badge-status{
  padding:.35rem .65rem;border-radius:50px;font-weight:600;font-size:.7rem;
  text-transform:uppercase;letter-spacing:.5px;
}
.badge-status.active{background:rgba(16,185,129,.12);color:var(--accent)}
.badge-status.pending{background:rgba(245,158,11,.12);color:var(--warning)}
.badge-status.inactive{background:rgba(239,68,68,.12);color:var(--danger)}
.badge-status.draft{background:rgba(107,114,128,.12);color:var(--gray)}
.badge-status.processing{background:rgba(14,165,233,.12);color:var(--info)}

/* DataTables overrides */
table.dataTable{border-collapse:separate!important;border-spacing:0}
table.dataTable thead th{
  background:#f9fafb;border-bottom:2px solid #e5e7eb!important;
  font-weight:700;color:#374151;font-size:.78rem;
  text-transform:uppercase;letter-spacing:.5px;padding:.85rem .75rem;
}
table.dataTable tbody td{padding:.75rem;vertical-align:middle;border-color:#f1f5f9}
table.dataTable tbody tr:hover{background:#f9fafb}
.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .dataTables_filter input{
  border:1.5px solid #e5e7eb;border-radius:8px;padding:.35rem .65rem;
}
.dataTables_wrapper .dataTables_paginate .paginate_button{
  border-radius:6px!important;margin:0 2px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current{
  background:var(--gradient)!important;color:#fff!important;border:0!important;
}
.product-thumb{
  width:42px;height:42px;border-radius:8px;object-fit:cover;background:#f3f4f6;
}
.user-cell{display:flex;align-items:center;gap:.65rem}
.user-cell .avatar{
  width:36px;height:36px;border-radius:50%;background:var(--gradient);
  color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.8rem;
}
.user-cell .meta strong{display:block;font-size:.875rem}
.user-cell .meta small{color:var(--gray);font-size:.75rem}

/* Action buttons */
.act-btn{
  width:30px;height:30px;border-radius:6px;border:0;background:#f3f4f6;
  display:inline-flex;align-items:center;justify-content:center;color:#4b5563;
  margin:0 1px;font-size:.8rem;transition:all .2s;
}
.act-btn:hover{background:var(--primary);color:#fff}
.act-btn.danger:hover{background:var(--danger)}
.act-btn.success:hover{background:var(--accent)}

/* Profile */
.profile-cover{
  height:160px;border-radius:var(--radius);background:var(--gradient);
  position:relative;
}
.profile-head{
  background:#fff;border-radius:var(--radius);padding:1.25rem;
  box-shadow:var(--shadow);margin-top:-60px;position:relative;
  display:flex;gap:1.25rem;align-items:flex-end;flex-wrap:wrap;
}
.profile-avatar{
  width:110px;height:110px;border-radius:50%;background:var(--gradient);
  color:#fff;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:2.5rem;border:5px solid #fff;
  box-shadow:var(--shadow);flex-shrink:0;
}

/* RESPONSIVE */
.sidebar-overlay{
  position:fixed;inset:0;background:rgba(15,23,42,.5);z-index:999;
  display:none;
}
@media(max-width:991px){
  .sidebar{transform:translateX(-100%)}
  .sidebar.show{transform:translateX(0)}
  .main-wrap{margin-left:0!important}
  .sidebar-overlay.show{display:block}
}
@media(max-width:575px){
  .topbar-user .meta{display:none}
  .search-box{display:none}
  .content{padding:1rem}
  .page-head h4{font-size:1.15rem}
  .stat-card .value{font-size:1.3rem}
}

/* ===== UNIFIED FILTER BAR ===== */
.filter-bar{
  background:linear-gradient(135deg,#f9fafb,#f3f4f6);
  border:1px solid #e5e7eb;border-radius:12px;
  padding:.75rem;margin-bottom:1rem;
  display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;
}
.filter-bar .fb-search{
  flex:1;min-width:220px;position:relative;
}
.filter-bar .fb-search input{
  width:100%;padding:.5rem .85rem .5rem 2.4rem;
  border:1.5px solid #e5e7eb;border-radius:8px;background:#fff;
  font-size:.875rem;transition:all .2s;
}
.filter-bar .fb-search input:focus{
  outline:none;border-color:var(--primary);
  box-shadow:0 0 0 .2rem rgba(99,102,241,.12);
}
.filter-bar .fb-search i{
  position:absolute;left:.85rem;top:50%;transform:translateY(-50%);
  color:#9ca3af;
}
.filter-bar .fb-select,
.filter-bar .fb-date{
  border:1.5px solid #e5e7eb;border-radius:8px;
  padding:.45rem .75rem;background:#fff;font-size:.85rem;
  min-width:140px;
}
.filter-bar .fb-select:focus,
.filter-bar .fb-date:focus{
  outline:none;border-color:var(--primary);
  box-shadow:0 0 0 .2rem rgba(99,102,241,.12);
}
.filter-bar .fb-btn{
  border:0;background:var(--gradient);color:#fff;
  padding:.45rem .9rem;border-radius:8px;font-size:.85rem;font-weight:600;
  display:inline-flex;align-items:center;gap:.35rem;
}
.filter-bar .fb-btn.ghost{
  background:#fff;color:var(--gray);border:1.5px solid #e5e7eb;
}
.filter-bar .fb-btn.ghost:hover{border-color:var(--primary);color:var(--primary)}
.filter-bar .fb-divider{
  width:1px;height:28px;background:#e5e7eb;margin:0 .25rem;
}
.filter-bar .fb-chip{
  display:inline-flex;align-items:center;gap:.35rem;
  background:#eef2ff;color:var(--primary);
  padding:.3rem .65rem;border-radius:50px;font-size:.78rem;font-weight:600;
}
.filter-bar .fb-chip .x{
  cursor:pointer;border:0;background:none;color:var(--primary);
  padding:0;line-height:1;font-size:1rem;
}
.filter-bar .toggle-pills{
  display:inline-flex;background:#fff;border:1.5px solid #e5e7eb;
  border-radius:8px;padding:2px;
}
.filter-bar .toggle-pills button{
  border:0;background:none;padding:.3rem .75rem;border-radius:6px;
  font-size:.78rem;color:var(--gray);font-weight:600;
}
.filter-bar .toggle-pills button.active{
  background:var(--gradient);color:#fff;
}
@media(max-width:575px){
  .filter-bar .fb-select,.filter-bar .fb-date{min-width:0;flex:1}
  .filter-bar .fb-divider{display:none}
}

/* SweetAlert2 overrides — match ERP theme */
.swal2-popup{
  border-radius:16px!important;font-family:'Inter','Segoe UI',Arial,sans-serif!important;
}
.swal2-title{font-weight:800!important;font-size:1.25rem!important}
.swal2-html-container{font-size:.92rem!important;color:var(--gray)!important}
.swal2-confirm.swal2-styled{
  background:var(--gradient)!important;border-radius:8px!important;
  font-weight:600!important;padding:.55rem 1.5rem!important;
  box-shadow:0 4px 12px rgba(99,102,241,.3)!important;
}
.swal2-cancel.swal2-styled{
  border-radius:8px!important;font-weight:600!important;
  padding:.55rem 1.5rem!important;background:#f3f4f6!important;color:var(--dark)!important;
}
.swal2-icon.swal2-success{border-color:var(--accent)!important;color:var(--accent)!important}
.swal2-icon.swal2-success .swal2-success-ring{border-color:var(--accent)!important}
.swal2-icon.swal2-success [class^=swal2-success-line]{background:var(--accent)!important}
.swal2-icon.swal2-warning{border-color:var(--warning)!important;color:var(--warning)!important}
.swal2-icon.swal2-error{border-color:var(--danger)!important;color:var(--danger)!important}
.swal2-icon.swal2-info{border-color:var(--info)!important;color:var(--info)!important}
.swal2-icon.swal2-question{border-color:var(--primary)!important;color:var(--primary)!important}
.swal2-toast{border-radius:12px!important;box-shadow:var(--shadow-lg)!important}

/* Charts container */
.chart-wrap{position:relative;height:300px}
.chart-wrap.sm{height:220px}

/* ============================================================
   TOPBAR DROPDOWNS (messages / notifications / quick add / user)
   ============================================================ */
.topbar .dropdown-menu.tb-dd{
  min-width:280px;border:1px solid #e5e7eb;border-radius:14px;
  padding:0;overflow:hidden;box-shadow:var(--shadow-lg);margin-top:.5rem;
}
.topbar .dropdown-menu.tb-dd-wide{min-width:360px}
.tb-dd-head{
  display:flex;align-items:center;gap:.5rem;
  padding:.85rem 1rem;border-bottom:1px solid #f1f5f9;
  font-size:.92rem;background:#f9fafb;
}
.tb-dd-head strong{font-weight:700;color:var(--dark)}
.tb-dd-foot{
  display:block;padding:.7rem 1rem;text-align:center;
  border-top:1px solid #f1f5f9;background:#f9fafb;
  font-size:.82rem;font-weight:600;color:var(--primary);
  text-decoration:none;
}
.tb-dd-foot:hover{background:#eef2ff;color:var(--primary-dark)}
.tb-list{max-height:360px;overflow-y:auto;scrollbar-width:thin}
.tb-list::-webkit-scrollbar{width:6px}
.tb-list::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:6px}
.tb-item{
  display:flex;gap:.75rem;align-items:flex-start;
  padding:.75rem 1rem;border-bottom:1px solid #f1f5f9;
  text-decoration:none;color:inherit;transition:background .15s;
  position:relative;
}
.tb-item:last-child{border-bottom:0}
.tb-item:hover{background:#f9fafb}
.tb-avatar{
  flex-shrink:0;width:38px;height:38px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  color:#fff;font-weight:700;font-size:.78rem;
}
.tb-avatar.lg{width:54px;height:54px;font-size:1.05rem}
.tb-icon{
  flex-shrink:0;width:38px;height:38px;border-radius:10px;
  display:inline-flex;align-items:center;justify-content:center;
}
.tb-body{flex:1;min-width:0;font-size:.83rem;line-height:1.35}
.tb-body strong{font-size:.85rem;font-weight:600;color:var(--dark);display:block}
.tb-unread{
  position:absolute;right:1rem;top:50%;transform:translateY(-50%);
  width:8px;height:8px;border-radius:50%;background:var(--primary);
}
.tb-quick-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:.25rem;padding:.75rem;
}
.tb-quick{
  display:flex;flex-direction:column;align-items:center;gap:.4rem;
  padding:.85rem .35rem;border-radius:10px;text-decoration:none;color:var(--dark);
  font-size:.72rem;font-weight:600;text-align:center;transition:background .15s;
}
.tb-quick:hover{background:#f3f4f6;color:var(--primary)}
.tb-quick i{
  width:36px;height:36px;border-radius:10px;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:.95rem;
}
.tb-user-head{
  display:flex;align-items:center;gap:.85rem;padding:1rem;
  background:linear-gradient(135deg,#eef2ff,#fce7f3);
}
.tb-dd-item{
  padding:.55rem 1rem;font-size:.875rem;display:flex;align-items:center;
}
.tb-dd-item:hover{background:#f3f4f6}
.tb-dd-item i{width:18px}
.topbar .topbar-user{user-select:none}

/* Dark mode: dropdowns */
body.dark-mode .topbar .dropdown-menu.tb-dd{background:#1e293b;border-color:#334155;color:#e5e7eb}
body.dark-mode .tb-dd-head{background:#0f172a;border-bottom-color:#334155}
body.dark-mode .tb-dd-head strong{color:#f1f5f9}
body.dark-mode .tb-dd-foot{background:#0f172a;border-top-color:#334155;color:#a5b4fc}
body.dark-mode .tb-dd-foot:hover{background:#334155}
body.dark-mode .tb-item{border-bottom-color:#334155;color:#e5e7eb}
body.dark-mode .tb-item:hover{background:#0f172a}
body.dark-mode .tb-body strong{color:#f1f5f9}
body.dark-mode .tb-quick:hover{background:#334155;color:#a5b4fc}
body.dark-mode .tb-quick{color:#cbd5e1}
body.dark-mode .tb-user-head{background:linear-gradient(135deg,rgba(99,102,241,.15),rgba(236,72,153,.15))}
body.dark-mode .tb-dd-item{color:#e5e7eb}
body.dark-mode .tb-dd-item:hover{background:#334155;color:#fff}
body.dark-mode .dropdown-divider{border-top-color:#334155}

/* ============================================================
   DARK MODE
   ============================================================ */
body.dark-mode{
  --primary:#818cf8;
  --primary-dark:#6366f1;
  --secondary:#f472b6;
  --accent:#34d399;
  --warning:#fbbf24;
  --danger:#f87171;
  --info:#38bdf8;
  --dark:#f3f4f6;
  --gray:#9ca3af;
  --light:#1f2937;
  --gradient:linear-gradient(135deg,#6366f1 0%,#ec4899 100%);
  --shadow:0 4px 12px rgba(0,0,0,.3);
  --shadow-lg:0 12px 32px rgba(0,0,0,.4);
  background:#0f172a;color:#e5e7eb;
}
body.dark-mode .sidebar{background:#1e293b;border-right-color:#334155}
body.dark-mode .sidebar-brand{border-bottom-color:#334155}
body.dark-mode .sidebar-brand .brand-text{color:#f1f5f9}
body.dark-mode .sidebar-nav .nav-link{color:#cbd5e1}
body.dark-mode .sidebar-nav .nav-link:hover{background:#334155;color:#fff}
body.dark-mode .submenu .nav-link.active{background:rgba(99,102,241,.2);color:#a5b4fc}
body.dark-mode .submenu .nav-link::before{background:#475569}
body.dark-mode .nav-section-title{color:#64748b}
body.dark-mode .sidebar-footer{border-top-color:#334155}
body.dark-mode .user-card{background:#0f172a}
body.dark-mode .user-card .info h6{color:#f1f5f9}
body.dark-mode .topbar{background:#1e293b;border-bottom-color:#334155}
body.dark-mode .btn-icon{background:#334155;color:#cbd5e1}
body.dark-mode .btn-icon:hover{background:var(--primary);color:#fff}
body.dark-mode .btn-icon .dot{border-color:#1e293b}
body.dark-mode .search-box input{background:#0f172a;border-color:#334155;color:#e5e7eb}
body.dark-mode .search-box input:focus{background:#0f172a;border-color:var(--primary)}
body.dark-mode .search-box input::placeholder{color:#64748b}
body.dark-mode .topbar-user:hover{background:#334155}
body.dark-mode .topbar-user .meta strong{color:#f1f5f9}
body.dark-mode .page-head h4{color:#f1f5f9}
body.dark-mode .breadcrumb-item.active,
body.dark-mode .breadcrumb-item+.breadcrumb-item::before{color:#64748b}
body.dark-mode .stat-card{background:#1e293b;border-color:#334155}
body.dark-mode .stat-card .label{color:#94a3b8}
body.dark-mode .stat-card .value{color:#f1f5f9}
body.dark-mode .card-erp{background:#1e293b;border-color:#334155;color:#e5e7eb}
body.dark-mode .card-erp .card-head{border-bottom-color:#334155}
body.dark-mode .card-erp .card-head h5{color:#f1f5f9}
body.dark-mode .card-erp hr{border-color:#334155}
body.dark-mode .nav-tabs-erp{border-bottom-color:#334155}
body.dark-mode .nav-tabs-erp .nav-link{color:#94a3b8}
body.dark-mode .nav-tabs-erp .nav-link:hover{background:#0f172a;color:#a5b4fc}
body.dark-mode .nav-tabs-erp .nav-link.active{color:#a5b4fc}
body.dark-mode .form-erp .form-label{color:#cbd5e1}
body.dark-mode .form-erp .form-control,
body.dark-mode .form-erp .form-select,
body.dark-mode .form-control,
body.dark-mode .form-select{
  background:#0f172a;border-color:#334155;color:#e5e7eb;
}
body.dark-mode .form-erp .form-control:focus,
body.dark-mode .form-erp .form-select:focus,
body.dark-mode .form-control:focus,
body.dark-mode .form-select:focus{
  background:#0f172a;color:#e5e7eb;border-color:var(--primary);
  box-shadow:0 0 0 .2rem rgba(129,140,248,.2);
}
body.dark-mode .form-control::placeholder{color:#64748b}
body.dark-mode .form-erp .input-group-text{background:#0f172a;border-color:#334155;color:#94a3b8}
body.dark-mode .form-section{border-color:#334155;background:rgba(255,255,255,.02)}
body.dark-mode .form-section h6{color:#a5b4fc}
body.dark-mode .form-check-input{background-color:#334155;border-color:#475569}
body.dark-mode .form-check-input:checked{background-color:var(--primary);border-color:var(--primary)}
body.dark-mode .form-check-label{color:#cbd5e1}

/* Filter bar dark */
body.dark-mode .filter-bar{background:linear-gradient(135deg,#1e293b,#0f172a);border-color:#334155}
body.dark-mode .filter-bar .fb-search input,
body.dark-mode .filter-bar .fb-select,
body.dark-mode .filter-bar .fb-date{
  background:#1e293b;border-color:#334155;color:#e5e7eb;
}
body.dark-mode .filter-bar .fb-search input::placeholder{color:#64748b}
body.dark-mode .filter-bar .fb-search i{color:#64748b}
body.dark-mode .filter-bar .fb-btn.ghost{background:#1e293b;border-color:#334155;color:#94a3b8}
body.dark-mode .filter-bar .fb-btn.ghost:hover{border-color:var(--primary);color:#a5b4fc}
body.dark-mode .filter-bar .toggle-pills{background:#1e293b;border-color:#334155}
body.dark-mode .filter-bar .toggle-pills button{color:#94a3b8}
body.dark-mode .filter-bar .fb-divider{background:#334155}

/* Buttons dark */
body.dark-mode .btn-soft{background:rgba(99,102,241,.2);color:#a5b4fc}
body.dark-mode .btn-soft:hover{background:var(--primary);color:#fff}
body.dark-mode .btn-soft.danger{background:rgba(248,113,113,.15);color:#fca5a5}
body.dark-mode .btn-soft.success{background:rgba(52,211,153,.15);color:#6ee7b7}
body.dark-mode .btn-soft.warning{background:rgba(251,191,36,.15);color:#fcd34d}
body.dark-mode .btn-light{background:#334155;color:#e5e7eb;border-color:#475569}

/* DataTables dark */
body.dark-mode table.dataTable{color:#e5e7eb}
body.dark-mode table.dataTable thead th{background:#0f172a!important;color:#cbd5e1;border-bottom-color:#334155!important}
body.dark-mode table.dataTable tbody td{border-color:#334155;color:#e5e7eb}
body.dark-mode table.dataTable tbody tr{background:#1e293b}
body.dark-mode table.dataTable tbody tr:hover{background:#0f172a}
body.dark-mode .table thead{background:#0f172a!important}
body.dark-mode .table thead tr,
body.dark-mode .table thead th{background:#0f172a!important;color:#cbd5e1;border-color:#334155!important}
body.dark-mode .table tbody td{border-color:#334155;color:#e5e7eb}
body.dark-mode .table tbody tr:hover{background:#0f172a}
body.dark-mode .dataTables_wrapper .dataTables_length,
body.dark-mode .dataTables_wrapper .dataTables_filter,
body.dark-mode .dataTables_wrapper .dataTables_info,
body.dark-mode .dataTables_wrapper .dataTables_paginate{color:#94a3b8}
body.dark-mode .dataTables_wrapper .dataTables_length select,
body.dark-mode .dataTables_wrapper .dataTables_filter input{
  background:#0f172a;border-color:#334155;color:#e5e7eb;
}
body.dark-mode .dataTables_wrapper .dataTables_paginate .paginate_button{
  color:#94a3b8!important;
}
body.dark-mode .dataTables_wrapper .dataTables_paginate .paginate_button:hover{
  background:#334155!important;color:#fff!important;border-color:#334155!important;
}
body.dark-mode .act-btn{background:#334155;color:#cbd5e1}
body.dark-mode .act-btn:hover{background:var(--primary);color:#fff}
body.dark-mode code{background:#0f172a;color:#a5b4fc}
body.dark-mode .text-muted{color:#94a3b8!important}
body.dark-mode .text-dark{color:#e5e7eb!important}
body.dark-mode small.text-muted,
body.dark-mode .small.text-muted{color:#94a3b8!important}
body.dark-mode .badge.bg-light{background:#334155!important;color:#e5e7eb!important;border-color:#475569!important}
body.dark-mode .badge.bg-secondary{background:#475569!important}

/* Status badges dark */
body.dark-mode .badge-status.active{background:rgba(52,211,153,.18);color:#6ee7b7}
body.dark-mode .badge-status.pending{background:rgba(251,191,36,.18);color:#fcd34d}
body.dark-mode .badge-status.inactive{background:rgba(248,113,113,.18);color:#fca5a5}
body.dark-mode .badge-status.draft{background:rgba(148,163,184,.18);color:#cbd5e1}
body.dark-mode .badge-status.processing{background:rgba(56,189,248,.18);color:#7dd3fc}

/* Modals dark */
body.dark-mode .modal-content{background:#1e293b;color:#e5e7eb;border:1px solid #334155}
body.dark-mode .modal-header{border-bottom-color:#334155}
body.dark-mode .modal-footer{border-top-color:#334155}
body.dark-mode .modal-title{color:#f1f5f9}
body.dark-mode .btn-close{filter:invert(1) brightness(1.5)}

/* Alerts/badges */
body.dark-mode .alert{background:rgba(255,255,255,.05);border-color:#334155;color:#e5e7eb}
body.dark-mode .progress{background:#0f172a}

/* Profile dark */
body.dark-mode .profile-head{background:#1e293b}
body.dark-mode .list-group-item{background:#1e293b;color:#e5e7eb;border-color:#334155}

/* Status icons in stat-card stay colourful — only dim background */
body.dark-mode .stat-icon{background:rgba(99,102,241,.15)!important}
body.dark-mode .stat-card.success .stat-icon{background:rgba(52,211,153,.15)!important}
body.dark-mode .stat-card.warning .stat-icon{background:rgba(251,191,36,.15)!important}
body.dark-mode .stat-card.danger .stat-icon{background:rgba(248,113,113,.15)!important}
body.dark-mode .stat-card.info .stat-icon{background:rgba(56,189,248,.15)!important}

/* SweetAlert dark */
body.dark-mode .swal2-popup{background:#1e293b!important;color:#e5e7eb!important}
body.dark-mode .swal2-title{color:#f1f5f9!important}
body.dark-mode .swal2-html-container{color:#cbd5e1!important}
body.dark-mode .swal2-cancel.swal2-styled{background:#334155!important;color:#e5e7eb!important}

/* Flatpickr dark */
body.dark-mode .flatpickr-calendar{background:#1e293b;border-color:#334155;box-shadow:var(--shadow-lg)}
body.dark-mode .flatpickr-calendar.arrowTop:before,
body.dark-mode .flatpickr-calendar.arrowTop:after{border-bottom-color:#334155}
body.dark-mode .flatpickr-day{color:#cbd5e1;background:transparent;border-color:transparent}
body.dark-mode .flatpickr-day:hover{background:#334155;color:#fff}
body.dark-mode .flatpickr-day.today{border-color:var(--primary);color:var(--primary)}
body.dark-mode .flatpickr-day.selected{background:var(--primary);color:#fff;border-color:var(--primary)}
body.dark-mode .flatpickr-day.flatpickr-disabled,
body.dark-mode .flatpickr-day.prevMonthDay,
body.dark-mode .flatpickr-day.nextMonthDay{color:#475569}
body.dark-mode .flatpickr-weekday,
body.dark-mode .flatpickr-current-month input.cur-year,
body.dark-mode .flatpickr-monthDropdown-months{color:#cbd5e1;background:#1e293b}
body.dark-mode .flatpickr-monthDropdown-months option{background:#1e293b}
body.dark-mode .flatpickr-months .flatpickr-prev-month svg,
body.dark-mode .flatpickr-months .flatpickr-next-month svg{fill:#cbd5e1}
body.dark-mode .flatpickr-time input,
body.dark-mode .flatpickr-time .flatpickr-time-separator,
body.dark-mode .flatpickr-time .flatpickr-am-pm{color:#cbd5e1;background:#1e293b}
body.dark-mode .flatpickr-time input:hover,
body.dark-mode .flatpickr-time .flatpickr-am-pm:hover{background:#334155}

/* List items */
.list-item{
  display:flex;align-items:center;gap:.75rem;
  padding:.75rem 0;border-bottom:1px solid #f1f5f9;
}
.list-item:last-child{border-bottom:0}
.list-item .icon-sq{
  width:40px;height:40px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  background:#eef2ff;color:var(--primary);flex-shrink:0;
}
.list-item .body{flex:1;min-width:0}
.list-item .body strong{display:block;font-size:.9rem}
.list-item .body small{color:var(--gray);font-size:.78rem}

/* Switch view (grid/card layout switcher) */
.view-switch{
  display:inline-flex;background:#f3f4f6;border-radius:8px;padding:3px;
}
.view-switch button{
  border:0;background:none;padding:.4rem .7rem;border-radius:6px;
  color:var(--gray);font-size:.85rem;
}
.view-switch button.active{background:#fff;color:var(--primary);box-shadow:var(--shadow-sm)}