/* ==========================================================================
   GearGen-3D Theme Specification
   ========================================================================== */

:root {
    /* Colors */
    --background-primary: #0F172A;
    --background-panel: #1E293B;
    --background-panel-hover: #273549;
    --border: #334155;
    --border-subtle: rgba(51, 65, 85, 0.6);
    --border-focus: #3B82F6;
    --accent-primary: #3B82F6;
    --accent-primary-hover: #2563EB;
    --accent-primary-glow: rgba(59, 130, 246, 0.25);
    --accent-success: #10B981;
    --text-primary: #F8FAFC;
    --text-secondary: #94A3B8;
    --text-muted: #64748B;

    /* Legacy CSS Variable Compatibility */
    --background: var(--background-primary);
    --surface: var(--background-panel);
    --primary: var(--accent-primary);
    --secondary: #1E293B;

    /* Typography */
    --font-ui: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --font-mono: 'JetBrains Mono', Consolas, "Courier New", monospace;

    /* Dimensions */
    --header-height: 56px;
    --left-sidebar-width: 280px;
    --right-sidebar-width: 340px;

    /* Border Radius */
    --radius-sm: 6px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-full: 9999px;

    /* Shadows */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4), 0 2px 4px -2px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -4px rgba(0, 0, 0, 0.3);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.6);

    /* Transitions */
    --transition-fast: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-normal: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}