/*
 * ULTIMATE GOLD LUXURY THEME - FINAL OVERRIDE
 * This file contains all necessary overrides to force the gold and black luxury theme
 * It loads last to ensure maximum specificity and override capability
 */

/* ===== CRITICAL GLOBAL RESETS ===== */
* {
    box-sizing: border-box !important;
}

html, body {
    background: #000000 !important;
    color: #FFD700 !important;
    font-family: 'Inter', 'Georgia', serif !important;
}

/* Force skin-gold class */
body, html body, html body.skin-gold, html body.skin-gold-light {
    background-color: #000000 !important;
    background-image: none !important;
}

/* ===== SIDEBAR - BLACK WITH GOLD ACCENTS ===== */
.main-sidebar, .left-side, .sidebar {
    background: #000000 !important;
    border-right: 4px solid #FFD700 !important;
    box-shadow: 4px 0 15px rgba(255, 215, 0, 0.3) !important;
}

.sidebar-menu > li > a {
    color: #ffffff !important;
    border-left: 4px solid transparent !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    padding: 12px 15px !important;
    font-weight: 500 !important;
}

.sidebar-menu > li:hover > a,
.sidebar-menu > li.active > a,
.sidebar-menu > li.menu-open > a {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    border-left: 4px solid #FFD700 !important;
    font-weight: bold !important;
    box-shadow: inset 0 0 15px rgba(255, 215, 0, 0.4), 0 0 15px rgba(255, 215, 0, 0.6) !important;
    transform: translateX(2px) !important;
}

.sidebar-menu > li > a > .fa,
.sidebar-menu > li > a > .glyphicon,
.sidebar-menu > li > a > .ion,
.sidebar-menu > li > a > svg {
    color: #FFC107 !important;
    margin-right: 8px !important;
}

.sidebar-menu > li:hover > a > .fa,
.sidebar-menu > li.active > a > .fa,
.sidebar-menu > li:hover > a > svg,
.sidebar-menu > li.active > a > svg {
    color: #000000 !important;
}

.sidebar-menu > li.header {
    background: #1a1a1a !important;
    color: #FFD700 !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    padding: 10px 15px !important;
}

/* ===== HEADER - BLACK WITH GOLD NAVIGATION ===== */
.main-header,
div[class*="tw-bg-gradient-to-r"],
div[class*="tw-from-primary-800"],
div[class*="tw-to-primary-900"],
div[class*="tw-from-blue-800"],
div[class*="tw-to-blue-900"],
div[class*="tw-from-red-800"],
div[class*="tw-to-red-900"],
div[class*="tw-from-green-800"],
div[class*="tw-to-green-900"],
div[class*="tw-from-yellow-800"],
div[class*="tw-to-yellow-900"],
div[class*="tw-from-purple-800"],
div[class*="tw-to-purple-900"] {
    background: linear-gradient(135deg, #000000 0%, #1a1a1a 50%, #2d2d2d 100%) !important;
    border-bottom: 3px solid #FFD700 !important;
    box-shadow: 0 2px 10px rgba(255, 215, 0, 0.3) !important;
}

.main-header .logo {
    background: #000000 !important;
    color: #FFD700 !important;
    border-right: 2px solid #FFD700 !important;
    font-weight: bold !important;
    font-size: 20px !important;
    text-shadow: 0 0 10px rgba(255, 215, 0, 0.5) !important;
}

.main-header .logo:hover {
    background: #1a1a1a !important;
    color: #FFC107 !important;
}

.main-header .navbar > .sidebar-toggle {
    color: #FFD700 !important;
    border-right: 2px solid #FFD700 !important;
    transition: all 0.3s ease !important;
}

.main-header .navbar > .sidebar-toggle:hover {
    background: #FFD700 !important;
    color: #000000 !important;
    box-shadow: 0 0 10px rgba(255, 215, 0, 0.6) !important;
}

.main-header .navbar .nav > li > a {
    color: #FFD700 !important;
    transition: all 0.3s ease !important;
    font-weight: 500 !important;
}

.main-header .navbar .nav > li > a:hover {
    background: #FFD700 !important;
    color: #000000 !important;
    border-radius: 6px !important;
    box-shadow: 0 2px 8px rgba(255, 215, 0, 0.4) !important;
}

/* ===== CONTENT AREA ===== */
.content-wrapper {
    background: #f8f9fe !important;
    min-height: 100vh !important;
}

/* ===== CARDS AND BOXES - LUXURY STYLING ===== */
.box, .card, .panel, .widget-user, .info-box, .small-box {
    background: #000000 !important;
    border: 2px solid #FFD700 !important;
    color: #FFD700 !important;
    box-shadow: 0 4px 15px rgba(255, 215, 0, 0.2) !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    position: relative !important;
}

.box-header, .card-header, .panel-heading {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    font-weight: bold !important;
    border-bottom: 2px solid #B8860B !important;
    padding: 15px !important;
    position: relative !important;
}

.box-header::after, .card-header::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 2px !important;
    background: linear-gradient(90deg, transparent, #FFD700, transparent) !important;
    animation: shimmer 2s linear infinite !important;
}

.box-body, .card-body {
    background: rgba(26, 26, 26, 0.8) !important;
    color: #FFD700 !important;
    padding: 20px !important;
}

/* ===== BUTTONS - LUXURY GOLD STYLING ===== */
.btn:not(.btn-default):not(.btn-link):not(.btn-secondary) {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    border: 2px solid #B8860B !important;
    color: #000000 !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 3px 10px rgba(255, 215, 0, 0.3) !important;
    border-radius: 6px !important;
    position: relative !important;
    overflow: hidden !important;
}

.btn:not(.btn-default):not(.btn-link):not(.btn-secondary):hover {
    background: #B8860B !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(255, 215, 0, 0.5) !important;
    color: #FFD700 !important;
}

.btn:not(.btn-default):not(.btn-link):not(.btn-secondary):active {
    transform: translateY(0) !important;
    box-shadow: 0 2px 8px rgba(255, 215, 0, 0.3) !important;
}

/* ===== FORM ELEMENTS - LUXURY INPUTS ===== */
.form-control, input:not([type="checkbox"]):not([type="radio"]), select, textarea {
    background: #1a1a1a !important;
    border: 2px solid #FFD700 !important;
    color: #FFD700 !important;
    border-radius: 6px !important;
    transition: all 0.3s ease !important;
    font-weight: 500 !important;
}

.form-control:focus, input:focus, select:focus, textarea:focus {
    background: #000000 !important;
    border-color: #FFC107 !important;
    box-shadow: 0 0 0 0.25rem rgba(255, 215, 0, 0.25), 0 0 15px rgba(255, 215, 0, 0.3) !important;
    color: #FFD700 !important;
    outline: none !important;
}

/* ===== TABLES - LUXURY DATA PRESENTATION ===== */
.table, .dataTable {
    color: #333333 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
}

.table thead th, .dataTable thead th {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    border-color: #B8860B !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 15px 12px !important;
    position: relative !important;
}

.table tbody tr:nth-child(even) {
    background: rgba(255, 215, 0, 0.05) !important;
}

.table tbody tr:hover, .dataTable tbody tr:hover {
    background: rgba(255, 215, 0, 0.1) !important;
    color: #333333 !important;
    transform: scale(1.01) !important;
    transition: all 0.2s ease !important;
}

/* ===== DROPDOWN MENUS - LUXURY NAVIGATION ===== */
.dropdown-menu {
    background: #000000 !important;
    border: 2px solid #FFD700 !important;
    box-shadow: 0 6px 25px rgba(255, 215, 0, 0.3) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}

.dropdown-menu .dropdown-item, .dropdown-menu > li > a {
    color: #FFD700 !important;
    transition: all 0.3s ease !important;
    padding: 12px 20px !important;
    font-weight: 500 !important;
}

.dropdown-menu .dropdown-item:hover, .dropdown-menu > li > a:hover {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    transform: translateX(3px) !important;
}

/* ===== MODALS - LUXURY DIALOGS ===== */
.modal-content {
    background: #000000 !important;
    border: 3px solid #FFD700 !important;
    color: #FFD700 !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 40px rgba(255, 215, 0, 0.4) !important;
}

.modal-header {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    border-bottom: 2px solid #B8860B !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

.modal-body {
    background: #1a1a1a !important;
    color: #FFD700 !important;
}

.modal-footer {
    background: #1a1a1a !important;
    border-top: 2px solid #FFD700 !important;
}

/* ===== NAVIGATION TABS - LUXURY TABS ===== */
.nav-tabs {
    border-bottom: 2px solid #FFD700 !important;
}

.nav-tabs .nav-link {
    background: #1a1a1a !important;
    border: 2px solid #FFD700 !important;
    color: #FFD700 !important;
    border-bottom: none !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
}

.nav-tabs .nav-link.active {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    border-color: #B8860B !important;
    border-bottom: 2px solid #FFD700 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 15px rgba(255, 215, 0, 0.3) !important;
}

/* ===== ALERTS - LUXURY NOTIFICATIONS ===== */
.alert {
    border: 2px solid #FFD700 !important;
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.1) 0%, rgba(255, 193, 7, 0.1) 100%) !important;
    color: #B8860B !important;
    border-radius: 8px !important;
    font-weight: 500 !important;
    box-shadow: 0 2px 10px rgba(255, 215, 0, 0.2) !important;
}

/* ===== PROGRESS BARS - LUXURY PROGRESS ===== */
.progress {
    background: #1a1a1a !important;
    border: 1px solid #FFD700 !important;
    border-radius: 6px !important;
    overflow: hidden !important;
}

.progress-bar {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    font-weight: bold !important;
    position: relative !important;
}

/* ===== BADGES - LUXURY LABELS ===== */
.badge {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    font-weight: bold !important;
    border-radius: 12px !important;
    padding: 4px 8px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    font-size: 11px !important;
}

/* ===== PAGINATION - LUXURY NAVIGATION ===== */
.pagination .page-link {
    background: #1a1a1a !important;
    border: 1px solid #FFD700 !important;
    color: #FFD700 !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
}

.pagination .page-link:hover, .pagination .page-item.active .page-link {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    border-color: #B8860B !important;
    color: #000000 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 3px 10px rgba(255, 215, 0, 0.3) !important;
}

/* ===== BREADCRUMBS - LUXURY NAVIGATION ===== */
.breadcrumb {
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.1) 0%, rgba(255, 193, 7, 0.1) 100%) !important;
    border: 1px solid #FFD700 !important;
    border-radius: 8px !important;
    color: #B8860B !important;
    font-weight: 500 !important;
}

.breadcrumb .breadcrumb-item a {
    color: #FFD700 !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

.breadcrumb .breadcrumb-item a:hover {
    color: #FFC107 !important;
    text-shadow: 0 0 5px rgba(255, 215, 0, 0.5) !important;
}

/* ===== FOOTER - LUXURY FOOTER ===== */
.main-footer, footer {
    background: #000000 !important;
    color: #FFD700 !important;
    border-top: 3px solid #FFD700 !important;
    padding: 20px !important;
    font-weight: 500 !important;
}

/* ===== DATA TABLES SPECIFIC STYLING ===== */
.dataTables_wrapper {
    color: #FFD700 !important;
}

.dataTables_info, .dataTables_length, .dataTables_filter {
    color: #FFD700 !important;
    font-weight: 500 !important;
}

.dataTables_length select {
    background: #1a1a1a !important;
    border: 1px solid #FFD700 !important;
    color: #FFD700 !important;
}

.dataTables_filter input {
    background: #1a1a1a !important;
    border: 1px solid #FFD700 !important;
    color: #FFD700 !important;
    border-radius: 6px !important;
}

/* ===== SELECT2 DROPDOWN STYLING ===== */
.select2-container--default .select2-selection--single {
    background: #1a1a1a !important;
    border: 2px solid #FFD700 !important;
    color: #FFD700 !important;
    border-radius: 6px !important;
}

.select2-dropdown {
    background: #000000 !important;
    border: 2px solid #FFD700 !important;
    border-radius: 6px !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
}

/* ===== ANIMATIONS ===== */
@keyframes shimmer {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

@keyframes goldShimmer {
    0% { box-shadow: 0 0 5px rgba(255, 215, 0, 0.5); }
    50% { box-shadow: 0 0 20px rgba(255, 215, 0, 0.8); }
    100% { box-shadow: 0 0 5px rgba(255, 215, 0, 0.5); }
}

@keyframes goldPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.8; }
}

.gold-shimmer {
    animation: goldShimmer 2s infinite !important;
}

.gold-pulse {
    animation: goldPulse 3s infinite !important;
}

/* ===== UTILITY CLASSES ===== */
.luxury-card {
    background: #000000 !important;
    border: 3px solid #FFD700 !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 25px rgba(255, 215, 0, 0.4) !important;
    position: relative !important;
    overflow: hidden !important;
}

.text-gold {
    color: #FFD700 !important;
}

.text-gold-secondary {
    color: #FFC107 !important;
}

.text-gold-dark {
    color: #B8860B !important;
}

.bg-gold-gradient {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
}

.border-gold {
    border-color: #FFD700 !important;
}

/* ===== RESPONSIVE DESIGN ===== */
@media (max-width: 768px) {
    .main-header .logo {
        background: #000000 !important;
        color: #FFD700 !important;
    }
    
    .main-sidebar {
        border-right: 2px solid #FFD700 !important;
    }
    
    .box, .card {
        margin-bottom: 15px !important;
    }
}

/* ===== FORCE APPLICATION - HIGHEST PRIORITY ===== */
html body.skin-gold,
html body.skin-gold-light,
html body,
body {
    background-color: #000000 !important;
    background-image: none !important;
    color: #FFD700 !important;
}

/* Make sure sidebar is always black with gold accents */
.main-sidebar {
    background-color: #000000 !important;
    background-image: none !important;
    background: #000000 !important;
}

/* Ensure content wrapper has proper background */
.content-wrapper {
    background-color: #f8f9fe !important;
}

/* Apply shimmer to active sidebar items */
.sidebar-menu > li.active > a {
    animation: goldShimmer 3s infinite !important;
}

/* ===== TAILWIND CSS OVERRIDES - DYNAMIC CLASSES ===== */

/* Override all Tailwind background color classes */
[class*="tw-bg-primary-800"],
[class*="tw-bg-primary-700"],
[class*="tw-bg-blue-800"],
[class*="tw-bg-blue-700"],
[class*="tw-bg-red-800"],
[class*="tw-bg-red-700"],
[class*="tw-bg-green-800"],
[class*="tw-bg-green-700"],
[class*="tw-bg-yellow-800"],
[class*="tw-bg-yellow-700"],
[class*="tw-bg-purple-800"],
[class*="tw-bg-purple-700"],
[class*="tw-bg-black-800"],
[class*="tw-bg-black-700"] {
    background: #000000 !important;
    color: #FFD700 !important;
    border-color: #FFD700 !important;
}

/* Override hover states */
[class*="tw-bg-primary-800"]:hover,
[class*="tw-bg-primary-700"]:hover,
[class*="tw-bg-blue-800"]:hover,
[class*="tw-bg-blue-700"]:hover,
[class*="tw-bg-red-800"]:hover,
[class*="tw-bg-red-700"]:hover,
[class*="tw-bg-green-800"]:hover,
[class*="tw-bg-green-700"]:hover,
[class*="tw-bg-yellow-800"]:hover,
[class*="tw-bg-yellow-700"]:hover,
[class*="tw-bg-purple-800"]:hover,
[class*="tw-bg-purple-700"]:hover,
[class*="tw-bg-black-800"]:hover,
[class*="tw-bg-black-700"]:hover,
[class*="hover:tw-bg-primary-700"],
[class*="hover:tw-bg-primary-800"],
[class*="hover:tw-bg-blue-700"],
[class*="hover:tw-bg-blue-800"],
[class*="hover:tw-bg-red-700"],
[class*="hover:tw-bg-red-800"],
[class*="hover:tw-bg-green-700"],
[class*="hover:tw-bg-green-800"],
[class*="hover:tw-bg-yellow-700"],
[class*="hover:tw-bg-yellow-800"],
[class*="hover:tw-bg-purple-700"],
[class*="hover:tw-bg-purple-800"],
[class*="hover:tw-bg-black-700"],
[class*="hover:tw-bg-black-800"] {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 15px rgba(255, 215, 0, 0.4) !important;
}

/* Override specific header elements */
.side-bar-collapse,
.small-view-button,
button[class*="tw-bg-primary"],
button[class*="tw-bg-blue"],
button[class*="tw-bg-red"],
button[class*="tw-bg-green"],
button[class*="tw-bg-yellow"],
button[class*="tw-bg-purple"],
button[class*="tw-bg-black"],
a[class*="tw-bg-primary"],
a[class*="tw-bg-blue"],
a[class*="tw-bg-red"],
a[class*="tw-bg-green"],
a[class*="tw-bg-yellow"],
a[class*="tw-bg-purple"],
a[class*="tw-bg-black"] {
    background: #000000 !important;
    color: #FFD700 !important;
    border: 1px solid #FFD700 !important;
    border-radius: 6px !important;
    transition: all 0.3s ease !important;
}

.side-bar-collapse:hover,
.small-view-button:hover,
button[class*="tw-bg-primary"]:hover,
button[class*="tw-bg-blue"]:hover,
button[class*="tw-bg-red"]:hover,
button[class*="tw-bg-green"]:hover,
button[class*="tw-bg-yellow"]:hover,
button[class*="tw-bg-purple"]:hover,
button[class*="tw-bg-black"]:hover,
a[class*="tw-bg-primary"]:hover,
a[class*="tw-bg-blue"]:hover,
a[class*="tw-bg-red"]:hover,
a[class*="tw-bg-green"]:hover,
a[class*="tw-bg-yellow"]:hover,
a[class*="tw-bg-purple"]:hover,
a[class*="tw-bg-black"]:hover {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 15px rgba(255, 215, 0, 0.4) !important;
}

/* Override sidebar logo area */
a[class*="tw-h-15"],
.side-bar-heading {
    background: #000000 !important;
    color: #FFD700 !important;
    font-weight: bold !important;
    text-shadow: 0 0 10px rgba(255, 215, 0, 0.5) !important;
}

/* Override text colors */
[class*="tw-text-white"] {
    color: #FFD700 !important;
}

/* Override ring colors */
[class*="tw-ring-white/10"] {
    ring-color: rgba(255, 215, 0, 0.2) !important;
    border-color: #FFD700 !important;
}

/* Override specific menu elements */
summary[class*="tw-bg-primary"],
summary[class*="tw-bg-blue"],
summary[class*="tw-bg-red"],
summary[class*="tw-bg-green"],
summary[class*="tw-bg-yellow"],
summary[class*="tw-bg-purple"],
summary[class*="tw-bg-black"] {
    background: #000000 !important;
    color: #FFD700 !important;
    border: 1px solid #FFD700 !important;
}

summary[class*="tw-bg-primary"]:hover,
summary[class*="tw-bg-blue"]:hover,
summary[class*="tw-bg-red"]:hover,
summary[class*="tw-bg-green"]:hover,
summary[class*="tw-bg-yellow"]:hover,
summary[class*="tw-bg-purple"]:hover,
summary[class*="tw-bg-black"]:hover {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
}

/* Force application on all possible theme color variations */
[class*="tw-from-"][class*="-800"],
[class*="tw-to-"][class*="-900"] {
    background: linear-gradient(135deg, #000000 0%, #1a1a1a 50%, #2d2d2d 100%) !important;
}

/* Override border colors */
[class*="tw-border-primary"],
[class*="tw-border-blue"],
[class*="tw-border-red"],
[class*="tw-border-green"],
[class*="tw-border-yellow"],
[class*="tw-border-purple"] {
    border-color: #FFD700 !important;
}

/* Side navigation specific overrides */
.side-bar {
    background: #000000 !important;
    border-right: 4px solid #FFD700 !important;
    box-shadow: 4px 0 15px rgba(255, 215, 0, 0.3) !important;
}

.side-bar a[href] {
    color: #FFD700 !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
}

.side-bar a[href]:hover {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    transform: translateX(3px) !important;
}

/* Menu rendering overrides */
nav[class*="tw-bg-"],
ul[class*="tw-bg-"],
li[class*="tw-bg-"] {
    background: #000000 !important;
    border-color: #FFD700 !important;
}

nav[class*="tw-bg-"] a,
ul[class*="tw-bg-"] a,
li[class*="tw-bg-"] a {
    color: #FFD700 !important;
}

nav[class*="tw-bg-"] a:hover,
ul[class*="tw-bg-"] a:hover,
li[class*="tw-bg-"] a:hover {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
}

/* Date display override */
button[class*="tw-font-mono"] {
    background: #000000 !important;
    color: #FFD700 !important;
    border: 1px solid #FFD700 !important;
    font-weight: bold !important;
}

/* Notification bell and user menu */
.dropdown-toggle,
.load_notifications {
    background: #000000 !important;
    color: #FFD700 !important;
    border: 1px solid #FFD700 !important;
}

.dropdown-toggle:hover,
.load_notifications:hover {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
}

/* Status indicator */
span[class*="tw-bg-green"] {
    background: #FFD700 !important;
    box-shadow: 0 0 10px rgba(255, 215, 0, 0.6) !important;
    animation: goldPulse 2s infinite !important;
}

/* ===== CUSTOM MENU PRESENTER OVERRIDES ===== */

/* Main sidebar container */
#side-bar {
    background: #000000 !important;
    border-right: 4px solid #FFD700 !important;
    border-color: #FFD700 !important;
    box-shadow: 4px 0 15px rgba(255, 215, 0, 0.3) !important;
}

/* All menu links */
#side-bar a[href],
.tw-flex.tw-items-center.tw-gap-3 {
    color: #ffffff !important;
    background: transparent !important;
    border-left: 4px solid transparent !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    font-weight: 500 !important;
    padding: 12px 15px !important;
}

/* Menu link hover states */
#side-bar a[href]:hover,
.tw-flex.tw-items-center.tw-gap-3:hover,
a[class*="hover:tw-text-gray-900"]:hover,
a[class*="hover:tw-bg-gray-100"]:hover {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    border-left: 4px solid #FFD700 !important;
    font-weight: bold !important;
    box-shadow: inset 0 0 15px rgba(255, 215, 0, 0.4), 0 0 15px rgba(255, 215, 0, 0.6) !important;
    transform: translateX(3px) !important;
}

/* Active menu states */
a[class*="tw-bg-gray-200"],
a[class*="tw-text-primary-700"],
.tw-bg-gray-200.tw-text-primary-700 {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    border-left: 4px solid #FFD700 !important;
    font-weight: bold !important;
    box-shadow: inset 0 0 15px rgba(255, 215, 0, 0.4), 0 0 15px rgba(255, 215, 0, 0.6) !important;
    animation: goldShimmer 3s infinite !important;
}

/* Dropdown menu items */
.drop_down {
    color: #ffffff !important;
    background: transparent !important;
    transition: all 0.3s ease !important;
}

.drop_down:hover {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    font-weight: bold !important;
}

/* Child menu items */
.chiled a[href] {
    color: #FFD700 !important;
    background: transparent !important;
    padding-left: 20px !important;
    font-size: 14px !important;
    transition: all 0.3s ease !important;
}

.chiled a[href]:hover,
.chiled a[class*="hover:tw-text-gray-900"]:hover {
    background: rgba(255, 215, 0, 0.1) !important;
    color: #FFC107 !important;
    transform: translateX(5px) !important;
}

.chiled a[class*="tw-text-primary-700"] {
    color: #FFD700 !important;
    background: rgba(255, 215, 0, 0.1) !important;
    font-weight: bold !important;
}

/* Menu dividers and lines */
.tw-bg-gray-200 {
    background: rgba(255, 215, 0, 0.3) !important;
}

/* Header sections in menu */
.tw-text-xs.tw-font-semibold.tw-uppercase {
    color: #FFD700 !important;
    background: #1a1a1a !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    padding: 10px 15px !important;
}

/* SVG icons in menu */
#side-bar svg,
.tw-text-gray-500 {
    color: #FFC107 !important;
}

#side-bar a:hover svg,
#side-bar a[class*="tw-bg-gray-200"] svg {
    color: #000000 !important;
}

/* Override text colors */
.tw-text-gray-600 {
    color: #ffffff !important;
}

.tw-text-gray-900 {
    color: #000000 !important;
}

/* Force text truncation styling */
.tw-truncate {
    color: inherit !important;
}

/* Override any remaining gray backgrounds */
[class*="tw-bg-gray"] {
    background: rgba(255, 215, 0, 0.1) !important;
}

/* Menu container specific styling */
.tw-flex-1.tw-p-3.tw-space-y-3 {
    background: #000000 !important;
    padding: 0 !important;
}

/* Focus states */
a[class*="focus:tw-text-gray-900"],
a[class*="focus:tw-bg-gray-100"] {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    outline: 2px solid #FFD700 !important;
}

/* ===== USER DROPDOWN MENU SPECIFIC OVERRIDES ===== */

/* User dropdown container */
.tw-dw-dropdown {
    position: relative !important;
}

/* User dropdown trigger button */
.tw-dw-dropdown summary,
summary[class*="tw-bg-"],
summary[data-toggle="popover"] {
    background: #000000 !important;
    color: #FFD700 !important;
    border: 1px solid #FFD700 !important;
    border-radius: 6px !important;
    transition: all 0.3s ease !important;
}

.tw-dw-dropdown summary:hover,
summary[class*="tw-bg-"]:hover,
summary[data-toggle="popover"]:hover {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 15px rgba(255, 215, 0, 0.4) !important;
}

/* Dropdown menu container */
.tw-dw-dropdown ul,
ul[class*="tw-bg-white"],
ul[class*="tw-absolute"],
.tw-p-2.tw-w-48.tw-absolute {
    background: #000000 !important;
    border: 2px solid #FFD700 !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 25px rgba(255, 215, 0, 0.4) !important;
    z-index: 9999 !important;
    color: #FFD700 !important;
    position: absolute !important;
    top: 100% !important;
    right: 0 !important;
    min-width: 200px !important;
}

/* Dropdown header section */
.tw-dw-dropdown .tw-px-4.tw-pt-3.tw-pb-1 {
    background: #1a1a1a !important;
    border-bottom: 1px solid #FFD700 !important;
    border-radius: 6px 6px 0 0 !important;
    padding: 12px 16px 8px !important;
}

.tw-dw-dropdown .tw-px-4.tw-pt-3.tw-pb-1 p {
    color: #FFD700 !important;
    font-weight: 500 !important;
}

.tw-dw-dropdown .tw-text-gray-900 {
    color: #FFC107 !important;
    font-weight: bold !important;
}

/* Dropdown menu items */
.tw-dw-dropdown li,
.tw-dw-dropdown li a {
    background: transparent !important;
    color: #FFD700 !important;
    transition: all 0.3s ease !important;
    border-radius: 6px !important;
    margin: 2px 4px !important;
}

.tw-dw-dropdown li a:hover,
a[class*="hover:tw-text-gray-900"]:hover,
a[class*="hover:tw-bg-gray-100"]:hover {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    transform: translateX(3px) !important;
    box-shadow: 0 2px 8px rgba(255, 215, 0, 0.3) !important;
}

/* Dropdown SVG icons */
.tw-dw-dropdown svg {
    color: #FFC107 !important;
    transition: all 0.3s ease !important;
}

.tw-dw-dropdown a:hover svg {
    color: #000000 !important;
}

/* Override specific text colors in dropdown */
.tw-text-gray-600 {
    color: #FFD700 !important;
}

.tw-text-sm {
    color: inherit !important;
}

/* Ensure dropdown positioning */
.tw-dw-dropdown ul[role="menu"] {
    position: absolute !important;
    right: 0 !important;
    top: 100% !important;
    margin-top: 8px !important;
    min-width: 200px !important;
    max-height: 400px !important;
    overflow-y: auto !important;
}

/* Details/Summary styling for proper dropdown behavior */
details[open] summary ~ * {
    animation: fadeIn 0.3s ease-in-out !important;
}

@keyframes fadeIn {
    0% { 
        opacity: 0 !important; 
        transform: translateY(-10px) !important; 
    }
    100% { 
        opacity: 1 !important; 
        transform: translateY(0) !important; 
    }
}

/* Fix for white background override */
[class*="tw-bg-white"] {
    background: #000000 !important;
}

/* Ring and shadow overrides for dropdown */
[class*="tw-ring-gray-200"] {
    border-color: #FFD700 !important;
    box-shadow: 0 0 0 1px rgba(255, 215, 0, 0.2) !important;
}

/* User name text styling */
.tw-dw-dropdown .tw-font-medium {
    color: #FFC107 !important;
    font-weight: bold !important;
}

/* Truncate text styling */
.tw-dw-dropdown .tw-truncate {
    color: inherit !important;
}

/* Ensure dropdown visibility and proper layering */
.tw-dw-dropdown {
    position: relative !important;
    z-index: 9999 !important;
}

.tw-dw-dropdown details[open] ul {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 9999 !important;
    position: absolute !important;
    top: 100% !important;
    right: 0 !important;
    margin-top: 8px !important;
}

.tw-dw-dropdown details ul {
    display: none !important;
}

/* Override any conflicting popover styles */
.tw-dw-dropdown [data-toggle="popover"] + ul {
    background: #000000 !important;
    border: 2px solid #FFD700 !important;
    color: #FFD700 !important;
}

/* Additional specificity for menu items */
.tw-dw-dropdown ul[role="menu"] li a[role="menuitem"] {
    background: transparent !important;
    color: #FFD700 !important;
    padding: 8px 12px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    text-decoration: none !important;
}

.tw-dw-dropdown ul[role="menu"] li a[role="menuitem"]:hover {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    transform: translateX(3px) !important;
}

/* Force override for any remaining white backgrounds */
.tw-dw-dropdown * {
    border-color: #FFD700 !important;
}

.tw-dw-dropdown *[class*="white"] {
    background: #000000 !important;
    color: #FFD700 !important;
}

/* Shadow and ring override with higher specificity */
.tw-dw-dropdown ul.tw-shadow-lg {
    box-shadow: 0 8px 25px rgba(255, 215, 0, 0.4) !important;
}

.tw-dw-dropdown ul.tw-ring-1 {
    border: 2px solid #FFD700 !important;
}

/* ===== CRITICAL Z-INDEX FIXES FOR ALL HEADER ELEMENTS ===== */

/* GLOBAL HEADER CONTAINER FIX */
.thetop,
.tw-flex.thetop,
div[class*="tw-border-b"][class*="tw-bg-gradient-to-r"] {
    position: relative !important;
    z-index: 100000 !important;
    isolation: isolate !important;
}

/* ALL HEADER DROPDOWNS AND POPOVERS */
.tw-dw-dropdown details[open] ul,
.popover,
.tooltip,
.dropdown-menu,
[data-toggle="popover"] + .popover,
[data-trigger="click"] + .popover,
.popover-content,
.calculator-popover,
[class*="popover"],
details[open] > ul,
details[open] > .dropdown-menu {
    position: fixed !important;
    z-index: 999999 !important;
    top: 60px !important;
    right: 20px !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;
    margin: 0 !important;
    padding: 8px !important;
    min-width: 200px !important;
    max-width: 300px !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    display: block !important;
}

/* Ensure header doesn't create stacking context issues */
.thetop,
.tw-flex.thetop {
    position: relative !important;
    z-index: 100000 !important;
}

/* Force dropdown container to highest level */
.tw-dw-dropdown {
    position: relative !important;
    z-index: 100001 !important;
}

.tw-dw-dropdown details {
    position: relative !important;
    z-index: 100001 !important;
}

/* Override any overflow hidden that might clip the dropdown */
main,
.tw-flex.tw-flex-col.tw-flex-1,
.tw-flex-1.tw-overflow-y-auto,
#scrollable-container,
.tw-h-screen,
.tw-h-full,
.tw-min-w-0 {
    overflow: visible !important;
    z-index: 1 !important;
}

/* Force visibility on all parent containers */
html, body {
    overflow-x: visible !important;
    overflow-y: auto !important;
}

/* Ensure no transforms interfere */
* {
    transform-style: flat !important;
}

/* Force dropdown to always be visible */
.tw-dw-dropdown details[open] ul {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    contain: none !important;
    isolation: auto !important;
}

/* ===== BOOTSTRAP POPOVER OVERRIDES ===== */

/* Target all Bootstrap popovers */
.popover {
    position: fixed !important;
    z-index: 2147483647 !important;
    background: #000000 !important;
    border: 2px solid #FFD700 !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 25px rgba(255, 215, 0, 0.4) !important;
    color: #FFD700 !important;
    max-width: 400px !important;
    min-width: 250px !important;
}

.popover .popover-header,
.popover .popover-title {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
    border-bottom: 1px solid #B8860B !important;
    font-weight: bold !important;
}

.popover .popover-body,
.popover .popover-content {
    background: #000000 !important;
    color: #FFD700 !important;
    padding: 15px !important;
}

.popover .arrow::before,
.popover .arrow::after {
    border-color: #FFD700 !important;
}

/* Calculator specific styling */
.calculator-popover,
[data-content*="calculator"] + .popover {
    background: #000000 !important;
    border: 2px solid #FFD700 !important;
    min-width: 300px !important;
}

/* Tooltip overrides */
.tooltip {
    z-index: 2147483647 !important;
    background: #000000 !important;
    color: #FFD700 !important;
    border: 1px solid #FFD700 !important;
}

.tooltip .tooltip-inner {
    background: #000000 !important;
    color: #FFD700 !important;
    border: 1px solid #FFD700 !important;
}

/* Force positioning for all header interactive elements */
.thetop [data-toggle],
.thetop [data-trigger],
.thetop .dropdown,
.thetop .dropup,
.thetop details {
    position: relative !important;
    z-index: 100001 !important;
}

/* Override any jQuery UI or other plugin z-index */
.ui-widget-overlay,
.ui-dialog,
.ui-autocomplete,
.select2-dropdown {
    z-index: 2147483646 !important;
}

/* Force all header buttons to have proper stacking */
.thetop button,
.thetop a,
.thetop summary,
.thetop .btn {
    position: relative !important;
    z-index: 100002 !important;
}

/* ===== AUTHENTICATION SCREENS OVERRIDES ===== */

/* Authentication body styling */
body.hold-transition {
    background: linear-gradient(135deg, #000000 0%, #1a1a1a 50%, #2d2d2d 100%) !important;
    color: #FFD700 !important;
    min-height: 100vh !important;
}

/* Authentication containers */
.container-fluid,
.eq-height-row,
.right-col {
    background: transparent !important;
}

/* Authentication forms */
.auth-form,
.login-form,
.register-form {
    background: rgba(0, 0, 0, 0.9) !important;
    border: 2px solid #FFD700 !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 32px rgba(255, 215, 0, 0.3) !important;
    backdrop-filter: blur(10px) !important;
}

/* Authentication text colors */
.auth-container h1,
.auth-container h2,
.auth-container h3,
.auth-container h4,
.auth-container p,
.auth-container span,
.auth-container label {
    color: #FFD700 !important;
}

/* Authentication links */
.auth-container a {
    color: #FFD700 !important;
    transition: color 0.3s ease !important;
}

.auth-container a:hover {
    color: #FFC107 !important;
    text-decoration: underline !important;
}

/* Registration wizard */
.wizard {
    background: transparent !important;
}

.wizard .content {
    background: rgba(0, 0, 0, 0.9) !important;
    border: 2px solid #FFD700 !important;
    color: #FFD700 !important;
    border-radius: 8px !important;
}

.wizard .steps {
    background: rgba(26, 26, 26, 0.8) !important;
    border: 1px solid #FFD700 !important;
}

.wizard .steps ul li a {
    color: #FFD700 !important;
    background: rgba(26, 26, 26, 0.8) !important;
    border: 1px solid #FFD700 !important;
}

.wizard .steps ul li.current a,
.wizard .steps ul li.done a {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
}

/* Password reset forms */
.password-reset-container {
    background: rgba(0, 0, 0, 0.9) !important;
    border: 2px solid #FFD700 !important;
    border-radius: 12px !important;
    color: #FFD700 !important;
}

/* Error messages */
.has-error .help-block,
.invalid-feedback,
.error-message {
    color: #FF6B6B !important;
    background: rgba(255, 107, 107, 0.1) !important;
    border: 1px solid #FF6B6B !important;
    border-radius: 4px !important;
    padding: 5px 10px !important;
}

/* Success messages */
.alert-success,
.success-message {
    background: rgba(255, 215, 0, 0.1) !important;
    border: 2px solid #FFD700 !important;
    color: #FFD700 !important;
    border-radius: 8px !important;
}

/* Input group styling */
.input-group-addon {
    background: rgba(26, 26, 26, 0.8) !important;
    border: 2px solid #FFD700 !important;
    color: #FFD700 !important;
}

.input-group .form-control {
    border: 2px solid #FFD700 !important;
    background: rgba(26, 26, 26, 0.8) !important;
    color: #FFD700 !important;
}

.input-group .form-control:focus {
    background: rgba(0, 0, 0, 0.9) !important;
    border-color: #FFC107 !important;
    box-shadow: 0 0 0 0.2rem rgba(255, 215, 0, 0.25) !important;
}

/* Select2 in auth pages */
.select2-container--default .select2-selection--single {
    background: rgba(26, 26, 26, 0.8) !important;
    border: 2px solid #FFD700 !important;
    color: #FFD700 !important;
}

/* Date picker */
.datepicker {
    background: #000000 !important;
    border: 2px solid #FFD700 !important;
    color: #FFD700 !important;
}

.datepicker table tr td.active,
.datepicker table tr td.active:hover {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #F39C12 100%) !important;
    color: #000000 !important;
}

/* Language selector */
.language-selector {
    background: rgba(0, 0, 0, 0.5) !important;
    border: 1px solid #FFD700 !important;
    border-radius: 6px !important;
}

.language-selector a {
    color: #FFD700 !important;
}

.language-selector a:hover {
    background: rgba(255, 215, 0, 0.1) !important;
    color: #FFC107 !important;
}

/* Create portal-like behavior */
body {
    position: relative !important;
}

/* Dropdown positioning relative to viewport */
.tw-dw-dropdown details[open] ul {
    position: fixed !important;
    z-index: 2147483647 !important; /* Maximum z-index value */
}

/* Portal-style positioning for absolute certainty */
.tw-dw-dropdown details[open] ul::before {
    content: '' !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: -1 !important;
    background: transparent !important;
    pointer-events: none !important;
}

/* Alternative high z-index approach */
.tw-dw-dropdown summary:focus + ul,
.tw-dw-dropdown summary:active + ul,
.tw-dw-dropdown details[open] > ul {
    position: fixed !important;
    z-index: 99999 !important;
    top: auto !important;
    right: auto !important;
    transform: translateY(8px) !important;
}

/* Responsive positioning fix */
@media (max-width: 768px) {
    .tw-dw-dropdown details[open] ul {
        position: fixed !important;
        top: 60px !important;
        right: 10px !important;
        left: 10px !important;
        width: auto !important;
        z-index: 99999 !important;
    }
}