/**
 * Seamless Plugin — Shared CSS Design Tokens
 *
 * Defines CSS custom properties consumed by general.css, events-widget.css,
 * memberships-widget.css, user-dashboard.css, and the dist build stylesheets.
 *
 * Colours are overridden at runtime by SeamlessRender::output_color_scheme_css()
 * which injects --seamless-primary-color and --seamless-secondary-color from
 * the plugin settings stored in WordPress options.
 */

:root {
    /* ── Brand colours (runtime-overridden by PHP) ──────────────────── */
    --seamless-primary-color:        #26337a;
    --seamless-secondary-color:      #06b6d4;

    /* ── Derived / neutral colours ───────────────────────────────────── */
    --seamless-background-color:     #ffffff;
    --seamless-light-background-color: #f8fafc;
    --seamless-text-color:           #444444;
    --seamless-dark-text-color:      #111111;
    --seamless-muted-text-color:     #666666;
    --seamless-success-color:        #48bb78;
    --seamless-error-color:          #f56565;
    --seamless-warning-color:        #ed8936;
    --seamless-focus-color:          #007bff;

    /* ── Border colours ──────────────────────────────────────────────── */
    --seamless-light-border-color:   #e5e5e5;
    --seamless-border-color:         #cccccc;

    /* ── Typography ──────────────────────────────────────────────────── */
    --seamless-font-family:          var(--seamless-theme-font-family, var(--wp--preset--font-family--body, var(--wp--preset--font-family--system-font, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif)));
    --seamless-font-size-base:       16px;
    --seamless-font-size-sm:         14px;
    --seamless-font-size-lg:         18px;
    --seamless-font-size-xl:         22px;

    /* ── Spacing scale ───────────────────────────────────────────────── */
    --seamless-space-xs:             4px;
    --seamless-space-sm:             8px;
    --seamless-space-md:             16px;
    --seamless-space-lg:             24px;
    --seamless-space-xl:             40px;

    /* ── Border radii ────────────────────────────────────────────────── */
    --seamless-radius-sm:            4px;
    --seamless-radius-md:            8px;
    --seamless-radius-lg:            16px;
    --seamless-radius-xl:            24px;
    --seamless-radius-pill:          50px;

    /* ── Shadows ─────────────────────────────────────────────────────── */
    --seamless-shadow-sm:            0 1px 3px rgba(0, 0, 0, 0.08);
    --seamless-shadow-md:            0 4px 12px rgba(0, 0, 0, 0.10);
    --seamless-shadow-lg:            0 10px 30px rgba(0, 0, 0, 0.15);

    /* ── Transition ──────────────────────────────────────────────────── */
    --seamless-transition:           all 0.3s ease;
}
