/* ==========================================
   UI THEME: DARK MODE (Default)
   ========================================== */

:root {
    --ui-bg: #090a0f;
    --ui-panel: #161a24;
    --ui-border: rgba(255,255,255,0.1);
    --accent-gold: #FFBF00;
    --accent-gold-rgb: 255, 191, 0;
    --text-main: #ffffff;
    --text-muted: #8a92a6;
    
    /* New extracted colors from index/editor.html */
    --ui-btn-primary-bg: var(--accent-gold);
    --ui-btn-primary-text: black;
    --ui-btn-outline-border: rgba(255,255,255,0.2);
    --ui-btn-outline-text: white;
    --ui-btn-outline-hover-bg: rgba(255,255,255,0.1);
    --ui-btn-danger-bg: #ff4444;
    --ui-btn-danger-text: white;
    
    --ui-modal-overlay: rgba(0,0,0,0.85);
    --ui-modal-bg: #161a24;
    --ui-input-bg: rgba(0,0,0,0.3);
    
    --ui-header-bg: transparent;

    --ui-surface-bg: rgba(255,255,255,0.02);
    --ui-surface-hover: rgba(255,255,255,0.05);
    --ui-surface-border: rgba(255,255,255,0.1);
    --ui-surface-border-strong: rgba(255,255,255,0.2);
    --ui-surface-panel: rgba(0,0,0,0.2);
    --ui-surface-panel-light: rgba(0,0,0,0.1);
    --ui-danger-border: rgba(255,68,68,0.3);
}