/* ===== Cyberpunk Theme ===== */

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;700&family=Share+Tech+Mono&family=Rajdhani:wght@300;400;500;600;700&display=swap');

:root {
    --theme-bg: #080c14;
    --theme-bg-panel: rgba(10, 18, 32, 0.85);
    --theme-bg-card: rgba(12, 22, 40, 0.75);
    --theme-bg-input: rgba(8, 16, 30, 0.9);
    --theme-glass: rgba(20, 40, 70, 0.4);
    --theme-primary: #00e5ff;
    --theme-primary-dim: #0097a7;
    --theme-primary-muted: #1a4a5a;
    --theme-accent: #ff0090;
    --theme-accent-dim: #cc0073;
    --theme-secondary: #b040ff;
    --theme-blue: #304ffe;
    --theme-tertiary: #ff6d00;
    --theme-border: rgba(0, 229, 255, 0.15);
    --theme-border-strong: rgba(0, 229, 255, 0.3);
    --theme-text: #c8d8e8;
    --theme-text-bright: #e8f4ff;
    --theme-text-muted: #5a7a8a;
    --theme-danger: #ff1744;
    --theme-warning: #ffea00;
    --theme-success: #00e676;
    --theme-glow-primary: 0 0 15px rgba(0, 229, 255, 0.3), 0 0 30px rgba(0, 229, 255, 0.1);
    --theme-glow-accent: 0 0 15px rgba(255, 0, 144, 0.3), 0 0 30px rgba(255, 0, 144, 0.1);
    --font-display: 'Orbitron', 'Rajdhani', sans-serif;
    --font-mono: 'Share Tech Mono', 'Cascadia Code', 'Consolas', monospace, 'Segoe UI Emoji', 'Noto Color Emoji', 'Apple Color Emoji';
    --font-body: 'Rajdhani', 'Segoe UI', sans-serif;

    /* Cyberpunk-specific extras */
    --theme-heading-shadow: var(--theme-glow-primary);
    --theme-card-shadow: 0 4px 20px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(0, 229, 255, 0.05);
    --theme-card-backdrop: blur(12px);
    --theme-card-highlight: linear-gradient(90deg, transparent, var(--theme-primary), transparent);
    --theme-card-highlight-opacity: 0.4;
    --theme-card-header-bg: rgba(0, 229, 255, 0.05);
    --theme-toprow-bg: rgba(8, 14, 24, 0.9);
    --theme-toprow-backdrop: none; /* backdrop-filter creates a containing block that breaks position:fixed children (voice panel) */
    --theme-toprow-line: linear-gradient(90deg, transparent, rgba(0, 229, 255, 0.3), rgba(255, 0, 144, 0.2), transparent);
    --theme-sidebar-bg: linear-gradient(180deg, #060a14 0%, #0a1020 50%, #08101c 100%);
    --theme-sidebar-border: rgba(0, 229, 255, 0.1);
    --theme-sidebar-shadow: 2px 0 20px rgba(0, 0, 0, 0.5);
    --theme-nav-active-bg: linear-gradient(90deg, rgba(0, 229, 255, 0.1), transparent);
    --theme-nav-hover-bg: rgba(0, 229, 255, 0.05);
    --theme-scrollbar-track: rgba(0, 0, 0, 0.3);
    --theme-scrollbar-thumb: var(--theme-primary-muted);
    --theme-scrollbar-thumb-hover: var(--theme-primary-dim);
    --theme-selection-bg: rgba(0, 229, 255, 0.25);
    --theme-console-bg: rgba(4, 8, 16, 0.95);
    --theme-busy-overlay-bg: rgba(4, 8, 16, 0.32);
    --theme-placeholder: #3a5a6a;
    --theme-form-text: #4a6a7a;
    --theme-spinner-ring: rgba(0, 229, 255, 0.15);
    --theme-btn-disabled-opacity: 0.3;
    --theme-matrix-display: block;

    /* Button backgrounds */
    --theme-code-bg: rgba(0, 229, 255, 0.06);
    --theme-btn-primary-bg: linear-gradient(135deg, rgba(0, 229, 255, 0.15), rgba(0, 229, 255, 0.05));
    --theme-btn-primary-hover-bg: linear-gradient(135deg, rgba(0, 229, 255, 0.3), rgba(0, 229, 255, 0.1));
    --theme-btn-hover-color: #fff;
    --theme-btn-secondary-border: rgba(200, 216, 232, 0.2);
    --theme-btn-secondary-hover-bg: rgba(200, 216, 232, 0.08);
    --theme-btn-secondary-hover-border: rgba(200, 216, 232, 0.4);
    --theme-btn-danger-hover-bg: rgba(255, 23, 68, 0.12);
    --theme-btn-warning-hover-bg: rgba(255, 109, 0, 0.12);
    --theme-btn-info-hover-bg: rgba(176, 64, 255, 0.12);
    --theme-btn-success-bg: linear-gradient(135deg, rgba(0, 230, 118, 0.15), rgba(0, 230, 118, 0.05));
    --theme-btn-success-hover-bg: linear-gradient(135deg, rgba(0, 230, 118, 0.3), rgba(0, 230, 118, 0.1));
    --theme-btn-success-outline-hover-bg: rgba(0, 230, 118, 0.12);

    /* Badge backgrounds / borders */
    --theme-badge-primary-bg: rgba(0, 229, 255, 0.15);
    --theme-badge-primary-border: rgba(0, 229, 255, 0.3);
    --theme-badge-success-bg: rgba(0, 230, 118, 0.15);
    --theme-badge-success-border: rgba(0, 230, 118, 0.3);
    --theme-badge-danger-bg: rgba(255, 23, 68, 0.15);
    --theme-badge-danger-border: rgba(255, 23, 68, 0.3);
    --theme-badge-warning-bg: rgba(255, 234, 0, 0.12);
    --theme-badge-warning-border: rgba(255, 234, 0, 0.3);
    --theme-badge-secondary-bg: rgba(0, 229, 255, 0.08);

    /* Alert backgrounds / borders */
    --theme-alert-info-bg: rgba(0, 229, 255, 0.06);
    --theme-alert-warning-bg: rgba(255, 234, 0, 0.06);
    --theme-alert-warning-border: rgba(255, 234, 0, 0.2);
    --theme-alert-danger-bg: rgba(255, 23, 68, 0.06);
    --theme-alert-danger-border: rgba(255, 23, 68, 0.2);

    /* Selection / Error UI / Cancel */
    --theme-selection-color: #fff;
    --theme-error-ui-bg: rgba(20, 4, 8, 0.95);
    --theme-error-ui-border: rgba(255, 23, 68, 0.3);
    --theme-error-ui-shadow: 0 -2px 15px rgba(255, 23, 68, 0.15);
    --theme-cancel-bg: rgba(255, 23, 68, 0.08);
    --theme-cancel-hover-bg: rgba(255, 23, 68, 0.18);
    --theme-sidebar-hover-shadow: 4px 0 30px rgba(0, 0, 0, 0.7);

    /* Console line colors */
    --theme-console-text: #88c8d8;
    --theme-console-text-empty: #2a4a5a;
    --theme-console-cmd: #4ec9b0;
    --theme-console-prompt: #569cd6;
    --theme-console-error: #f14c4c;
    --theme-console-tag: #dcdcaa;
    --theme-console-shell: #ce9178;
    --theme-console-processing: #6a9955;

    /* Git log colors */
    --theme-git-bg: rgba(4, 8, 16, 0.95);
    --theme-git-text: #d4d4d4;
    --theme-git-odd-bg: rgba(255, 255, 255, 0.02);
    --theme-git-even-bg: rgba(0, 0, 0, 0.15);
    --theme-git-head-bg: rgba(78, 201, 176, 0.08);
    --theme-git-head-badge: #4ec9b0;
    --theme-git-hash: #dcdcaa;
    --theme-git-date: #6a9955;
    --theme-git-message: #d4d4d4;
    --theme-git-expand: #569cd6;
    --theme-git-body-bg: rgba(255, 255, 255, 0.03);
    --theme-git-body-border: #569cd6;
    --theme-git-body-text: #ccc;

    /* Dialog colors */
    --theme-dialog-bg: #1e1e1e;
    --theme-dialog-border: #444;
    --theme-dialog-text: #d4d4d4;
    --theme-dialog-code-bg: #2d2d2d;
    --theme-dialog-muted: #888;
}

/* Cyberpunk-specific: text-shadow on headings */
h1, h2, h3 {
    text-shadow: var(--theme-glow-primary);
}

/* Cyberpunk-specific: backdrop-filter on cards */
.card {
/*    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);*/
}

/* Cyberpunk-specific: card top highlight line */
.card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: var(--theme-card-highlight);
    opacity: var(--theme-card-highlight-opacity);
}

/* Cyberpunk-specific: header backdrop */
.card-header {
    backdrop-filter: blur(8px);
}

/* Cyberpunk-specific: link hover glow */
a:hover {
    text-shadow: var(--theme-glow-accent);
}

/* Cyberpunk-specific: focus glow on inputs */
.form-control:focus, .form-select:focus {
    box-shadow: 0 0 0 2px rgba(0, 229, 255, 0.15), var(--theme-glow-primary) !important;
}

/* Cyberpunk-specific: checked checkbox glow */
.form-check-input:checked {
    box-shadow: 0 0 8px rgba(0, 229, 255, 0.4) !important;
}

/* Cyberpunk-specific: button hover glows */
.btn-primary:hover, .btn-primary:focus {
    box-shadow: var(--theme-glow-primary) !important;
}

.btn-outline-danger:hover {
    box-shadow: 0 0 12px rgba(255, 23, 68, 0.25) !important;
}

.btn-outline-warning:hover {
    box-shadow: 0 0 12px rgba(255, 109, 0, 0.25) !important;
}

.btn-outline-info:hover {
    box-shadow: 0 0 12px rgba(176, 64, 255, 0.25) !important;
}

.btn-success:hover {
    box-shadow: 0 0 12px rgba(0, 230, 118, 0.3) !important;
}

.btn-outline-success:hover {
    box-shadow: 0 0 12px rgba(0, 230, 118, 0.25) !important;
}

/* Cyberpunk-specific: badge glows */
.badge.bg-primary {
    box-shadow: 0 0 8px rgba(0, 229, 255, 0.2);
}

.badge.bg-success {
    box-shadow: 0 0 8px rgba(0, 230, 118, 0.2);
}

/* Cyberpunk-specific: alert backdrop */
.alert {
    backdrop-filter: blur(8px);
}

/* Cyberpunk-specific: list-group backdrop */
.list-group-item {
    backdrop-filter: blur(8px);
}

.list-group-item:hover {
    box-shadow: 0 0 15px rgba(0, 229, 255, 0.05);
}

/* Cyberpunk-specific: console inner shadow */
.console-output {
    box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.5);
}

/* Cyberpunk-specific: busy spinner glow */
.busy-spinner-ring {
    box-shadow: 0 0 16px rgba(0, 229, 255, 0.25), inset 0 0 16px rgba(0, 229, 255, 0.05);
}

.busy-status-text {
    text-shadow: 0 0 10px rgba(0, 229, 255, 0.4);
}

.busy-overlay-cancel:hover {
    box-shadow: 0 0 12px rgba(255, 23, 68, 0.25);
}

/* Cyberpunk-specific: dashboard stat shadows */
.dashboard-stat-card:hover {
    box-shadow: var(--theme-glow-primary);
}

.stat-value {
    text-shadow: 0 0 12px rgba(0, 229, 255, 0.3);
}

.stat-value.stat-running {
    text-shadow: 0 0 12px rgba(0, 230, 118, 0.3);
}

.stat-value.stat-chat {
    text-shadow: 0 0 12px rgba(176, 64, 255, 0.3);
}

.stat-value.stat-templates {
    text-shadow: 0 0 12px rgba(255, 109, 0, 0.3);
}

/* Cyberpunk-specific: error UI backdrop */
#blazor-error-ui {
    backdrop-filter: blur(12px);
}

/* Cyberpunk-specific: busy-pulse glow animation */
@keyframes busy-pulse {
    0%, 100% { box-shadow: 0 0 16px rgba(0, 229, 255, 0.25), inset 0 0 16px rgba(0, 229, 255, 0.05); }
    50% { box-shadow: 0 0 24px rgba(0, 229, 255, 0.45), inset 0 0 24px rgba(0, 229, 255, 0.1); }
}

.busy-spinner-ring {
    animation: busy-spin 0.8s linear infinite, busy-pulse 2s ease-in-out infinite;
}

/* Matrix canvas visible */
#matrix-rain {
    display: block;
}