/* Boussole Scolaire · design tokens
   Handoff v1.2 · light theme · un produit de Homo Devs
   Canonical source: tokens/tokens.css. The copy in prototype/styles/ is identical
   and is kept in sync with tokens/tokens.json. */

:root {
  /* ---- Brand ---- */
  --bs-color-brand-50:  #EEF3F8;
  --bs-color-brand-100: #D9E5EF;
  --bs-color-brand-200: #B7CDE0;
  --bs-color-brand-500: #1F6091;
  --bs-color-brand-600: #17537F;
  --bs-color-brand-700: #113E60;
  --bs-color-brand-900: #0B2A42;

  /* ---- Surfaces ----
     backdrop = the page behind the app card · page = the app's own floor */
  --bs-color-surface-backdrop: #E9E3D9;
  --bs-color-surface-page:   #F6F4F0;
  --bs-color-surface-panel:  #FFFFFF;
  --bs-color-surface-raised: #FFFFFF;
  --bs-color-surface-sunken: #EFECE6;
  --bs-color-surface-tonal:  #FBFAF8;

  /* ---- Text ---- */
  --bs-color-text-primary:   #17232E;
  --bs-color-text-secondary: #5B6772;
  --bs-color-text-muted:     #5B6772;
  --bs-color-text-on-brand:  #FFFFFF;

  /* ---- Dividers and controls ----
     Panels and cards are borderless by default. These values are reserved for
     genuine separators, table rows, inputs, calendar grids and print previews. */
  --bs-color-divider:        #E7E3DC;
  --bs-color-border-default: #E3DFD8;
  --bs-color-border-strong:  #C9C3B9;
  --bs-color-border-hover:   #8B8478;
  --bs-border-hairline:      1px solid var(--bs-color-divider);
  --bs-color-scrim:          rgba(17, 26, 34, .42);
  --bs-color-data-4-soft:    #EFECF8;
  /* Surfaces sombres (héros) : scintillements et voiles déclarés */
  --bs-color-glint-faint:    rgba(255, 255, 255, .10);
  --bs-color-glint:          rgba(255, 255, 255, .16);
  --bs-color-glint-strong:   rgba(255, 255, 255, .35);
  --bs-color-glint-success:  rgba(107, 208, 159, .13);
  --bs-color-glint-warning:  rgba(240, 189, 99, .13);
  --bs-color-frost-strong:   rgba(255, 255, 255, .62);
  --bs-color-frost-opaque:   rgba(255, 255, 255, .96);
  --bs-shadow-hero-color:    rgba(11, 42, 66, .18);
  --bs-shadow-soft-color:    rgba(23, 35, 46, .08);
  --bs-shadow-faint-color:   rgba(23, 35, 46, .035);
  --bs-color-surface-frost:  rgba(255, 255, 255, .56);  /* voile clair sur surface teintée */

  /* ---- Semantic ----
     base = icons, borders, short labels · soft = surfaces
     strong = body text sitting on the matching soft surface */
  --bs-color-success:        #1C7A52;
  --bs-color-success-soft:   #E6F3EC;
  --bs-color-success-line:   #C4E4D3;
  --bs-color-success-strong: #155F40;
  --bs-color-warning:        #96600C;
  --bs-color-warning-soft:   #FBF0DC;
  --bs-color-warning-line:   #F0DCB4;
  --bs-color-warning-strong: #7A4E09;
  --bs-color-danger:         #B02A25;
  --bs-color-danger-soft:    #FBEAE8;
  --bs-color-danger-line:    #F0C9C5;
  --bs-color-danger-strong:  #8E211D;
  --bs-color-info:           #17537F;
  --bs-color-info-soft:      #E7EFF6;
  --bs-color-info-line:      #CFE0EC;
  --bs-color-info-strong:    #154A72;

  /* ---- Provenance layers (never interchangeable with semantic colours) ---- */
  --bs-color-source-menfp:         #17537F;
  --bs-color-source-menfp-soft:    #E7EFF6;
  --bs-color-source-school:        #B4552F;
  --bs-color-source-school-soft:   #FBEDE6;
  --bs-color-source-school-strong: #6E3319;
  --bs-color-source-boussole:      #1C7A52;
  --bs-color-source-boussole-soft: #E6F3EC;

  /* ---- Data visualisation ---- */
  --bs-color-data-1: #17537F;
  --bs-color-data-2: #B4552F;
  --bs-color-data-3: #1C7A52;
  --bs-color-data-4: #7A6FA8;
  --bs-color-data-5: #96600C;

  /* ---- Spacing ---- */
  --bs-space-1:  4px;
  --bs-space-2:  8px;
  --bs-space-3:  12px;
  --bs-space-4:  16px;
  --bs-space-5:  20px;
  --bs-space-6:  24px;
  --bs-space-8:  32px;
  --bs-space-10: 40px;

  /* ---- Radius and elevation ---- */
  --bs-radius-sm:      6px;
  --bs-radius-control: 8px;
  --bs-radius-card:    13px;
  --bs-radius-panel:   16px;
  --bs-radius-pill:    20px;
  --bs-radius-shell:   24px;  /* the app card on the backdrop */
  --bs-shadow-card:    0 1px 2px rgba(23, 35, 46, .06), 0 1px 3px rgba(23, 35, 46, .05);
  --bs-shadow-audio:   0 4px 14px rgba(11, 42, 66, .10);
  --bs-shadow-overlay: 0 18px 44px rgba(17, 35, 46, .24);
  --bs-focus-ring:     0 0 0 2px #FFFFFF, 0 0 0 4px var(--bs-color-brand-600);

  /* ---- Typography (sans serif throughout) ---- */
  --bs-font-family-sans: "Public Sans", system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  --bs-font-family-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --bs-font-size-xs:   11px;
  --bs-font-size-sm:   13px;
  --bs-font-size-ui:   14px;  /* buttons and dense UI copy */
  --bs-font-size-body: 15px;
  --bs-font-size-md:   16px;  /* list and card titles */
  --bs-font-size-h3:   18px;
  --bs-font-size-h2:   22px;
  --bs-font-size-h1:   27px;
  --bs-font-weight-regular:  400;
  --bs-font-weight-medium:   500;
  --bs-font-weight-semibold: 600;
  --bs-font-weight-bold:     700;
  --bs-line-height-tight: 1.25;
  --bs-line-height-body:  1.55;
  --bs-line-height-read:  1.7;
  --bs-tracking-heading: -0.015em;
  --bs-tracking-eyebrow: 0.11em;

  /* ---- Motion ---- */
  --bs-motion-fast:   120ms;
  --bs-motion-normal: 180ms;
  --bs-motion-ease:   cubic-bezier(.2, .6, .3, 1);

  /* ---- Layout ---- */
  --bs-layout-shell-max:         1280px;
  --bs-layout-content-max:       1140px;
  --bs-layout-sidebar-width:     252px;
  --bs-layout-mobile-nav-height: 64px;
  --bs-layout-tap-min:           44px;
  --bs-size-control-sm:          36px;
  --bs-size-control-lg:          48px;
  --bs-breakpoint-mobile:        390px;
  --bs-breakpoint-tablet:        768px;
  --bs-breakpoint-desktop:       1440px;
}

/* School accent · narrow and opt-in. It never overrides semantic colours,
   body text, form validation, focus rings or the product navigation. */
[data-school-accent] {
  --bs-school-accent:          #4A4FA0;
  --bs-school-accent-soft:     #EDEDF8;
  --bs-school-accent-contrast: #FFFFFF;
}
[data-school-accent="teal"]    { --bs-school-accent: #17726B; --bs-school-accent-soft: #E6F2F1; }
[data-school-accent="brique"]  { --bs-school-accent: #B4552F; --bs-school-accent-soft: #FBEDE6; }
[data-school-accent="ardoise"] { --bs-school-accent: #3F4A57; --bs-school-accent-soft: #EDEFF1; }

@media (prefers-reduced-motion: reduce) {
  :root { --bs-motion-fast: 0ms; --bs-motion-normal: 0ms; }
}