/* Host Conecta V7.4.2 — mídia de catálogo e detalhamento sem perda de informação.
   Correção cirúrgica: não altera Landing, Mobile home, PWA, Painel ou Admin. */

/* Cards de catálogo: criativos podem conter texto. Auto/contain preservam a arte;
   cover só é usado quando o gestor escolheu explicitamente "Preencher". */
body.host-public .catalog-media{
  position:relative;
  isolation:isolate;
  background:linear-gradient(135deg,#F4F7F8,#EEF2F4)!important;
}
body.host-public .catalog-media img,
body.host-public .catalog-media .video-poster{
  position:relative;
  z-index:1;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  padding:7px!important;
  background:transparent!important;
}
body.host-public .catalog-media.fit-cover img,
body.host-public .catalog-media.fit-cover .video-poster{
  object-fit:cover!important;
  padding:0!important;
}
body.host-public .catalog-media.orientation-portrait img,
body.host-public .catalog-media.orientation-square img,
body.host-public .catalog-media.orientation-portrait .video-poster,
body.host-public .catalog-media.orientation-square .video-poster{
  object-fit:contain!important;
  padding:8px!important;
}

/* A mesma proteção vale para os cards reutilizados na landing desktop. */
body.host-public .desktop-product-media-v73,
body.host-public .desktop-feature-media-v73{
  background:linear-gradient(135deg,#F4F7F8,#EEF2F4)!important;
}
body.host-public .desktop-product-media-v73 img,
body.host-public .desktop-feature-media-v73 img{
  object-fit:contain!important;
  object-position:center!important;
  padding:8px!important;
  background:transparent!important;
}
body.host-public .desktop-product-media-v73.fit-cover img,
body.host-public .desktop-feature-media-v73.fit-cover img{
  object-fit:cover!important;
  padding:0!important;
}
body.host-public .desktop-product-media-v73.orientation-portrait img,
body.host-public .desktop-product-media-v73.orientation-square img,
body.host-public .desktop-feature-media-v73.orientation-portrait img,
body.host-public .desktop-feature-media-v73.orientation-square img{
  object-fit:contain!important;
  padding:8px!important;
}

/* Detalhe: aqui informação tem prioridade absoluta sobre preenchimento do quadro. */
body.host-public .detail-media-v742{
  position:relative;
  isolation:isolate;
  background:
    radial-gradient(circle at 50% 35%,color-mix(in srgb,var(--brand) 7%,transparent),transparent 46%),
    linear-gradient(135deg,#F7F9FA,#EEF2F4)!important;
  overflow:hidden!important;
}
body.host-public .detail-media-v742 img,
body.host-public .detail-media-v742 video{
  position:relative;
  z-index:1;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  padding:10px!important;
  background:transparent!important;
  cursor:zoom-in;
}
body.host-public .detail-media-v742 video{cursor:default}
body.host-public .detail-expand-v742{
  position:absolute;
  z-index:4;
  right:14px;
  bottom:14px;
  width:42px;
  height:42px;
  border:1px solid rgba(13,59,76,.10);
  border-radius:13px;
  background:rgba(255,255,255,.94);
  color:#0D3B4C;
  box-shadow:0 10px 28px rgba(13,59,76,.15);
  font-size:16px;
  font-weight:900;
  display:grid;
  place-items:center;
}

/* Desktop: detalhe vira composição de produto, não uma faixa horizontal cortada. */
@media(min-width:900px){
  body.host-public .catalog-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:14px!important;
    padding:0 14px 22px!important;
  }
  body.host-public .catalog-media{
    height:230px!important;
  }
  body.host-public .catalog-body{
    padding:13px!important;
  }
  body.host-public .catalog-body b{font-size:11px!important}
  body.host-public .catalog-body p{font-size:8px!important;height:auto!important;min-height:26px}
  body.host-public .catalog-body .price{font-size:9px!important}
  body.host-public .catalog-body button{font-size:8px!important;padding:9px!important}

  body.host-public #view-product.active{
    display:grid!important;
    grid-template-columns:minmax(0,1.34fr) minmax(310px,.66fr)!important;
    grid-template-rows:auto 1fr auto!important;
    align-items:stretch!important;
    min-height:690px!important;
  }
  body.host-public #view-product .view-head{
    grid-column:1/-1;
    grid-row:1;
  }
  body.host-public #view-product .detail-media-v742{
    grid-column:1;
    grid-row:2/4;
    height:auto!important;
    min-height:620px!important;
    max-height:none!important;
    border-right:1px solid #E7ECEF;
    padding:12px!important;
  }
  body.host-public #view-product .detail-media-v742 img,
  body.host-public #view-product .detail-media-v742 video{
    padding:8px!important;
  }
  body.host-public #view-product .detail-body{
    grid-column:2;
    grid-row:2;
    padding:30px 28px 18px!important;
    align-self:start;
  }
  body.host-public #view-product .detail-body h2{
    font-size:25px!important;
    color:#0D3B4C!important;
    margin-bottom:8px!important;
  }
  body.host-public #view-product .detail-price{
    font-size:14px!important;
    margin-bottom:14px!important;
  }
  body.host-public #view-product .detail-body p{
    font-size:11px!important;
    line-height:1.7!important;
    color:#687A84!important;
  }
  body.host-public #view-product .sticky-cta{
    grid-column:2;
    grid-row:3;
    position:static!important;
    align-self:end;
    bottom:auto!important;
    padding:16px 28px 28px!important;
    border-top:0!important;
    background:#fff!important;
  }
  body.host-public #view-product .sticky-cta button{
    height:48px!important;
    border-radius:13px!important;
    font-size:10px!important;
  }
}

/* Mobile: o detalhe acompanha a proporção real do arquivo e continua legível. */
@media(max-width:899px){
  body.host-public .catalog-media{
    height:180px!important;
  }
  body.host-public .detail-media-v742{
    height:auto!important;
    min-height:220px!important;
    max-height:72vh!important;
    aspect-ratio:var(--detail-media-ratio,4/5)!important;
    padding:6px!important;
  }
  body.host-public .detail-media-v742 img,
  body.host-public .detail-media-v742 video{
    padding:4px!important;
  }
}

/* Lightbox para arte informativa, folder, tabela ou vídeo. */
body.host-public .media-lightbox-v742{
  position:fixed;
  inset:0;
  z-index:120;
  display:none;
  align-items:center;
  justify-content:center;
  padding:26px;
  background:rgba(8,21,29,.88);
  backdrop-filter:blur(10px);
}
body.host-public .media-lightbox-v742.open{display:flex}
body.host-public .media-lightbox-content-v742{
  width:min(1180px,94vw);
  height:min(90vh,900px);
  display:grid;
  place-items:center;
  border-radius:20px;
  overflow:hidden;
  background:#F7F9FA;
  box-shadow:0 30px 90px rgba(0,0,0,.32);
}
body.host-public .media-lightbox-content-v742 img,
body.host-public .media-lightbox-content-v742 video{
  width:100%;
  height:100%;
  object-fit:contain;
  background:#F7F9FA;
}
body.host-public .media-lightbox-close-v742{
  position:fixed;
  top:18px;
  right:22px;
  z-index:122;
  width:46px;
  height:46px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:14px;
  background:rgba(255,255,255,.96);
  color:#0D3B4C;
  font-size:24px;
  line-height:1;
  box-shadow:0 10px 28px rgba(0,0,0,.18);
}
@media(max-width:600px){
  body.host-public .media-lightbox-v742{padding:14px}
  body.host-public .media-lightbox-content-v742{width:96vw;height:88vh;border-radius:16px}
  body.host-public .media-lightbox-close-v742{top:10px;right:10px;width:42px;height:42px}
}
