/* ═══════════════════════════════════════════════════════════════
   PTP DESIGN TOKENS v228
   Single source of truth for colors, spacing, typography, z-index.
   All templates and CSS files should reference these variables.
   ═══════════════════════════════════════════════════════════════ */
:root {
    /* ── Brand ── */
    --ptp-gold: #FCB900;
    --ptp-gold-hover: #E5A800;
    --ptp-gold-glow: rgba(252,185,0,0.25);
    --ptp-gold-10: rgba(252,185,0,0.10);
    --ptp-gold-20: rgba(252,185,0,0.20);
    --ptp-black: #0A0A0A;
    --ptp-white: #FFFFFF;

    /* ── Grays ── */
    --ptp-gray-50: #FAFAFA;
    --ptp-gray-100: #F4F4F5;
    --ptp-gray-200: #E4E4E7;
    --ptp-gray-300: #D4D4D8;
    --ptp-gray-400: #A1A1AA;
    --ptp-gray-500: #71717A;
    --ptp-gray-600: #52525B;
    --ptp-gray-700: #3F3F46;
    --ptp-gray-800: #27272A;
    --ptp-gray-900: #18181B;

    /* ── Semantic ── */
    --ptp-green: #22C55E;
    --ptp-green-10: rgba(34,197,94,0.10);
    --ptp-red: #EF4444;
    --ptp-red-10: rgba(239,68,68,0.10);
    --ptp-blue: #3B82F6;
    --ptp-blue-10: rgba(59,130,246,0.10);
    --ptp-purple: #8B5CF6;
    --ptp-amber: #F59E0B;
    --ptp-amber-10: rgba(245,158,11,0.10);

    /* ── Typography ── */
    --ptp-font-display: 'Oswald', -apple-system, sans-serif;
    --ptp-font-body: 'Inter', -apple-system, sans-serif;
    --ptp-font-serif: 'Playfair Display', Georgia, serif;

    /* ── Spacing ── */
    --ptp-space-1: 4px;
    --ptp-space-2: 8px;
    --ptp-space-3: 12px;
    --ptp-space-4: 16px;
    --ptp-space-5: 20px;
    --ptp-space-6: 24px;
    --ptp-space-8: 32px;
    --ptp-space-10: 40px;

    /* ── Radii ── */
    --ptp-radius-sm: 6px;
    --ptp-radius-md: 10px;
    --ptp-radius-lg: 14px;
    --ptp-radius-xl: 20px;
    --ptp-radius-full: 9999px;

    /* ── Shadows ── */
    --ptp-shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
    --ptp-shadow-md: 0 4px 12px rgba(0,0,0,0.10);
    --ptp-shadow-lg: 0 12px 40px rgba(0,0,0,0.12);
    --ptp-shadow-xl: 0 25px 60px rgba(0,0,0,0.16);

    /* ══════════════════════════════════════════════════════════
       Z-INDEX SCALE — DOCUMENTED, DO NOT ADD VALUES OUTSIDE THIS
       ══════════════════════════════════════════════════════════ */
    --z-base: 1;
    --z-dropdown: 100;        /* Dropdowns, tooltips */
    --z-sticky: 200;          /* Sticky headers, nav bars */
    --z-fixed: 300;           /* Fixed bottom bars, FABs */
    --z-modal-backdrop: 400;  /* Modal/sheet overlay */
    --z-modal: 500;           /* Modal/sheet content */
    --z-popover: 600;         /* Popovers over modals */
    --z-toast: 700;           /* Toast notifications */
    --z-max: 800;             /* Emergency only */

    /* ── Safe areas (iOS) ── */
    --ptp-safe-top: env(safe-area-inset-top, 0px);
    --ptp-safe-bottom: env(safe-area-inset-bottom, 0px);
    --ptp-safe-left: env(safe-area-inset-left, 0px);
    --ptp-safe-right: env(safe-area-inset-right, 0px);
}