/* Gold & Black Luxe Theme - Base Variables */
/* Premium cinematic theme with elegant gold accents on deep black backgrounds */

:root {
    /* Color Palette - Gold & Black Luxe */
    --theme-bg-primary: #121212;
    --theme-bg-secondary: #1D1D1D;
    --theme-bg-tertiary: #2A2A2A;
    --theme-bg-card: #1D1D1D;
    --theme-text-primary: #ffffff;
    --theme-text-secondary: #cccccc;
    --theme-text-muted: #888888;
    --theme-accent-gold: #D4AF37;
    --theme-accent-gold-hover: #F7E27A;
    --theme-accent-gold-dark: #B8941F;
    --theme-accent-blue: #1976D2;
    --theme-border: rgba(212, 175, 55, 0.2);
    --theme-shadow: rgba(0, 0, 0, 0.5);
    --theme-overlay: rgba(0, 0, 0, 0.7);
    
    /* Spacing */
    --spacing-appbar-height: 64px;
    --spacing-carousel-height: 300px;
    
    /* Z-index Layers */
    --z-index-appbar: 1000;
    --z-index-carousel: 1;
    --z-index-carousel-item: 10;
    
    /* Transitions */
    --transition-default: 0.3s ease;
    --transition-fast: 0.2s ease;
    --transition-slow: 0.5s ease;
}

/* Global Theme Styles */
body {
    background-color: var(--theme-bg-primary) !important;
    color: var(--theme-text-primary) !important;
    font-family: 'Poppins', 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}

/* Smooth theme transitions - MudBlazor 8.x enhanced */
body.theme-transitioning,
body.theme-transitioning * {
    transition: background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                color 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Theme selector active item */
.theme-item-active {
    background-color: rgba(212, 175, 55, 0.1) !important;
    font-weight: 500;
    border-left: 3px solid var(--theme-accent-gold, #D4AF37) !important;
}

.mud-main-content {
    background-color: var(--theme-bg-primary) !important;
}

.mud-container {
    background-color: transparent !important;
}

/* Cards */
.mud-card {
    background-color: var(--theme-bg-card) !important;
    border: 1px solid var(--theme-border) !important;
    box-shadow: 0 2px 8px var(--theme-shadow) !important;
    transition: all 0.3s ease !important;
}

.mud-card:hover {
    box-shadow: 0 4px 16px var(--theme-shadow) !important;
    transform: translateY(-2px) !important;
}

/* Buttons - Gold Theme */
.mud-button-filled-error {
    background-color: #E53935 !important;
    color: var(--theme-text-primary) !important;
}

.mud-button-filled-error:hover {
    background-color: #C62828 !important;
}

/* AppBar/Navigation - Gold & Black (not bottom footer) */
.mud-appbar:not(.app-footer) {
    background-color: var(--theme-bg-primary) !important;
    border-bottom: 2px solid var(--theme-accent-gold);
    box-shadow: 0 2px 8px rgba(212, 175, 55, 0.2);
    position: relative;
    z-index: var(--z-index-appbar);
}

/* Text Colors */
.mud-typography {
    color: var(--theme-text-primary) !important;
}

.mud-typography-body1,
.mud-typography-body2 {
    color: var(--theme-text-secondary) !important;
}

.text-secondary {
    color: var(--theme-text-muted) !important;
}

/* Paper/Containers */
.mud-paper {
    background-color: var(--theme-bg-card) !important;
    color: var(--theme-text-primary) !important;
}

/* Input Fields */
.mud-input {
    color: var(--theme-text-primary) !important;
}

.mud-input-outlined .mud-input-outlined-border {
    border-color: var(--theme-border) !important;
}

.mud-input-outlined:hover .mud-input-outlined-border {
    border-color: var(--theme-text-secondary) !important;
}

.mud-input-outlined.mud-input-outlined-focused .mud-input-outlined-border {
    border-color: var(--theme-accent-gold) !important;
}

/* Drawer */
.mud-drawer {
    background-color: var(--theme-bg-secondary) !important;
    border-right: 1px solid var(--theme-border) !important;
}

/* Menu */
.mud-menu {
    background-color: var(--theme-bg-card) !important;
}

.mud-menu-item {
    color: var(--theme-text-primary) !important;
}

.mud-menu-item:hover {
    background-color: var(--theme-bg-tertiary) !important;
}

/* Chips */
.mud-chip {
    background-color: var(--theme-bg-tertiary) !important;
    color: var(--theme-text-primary) !important;
}

/* Dividers */
.mud-divider {
    border-color: var(--theme-border) !important;
}

/* Progress Indicators */
.mud-progress-linear {
    background-color: var(--theme-bg-tertiary) !important;
}

.mud-progress-linear .mud-progress-linear-bar {
    background: linear-gradient(135deg, var(--theme-accent-gold) 0%, var(--theme-accent-gold-hover) 100%) !important;
}

/* Snackbar */
.mud-snackbar {
    background-color: var(--theme-bg-card) !important;
    color: var(--theme-text-primary) !important;
}

/* Dialog */
.mud-dialog {
    background-color: var(--theme-bg-card) !important;
}

.mud-dialog-title {
    color: var(--theme-text-primary) !important;
}

/* Grid */
.mud-grid {
    background-color: transparent !important;
}

/* Avatar - Gold Gradient */
.mud-avatar {
    background: linear-gradient(135deg, var(--theme-accent-gold) 0%, var(--theme-accent-gold-hover) 100%) !important;
}

/* Icon Buttons */
.mud-icon-button {
    color: var(--theme-text-secondary) !important;
}

.mud-icon-button:hover {
    background-color: var(--theme-bg-tertiary) !important;
    color: var(--theme-text-primary) !important;
}

/* Links - Gold Accent */
a {
    color: var(--theme-accent-gold) !important;
    cursor: pointer !important;
    transition: color 0.3s ease !important;
}

a:hover {
    color: var(--theme-accent-gold-hover) !important;
}

/* Cursor Styles for Interactive Elements */
button,
.mud-button,
.mud-button-root,
.mud-icon-button,
.mud-link,
[role="button"],
input[type="button"],
input[type="submit"],
input[type="reset"],
select,
.mud-select,
.mud-menu-item,
.mud-tab,
.mud-chip,
.clickable,
[onclick] {
    cursor: pointer !important;
}

button:disabled,
.mud-button:disabled,
.mud-button-root:disabled,
input:disabled,
select:disabled {
    cursor: not-allowed !important;
}

input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
textarea,
.mud-input {
    cursor: text !important;
}

/* Cards with click handlers */
.mud-card[onclick],
.mud-card[class*="clickable"],
.mud-card[class*="cursor-pointer"] {
    cursor: pointer !important;
}

/* Hover effects for clickable cards */
.mud-card:hover {
    cursor: pointer !important;
}

/* Section Cards - Theme Aware */
.section-card {
    border: 2px solid var(--theme-accent-blue, #1976D2) !important;
}

/* Section Header Text - Theme Aware */
.section-header-text {
    color: var(--theme-accent-blue, #1976D2) !important;
}

/* Ensure all text in dialogs is readable */
.mud-dialog-content .mud-typography,
.mud-dialog-content .mud-typography-body1,
.mud-dialog-content .mud-typography-body2 {
    color: var(--theme-text-primary, #ffffff) !important;
}

.mud-dialog-content .mud-typography-body2.text-secondary {
    color: var(--theme-text-secondary, #cccccc) !important;
}

/* Ensure all text in cards is readable */
.mud-card-content .mud-typography,
.mud-card-content .mud-typography-body1,
.mud-card-content .mud-typography-body2 {
    color: var(--theme-text-primary, #ffffff) !important;
}

.mud-card-content .mud-typography-body2.text-secondary {
    color: var(--theme-text-secondary, #cccccc) !important;
}

/* Ensure all text in paper is readable */
.mud-paper .mud-typography,
.mud-paper .mud-typography-body1,
.mud-paper .mud-typography-body2 {
    color: var(--theme-text-primary, #ffffff) !important;
}

.mud-paper .mud-typography-body2.text-secondary {
    color: var(--theme-text-secondary, #cccccc) !important;
}

/* Section Dialog Preview - Theme Aware */
.section-position-preview {
    background: var(--theme-bg-tertiary, #2A2A2A) !important;
}

.section-preview-box {
    border: 2px solid var(--theme-accent-blue, #1976D2) !important;
    background: var(--theme-bg-card, #1D1D1D) !important;
}

.section-preview-text {
    color: var(--theme-accent-blue, #1976D2) !important;
}