/**
 * GPR Core - CSS Variables
 *
 * Unified design tokens for all GPR plugins
 */

:root {
    /* ========================================
       Colors (fallback defaults)
       Dynamic values are generated by class-style-output.php
       and override these via inline :root styles.
       ======================================== */

    /* Primary (matches Style Manager default: #007AFF) */
    --gpr-primary: #007AFF;
    --gpr-primary-hover: #005ecb;
    --gpr-primary-dark: #005ecb;
    --gpr-primary-light: #4da3ff;

    /* Secondary (matches Style Manager default: #3A3A3C) */
    --gpr-secondary: #3A3A3C;
    --gpr-secondary-hover: #2a2a2c;
    --gpr-secondary-light: #5e5e60;

    /* Accent (matches Style Manager default: #34C759) */
    --gpr-accent: #34C759;

    /* Subtle Backgrounds (lighten 90% - opaque pastels for bubble/card backgrounds) */
    --gpr-primary-bg: #e6f0ff;
    --gpr-secondary-bg: #ededee;
    --gpr-accent-bg: #ebfaef;

    /* Status Colors */
    --gpr-success: #10b981;
    --gpr-success-light: #d1fae5;
    --gpr-danger: #ef4444;
    --gpr-danger-hover: #dc2626;
    --gpr-danger-light: #fee2e2;
    --gpr-warning: #f59e0b;
    --gpr-warning-light: #fef3c7;
    --gpr-info: #34C759;
    --gpr-info-light: #d1fae5;

    /* Text Colors */
    --gpr-text: #1a1a1a;
    --gpr-text-light: #50575e;
    --gpr-text-lighter: #787c82;
    --gpr-text-muted: #a7aaad;

    /* Background Colors */
    --gpr-bg: #ffffff;
    --gpr-bg-gray: #f6f7f7;
    --gpr-bg-dark: #1d2327;
    --gpr-bg-overlay: rgba(0, 0, 0, 0.7);

    /* Border Colors */
    --gpr-border: #e5e7eb;
    --gpr-border-light: #f3f4f6;
    --gpr-border-lighter: #f0f0f1;

    /* ========================================
       Button Action Colors
       ======================================== */

    /* Add/New buttons (green) */
    --gpr-btn-add-bg: #10b981;
    --gpr-btn-add-hover: #059669;
    --gpr-btn-add-light: #d1fae5;

    /* ========================================
       Supplemental Variables
       ======================================== */

    /* Used in share-links.css */
    --gpr-border-width: 1px;

    /* Used in core-modal.css */
    --gpr-bg-lighter: #f0f0f1;

    /* Warning dark tone (semantic color) */
    --gpr-warning-dark: #856404;

    /* ========================================
       Typography
       ======================================== */

    /* Font Families */
    --gpr-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    --gpr-font-mono: Consolas, Monaco, monospace;

    /* Font Sizes */
    --gpr-font-xs: 12px;
    --gpr-font-sm: 13px;
    --gpr-font-base: 14px;
    --gpr-font-md: 16px;
    --gpr-font-lg: 18px;
    --gpr-font-xl: 20px;
    --gpr-font-2xl: 24px;
    --gpr-font-3xl: 30px;

    /* Line Heights */
    --gpr-line-height-tight: 1.2;
    --gpr-line-height-base: 1.5;
    --gpr-line-height-relaxed: 1.8;

    /* Font Weights */
    --gpr-font-normal: 400;
    --gpr-font-medium: 500;
    --gpr-font-semibold: 600;
    --gpr-font-bold: 700;

    /* ========================================
       Spacing
       ======================================== */

    --gpr-spacing-xs: 4px;
    --gpr-spacing-sm: 8px;
    --gpr-spacing-md: 12px;
    --gpr-spacing-lg: 16px;
    --gpr-spacing-xl: 20px;
    --gpr-spacing-2xl: 24px;
    --gpr-spacing-3xl: 32px;
    --gpr-spacing-4xl: 48px;

    /* ========================================
       Border Radius
       ======================================== */

    --gpr-radius-sm: 2px;
    --gpr-radius-md: 4px;
    --gpr-radius-lg: 8px;
    --gpr-radius-xl: 12px;
    --gpr-radius-full: 9999px;

    /* ========================================
       Shadows
       ======================================== */

    --gpr-shadow-xs: 0 1px 1px rgba(0, 0, 0, 0.04);
    --gpr-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
    --gpr-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
    --gpr-shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.12);
    --gpr-shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.15);

    /* ========================================
       Transitions
       ======================================== */

    --gpr-transition-fast: 0.15s ease;
    --gpr-transition: 0.2s ease;
    --gpr-transition-slow: 0.3s ease;

    /* ========================================
       Z-Index
       ======================================== */

    --gpr-z-base: 1;
    --gpr-z-dropdown: 100;
    --gpr-z-sticky: 200;
    --gpr-z-fixed: 300;
    --gpr-z-modal-backdrop: 400;
    --gpr-z-modal: 500;
    --gpr-z-popover: 600;
    --gpr-z-tooltip: 700;

    /* ========================================
       Breakpoints
       ======================================== */

    --gpr-breakpoint-sm: 576px;
    --gpr-breakpoint-md: 768px;
    --gpr-breakpoint-lg: 992px;
    --gpr-breakpoint-xl: 1200px;
    --gpr-breakpoint-2xl: 1400px;
}

/* ========================================
   Dark Mode Support (for future)
   ======================================== */

@media (prefers-color-scheme: dark) {
    :root {
        /* Uncomment when dark mode is implemented */
        /* --gpr-bg: #1d2327; */
        /* --gpr-text: #ffffff; */
    }
}