/* ==========================================================================
   IDT POS — Modern Theme v3.2 (Banner Fixed)
   Date: 2026-05-15
   
   Bulletproof banner — forces compact height, proper layout
   ========================================================================== */

:root {
    --idt-text-primary: #0f172a;
    --idt-text-secondary: #475569;
    --idt-text-muted: #64748b;
    --idt-text-faded: #94a3b8;
    --idt-border: #e2e8f0;
    --idt-border-hover: #cbd5e1;
    --idt-bg-page: #f8fafc;
    --idt-bg-card: #ffffff;
    --idt-bg-hover: #f1f5f9;
    --idt-sidebar-bg: #1a2332;
    --idt-sidebar-active: #3b82f6;
    --idt-sidebar-text: #cbd5e1;
    --idt-sidebar-hover: #243042;
    --idt-banner-gradient: linear-gradient(135deg, #0f1e3d 0%, #1e3a8a 50%, #312e81 100%);
    --idt-radius-md: 10px;
    --idt-radius-lg: 14px;
    --idt-radius-xl: 16px;
    --idt-shadow-card: 0 4px 12px rgba(15, 23, 42, 0.08);
    --idt-shadow-card-hover: 0 8px 24px rgba(15, 23, 42, 0.15);
}

body.theme-dark {
    --idt-text-primary: #f1f5f9;
    --idt-text-secondary: #cbd5e1;
    --idt-text-muted: #94a3b8;
    --idt-text-faded: #64748b;
    --idt-border: rgba(255, 255, 255, 0.08);
    --idt-border-hover: rgba(255, 255, 255, 0.15);
    --idt-bg-page: #0f172a;
    --idt-bg-card: #1e293b;
    --idt-bg-hover: #243042;
    --idt-shadow-card: 0 4px 12px rgba(0, 0, 0, 0.4);
}

body.theme-dark {
    background-color: var(--idt-bg-page);
    color: var(--idt-text-primary);
}

.content-wrapper {
    background-color: var(--idt-bg-page) !important;
}

.content-wrapper .content,
.content-wrapper .content-header {
    padding: 16px !important;
}

/* ==========================================================================
   BANNER — Force compact height, no empty space
   ========================================================================== */
.skin-blue .content-wrapper .content-header-custom,
.skin-blue-light .content-wrapper .content-header-custom,
.skin-red .content-wrapper .content-header-custom,
.skin-red-light .content-wrapper .content-header-custom,
.skin-purple .content-wrapper .content-header-custom,
.skin-purple-light .content-wrapper .content-header-custom,
.skin-green .content-wrapper .content-header-custom,
.skin-green-light .content-wrapper .content-header-custom,
.skin-yellow .content-wrapper .content-header-custom,
.skin-yellow-light .content-wrapper .content-header-custom,
.skin-black .content-wrapper .content-header-custom,
.skin-black-light .content-wrapper .content-header-custom,
.content-header-custom {
    background: var(--idt-banner-gradient) !important;
    background-image: var(--idt-banner-gradient) !important;
    padding: 20px 26px !important;
    margin: 14px 14px 0 !important;
    border-radius: var(--idt-radius-xl) !important;
    position: relative !important;
    overflow: hidden !important;
    box-shadow: 0 4px 24px rgba(15, 23, 42, 0.15) !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: 130px !important;
    display: block !important;
}

.content-header-custom::before {
    content: '' !important;
    position: absolute !important;
    right: -60px !important;
    top: -60px !important;
    width: 240px !important;
    height: 240px !important;
    background: radial-gradient(circle, rgba(99, 102, 241, 0.3) 0%, transparent 70%) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.content-header-custom::after {
    content: '' !important;
    position: absolute !important;
    left: -40px !important;
    bottom: -40px !important;
    width: 180px !important;
    height: 180px !important;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.22) 0%, transparent 70%) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

/* Default H1 (fallback if JS hasn't run) */
.content-header-custom h1 {
    font-size: 22px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.4 !important;
    position: relative !important;
    z-index: 2 !important;
}

/* Enhanced banner flex layout */
.idt-banner-flex {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    position: relative !important;
    z-index: 2 !important;
    flex-wrap: wrap !important;
    width: 100% !important;
}

.idt-banner-left {
    flex: 1 1 auto !important;
    min-width: 200px !important;
}

.idt-banner-meta {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-bottom: 6px !important;
    flex-wrap: wrap !important;
}

/* Status badge — green pulsing dot */
.idt-status-badge {
    background: rgba(34, 197, 94, 0.22) !important;
    color: #86efac !important;
    font-size: 11px !important;
    padding: 3px 10px 3px 9px !important;
    border-radius: 12px !important;
    font-weight: 500 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    line-height: 1 !important;
    border: 1px solid rgba(34, 197, 94, 0.3) !important;
}

.idt-status-dot {
    width: 7px !important;
    height: 7px !important;
    background: #22c55e !important;
    border-radius: 50% !important;
    display: inline-block !important;
    box-shadow: 0 0 8px #22c55e !important;
    animation: idt-pulse 2s ease-in-out infinite !important;
    flex-shrink: 0 !important;
}

@keyframes idt-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.6; transform: scale(1.25); }
}

.idt-banner-date {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 12px !important;
    font-weight: 400 !important;
}

.idt-banner-title {
    font-size: 22px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    margin: 0 !important;
    padding: 0 !important;
    letter-spacing: -0.01em !important;
    line-height: 1.3 !important;
    display: block !important;
}

.idt-wave {
    display: inline-block !important;
    animation: idt-wave 2.5s ease-in-out infinite !important;
    transform-origin: 70% 70% !important;
}

@keyframes idt-wave {
    0%, 60%, 100% { transform: rotate(0deg); }
    10%, 30% { transform: rotate(14deg); }
    20% { transform: rotate(-8deg); }
    40% { transform: rotate(-4deg); }
    50% { transform: rotate(10deg); }
}

/* Right side controls */
.idt-banner-right {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    flex-shrink: 0 !important;
    flex-wrap: wrap !important;
}

.idt-banner-placeholder {
    /* Empty placeholder while JS loads */
    min-width: 1px;
    min-height: 1px;
}

/* Location selector in banner */
.idt-banner-location {
    display: inline-block;
}

.idt-banner-location select.form-control,
.idt-banner-location .select2-container--default .select2-selection--single {
    background: rgba(255, 255, 255, 0.15) !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
    height: 38px !important;
    border-radius: 10px !important;
    min-width: 160px !important;
    -webkit-backdrop-filter: blur(10px) !important;
    backdrop-filter: blur(10px) !important;
}

.idt-banner-location .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #ffffff !important;
    line-height: 36px !important;
    padding-left: 12px !important;
}

.idt-banner-location .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 36px !important;
}

.idt-banner-location .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #ffffff transparent transparent transparent !important;
}

.idt-banner-location .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}

/* Filter button in banner */
.idt-banner-filter-btn {
    display: inline-block;
}

.idt-banner-filter-btn #dashboard_date_filter,
.idt-banner-right #dashboard_date_filter {
    background: rgba(255, 255, 255, 0.2) !important;
    background-image: none !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    backdrop-filter: blur(10px) !important;
    color: #ffffff !important;
    padding: 9px 16px !important;
    border-radius: 10px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
    height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.idt-banner-filter-btn #dashboard_date_filter:hover {
    background: rgba(255, 255, 255, 0.3) !important;
    border-color: rgba(255, 255, 255, 0.45) !important;
    transform: translateY(-1px) !important;
    color: #ffffff !important;
}

/* Force kill the original location/filter row */
.content-custom > br + .row:first-of-type:has(#dashboard_date_filter),
.content-custom > .row:first-child:has(#dashboard_date_filter) {
    display: none !important;
}

/* Reset content section spacing */
.skin-blue .content-wrapper .content-custom,
.skin-blue-light .content-wrapper .content-custom,
.skin-red .content-wrapper .content-custom,
.skin-red-light .content-wrapper .content-custom,
.skin-purple .content-wrapper .content-custom,
.skin-purple-light .content-wrapper .content-custom,
.skin-green .content-wrapper .content-custom,
.skin-green-light .content-wrapper .content-custom,
.skin-yellow .content-wrapper .content-custom,
.skin-yellow-light .content-wrapper .content-custom,
.skin-black .content-wrapper .content-custom,
.skin-black-light .content-wrapper .content-custom {
    margin-top: 0 !important;
    padding-top: 12px !important;
}

/* Hide first <br> in content-custom */
.content-custom > br:first-of-type {
    display: none !important;
}

/* ==========================================================================
   VIBRANT GRADIENT CARDS
   ========================================================================== */
.info-box,
.info-box-new-style {
    border-radius: var(--idt-radius-lg) !important;
    border: 0 !important;
    padding: 20px !important;
    padding-right: 20px !important;
    margin-bottom: 14px !important;
    transition: all 0.25s ease !important;
    overflow: hidden !important;
    position: relative !important;
    min-height: 130px !important;
    transform: none !important;
    box-shadow: var(--idt-shadow-card) !important;
    color: #ffffff !important;
}

.info-box-new-style:hover {
    transform: translateY(-3px) !important;
    box-shadow: var(--idt-shadow-card-hover) !important;
}

.info-box-new-style .info-box-icon,
.info-box .info-box-icon {
    position: absolute !important;
    right: -15px !important;
    bottom: -20px !important;
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    opacity: 0.18 !important;
    z-index: 1 !important;
    border-radius: 0 !important;
    float: none !important;
    pointer-events: none;
}

.info-box-new-style .info-box-icon i,
.info-box .info-box-icon i {
    font-size: 110px !important;
    color: #ffffff !important;
}

.info-box-new-style .info-box-icon i.fa,
.info-box .info-box-icon i.fa {
    font-size: 100px !important;
}

.info-box-content {
    position: relative !important;
    z-index: 2 !important;
    padding: 0 !important;
    margin-left: 0 !important;
}

.info-box-text {
    color: rgba(255, 255, 255, 0.9) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    margin-bottom: 8px !important;
    display: block;
}

.info-box-number {
    color: #ffffff !important;
    font-size: 26px !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em !important;
    line-height: 1.2 !important;
    display: block !important;
    margin-bottom: 6px !important;
}

.info-box .text-muted,
.info-box-new-style .text-muted {
    color: rgba(255, 255, 255, 0.75) !important;
    font-size: 11px !important;
    margin-top: 4px !important;
    font-weight: 400 !important;
}

.fs-10 {
    font-size: 11px !important;
    color: rgba(255, 255, 255, 0.75) !important;
}

/* Card color assignments */
.info-box:has(.info-box-icon.bg-aqua),
.info-box-new-style:has(.info-box-icon.bg-aqua) {
    background: linear-gradient(135deg, #06b6d4 0%, #0891b2 100%) !important;
    box-shadow: 0 4px 12px rgba(6, 182, 212, 0.28) !important;
}
.info-box:has(.info-box-icon.bg-green),
.info-box-new-style:has(.info-box-icon.bg-green) {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.28) !important;
}
.info-box:has(.info-box-icon.bg-yellow),
.info-box-new-style:has(.info-box-icon.bg-yellow) {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
    box-shadow: 0 4px 12px rgba(245, 158, 11, 0.28) !important;
}
.info-box:has(.info-box-icon.bg-red),
.info-box-new-style:has(.info-box-icon.bg-red) {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%) !important;
    box-shadow: 0 4px 12px rgba(239, 68, 68, 0.28) !important;
}
.info-box:has(.info-box-icon.bg-light-blue),
.info-box-new-style:has(.info-box-icon.bg-light-blue) {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%) !important;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.28) !important;
}
.info-box:has(.info-box-icon.bg-purple),
.info-box-new-style:has(.info-box-icon.bg-purple) {
    background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%) !important;
    box-shadow: 0 4px 12px rgba(139, 92, 246, 0.28) !important;
}

.col-custom {
    padding-left: 7px !important;
    padding-right: 7px !important;
}

.info-box-text .fa-info-circle,
.info-box-text + .show_tooltip,
.show_tooltip {
    color: rgba(255, 255, 255, 0.8) !important;
    font-size: 12px !important;
    margin-left: 6px;
}

.info-box-number .fa-spin {
    font-size: 18px !important;
    color: rgba(255, 255, 255, 0.85) !important;
}

/* ==========================================================================
   BOX / WIDGET
   ========================================================================== */
.box {
    background: var(--idt-bg-card) !important;
    border-radius: var(--idt-radius-lg) !important;
    border: 1px solid var(--idt-border) !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04) !important;
    margin-bottom: 18px !important;
}

.box .box-header {
    border-bottom: 1px solid var(--idt-border) !important;
    padding: 16px 20px !important;
}

.box .box-header .box-title {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--idt-text-primary) !important;
}

.box .box-body,
.box .box-footer {
    padding: 20px !important;
    color: var(--idt-text-primary);
}

.box.box-primary,
.box.box-warning,
.box.box-info,
.box.box-success,
.box.box-danger {
    border-top: 1px solid var(--idt-border) !important;
}

/* ==========================================================================
   TABLES
   ========================================================================== */
.table {
    color: var(--idt-text-primary);
    background: transparent !important;
}

.table > thead > tr > th {
    background-color: var(--idt-bg-hover) !important;
    color: var(--idt-text-secondary) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    border-bottom: 1px solid var(--idt-border) !important;
    padding: 14px 18px !important;
}

.table > tbody > tr > td {
    padding: 14px 18px !important;
    vertical-align: middle !important;
    border-top: 1px solid var(--idt-border) !important;
    font-size: 13px !important;
    color: var(--idt-text-primary) !important;
}

.table-bordered {
    border: 1px solid var(--idt-border) !important;
    border-radius: var(--idt-radius-md) !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    overflow: hidden;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: var(--idt-bg-hover) !important;
}

.table-hover > tbody > tr:hover {
    background-color: var(--idt-bg-hover) !important;
}

/* ==========================================================================
   BUTTONS
   ========================================================================== */
.btn {
    border-radius: 8px !important;
    font-weight: 500 !important;
    padding: 9px 18px !important;
    transition: all 0.15s ease !important;
    border: 1px solid transparent !important;
}

.btn-primary {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%) !important;
    border: 0 !important;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25) !important;
}

.btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.35) !important;
}

.btn-success {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
    border: 0 !important;
    box-shadow: 0 2px 8px rgba(16, 185, 129, 0.25) !important;
}

.btn-warning {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
    border: 0 !important;
    color: white !important;
    box-shadow: 0 2px 8px rgba(245, 158, 11, 0.25) !important;
}

.btn-danger {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%) !important;
    border: 0 !important;
    box-shadow: 0 2px 8px rgba(239, 68, 68, 0.25) !important;
}

.btn-info {
    background: linear-gradient(135deg, #06b6d4 0%, #0891b2 100%) !important;
    border: 0 !important;
    box-shadow: 0 2px 8px rgba(6, 182, 212, 0.25) !important;
}

.btn-default {
    background: var(--idt-bg-card) !important;
    border: 1px solid var(--idt-border) !important;
    color: var(--idt-text-primary) !important;
}

/* ==========================================================================
   FORM CONTROLS
   ========================================================================== */
.form-control {
    border-radius: 8px !important;
    border: 1px solid var(--idt-border) !important;
    padding: 9px 14px !important;
    height: auto !important;
    box-shadow: none !important;
    transition: all 0.15s ease !important;
    font-size: 14px !important;
    background: var(--idt-bg-card) !important;
    color: var(--idt-text-primary) !important;
}

.form-control:focus {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15) !important;
}

/* Don't override the banner's select2 styling */
.content-custom .select2-container--default .select2-selection--single {
    height: 40px !important;
    border-radius: 8px !important;
    border-color: var(--idt-border) !important;
    background: var(--idt-bg-card) !important;
}

.content-custom .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 38px !important;
    color: var(--idt-text-primary) !important;
}

.content-custom .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 38px !important;
}

/* ==========================================================================
   SIDEBAR
   ========================================================================== */
.skin-blue-light .main-sidebar,
.skin-blue .main-sidebar,
.skin-red .main-sidebar,
.skin-red-light .main-sidebar,
.skin-green .main-sidebar,
.skin-green-light .main-sidebar,
.skin-purple .main-sidebar,
.skin-purple-light .main-sidebar,
.skin-yellow .main-sidebar,
.skin-yellow-light .main-sidebar,
.skin-black .main-sidebar,
.skin-black-light .main-sidebar {
    background: var(--idt-sidebar-bg) !important;
    box-shadow: 1px 0 0 rgba(0, 0, 0, 0.1) !important;
}

.main-sidebar .logo {
    background: transparent !important;
    color: #ffffff !important;
}

.main-sidebar .logo .logo-lg {
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: 18px !important;
}

.sidebar-menu > li > a {
    font-size: 13.5px !important;
    padding: 12px 18px 12px 22px !important;
    border-radius: 0 !important;
    transition: all 0.15s ease !important;
    color: var(--idt-sidebar-text) !important;
    border-left: 3px solid transparent !important;
}

.sidebar-menu > li > a > .fa,
.sidebar-menu > li > a > .glyphicon,
.sidebar-menu > li > a > .ion {
    width: 22px !important;
    font-size: 15px !important;
    margin-right: 10px !important;
    color: var(--idt-sidebar-text) !important;
}

.sidebar-menu > li:hover > a {
    background: var(--idt-sidebar-hover) !important;
    color: #ffffff !important;
}

.sidebar-menu > li:hover > a .fa,
.sidebar-menu > li:hover > a .ion,
.sidebar-menu > li:hover > a .glyphicon {
    color: #ffffff !important;
}

.skin-blue-light .sidebar-menu > li.active > a,
.skin-blue .sidebar-menu > li.active > a,
.skin-red .sidebar-menu > li.active > a,
.skin-red-light .sidebar-menu > li.active > a,
.skin-green .sidebar-menu > li.active > a,
.skin-green-light .sidebar-menu > li.active > a,
.skin-purple .sidebar-menu > li.active > a,
.skin-purple-light .sidebar-menu > li.active > a,
.skin-yellow .sidebar-menu > li.active > a,
.skin-yellow-light .sidebar-menu > li.active > a,
.skin-black .sidebar-menu > li.active > a,
.skin-black-light .sidebar-menu > li.active > a,
.sidebar-menu > li.menu-open > a {
    background: linear-gradient(90deg, rgba(59, 130, 246, 0.15) 0%, transparent 100%) !important;
    color: #ffffff !important;
    font-weight: 500 !important;
    border-left-color: var(--idt-sidebar-active) !important;
}

.sidebar-menu > li.active > a .fa,
.sidebar-menu > li.active > a .ion,
.sidebar-menu > li.active > a .glyphicon {
    color: var(--idt-sidebar-active) !important;
}

.skin-blue-light .sidebar-menu > li > .treeview-menu,
.skin-blue .sidebar-menu > li > .treeview-menu,
.sidebar-menu > li > .treeview-menu {
    background: rgba(0, 0, 0, 0.2) !important;
    padding: 4px 0 !important;
}

.treeview-menu > li > a {
    color: var(--idt-sidebar-text) !important;
    padding: 8px 8px 8px 50px !important;
    font-size: 13px !important;
}

.treeview-menu > li > a:hover,
.treeview-menu > li.active > a {
    color: #ffffff !important;
    background: var(--idt-sidebar-hover) !important;
}

/* ==========================================================================
   HEADER NAVBAR
   ========================================================================== */
.main-header .navbar {
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06) !important;
}

.skin-blue .main-header .navbar,
.skin-blue-light .main-header .navbar {
    background-image: none !important;
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%) !important;
}

.skin-blue .main-header .logo,
.skin-blue-light .main-header .logo {
    background: var(--idt-sidebar-bg) !important;
}

/* ==========================================================================
   PAGINATION
   ========================================================================== */
.pagination > li > a,
.pagination > li > span {
    border-radius: 6px !important;
    margin: 0 2px !important;
    border: 1px solid var(--idt-border) !important;
    color: var(--idt-text-secondary) !important;
    padding: 6px 12px !important;
    background: var(--idt-bg-card) !important;
}

.pagination > .active > a,
.pagination > .active > span {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%) !important;
    border-color: transparent !important;
    color: white !important;
}

/* ==========================================================================
   ALERTS
   ========================================================================== */
.alert {
    border-radius: var(--idt-radius-md) !important;
    border: 1px solid transparent !important;
    padding: 14px 18px !important;
}

.alert-success {
    background: #dcfce7 !important;
    border-color: #16a34a !important;
    color: #166534 !important;
}

.alert-warning {
    background: #fef3c7 !important;
    border-color: #d97706 !important;
    color: #92400e !important;
}

.alert-danger {
    background: #fee2e2 !important;
    border-color: #dc2626 !important;
    color: #991b1b !important;
}

.alert-info {
    background: #dbeafe !important;
    border-color: #2563eb !important;
    color: #1e3a8a !important;
}

/* ==========================================================================
   MODALS
   ========================================================================== */
.modal-content {
    border-radius: var(--idt-radius-xl) !important;
    border: 0 !important;
    box-shadow: 0 20px 60px rgba(15, 23, 42, 0.15) !important;
    background: var(--idt-bg-card) !important;
}

.modal-header {
    border-bottom: 1px solid var(--idt-border) !important;
    padding: 20px 26px !important;
}

.modal-body {
    padding: 26px !important;
}

.modal-footer {
    border-top: 1px solid var(--idt-border) !important;
    padding: 18px 26px !important;
}

/* ==========================================================================
   DARK MODE TOGGLE
   ========================================================================== */
.idt-theme-toggle {
    position: fixed !important;
    bottom: 28px !important;
    right: 28px !important;
    width: 52px !important;
    height: 52px !important;
    border-radius: 50% !important;
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%) !important;
    border: 2px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.25) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    z-index: 9999 !important;
    transition: all 0.25s ease !important;
    color: #fbbf24 !important;
    font-size: 22px !important;
}

.idt-theme-toggle:hover {
    transform: translateY(-3px) scale(1.05) !important;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.35) !important;
}

body.theme-dark .idt-theme-toggle {
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%) !important;
    color: #1e293b !important;
}

.idt-theme-toggle .sun-icon { display: none; }
.idt-theme-toggle .moon-icon { display: inline; }
body.theme-dark .idt-theme-toggle .sun-icon { display: inline; }
body.theme-dark .idt-theme-toggle .moon-icon { display: none; }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media screen and (max-width: 991px) {
    .info-box-number { font-size: 22px !important; }
    .info-box-text { font-size: 12px !important; }
    .info-box-new-style .info-box-icon i,
    .info-box .info-box-icon i { font-size: 90px !important; }
}

@media screen and (max-width: 767px) {
    .skin-blue .content-wrapper .content-header-custom,
    .skin-blue-light .content-wrapper .content-header-custom,
    .content-header-custom {
        padding: 16px 20px !important;
        margin: 10px 10px 0 !important;
        max-height: none !important;
    }
    
    .idt-banner-flex {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 14px !important;
    }
    
    .idt-banner-right {
        width: 100% !important;
        justify-content: flex-start !important;
    }
    
    .idt-banner-filter-btn,
    .idt-banner-location {
        flex: 1 1 auto !important;
        width: 100% !important;
    }
    
    .idt-banner-filter-btn #dashboard_date_filter,
    .idt-banner-location select.form-control,
    .idt-banner-location .select2-container {
        width: 100% !important;
        justify-content: center !important;
    }
    
    .idt-banner-title {
        font-size: 18px !important;
    }
    
    .info-box,
    .info-box-new-style {
        padding: 16px !important;
        min-height: 110px !important;
    }
    
    .info-box-number { font-size: 20px !important; }
    .info-box-new-style .info-box-icon i,
    .info-box .info-box-icon i { font-size: 75px !important; }
    
    .idt-theme-toggle {
        width: 44px !important;
        height: 44px !important;
        bottom: 18px !important;
        right: 18px !important;
        font-size: 18px !important;
    }
}

/* ==========================================================================
   PRINT
   ========================================================================== */
@media print {
    .info-box, .info-box-new-style, .box {
        box-shadow: none !important;
        border: 1px solid #ddd !important;
        background: white !important;
        color: black !important;
    }
    .content-header-custom {
        background: none !important;
        color: black !important;
    }
    .idt-banner-title, .info-box-text, .info-box-number, .text-muted {
        color: black !important;
    }
    .info-box .info-box-icon, .idt-theme-toggle, .idt-banner-right {
        display: none !important;
    }
}