/* Botão fica no bloco de preço, ao lado do "Tabela de medidas": inline, largura do conteúdo. */
.sunbali-provador { display: inline-block; margin: 8px 12px 8px 0; vertical-align: middle; }
.sunbali-provador__botao { white-space: nowrap; }
.sunbali-provador--pagina { display: block; margin: 0; }
.sunbali-provador--pagina .sunbali-provador__iframe { width: 100%; border: 0; display: block; }

/* Modal. Seletores com duas classes para vencer o tema (Codazon define
   .modal-popup .modal-inner-wrap { width: 40% } depois deste arquivo). */
.modal-popup.sunbali-provador__popup .modal-inner-wrap {
    width: 92%;
    max-width: 1200px;
    left: 0;
    right: 0;
    margin: 2rem auto;
    overflow: hidden;            /* evita o estouro horizontal que cortava o conteúdo */
    box-sizing: border-box;
}
.modal-popup.sunbali-provador__popup .modal-header { padding: 1.4rem 5rem 1rem 2rem; }
/* Codazon põe o botão de fechar 40px fora da borda direita; o foco nele rola o
   conteúdo 40px para a esquerda e corta a borda. Mesma correção que o Buzz_TableSize usa. */
.modal-popup.sunbali-provador__popup .modal-inner-wrap .modal-header .action-close { right: 0; top: 0; }
.modal-popup.sunbali-provador__popup .modal-content { padding: 0; overflow: hidden; }
.modal-popup.sunbali-provador__popup .sunbali-provador__iframe {
    width: 100%;
    border: 0;
    display: block;
    background: #fbf7f2;
    height: calc(100vh - 170px) !important;   /* cabe na janela; o provador rola por dentro */
    min-height: 480px;
}

/* Tema Hyvä: modal próprio (Alpine), sem o widget jQuery do Magento. */
.sunbali-provador--hyva { display: block; margin: 8px 0 0; }
.sunbali-provador__overlay { position: fixed; inset: 0; z-index: 1000; background: rgba(0, 0, 0, .55);
    display: flex; align-items: center; justify-content: center; padding: 16px; }
.sunbali-provador__janela { background: #fff; width: min(1200px, 96vw); height: min(92vh, 900px);
    border-radius: 12px; display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 20px 60px rgba(0, 0, 0, .35); }
.sunbali-provador__cabecalho { display: flex; justify-content: space-between; align-items: center; gap: 12px;
    padding: 10px 10px 10px 18px; border-bottom: 1px solid #eee; font-weight: 600; font-size: 18px; }
.sunbali-provador__cabecalho button { font-size: 28px; line-height: 1; background: none; border: 0; cursor: pointer; padding: 2px 10px; color: inherit; }
.sunbali-provador--hyva .sunbali-provador__iframe { flex: 1; width: 100%; border: 0; display: block; background: #fbf7f2; min-height: 0; }

/* Celular: Magento troca para modal-slide; ocupa a tela toda. */
@media (max-width: 767px) {
    .sunbali-provador { display: block; margin: 8px 0; }
    .sunbali-provador__botao { width: 100%; }
    .modal-slide.sunbali-provador__popup .modal-inner-wrap,
    .modal-popup.sunbali-provador__popup .modal-inner-wrap { width: 100%; max-width: none; margin: 0; left: 0; }
    .modal-popup.sunbali-provador__popup .sunbali-provador__iframe,
    .modal-slide.sunbali-provador__popup .sunbali-provador__iframe { height: calc(100vh - 70px) !important; min-height: 0; }
    .sunbali-provador__overlay { padding: 0; }
    .sunbali-provador__janela { width: 100vw; height: 100vh; border-radius: 0; }
}
