/* =========================================================
   SPO — 10-base.css (GLOBAL) — 2026-01-22
   Rôle : fondations globales (layout, typo, accessibilité, helpers)
   SAFE / additif — conçu pour que les CSS de pages s’appuient dessus.
   ========================================================= */

:root{
  --spo-page-max: 1120px;
  --spo-radius: 18px;
  --spo-radius-sm: 14px;
  --spo-shadow: 0 14px 34px rgba(15,42,68,.10);
  --spo-border: rgba(15,42,68,.12);

  /* Fallbacks si 00-palette.css n’est pas chargé */
  --spo-primary: var(--spo-primary, #0F2A44);
  --spo-secondary: var(--spo-secondary, #1E4F7A);
  --spo-muted: var(--spo-muted, #64748B);
  --spo-bg: var(--spo-bg, #F4F6F8);
}

/* Fond global (site) — n’écrase pas le thème si déjà géré */
body{
  background: var(--spo-bg);
}

/* Wrapper SPO : garde une largeur cohérente sans dépendre du thème */
.spo-wrap{
  width:100%;
}

/* Conteneur utilitaire (si besoin dans d’autres pages) */
.spo-container{
  max-width: var(--spo-page-max);
  margin-left:auto;
  margin-right:auto;
  padding-left: 18px;
  padding-right: 18px;
}

/* Typo/lecture : sans casser le thème, mais évite le “tout gris pâle” */
.spo-wrap :is(p, li){
  color: rgba(17,24,39,.88);
}

/* =========================================================
   Accessibilité
   ========================================================= */

/* SR-only (utilisé dans le HTML) */
.spo-sr-only{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

/* Skip links : invisibles sauf focus (global) */
.spo-skip-link{
  position:absolute;
  left:-9999px;
  top:auto;
  width:1px;
  height:1px;
  overflow:hidden;
}
.spo-skip-link:focus{
  position:fixed;
  left:16px;
  top:16px;
  width:auto;
  height:auto;
  padding:10px 12px;
  z-index:99999;
  background:#fff;
  border:1px solid rgba(15,42,68,.22);
  border-radius:12px;
  box-shadow:0 10px 24px rgba(15,42,68,.14);
}

/* Focus visible “propre” (clavier) */
.spo-wrap a:focus-visible,
.spo-wrap button:focus-visible,
.spo-wrap [tabindex]:focus-visible{
  outline:3px solid rgba(201,162,39,.45);
  outline-offset:2px;
  border-radius:14px;
}

/* =========================================================
   Icônes (Font Awesome)
   ========================================================= */
.spo-ico{
  line-height:1;
  display:inline-block;
  vertical-align:-0.12em;
}

/* =========================================================
   Breadcrumbs : anti-numérotation (ListingHive peut injecter des counters)
   ========================================================= */
.spo-breadcrumbs__list{
  list-style:none !important;
  padding-left:0 !important;
  margin-left:0 !important;
  counter-reset:none !important;
}
.spo-breadcrumbs__item::before{
  content:none !important;
}