/* Base & Global Styles ——————————————————————— */
html {
  background-color: var(--color-primary-200);
  /* Rendu typographique plus fin sur macOS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.site {
  background: var(--site-gradient);
  color: var(--color-body-text);
  font-family: Inter, sans-serif;
  font-size: var(--fs-body);
  isolation: isolate;
}

.site::after {
  content: "";
  filter: url(#grain);
  inset: 0;
  opacity: 0.25;
  pointer-events: none;
  position: fixed;
  z-index: -1;
}

.wrapper {
  display: flex;
  flex-direction: column;
  margin-inline: auto;
  min-height: 100dvh;
  min-height: 100svh;
  padding-block-end: 5rem;
  row-gap: var(--space-8);
  width: min(1600px, 90%);

  .site-content {
    flex: 1;
  }
}

.info-cridon {
  font-size: var(--fs-small);
}

@media (width > 720px) {
  .wrapper {
    padding-block-end: 0;
  }
}

/* Page IA : hauteur cappée au viewport pour garder le scroll interne des 3 panneaux
   (sidebar/chat/docs) plutôt que de faire grandir toute la page avec le contenu généré.
   .site-content a par défaut un min-height:auto (comportement flex standard) qui, sans cette
   règle, l'emporte sur flex:1 dès que son contenu dépasse l'espace disponible.
   Ciblage via :has(> .ia-wrapper) plutôt que la classe .wrapper--ia posée par IA.razor.cs :
   cette page IA (RCL) et cette page hôte (SiteNotaires) ont chacune leur propre instance de
   ServiceSetLayout (deux services scoped indépendants, non reliés), donc SetCssClass appelé
   côté RCL ne modifie jamais la classe réellement rendue ici — :has() n'a pas ce problème
   puisqu'il regarde le DOM réel plutôt qu'un état applicatif. */
.wrapper:has(> .ia-wrapper) {
  height: 100dvh;
  height: 100svh;
}

.wrapper:has(> .ia-wrapper) .site-content {
  min-height: 0;
}

a {
  color: var(--color-body-text);
  /* Cibler uniquement la propriété qui change */
  transition-property: color;
  transition-duration: 150ms;
  transition-timing-function: ease-out;
}

a:hover,
a:focus {
  color: var(--color-accent);
}

ul {
  line-height: 1.7;
}