/* ==========================================================================
   Whimsy Design System – Theme Tokens
   
   Single source of truth for Whimsy's visual identity.
   These tokens are consumed by base.css, component styles, and page styles.
   
   Token naming convention:
     --w-{category}-{property}          e.g. --w-color-primary
     --w-{category}-{property}-{size}   e.g. --w-spacing-md
   
   The compiled Bootstrap theme (style.css) defines --bs-* variables.
   We layer --w-* tokens on top so future theme changes only touch this file.
   ========================================================================== */

:root {
  /* ----- Colors ----------------------------------------------------------- */

  /* Brand */
  --w-color-primary:   var(--bs-primary, #ff9285);
  --w-color-primary-hover: #ffaba0;
  --w-color-primary-rgb: var(--bs-primary-rgb, 255, 146, 133);

  /* Surfaces */
  --w-color-surface-dark:  var(--bs-body-bg, #0e0e0e);
  --w-color-surface-light: #f2f1f1;
  --w-color-surface-card:  #1a1a1a;
  --w-color-surface-card-hover: #222222;

  /* Text */
  --w-color-text:          var(--bs-body-color, #fff);
  --w-color-text-muted:    var(--bs-secondary-color, rgba(255, 255, 255, 0.75));
  --w-color-text-subtle:   #6e6e6e;
  --w-color-text-inverse:  #0e0e0e;

  /* Semantic */
  --w-color-success: var(--bs-success, #26a65b);
  --w-color-warning: var(--bs-warning, #f9690e);
  --w-color-danger:  var(--bs-danger, #ff0000);
  --w-color-info:    var(--bs-info, #00acc1);

  /* Links */
  --w-color-link:        var(--bs-link-color, #fff);
  --w-color-link-hover:  var(--bs-link-hover-color, #cccccc);

  /* Borders */
  --w-color-border:         var(--bs-border-color, #262626);
  --w-color-border-subtle:  #333333;

  /* ----- Typography ------------------------------------------------------- */

  --w-font-body:     "Fira Sans", sans-serif;
  --w-font-heading:  "Playfair Display", serif;
  --w-font-mono:     var(--bs-font-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace);

  --w-font-size-xs:   0.75rem;    /* 12px */
  --w-font-size-sm:   0.875rem;   /* 14px */
  --w-font-size-base: 1rem;       /* 16px */
  --w-font-size-lg:   1.25rem;    /* 20px */
  --w-font-size-xl:   1.5rem;     /* 24px */
  --w-font-size-2xl:  2rem;       /* 32px */
  --w-font-size-3xl:  2.5rem;     /* 40px */

  --w-font-weight-normal: 400;
  --w-font-weight-medium: 600;
  --w-font-weight-bold:   700;

  --w-line-height-tight:  1.2;
  --w-line-height-normal: 1.5;
  --w-line-height-relaxed: 1.75;

  /* ----- Spacing ---------------------------------------------------------- */

  --w-spacing-xs:  0.25rem;   /* 4px */
  --w-spacing-sm:  0.5rem;    /* 8px */
  --w-spacing-md:  1rem;      /* 16px */
  --w-spacing-lg:  1.5rem;    /* 24px */
  --w-spacing-xl:  2rem;      /* 32px */
  --w-spacing-2xl: 3rem;      /* 48px */
  --w-spacing-3xl: 4rem;      /* 64px */

  /* ----- Radius ----------------------------------------------------------- */

  --w-radius-sm:   var(--bs-border-radius-sm, 0.25rem);
  --w-radius-md:   var(--bs-border-radius, 0.375rem);
  --w-radius-lg:   var(--bs-border-radius-lg, 0.5rem);
  --w-radius-xl:   var(--bs-border-radius-xl, 1rem);
  --w-radius-pill: var(--bs-border-radius-pill, 50rem);

  /* ----- Borders ---------------------------------------------------------- */

  --w-border-width: var(--bs-border-width, 1px);
  --w-border-color: var(--w-color-border);

  /* ----- Shadows ---------------------------------------------------------- */

  --w-shadow-sm:   var(--bs-box-shadow-sm, 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075));
  --w-shadow-md:   var(--bs-box-shadow, 0 0.5rem 1rem rgba(0, 0, 0, 0.15));
  --w-shadow-lg:   var(--bs-box-shadow-lg, 0 1rem 3rem rgba(0, 0, 0, 0.175));

  /* ----- Focus ------------------------------------------------------------ */

  --w-focus-width:  var(--bs-focus-ring-width, 0.25rem);
  --w-focus-color:  rgba(var(--w-color-primary-rgb), 0.35);

  /* ----- Transitions ------------------------------------------------------ */

  --w-transition-fast:   150ms ease;
  --w-transition-normal: 250ms ease;
  --w-transition-slow:   400ms ease;
}