/*
Theme Name:   Well This Is News
Theme URI:    https://wellthisisnews.com
Description:  Well This Is News child theme for Understrap. Perspective-toggle political news platform.
Author:       Well This Is News
Author URI:   https://wellthisisnews.com
Template:     understrap
Version:      1.0.1
Tags:         news, political, custom-theme, understrap-child
Text Domain:  wellthisisnews-child
*/

/*
 * ─────────────────────────────────────────────
 * PHASE 3 DESIGN TOKENS
 * All tokens defined here as CSS custom properties.
 * Sass variables in sass/_tokens.scss mirror these
 * for compile-time use in component stylesheets.
 * ─────────────────────────────────────────────
 */

:root {

  /* Perspective colors — A3 Muted Civic */
  --wtin-left:         #3B5BA5;
  --wtin-left-dark:    #2d4680;
  --wtin-right:        #B94040;
  --wtin-right-dark:   #922e2e;
  --wtin-neutral:      #3A7D44;
  --wtin-neutral-dark: #2c6234;

  /* Ink scale */
  --wtin-ink:          #1A1A1A;
  --wtin-ink-mid:      #4A4A4A;
  --wtin-ink-muted:    #787878;
  --wtin-ink-faint:    #B8B8B8;

  /* Paper scale */
  --wtin-paper:        #FAFAF8;
  --wtin-paper-2:      #F2F0EC;
  --wtin-paper-3:      #E8E5DF;
  --wtin-rule:         #DDD9D0;

  /* Typography */
  --wtin-font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --wtin-font-body:    'Source Serif 4', Georgia, serif;
  --wtin-font-ui:      'DM Sans', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;

  /* Type scale */
  --wtin-text-xs:      10px;
  --wtin-text-sm:      11px;
  --wtin-text-base:    13px;
  --wtin-text-md:      14px;
  --wtin-text-lg:      16px;
  --wtin-text-xl:      18px;
  --wtin-text-2xl:     22px;
  --wtin-text-3xl:     28px;
  --wtin-text-4xl:     36px;
  --wtin-text-5xl:     48px;

  /* Spacing scale (8px base) */
  --wtin-space-1:      4px;
  --wtin-space-2:      8px;
  --wtin-space-3:      12px;
  --wtin-space-4:      16px;
  --wtin-space-5:      20px;
  --wtin-space-6:      24px;
  --wtin-space-8:      32px;
  --wtin-space-10:     40px;
  --wtin-space-12:     48px;
  --wtin-space-16:     64px;

  /* Border radius */
  --wtin-radius-sm:    3px;
  --wtin-radius-md:    6px;
  --wtin-radius-pill:  999px;

  /* Transitions */
  --wtin-transition:   0.15s ease;
  --wtin-transition-slow: 0.25s ease;

  /* Z-index layers */
  --wtin-z-toggle:     100;
  --wtin-z-nav:        200;
  --wtin-z-breaking:   150;

  /* Ad unit sizes (reference only — used in _ads.scss) */
  --wtin-ad-leaderboard-h:  90px;
  --wtin-ad-rectangle-w:    300px;
  --wtin-ad-rectangle-h:    250px;
  --wtin-ad-halfpage-h:     600px;
  --wtin-ad-mobile-banner-h: 50px;
  --wtin-ad-incontent-h:    90px;

}