/**
 * VTX Theme — CSS Custom Properties
 *
 * Light design system with gold accents. The WP Customizer
 * overrides these at runtime via wp_add_inline_style on :root.
 */

:root {
    /* Brand colors — these defaults are overridden at runtime by the active brand preset */
    --vtx-color-primary: #FFAC27;
    --vtx-color-secondary: #1A1A1A;
    --vtx-color-accent: #FFAC27;
    --vtx-color-white: #ffffff;
    --vtx-color-light-gray: #f5f5f5;
    --vtx-color-gray: #6b7280;
    --vtx-color-dark-gray: #58595B;
    --vtx-color-dark: #1A1A1A;

    /* Semantic surfaces */
    --vtx-color-surface: #ffffff;
    --vtx-color-surface-elevated: #ffffff;

    /* Semantic borders */
    --vtx-color-border: #e5e7eb;
    --vtx-color-border-accent: rgba(255, 172, 39, 0.25);

    /* Semantic text */
    --vtx-color-text-primary: #58595B;
    --vtx-color-text-secondary: #6b7280;
    --vtx-color-text-muted: #9ca3af;

    /* Hover / focus states */
    --vtx-color-accent-hover: #f9bd5e;
    --vtx-color-primary-hover: #e89b2a;
    --vtx-color-focus-ring: rgba(255, 172, 39, 0.2);

    /* Card glow effect */
    --vtx-color-card-glow: 0 4px 4px rgba(0, 0, 0, 0.15);

    /* Glass-morphism */
    --vtx-glass-bg: rgba(255, 255, 255, 0.9);
    --vtx-glass-blur: blur(8px);
    --vtx-shadow-glow-purple: 0 4px 12px rgba(0, 0, 0, 0.1);

    /* RGB triplets for dynamic rgba usage */
    --vtx-color-primary-rgb: 255, 172, 39;
    --vtx-color-accent-rgb: 255, 172, 39;

    /* Glow opacity variants (overridden by brand preset) */
    --vtx-glow-primary-8: rgba(255, 172, 39, 0.08);
    --vtx-glow-primary-4: rgba(255, 172, 39, 0.04);
    --vtx-glow-primary-15: rgba(255, 172, 39, 0.15);
    --vtx-glow-primary-25: rgba(255, 172, 39, 0.25);
    --vtx-glow-accent-4: rgba(255, 172, 39, 0.04);
    --vtx-glow-accent-8: rgba(255, 172, 39, 0.08);
    --vtx-glow-accent-15: rgba(255, 172, 39, 0.15);

    /* Typography */
    --vtx-font-heading: 'Jost', 'Futura', 'Century Gothic', sans-serif;
    --vtx-font-body: 'Inter', sans-serif;

    /* Spacing scale */
    --vtx-space-xs: 0.5rem;
    --vtx-space-sm: 1rem;
    --vtx-space-md: 1.5rem;
    --vtx-space-lg: 2rem;
    --vtx-space-xl: 3rem;
    --vtx-space-2xl: 4rem;
    --vtx-space-3xl: 5rem;
    --vtx-space-4xl: 6rem;

    /* Container */
    --vtx-container-padding: clamp(1.5rem, 4vw, 4rem);
    --vtx-container-max-width: 1200px;

    /* Border radii */
    --vtx-radius-sm: 0.1875rem;
    --vtx-radius-md: 0.3125rem;
    --vtx-radius-lg: 0.3125rem;
    --vtx-radius-xl: 0.5rem;
    --vtx-radius-full: 9999px;
}
