/*
  PAGE ELEMENTS — styles de base des images libres posées par
  web/js/page-elements.js. Toutes les valeurs paramétrables (taille,
  position, arrondi, opacité, zoom, object-position) sont posées en
  style inline par ce script à chaque rendu — cette feuille ne fixe que
  ce qui ne change jamais : positionnement absolu dans la section hôte,
  invisibilité totale pour l'interaction (décoratif uniquement, jamais
  cliquable ni sélectionnable), image qui remplit sa boîte sans jamais
  être déformée par défaut.
*/
.mfa-page-element {
  position: absolute;
  overflow: hidden;
  pointer-events: none;
}

/* .mfa-admin-preview n'est JAMAIS présent sur le site public — cette
   classe n'est posée que par page-elements.js en réaction à un
   postMessage same-origin que seul web/admin-layout/ envoie (voir
   admin-layout-editor.js). Elle autorise le clic pour sélectionner une
   image directement depuis l'aperçu de l'éditeur ; aucun style visuel
   de sélection (contour, poignées) n'est ajouté ici — ces éléments sont
   un calque séparé, superposé par le parent (voir admin-layout.css). */
html.mfa-admin-preview .mfa-page-element {
  pointer-events: auto;
  cursor: pointer;
}
.mfa-page-element img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ====================================================================
   CONTOURS DE SECTION (éditeur uniquement — voir applySectionHighlights
   ci-dessus dans ce fichier). Posés/retirés uniquement en réaction à un
   postMessage same-origin que seul web/admin-layout/ envoie : jamais
   présents sur le site public, jamais pour un vrai visiteur.
   ==================================================================== */
.mfa-section-highlight {
  outline: 1.5px dashed rgba(200, 169, 106, 0.35);
  outline-offset: -1.5px;
}
.mfa-section-highlight-active {
  outline: 2px dashed rgba(200, 169, 106, 0.9);
  outline-offset: -2px;
}
.mfa-section-highlight-active::before {
  content: attr(data-mfa-section-label);
  position: absolute;
  top: 8px;
  left: 8px;
  background: rgba(17, 17, 17, 0.88);
  color: #fff;
  font: 700 11px/1.4 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 5px;
  z-index: 99999;
  pointer-events: none;
}