/**
 * Jetons propres à TC Horizon.
 *
 * Seules les valeurs qui font l'identité de ce site figurent ici : le reste
 * vient des valeurs par défaut de `tc_components`, chargées avant celles-ci.
 * Ne reprendre que les écarts garde visible ce qui distingue ce thème.
 */

:root {
  --tc-accent: #00251B;
  --tc-accent-light: #E8EFE9;
  --tc-title-on-image: #FFF6C7;

  --tc-surface-soft: #F5F7F4;

  /* L'or sable de la marque : plein pour les pictogrammes et les pastilles,
     foncé pour le texte. Le jaune reste réservé à l'action. */
  --tc-primary: #CDA06D;
  --tc-primary-strong: #8F6530;
  --tc-action: #FCDB1A;
  --tc-action-hover: #F0CD00;
  --tc-on-action: #00251B;
  --tc-star: #F5C542;

  --tc-serif: "Fraunces", Georgia, serif;
  --tc-sans: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;
}

body {
  margin: 0;
  font-family: var(--tc-sans);
  font-size: var(--tc-fs-md);
  line-height: 1.5;
  color: var(--tc-ink);
  background: var(--tc-surface);
  -webkit-font-smoothing: antialiased;
}

/* Conteneur commun aux sections de page, hors de tout composant. */
.tc-container {
  max-width: var(--tc-max-width);
  margin-inline: auto;
  padding-inline: var(--tc-gutter);
}

/* La page est le bloc conteneur du site.
 *
 * L'en-tête superposé se place en absolu. Sans ancêtre positionné il se
 * calerait sur le document entier — donc sous la barre d'administration, qui
 * pousse le corps de page par un `padding-top`. Une seule déclaration ici
 * évite au composant d'avoir à connaître son environnement. */
.tc-page {
  position: relative;
}

/* Largeur plancher.
 *
 * Sous 320 px la barre du haut et le champ de recherche du hero ne tiennent
 * plus sans se chevaucher. Plutôt que de laisser la mise en page se défaire,
 * on arrête de rétrécir : la page déborde et se fait défiler. Un débordement
 * est désagréable, une mise en page cassée est illisible. */
.tc-page {
  min-width: 320px;
}

/* Ce qui surmonte la page.
 *
 * La barre d'administration décale le corps par une marge intérieure, que les
 * hauteurs exprimées en pourcentage de fenêtre ignorent. Drupal publie ce
 * décalage ; on le relaie aux composants, qui n'ont pas à le connaître. */
body {
  --tc-chrome-offset: var(--drupal-displace-offset-top, 0px);
}
