/* MODERN UI CSS - Requires .theme-modern class on body */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

/* Color Variables Override */
.theme-modern {
    --panel-bg: #1e1e1e;
    --panel-border: #333333;
    --metal-plate: #252526;
    --crt-green: #4daafc; /* Modern Cyan/Blue */
    --nixie-orange: #ffffff; /* Clean white for text instead of orange glow */
    --nixie-glow: rgba(255, 255, 255, 0.2);
    
    background-color: #111111;
    color: #e0e0e0;
    font-family: 'Inter', sans-serif !important;
}

/* Base Typo */
.theme-modern h1, .theme-modern h2, .theme-modern h3, .theme-modern h4 {
    font-family: 'Inter', sans-serif !important;
    letter-spacing: 0.5px !important;
    text-shadow: none !important;
    text-transform: none !important;
    color: #cccccc !important;
    font-weight: 600 !important;
}

.theme-modern h1 { color: #ffffff !important; }

/* Remove Screws */
.theme-modern .screw {
    display: none !important;
}

/* Panels */
.theme-modern .console-panel, 
.theme-modern .header-panel, 
.theme-modern .lab-card,
.theme-modern .nixie-title-panel,
.theme-modern .analog-geiger-panel {
    background: var(--metal-plate) !important;
    border: 1px solid var(--panel-border) !important;
    box-shadow: 0 4px 6px rgba(0,0,0,0.3) !important;
    border-radius: 8px !important;
}

.theme-modern .lab-card:hover {
    box-shadow: 0 8px 12px rgba(0,0,0,0.5) !important;
    border-color: #555 !important;
    transform: translateY(-2px) !important;
}

/* Buttons */
.theme-modern .ind-btn, .theme-modern .tab-btn {
    background: #333333 !important;
    border: 1px solid #444444 !important;
    color: #eeeeee !important;
    font-family: 'Inter', sans-serif !important;
    box-shadow: none !important;
    border-radius: 4px !important;
    font-weight: 500 !important;
    text-transform: none !important;
}

.theme-modern .ind-btn:hover, .theme-modern .tab-btn:hover {
    background: #444444 !important;
}

.theme-modern .ind-btn.active, .theme-modern .tab-btn.active {
    background: #007acc !important;
    border-color: #007acc !important;
    color: #ffffff !important;
    text-shadow: none !important;
    box-shadow: 0 2px 4px rgba(0, 122, 204, 0.4) !important;
}

/* Giant Red Button -> Clean Red Action Button */
.theme-modern .giant-red-btn {
    background: #d32f2f !important;
    border: none !important;
    box-shadow: 0 4px 10px rgba(211, 47, 47, 0.3) !important;
    border-radius: 8px !important;
    font-family: 'Inter', sans-serif !important;
    text-shadow: none !important;
    width: auto !important;
    height: auto !important;
    padding: 12px 24px !important;
}

.theme-modern .giant-red-btn:active {
    transform: translateY(2px) !important;
    box-shadow: 0 2px 5px rgba(211, 47, 47, 0.3) !important;
}

/* Nixie Tubes -> Clean Digital LCD Text */
.theme-modern .nixie-tube {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    width: auto !important;
}
.theme-modern .nixie-tube::after { display: none !important; }
.theme-modern .nixie-digit {
    font-family: 'Inter', sans-serif !important;
    color: #ffffff !important;
    text-shadow: none !important;
    font-weight: 600 !important;
    font-size: 18px !important;
}
.theme-modern .nixie-container {
    background: #1e1e1e !important;
    border: 1px solid #333 !important;
    box-shadow: none !important;
    border-radius: 4px !important;
}
.theme-modern .nixie-label {
    font-family: 'Inter', sans-serif !important;
    color: #888 !important;
    text-transform: none !important;
}

/* CRT Screens -> Flat Canvas */
.theme-modern .crt-screen, .theme-modern .card-crt {
    border: 1px solid #333 !important;
    border-radius: 6px !important;
    box-shadow: none !important;
    background-color: #111 !important;
}
.theme-modern .crt-screen::before, .theme-modern .crt-screen::after,
.theme-modern .card-crt::before, .theme-modern .card-crt::after {
    display: none !important;
}

/* Texts and Labels */
.theme-modern .status-text, .theme-modern .lab-card-title, .theme-modern .lab-card-desc, .theme-modern .reactor-isotope-name {
    font-family: 'Inter', sans-serif !important;
    text-shadow: none !important;
}
.theme-modern .reactor-isotope-name {
    color: #ffffff !important;
}
.theme-modern .log-tag {
    font-family: 'Inter', sans-serif !important;
    border-radius: 4px !important;
    padding: 2px 6px !important;
}
.theme-modern .log-msg { color: #e0e0e0 !important; }
.theme-modern .log-why { color: #888 !important; border-left-color: #555 !important; }

/* Custom Checkboxes / Toggle Knobs */
.theme-modern .knob-select {
    background: #333 !important;
    border: 1px solid #444 !important;
    color: #eee !important;
    font-family: 'Inter', sans-serif !important;
    box-shadow: none !important;
    border-radius: 4px !important;
}
.theme-modern .knob-select.active {
    background: #007acc !important;
    border-color: #007acc !important;
    color: #fff !important;
    box-shadow: none !important;
    transform: none !important;
}

/* Periodic Table */
.theme-modern .periodic-element {
    background: #252526 !important;
    border: 1px solid #444 !important;
    box-shadow: none !important;
    border-radius: 4px !important;
}
.theme-modern .periodic-element:hover {
    background: #2d2d30 !important;
}
.theme-modern .element-symbol {
    font-family: 'Inter', sans-serif !important;
    color: #e0e0e0 !important;
}
.theme-modern .element-z {
    font-family: 'Inter', sans-serif !important;
    color: #888 !important;
}
.theme-modern .periodic-element.active {
    border-color: #007acc !important;
    background: #1e3a5f !important;
}
.theme-modern .periodic-element.active .led-indicator {
    background-color: #4daafc !important;
    box-shadow: 0 0 8px #4daafc !important;
}

.theme-modern .periodic-element-placeholder {
    font-family: 'Inter', sans-serif !important;
    background: #1e1e1e !important;
    border: 1px dashed #444 !important;
    color: #666 !important;
}

.theme-modern .periodic-group-header {
    font-family: 'Inter', sans-serif !important;
    color: #888 !important;
}

/* Borders for elements categories (clean modern colors) */
.theme-modern .periodic-element.gasos { border-left: 3px solid #9d5bfe !important; }
.theme-modern .periodic-element.no-metalls { border-left: 3px solid #10b981 !important; }
.theme-modern .periodic-element.semimetalls { border-left: 3px solid #f59e0b !important; }
.theme-modern .periodic-element.metalls { border-left: 3px solid #64748b !important; }

/* Input/Search */
.theme-modern .search-container input {
    background: #1e1e1e !important;
    border: 1px solid #444 !important;
    font-family: 'Inter', sans-serif !important;
    color: #e0e0e0 !important;
    box-shadow: none !important;
    border-radius: 4px !important;
}
.theme-modern .search-container input:focus {
    border-color: #007acc !important;
    box-shadow: 0 0 0 2px rgba(0,122,204,0.3) !important;
}

/* SVG Geiger Needle & Display */
.theme-modern .geiger-gauge-svg {
    background-color: #1e1e1e !important;
    border: 1px solid #444 !important;
    box-shadow: none !important;
}
.theme-modern .geiger-needle { stroke: #007acc !important; }
.theme-modern .geiger-digital-cpm {
    font-family: 'Inter', sans-serif !important;
    color: #fff !important;
    text-shadow: none !important;
}
.theme-modern .geiger-digital-label {
    font-family: 'Inter', sans-serif !important;
    color: #888 !important;
}

/* Switches (Levers) */
.theme-modern .switch-row {
    background: #252526 !important;
    border: 1px solid #333 !important;
    box-shadow: none !important;
}
.theme-modern .lever-switch {
    background: #111 !important;
    border: 1px solid #444 !important;
    box-shadow: none !important;
}
.theme-modern .lever-handle {
    background: #666 !important;
    border: none !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.3) !important;
}
.theme-modern .lever-switch.active {
    background: #007acc !important;
    border-color: #007acc !important;
}
.theme-modern .lever-switch.active .lever-handle {
    background: #fff !important;
}

/* Tab/Subviews wrapper */
.theme-modern .panel-tabs {
    background: #1e1e1e !important;
    border: 1px solid #333 !important;
    box-shadow: none !important;
}
