/* ===================================================================
   Podcast Studio - scoped design tokens.

   Extends the site's real --az-* tokens (wwwroot/css/a2z-tokens.css,
   wwwroot/css/home-atoz.css) rather than inventing a competing palette.
   --az-a-1/--az-a-2 (blue -> violet) and --az-z-1/--az-z-2 (coral ->
   orange) are the same blue-violet-coral gradient family the homepage
   hero letters already use; --ps-* below only adds the handful of
   values that family does not already provide (soft pastel surfaces,
   status colours, spacing scale), each as a var() over an --az-* value
   wherever one exists so retuning the brand only ever means editing
   a2z-tokens.css / home-atoz.css.

   Scoped to .podcast-studio so nothing here can leak onto another page.
   =================================================================== */

.podcast-studio {
    --ps-navy: var(--az-ink, #10162b);
    --ps-text: var(--az-ink, #10162b);
    --ps-text-secondary: var(--az-ink-2, #454d63);
    --ps-text-muted: var(--az-ink-3, #5f677d);

    --ps-page: var(--az-bg, #fbf9f7);
    --ps-surface: var(--az-surface, #ffffff);
    --ps-border: var(--az-line, #e8e6e3);
    --ps-border-soft: var(--az-line-2, #f0eeeb);

    /* Brand: blue -> violet -> coral, the same family as the homepage A/Z */
    --ps-blue: var(--az-a-1, #5b8def);
    --ps-violet: var(--az-a-2, #7b5bf0);
    --ps-coral: var(--az-z-1, #f0655f);
    --ps-amber: var(--az-z-2, #f89a4d);
    --ps-green: var(--az-mint, #22b06b);
    --ps-cyan: #32a8e6;

    --ps-brand-gradient: linear-gradient(110deg, var(--ps-blue) 0%, var(--ps-violet) 48%, var(--ps-coral) 100%);

    /* Pastel card surfaces - one per output mode, dark text always on top */
    --ps-blue-soft: #edf1ff;
    --ps-violet-soft: #f2edff;
    --ps-coral-soft: #fff0eb;
    --ps-amber-soft: #fff4e2;
    --ps-green-soft: #eaf8f2;
    --ps-cyan-soft: #eaf6fd;

    --ps-success: var(--az-mint, #22b06b);
    --ps-warning: #b5760f;
    --ps-warning-soft: #fff4e2;
    --ps-error: #c23a3a;
    --ps-error-soft: #fdeeee;
    --ps-info: var(--ps-blue);

    --ps-shadow-xs: var(--az-shadow-sm, 0 1px 2px rgba(16,22,43,.05));
    --ps-shadow-sm: var(--az-shadow, 0 4px 16px rgba(16,22,43,.06));
    --ps-shadow-md: 0 12px 32px rgba(16,22,43,.09);
    --ps-shadow-lg: var(--az-shadow-lg, 0 10px 34px rgba(16,22,43,.10));

    --ps-r-sm: 12px;
    --ps-r: var(--az-r, 14px);
    --ps-r-lg: var(--az-r-lg, 18px);
    --ps-r-xl: 24px;

    --ps-space-1: 4px;
    --ps-space-2: 8px;
    --ps-space-3: 12px;
    --ps-space-4: 16px;
    --ps-space-6: 24px;
    --ps-space-8: 32px;
}
