/*
 * tokens.css — Variables de diseño compartidas (admin + portal cliente).
 *
 * Paleta Quiet Luxury (Mora Nuptials, alpha):
 *   - Champagne Silk  #F5F2ED  fondos cálidos (admin + portal)
 *   - Vellum White    #FFFFFF  tarjetas / superficies
 *   - Obsidian Grey   #2C2C2C  texto y CTA primarios
 *   - Antique Gold    #B38B59  acento sutil (focus, nav activo, líneas decorativas)
 *
 * El branding "Mora Nuptials" se aplica solo a la herramienta interna.
 * Los emails y documentos enviados al cliente siguen firmados como
 * "Gustlux Photography" (ver functions/_shared/issuer.ts).
 */

:root {
  /* === Neutrals (Quiet Luxury) === */
  --color-bg-admin: #f5f2ed;          /* Champagne Silk */
  --color-bg-portal: #f5f2ed;         /* Champagne Silk (mismo tono que admin) */
  --color-bg-card: #ffffff;           /* Vellum White */
  --color-bg-soft: #efeae1;           /* champagne más profundo */
  --color-bg-soft-portal: #efeae1;
  --color-bg-input: #ffffff;
  --color-bg-readonly: #efeae1;
  --color-bg-faint: #faf8f3;          /* hover sutil */

  --color-text: #2c2c2c;              /* Obsidian Grey */
  --color-text-strong: #1a1a1a;
  --color-text-muted: #6b6b6b;
  --color-text-subtle: #8a8580;
  --color-text-faint: #a8a39c;
  --color-text-on-dark: #ffffff;

  --color-border: #e3ddd0;            /* warm grey-beige */
  --color-border-soft: #ede7da;
  --color-border-input: #d8d0bf;
  --color-border-portal: #e3ddd0;
  --color-border-portal-soft: #ede7da;

  /* === Acento metálico (uso quirúrgico: focus, active, líneas) === */
  --color-gold: #b38b59;              /* Antique Gold */
  --color-gold-soft: #c9a474;
  --color-gold-bg: #f3ead9;

  /* === Semantic / status === */
  --color-status-new: #5b7c99;
  --color-status-contacted: #b38b59;
  --color-status-quoted: #b38b59;
  --color-status-booked: #4a6a4f;
  --color-status-lost: #9c5454;
  --color-status-archived: #8a8580;
  --color-status-future: #4a6a4f;
  --color-status-past: #8a8580;

  --color-success: #4a6a4f;
  --color-success-bg: #eef2ec;
  --color-success-bg-soft: #f6f8f4;
  --color-error: #9c5454;
  --color-error-bg: #f5e9e7;
  --color-warning: #b38b59;
  --color-warning-bg: #f3ead9;
  --color-info: #5b7c99;

  --color-link: #2c2c2c;

  --color-accent: #2c2c2c;            /* CTA primario sigue siendo Obsidian, no oro */

  /* === Typography === */
  --font-system: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --font-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;

  --line-tight: 1.3;
  --line-base: 1.55;
  --line-relaxed: 1.7;

  /* === Spacing === */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;

  /* === Sizing === */
  --container-max: 1400px;
  --container-portal: 720px;
  --container-doc: 820px;
  --container-form: 720px;

  /* === Misc === */
  --radius-none: 0;
  --radius-sm: 2px;
  --radius-md: 3px;
  --radius-pill: 9999px;
  --transition-fast: 0.15s;
  --transition-base: 0.2s;
  --transition-slow: 0.3s;
  --shadow-panel: 0 -4px 20px rgba(44,44,44,0.08);
  --shadow-overlay: 0 12px 40px rgba(44,44,44,0.12);
  --letter-uppercase: 0.08em;
  --letter-uppercase-wide: 0.12em;
  --letter-uppercase-wider: 0.18em;
  --letter-uppercase-widest: 0.25em;
}