/* BeChef : palette et bas de page communs a toutes les apps (Duties, Pay, Pension, Primes, TC 286).
   Chaque app charge ce fichier AVANT son propre style et n'utilise que ces variables pour ses
   couleurs, ce qui donne le mode sombre partout. Theme : automatique (reglage du telephone),
   ou force par bechef.js avec <html data-theme="light|dark">. */

:root {
  color-scheme: light;
  /* encre et papier */
  --ink: #181613;
  --ink-soft: #5a5247;
  --ink-faint: #8a8275;
  --paper: #f7f1e3;
  --paper-shade: #ede4cc;
  --paper-deep: #e1d4b3;
  --rule: #c8b98f;
  --rule-soft: #ddd0a8;
  /* couleurs */
  --accent: #c14a36;
  --accent-deep: #8e2c1e;
  --accent-soft: #f0c1b5;
  --indigo: #2a3a6b;
  --green: #287858;
  --green-soft: #c4e6d2;
  --blue: #3b65a5;
  --blue-soft: #c5d9f0;
  --amber: #d4a017;
  --amber-soft: #f4e2b6;
  --red: #c14a36;
  --red-soft: #f3c5bb;
  --purple: #6a4c8a;
  --link-blue: #3b65a5;
  --amber-ink: #9a7208;
  /* texte pose sur un fond de couleur vive (bouton plein, pastille) */
  --on-color: #ffffff;
  /* texte sur un fond pastel fixe (calendrier officiel, reperes de periodes) : toujours fonce */
  --ink-on-pastel: #181613;
  /* neutres (codes RES, HSBR...) */
  --neutral: #888888;
  --neutral-soft: #dbdbdb;
  --neutral-faint: #ebebeb;
  /* survols, ombres, quadrillage du fond */
  --hover: rgba(0, 0, 0, .04);
  --hover-accent: rgba(193, 74, 54, .06);
  --shadow: rgba(0, 0, 0, .25);
  --grid-line: rgba(0, 0, 0, .025);
  --grid-line-soft: rgba(0, 0, 0, .015);
  --cmp-above: rgba(59, 101, 165, .17);
  --cmp-below: rgba(214, 120, 30, .20);
  --cmp-below-ink: #b85c10;
  --header-bg: #1d3a6e;
}

/* Sombre : automatique si le telephone est en mode sombre (sauf choix "clair"), ou force */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --ink: #ece4d2;
    --ink-soft: #c2b8a3;
    --ink-faint: #958b78;
    --paper: #1b1915;
    --paper-shade: #25221c;
    --paper-deep: #302b23;
    --rule: #4d4537;
    --rule-soft: #3a3429;
    --accent: #e2735c;
    --accent-deep: #f19a85;
    --accent-soft: #4d2a22;
    --indigo: #a7b6e6;
    --green: #5cbf92;
    --green-soft: #1f3b2e;
    --blue: #8fb4ea;
    --blue-soft: #22334b;
    --amber: #e5b93a;
    --amber-soft: #3e3320;
    --red: #e2735c;
    --red-soft: #4b2724;
    --purple: #b79ad8;
    --link-blue: #8fb4ea;
    --amber-ink: #e5b93a;
    --on-color: #15130f;
    --neutral: #6f6a62;
    --neutral-soft: #3a3631;
    --neutral-faint: #2c2925;
    --hover: rgba(255, 255, 255, .06);
    --hover-accent: rgba(226, 115, 92, .12);
    --shadow: rgba(0, 0, 0, .6);
    --grid-line: rgba(255, 255, 255, .025);
    --grid-line-soft: rgba(255, 255, 255, .015);
    --cmp-above: rgba(143, 180, 234, .20);
    --cmp-below: rgba(229, 150, 70, .22);
    --cmp-below-ink: #f0a868;
    --header-bg: #14161c;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --ink: #ece4d2;
  --ink-soft: #c2b8a3;
  --ink-faint: #958b78;
  --paper: #1b1915;
  --paper-shade: #25221c;
  --paper-deep: #302b23;
  --rule: #4d4537;
  --rule-soft: #3a3429;
  --accent: #e2735c;
  --accent-deep: #f19a85;
  --accent-soft: #4d2a22;
  --indigo: #a7b6e6;
  --green: #5cbf92;
  --green-soft: #1f3b2e;
  --blue: #8fb4ea;
  --blue-soft: #22334b;
  --amber: #e5b93a;
  --amber-soft: #3e3320;
  --red: #e2735c;
  --red-soft: #4b2724;
  --purple: #b79ad8;
  --link-blue: #8fb4ea;
  --amber-ink: #e5b93a;
  --on-color: #15130f;
  --neutral: #6f6a62;
  --neutral-soft: #3a3631;
  --neutral-faint: #2c2925;
  --hover: rgba(255, 255, 255, .06);
  --hover-accent: rgba(226, 115, 92, .12);
  --shadow: rgba(0, 0, 0, .6);
  --grid-line: rgba(255, 255, 255, .025);
  --grid-line-soft: rgba(255, 255, 255, .015);
  --cmp-above: rgba(143, 180, 234, .20);
  --cmp-below: rgba(229, 150, 70, .22);
  --cmp-below-ink: #f0a868;
  --header-bg: #14161c;
}

html { background: var(--paper); }

/* ---- Bas de page commun (rempli par bechef.js) ---- */
footer.bechef-footer {
  padding: 14px 22px calc(14px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--rule);
  font-size: 11px;
  line-height: 1.6;
  color: var(--ink-faint);
  text-align: center;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  background: var(--paper-shade);
}
footer.bechef-footer a { color: var(--link-blue); }
footer.bechef-footer .bf-app { margin-bottom: 6px; }
footer.bechef-footer .bf-links { margin: 4px 0; }
footer.bechef-footer .bf-links strong { color: var(--ink); }
footer.bechef-footer .bf-rights { margin-top: 4px; font-size: 0.9em; opacity: 0.8; }
footer.bechef-footer .bf-theme { display: inline-flex; gap: 0; vertical-align: middle; margin-left: 4px; }
footer.bechef-footer .bf-theme button {
  font: inherit; font-size: 11px; padding: 2px 8px; cursor: pointer;
  border: 1px solid var(--rule); background: var(--paper); color: var(--ink-soft);
}
footer.bechef-footer .bf-theme button + button { border-left: 0; }
footer.bechef-footer .bf-theme button.on { background: var(--ink); color: var(--paper); border-color: var(--ink); }