/* CSS para corrigir possíveis problemas de layout causados pelos scripts */

/* Garantir que elementos não sejam afetados pelos scripts */
body {
  overflow-x: hidden;
}

/* Corrigir possíveis problemas de posicionamento */
.header, 
.main-content, 
.footer {
  position: relative;
  z-index: 1;
}

/* Garantir que produtos sejam exibidos corretamente */
.product-card,
.card-wrapper {
  display: block;
  position: relative;
}

/* Corrigir layout de texto */
p, h1, h2, h3, h4, h5, h6 {
  display: block;
  position: relative;
}

/* Garantir que listas sejam exibidas corretamente */
ul, ol {
  display: block;
  list-style: initial;
}

/* Corrigir possíveis problemas com flexbox */
.flex,
[class*="flex"] {
  display: flex;
}

.grid,
[class*="grid"] {
  display: grid;
}

/* Garantir que imagens sejam exibidas */
img {
  display: block;
  max-width: 100%;
  height: auto;
}

/* DESKTOP: Layout com uma imagem principal e thumbnails na lateral - TAMANHOS MAIORES */
@media screen and (min-width: 769px) {
  /* Container principal da galeria - Layout horizontal com tamanhos maiores */
  .product-information__media,
  media-gallery.media-gallery--carousel {
    display: flex !important;
    flex-direction: row !important;
    max-width: 800px !important;
    max-height: 600px !important;
    gap: 20px !important;
    align-items: flex-start !important;
    width: 100% !important;
  }
  
  /* Container da imagem principal - lado direito - MAIOR */
  .product-media-container,
  slideshow-component,
  slideshow-container {
    flex: 1 !important;
    max-width: 600px !important;
    max-height: 600px !important;
    min-width: 500px !important;
    min-height: 500px !important;
    order: 2 !important;
  }
  
  /* Imagem principal - TAMANHO MAIOR */
  .product-media__image {
    width: 100% !important;
    height: auto !important;
    max-width: 600px !important;
    max-height: 600px !important;
    min-width: 500px !important;
    min-height: 400px !important;
    object-fit: contain !important;
    border-radius: 8px !important;
  }
  
  /* Container dos thumbnails - lado esquerdo - MAIOR */
  .media-gallery__thumbnails,
  .thumbnail-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
    max-width: 150px !important;
    min-width: 130px !important;
    order: 1 !important;
    overflow-y: auto !important;
    max-height: 600px !important;
  }
  
  /* Thumbnails individuais - MAIORES */
  .media-gallery__thumbnail,
  .thumbnail-item {
    width: 130px !important;
    height: 130px !important;
    border: 3px solid transparent !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: border-color 0.2s ease !important;
  }
  
  /* Thumbnail ativo */
  .media-gallery__thumbnail.is-active,
  .media-gallery__thumbnail:hover {
    border-color: #ff69b4 !important;
  }
  
  /* Imagens dos thumbnails */
  .media-gallery__thumbnail img,
  .thumbnail-item img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 6px !important;
  }
  
  /* Esconder controles de navegação do slideshow no desktop */
  .slideshow__controls,
  .slideshow-navigation,
  .media-gallery__mobile-controls {
    display: none !important;
  }
  
  /* Forçar apenas uma imagem visível por vez */
  slideshow-slide {
    display: none !important;
  }
  
  slideshow-slide[aria-hidden="false"],
  slideshow-slide.is-active {
    display: block !important;
  }
}

/* CORREÇÃO TOTAL PARA MOBILE - SEÇÃO COMPLETA DO PRODUTO */
@media screen and (max-width: 768px) and (orientation: portrait), 
       screen and (max-width: 768px) and (orientation: landscape) {
  /* Container principal da galeria */
  .product-information__media[data-testid="product-information-media"] {
    width: 100% !important;
    padding: 10px !important;
  }
  
  /* Media gallery carousel */
  media-gallery.media-gallery--carousel {
    width: 100% !important;
    padding: 0 !important;
  }
  
  /* Slideshow component */
  slideshow-component {
    width: 100% !important;
  }
  
  /* Slideshow container */
  slideshow-container {
    width: 100% !important;
  }
  
  /* Slides individuais */
  slideshow-slide {
    width: 100% !important;
    padding: 10px !important;
  }
  
  /* Container da mídia do produto */
  .product-media-container {
    width: 100% !important;
    height: auto !important;
    min-height: 300px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }
  
  /* Div product-media */
  .product-media {
    width: 100% !important;
    height: auto !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }
  
  /* IMAGEM PRINCIPAL - PROPORÇÕES MAIORES IGUAL EXEMPLO */
  .product-media__image,
  slideshow-slide .product-media__image,
  .product-media .product-media__image,
  img[src*="IMAGENSECOMMCAKE"],
  img[alt*="KIT FRAN CHILLICAKE"] {
    width: 95% !important;
    height: auto !important;
    max-width: 95% !important;
    min-width: 95% !important;
    min-height: 400px !important;
    max-height: 500px !important;
    object-fit: contain !important;
    display: block !important;
    margin: 10px auto !important;
    padding: 5px !important;
    border-radius: 8px !important;
    transform: none !important;
    zoom: 1 !important;
    scale: 1 !important;
    position: relative !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
  }
  
  /* FORÇAR CONTAINERS DA IMAGEM NO MOBILE - MAIS ESPAÇO */
  .product-media-container,
  slideshow-slide,
  .product-media {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    text-align: center !important;
    padding: 5px !important;
    min-height: 400px !important;
  }
  
  /* FORÇAR SLIDE ATIVO */
  slideshow-slide[aria-hidden="false"],
  slideshow-slide[aria-hidden="false"] .product-media__image,
  slideshow-slide[aria-hidden="false"] .product-media {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 0 auto !important;
  }
  
  /* FORÇAR GALERIA PRINCIPAL NO MOBILE */
  media-gallery.media-gallery--carousel {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    padding: 15px !important;
    background: transparent !important;
  }
  
  /* RESETAR LIMITAÇÕES DO DESKTOP NO MOBILE */
  .product-media-container {
    max-width: none !important;
    max-height: none !important;
  }
  
  /* Slideshow slides container */
  slideshow-slides {
    width: 100% !important;
  }
  
  /* Corrigir controles mobile da galeria */
  .media-gallery__mobile-controls {
    width: 100% !important;
    margin-top: 10px !important;
  }
  
  /* FORÇAR CENTRALIZAÇÃO DA DESCRIÇÃO NO MOBILE - MAIS AGRESSIVO */
  .accordion .details-content,
  .accordion .details-content *,
  .accordion .details-content p,
  .accordion .details-content span,
  .accordion .details-content div,
  .details-content,
  .details-content *,
  .details-content p,
  .details-content span,
  .details-content div,
  rte-formatter,
  rte-formatter *,
  rte-formatter p,
  .rte-formatter,
  .rte-formatter *,
  .rte-formatter p,
  .text-block,
  .text-block *,
  .text-block p {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    justify-content: center !important;
    align-items: center !important;
  }
  
  /* FORÇAR ESPECIFICAMENTE NO ACORDEÃO DA DESCRIÇÃO */
  .accordion--AOGpsNUZOZUpqRjVsV__accordion_bPJhR7,
  .accordion--AOGpsNUZOZUpqRjVsV__accordion_bPJhR7 *,
  .accordion--AOGpsNUZOZUpqRjVsV__accordion_bPJhR7 .details-content,
  .accordion--AOGpsNUZOZUpqRjVsV__accordion_bPJhR7 .details-content *,
  .accordion--AOGpsNUZOZUpqRjVsV__accordion_bPJhR7 p {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;
    width: 100% !important;
  }
  
  /* FORÇAR TODOS OS PARÁGRAFOS NO MOBILE */
  p {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  
  /* CENTRALIZAR TODA A SEÇÃO DO PRODUTO NO MOBILE */
  .product-information.section {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    padding: 0 10px !important;
  }
  
  /* GRID DO PRODUTO - LAYOUT VERTICAL NO MOBILE */
  .product-information__grid {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  
  /* SEÇÃO DA IMAGEM - CENTRALIZADA E NO MEIO - FORÇAR MOBILE */
  .product-information__media[data-testid="product-information-media"] {
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    order: 1 !important;
    margin: 20px 0 !important;
    background: transparent !important;
  }
  
  /* SEÇÃO DOS DETALHES - ABAIXO DA IMAGEM */
  .product-details[data-testid="product-information-details"] {
    width: 100% !important;
    max-width: 100% !important;
    order: 2 !important;
    text-align: center !important;
  }
  
  /* CENTRALIZAR TODOS OS ELEMENTOS DOS DETALHES */
  .product-details .group-block,
  .product-details .group-block-content,
  .product-details .text-block,
  .product-details h1,
  .product-details .buy-buttons-block {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }
  
  /* CENTRALIZAR TEXTO DO BOTÃO "ADICIONAR AO CARRINHO" */
  .add-to-cart-button,
  .button,
  .add-to-cart-text,
  .add-to-cart-text__content {
    text-align: center !important;
    justify-content: center !important;
    align-items: center !important;
    display: flex !important;
  }
  
  /* REMOVER SETAS DOS ACORDEÕES NO MOBILE */
  .accordion .details__header .icon-caret,
  .accordion .details__header .icon-plus,
  .accordion .details__header .svg-wrapper {
    display: none !important;
  }
  
  /* CENTRALIZAR HEADERS DOS ACORDEÕES */
  .accordion .details__header {
    text-align: center !important;
    justify-content: center !important;
    display: flex !important;
  }
  
  /* CORRIGIR ANNOUNCEMENT BAR QUE VIROU QUADRADO PRETO */
  announcement-bar-component,
  .announcement-bar__slider,
  .announcement-bar__slides,
  .announcement-bar__slide {
    background: transparent !important;
    background-color: transparent !important;
    width: 100% !important;
    height: auto !important;
    max-height: 50px !important;
    min-height: auto !important;
    display: block !important;
    position: relative !important;
    overflow: visible !important;
  }
  
  /* CORRIGIR TEXTO DO ANNOUNCEMENT BAR */
  .announcement-bar__text {
    color: white !important;
    background: transparent !important;
    font-size: 12px !important;
    text-align: center !important;
    padding: 10px !important;
    margin: 0 !important;
    display: block !important;
  }
  
  /* REMOVER QUALQUER BACKGROUND ESCURO */
  .announcement-bar__link {
    background: transparent !important;
    background-color: transparent !important;
  }
  
  /* DESABILITAR BOTÃO X DE FECHAR NA VERSÃO MOBILE */
  .predictive-search__close-modal-button {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  
  /* CORRIGIR CARRINHO MOBILE - MOSTRAR DETALHES DO PRODUTO */
  cart-drawer-component,
  .cart-drawer,
  .drawer,
  [id*="cart-drawer"],
  [class*="cart-drawer"] {
    width: 100% !important;
    max-width: 100% !important;
    background: white !important;
  }
  
  /* FORÇAR EXIBIÇÃO DOS DETALHES DO PRODUTO NO CARRINHO MOBILE */
  .cart-item,
  .cart-drawer__item,
  .drawer__item,
  [class*="cart-item"] {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    padding: 15px !important;
    border-bottom: 1px solid #eee !important;
  }
  
  /* TÍTULO DO PRODUTO NO CARRINHO */
  .cart-item__title,
  .cart-item__name,
  .product-title,
  .cart-drawer__item-title,
  [class*="cart-item"] h3,
  [class*="cart-item"] .title {
    display: block !important;
    font-size: 14px !important;
    font-weight: bold !important;
    color: #333 !important;
    margin-bottom: 8px !important;
    line-height: 1.3 !important;
  }
  
  /* PREÇO DO PRODUTO NO CARRINHO */
  .cart-item__price,
  .cart-item__total,
  .product-price,
  .cart-drawer__item-price,
  [class*="cart-item"] .price {
    display: block !important;
    font-size: 16px !important;
    font-weight: bold !important;
    color: #000 !important;
    margin-bottom: 10px !important;
  }
  
  /* CONTROLES DE QUANTIDADE NO CARRINHO */
  .cart-item__quantity,
  .quantity-selector,
  .cart-drawer__quantity,
  [class*="cart-item"] .quantity {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 10px 0 !important;
  }
  
  /* BOTÕES DE QUANTIDADE */
  .quantity-button,
  .quantity-plus,
  .quantity-minus,
  [class*="quantity"] button {
    width: 30px !important;
    height: 30px !important;
    border: 1px solid #ddd !important;
    background: white !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  
  /* INPUT DE QUANTIDADE */
  .quantity-input,
  [class*="quantity"] input {
    width: 50px !important;
    height: 30px !important;
    text-align: center !important;
    border: 1px solid #ddd !important;
    font-size: 14px !important;
  }
  
  /* IMAGEM DO PRODUTO NO CARRINHO - FORÇAR FORMATO QUADRADO */
  .cart-item__image,
  .cart-drawer__item-image,
  [class*="cart-item"] img {
    width: 100px !important;
    height: 100px !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 8px !important;
    margin-bottom: 10px !important;
    background: white !important;
    padding: 0 !important;
    border: 1px solid #ddd !important;
    aspect-ratio: 1/1 !important;
  }
  
  /* FORÇAR IMAGEM PRINCIPAL DO PRODUTO NO CARRINHO - FORMATO CORRETO */
  .cart-item img[src*="IMAGENSECOMMCAKE"],
  .cart-drawer img[src*="IMAGENSECOMMCAKE"],
  [class*="cart-item"] img[alt*="KIT FRAN CHILLICAKE"],
  [class*="cart-item"] img[alt*="Kit Fran ChilliCake"],
  .cart-item img,
  .cart-drawer img,
  [class*="cart"] img {
    width: 100px !important;
    height: 100px !important;
    min-width: 100px !important;
    min-height: 100px !important;
    max-width: 100px !important;
    max-height: 100px !important;
    object-fit: cover !important;
    object-position: center center !important;
    background: white !important;
    padding: 0 !important;
    border: 1px solid #ddd !important;
    border-radius: 8px !important;
    aspect-ratio: 1/1 !important;
    display: block !important;
  }
  
  /* FORÇAR CONTAINER DA IMAGEM NO CARRINHO */
  .cart-item__image-wrapper,
  .cart-drawer__image-wrapper,
  [class*="cart-item"] .image-wrapper,
  [class*="cart-item"] picture {
    width: 100px !important;
    height: 100px !important;
    min-width: 100px !important;
    min-height: 100px !important;
    max-width: 100px !important;
    max-height: 100px !important;
    overflow: hidden !important;
    border-radius: 8px !important;
    aspect-ratio: 1/1 !important;
    display: block !important;
  }
  
  /* BOTÃO REMOVER DO CARRINHO */
  .cart-item__remove,
  .remove-button,
  [class*="cart-item"] .remove {
    background: transparent !important;
    border: none !important;
    color: #999 !important;
    font-size: 12px !important;
    text-decoration: underline !important;
    margin-top: 5px !important;
  }
  
  /* TOTAL DO CARRINHO */
  .cart-total,
  .cart-drawer__total,
  .drawer__total {
    padding: 20px 15px !important;
    border-top: 2px solid #000 !important;
    background: white !important;
  }
  
  /* BOTÃO FINALIZAR COMPRA */
  .cart-checkout-button,
  .checkout-button,
  [class*="checkout"] button {
    width: 100% !important;
    padding: 15px !important;
    background: #000 !important;
    color: white !important;
    border: none !important;
    font-size: 16px !important;
    font-weight: bold !important;
    margin-top: 15px !important;
  }
}

/* Corrigir possíveis problemas com botões */
button,
.button {
  display: inline-block;
  position: relative;
}

/* Garantir que links funcionem */
a {
  display: inline;
  position: relative;
}

/* CORRIGIR SEÇÃO "CONHEÇA A COLEÇÃO" - LAYOUT HORIZONTAL */
.resource-list,
.resource-list__carousel {
  width: 100% !important;
  display: block !important;
}

/* SLIDESHOW DA COLEÇÃO - MOSTRAR MÚLTIPLOS PRODUTOS */
.resource-list slideshow-component,
.resource-list slideshow-container,
.resource-list slideshow-slides {
  width: 100% !important;
  display: flex !important;
}

/* SLIDES INDIVIDUAIS DA COLEÇÃO */
.resource-list__slide,
.resource-list slideshow-slide {
  width: auto !important;
  min-width: 280px !important;
  max-width: 300px !important;
  flex: 0 0 auto !important;
  margin-right: 15px !important;
  display: block !important;
}

/* AJUSTES SIMPLES PARA PRODUTOS DA COLEÇÃO */
.resource-list slideshow-slide[aria-hidden="true"] {
  display: block;
  opacity: 1;
  visibility: visible;
}

.resource-list__item {
  width: 100%;
  display: block;
}

.resource-list .product-card {
  width: 100%;
  display: block;
}

/* LAYOUT HORIZONTAL PARA DESKTOP - ABORDAGEM SIMPLES */
@media screen and (min-width: 769px) {
  /* CENTRALIZAR A SEÇÃO */
  .resource-list,
  .resource-list__carousel {
    max-width: 1200px;
    margin: 0 auto;
    text-align: center;
  }
  
  /* SLIDESHOW MAIS LARGO */
  .resource-list slideshow-slides {
    display: flex;
    justify-content: center;
    gap: 15px;
    padding: 0 20px;
  }
  
  /* PRODUTOS VISÍVEIS */
  .resource-list slideshow-slide {
    flex: 0 0 auto;
    width: 280px;
    margin-right: 15px;
  }
  
  /* MOSTRAR MAIS PRODUTOS */
  .resource-list slideshow-slide[aria-hidden="true"] {
    display: block;
    opacity: 1;
    visibility: visible;
  }
  
  /* CENTRALIZAR IMAGENS DOS PRODUTOS NAS MOLDURAS */
  .resource-list .product-media__image {
    object-fit: contain !important;
    object-position: center center !important;
    width: 100% !important;
    height: 100% !important;
  }
  
  .resource-list .product-media {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }
  
  .resource-list .card-gallery {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }
  
  /* REMOVER NOMES E PREÇOS DUPLICADOS */
  .resource-list .product-grid-view-zoom-out--details {
    display: none !important;
  }
  
  /* REMOVER TEXTO DUPLICADO NOS PRODUCT CARD LINKS */
  .resource-list .product-card__link .visually-hidden {
    display: none !important;
  }
  
  .resource-list .product-card__link {
    cursor: default !important;
  }
  
  /* REMOVER APENAS AS DUPLICATAS - MANTER UMA VERSÃO */
  .resource-list .product-grid-view-zoom-out--details {
    display: none !important;
  }
  
  /* MANTER O GROUP-BLOCK PRINCIPAL COM NOME E PREÇO */
  .resource-list .group-block {
    display: block !important;
  }
  
  .resource-list .group-block .text-block {
    display: block !important;
    text-align: center !important;
    margin-bottom: 8px !important;
  }
  
  .resource-list .group-block product-price {
    display: block !important;
    text-align: center !important;
  }
}

/* LAYOUT PARA MOBILE */
@media screen and (max-width: 768px) {
  .resource-list slideshow-slides {
    display: flex !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    gap: 10px !important;
  }
  
  .resource-list__slide {
    flex: 0 0 250px !important;
    width: 250px !important;
    scroll-snap-align: start !important;
  }
}

/* Corrigir possíveis problemas com containers */
.container,
.wrapper,
.section {
  display: block;
  position: relative;
}