/**
 * Sauleda Store visual tokens.
 *
 * Names are prefixed to avoid collisions with Bootstrap, PrestaShop modules
 * and the parent theme. Values normalize the common language of the mockups.
 */
:root {
  /* Brand and neutral palette. */
  --sauleda-color-primary: #b82828;
  --sauleda-color-primary-dark: #8c1f1f;
  --sauleda-color-ink: #1a1a18;
  --sauleda-color-text: #4a4540;
  --sauleda-color-muted: #8c8680;
  --sauleda-color-cream: #ede8dc;
  --sauleda-color-surface-soft: #f3f3f4;
  --sauleda-color-surface: #ffffff;
  --sauleda-color-border: #d8d2c8;

  /* Typography. Space Grotesk is self-hosted by the theme. */
  --sauleda-font-family: "Space Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --sauleda-font-weight-light: 300;
  --sauleda-font-weight-regular: 400;
  --sauleda-font-weight-medium: 500;
  --sauleda-font-weight-semibold: 600;
  --sauleda-font-weight-bold: 700;
  --sauleda-line-height-body: 1.6;
  --sauleda-line-height-heading: 1.12;
  --sauleda-letter-spacing-label: 0.2em;

  /* Geometry and spacing. */
  --sauleda-container-max: 80rem;
  --sauleda-container-gutter: clamp(1.25rem, 5vw, 4rem);
  --sauleda-radius-image: 0.75rem;
  --sauleda-radius-card: 0.875rem;
  --sauleda-radius-pill: 999px;
  --sauleda-space-1: 0.25rem;
  --sauleda-space-2: 0.5rem;
  --sauleda-space-3: 0.75rem;
  --sauleda-space-4: 1rem;
  --sauleda-space-5: 1.5rem;
  --sauleda-space-6: 2rem;
  --sauleda-space-7: 3rem;
  --sauleda-space-8: 4rem;
  --sauleda-space-9: 6rem;

  /* Shared effects and interaction. */
  --sauleda-shadow-card: 0 0.625rem 2rem rgb(26 26 24 / 8%);
  --sauleda-shadow-raised: 0 1rem 2.5rem rgb(26 26 24 / 16%);
  --sauleda-focus-color: #b82828;
  --sauleda-focus-ring: 0 0 0 0.2rem rgb(184 40 40 / 28%);
  --sauleda-transition-fast: 180ms ease;
}