/* Light Theme for Booster Application */

[data-theme="light"] {
    /* Background */
    --background-image: url(/content/images/bg-light.webp);
    --background-color: #f5f5f5;
    /* Primary colors */
    --primary-color: #e25100;
    --primary-hover: #ff6f00;
    --primary-gradient-start: #ffffff;
    --primary-gradient-end: #FFD580;
    /* Text colors */
    --text-primary: #212121;
    --text-secondary: #424242;
    --text-muted: #757575;
    --text-caption: rgba(0, 0, 0, 0.6);
    /* Link colors */
    --link-color: #006bb7;
    --link-hover: #0088ee;
    /* Paper/Card colors */
    --paper-background: rgba(255, 255, 255, 0.7);
    --paper-border: rgba(0, 0, 0, 0.12);
    --paper-shadow: rgba(0, 0, 0, 0.1);
    /* Inner card colors */
    --inner-card-background: #fafafa;
    --inner-card-border: #e0e0e0;
    /* Navigation */
    --nav-background: #ffffff;
    --nav-text: #424242;
    --nav-hover-bg: rgba(228, 86, 0, 0.1);
    --nav-active-bg: rgba(228, 86, 0, 0.2);
    /* Drawer */
    --drawer-background: #ffffff;
    --drawer-border: rgba(0, 0, 0, 0.12);
    /* AppBar */
    --appbar-background: #e25100;
    --appbar-text: #ffffff;
    /* Forms */
    --input-background: rgba(255, 255, 255, 0.6);
    --input-background-filled: rgba(0, 0, 0, 0.04);
    --input-text: #212121;
    --input-label: #424242;
    --input-placeholder: #9e9e9e;
    --input-helper: #757575;
    --input-border: #bdbdbd;
    --input-border-hover: #9e9e9e;
    --input-border-focus: var(--primary-color);
    --input-focus-shadow: rgba(226, 81, 0, 0.25);
    --input-disabled-background: rgba(0, 0, 0, 0.04);
    --input-disabled-text: #9e9e9e;
    --input-adornment-icon: #757575;
    --popover-background: rgba(255, 255, 255, 0.95);
    --popover-border: rgba(0, 0, 0, 0.12);
    --popover-item-hover: rgba(228, 86, 0, 0.08);
    --popover-item-selected: rgba(228, 86, 0, 0.15);
    --popover-item-text: #212121;
    /* Status colors */
    --error-color: #d32f2f;
    --success-color: #2e7d32;
    --warning-color: #f57c00;
}

/* Apply light theme styles */
    [data-theme="light"] html,
    [data-theme="light"] body {
        background: var(--background-image) var(--background-color) center center / cover no-repeat fixed;
        color: var(--text-primary);
    }

/* AppBar */
[data-theme="light"] .appbar-gradient {
    background-color: var(--appbar-background) !important;
    color: var(--appbar-text);
}

/* Typography */
[data-theme="light"] .mud-typography-h1,
[data-theme="light"] .mud-typography-h2,
[data-theme="light"] .mud-typography-h3,
[data-theme="light"] .mud-typography-h4,
[data-theme="light"] .mud-typography-h5,
[data-theme="light"] .mud-typography-body2,
[data-theme="light"] .mud-typography-subtitle2.mud-list-item-secondary-text,
[data-theme="light"] .mud-breadcrumb-item > a,
[data-theme="light"] .mud-icon-root.mud-svg-icon {
    color: var(--text-primary);
}

/* FIXED: Paper/Cards - ALL instances get glass morphism
   OPTIMIZED: Reduced backdrop-filter for instant theme switch */
[data-theme="light"] .mud-paper {
    background: var(--paper-background) !important;
    border: 1px solid var(--paper-border) !important;
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
    box-shadow: 0 2px 8px var(--paper-shadow) !important;
    position: relative;
}

/* Remove the orange border gradient in light theme */
[data-theme="light"] .mud-paper::before {
    display: none !important;
}

/* Ensure content is above any pseudo-elements */
[data-theme="light"] .mud-paper > * {
    position: relative;
    z-index: 1;
}

[data-theme="light"] .mud-paper :is(p, .mud-typography-h1, .mud-typography-h2, .mud-typography-h3, .mud-typography-h5, .mud-typography-h6, .mud-typography-body1, .mud-typography-body2, .mud-icon-root.mud-svg-icon):not([class*="-text"]) {
    color: var(--text-primary);
    fill: var(--text-primary);
}

[data-theme="light"] .mud-paper h3 strong,
[data-theme="light"] .mud-paper h5,
[data-theme="light"] .mud-paper h6 {
    color: var(--primary-color) !important;
}

/* Navigation */
[data-theme="light"] .sidebar {
    background-image: linear-gradient(180deg, var(--primary-gradient-start) 0%, var(--primary-gradient-end) 70%);
}

[data-theme="light"] .mud-nav-menu-custom .mud-nav-link {
    color: var(--nav-text) !important;
}

[data-theme="light"] .mud-nav-menu-custom .mud-nav-link:hover {
    background-color: var(--nav-hover-bg) !important;
    color: var(--text-primary) !important;
}

[data-theme="light"] .mud-nav-menu-custom .mud-nav-link.active {
    background-color: var(--nav-active-bg) !important;
    color: var(--text-primary) !important;
}

[data-theme="light"] .nav-item .nav-link {
    color: var(--nav-text);
}

[data-theme="light"] .nav-item a.active {
    background-color: var(--nav-active-bg);
    color: var(--text-primary);
}

[data-theme="light"] .nav-item .nav-link:hover {
    background-color: var(--nav-hover-bg);
    color: var(--text-primary);
}

/* Drawer */
[data-theme="light"] .mud-drawer {
    background-color: var(--drawer-background) !important;
    backdrop-filter: none;
    border-right: 1px solid var(--drawer-border);
}

/* Links */
[data-theme="light"] a,
[data-theme="light"] .btn-link {
    color: var(--link-color);
}

/* Buttons */
[data-theme="light"] .mud-button-filled:disabled {
    color: rgba(0, 0, 0, 0.38) !important;
    background-color: rgba(0, 0, 0, 0.12) !important;
}

/* Button icons same color as button */
[data-theme="light"] .mud-button .mud-icon-root {
    color: inherit !important;
    fill: currentColor !important;
}

/* Forms */
[data-theme="light"] .darker-border-checkbox.form-check-input {
    border-color: var(--input-border);
}

/* ====================================================================
   FORM INPUTS - MudTextField, MudSelect - Light Theme
   ==================================================================== */

/* Input fields - Outlined variant */
[data-theme="light"] .mud-input,
[data-theme="light"] .mud-input-outlined .mud-input-root,
[data-theme="light"] .mud-input-outlined input,
[data-theme="light"] .mud-input-outlined textarea,
[data-theme="light"] .mud-select-outlined .mud-select-input {
    color: var(--input-text) !important;
    background-color: var(--input-background) !important;
}

/* Input fields - Filled variant */
[data-theme="light"] .mud-input-filled .mud-input-root,
[data-theme="light"] .mud-input-filled input,
[data-theme="light"] .mud-input-filled textarea,
[data-theme="light"] .mud-select-filled .mud-select-input {
    color: var(--input-text) !important;
    background-color: var(--input-background-filled) !important;
}

/* Input fields - Text variant */
[data-theme="light"] .mud-input-text .mud-input-root,
[data-theme="light"] .mud-input-text input,
[data-theme="light"] .mud-input-text textarea {
    color: var(--input-text) !important;
}

/* Labels */
[data-theme="light"] .mud-input-label,
[data-theme="light"] .mud-input-label-inputcontrol,
[data-theme="light"] .mud-select-label {
    color: var(--input-label) !important;
}

/* Helper text */
[data-theme="light"] .mud-input-helper-text,
[data-theme="light"] .mud-select-helper-text {
    color: var(--input-helper) !important;
}

/* Placeholder */
[data-theme="light"] .mud-input-root::placeholder,
[data-theme="light"] input::placeholder,
[data-theme="light"] textarea::placeholder {
    color: var(--input-placeholder) !important;
    opacity: 0.85 !important;
}

/* Borders */
[data-theme="light"] .mud-input-outlined .mud-input-slot,
[data-theme="light"] .mud-select-outlined .mud-input-slot {
    border-color: var(--input-border) !important;
}

/* Hover state */
[data-theme="light"] .mud-input-outlined:hover .mud-input-slot,
[data-theme="light"] .mud-select-outlined:hover .mud-input-slot {
    border-color: var(--input-border-hover) !important;
}

/* Focus state */
[data-theme="light"] .mud-input-outlined.mud-input-focused .mud-input-slot,
[data-theme="light"] .mud-select-outlined.mud-select-focused .mud-input-slot {
    border-color: var(--input-border-focus) !important;
    border-width: 2px !important;
    box-shadow: 0 0 0 2px var(--input-focus-shadow) !important;
}

/* Disabled state */
[data-theme="light"] .mud-input-disabled input,
[data-theme="light"] .mud-input-disabled textarea,
[data-theme="light"] .mud-select-disabled .mud-select-input {
    color: var(--input-disabled-text) !important;
    background-color: var(--input-disabled-background) !important;
}

/* Select dropdown arrow icon */
[data-theme="light"] .mud-select .mud-icon-root,
[data-theme="light"] .mud-input-adornment .mud-icon-root {
    color: var(--input-adornment-icon) !important;
}

/* Autocomplete/Select dropdown popover */
[data-theme="light"] .mud-popover-paper.mud-select-popover,
[data-theme="light"] .mud-menu-paper {
    background-color: var(--popover-background) !important;
    border: 1px solid var(--popover-border) !important;
}

[data-theme="light"] .mud-list-item {
    color: var(--popover-item-text) !important;
}

    [data-theme="light"] .mud-list-item:hover {
        background-color: var(--popover-item-hover) !important;
    }

    [data-theme="light"] .mud-list-item.mud-selected-item {
        background-color: var(--popover-item-selected) !important;
        color: var(--text-primary) !important;
        font-weight: 600 !important;
    }

/* Connection Indicator */
[data-theme="light"] #connection-indicator {
    background: linear-gradient(135deg, var(--warning-color) 0%, #ef6c00 100%);
    color: var(--text-primary);
}

/* ====================================================================
   MOBILE OPTIMIZATIONS - Light Theme
   ==================================================================== */
@media (max-width: 768px) {
    /* Stronger background for mobile readability */
    [data-theme="light"] {
        --paper-background: rgba(255, 255, 255, 0.9);
        --paper-border: rgba(0, 0, 0, 0.2);
    }
    
    /* Reduce blur effects on mobile for better performance */
    [data-theme="light"] .mud-paper {
        backdrop-filter: blur(8px) saturate(120%) !important;
        -webkit-backdrop-filter: blur(8px) saturate(120%) !important;
    }
    
    /* Enhanced text contrast on mobile */
    [data-theme="light"] .mud-typography-body1,
    [data-theme="light"] .mud-typography-body2 {
        color: #1a1a1a !important;
        font-weight: 500;
    }
    
    /* Stronger borders for mobile visibility */
    [data-theme="light"] .mud-paper {
        border: 2px solid var(--paper-border) !important;
        box-shadow: 0 4px 12px var(--paper-shadow) !important;
    }
}

/* =========================
   SOCIAL POSTS KANBAN - Light Theme
   ========================= */

[data-theme="light"] .social-post-card {
    background: rgba(0, 0, 0, 0.05) !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
}

    [data-theme="light"] .social-post-card:hover {
        background: rgba(0, 0, 0, 0.08) !important;
        border-color: rgba(226, 81, 0, 0.3) !important;
    }

[data-theme="light"] .social-stat-card {
    background: rgba(0, 0, 0, 0.04) !important;
    border: 2px solid rgba(0, 0, 0, 0.08) !important;
}

    [data-theme="light"] .social-stat-card:hover {
        background: rgba(0, 0, 0, 0.06) !important;
        border-color: rgba(226, 81, 0, 0.25) !important;
    }

[data-theme="light"] .social-stat-card-active {
    background: rgba(226, 81, 0, 0.08) !important;
    border-color: rgba(226, 81, 0, 0.5) !important;
    box-shadow: 0 0 12px rgba(226, 81, 0, 0.1);
}

/* Error states */
[data-theme="light"] .invalid {
    outline: 1px solid var(--error-color);
}

[data-theme="light"] .validation-message {
    color: var(--error-color);
}

[data-theme="light"] .valid.modified:not([type=checkbox]) {
    outline: 1px solid var(--success-color);
}

/* Thumbnails */
[data-theme="light"] .highlighted-image {
    border-color: var(--primary-hover);
}

[data-theme="light"] .highlighted-image::after {
    box-shadow: 0 0 12px 3px rgba(255, 111, 0, 0.4);
}

/* Nav icons */
[data-theme="light"] .mud-nav-link:not(.mud-nav-link-disabled) .mud-nav-link-icon.mud-nav-link-icon-default {
    fill: var(--text-secondary);
}

[data-theme="light"] .mud-navmenu.mud-navmenu-default .mud-nav-link-expand-icon.mud-transform {
    fill: var(--primary-color);
}

/* List items */
[data-theme="light"] .mud-list-item.clickable:hover {
    background: rgba(228, 86, 0, 0.08);
}

/* Post bar */
[data-theme="light"] .mud-postbar .mud-postbar-btn {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

[data-theme="light"] .mud-postbar .mud-postbar-btn.active {
    background: var(--primary-color);
    color: #ffffff;
    border-color: var(--primary-color);
}

[data-theme="light"] .mud-postbar .mud-postbar-btn:not(.active):hover {
    background: rgba(228, 86, 0, 0.08);
}

/* JSON Dialog */
[data-theme="light"] .json-dialog-content {
    background-color: #f5f5f5 !important;
}

[data-theme="light"] .json-pre {
    color: var(--text-primary);
}

/* Prompt output display */
[data-theme="light"] .prompt-output {
    background: rgba(245, 245, 245, 0.8);
    border: 1px solid var(--paper-border);
}

[data-theme="light"] .prompt-output pre {
    color: var(--text-primary);
}

/* MudBlazor text color overrides for light theme */
[data-theme="light"] .text-white,
[data-theme="light"] .mud-typography.text-white {
    color: var(--appbar-text) !important;
}

/* Navigation text colors for light theme */
[data-theme="light"] .mud-nav-menu-custom .mud-text {
    color: var(--nav-text) !important;
}

/* Ensure AppBar text stays white in light theme */
[data-theme="light"] .appbar-gradient .mud-typography,
[data-theme="light"] .appbar-gradient .text-white {
    color: var(--appbar-text) !important;
}