/* Custom Gaming Theme - High Contrast & Palette Overrides */
:root, [data-theme-mode=dark] {
    --body-bg-rgb: 7, 12, 20 !important;
    --body-bg-rgb2: 14, 23, 38 !important;
    --primary-rgb: 0, 210, 255 !important;

    --default-body-bg-color: #070c14 !important;
    --default-background: #0e1726 !important;
    --menu-bg: #0a111c !important;
    --header-bg: #070c14 !important;
    --custom-white: #0e1726 !important;

    --default-border: rgba(0, 210, 255, 0.18) !important;
    --menu-border-color: rgba(0, 210, 255, 0.15) !important;
    --header-border-color: rgba(0, 210, 255, 0.18) !important;
    --input-border: rgba(0, 210, 255, 0.25) !important;
    --form-control-bg: #0b1320 !important;

    --default-text-color: #e2f1ff !important;
    --text-muted: #94a3b8 !important;
    --custom-black: #ffffff !important;
}

/* =========================================================
   1. TYPOGRAPHY & TEXT CONTRAST IN DARK THEME
========================================================= */

body, html, p, span, div, label, li, a, dt, dd, small, strong, b, td, th {
    color: #e2f1ff;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.card-title, .modal-title, .page-title, .main-content-title {
    color: #ffffff !important;
}

.text-muted, small.text-muted, .small.text-muted, span.text-muted {
    color: #94a3b8 !important;
}

.text-dark, .text-black, .text-body {
    color: #e2f1ff !important;
}

.text-white, .text-fixed-white {
    color: #ffffff !important;
}

/* =========================================================
   2. LIGHT CONTAINERS & LIGHT SUBTLE BADGES (FIX FOR WHITE-ON-WHITE)
========================================================= */

.bg-white, .bg-light, .bg-light-subtle, .bg-white-subtle {
    background-color: #0b1320 !important;
    color: #e2f1ff !important;
    border: 1px solid rgba(0, 210, 255, 0.15) !important;
}

.bg-white *, .bg-light *, .bg-light-subtle *, .bg-white-subtle * {
    color: inherit;
}

/* Subtitle Badges */
.bg-success-subtle {
    background-color: rgba(16, 185, 129, 0.18) !important;
    color: #34d399 !important;
    border: 1px solid rgba(16, 185, 129, 0.35) !important;
}
.bg-success-subtle * { color: #34d399 !important; }

.bg-warning-subtle {
    background-color: rgba(245, 158, 11, 0.18) !important;
    color: #fbbf24 !important;
    border: 1px solid rgba(245, 158, 11, 0.35) !important;
}
.bg-warning-subtle * { color: #fbbf24 !important; }

.bg-info-subtle {
    background-color: rgba(6, 182, 212, 0.18) !important;
    color: #38bdf8 !important;
    border: 1px solid rgba(6, 182, 212, 0.35) !important;
}
.bg-info-subtle * { color: #38bdf8 !important; }

.bg-danger-subtle {
    background-color: rgba(239, 68, 68, 0.18) !important;
    color: #f87171 !important;
    border: 1px solid rgba(239, 68, 68, 0.35) !important;
}
.bg-danger-subtle * { color: #f87171 !important; }

.bg-primary-subtle {
    background-color: rgba(0, 210, 255, 0.18) !important;
    color: #00d2ff !important;
    border: 1px solid rgba(0, 210, 255, 0.35) !important;
}
.bg-primary-subtle * { color: #00d2ff !important; }

/* =========================================================
   3. BUTTON AUDIT & ICON ALIGNMENT
========================================================= */

.btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
    transition: all 0.2s ease-in-out !important;
}

.btn i, .btn svg {
    color: inherit !important;
    font-size: 1.1em;
}

/* Primary Button */
.btn-primary {
    background: linear-gradient(135deg, #00d2ff 0%, #0088ff 100%) !important;
    border: none !important;
    color: #040811 !important;
    box-shadow: 0 0 12px rgba(0, 210, 255, 0.4) !important;
}
.btn-primary:hover, .btn-primary:focus {
    background: linear-gradient(135deg, #38bdf8 0%, #0284c7 100%) !important;
    color: #040811 !important;
    box-shadow: 0 0 20px rgba(0, 210, 255, 0.7) !important;
}
.btn-primary * { color: #040811 !important; }

/* Secondary & Outline Secondary */
.btn-secondary {
    background-color: #334155 !important;
    border-color: #475569 !important;
    color: #ffffff !important;
}
.btn-secondary:hover {
    background-color: #475569 !important;
    color: #ffffff !important;
}

.btn-outline-secondary {
    border: 1px solid rgba(0, 210, 255, 0.35) !important;
    background-color: rgba(0, 210, 255, 0.08) !important;
    color: #00d2ff !important;
}
.btn-outline-secondary:hover {
    background-color: #00d2ff !important;
    color: #040811 !important;
}
.btn-outline-secondary:hover * {
    color: #040811 !important;
}

/* Success Button */
.btn-success {
    background-color: #10b981 !important;
    border-color: #10b981 !important;
    color: #ffffff !important;
}
.btn-success:hover {
    background-color: #059669 !important;
    color: #ffffff !important;
}

/* Danger Button */
.btn-danger {
    background-color: #ef4444 !important;
    border-color: #ef4444 !important;
    color: #ffffff !important;
}
.btn-danger:hover {
    background-color: #dc2626 !important;
    color: #ffffff !important;
}

/* Warning Button */
.btn-warning {
    background-color: #f59e0b !important;
    border-color: #f59e0b !important;
    color: #0f172a !important;
}
.btn-warning * { color: #0f172a !important; }

/* Info Button */
.btn-info {
    background-color: #06b6d4 !important;
    border-color: #06b6d4 !important;
    color: #ffffff !important;
}

/* Light / White Buttons */
.btn-light, .btn-white {
    background-color: #1e293b !important;
    border: 1px solid rgba(0, 210, 255, 0.25) !important;
    color: #e2f1ff !important;
}
.btn-light:hover, .btn-white:hover {
    background-color: rgba(0, 210, 255, 0.2) !important;
    color: #00d2ff !important;
    border-color: #00d2ff !important;
}
.btn-light *, .btn-white * {
    color: inherit !important;
}

.btn-outline-light {
    border: 1px solid rgba(0, 210, 255, 0.3) !important;
    color: #00d2ff !important;
    background-color: transparent !important;
}
.btn-outline-light:hover {
    background-color: #00d2ff !important;
    color: #040811 !important;
}
.btn-outline-light:hover * {
    color: #040811 !important;
}

/* =========================================================
   4. STEPPER CONTROLS (+ / - INCREMENT & DECREMENT BUTTONS)
========================================================= */

.hour-stepper-btn, .gaming-extension-hour-btn, .gaming-food-edit-minus, .gaming-food-edit-plus {
    width: 38px !important;
    height: 38px !important;
    border-radius: 9px !important;
    border: 1px solid rgba(0, 210, 255, 0.35) !important;
    background: #1e293b !important;
    color: #00d2ff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

.hour-stepper-btn:hover, .gaming-extension-hour-btn:hover, 
.gaming-food-edit-minus:hover, .gaming-food-edit-plus:hover {
    background: #00d2ff !important;
    color: #040811 !important;
    border-color: #00d2ff !important;
    box-shadow: 0 0 10px rgba(0, 210, 255, 0.5) !important;
}

.hour-stepper-btn:hover *, .gaming-extension-hour-btn:hover *, 
.gaming-food-edit-minus:hover *, .gaming-food-edit-plus:hover * {
    color: #040811 !important;
}

.hour-stepper-btn *, .gaming-extension-hour-btn *, 
.gaming-food-edit-minus *, .gaming-food-edit-plus * {
    color: inherit !important;
}

/* =========================================================
   5. FORMS, LABELS & INPUT CONTROLS
========================================================= */

label, .form-label, .col-form-label, .form-check-label, legend {
    color: #e2f1ff !important;
    font-weight: 600 !important;
    margin-bottom: 6px !important;
}

.form-control, .form-select, select, textarea, input[type="text"], input[type="number"], 
input[type="password"], input[type="email"], input[type="tel"], input[type="search"], 
input[type="date"], input[type="time"], input[type="datetime-local"], input[type="file"] {
    background-color: #0b1320 !important;
    color: #ffffff !important;
    border: 1px solid rgba(0, 210, 255, 0.3) !important;
    border-radius: 8px !important;
}

.form-control:focus, .form-select:focus, select:focus, textarea:focus, input:focus {
    background-color: #0d192b !important;
    color: #ffffff !important;
    border-color: #00d2ff !important;
    box-shadow: 0 0 10px rgba(0, 210, 255, 0.35) !important;
}

.form-control::placeholder, textarea::placeholder, input::placeholder {
    color: #64748b !important;
    opacity: 0.8 !important;
}

select option, optgroup {
    background-color: #0e1726 !important;
    color: #ffffff !important;
}

/* Input Group Text */
.input-group-text {
    background-color: #0b1320 !important;
    color: #00d2ff !important;
    border: 1px solid rgba(0, 210, 255, 0.3) !important;
}

/* =========================================================
   6. TABLES & DATATABLES AUDIT
========================================================= */

.table-responsive {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
}

table, .table {
    color: #e2f1ff !important;
    border-color: rgba(0, 210, 255, 0.15) !important;
    width: 100% !important;
}

table thead th, .table thead th, .table-active {
    background-color: #0f172a !important;
    color: #00d2ff !important;
    font-weight: 700 !important;
    border-bottom: 2px solid rgba(0, 210, 255, 0.3) !important;
}

table td, .table td {
    color: #e2f1ff !important;
    border-color: rgba(0, 210, 255, 0.12) !important;
    vertical-align: middle !important;
}

.table-hover>tbody>tr:hover>* {
    background-color: rgba(0, 210, 255, 0.08) !important;
    color: #ffffff !important;
}

.dataTables_wrapper .dataTables_info, 
.dataTables_wrapper .dataTables_length, 
.dataTables_wrapper .dataTables_filter {
    color: #94a3b8 !important;
    margin-bottom: 10px !important;
}

.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .dataTables_filter input,
.dt-search input, .dt-length select {
    background-color: #0b1320 !important;
    color: #ffffff !important;
    border: 1px solid rgba(0, 210, 255, 0.3) !important;
    border-radius: 6px !important;
    padding: 4px 8px !important;
}

.pagination .page-link {
    background-color: #0e1726 !important;
    color: #e2f1ff !important;
    border: 1px solid rgba(0, 210, 255, 0.2) !important;
}

.pagination .page-item.active .page-link {
    background-color: #00d2ff !important;
    color: #040811 !important;
    font-weight: 700 !important;
    border-color: #00d2ff !important;
}

/* =========================================================
   7. CARDS, MODALS & DROPDOWNS
========================================================= */

.card {
    background-color: #0e1726 !important;
    border: 1px solid rgba(0, 210, 255, 0.2) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
}

.card-header {
    background-color: transparent !important;
    border-bottom: 1px solid rgba(0, 210, 255, 0.2) !important;
    color: #ffffff !important;
}

.modal-content {
    background-color: #0e1726 !important;
    border: 1px solid rgba(0, 210, 255, 0.3) !important;
    color: #ffffff !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.8) !important;
}

.modal-header, .modal-footer {
    border-color: rgba(0, 210, 255, 0.2) !important;
}

.dropdown-menu {
    background-color: #0e1726 !important;
    border: 1px solid rgba(0, 210, 255, 0.25) !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.6) !important;
}

.dropdown-item {
    color: #e2f1ff !important;
}

.dropdown-item:hover, .dropdown-item:focus {
    background-color: rgba(0, 210, 255, 0.15) !important;
    color: #00d2ff !important;
}

/* =========================================================
   8. EXTEND & GAMING SESSION SPECIAL CARDS
========================================================= */

.gaming-extension-card, .gaming-extension-hours-card, .gaming-extend-current-item, .gaming-extension-preview {
    background: #0b1320 !important;
    border: 1px solid rgba(0, 210, 255, 0.25) !important;
    color: #ffffff !important;
}

.gaming-extension-card.active, .gaming-extension-hours-card.active, .gaming-selected-extension {
    background: rgba(0, 210, 255, 0.12) !important;
    border-color: #00d2ff !important;
    box-shadow: 0 0 12px rgba(0, 210, 255, 0.25) !important;
}

.gaming-extension-card-title, .gaming-extension-hours-title, 
.gaming-extend-customer-name, .gaming-extension-preview-title {
    color: #ffffff !important;
}

.gaming-extension-card-subtitle, .gaming-extension-hours-subtitle, .gaming-extend-label {
    color: #94a3b8 !important;
}

.gaming-extension-hour-value strong {
    color: #00d2ff !important;
}

.gaming-extend-avatar, .gaming-extension-card-icon, .gaming-extension-hours-icon {
    background: rgba(0, 210, 255, 0.15) !important;
    color: #00d2ff !important;
}

/* =========================================================
   9. MOBILE & RESPONSIVE TUNING
========================================================= */

@media (max-width: 767.98px) {
    .btn {
        padding: 6px 10px !important;
        font-size: 13px !important;
    }
    
    .card-body {
        padding: 12px !important;
    }

    .table th, .table td {
        padding: 8px 10px !important;
        font-size: 12px !important;
    }
}