Códigos HTML Grátis para E-commerce | Rodrigo Alves

Política de Frete

ATENÇÃO COM O ENDEREÇO DE ENTREGA
A loja providenciará o envio dos produtos para o endereço que o cliente solicitar. Portanto, para que não haja empecilhos na entrega de sua encomenda, pedimos atenção no momento de preencher o endereço no qual deseja receber o seu pedido.
PRAZO DE ENTREGA
Todos os pedidos são despachados entre 1 a 2 dias úteis após o pagamento ser aprovado.
O tempo geral estimado de entrega é de 1 a 4 semanas (02 a 20 dias úteis), podendo sofrer variações de acordo com cada estado e cidade. Nosso prazo de entrega máximo é de até 30 dias úteis após o despacho do pedido.
As entregas são feitas pelos Correios ou Transportadora escolhida no pagamento do Pedido.
PREÇO DO FRETE
O custo do nosso Frete é calculado no pagamento do seu pedido.
Fique atento as nossas Ofertas de Frete Grátis!
CÓDIGO DE RASTREIO
A loja envia no seu código de rastreio no e-mail cadastrado no ato da Compra assim que o produto é enviado.
Esse código é tudo que você precisa para acompanhar o seu pedido e todas as movimentações do pacote desde o envio até a entrega.
COMPRA SEGURA
A Loja oferece a você total segurança e Suporte na sua compra.
De segunda à sexta, das 7:00h até as 22:00h, aos sábados das 8:00 até as 13:00h nossa equipe está pronta para sanar qualquer dúvida ou resolver algum problema que porventura venha acontecer através de nossos canais de comunicação.
SAC - e-mail da sua loja
AO REALIZAR UMA COMPRA EM NOSSO SITE O CLIENTE DECLARA ESTAR CIENTE E DE ACORDO COM TUDO QUE ESTÁ DESCRITO ACIMA.
TRIBUTAÇÃO ALFANDEGÁRIA
Toda e qualquer tributação ou cobrança feita em alguma compra internacional é pago pela nossa loja.

<!DOCTYPE html>

<head>

<title>Controle Deslizante Antes e Depois</title>

<style>

/* Estilos básicos de reset */

* {

margin: 0;

padding: 0;

box-sizing: border-box;

}

/* Container principal - isolando do contexto externo */

.comparison-container {

position: relative;

width: 100%;

max-width: 100%; /* Preenche completamente o contêiner pai */

margin: 0 auto;

overflow: hidden;

/* Garante isolamento */

box-sizing: border-box;

contain: layout style;

}

/* Imagem "depois" (fundo) */

.after-image {

position: relative;

width: 100%;

height: auto;

display: block;

}

.after-image img {

display: block;

width: 100%;

height: auto;

}

/* Imagem "antes" (frente com divisor) */

.before-container {

position: absolute;

top: 0;

left: 0;

width: 50%; /* Começa em 50% */

height: 100%;

overflow: hidden;

}

.before-container img {

display: block;

width: 200%; /* Importante: dobro da largura para compensar o container de 50% */

height: 100%;

object-fit: cover;

object-position: left;

}

/* Divisor/Handle */

.slider-divider {

position: absolute;

top: 0;

left: 50%; /* Começa em 50% */

width: 4px;

height: 100%;

background-color: white;

cursor: ew-resize;

z-index: 10;

box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);

}

/* Botão circular no divisor */

.slider-button {

position: absolute;

top: 50%;

left: 50%;

transform: translate(-50%, -50%);

width: 40px;

height: 40px;

border-radius: 50%;

background-color: white;

box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);

z-index: 11;

cursor: ew-resize;

display: flex;

justify-content: center;

align-items: center;

}

/* Setas no botão */

.slider-button::before,

.slider-button::after {

content: '';

position: absolute;

width: 10px;

height: 2px;

background-color: #333;

}

.slider-button::before {

transform: rotate(45deg);

left: 10px;

}

.slider-button::after {

transform: rotate(-45deg);

right: 10px;

}

/* Etiquetas "antes" e "depois" */

.label {

position: absolute;

bottom: 20px;

background-color: rgba(0, 0, 0, 0.7);

color: white;

padding: 5px 10px;

border-radius: 4px;

font-family: Arial, sans-serif;

font-size: 14px;

font-weight: bold;

z-index: 9;

}

.before-label {

left: 10px;

}

.after-label {

right: 10px;

}

/* Responsivo para dispositivos móveis */

@media (max-width: 767px) {

.slider-button {

width: 30px;

height: 30px;

}

.label {

font-size: 12px;

padding: 4px 8px;

}

</style>

</head>

<body>

</div>

</div>

</div>

<div class="label before-label">ANTES</div>

<div class="label after-label">DEPOIS</div>

</div>

document.addEventListener('DOMContentLoaded', function() {

// Função para inicializar o slider (podemos chamá-la múltiplas vezes)

function initBeforeAfterSlider(containerId) {

// Use um seletor específico ou um ID se fornecido

const container = containerId ? document.getElementById(containerId) : document.querySelector('.comparison-container');

if (!container) return; // Sai se o container não for encontrado

// Elementos DOM

const beforeContainer = container.querySelector('.before-container');

const sliderDivider = container.querySelector('.slider-divider');

const beforeImage = beforeContainer.querySelector('img');

// Função para atualizar a posição do slider

function updateSliderPosition(clientX) {

// Obtém as dimensões do container

const rect = container.getBoundingClientRect();

// Calcula a posição do mouse relativa ao container (em percentagem)

let position = (clientX - rect.left) / rect.width;

// Limita entre 0 e 1 (0% e 100%)

position = Math.max(0, Math.min(1, position));

// Converte para percentagem

const percentPosition = position * 100;

// Atualiza a posição do divisor e do container "antes"

sliderDivider.style.left = `${percentPosition}%`;

beforeContainer.style.width = `${percentPosition}%`;

// Ajusta a posição da imagem "antes" para compensar

const scale = 100 / percentPosition;

// Só ajusta se a largura for maior que zero (evita divisão por zero)

if (percentPosition > 0) {

beforeImage.style.width = `${scale * 100}%`;

beforeImage.style.objectPosition = 'left';

}

// Flag para verificar se está arrastando

let isDragging = false;

// ID para identificar exclusivamente este slider

const sliderId = containerId || 'slider-' + Math.random().toString(36).substring(2, 9);

// Função para iniciar o arrasto

const startDrag = function(e) {

e.preventDefault();

isDragging = sliderId; // Guarda o ID do slider atual

};

// Função para finalizar o arrasto

const endDrag = function() {

if (isDragging === sliderId) {

isDragging = false;

}

};

// Função para mover o slider durante o arrasto

const moveSlider = function(clientX) {

if (isDragging !== sliderId) return;

updateSliderPosition(clientX);

};

// Eventos de mouse

sliderDivider.addEventListener('mousedown', startDrag);

document.addEventListener('mousemove', function(e) {

moveSlider(e.clientX);

});

document.addEventListener('mouseup', endDrag);

// Eventos de toque (mobile)

sliderDivider.addEventListener('touchstart', function(e) {

startDrag(e);

});

document.addEventListener('touchmove', function(e) {

if (isDragging !== sliderId) return;

// Usa a posição do primeiro toque

moveSlider(e.touches[0].clientX);

});

document.addEventListener('touchend', endDrag);

document.addEventListener('touchcancel', endDrag);

// Clique direto no container

container.addEventListener('click', function(e) {

updateSliderPosition(e.clientX);

});

// Inicializa a posição para 50%

setTimeout(function() {

updateSliderPosition(container.getBoundingClientRect().left + container.offsetWidth / 2);

}, 200);

// Re-inicializa quando todos os recursos carregarem

window.addEventListener('load', function() {

updateSliderPosition(container.getBoundingClientRect().left + container.offsetWidth / 2);

});

// Ajusta quando a janela é redimensionada

window.addEventListener('resize', function() {

updateSliderPosition(container.getBoundingClientRect().left + container.offsetWidth / 2);

});

return {

update: function() {

updateSliderPosition(container.getBoundingClientRect().left + container.offsetWidth / 2);

}

};

}

// Inicializa todos os sliders na página

document.querySelectorAll('.comparison-container').forEach(function(container, index) {

container.id = container.id || 'comparison-' + index;

initBeforeAfterSlider(container.id);

});

// Re-inicializa após um pequeno atraso (para garantir que tudo foi renderizado)

setTimeout(function() {

document.querySelectorAll('.comparison-container').forEach(function(container) {

initBeforeAfterSlider(container.id);

});

}, 500);

});

</script>

</body>

</html>

<!DOCTYPE html>
<html>
<head>
<title>Calculadora de Estimativa de Entrega</title>
<style>
#estimator-container {
margin-top: 10px;
padding: 15px;
border: 1px #dadada;
border-radius: 5px;
background-color: #dadada;
display: flex;
justify-content: center;
align-items: center;
gap: 10px;
flex-direction: row;
}

@media screen and (max-width: 600px) {
#estimator-container {
flex-direction: column;
}
}

.cep-input {
padding: 8px;
border: 1px solid #ccc;
border-radius: 3px;
background-color: #fff;
width: 45%;
}

@media screen and (max-width: 600px) {
.cep-input {
width: 100%;
}
}

.calcular-button {
background-color: #00A341;
color: #fff;
border: 1px solid #00A341;
padding: 8px 15px;
border-radius: 3px;
cursor: pointer;
width: 45%;
text-align: center;
display: inline-block;
transition: background-color 0.3s, transform 0.2s;
}

@media screen and (max-width: 600px) {
.calcular-button {
width: 100%;
}
}

.calcular-button:hover {
background-color: #007f2d;
transform: scale(1.05);
}

.estimativa-result {
margin-top: 10px;
font-weight: bold;
}
/* Estilo para o container do resultado */
#result-container {
margin-top: 10px;
padding: 15px;
border: 1px #dadada;
border-radius: 5px;
background-color: #f9f9f9;
}
</style>
</head>
<body>
<div id="estimator-container">
<label for="cep">CEP:</label>
<input type="text" id="cep" placeholder="12345-678" class="cep-input">
<button onclick="calcularEstimativa()" class="calcular-button">Calcular Entrega</button>
</div>
<div id="result-container">
<p id="result" class="estimativa-result"></p>
</div>

function formatDate(date) {
var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
return date.toLocaleDateString('pt-BR', options);
}
</script>
</body>
</html>

Carregando...

</div>

</div>

// Função imediatamente invocada para isolar o escopo

(function() {

// Configuração

var valorMinimo = 350.00;

// Função para obter elementos DOM

function obterElementos() {

return {

container: document.getElementById('sistema-frete-gratis'),

texto: document.getElementById('texto-frete-gratis'),

barraAzul: document.getElementById('barra-azul'),

barraVerde: document.getElementById('barra-verde')

};

}

// Função para obter o valor do carrinho

function obterValorDoCarrinho() {

try {

var elementoPreco = document.querySelector('.price.price--end');

if (!elementoPreco) {

console.log('Elemento de preço não encontrado');

return 0;

}

var textoPreco = elementoPreco.textContent.trim();

// Remover símbolos e tratar formato brasileiro

var numeros = textoPreco.replace(/[^\d,\.]/g, '');

if (numeros.indexOf(',') > -1) {

numeros = numeros.replace(/\./g, '').replace(',', '.');

}

var valor = parseFloat(numeros);

return isNaN(valor) ? 0 : valor;

} catch (e) {

console.error('Erro ao obter valor do carrinho:', e);

return 0;

}

// Função para atualizar a barra de progresso

function atualizarBarra(porcentagem, completo) {

var elementos = obterElementos();

if (completo) {

// Quando completo, mostrar apenas a barra verde

elementos.barraVerde.style.width = '100%';

elementos.barraVerde.style.display = 'block';

elementos.barraAzul.style.display = 'none';

} else {

// Quando incompleto, mostrar apenas a barra azul

elementos.barraAzul.style.width = porcentagem + '%';

elementos.barraAzul.style.display = 'block';

elementos.barraVerde.style.display = 'none';

}

// Função principal para atualizar o display

function atualizarFreteGratis() {

var elementos = obterElementos();

var valorCarrinho = obterValorDoCarrinho();

if (valorCarrinho <= 0) {

elementos.container.style.display = 'none';

return;

}

// Exibir o container

elementos.container.style.display = 'block';

// Calcular valores

var valorFalta = Math.max(0, valorMinimo - valorCarrinho);

var porcentagem = Math.min(100, (valorCarrinho / valorMinimo) * 100);

var completo = valorFalta <= 0;

// Atualizar a barra de progresso

atualizarBarra(porcentagem, completo);

// Atualizar o texto

if (completo) {

elementos.texto.innerHTML = '<strong style="color:#4caf50">Parabéns! Você ganhou Frete Grátis!</strong>';

} else {

var valorFormatado = new Intl.NumberFormat('pt-BR', {

style: 'currency',

currency: 'BRL'

}).format(valorFalta);

elementos.texto.innerHTML = 'Adicione mais <strong>' + valorFormatado + '</strong> para obter Frete Grátis!';

}

// Função para teste via console

window.testarFreteGratis = function(valor) {

var elementos = obterElementos();

// Calcular valores

var valorFalta = Math.max(0, valorMinimo - valor);

var porcentagem = Math.min(100, (valor / valorMinimo) * 100);

var completo = valorFalta <= 0;

// Mostrar o container

elementos.container.style.display = 'block';

// Testar com valores fixos para depurar

if (valor === 0) {

// Testar barra azul com 50%

elementos.barraAzul.style.width = '50%';

elementos.barraAzul.style.display = 'block';

elementos.barraVerde.style.display = 'none';

elementos.texto.innerHTML = 'TESTE: Barra azul 50%';

}

else if (valor === 999) {

// Testar barra verde 100%

elementos.barraAzul.style.display = 'none';

elementos.barraVerde.style.width = '100%';

elementos.barraVerde.style.display = 'block';

elementos.texto.innerHTML = 'TESTE: Barra verde 100%';

}

else {

// Modo normal: atualizar a barra de progresso

atualizarBarra(porcentagem, completo);

// Atualizar o texto

if (completo) {

elementos.texto.innerHTML = '<strong style="color:#4caf50">Parabéns! Você ganhou Frete Grátis!</strong>';

} else {

var valorFormatado = new Intl.NumberFormat('pt-BR', {

style: 'currency',

currency: 'BRL'

}).format(valorFalta);

elementos.texto.innerHTML = 'Adicione mais <strong>' + valorFormatado + '</strong> para obter Frete Grátis!';

}

};

// Função para alterar o valor mínimo

window.mudarValorMinimo = function(novoValor) {

if (typeof novoValor === 'number' && novoValor > 0) {

valorMinimo = novoValor;

atualizarFreteGratis();

return true;

}

return false;

};

// Inicializar quando o DOM estiver pronto

function iniciar() {

console.log('Inicializando sistema de frete grátis');

atualizarFreteGratis();

setInterval(atualizarFreteGratis, 2000);

}

// Verificar se o DOM já foi carregado

if (document.readyState === 'loading') {

document.addEventListener('DOMContentLoaded', iniciar);

} else {

// DOM já carregado, iniciar imediatamente

iniciar();

}

})();

</script>

<style>

/* IDs da tabela e botões ajustados para serem únicos */

#tabela-parcelamento-edi-semjuros th {background-color: #ddd;color: black;}

#tabela-parcelamento-edi-semjuros {margin-top: 20px; width: 100%; border-collapse: collapse;}

#tabela-parcelamento-edi-semjuros th, #tabela-parcelamento-edi-semjuros td {border: 1px solid #ddd; padding: 8px; text-align: left; padding-top: 2px; padding-bottom: 2px;}

.juros {font-size: small; font-weight: 100;}

.vezes {font-weight: 900;}

.parcelamento {font-size:16px;}

.toggle-button {background-color: rgba(0, 0, 0, 0); color: black; border: none; cursor: pointer;}

.tabela {display: flex; justify-content: space-between; align-items: center; margin-top: -25px; margin-bottom: -20px;}

@keyframes fade-in {from {opacity: 0;} to {opacity: 1;}}

.fade-in {animation: fade-in 0.5s ease-in-out;}

</style>

document.addEventListener("DOMContentLoaded", function() {

// ATENÇÃO: IDs dos elementos alterados aqui para serem únicos para este bloco

let tabela = document.getElementById("tabela-parcelamento-edi-semjuros");

let botaoExpandir = document.getElementById("expand-button-semjuros");

let botaoOcultar = document.getElementById("hide-button-semjuros");

// Verifica se todos os elementos foram encontrados antes de tentar usá-los

if (tabela && botaoExpandir && botaoOcultar) {

// Inicializa a tabela como escondida ao carregar a página

tabela.style.display = "none";

// Garante que o botão de expandir esteja visível e o de ocultar escondido

botaoExpandir.style.display = "inline-block";

botaoOcultar.style.display = "none";

botaoExpandir.addEventListener("click", function() {

tabela.style.display = "table";

tabela.classList.add("fade-in");

botaoExpandir.style.display = "none";

botaoOcultar.style.display = "inline-block";

});

botaoOcultar.addEventListener("click", function() {

tabela.style.display = "none";

tabela.classList.remove("fade-in");

botaoOcultar.style.display = "none";

botaoExpandir.style.display = "inline-block";

});

}

});

</script>

<div>

<div><p class="parcelamento"><i class="fa fa-plus"></i> Mais opções de parcelamento</p></div>

<button id="expand-button-semjuros" class="toggle-button">Parcelas <i class="fa fa-chevron-down"></i></button>

<button id="hide-button-semjuros" class="toggle-button" style="display: none;">Ocultar <i class="fa fa-chevron-up"></i></button>

</div>

<thead><tr><th>Parcelas</th><th>Valor</th></tr></thead>

<tbody>

<tr><td class="vezes">1x <span class="juros">sem juros</span></td><td>{{ product.price | divided_by: 1 | money }}</td></tr>

<tr><td class="vezes">2x <span class="juros">sem juros</span></td><td>{{ product.price | divided_by: 2 | money }}</td></tr>

<tr><td class="vezes">3x <span class="juros">sem juros</span></td><td>{{ product.price | divided_by: 3 | money }}</td></tr>

<tr><td class="vezes">4x <span class="juros">sem juros</span></td><td>{{ product.price | divided_by: 4 | money }}</td></tr>

<tr><td class="vezes">5x <span class="juros">sem juros</span></td><td>{{ product.price | divided_by: 5 | money }}</td></tr>

<tr><td class="vezes">6x <span class="juros">sem juros</span></td><td>{{ product.price | divided_by: 6 | money }}</td></tr>

<tr><td class="vezes">7x <span class="juros">sem juros</span></td><td>{{ product.price | divided_by: 7 | money }}</td></tr>

<tr><td class="vezes">8x <span class="juros">sem juros</span></td><td>{{ product.price | divided_by: 8 | money }}</td></tr>

<tr><td class="vezes">9x <span class="juros">sem juros</span></td><td>{{ product.price | divided_by: 9 | money }}</td></tr>

<tr><td class="vezes">10x <span class="juros">sem juros</span></td><td>{{ product.price | divided_by: 10 | money }}</td></tr>

<tr><td class="vezes">11x <span class="juros">sem juros</span></td><td>{{ product.price | divided_by: 11 | money }}</td></tr>

<tr><td class="vezes">12x <span class="juros">sem juros</span></td><td>{{ product.price | divided_by: 12 | money }}</td></tr>

</tbody>

</table>

</div>

<div id="before-after-systeme" style="

position: relative;

width: 100%;

margin: 0 auto;

overflow: hidden;

box-sizing: border-box;

">

<div style="

position: relative;

width: 100%;

height: auto;

display: block;

">

<img src="https://via.placeholder.com/800x500/0288d1/FFFFFF?text=DEPOIS" alt="Depois" style="

display: block;

width: 100%;

height: auto;

">

</div>

<div id="before-container" style="

position: absolute;

top: 0;

left: 0;

width: 50%;

height: 100%;

overflow: hidden;

">

<img id="before-image" src="https://via.placeholder.com/800x500/d32f2f/FFFFFF?text=ANTES" alt="Antes" style="

display: block;

width: 200%;

height: 100%;

object-fit: cover;

object-position: left;

">

</div>

<div id="slider-divider" style="

position: absolute;

top: 0;

left: 50%;

width: 4px;

height: 100%;

background-color: white;

cursor: ew-resize;

z-index: 10;

box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);

">

<div id="slider-button" style="

position: absolute;

top: 50%;

left: 50%;

transform: translate(-50%, -50%);

width: 40px;

height: 40px;

border-radius: 50%;

background-color: white;

box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);

z-index: 11;

cursor: ew-resize;

display: flex;

justify-content: center;

align-items: center;

">

<div style="

position: absolute;

width: 10px;

height: 2px;

background-color: #333;

transform: rotate(45deg);

left: 10px;

"></div>

<div style="

position: absolute;

width: 10px;

height: 2px;

background-color: #333;

transform: rotate(-45deg);

right: 10px;

"></div>

</div>

<div style="

position: absolute;

bottom: 20px;

left: 10px;

background-color: rgba(0, 0, 0, 0.7);

color: white;

padding: 5px 10px;

border-radius: 4px;

font-family: Arial, sans-serif;

font-size: 14px;

font-weight: bold;

z-index: 9;

">ANTES</div>

<div style="

position: absolute;

bottom: 20px;

right: 10px;

background-color: rgba(0, 0, 0, 0.7);

color: white;

padding: 5px 10px;

border-radius: 4px;

font-family: Arial, sans-serif;

font-size: 14px;

font-weight: bold;

z-index: 9;

">DEPOIS</div>

</div>

// Script para controle do slider em seção dividida

(function() {

// Elementos DOM

const container = document.getElementById('before-after-systeme');

const beforeContainer = document.getElementById('before-container');

const sliderDivider = document.getElementById('slider-divider');

const beforeImage = document.getElementById('before-image');

// Flag para verificar se está arrastando

let isDragging = false;

// Função para atualizar a posição do slider

function updateSliderPosition(clientX) {

// Obtém as dimensões do container

const rect = container.getBoundingClientRect();

// Calcula a posição do mouse relativa ao container (em percentagem)

let position = (clientX - rect.left) / rect.width;

// Limita entre 0 e 1 (0% e 100%)

position = Math.max(0, Math.min(1, position));

// Converte para percentagem

const percentPosition = position * 100;

// Atualiza a posição do divisor e do container "antes"

sliderDivider.style.left = `${percentPosition}%`;

beforeContainer.style.width = `${percentPosition}%`;

// Ajusta a posição da imagem "antes" para compensar

const scale = 100 / percentPosition;

// Só ajusta se a largura for maior que zero (evita divisão por zero)

if (percentPosition > 0) {

beforeImage.style.width = `${scale * 100}%`;

beforeImage.style.objectPosition = 'left';

}

// Eventos de mouse

sliderDivider.addEventListener('mousedown', function(e) {

e.preventDefault();

isDragging = true;

});

document.addEventListener('mousemove', function(e) {

if (!isDragging) return;

updateSliderPosition(e.clientX);

});

document.addEventListener('mouseup', function() {

isDragging = false;

});

// Eventos de toque (mobile)

sliderDivider.addEventListener('touchstart', function(e) {

e.preventDefault();

isDragging = true;

});

document.addEventListener('touchmove', function(e) {

if (!isDragging) return;

// Usa a posição do primeiro toque

updateSliderPosition(e.touches[0].clientX);

});

document.addEventListener('touchend', function() {

isDragging = false;

});

// Clique direto no container

container.addEventListener('click', function(e) {

updateSliderPosition(e.clientX);

});

// Inicializa a posição para 50%

function initializePosition() {

updateSliderPosition(container.getBoundingClientRect().left + container.offsetWidth / 2);

}

// Inicializa com diferentes eventos para garantir que funcione

setTimeout(initializePosition, 200);

window.addEventListener('load', initializePosition);

document.addEventListener('DOMContentLoaded', initializePosition);

window.addEventListener('resize', initializePosition);

})();

</script>

Política de Frete - 2

POLÍTICA DE ENVIO

Esta política de Envio é aplicável para pedidos feitos em nosso site LINK PARA WWW.SUALOJA.COM e é aplicável a todos os pedidos. Esta política tem como objetivo garantir que você esteja totalmente ciente de nossas políticas e procedimentos de envio. Ao fazer um pedido nesta loja, você concorda com as diretrizes aqui contidas.

Quanto custa o frete:

Frete Grátis em todos os pedidos para todo o Brasil

Observação: os prazos estimados de entrega não incluem o tempo de manuseio/produção!

Tempo de entrega = Tempo de manuseio + Tempo de trânsito + Tempo de corte do pedido

Todos os produtos passarão por um processo de produção e separação, portanto haverá um Tempo de Manuseio para eles.

FRETE GRÁTIS:

Tempos de envio: Tempo de manuseio + Tempo de trânsito

Tempo de manuseio: 1-3 dias (segunda a sexta-feira)

Tempo de trânsito: 4-12 dias (segunda a sexta-feira)

Custo de envio: Frete Grátis em todos os pedidos para todo o Brasil

O horário limite para pedidos será às 00:00 (GMT-03:00) Horário Padrão de Brasília

MUDANÇA DE ENDEREÇO:

Não podemos alterar o endereço de entrega depois que o pedido estiver em trânsito. Se você precisar alterar o local de entrega do seu pedido, entre em contato conosco dentro de 24 horas após fazer seu pedido em contato@SUALOJA ou ligue para 21-99999-9999 ou você pode, alternativamente, usar o nosso formulário de CONTATO

Termos de entrega:

Os pedidos geralmente são enviados via CORREIOS DO BRASIL.

MONITORANDO

Assim que seu pedido for enviado, um número de rastreamento será enviado a você por e-mail, permitindo que você o rastreie até que ele seja entregue a você. Rastreie seu pedido simplesmente clicando no botão rastrear seu pedido em nosso site usando a página de rastreamento, ou clique aqui.

Cancelamentos

Se você mudar de ideia antes de receber seu pedido, podemos aceitar cancelamentos a qualquer momento antes que o pedido tenha sido despachado. Se um pedido já tiver sido despachado, consulte nossa LINK PARA POLÍTICA DE REEMBOLSO.

Encomendas danificadas em trânsito

Se você achar que seu pacote foi danificado durante o transporte, rejeite o pacote da transportadora, se possível, e entre em contato com nosso serviço de atendimento ao cliente. Se o pacote foi entregue sem sua presença, entre em contato com o serviço de atendimento ao cliente para as próximas etapas.

CONTATOS:

Nosso Atendimento funciona de segunda a sexta das 8:30h às 18:00h e Sábados das 8:30h às 12:00h.

Telefone: 21-99999-9999

E-mail: contato@SUALOJA

Endereço: Rua início, 01 - Começo, 27670-970 Novo Rio de Janeiro, Brasil

<!DOCTYPE html>

<head>

<title>Calculadora de Estimativa de Entrega - Brasil</title>

<style>

body {

font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, sans-serif;

margin: 0;

padding: 0;

background-color: #ffffff;

}

#estimator-container {

max-width: 100%;

margin: 20px auto;

padding: 20px;

border: 1px solid #000;

border-radius: 0px;

background-color: #fff;

box-shadow: 0 2px 15px rgba(0, 0, 0, 0.08);

}

.form-group {

margin-bottom: 20px;

}

label {

display: block;

margin-bottom: 10px;

font-size: 16px;

font-weight: 500;

color: #000;

}

.cep-input {

width: 100%;

padding: 15px;

border: 1px solid #cccccc;

border-radius: 0px;

font-size: 16px;

transition: border-color 0.2s ease;

box-sizing: border-box;

}

.cep-input:focus {

outline: none;

border-color: #2c6ecb;

box-shadow: 0 0 0 2px rgba(44, 110, 203, 0.2);

}

.calcular-button {

background-color: black;

color: white;

border: none;

padding: 15px 30px;

border-radius: 0px;

cursor: pointer;

width: 100%;

font-size: 16px;

font-weight: 500;

text-transform: uppercase;

letter-spacing: 0.5px;

}

.calcular-button:hover {

background-color: gray;

}

.estimativa-result {

margin-top: 20px;

padding: 20px;

border-radius: 4px;

background-color: #f8f9fa;

display: none;

border: 1px solid #e5e5e5;

}

.estimativa-result.show {

display: block;

animation: fadeIn 0.3s ease-in-out;

}

.error-message {

color: #dc3545;

padding: 15px;

border-radius: 0px;

background-color: #fff5f5;

margin-top: 15px;

display: none;

border: 1px solid #dc3545;

}

@keyframes fadeIn {

from { opacity: 0; transform: translateY(-5px); }

to { opacity: 1; transform: translateY(0); }

}

.delivery-info {

display: flex;

align-items: flex-start;

gap: 15px;

margin: 15px 0;

padding: 10px;

background-color: white;

border-radius: 0px;

border: 1px solid #e5e5e5;

}

.icon {

font-size: 24px;

flex-shrink: 0;

}

.delivery-info strong {

display: block;

margin-bottom: 0px;

font-size: 14px;

color: #333333;

}

.delivery-info div {

font-size: 14px;

line-height: 1.5;

}

@media screen and (min-width: 750px) {

#estimator-container {

max-width: 600px;

}

</style>

</head>

<body>

<label for="cep">Digite seu CEP:</label>

<input

type="text"

id="cep"

class="cep-input"

placeholder="00000-000"

maxlength="9"

autocomplete="postal-code">

</div>

Calcular Entrega

</button>

</div>

// Configurações de frete grátis

const freteGratis = {

habilitado: true, // Ativar/desativar frete grátis

prazoMin: 4, // Prazo mínimo para frete grátis

prazoMax: 12, // Prazo máximo para frete grátis

};

// Faixas de CEP por estado (simplificadas)

const faixasCep = [

// Região Sudeste

{ faixa: "01000-000 a 19999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "São Paulo" },

{ faixa: "20000-000 a 28999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Rio de Janeiro" },

{ faixa: "30000-000 a 39999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Minas Gerais" },

{ faixa: "29000-000 a 29999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Espírito Santo" },

// Região Nordeste

{ faixa: "40000-000 a 48999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Bahia" },

{ faixa: "50000-000 a 56999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Pernambuco" },

{ faixa: "57000-000 a 57999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Alagoas" },

{ faixa: "58000-000 a 58999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Paraíba" },

{ faixa: "59000-000 a 59999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Rio Grande do Norte" },

{ faixa: "60000-000 a 63999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Ceará" },

{ faixa: "64000-000 a 64999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Piauí" },

{ faixa: "65000-000 a 65999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Maranhão" },

{ faixa: "49000-000 a 49999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Sergipe" },

// Região Sul

{ faixa: "80000-000 a 87999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Paraná" },

{ faixa: "88000-000 a 89999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Santa Catarina" },

{ faixa: "90000-000 a 99999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Rio Grande do Sul" },

// Região Centro-Oeste

{ faixa: "70000-000 a 73699-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Distrito Federal" },

{ faixa: "73700-000 a 76799-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Goiás" },

{ faixa: "76800-000 a 77999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Rondônia" },

{ faixa: "78000-000 a 79999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Mato Grosso" },

{ faixa: "79000-000 a 79999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Mato Grosso do Sul" },

// Região Norte

{ faixa: "66000-000 a 66999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Pará" },

{ faixa: "67000-000 a 67999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Amapá" },

{ faixa: "68000-000 a 68999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Amazonas" },

{ faixa: "69000-000 a 69299-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Roraima" },

{ faixa: "69300-000 a 69399-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Acre" },

{ faixa: "69400-000 a 69999-999", prazoMin: 2, prazoMax: 10, valorFrete: "R$ 5,00", regiao: "Tocantins" },

];

// Formata o CEP enquanto o usuário digita

document.getElementById('cep').addEventListener('input', function(e) {

let value = e.target.value.replace(/\D/g, '');

if (value.length > 5) {

value = value.substring(0, 5) + '-' + value.substring(5);

}

e.target.value = value;

});

// Permite calcular ao pressionar Enter

document.getElementById('cep').addEventListener('keypress', function(e) {

if (e.key === 'Enter') {

calcularEstimativa();

}

});

function calcularEstimativa() {

const cepInput = document.getElementById('cep');

const resultElement = document.getElementById('result');

const errorElement = document.getElementById('error-message');

const cep = cepInput.value.replace(/\D/g, '');

// Reset visual states

resultElement.classList.remove('show');

errorElement.style.display = 'none';

if (cep.length !== 8) {

errorElement.textContent = "Por favor, insira um CEP válido com 8 dígitos.";

errorElement.style.display = 'block';

return;

}

let estimativa = faixasCep.find(faixa => {

let [inicio, fim] = faixa.faixa.split(" a ").map(str => parseInt(str.replace(/\D/g, '')));

let cepNumero = parseInt(cep);

return cepNumero >= inicio && cepNumero <= fim;

});

if (!estimativa) {

errorElement.textContent = "Desculpe, não realizamos entregas para este CEP.";

errorElement.style.display = 'block';

return;

}

const dataEntregaMinima = new Date();

const dataEntregaMaxima = new Date();

dataEntregaMinima.setDate(dataEntregaMinima.getDate() + estimativa.prazoMin);

dataEntregaMaxima.setDate(dataEntregaMaxima.getDate() + estimativa.prazoMax);

// Adiciona a opção de frete grátis

const freteGratisInfo = freteGratis.habilitado ? `

<div>

<strong>Frete Grátis:</strong><br>

Entrega estimada entre ${freteGratis.prazoMin} a ${freteGratis.prazoMax} dias úteis.

</div>

` : '';

resultElement.innerHTML = `

<div>

<strong>Região de entrega:</strong><br>

${estimativa.regiao}

</div>

<div>

<strong>Frete Rápido:</strong><br>

Entrega estimada entre ${formatDate(dataEntregaMinima)} até ${formatDate(dataEntregaMaxima)}<br>

Valor: ${estimativa.valorFrete}

</div>

${freteGratisInfo}

`;

resultElement.classList.add('show');

}

function formatDate(date) {

const options = {

weekday: 'long',

year: 'numeric',

month: 'long',

day: 'numeric'

};

return date.toLocaleDateString('pt-BR', options);

}

</script>

</body>

</html>

<style>

#tabela-parcelamento-edi th {background-color: #ddd;color: black;}

#tabela-parcelamento-edi {margin-top: 20px; width: 100%; border-collapse: collapse;}

#tabela-parcelamento-edi th, #tabela-parcelamento-edi td {border: 1px solid #ddd; padding: 8px; text-align: left; padding-top: 2px; padding-bottom: 2px;}

.juros {font-size: small; font-weight: 100;}

.vezes {font-weight: 900;}

.parcelamento {font-size:16px;}

.toggle-button {background-color: rgba(0, 0, 0, 0); color: black; border: none; cursor: pointer;}

.tabela {display: flex; justify-content: space-between; align-items: center; margin-top: -15px; margin-bottom: -10px;}

@keyframes fade-in {from {opacity: 0;} to {opacity: 1;}}

.fade-in {animation: fade-in 0.5s ease-in-out;}

</style>

document.addEventListener("DOMContentLoaded", function() {

let tabela = document.getElementById("tabela-parcelamento-edi");

let botaoExpandir = document.getElementById("expand-button-edi");

let botaoOcultar = document.getElementById("hide-button-edi");

// Verifica se todos os elementos foram encontrados antes de tentar usá-los

if (tabela && botaoExpandir && botaoOcultar) {

// Inicializa a tabela como escondida ao carregar a página

tabela.style.display = "none";

// Garante que o botão de expandir esteja visível e o de ocultar escondido

botaoExpandir.style.display = "inline-block";

botaoOcultar.style.display = "none";

botaoExpandir.addEventListener("click", function() {

tabela.style.display = "table";

tabela.classList.add("fade-in");

botaoExpandir.style.display = "none";

botaoOcultar.style.display = "inline-block";

});

botaoOcultar.addEventListener("click", function() {

tabela.style.display = "none";

tabela.classList.remove("fade-in");

botaoOcultar.style.display = "none";

botaoExpandir.style.display = "inline-block";

});

} else {

// Opcional: Se quiser depurar, pode adicionar um console.log aqui

// console.error("Um ou mais elementos da tabela de parcelamento não foram encontrados.");

}

});

</script>

<div>

<div><p class="parcelamento"><i class="fa fa-plus"></i> Mais opções de parcelamento</p></div>

<button id="expand-button-edi" class="toggle-button">Parcelas <i class="fa fa-chevron-down"></i></button>

<button id="hide-button-edi" class="toggle-button" style="display: none;">Ocultar <i class="fa fa-chevron-up"></i></button>

</div>

<thead><tr><th>Parcelas</th><th>Valor</th></tr></thead>

<tbody>

<tr><td class="vezes">1x <span class="juros">sem juros</span></td><td>{{ product.price | divided_by: 1 | money }}</td></tr>

<tr><td class="vezes">2x <span class="juros">com juros</span></td><td>{{ product.price | divided_by: 2 | times: 1.0764 | money }}*</td></tr>

<tr><td class="vezes">3x <span class="juros">com juros</span></td><td>{{ product.price | divided_by: 3 | times: 1.0925 | money }}*</td></tr>

<tr><td class="vezes">4x <span class="juros">com juros</span></td><td>{{ product.price | divided_by: 4 | times: 1.11 | money }}*</td></tr>

<tr><td class="vezes">5x <span class="juros">com juros</span></td><td>{{ product.price | divided_by: 5 | times: 1.123 | money }}*</td></tr>

<tr><td class="vezes">6x <span class="juros">com juros</span></td><td>{{ product.price | divided_by: 6 | times: 1.137 | money }}*</td></tr>

<tr> <td class="vezes">7x <span class="juros">com juros</span></td><td>{{ product.price | divided_by: 7 | times: 1.148 | money }}*</td></tr>

<tr><td class="vezes">8x <span class="juros">com juros</span></td><td>{{ product.price | divided_by: 8 | times: 1.162 | money }}*</td></tr>

<tr><td class="vezes">9x <span class="juros">com juros</span></td><td>{{ product.price | divided_by: 9 | times: 1.177 | money }}*</td></tr>

<tr><td class="vezes">10x <span class="juros">com juros</span></td><td>{{ product.price | divided_by: 10 | times: 1.187 | money }}*</td></tr>

<tr><td class="vezes">11x <span class="juros">com juros</span></td><td>{{ product.price | divided_by: 11 | times: 1.20 | money }}*</td></tr>

<tr><td class="vezes">12x <span class="juros">com juros</span></td><td>{{ product.price | divided_by: 12 | times: 1.216 | money }}*</td></tr>

</tbody>

</table>

</div>

<style>

/* Reset básico para o slideshow */

.slideshow {

width: 100%;

position: relative;

overflow: hidden;

margin-bottom: 0;

}

/* Container principal do slide */

.slideshow__slide {

width: 100%;

position: relative;

display: flex;

align-items: center;

justify-content: center;

}

/* Container da mídia */

.slideshow__media {

width: 100%;

height: auto;

position: relative;

overflow: hidden;

}

/* Estilos para telas ultrawide (acima de 2560px) */

@media screen and (min-width: 2561px) {

.slideshow__media {

aspect-ratio: 21/9;

max-width: 3840px;

margin: 0 auto;

}

.slideshow__media img {

width: 100%;

height: 100%;

object-fit: cover;

object-position: center;

}

/* Estilos para monitores grandes (1921px a 2560px) */

@media screen and (min-width: 1921px) and (max-width: 2560px) {

.slideshow__media {

aspect-ratio: 16/7;

max-width: 2560px;

margin: 0 auto;

}

.slideshow__media img {

width: 100%;

height: 100%;

object-fit: cover;

object-position: center;

}

/* Estilos para desktop padrão (768px a 1920px) */

@media screen and (min-width: 768px) and (max-width: 1920px) {

.slideshow__media {

aspect-ratio: 16/9;

max-height: 90vh;

}

.slideshow__media img {

width: 100%;

height: 100%;

object-fit: cover;

object-position: center;

}

/* Estilos para mobile */

@media screen and (max-width: 767px) {

.slideshow__media {

aspect-ratio: 9/16;

max-height: 90vh;

}

.slideshow__media img {

width: 100%;

height: 100%;

object-fit: cover;

object-position: center;

}

/* Ajustes para o banner */

.banner--adapt_image {

height: auto !important;

}

/* Remover altura fixa do slide */

.slider__slide {

height: auto !important;

}

/* Ajuste para o conteúdo do banner */

.banner__content {

position: absolute;

z-index: 5;

}

/* Container central para limitar largura em telas muito grandes */

@media screen and (min-width: 1921px) {

.slideshow-wrapper {

max-width: 100%;

margin: 0 auto;

overflow: hidden;

}

/* Estilo para links de slide completos */

.slide-wrapper {

position: relative;

width: 100%;

height: 100%;

display: block;

}

/* Estilos para z-index e controle */

.slideshow__controls {

position: relative;

z-index: 10;

}

/* Garantir que os botões sejam clicáveis */

.button-link {

position: relative;

z-index: 15;

cursor: pointer;

}

.slider-button, .slideshow__autoplay, .slider-counter__link {

z-index: 20;

position: relative;

}

/* Estilo para imagens com link */

.linked-image {

cursor: pointer;

}

</style>

<slideshow-component

class="slider-mobile-gutter{% if section.settings.layout == 'grid' %} page-width{% endif %}{% if section.settings.show_text_below %} mobile-text-below{% endif %}"

role="region"

aria-roledescription="{{ 'sections.slideshow.carousel' | t }}"

aria-label="{{ section.settings.accessibility_info | escape }}"

>

{%- if section.settings.auto_rotate and section.blocks.size > 1 -%}

<button

type="button"

class="slider-button slider-button--prev"

name="previous"

aria-label="{{ 'sections.slideshow.previous_slideshow' | t }}"

aria-controls="Slider-{{ section.id }}"

>

</span>

</button>

{%- if section.settings.slider_visual == 'counter' -%}

<span class="visually-hidden">{{ 'general.slider.of' | t }}</span>

<span class="slider-counter--total">{{ section.blocks.size }}</span>

{%- else -%}

{%- for block in section.blocks -%}

<button

class="slider-counter__link slider-counter__link--{{ section.settings.slider_visual }} link"

aria-label="{{ 'sections.slideshow.load_slide' | t }} {{ forloop.index }} {{ 'general.slider.of' | t }} {{ forloop.length }}"

aria-controls="Slider-{{ section.id }}"

>

{%- if section.settings.slider_visual == 'numbers' -%}

{%- else -%}

{%- endif -%}

</button>

{%- endfor -%}

</div>

{%- endif -%}

</div>

<button

type="button"

class="slider-button slider-button--next"

name="next"

aria-label="{{ 'sections.slideshow.next_slideshow' | t }}"

aria-controls="Slider-{{ section.id }}"

>

</span>

</button>

{%- if section.settings.auto_rotate -%}

<button

type="button"

class="slideshow__autoplay slider-button{% if section.settings.auto_rotate == false %} slideshow__autoplay--paused{% endif %}"

aria-label="{{ 'sections.slideshow.pause_slideshow' | t }}"

>

</span>

</span>

</button>

{%- endif -%}

</div>

{%- endif -%}

<div

class="slideshow banner banner--{{ section.settings.slide_height }} grid grid--1-col slider slider--everywhere{% if section.settings.show_text_below %} banner--mobile-bottom{% endif %}{% if section.blocks.first.settings.image == blank %} slideshow--placeholder{% endif %}{% if settings.animations_reveal_on_scroll %} scroll-trigger animate--fade-in{% endif %}"

id="Slider-{{ section.id }}"

aria-live="polite"

aria-atomic="true"

data-autoplay="{{ section.settings.auto_rotate }}"

data-speed="{{ section.settings.change_slides_speed }}"

style="position: relative; z-index: 1;"

>

{%- for block in section.blocks -%}

<style>

#Slide-{{ section.id }}-{{ forloop.index }} .banner__media::after {

opacity: {{ block.settings.image_overlay_opacity | divided_by: 100.0 }};

}

</style>

<div

class="slideshow__slide grid__item grid--1-col slider__slide"

id="Slide-{{ section.id }}-{{ forloop.index }}"

role="group"

aria-roledescription="{{ 'sections.slideshow.slide' | t }}"

aria-label="{{ forloop.index }} {{ 'general.slider.of' | t }} {{ forloop.length }}"

tabindex="-1"

>

{% comment %} Verificando se esse slide tem um link {% endcomment %}

{% if block.settings.link != blank %}

{% assign has_slide_link = true %}

{% else %}

{% assign has_slide_link = false %}

{% endif %}

{% if has_slide_link %}

{% else %}

{% endif %}

{%- if block.settings.image -%}

<source

srcset="{{ block.settings.image_mobile | image_url: width: 750 }}"

media="(max-width: 767px)"

>

<source

srcset="{{ block.settings.image | image_url: width: 3840 }}"

media="(min-width: 768px)"

>

<img

src="{{ block.settings.image | image_url: width: 3840 }}"

alt="{{ block.settings.image.alt | escape }}"

loading="lazy"

width="{{ block.settings.image.width }}"

height="{{ block.settings.image.height }}"

style="object-fit: cover; width: 100%; height: 100%;"

{% if has_slide_link %}class="linked-image"{% endif %}

>

</picture>

{%- else -%}

{%- assign placeholder_slide = forloop.index | modulo: 2 -%}

{%- if placeholder_slide == 1 -%}

{%- else -%}

{%- endif -%}

</div>

{%- if block.settings.heading != blank -%}

</h2>

{%- endif -%}

{%- if block.settings.subheading != blank -%}

<p>{{ block.settings.subheading }}</p>

</div>

{%- endif -%}

{%- if block.settings.button_label != blank -%}

<a

{% if block.settings.link != blank %}

href="{{ block.settings.link }}"

{% else %}

role="link" aria-disabled="true"

{% endif %}

class="button {% if block.settings.button_style_secondary %}button--secondary{% else %}button--primary{% endif %} button-link"

onclick="event.stopPropagation();"

>

</a>

</div>

{%- endif -%}

</div>

{% if has_slide_link %}

</a>

{% else %}

</div>

{% endif %}

</div>

{%- endfor -%}

</div>

{%- if section.blocks.size > 1 and section.settings.auto_rotate == false -%}

<button

type="button"

class="slider-button slider-button--prev"

name="previous"

aria-label="{{ 'sections.slideshow.previous_slideshow' | t }}"

aria-controls="Slider-{{ section.id }}"

>

</span>

</button>

{%- if section.settings.slider_visual == 'counter' -%}

<span class="visually-hidden">{{ 'general.slider.of' | t }}</span>

<span class="slider-counter--total">{{ section.blocks.size }}</span>

{%- else -%}

{%- for block in section.blocks -%}

<button

class="slider-counter__link slider-counter__link--{{ section.settings.slider_visual }} link"

aria-label="{{ 'sections.slideshow.load_slide' | t }} {{ forloop.index }} {{ 'general.slider.of' | t }} {{ forloop.length }}"

aria-controls="Slider-{{ section.id }}"

>

{%- if section.settings.slider_visual == 'numbers' -%}

{%- else -%}

{%- endif -%}

</button>

{%- endfor -%}

</div>

{%- endif -%}

</div>

<button

type="button"

class="slider-button slider-button--next"

name="next"

aria-label="{{ 'sections.slideshow.next_slideshow' | t }}"

aria-controls="Slider-{{ section.id }}"

>

</span>

</button>

{%- if section.settings.auto_rotate -%}

<button

type="button"

class="slideshow__autoplay slider-button{% if section.settings.auto_rotate == false %} slideshow__autoplay--paused{% endif %}"

aria-label="{{ 'sections.slideshow.pause_slideshow' | t }}"

>

</span>

</span>

</button>

{%- endif -%}

</div>

{%- endif -%}

</slideshow-component>

{%- if request.design_mode -%}

{%- endif -%}

// Script para garantir que os cliques em botões não sejam propagados para o slide

document.addEventListener('DOMContentLoaded', function() {

// Verificar e corrigir o primeiro slide

const firstSlide = document.querySelector('.slider__slide:first-child');

if (firstSlide) {

const slideLink = firstSlide.querySelector('.slide-wrapper');

if (slideLink && slideLink.tagName === 'A') {

slideLink.style.zIndex = '2';

slideLink.style.position = 'relative';

slideLink.style.display = 'block';

}

// Garantir que todos os links de slide estejam funcionando

const allSlideLinks = document.querySelectorAll('.slide-wrapper');

allSlideLinks.forEach(function(link) {

if (link.tagName === 'A') {

link.style.zIndex = '2';

link.style.position = 'relative';

link.style.display = 'block';

// Adicionar classe para depuração visual

link.classList.add('active-slide-link');

}

});

var buttonLinks = document.querySelectorAll('.button-link');

buttonLinks.forEach(function(button) {

button.addEventListener('click', function(e) {

// Se o botão estiver dentro de um slide com link

if (this.closest('.slide-wrapper').tagName === 'A') {

e.preventDefault();

e.stopPropagation();

// Usar o link do slide para navegação

if (this.closest('.slide-wrapper').getAttribute('href')) {

window.location.href = this.closest('.slide-wrapper').getAttribute('href');

}

});

// Impedir que cliques nos controles de navegação ativem os links do slide

var slideControls = document.querySelectorAll('.slider-button, .slider-counter__link, .slideshow__autoplay');

slideControls.forEach(function(control) {

control.addEventListener('click', function(e) {

e.stopPropagation();

});

// Adicionar classe de depuração para verificar se os links estão ativos

document.querySelectorAll('.slider__slide').forEach(function(slide, index) {

slide.classList.add('slide-' + (index + 1));

});

</script>

<style>

/* Estilos adicionais para garantir que os links funcionem */

.active-slide-link {

cursor: pointer !important;

}

/* Fix para o primeiro slide */

.slider__slide:first-child .slide-wrapper[href] {

position: relative !important;

z-index: 2 !important;

display: block !important;

}

</style>

{% schema %}

{

"name": "SlideshowRodrigo",

"tag": "section",

"class": "section",

"disabled_on": {

"groups": ["header", "footer"]

},

"settings": [

{

"type": "select",

"id": "layout",

"options": [

{

"value": "full_bleed",

"label": "Full width"

},

{

"value": "grid",

"label": "Contained"

}

],

"default": "full_bleed",

"label": "Layout"

},

{

"type": "select",

"id": "slide_height",

"options": [

{

"value": "adapt_image",

"label": "Adapt to image"

},

{

"value": "small",

"label": "Small"

},

{

"value": "medium",

"label": "Medium"

},

{

"value": "large",

"label": "Large"

}

],

"default": "medium",

"label": "Slide height"

},

{

"type": "select",

"id": "slider_visual",

"options": [

{

"value": "dots",

"label": "Dots"

},

{

"value": "counter",

"label": "Counter"

},

{

"value": "numbers",

"label": "Numbers"

}

],

"default": "counter",

"label": "Slider navigation"

},

{

"type": "checkbox",

"id": "auto_rotate",

"label": "Auto-rotate slides",

"default": false

},

{

"type": "range",

"id": "change_slides_speed",

"min": 3,

"max": 9,

"step": 2,

"unit": "s",

"label": "Change slides every",

"default": 5

},

{

"type": "header",

"content": "Mobile"

},

{

"type": "checkbox",

"id": "show_text_below",

"label": "Show text below image on mobile",

"default": true

},

{

"type": "header",

"content": "Accessibility"

},

{

"type": "text",

"id": "accessibility_info",

"label": "Accessibility label",

"info": "Describe the slideshow for screen readers.",

"default": "Slideshow about our brand"

}

],

"blocks": [

{

"type": "slide",

"name": "Slide",

"limit": 5,

"settings": [

{

"type": "image_picker",

"id": "image",

"label": "Image (Desktop)"

},

{

"type": "image_picker",

"id": "image_mobile",

"label": "Image (Mobile)"

},

{

"type": "inline_richtext",

"id": "heading",

"default": "Slide heading",

"label": "Heading"

},

{

"type": "select",

"id": "heading_size",

"options": [

{

"value": "h2",

"label": "Small"

},

{

"value": "h1",

"label": "Medium"

},

{

"value": "h0",

"label": "Large"

}

],

"default": "h1",

"label": "Heading size"

},

{

"type": "inline_richtext",

"id": "subheading",

"default": "Slide subheading",

"label": "Subheading"

},

{

"type": "text",

"id": "button_label",

"default": "Button label",

"label": "Button label"

},

{

"type": "url",

"id": "link",

"label": "Slide link"

},

{

"type": "checkbox",

"id": "button_style_secondary",

"label": "Use secondary button style",

"default": false

},

{

"type": "select",

"id": "box_align",

"options": [

{

"value": "top-left",

"label": "Top left"

},

{

"value": "top-center",

"label": "Top center"

},

{

"value": "top-right",

"label": "Top right"

},

{

"value": "middle-left",

"label": "Middle left"

},

{

"value": "middle-center",

"label": "Middle center"

},

{

"value": "middle-right",

"label": "Middle right"

},

{

"value": "bottom-left",

"label": "Bottom left"

},

{

"value": "bottom-center",

"label": "Bottom center"

},

{

"value": "bottom-right",

"label": "Bottom right"

}

],

"default": "middle-center",

"label": "Text alignment"

},

{

"type": "checkbox",

"id": "show_text_box",

"label": "Show text box",

"default": true

},

{

"type": "select",

"id": "text_alignment",

"options": [

{

"value": "left",

"label": "Left"

},

{

"value": "center",

"label": "Center"

},

{

"value": "right",

"label": "Right"

}

],

"default": "center",

"label": "Text alignment"

},

{

"type": "range",

"id": "image_overlay_opacity",

"min": 0,

"max": 100,

"step": 10,

"unit": "%",

"label": "Image overlay opacity",

"default": 0

},

{

"type": "color_scheme",

"id": "color_scheme",

"label": "Color scheme",

"default": "scheme-1"

},

{

"type": "header",

"content": "Mobile"

},

{

"type": "select",

"id": "text_alignment_mobile",

"options": [

{

"value": "left",

"label": "Left"

},

{

"value": "center",

"label": "Center"

},

{

"value": "right",

"label": "Right"

}

],

"default": "center",

"label": "Text alignment (mobile)"

}

]

}

],

"presets": [

{

"name": "Slideshow com Imagens Mobile",

"blocks": [

{

"type": "slide"

},

{

"type": "slide"

}

]

}

]

}

{% endschema %}

Essa Política de Privacidade e Proteção de Dados Pessoais tem o objetivo de informar a você, Titular de Dados Pessoais, sobre como realizamos o Tratamento de seus Dados Pessoais, sobre quais são os seus Direitos e como exercê-los e sobre as medidas de segurança que adotamos o fim de realizar o Tratamento de Dados Pessoais, sendo composto dos seguintes itens:

Informações gerais e definições
Abrangência desta Política de Privacidade
Quais dados pessoais nós tratamos?
Para quais finalidades realizamos o Tratamento de seus Dados Pessoais?
Quais bases legais utilizamos para realizar o Tratamento de Dados Pessoais?
Dados Pessoais de crianças e adolescentes
Com quem compartilhamos seus Dados Pessoais?
Como e por quanto tempo ocorre a retenção de seus Dados Pessoais?
Parâmetros de transferência internacional de dados
Quais os seus direitos e como exercer os seus direitos como Titulares de Dados Pessoais
Medidas de segurança cumpridas
Quais são as leis aplicáveis às operações de Tratamento de Dados?
Disposições Finais
Atualização da Política
1. Informações gerais e definições

Para o entendimento desta política devemos considerar as definições conforme o detalhamento a seguir:

Agentes de Tratamento de Dados Pessoais: Controlador e Operador, abaixo definidos;

Anonimização: utilização de meios técnicos lucrativos e disponíveis no momento do Tratamento, por meio dos quais um dado perde a possibilidade de associação, direta ou indireta, a um indivíduo;

Autoridade Nacional de Proteção de Dados (ANPD): Órgão da administração pública responsável por zelar, implementar e fiscalizar o cumprimento da Lei Geral de Proteção de Dados (LGPD) em todo o território nacional.

Banco de Dados: conjunto estruturado de Dados Pessoais, configurado em um ou em vários locais, em suporte eletrônico ou físico.

Bloqueio: suspensão temporária de qualquer operação de tratamento, mediante guarda do Dado Pessoal ou do Banco de Dados;

Consentimento: manifestação livre, informada e inequívoca sobre qual a Concordância Titular com o Tratamento de seus Dados Pessoais para uma determinada finalidade;

Controlador de Dados: pessoa natural ou jurídica responsável por tomar decisões sobre o Tratamento de Dados Pessoais;

Cookies: arquivos de texto enviados para o navegador do usuário com o objetivo de coletar e armazenar as informações de sua visita, bem como suas preferências, tornando sua navegação mais personalizada e agradável.

Dado Anonimizado: dado sem possibilidade de associação, direta ou indireta, a um indivíduo após a utilização de meios técnicos e disponíveis no momento do tratamento;

Dados Pessoais: informação vinculada ou vinculável a pessoa física identificada ou identificável;

Dados Pessoais Sensíveis: Dado Pessoal sobre origem racial ou étnica, verdade religiosa, opinião política, filiação a sindicato ou a organização de caráter religioso, filosófico ou político, dado referente à saúde ou à vida sexual, dado genético ou biométrico, quando vinculado a uma pessoa natural;

Eliminação: exclusão de dados ou de conjunto de dados armazenados no Banco de Dados, independentemente do procedimento empregado;
Encarregado De Dados: pessoa natural ou jurídica indicada pelo Operador ou Controlador para atuar como canal de comunicação entre o Controlador, os Titulares dos Dados e a Autoridade Nacional de Proteção de Dados (ANPD);

Lei Geral de Proteção de Dados Pessoais (LGPD): Lei Federal nº 13.709, de 14 de agosto de 2018, que dispõe sobre o Tratamento de Dados Pessoais, inclusive nos meios digitais, por pessoa natural ou por pessoa jurídica de direito público ou privado, com o objetivo de proteger os direitos fundamentais de liberdade e de privacidade e o livre desenvolvimento da personalidade da pessoa natural;

Operador: pessoa física ou jurídica que realiza o Tratamento de Dados Pessoais em nome do Controlador;

Plataformas: os sites e aplicativos voltados para os funcionários, parceiros, parceiros de negócios e clientes da NOME DO SITE , com URLs próprios, assim como aqueles voltados para terceiros em geral, inclusive os aplicativos B2C, e-commerce e minisites mantidos em redes sociais de terceiros.

Titular De Dados Pessoais: pessoal natural a quem se refere aos Dados Pessoais objeto de Tratamento;

Tratamento De Dados Pessoais: toda operação realizada com Dados Pessoais, como as que se referem a coleta, produção, recepção, classificação, utilização, acesso, reprodução, transmissão, distribuição, processamento, arquivamento, armazenamento, eliminação, avaliação ou controle da informação, modificação, comunicação, transferência, difusão ou remoção.

Bases Legais: requisitos necessários para o tratamento de Dados Pessoais.

Interesse legítimo: possibilidades mais flexíveis de autorização legal para o tratamento de Dados Pessoais.

2. Abrangência desta Política de Privacidade

Esta Política de Privacidade aplica-se a todos aqueles que possuem dados pessoais tratados pelo NOME DO SITE , por meio físico ou digital, inclusive via Plataformas.

3. Quais dados pessoais nós tratamos?

Os principais Dados Pessoais tratados pelo NOME DO SITE relacionados à sua experiência em nossas Plataformas são: Dados cadastrais e que você nos fornece em nossas Plataformas e Lojas Físicas

Você, como Titular de Dados e cliente do NOME DO SITE , pode optar por realizar um cadastro em nossas Plataformas. Para a realização de cadastro, são solicitados: "Nome Completo”; "CPF”; “Data de Nascimento”; “Gênero”; “Telefone”, “Endereço para entrega de pedidos”.

Dados de pagamento

Dados necessários para efetuar compras através de nossas Plataformas: “Dados Bancários” (inclusive “Dados de Cartão”). Para emissão de boleto, são possíveis as mesmas informações constantes nos dados cadastrais.

Dados que coletamos de forma automática

Coletamos e armazenamos Dados Pessoais com a interação do cliente em nossas Plataformas. Utilizamos Cookies e obtemos informações sobre quando você clica em anúncios, acessa nosso website ou acessa conteúdos e anúncios veiculados por nós em outros sites. Dentre eles, destacamos: cookies; logins; senhas; endereços de IP; registros de acessos e consultas etc. Para saber mais, você pode consultar nossa Política de Cookies, bem como controlar suas preferências utilizando o pop-up da ferramenta Cookie-Script, no canto inferior direito da página de nosso website.

Vendas Whatsapp

Em nossas Plataformas, há a opção de realizar uma consulta com um vendedor sobre eventual compra a ser realizada por você. Para tanto, solicitamos: "Nome” e "Telefone”.

3.1 Como Coletamos os Dados Pessoais do Usuário?

Dados cadastrais: são coletados através das nossas Plataformas (site e aplicativo) e quando você realiza o cadastro em nossas lojas físicas.
Dados de pagamento: são coletados através das nossas Plataformas (site e aplicativo), e quando você realiza uma compra em nossas lojas físicas;
Dados que coletamos de forma automática: são coletados através das nossas Plataformas (site e aplicativo);
Vendas Whatsapp: são coletados através das nossas Plataformas (site e aplicativo);

4. Para quais finalidades realizamos o Tratamento de seus Dados Pessoais?

O Tratamento de seus Dados Pessoais é necessário para que possamos oferecer nossos serviços com excelência a você, usuário, de forma a garantir segurança, rapidez e personalização da sua experiência com nossos produtos. Conheça, agora, algumas das finalidades do Tratamento de seus Dados Pessoais pela NOME DO SITE:

Fornecer os produtos NOME DO SITE, nos termos e qualidade acordados com os clientes, de forma a garantir a melhor experiência possível, seja no ambiente físico ou digital;
Aprimorar nossos serviços e a experiência de nossos clientes, em nossas Plataformas ou lojas físicas, para fins administrativos e de gestão de pessoas e de produtos;
Identificar o perfil, desejos ou necessidades dos usuários, a fim de aprimorar os produtos e/ou serviços oferecidos pela empresa;
Enviar informativos sobre produtos ou serviços que interessem aos seus usuários;
Proteger os seus direitos e os direitos e outros usuários dos serviços NOME DO SITE, bem como os direitos da empresa;
Coordenar a entrega e disponibilização de produtos adquiridos na rede NOME DO SITE;
Enviar informações sobre o status de seus pedidos;
Garantir a troca ou devolução de produtos, conforme estabelece o Código de Defesa do Consumidor;
Realizar análises e pesquisas de mercado;
Para condução de processos seletivos;
Admissão ou demissão de colaboradores;
Garantia da segurança das instalações da NOME DO SITE e proteção à vida;
Divulgar alterações, inovações ou promoções sobre os produtos e serviços da NOME DO SITE e de seus parceiros.
Cumprir obrigações relativas às autoridades competentes.

5. Quais bases legais utilizamos para realizar o Tratamento de Dados Pessoais?

A LGPD exige a vinculação do Tratamento de Dados Pessoais às bases legais por ela admitidas. Cada operação de Tratamento de Dados Pessoais da NOME DO SITE possui base legal adequada em relação à finalidade do tratamento. A seguir, listamos as bases utilizadas para o Tratamento de Dados pela NOME DO SITE:

CUMPRIMENTO DE OBRIGAÇÃO LEGAL OU REGULATÓRIA: Cumprimento das obrigações do ordenamento jurídico para finalidade consumerista, trabalhista, fiscal, dentre outras relacionadas às atividades exercidas pela NOME DO SITE;
CONSENTIMENTO: Manifestação livre, informada e inequívoca pela qual o Titular concorda com o Tratamento de seus Dados Pessoais para uma finalidade determinada;
EXECUÇÃO OU PREPARAÇÃO DE CONTRATOS: Finalidade de executar e/ou gerir contratos de compra e venda, de trabalho e de prestação de serviços em geral com clientes, empregados, parceiros e/ou fornecedores, assim como outros tipos de contratos necessários ao exercício das atividades da NOME DO SITE;
EXERCÍCIO REGULAR DE DIREITOS: Garantia do exercício regular de direitos em processos judiciais, administrativos ou arbitrais;
LEGÍTIMO INTERESSE: Legítimo interesse da empresa ou de terceiros para finalidades legítimas e que considere, a partir de situações concretas, as suas expectativas e o respeito aos seus direitos e liberdades fundamentais.
PROTEÇÃO AO CRÉDITO: Finalidade de conceder ou não crédito ao Titular de Dados Pessoais, bem como de definir seus limites de crédito, por meio da análise de suas informações de adimplemento.

Em qualquer caso, a presente Política de Privacidade está alinhada com os princípios da LGPD, estritamente seguidos durante toda operação de Tratamento de Dados Pessoais feito pela NOME DO SITE, quais sejam:

Finalidade: realização do Tratamento para propósitos legítimos, específicos, explícitos e informados ao Titular, sem possibilidade de Tratamento posterior de forma incompatível com essas finalidades;

Adequação: compatibilidade do Tratamento com as finalidades informadas ao Titular, de acordo com o contexto do Tratamento;

Necessidade: limitação do Tratamento ao mínimo necessário para a realização de suas finalidades, com abrangência dos dados pertinentes, proporcionais e não excessivos em relação às finalidades do Tratamento de dados;

Livre acesso: garantia, aos Titulares, de consulta facilitada e gratuita sobre a forma e a duração do Tratamento, bem como sobre a integralidade de seus Dados Pessoais;

Qualidade dos dados: garantia, aos Titulares, de exatidão, clareza, relevância e atualização dos Dados, de acordo com a necessidade e para o cumprimento da finalidade de seu Tratamento;

Transparência: garantia, aos Titulares, de informações claras, precisas e facilmente acessíveis sobre a realização do Tratamento e sobre os respectivos Agentes de Tratamento, observados os segredos comercial e industrial;

Segurança: utilização de medidas técnicas e administrativas aptas a proteger os Dados Pessoais de acessos não autorizados e de situações acidentais ou ilícitas de destruição, perda, alteração, comunicação ou difusão;

Prevenção: adoção de medidas para prevenir a ocorrência de danos em virtude do Tratamento de Dados Pessoais;

Não discriminação: impossibilidade de realização do Tratamento para fins discriminatórios, ilícitos ou abusivos;

Responsabilização e prestação de contas: demonstração, pela NOME DO SITE, da adoção de medidas eficazes e capazes de comprovar a observância e o cumprimento das normas de proteção de Dados Pessoais e, inclusive, da eficácia dessas medidas, conforme estabelecido por esta Política de Privacidade.

Apenas utilizamos seus Dados Pessoais para as finalidades específicas estabelecidas nessa Política de Privacidade. Esta Política será revisada e atualizada de forma periódica, seja em virtude de novas regulações sobre o Tratamento de Dados ou da atualização de nossas operações de Tratamento e procedimentos internos. A Política de Privacidade atualizada sempre estará disponível em nossas Plataformas para consulta.

6. Dados Pessoais de crianças e adolescentes**

A NOME DO SITE não realiza a venda de produtos para crianças e adolescentes, sendo necessário que os produtos sejam adquiridos por adultos, maiores de 18 anos. Nesse sentido, a fim de efetuar a compra, o menor de idade deve estar sempre acompanhado de seus pais ou responsáveis, não havendo, portanto, o Tratamento de seus Dados Pessoais. Ressalta-se que a NOME DO SITE não se responsabiliza pelo mau uso de suas Plataformas, cabendo aos pais e/ou responsáveis o controle da navegabilidade das crianças e adolescentes.

7. Com quem compartilhamos seus Dados Pessoais?

Seus Dados Pessoais ficam protegidos junto à NOME DO SITE e serão compartilhados apenas quando necessário para:

a. Cumprir solicitação judicial ou administrativa de autoridade competente;

b. Prestação adequada dos serviços da rede NOME DO SITE;

c. Viabilizar negócios e/ou serviços oferecidos pela NOME DO SITE que dependam do repasse de dados a parceiros;

d. Intermediação de pagamentos e transações financeiras com empresas parceiras;

e. Armazenamento de informações em provedores externos;

f. Marketing e Remarketing internos à rede NOME DO SITE;

g. Divulgação.

A NOME DO SITE não comercializa quaisquer informações que possam te identificar. Apenas transferimos seus Dados Pessoais para prestadores de serviços, empresas do mesmo grupo ou autoridades competentes. Em relação ao Tratamento de Dados e informações controladas po terceiros, a NOME DO SITE responsabiliza-se por:

a. Aditar todos os atuais contratos com parceiros e/ou prestadores de serviços, de forma a garantir relações comerciais operacionalizadas apenas com parceiros que mantenham parâmetro adequado de Tratamento de Dados Pessoais;

b. Comprometer-se com a educação e o treinamento continuado de seus funcionários, relativamente à governança de dados e ao uso ético, responsável e legítimo dos Dados Pessoais tratados pela NOME DO SITE.

8. Por quanto tempo ocorre a retenção de seus Dados Pessoais?

A NOME DO SITE apenas conservará seus Dados Pessoais enquanto necessário para dar cumprimento à finalidade para qual foram recolhidos, incluindo para o cumprimento de leis e regulamentos aplicáveis e de ordens judiciais.

9. Parâmetros da transferência internacional de dados

O caráter global da internet pode demandar a transferência de seus Dados Pessoais para outros países. Caso isso ocorra, toda operação de Tratamento de Dados será realizada com base na LGPD e com base em outras legislações nacionais e internacionais pertinentes, mediante responsabilidades das Partes (Controlador e Operador) garantidas em acordos jurídicos, a fim de garantir a segurança de seus Dados Pessoais, conforme mecanismos e salvaguardas de proteção internacional de transferência de dados e de acordo com os termos desta Política.

10. Quais são seus direitos e como exercê-los como Titular de Dados Pessoais

O Titular de Dados terá garantido os seguintes direitos em relação aos Dados Pessoais tratados, em conformidade com a LGPD:

a. Direito de confirmação e acesso;

b. Direito de correção;

c. Direito de Anonimização, Bloqueio ou Eliminação;

d. Direito de portabilidade;

e. Direito de informação;

f. Direito de eliminação (Dados Pessoais tratados com Consentimento);

g. Direito de petição;

h. Revogação do Consentimento;

i. Revisão de decisões automatizadas com base em interesse, ou no perfil da pessoa.

a. Direito de confirmação e acesso: O Titular dos Dados Pessoais tem o direito de confirmar com a NOME DO SITE sobre o Tratamento ou não de seus Dados Pessoais, bem como de confirmar se seus Dados Pessoais Sensíveis são tratados de alguma maneira pela NOME DO SITE. No caso do Tratamento de Dados Pessoais, seu Titular tem o direito de acessá-los, tendo assim pleno conhecimento de quais são seus Dados Pessoais tratados.

b. Direito de correção: É direito do Titular de Dados Pessoais pedir a retificação de seus Dados Pessoais incompletos, inexatos ou desatualizados, tendo a NOME DO SITE a obrigação de retificá-los.

c. Direito de Anonimização, Bloqueio ou Eliminação: o Titular tem o direito de solicitar à NOME DO SITE a Anonimização, Bloqueio ou Eliminação de seus Dados Pessoais desnecessários, excessivos ou tratados em desconformidade à LGPD.

d. Direito de portabilidade: o Titular de Dados Pessoais poderá solicitar a portabilidade de seus Dados Pessoais, por meio de requisição expressa, de acordo com a regulamentação da ANPD e em observância aos segredos comercial e industrial;

e. Direito de informação: O Titular de Dados Pessoais tem direito de ser informado acerca do encaminhamento e compartilhamento de seus Dados Pessoais que são de sua titularidade para outras entidades, sejam estas públicas ou privadas.

f. Retenção de Dados Pessoais e direito de eliminação (Dados Pessoais tratados com Consentimento): A retenção de Dados Pessoais se dá apenas pelo tempo necessário para cumprir o propósito de seu Tratamento. O direito de Eliminação é o direito do Titular de ter seus Dados Pessoais tratados com seu consentimento removidos do Banco de Dados da NOME DO SITE. Esse direito não é absoluto, podendo ser negado total ou parcialmente. A LGPD autoriza a conservação dos Dados Pessoais nas seguintes hipóteses: a) cumprimento de obrigação legal ou regulatória pelo Controlador; b) estudo por órgão de pesquisa, garantida, sempre que possível a Anonimização dos Dados Pessoais; c) transferência a terceiros, desde que respeitados os requisitos de Tratamento de Dados Pessoais; ou d) uso exclusivo do Controlador, vedado seu acesso por terceiro, e desde que Anonimizados os Dados Pessoais.

g. Direito de petição: Nos termos do art. 18, §1º da LGPD, é direito do Titular propor reclamação junto à ANPD, sempre que tiver demanda não solucionada pelo Encarregado da NOME DO SITE ou se sentir lesado em algum dos seus direitos em razão do Tratamento indevido de seus Dados Pessoais.

h. Revogação do Consentimento: Sempre que tecnicamente possível, as Plataformas da NOME DO SITE conterão banners, pop-ups e links de redirecionamento para algum "Formulário de Gestão de Consentimento", através do qual o Titular poderá, da forma mais granularizada possível, customizar os consentimentos cedidos à NOME DO SITE, inclusive exercendo seu direito de revogação a algum Consentimento dado anteriormente.

i. Revisão de decisões automatizadas com base em interesse, ou no perfil da pessoa: o Titular dos Dados tem direito de solicitar a NOME DO SITE a revisão de decisões tomadas unicamente com base em tratamento automatizado de Dados Pessoais que afetem seus interesses, incluídas as decisões destinadas a definir o seu perfil pessoal, profissional, de consumo e de crédito ou os aspectos de sua personalidade.

Você pode exercer seus direitos por meio do endereço de e-mail: E-MAIL DE CONTATO DA SUA LOJA

11. Medidas de segurança cumpridas

Visando garantir a segurança dos Dados Pessoais tratados pelo NOME DO SITE , os Agentes de Tratamento detêm responsabilidades para com o sigilo dos Dados Pessoais fornecidos pelos seus Titulares, adotando desde a concepção de nossas Plataformas medidas de segurança para o Tratamento de Dados.

A NOME DO SITE possui certificações e utiliza tecnologias Todas as transações de pagamento, com cartão de crédito ou não, são realizadas com a tecnologia SSL (Secure Socket Layer), o que garante a segurança do tráfego de Dados Pessoais de nossos clientes, como endereço de entrega, dados de cartão de crédito e histórico de pedidos, protegidos por criptografia forte. A SSL protege contra divulgação, transmissão e adulteração indevida de Dados Pessoais.

Somos certificados pelo Site Blindado, empresa de segurança de dados com foco na proteção e na segurança de plataformas de e-commerce.

Além disso, todas as informações e Dados Pessoais fornecidos no momento do cadastro do cliente são armazenados com criptografia de última geração.

Nossos sistemas web e internos possuem dispositivos preventivos e reativos contra invasões e ciberataques, tais como IPS (Intrusion Prevetion System), Firewalls de Rede e de Aplicação e sistemas Anti-DDOS (prevenção de ataques de negação de serviços), garantindo a permanência de nossos serviços não são com maior proteção para você.

Caso ocorra algum ataque à segurança à base de dados do NOME DO SITE que possa gerar danos ou comprometer a privacidade integral dos Dados Pessoais, objetos de tratamento, informaremos a Autoridade Nacional de Proteção de Dados e seus Titulares, no prazo razoável.

Em caso de incidentes em que os Titulares foram afetados, o NOME DO SITE informará via e-mail quais Dados Pessoais foram comprometidos, assim como quais Titulares foram diretamente afetados, os riscos gerados pelo ataque, as medidas de segurança prévias ao ataque e quais serão as novas medidas adotadas para reverter os efeitos gerados.

12. Quais são as leis aplicáveis às operações de Tratamento de Dados?

A atual Política de Privacidade foi pensada e definida nos moldes da lei brasileira, Marco Civil da Internet, Leis Trabalhistas, com abordagem além da Lei Geral de Proteção de Dados Pessoais (“LGPD”). Qualquer demanda decorrente do Tratamento de Dados pelo NOME DO SITE será processada pela lei brasileira, sendo competente o foro de domicílio do Titular para dirimir dúvidas decorrentes desta Política de Privacidade.

Caso o Titular não seja domiciliado no Brasil, as controvérsias relacionadas a esta Política de Privacidade deverão ser propostas exclusivamente no Foro da Comarca da cidade de São Paulo.

13. Disposições Finais

O Titular de Dados Pessoais declara estar plenamente consciente de seus direitos e da forma mais adequada para exercê-los, declarando-se informado de que:

(i) casos de violação ou de suspeitas de violação à presente Política de Privacidade podem ser reportados em NOME DO SITE através dos seguintes contatos: E-MAIL DA SUA LOJA ou LINK PARA A PÁGINA DE CONTATO DA SUA LOJA

(ii) perguntas, sugestões ou comentários sobre a presente Política de Privacidade podem ser encaminhados para: E-MAIL DA SUA LOJA ou LINK PARA A PÁGINA DE CONTATO DA SUA LOJA nos termos do art. 18, §1º, da LGPD, conhece o seu direito de propor permissão junto ao órgão da ANPD.

A NOME DO SITE ressalta que a presente Política de Privacidade, os "Termos e Condições de Uso" e a "Política de Cookies" da NOME DO SITE incluem um conjunto integrado e indissociável de normas. Se presentes potenciais conflitos entre as normas e diretrizes internas do NOME DO SITE , os colaboradores deverão orientar sua conduta considerando a norma/diretriz mais restritiva.

14. Atualização desta Política

Esta Política será revisada e atualizada de forma periódica, seja em virtude de novas regulamentações sobre o Tratamento de Dados ou da atualização de nossas operações de Tratamento e procedimentos internos. A Política de Privacidade atualizada estará sempre disponível em nossas plataformas para consulta.

Instruções para a IA:

Abaixo, você encontrará os dados coletados do cliente. Sua tarefa é transformar essas informações em um esboço de homepage focado no corpo principal do conteúdo, seguindo as diretrizes de estrutura HTML (H1, H2, H3), e considerando as melhores práticas de SEO e UX para e-commerce.

Dados do Cliente:

Nome Completo da Loja: Moda Urbana Brasil

Nicho de Mercado / Principais Produtos Vendidos: Roupas e acessórios streetwear para jovens adultos, focando em estilo urbano e tendências.

Diferencial / Proposta de Valor da Marca: Design autêntico, peças exclusivas de alta qualidade, foco na expressão individual, entregas rápidas.

Principais Palavras-Chave: moda streetwear, roupas urbanas, tênis exclusivos, acessórios de rua, estilo jovem, moda masculina, moda feminina.

Público-Alvo Principal: Jovens e adultos (18-35 anos) que buscam se expressar através da moda, valorizam autenticidade, conforto e as últimas tendências do universo streetwear.

Razões para Comprar na Loja: Compra segura, produtos de alta qualidade, design autêntico, troca e devolução facilitadas, atendimento rápido.

Estrutura de Geração da Homepage (Para a IA):

Gere o esboço do corpo principal da homepage no formato Markdown, incorporando os dados do cliente da seguinte forma:

Meta Title:

Formato: <title> [Nome da Loja] | [Nicho/Principais Produtos] [diferencial, se couber] [Palavra-chave extra] </title>

Otimização: Máx. 60 caracteres. Incluir nome da loja, nicho e 1-2 palavras-chave principais.

Meta Description:

Formato: <meta name="description" content="[Nicho] com [Diferencial]. Encontre [Principais Produtos] [Palavras-chave] e [chamada para ação/Benefício, ex: frete grátis].">

Otimização: Máx. 300 caracteres. Concisa, com nicho, diferencial e CTA.

H1 (Título Principal da Página):

Formato: # [Nome da Loja]: [Nicho/Proposta de Valor Otimizada]

Otimização: Único H1 na página, usando o nome da loja e uma frase clara que resuma o nicho e as palavras-chave primárias.

Banner Principal (Hero Section):

Sugestões de 2 slides (com base em Lançamentos e Ofertas).

Incluir CTA para cada slide (Ex: "Compre Agora", "Ver Ofertas").

Slogan da marca do cliente ( a IA cria um com base no diferencial/nicho).

Seções de Conteúdo (Gerado pela IA):

Com base no Nicho e Diferencial da loja, a IA deve sugerir 5 a 8 seções de conteúdo que são comumente priorizadas em homepages de e-commerce, sempre visando a clareza e usabilidade. Exemplos válidos: "Lançamentos", "Produtos Mais Vendidos", "Ofertas Especiais", "Categorias em Destaque", "Blog/Dicas de Estilo".

Para cada seção sugerida, crie um H2 otimizado.

H2 Otimizado: Ex: ## Novos Lançamentos: Descubra as Últimas Tendências em [Nicho]

Dentro de cada H2, sugira 2-3 H3s para subdividir o conteúdo ou apresentar exemplos.

H3 para Categorias/Coleções: Ex: ### Camisetas e Moletons [Palavra-chave]

H3 para Promoções: Ex: ### [Tipo de Produto] com Desconto Exclusivo

Para cada H2/H3, descrever brevemente o tipo de conteúdo esperado (grade de produtos, carrossel, texto de destaque) e as CTAs associadas.

Importante: Ao sugerir grades de produtos, limitar a 12-24 produtos em toda home page para otimização de carregamento e experiência do usuário na homepage.

Seção de Carrossel de Avaliações

Título: ### Por Que Escolher [Nome da Loja]? (ou similar)

Conteúdo: “Carrossel de Avaliações” .

Newsletter:

A IA deve gerar uma frase atrativa para a newsletter com base no nicho e diferencial da loja.

Formato: "[Frase Gerada pela IA] cadastre seu e-mail:"

Observações Finais de SEO:

Lembrar sobre otimização de imagens (compressão, alt text).

Prioridade à velocidade de carregamento da página.

Necessidade de responsividade (mobile-first design).

Garantir estrutura de links internos clara para todas as seções e categorias principais, facilitando o rastreamento pelo Google.

Sinalizar nas respostas o H1, H2 e H3 antes da frase ou palavra

Otimize os H2s e H3s o máximo possível

Carrossel com Temporizador

</a>

</div>

</a>

</div>

</a>

</div>

</div>

</div>

<style>

.carrossel-container {

width: 100%;

max-width: 1200px;

margin: 0 auto;

position: relative;

overflow: hidden;

}

.carrossel-simples {

display: flex;

transition: transform 0.5s ease;

width: 100%;

}

.carrossel-slide {

min-width: 100%;

position: relative;

overflow: hidden;

}

.slide-link {

display: block;

width: 100%;

height: 100%;

position: relative;

cursor: pointer;

}

.carrossel-slide img {

width: 100%;

height: auto;

display: block;

object-fit: cover;

}

.indicadores-container {

position: absolute;

bottom: 15px;

left: 0;

right: 0;

display: flex;

justify-content: center;

z-index: 10;

}

.indicador {

width: 10px;

height: 10px;

border-radius: 50%;

background-color: rgba(255, 255, 255, 0.5);

margin: 0 5px;

cursor: pointer;

transition: background-color 0.3s ease;

}

.indicador.ativo {

background-color: #ffffff;

}

@media (max-width: 768px) {

.indicador {

width: 8px;

height: 8px;

margin: 0 4px;

}

</style>

document.addEventListener('DOMContentLoaded', function() {

// Configuração do carrossel

const carrossel = document.getElementById('carrossel-simples');

const slides = carrossel.querySelectorAll('.carrossel-slide');

const indicadoresContainer = document.getElementById('indicadores-container');

let slideAtual = 0;

const totalSlides = slides.length;

let temporizador = null;

const intervalo = 5000; // 5 segundos entre cada slide

// Cria os indicadores (pontos) para navegação

for (let i = 0; i < totalSlides; i++) {

const indicador = document.createElement('div');

indicador.classList.add('indicador');

if (i === 0) indicador.classList.add('ativo');

indicador.addEventListener('click', function(e) {

e.preventDefault();

irParaSlide(i);

reiniciarTemporizador();

});

indicadoresContainer.appendChild(indicador);

}

const indicadores = indicadoresContainer.querySelectorAll('.indicador');

// Função para atualizar o carrossel

function atualizarCarrossel() {

carrossel.style.transform = `translateX(-${slideAtual * 100}%)`;

// Atualiza os indicadores

indicadores.forEach((ind, index) => {

if (index === slideAtual) {

ind.classList.add('ativo');

} else {

ind.classList.remove('ativo');

}

});

}

// Função para ir para um slide específico

function irParaSlide(indice) {

slideAtual = indice;

if (slideAtual < 0) slideAtual = totalSlides - 1;

if (slideAtual >= totalSlides) slideAtual = 0;

atualizarCarrossel();

}

// Função para avançar para o próximo slide

function proximoSlide() {

irParaSlide(slideAtual + 1);

}

// Função para iniciar o temporizador de autoplay

function iniciarTemporizador() {

temporizador = setInterval(proximoSlide, intervalo);

}

// Função para reiniciar o temporizador

function reiniciarTemporizador() {

clearInterval(temporizador);

iniciarTemporizador();

}

// Método seguro para redirecionamento

function redirecionarSeguro(url) {

if (!url) return;

// Cria um elemento <form> temporário para submissão segura

const form = document.createElement('form');

form.method = 'GET';

form.action = url;

form.target = '_blank';

document.body.appendChild(form);

form.submit();

document.body.removeChild(form);

}

// Adiciona manipuladores de clique para os links

const links = carrossel.querySelectorAll('.slide-link');

links.forEach(function(link) {

link.addEventListener('click', function(e) {

e.preventDefault();

const url = this.getAttribute('data-url');

if (url) {

redirecionarSeguro(url);

}

});

// Evento de swipe para dispositivos móveis

let touchStartX = 0;

let touchEndX = 0;

carrossel.addEventListener('touchstart', function(e) {

touchStartX = e.changedTouches[0].screenX;

});

carrossel.addEventListener('touchend', function(e) {

touchEndX = e.changedTouches[0].screenX;

handleSwipe();

});

function handleSwipe() {

if (touchEndX < touchStartX - 50) {

// Swipe da direita para a esquerda

proximoSlide();

reiniciarTemporizador();

} else if (touchEndX > touchStartX + 50) {

// Swipe da esquerda para a direita

irParaSlide(slideAtual - 1);

reiniciarTemporizador();

}

// Pausa o carrossel quando o mouse está sobre ele

carrossel.addEventListener('mouseenter', function() {

clearInterval(temporizador);

});

// Reinicia o carrossel quando o mouse sai

carrossel.addEventListener('mouseleave', function() {

iniciarTemporizador();

});

// Inicia o carrossel

iniciarTemporizador();

});

</script>

<style>

/* IDs da tabela e botões ajustados para serem únicos */

#tabela-parcelamento-edi-semjuros-3x th {background-color: #ddd;color: black;}

#tabela-parcelamento-edi-semjuros-3x {margin-top: 20px; width: 100%; border-collapse: collapse;}

#tabela-parcelamento-edi-semjuros-3x th, #tabela-parcelamento-edi-semjuros-3x td {border: 1px solid #ddd; padding: 8px; text-align: left; padding-top: 2px; padding-bottom: 2px;}

.juros {font-size: small; font-weight: 100;}

.vezes {font-weight: 900;}

.parcelamento {font-size:16px;}

.toggle-button {background-color: rgba(0, 0, 0, 0); color: black; border: none; cursor: pointer;}

.tabela {display: flex; justify-content: space-between; align-items: center; margin-top: -25px; margin-bottom: -20px;}

@keyframes fade-in {from {opacity: 0;} to {opacity: 1;}}

.fade-in {animation: fade-in 0.5s ease-in-out;}

</style>

document.addEventListener("DOMContentLoaded", function() {

// ATENÇÃO: IDs dos elementos alterados aqui para serem únicos para este bloco

let tabela = document.getElementById("tabela-parcelamento-edi-semjuros-3x");

let botaoExpandir = document.getElementById("expand-button-semjuros-3x");

let botaoOcultar = document.getElementById("hide-button-semjuros-3x");

// Verifica se todos os elementos foram encontrados antes de tentar usá-los

if (tabela && botaoExpandir && botaoOcultar) {

// Inicializa a tabela como escondida ao carregar a página

tabela.style.display = "none";

// Garante que o botão de expandir esteja visível e o de ocultar escondido

botaoExpandir.style.display = "inline-block";

botaoOcultar.style.display = "none";

botaoExpandir.addEventListener("click", function() {

tabela.style.display = "table";

tabela.classList.add("fade-in");

botaoExpandir.style.display = "none";

botaoOcultar.style.display = "inline-block";

});

botaoOcultar.addEventListener("click", function() {

tabela.style.display = "none";

tabela.classList.remove("fade-in");

botaoOcultar.style.display = "none";

botaoExpandir.style.display = "inline-block";

});

}

});

</script>

<div>

<div><p class="parcelamento"><i class="fa fa-plus"></i> Mais opções de parcelamento</p></div>

<button id="expand-button-semjuros-3x" class="toggle-button">Parcelas <i class="fa fa-chevron-down"></i></button>

<button id="hide-button-semjuros-3x" class="toggle-button" style="display: none;">Ocultar <i class="fa fa-chevron-up"></i></button>