/* ==========================================================
   Theme: Krossnote — Diagnostic structurel bâtiment
   --------------------------------------------------------
   Warm palette: orange / yellow / blue / midnight.
   Neutrals have a subtle violet tint.
   ========================================================== */

:root {
  /* ===== Brand core (logo colors) ===== */
  --kn-midnight: #050038;
  --kn-blue:     #1A3A8F;
  --kn-orange:   #E07B00;
  --kn-yellow:   #FFAD00;

  /* ===== Extended neutrals ===== */
  --kn-ink:       #0C0833;
  --kn-slate-900: #1A1747;
  --kn-slate-700: #3B3A5C;
  --kn-slate-500: #6F6E8C;
  --kn-slate-300: #B8B7C9;
  --kn-slate-200: #D8D7E3;
  --kn-slate-100: #ECECF3;
  --kn-slate-50:  #F6F6FA;
  --kn-paper:     #FBFAF7;
  --kn-white:     #FFFFFF;

  /* ===== Midnight tints (dark surfaces) ===== */
  --kn-midnight-1: #0B0744;
  --kn-midnight-2: #16125A;
  --kn-midnight-3: #232078;
  --kn-midnight-fog: rgba(255,255,255,0.08);

  /* ===== Brand semantic aliases ===== */
  --brand-primary:       var(--kn-orange);
  --brand-primary-hover:  #C96E00;
  --brand-primary-press:  #AD5E00;
  --brand-primary-tint:   #FBEEDC;
  --brand-primary-ink:    #FFFFFF;
  --brand-accent:         var(--kn-yellow);
  --brand-dark:           var(--kn-midnight);
  --brand-dark-1:         var(--kn-midnight-1);
  --brand-dark-2:         var(--kn-midnight-2);

  /* ===== Foreground / background aliases ===== */
  --fg-1: var(--kn-ink);
  --fg-2: var(--kn-slate-700);
  --fg-3: var(--kn-slate-500);
  --fg-onDark-1: #FFFFFF;
  --fg-onDark-2: rgba(255,255,255,0.72);
  --fg-onDark-3: rgba(255,255,255,0.48);

  --bg-1: var(--kn-paper);
  --bg-2: var(--kn-white);
  --bg-3: var(--kn-slate-50);
  --bg-dark-1: var(--kn-midnight);
  --bg-dark-2: var(--kn-midnight-1);

  /* ===== Shadows ===== */
  --shadow-1: 0 1px 2px rgba(5,0,56,0.06), 0 1px 0 rgba(5,0,56,0.04);
  --shadow-2: 0 2px 4px rgba(5,0,56,0.08);
  --shadow-3: 0 8px 16px rgba(5,0,56,0.10);
  --shadow-4: 0 18px 40px rgba(5,0,56,0.18);
  --shadow-focus: 0 0 0 3px rgba(224,123,0,0.28);
  --shadow-focus-blue: 0 0 0 3px rgba(26,58,143,0.28);

  /* ===== Borders ===== */
  --border-subtle: 1px solid var(--kn-slate-200);
  --border-strong: 1px solid var(--kn-slate-300);
  --border-onDark: 1px solid rgba(255,255,255,0.10);
}

/* Blue-primary variant (Krossnote-specific) */
:root[data-primary="blue"] {
  --brand-primary:       var(--kn-blue);
  --brand-primary-hover:  #14306E;
  --brand-primary-press:  #0F2657;
  --brand-primary-tint:   #E4EAF7;
  --shadow-focus: var(--shadow-focus-blue);
}