/**
 * Glando design tokens — fleet-safe plugin copy (variables only).
 * Keep in sync with: docs/brand/assets/css/glando-brand.css (:root block)
 * Do not @import brand CSS from docs/ at runtime on client WP installs.
 */

:root {
  /* Brand colors — keep exact hex values */
  --glando-dark: #2d2d2d;
  --glando-magenta: #ad5fa4;
  --glando-purple: #793b79;
  --glando-sand: #cba486;
  /* Filled-button sand — white text 5.30:1 (sand itself is 2.28:1) */
  --glando-sand-deep: #8a6438;
  --glando-gray: #d2d2d2;
  --glando-text: #ffffff;
  --glando-text-muted: rgba(255, 255, 255, 0.85);
  --glando-text-subtle: rgba(255, 255, 255, 0.4);
  --glando-bg-light: #ffffff;
  --glando-border-light: #E4E3E3;
  /* AA on their own tint at caption size — see brand :root comment (DFA-04) */
  --glando-status-error: #c62828;
  --glando-success: #286b3f;
  --glando-success-bg: #e6f4ea;
  --glando-notify: #f0d78c;
  --glando-notify-bg: #fff8e6;

  /* Light-surface text helpers */
  --glando-text-on-light: #333333;
  --glando-error-bg: #fdecea;
  --glando-overlay: rgba(45, 45, 45, 0.55);

  /* Beszélgetés-buborékok világos felületen (2026-08-18).
     Eddig nyers hexaként éltek a plugin admin CSS-ében ÉS a mockban — a paritás-szabály
     szerint ez „review reject", és emiatt a kapu nem is látta, hogy a rájuk kerülő
     metasor AA alatt van. Tokenként a kontraszt-párlista méri őket. */
  --glando-bubble-agent: #f6f6f6;
  --glando-bubble-visitor: #eee8f0;

  /* Aliases (backward-compatible) */
  --glando-bg-dark: var(--glando-dark);
  --glando-purple-primary: var(--glando-magenta);
  --glando-purple-deep: var(--glando-purple);
  --glando-tan: var(--glando-sand);

  /* Neutral scale (min 5 steps) */
  --glando-neutral-100: #f7f7f7;
  --glando-neutral-300: #d2d2d2;
  --glando-neutral-500: #9a9a9a;
  /* Lightest AA-safe text neutral — placeholders, captions, muted labels */
  --glando-neutral-600: #6e6e6e;
  --glando-neutral-700: #5a5a5a;
  --glando-neutral-900: #2d2d2d;

  /* Typography families */
  --glando-font-display: 'Pacifico', cursive;
  --glando-font-body: 'Poppins', sans-serif;

  /* Type scale — Pacifico display only; Poppins for the rest */
  --glando-text-display: 400 2.625rem/1.2 var(--glando-font-display); /* 42px */
  --glando-text-h1: 600 2rem/1.25 var(--glando-font-body); /* 32px */
  --glando-text-h2: 600 1.5rem/1.3 var(--glando-font-body); /* 24px */
  --glando-text-body: 400 1rem/1.55 var(--glando-font-body); /* 16px */
  --glando-text-small: 400 0.875rem/1.45 var(--glando-font-body); /* 14px */
  --glando-text-caption: 300 0.75rem/1.4 var(--glando-font-body); /* 12px */

  /* Spacing (4/8 grid) */
  --glando-space-1: 4px;
  --glando-space-2: 8px;
  --glando-space-3: 12px;
  --glando-space-4: 16px;
  --glando-space-6: 24px;
  --glando-space-8: 32px;
  --glando-space-12: 48px;
  --glando-space-16: 64px;
  --glando-page-padding: 30px;
  --glando-content-max: 480px;

  /* Radii */
  --glando-radius-sm: 4px;
  --glando-radius-md: 8px;
  --glando-radius-lg: 12px;
  --glando-radius-pill: 30px;
  --glando-btn-radius: var(--glando-radius-pill);
  --glando-btn-padding: 13px 36px;

  /* Motion */
  --glando-motion-fast: 150ms;
  --glando-motion-base: 300ms;
  --glando-motion-slow: 500ms;
  --glando-ease-out: cubic-bezier(0.22, 1, 0.36, 1);

  /* Breakpoints (reference — use in @media, not as CSS length props) */
  --glando-bp-sm: 480px;
  --glando-bp-md: 768px;
  --glando-bp-lg: 1024px;
  --glando-bp-xl: 1280px;

  /* Elevation */
  --glando-shadow-sm: 0 2px 12px rgba(0, 0, 0, 0.06);
  --glando-shadow-md: 0 4px 20px rgba(173, 95, 164, 0.4);
  --glando-shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.1);

  /* Focus */
  --glando-focus-ring: 0 0 0 3px rgba(173, 95, 164, 0.45);
  --glando-focus-outline: 2px solid var(--glando-magenta);
  --glando-focus-offset: 2px;

  /* Z-index */
  --glando-z-base: 1;
  --glando-z-chat: 100;
  --glando-z-modal: 200;
}