/* ============================================================
   ads.css — Versão Balanceada (AdSense Friendly + Otimizada)
   ============================================================ */

/* CONTAINER PRINCIPAL DO BLOCO DE ANÚNCIO */
.card-ad {
  width: 100%;
  margin: 28px auto;
  text-align: center;
  display: block;
  clear: both;

  /* Performance */
  contain: content;
  content-visibility: auto;
}

/* CARD COM LABEL "Publicidade" */
.card-ad--labeled {
  background: #fafafa;
  border-radius: 6px;
  border: 1px solid #f0f0f0;
  padding: 18px 10px;
}

/* Label discreta */
.card-ad__title {
  display: block;
  font-size: 0.70rem;
  text-transform: uppercase;
  color: #9d9d9d;
  text-align: center;
  margin-bottom: 10px;
  letter-spacing: 1px;
  font-family: -apple-system, BlinkMacSystemFont, sans-serif;
}

/* ANÚNCIO ADSENSE */
.card-ad ins.adsbygoogle {
  display: block !important;
  width: 100% !important;
  max-width: 100%;
  margin: 0 auto !important;
  background: transparent !important;
  overflow: hidden;
}

/* Skeleton enquanto carrega — sem altura exagerada */
.card-ad ins.adsbygoogle:not([data-ad-status="filled"]) {
  background: linear-gradient(90deg, #f2f2f2 25%, #e8e8e8 50%, #f2f2f2 75%);
  background-size: 200% 100%;
  animation: adShimmer 1.5s infinite;
  
  /* Altura mínima balanceada → evita CLS e não corta anúncios */
  min-height: 160px;
}

/* Remove shimmer ao preencher */
.card-ad ins.adsbygoogle[data-ad-status="filled"] {
  animation: none !important;
  background: transparent !important;
  min-height: 0;
}

@keyframes adShimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ============================================================
   MOBILE (até 767px)
   ============================================================ */
@media (max-width: 767px) {
  .card-ad {
    margin: 24px 0;
    width: 100% !important;
  }

  /* Remover borda lateral e manter layout limpo */
  .card-ad--labeled {
    padding: 14px 6px;
    border-radius: 0;
    border-left: none;
    border-right: none;
  }

  /* Mais adequado para anúncios fluid no mobile */
  .card-ad ins.adsbygoogle:not([data-ad-status="filled"]) {
    min-height: 140px;
  }

  /* Topo da página — geralmente banners menores */
  .card-ad[data-slot-type="top"] ins.adsbygoogle:not([data-ad-status="filled"]) {
    min-height: 90px !important;
  }
}

/* ============================================================
   DESKTOP — SIDEBAR
   ============================================================ */
@media (min-width: 1024px) {
  .sidebar-ad-wrapper .card-ad {
    margin: 0 0 22px 0;
    width: 100%;
  }

  /* Sidebar costuma usar 300×250 ou 300×600 */
  .sidebar-ad-wrapper ins.adsbygoogle:not([data-ad-status="filled"]) {
    min-height: 250px;
  }
}

/* ============================================================
   MOBILE (até 1023px) — SIDEBAR COMPLETAMENTE OCULTA
   ============================================================ */
@media (max-width: 1023px) {
  /* OCULTA SIDEBAR NO MOBILE */
  .sidebar-ad-wrapper {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
  }
  
  .sidebar-ad-wrapper * {
    display: none !important;
  }
}