/* Cadre partagé Astro / application. Référence : /blog/ à 100 %.
   Les marges sont celles du viewport de mise en page (hors barre système).
   Aucun jeton ni sélecteur actif sous 1024 px. */
@media (min-width:1024px) {
  :root {
    --cf-layout-max:1200px;
    --cf-layout-width:min(var(--cf-layout-max),78%);
    --cf-header-height:90px;
    --cf-header-inset:20px;
    --cf-header-gap:20px;
    --cf-logo-width:230px;
    --cf-logo-height:76px;
    --cf-reading-max:800px;
    --cf-scene-margin:calc(max(11vw,(100vw - var(--cf-layout-max))/2) - 12px);
  }
  /* Un même repère sur une page courte, longue ou à défilement interne.
     Sur le blog long, cet espace est déjà occupé par la barre système. */
  html.cf-app, html:has(.page-partage), html:has(.public-site):not(:has(.editorial-grid)) { scrollbar-gutter:stable; }

  html.cf-app .shell { width:var(--cf-layout-width); max-width:none; }
  html.cf-app .page-carnet #view,
  html.cf-app .page-espace :is(.head,#wrap,.scroll),
  html.cf-app .page-home .scroll { width:100%; max-width:none; }
  html.cf-app .page-carnet #view { padding-inline:0; }
  html.cf-app .page-carnet #view > .head { padding-inline:0; }
  html.cf-app .page-carnet #view > .tabs { padding-inline:0; }
  html.cf-app .page-carnet #view > .scroll > .list { padding-inline:0; }
  html.cf-app .page-carnet #view > .scroll:has(> .sheet) { width:100%; max-width:none; }
  html.cf-app .page-carnet #view > .scroll > .sheet:not(.fd-sheet) {
    width:100%; max-width:var(--cf-reading-max); margin-inline:auto;
  }
  /* Les cadres n'ajoutent plus une seconde paire de marges au contenu. */
  html.cf-app .page-espace #wrap { margin-inline:0; }

  /* Le custom element, ses liens, ses icônes et ses états restent inchangés.
     Seule sa boîte desktop rejoint celle du header public. */
  html.cf-app cf-bottom-nav { width:var(--cf-layout-width); margin-inline:auto; }
  html.cf-app cf-bottom-nav, .page-partage main > header {
    height:var(--cf-header-height); min-height:var(--cf-header-height);
    border:1px solid #e5ded2; border-radius:0 0 20px 20px;
    background:#fffdf9f5; box-shadow:0 4px 16px #492e1710;
  }
  html.cf-app .cf-nav {
    width:100%; max-width:none; height:calc(var(--cf-header-height) - 2px);
    gap:var(--cf-header-gap); padding:4px var(--cf-header-inset);
  }
  html.cf-app .cf-nav__brand { width:var(--cf-logo-width); }
  html.cf-app .cf-nav__brand img, .page-partage main > header img {
    /* Même asset canonique que le blog ; le lien conserve son nom accessible. */
    content:url('./logo-header.webp');
    width:var(--cf-logo-width); height:var(--cf-logo-height);
    object-fit:cover; object-position:center; flex:none;
  }
  html.cf-app .cf-nav__item { padding:12px 11px; gap:6px; }
  html.cf-app .cf-nav__fabslot { margin-left:0; }

  /* Pages documentaires : le cadre reste commun, la lecture reste bornée. */
  .public-site .public-container.document { max-width:none; }
  .public-site .document > * { max-width:var(--cf-reading-max); }
  /* Fiche de partage PHP historique : même cadre, même unique lien d'accueil.
     Le détail culinaire conserve une largeur de lecture à l'intérieur. */
  .page-partage main { width:var(--cf-layout-width); max-width:none; padding:0 0 40px; }
  .page-partage main > header { display:flex; align-items:center; padding:4px var(--cf-header-inset); margin-bottom:26px; }
  .page-partage main > header img { display:block; }
  .page-partage main > :not(header) { max-width:var(--cf-reading-max); margin-inline:auto; }
}
@media (min-width:1024px) and (max-width:1200px) {
  :root {
    --cf-layout-width:calc(100% - 96px);
    --cf-header-inset:12px;
    --cf-header-gap:10px;
    --cf-logo-width:180px;
    --cf-scene-margin:38px;
  }
  html.cf-app .cf-nav__item { padding:10px 8px; }
  html.cf-app .cf-nav__lb { font-size:13px; }
}