/* /styles/ads.css */
/* Emplacements sponsor neutres, mobile-first, pas de mot-clé "ad" pour limiter les blocages naïfs */

.only-mobile  { display: none; }
.only-desktop { display: none; }

@media (max-width: 780px){
  .only-mobile  { display: block; }
}
@media (min-width: 781px){
  .only-desktop { display: block; }
  /* forçage au cas où d'autres CSS réaffichent */
  .only-mobile  { display: none !important; }
}

/* === Slot de base : on réserve l’espace (anti-CLS) et on force un fond neutre === */
.sponsor-slot{
  position: relative;
  display: block;
  width: 100%;
  max-width: 760px;
  margin: 10px auto;
  overflow: hidden;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.08);
  background: #f6f7f9;
  /* anti-saut visuel si le contenu inside se met en inline heights */
  contain: layout paint;
}

/* Formats mobiles */
.sponsor-slot[data-format="m-banner"]{ aspect-ratio: 320 / 100;  max-width: 360px; }
.sponsor-slot[data-format="m-rect"]  { aspect-ratio: 300 / 250;  max-width: 340px; }

/* Formats desktop */
.sponsor-slot[data-format="d-banner"] { aspect-ratio: 468 / 60;   max-width: 520px; }
.sponsor-slot[data-format="leader"]   { aspect-ratio: 728 / 90;   max-width: 760px; }

/* Couches : externe (réseau pub) au-dessus, fallback maison en dessous */
.sponsor-external,
.sponsor-house{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
}
.sponsor-external{ z-index: 2; }
.sponsor-house{ z-index: 1; padding: 8px; }

/* Si le provider est rempli : cache le fallback proprement */
.sponsor-slot.filled .sponsor-house{ display:none !important; }

/* Style de l'encart maison Katoda (sobre, responsive) */
.sponsor-house a{
  display:flex; gap:10px; align-items:center; justify-content:center;
  width:100%; height:100%;
  text-decoration:none; color:#111;
  background:#fff; border-radius:10px; border:1px solid rgba(0,0,0,.06);
  padding: 10px;
}
.sponsor-house img{ max-height:80%; max-width:34%; object-fit:contain; }
.sponsor-house .copy{ display:flex; flex-direction:column; max-width:60%; }
.sponsor-house .title{ font-weight:700; }
.sponsor-house .desc{ font-size:.95rem; opacity:.85; }
.sponsor-house .cta{
  margin-top:6px; font-weight:700; border:1px solid rgba(0,0,0,.1);
  padding:6px 10px; border-radius:8px; background:#ffe8c6;
}

/* Ajuste un peu le fallback “house” en bandeau (moins haut visuellement) */
.sponsor-slot[data-format="d-banner"] .sponsor-house a,
.sponsor-slot[data-format="leader"]   .sponsor-house a {
  padding: 6px 10px;
}
.sponsor-slot[data-format="d-banner"] .sponsor-house img,
.sponsor-slot[data-format="leader"]   .sponsor-house img {
  max-width: 22%;
}
.sponsor-slot[data-format="d-banner"] .sponsor-house .desc,
.sponsor-slot[data-format="leader"]   .sponsor-house .desc {
  display: none; /* texte court sur bandeau */
}

/* Micro-tag d’info */
.sponsor-tag{
  position:absolute; bottom:6px; right:8px; font-size:11px; opacity:.65;
  background:rgba(0,0,0,.05); color:#333; padding:2px 6px; border-radius:6px;
}

/* Dark mode (ton site utilise html.dark) */
html.dark .sponsor-slot{ border-color:rgba(255,255,255,.12); background:#181a1f; }
html.dark .sponsor-house a{ background:#0e0f12; color:#e8e8e8; border-color:#24262b; }
html.dark .sponsor-house .cta{ background:#5a3d12; color:#ffe8c6; border-color:#734f19; }
html.dark .sponsor-tag{ background:rgba(255,255,255,.08); color:#ddd; }

/* === Normalisation des conteneurs tiers : toujours transparents & full-bleed === */
.sponsor-external > *{ width:100% !important; height:100% !important; }
ins.adsbygoogle{
  background: transparent !important;
  border: 0 !important;
  display: block !important;
  width:100% !important; height:100% !important;
}
.sponsor-external iframe{
  width:100% !important; height:100% !important; border:0 !important;
  display:block !important; background:transparent !important;
}

/* Si un provider déclare “no fill” => on masque sa couche pour éviter les bandes blanches */
.sponsor-slot.no-fill .sponsor-external{ display:none !important; }