/*
 * Shoot Junction — Global Design Tokens
 * Single source of truth. Loaded via head-style.php on every page.
 * Google Fonts is handled by global-font.css — do not re-import here.
 * Brand color: Orange #FF6B00 (camera-shutter + pin logo)
 */

:root {
  /* ── Brand Colors ───────────────────────────── */
  --sj-primary:        #FF6B00;
  --sj-primary-dark:   #E55A00;
  --sj-primary-deep:   #CC4D00;
  --sj-primary-soft:   #FFF3E8;
  --sj-primary-mid:    #FFCCA0;

  /* ── Semantic UI Colors ─────────────────────── */
  --sj-success:        #1db87a;
  --sj-success-soft:   #e6f9f2;
  --sj-warning:        #f59e0b;
  --sj-warning-soft:   #fef3c7;
  --sj-danger:         #e53e3e;
  --sj-danger-soft:    #fef2f2;
  --sj-info:           #3b82f6;
  --sj-info-soft:      #eff6ff;

  /* ── Neutral Surfaces ───────────────────────── */
  --sj-bg:             #f9f7f5;
  --sj-bg-alt:         #faf8f6;
  --sj-surface:        #ffffff;
  --sj-surface-raised: #ffffff;
  --sj-border:         #ecddd4;
  --sj-border-light:   #f5ede7;

  /* ── Text Scale ─────────────────────────────── */
  --sj-text:           #1a1a1a;
  --sj-text-secondary: #3d2e22;
  --sj-muted:          #7a6558;
  --sj-placeholder:    #b0a099;

  /* ── Typography ─────────────────────────────── */
  --sj-font:           'Inter', Helvetica, Arial, sans-serif;
  --sj-fw-body:        400;
  --sj-fw-medium:      500;
  --sj-fw-bold:        600;
  --sj-fw-black:       700;

  /* ── Sizing & Spacing ───────────────────────── */
  --sj-radius-sm:      8px;
  --sj-radius:         12px;
  --sj-radius-lg:      18px;
  --sj-radius-xl:      24px;

  /* ── Shadows ────────────────────────────────── */
  --sj-shadow-sm:      0 2px 8px rgba(255, 107, 0, 0.08);
  --sj-shadow:         0 8px 20px rgba(255, 107, 0, 0.12);
  --sj-shadow-lg:      0 16px 32px rgba(255, 107, 0, 0.16);

  /* ── Transitions ────────────────────────────── */
  --sj-transition:     180ms ease;
  --sj-transition-md:  280ms ease;

  /* ── Admin Layout ───────────────────────────── */
  --sj-sidebar-width:          300px;
  --sj-sidebar-collapsed-width: 80px;
}