/* ──────────────────────────────────────────────────────────────
   imotrack — Brand Kit v1.1 (Premium Blue refresh)
   Source: branding/Charte Graphique/Imotrack Brand Kit.html

   v1.1 (2026-04-20): swap ember → premium blue, shift pure-black
   surfaces to navy for a lighter, more luminous feel.
   Legacy --im-ember* tokens are kept as aliases of the new blue so
   downstream templates that still reference them don't break.
   ────────────────────────────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Geist:wght@300;400;500;600;700;800&family=Geist+Mono:wght@400;500&family=Instrument+Serif:ital@0;1&display=swap');

:root {
  /* Neutrals (text + quiet surfaces) */
  --im-ink:     #0B0D0E;
  --im-ink-2:   #1C1F22;
  --im-ink-3:   #40464C;
  --im-ink-4:   #6B7278;
  --im-ink-5:   #A6ABAF;
  --im-line:    #E5E7EB;
  --im-paper:   #FFFFFF;
  --im-paper-2: #F8F9FA;
  --im-sand:    #EEF1F4;

  /* Navy (premium dark surfaces — sidebars, hero cards) */
  --im-navy:    #0A1E3F;
  --im-navy-2:  #0F2A5C;
  --im-navy-3:  #16407D;

  /* Moss (calm / success) */
  --im-moss:    #0E3B2E;
  --im-moss-2:  #18543F;
  --im-moss-3:  #266B52;
  --im-moss-5:  #A5B09A;

  /* Premium Blue (primary accent / action) */
  --im-blue:    #2563EB;   /* default */
  --im-blue-2:  #1E40AF;   /* hover / active */
  --im-blue-3:  #3B82F6;   /* brighter variant */
  --im-blue-4:  #93C5FD;   /* light accent (tags, chips) */
  --im-blue-5:  #DBEAFE;   /* very light tint (subtle bg) */

  /* Legacy ember aliases → premium blue (back-compat) */
  --im-ember:   var(--im-blue);
  --im-ember-2: var(--im-blue-2);
  --im-ember-3: var(--im-blue-4);

  /* Type stacks */
  --im-sans:  'Geist', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --im-mono:  'Geist Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --im-serif: 'Instrument Serif', Georgia, serif;
}

/* ── Base body & typography ─────────────────────────────────── */
body {
  font-family: var(--im-sans);
  background-color: var(--im-paper);
  color: var(--im-ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  letter-spacing: -0.02em;
  font-weight: 600;
}

/* ── Bootstrap primary override (primary = premium blue) ───── */
.btn-primary {
  --bs-btn-bg: var(--im-blue);
  --bs-btn-border-color: var(--im-blue);
  --bs-btn-hover-bg: var(--im-blue-2);
  --bs-btn-hover-border-color: var(--im-blue-2);
  --bs-btn-active-bg: var(--im-blue-2);
  --bs-btn-active-border-color: var(--im-blue-2);
  --bs-btn-disabled-bg: var(--im-ink-4);
  --bs-btn-disabled-border-color: var(--im-ink-4);
}
.btn-dark {
  --bs-btn-bg: var(--im-navy);
  --bs-btn-border-color: var(--im-navy);
  --bs-btn-hover-bg: var(--im-navy-2);
  --bs-btn-hover-border-color: var(--im-navy-2);
  --bs-btn-active-bg: var(--im-navy-2);
  --bs-btn-active-border-color: var(--im-navy-2);
}

/* Links: ink text, premium blue on hover */
a { color: var(--im-ink); }
a:hover { color: var(--im-blue); }

/* Cards echo the paper surface with a warm line */
.card { border: 1px solid var(--im-line); box-shadow: 0 1px 3px rgba(10,30,63,.05); }

/* Form controls focus on blue (no more orange glow) */
.form-control:focus,
.form-select:focus {
  border-color: var(--im-blue);
  box-shadow: 0 0 0 .2rem rgba(37,99,235,.18);
}

/* Utility classes for quick brand usage in templates */
.im-blue  { color: var(--im-blue); }
.im-ink   { color: var(--im-ink); }
.im-navy  { color: var(--im-navy); }
.im-moss  { color: var(--im-moss); }
.im-bg-paper  { background-color: var(--im-paper); }
.im-bg-paper2 { background-color: var(--im-paper-2); }
.im-bg-navy   { background-color: var(--im-navy); color: var(--im-paper); }
.im-bg-ink    { background-color: var(--im-ink); color: var(--im-paper); }
/* Legacy aliases (mirror the new ember→blue remap) */
.im-ember { color: var(--im-blue); }