/* Thème clair Pelty — valeurs issues des maquettes design/*.dc.html */
:root {
  color-scheme: light;

  /* Couleurs de base */
  --color-bg: #f4f6f9;
  --color-surface: #ffffff;
  --color-border: #e6eaf0;
  --color-text: #1a2230;
  --color-text-secondary: #5f6b7a;
  --color-accent: #0b8a63;
  --color-accent-text: #08704f;
  --color-accent-soft: #e3f4ed;
  --color-spend: #e8730c;
  --color-on-accent: #ffffff;

  /* Nuances dérivées des maquettes */
  --color-text-label: #3a4657;
  --color-text-strong: #2b3645;
  --color-placeholder: #8a96a6;
  --color-field-bg: #f8f9fb;
  --color-field-border: #dfe5ed;
  --color-divider: #eef1f5;
  --color-segment-bg: #e4e9f0;
  --color-chart-grid: #edf0f4;
  --color-chart-axis: #d9dfe7;
  --color-badge-bg: #fdf0e3;
  --color-badge-text: #9a4d00;
  --color-danger: #b42318;
  --color-danger-soft: #fdecea;

  /* Typographie */
  --font-family: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;

  --fs-badge: 11px;
  --fs-caption: 12px;
  --fs-small: 13px;
  --fs-label: 14px;
  --fs-body: 15px;
  --fs-input: 16px;
  --fs-title-sm: 17px;
  --fs-title: 19px;
  --fs-stepper: 20px;
  --fs-total: 28px;
  --fs-hero: 36px;

  --tracking-tight: -.01em;
  --tracking-tighter: -.02em;

  /* Rayons */
  --radius-card: 22px;
  --radius-summary: 20px;
  --radius-tile: 18px;
  --radius-button: 16px;
  --radius-field: 14px;
  --radius-icon: 12px;
  --radius-pill: 999px;

  /* Ombres douces */
  --shadow-card: 0 1px 2px rgba(20, 30, 50, .05), 0 8px 24px -12px rgba(20, 30, 50, .12);
  --shadow-tile: 0 1px 2px rgba(20, 30, 50, .05), 0 6px 16px -10px rgba(20, 30, 50, .15);
  --shadow-button: 0 1px 2px rgba(20, 30, 50, .05), 0 6px 16px -10px rgba(20, 30, 50, .2);
  --shadow-raised: 0 1px 3px rgba(20, 30, 50, .12);
  --shadow-accent: 0 10px 20px -10px var(--color-accent);
  --shadow-accent-card: 0 14px 28px -16px var(--color-accent);
  --shadow-logo: 0 6px 16px -6px var(--color-accent);
  --focus-ring: 0 0 0 3px rgba(11, 138, 99, .28);

  /* Espacements et dimensions */
  --gutter: 16px;
  --card-padding: 20px;
  --stack-gap: 14px;
  --field-height: 52px;
  --button-height: 56px;
  --touch-target: 56px;
  --content-max-width: 560px;
  --nav-height: calc(var(--touch-target) + 16px);
}
