/**
 * Patriot University — Design Tokens
 *
 * Extends ITI shared design-tokens.css with --pu-* product overrides.
 * Load AFTER shared/wordpress/ui/design-tokens.css.
 * Governed by DESIGN.md — do not add tokens without updating the contract.
 */

/* ── ITI Shared Token Definitions ─────────────────────────────────────── */
/* Normally from shared/wordpress/ui/design-tokens.css; defined inline here
   since this theme self-hosts all assets without external dependencies.    */

:root {
    /* ── Spacing Scale ────────────────────────────────────────────────── */
    --iti-space-xs:   4px;
    --iti-space-sm:   8px;
    --iti-space-md:   16px;
    --iti-space-lg:   24px;
    --iti-space-xl:   32px;
    --iti-space-2xl:  48px;
    --iti-space-3xl:  64px;

    /* ── Timing / Easing ──────────────────────────────────────────────── */
    --iti-duration-fast:    150ms;
    --iti-duration-medium:  300ms;
    --iti-duration-slow:    500ms;
    --iti-ease-standard:    cubic-bezier(0.4, 0, 0.2, 1);
    --iti-ease-decelerate:  cubic-bezier(0, 0, 0.2, 1);
    --iti-ease-accelerate:  cubic-bezier(0.4, 0, 1, 1);

    /* ── Radius ───────────────────────────────────────────────────────── */
    --iti-radius-sm:  4px;
    --iti-radius-md:  8px;
    --iti-radius-lg:  12px;

    /* ── Typography ───────────────────────────────────────────────────── */
    --iti-max-line-length: 70ch;
}

/* ── Light Mode (Default) ─────────────────────────────────────────────── */

:root {
    /* ── Primary ─────────────────────────────────────────────────────── */
    --pu-navy:        #1a3a6b;
    --pu-navy-dark:   #0f2447;
    --pu-navy-light:  #e8eef8;
    --pu-parchment:   #FBF7EE;
    --pu-ink:         #1A1A2E;

    /* ── Accents ─────────────────────────────────────────────────────── */
    --pu-red:         #c0392b;
    --pu-red-light:   #fdf0ee;
    --pu-green:       #27ae60;
    --pu-green-light: #edf8f2;
    --pu-gold:        #B8860B;
    --pu-gold-light:  #fdf6e3;

    /* ── Neutrals (extends --iti-*) ──────────────────────────────────── */
    --pu-gray-50:     #f8f9fa;
    --pu-gray-100:    #f1f3f4;
    --pu-gray-200:    #e2e8f0;
    --pu-gray-400:    #94a3b8;
    --pu-gray-600:    #475569;
    --pu-gray-800:    #1e293b;

    /* ── Semantic mappings to ITI tokens ──────────────────────────────── */
    --iti-primary:        var(--pu-navy);
    --iti-primary-dark:   var(--pu-navy-dark);
    --iti-primary-light:  var(--pu-navy-light);
    --iti-background:     var(--pu-parchment);
    --iti-on-background:  var(--pu-ink);
    --iti-on-surface:     var(--pu-ink);
    --iti-surface:        #FFFFFF;
    --iti-surface-2:      var(--pu-gray-50);
    --iti-surface-3:      var(--pu-gray-100);
    --iti-error:          var(--pu-red);
    --iti-error-light:    var(--pu-red-light);
    --iti-success:        var(--pu-green);
    --iti-success-light:  var(--pu-green-light);
    --iti-warning:        var(--pu-gold);
    --iti-warning-light:  var(--pu-gold-light);

    /* ── Borders ──────────────────────────────────────────────────────── */
    --iti-border:         var(--pu-gray-200);
    --iti-border-strong:  var(--pu-gray-400);

    /* ── Focus ────────────────────────────────────────────────────────── */
    --iti-shadow-focus:   0 0 0 3px rgba(26, 58, 107, 0.3);

    /* ── Typography ──────────────────────────────────────────────────── */
    --pu-font-body:    'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --pu-font-mono:    ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
    --iti-font-body:   var(--pu-font-body);
    --iti-font-mono:   var(--pu-font-mono);

    /* ── Radius (slightly softer than ITI default) ───────────────────── */
    --pu-radius:       8px;
    --pu-radius-lg:    12px;
    --pu-radius-pill:  9999px;

    /* ── Shadows ──────────────────────────────────────────────────────── */
    --pu-shadow:       0 2px 8px rgba(0, 0, 0, 0.08);
    --pu-shadow-lg:    0 8px 32px rgba(0, 0, 0, 0.12);

    /* ── Touch targets ───────────────────────────────────────────────── */
    --pu-touch:        44px;
}

/* ── Dark Mode ────────────────────────────────────────────────────────── */

@media (prefers-color-scheme: dark) {
    :root {
        --pu-parchment:   #1C1917;
        --pu-ink:         #E8E5E0;
        --pu-navy:        #5B8BD4;
        --pu-navy-dark:   #8BAEE0;
        --pu-navy-light:  rgba(91, 139, 212, 0.15);
        --pu-red:         #E57373;
        --pu-red-light:   rgba(229, 115, 115, 0.15);
        --pu-green:       #66BB6A;
        --pu-green-light: rgba(102, 187, 106, 0.15);
        --pu-gold:        #D4A843;
        --pu-gold-light:  rgba(212, 168, 67, 0.15);

        --pu-gray-50:     #1e1e1e;
        --pu-gray-100:    #2a2a2a;
        --pu-gray-200:    #3a3a3a;
        --pu-gray-400:    #6b6b6b;
        --pu-gray-600:    #a0a0a0;
        --pu-gray-800:    #e0e0e0;

        --iti-background:     var(--pu-parchment);
        --iti-on-background:  var(--pu-ink);
        --iti-on-surface:     var(--pu-ink);
        --iti-surface:        #252220;
        --iti-surface-2:      #2E2B28;
        --iti-surface-3:      #3A3735;
        --iti-border:         #3A3735;
        --iti-border-strong:  #4A4745;
        --iti-shadow-focus:   0 0 0 3px rgba(91, 139, 212, 0.4);

        --pu-shadow:       0 2px 8px rgba(0, 0, 0, 0.3);
        --pu-shadow-lg:    0 8px 32px rgba(0, 0, 0, 0.4);
    }
}

/* ── WP Admin Dark Mode ───────────────────────────────────────────────── */

body.is-dark-theme {
    --pu-parchment:   #1d2327;
    --pu-ink:         #c3c4c7;
    --pu-navy:        #6EA8E5;
    --pu-navy-dark:   #8CBAF0;
    --pu-navy-light:  rgba(110, 168, 229, 0.15);
}
