/* Typo Nunito (titres) / Nunito Sans (corps) - même import que frontend/index.html, pour rester
   cohérent avec le site (SPEC-014, généralisé au site). */
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@700;800&family=Nunito+Sans:opsz,wght@6..12,400;6..12,500;6..12,600;6..12,700&display=swap');

/* Palette custom Material (cf. https://squidfunk.github.io/mkdocs-material/setup/changing-the-colors/#custom-colors)
   reprenant les couleurs du frontend : navy #2c3e50 (header/CTA sombre) + bleu #3498db
   (accent / liens / boutons primaires, cf. .btn-primary dans frontend/src/index.css). Appliquée
   aux deux schémas (default/slate) pour garder la même identité visuelle en clair et en sombre. */
:root > * {
  --md-primary-fg-color:        #2c3e50;
  --md-primary-fg-color--light: #3d5166;
  --md-primary-fg-color--dark:  #1a252f;
  --md-primary-bg-color:        #ffffff;
  --md-primary-bg-color--light: rgba(255, 255, 255, 0.7);

  --md-accent-fg-color:             #3498db;
  --md-accent-fg-color--transparent: rgba(52, 152, 219, 0.1);
  --md-accent-bg-color:             #ffffff;
  --md-accent-bg-color--light:      rgba(255, 255, 255, 0.7);

  --md-typeset-a-color: #3498db;
}

/* Fond de page gris clair du site (frontend/src/index.css `body { background-color: #f5f5f5 }`)
   au lieu du blanc par défaut de Material. Scopé au schéma clair : en slate (sombre), le site n'a
   pas d'équivalent, on laisse le rendu sombre par défaut de Material. */
[data-md-color-scheme="default"] {
  --md-default-bg-color: #f5f5f5;
}

body,
input {
  font-family: 'Nunito Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
}

.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4,
.md-typeset h5,
.md-typeset h6,
.md-nav__title,
.md-header__topic {
  font-family: 'Nunito', sans-serif;
  font-weight: 800;
}

/* Couleur des titres de contenu : navy du site (ex. products-header h2, account-card h3,
   hero-title dans frontend/src/index.css - toujours #2c3e50, quel que soit le niveau). On ne
   touche pas .md-nav__title / .md-header__topic ci-dessus : ces titres-là sont en blanc sur fond
   navy (sidebar/header), leur donner cette même couleur les rendrait invisibles. */
.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4,
.md-typeset h5,
.md-typeset h6 {
  color: #2c3e50;
}

/* Header un peu plus haut que le défaut Material (2.4rem) pour laisser respirer le logo, sans
   viser la hauteur du header marketing du frontend (112px, avec nav complète) qui n'a pas sa
   place ici. */
:root {
  --md-header-height: 64px;
}

/* Logo du header : même image que le frontend (1429x576), on garde son ratio plutôt que la
   hauteur/largeur figées précédentes (87x198) qui l'écrasaient légèrement. */
.md-header__button.md-logo {
  margin: 0;
  padding: 0;
}

.md-header__button.md-logo img,
.md-header__button.md-logo svg {
  height: 44px;
  width: auto;
}