/* ===== Cores da loja: mude aqui para personalizar ===== */
:root {
    --cor-principal: #6c2bd9;
    --cor-principal-escura: #5520b0;
    --cor-texto: #1f2330;
    --cor-suave: #6b7280;
    --cor-fundo: #f6f7fb;
    --cor-card: #ffffff;
    --cor-borda: #e5e7eb;
    --cor-sucesso: #16a34a;
    --cor-erro: #dc2626;
    --raio: 10px;
    /* Cores que podem ser trocadas em Admin → Aparência */
    --cab-fundo: #ffffff;
    --cab-texto: #333333;
    --aviso-fundo: #1d1d1d;
    --aviso-texto: #ffffff;
    --cor-preco: #1f2330;
    --cor-titulo: #1f2330;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    color: var(--cor-texto);
    background: var(--cor-fundo);
    line-height: 1.5;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

main.container { flex: 1; padding-top: 24px; padding-bottom: 40px; }
a { color: var(--cor-principal); }
img { max-width: 100%; }
h1 { margin-top: 0; }

.container { width: 100%; max-width: 1140px; margin: 0 auto; padding: 0 16px; }

/* ===== Topo ===== */
.topo { background: var(--cor-principal); color: #fff; padding: 14px 0; }
.topo-admin { background: var(--cor-texto); }
.topo-conteudo { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.logo { color: #fff; font-size: 1.4rem; font-weight: 700; text-decoration: none; }

.menu-admin { display: flex; gap: 14px; flex-wrap: wrap; margin-left: auto; }
.menu-admin a { color: #fff; text-decoration: none; opacity: .85; }
.menu-admin a:hover { opacity: 1; }

/* ===== Rodapé ===== */
.rodape { --rodape-fundo: #f7f7f7; background: var(--rodape-fundo); color: #555; font-size: .82rem; border-top: 1px solid #e5e5e5; }
.rodape a { color: #555; text-decoration: none; }
.rodape a:hover { color: var(--cor-principal); }
.rodape h4 { color: #222; font-size: .85rem; text-transform: uppercase; margin: 0 0 14px; letter-spacing: .02em; }
.rodape ul { list-style: none; padding: 0; margin: 0; }
.rodape li { margin-bottom: 7px; }

.rodape-beneficios { border-bottom: 1px solid #e5e5e5; padding: 28px 0; }
.rodape-grade-beneficios { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.beneficio { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.beneficio svg { color: #222; margin-bottom: 6px; }
.beneficio strong { color: #222; font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; }
.beneficio p { margin: 2px 0; color: #777; }
.beneficio a { text-decoration: underline; }

.rodape-colunas { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.6fr .8fr; gap: 28px; padding-top: 28px; padding-bottom: 28px; }
.rodape-contato li { display: block; }
.rodape-contato li svg { vertical-align: -2px; margin-right: 4px; }
.rodape-contato a { overflow-wrap: anywhere; }
.rodape-newsletter p { margin: 0 0 12px; }
.rodape-newsletter form { display: flex; flex-direction: column; gap: 6px; }
.rodape-newsletter input { width: 100%; padding: 9px 10px; border: 1px solid #ccc; border-radius: 3px; font-size: .85rem; background: #fff; }
.rodape-newsletter button {
    padding: 9px; border: none; border-radius: 3px; background: #222; color: #fff;
    font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; cursor: pointer;
}
.rodape-newsletter button:hover { background: var(--cor-principal); }
.rodape-redes { display: flex; gap: 12px; }
.rodape-redes a { color: #333; }

.rodape-pagamentos { border-top: 1px solid #e5e5e5; padding: 22px 0; }
.rodape-grade-pagamentos { display: flex; justify-content: center; gap: 20px 60px; flex-wrap: wrap; text-align: center; }
.rodape-grade-pagamentos p { margin: 0 0 10px; }
.selos { display: flex; gap: 6px; flex-wrap: wrap; justify-content: center; align-items: center; }
.selo {
    display: inline-flex; align-items: center; justify-content: center; height: 26px; min-width: 44px; padding: 0 7px;
    background: #fff; border: 1px solid #ddd; border-radius: 4px; font-weight: 800; font-size: .72rem; font-family: Arial, sans-serif;
}
.selo-visa { color: #1a1f71; font-style: italic; font-size: .85rem; }
.selo-master i { width: 15px; height: 15px; border-radius: 50%; background: #eb001b; display: inline-block; }
.selo-master i + i { background: #f79e1b; margin-left: -6px; mix-blend-mode: multiply; }
.selo-elo { background: #000; color: #fff; border-color: #000; text-transform: lowercase; }
.selo-amex { background: #2e77bc; color: #fff; border-color: #2e77bc; }
.selo-hiper { background: #b3131b; color: #fff; border-color: #b3131b; font-style: italic; }
.selo-pix { color: #32bcad; font-weight: 700; }
.selo-boleto { color: #333; font-weight: 600; }
.selo-seguranca {
    display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; background: #fff;
    border: 1px solid #ddd; border-radius: 4px; color: #2e9e48; font-weight: 800; font-size: .9rem;
}
.selo-seguranca > span { display: flex; flex-direction: column; line-height: 1; }
.selo-seguranca small { font-size: .55rem; color: #777; font-weight: 600; text-transform: uppercase; }

.rodape-final { background: #fff; text-align: center; padding: 14px 16px; color: #666; }
.rodape-final p { margin: 3px 0; }

/* Páginas institucionais */
.pagina-texto { background: #fff; padding: 28px; border-radius: var(--raio); max-width: 820px; margin: 0 auto; }
.pagina-texto h2 { font-size: 1.1rem; margin-top: 22px; }

/* ===== Botões ===== */
.btn {
    display: inline-block; background: var(--cor-principal); color: #fff; border: none;
    padding: 10px 18px; border-radius: var(--raio); font-size: 1rem; font-weight: 600;
    cursor: pointer; text-decoration: none; text-align: center;
}
.btn:hover { background: var(--cor-principal-escura); }
.btn:disabled { background: #9ca3af; cursor: not-allowed; }
.btn-secundario { background: #fff; color: var(--cor-texto); border: 1px solid var(--cor-borda); }
.btn-secundario:hover { background: #f3f4f6; }
.btn-whatsapp { background: #25d366; }
.btn-whatsapp:hover { background: #1da851; }
.btn-link { background: none; border: none; color: var(--cor-principal); cursor: pointer; padding: 0; font-size: .95rem; }
.btn-link.perigo { color: var(--cor-erro); }
.botao-oculto { position: absolute; left: -9999px; width: 1px; height: 1px; }

/* ===== Alertas ===== */
.alerta { padding: 12px 16px; border-radius: var(--raio); margin-bottom: 16px; }
.alerta-sucesso { background: #dcfce7; color: #14532d; }
.alerta-erro { background: #fee2e2; color: #7f1d1d; }
.vazio { color: var(--cor-suave); padding: 30px 0; text-align: center; }

/* ===== Filtros de categoria ===== */
.categorias { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 20px; }
.categorias a {
    padding: 6px 14px; border-radius: 999px; background: #fff; border: 1px solid var(--cor-borda);
    text-decoration: none; color: var(--cor-texto);
}
.categorias a.ativo { background: var(--cor-principal); color: #fff; border-color: var(--cor-principal); }

/* ===== Vitrine ===== */
.grade-produtos { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 20px; }
.card-produto {
    background: var(--cor-card); border-radius: var(--raio); padding: 14px;
    box-shadow: 0 1px 3px rgba(0,0,0,.06); display: flex; flex-direction: column;
}
.card-produto a { text-decoration: none; color: inherit; }
.card-produto img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 8px; background: #eee; }
.card-produto h3 { font-size: 1rem; margin: 10px 0 4px; }
.loja main h1, .loja main h2, .card-produto h3, .pp-relacionado h4 { color: var(--cor-titulo); }
.card-produto form { margin-top: auto; }
.card-produto .btn { width: 100%; }
.preco { font-weight: 700; color: var(--cor-preco); font-size: 1.15rem; margin: 4px 0 12px; }
.preco.grande { font-size: 1.8rem; }

/* ===== Página do produto ===== */
.produto-detalhe { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; background: #fff; padding: 24px; border-radius: var(--raio); }
.produto-detalhe img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: var(--raio); background: #eee; }
.categoria-tag { color: var(--cor-suave); text-transform: uppercase; font-size: .8rem; letter-spacing: .05em; margin: 0; }
.estoque { color: var(--cor-sucesso); }
.estoque.esgotado { color: var(--cor-erro); }
.form-comprar { display: flex; gap: 10px; }
.form-comprar input { width: 80px; }

/* ===== Tabelas ===== */
.tabela { width: 100%; border-collapse: collapse; background: #fff; border-radius: var(--raio); overflow: hidden; margin-bottom: 20px; }
.tabela th, .tabela td { padding: 12px; text-align: left; border-bottom: 1px solid var(--cor-borda); vertical-align: middle; }
.tabela th { background: #f9fafb; font-size: .85rem; color: var(--cor-suave); text-transform: uppercase; }
.tabela tr.total td { font-weight: 700; font-size: 1.05rem; }
.item-produto { display: flex; align-items: center; gap: 10px; }
.item-produto img, .miniatura { width: 50px; height: 50px; object-fit: cover; border-radius: 6px; }
.qtd { width: 70px; }
.acoes { display: flex; gap: 12px; align-items: center; }

/* ===== Carrinho e checkout ===== */
.carrinho-acoes { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.total { font-size: 1.2rem; }
.checkout { display: grid; grid-template-columns: 2fr 1fr; gap: 24px; align-items: start; }
.resumo { background: #fff; padding: 20px; border-radius: var(--raio); }
.resumo h2 { font-size: 1.1rem; margin-top: 0; }
.resumo-item { display: flex; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid var(--cor-borda); }
.resumo-item.total { font-weight: 700; border: none; }

.confirmacao { max-width: 640px; margin: 0 auto; text-align: center; }
.confirmacao .tabela { text-align: left; }
.caixa-pix { background: #fff; border: 2px dashed var(--cor-principal); border-radius: var(--raio); padding: 16px; margin-bottom: 20px; }

/* ===== Formulários ===== */
.formulario { background: #fff; padding: 24px; border-radius: var(--raio); display: flex; flex-direction: column; gap: 14px; max-width: 720px; }
.formulario label { display: flex; flex-direction: column; gap: 4px; font-weight: 600; font-size: .95rem; }
.formulario label.radio, .formulario label.checkbox { flex-direction: row; align-items: center; gap: 8px; font-weight: 400; }
.formulario fieldset { border: 1px solid var(--cor-borda); border-radius: var(--raio); padding: 10px 14px; }
input[type=text], input[type=email], input[type=tel], input[type=password], input[type=number], input[type=url], input[type=search], textarea, select {
    padding: 9px 12px; border: 1px solid var(--cor-borda); border-radius: 8px; font-size: 1rem; font-family: inherit; font-weight: 400;
}
.linha { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.linha.linha-2 { grid-template-columns: repeat(2, 1fr); }
.preview { width: 120px; border-radius: 8px; }
.form-inline { display: flex; gap: 8px; align-items: center; margin-bottom: 0; }
form.form-inline + .tabela { margin-top: 16px; }

/* ===== Admin ===== */
.titulo-acoes { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.titulo-acoes h1 { margin: 0; }
.cards-resumo { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; margin-bottom: 28px; }
.card-resumo { background: #fff; padding: 18px; border-radius: var(--raio); display: flex; flex-direction: column; }
.card-resumo span { color: var(--cor-suave); font-size: .9rem; }
.card-resumo strong { font-size: 1.6rem; }
.status { padding: 3px 10px; border-radius: 999px; font-size: .8rem; font-weight: 600; }
.status-pendente { background: #fef3c7; color: #92400e; }
.status-pago { background: #dbeafe; color: #1e40af; }
.status-enviado { background: #ede9fe; color: #5b21b6; }
.status-entregue { background: #dcfce7; color: #166534; }
.status-cancelado { background: #fee2e2; color: #991b1b; }

.pagina-login { justify-content: center; align-items: center; padding: 16px; }
.caixa-login { width: 100%; max-width: 380px; }
.caixa-login h1 { font-size: 1.3rem; }

/* ===== Bloco de preço (parcelas e à vista) ===== */
.bloco-preco { display: flex; flex-direction: column; gap: 3px; margin: 4px 0 12px; }
.bloco-preco .preco { margin: 0; }
.bloco-preco .parcelas { font-size: .82rem; color: #444; }
.bloco-preco .avista { font-size: .85rem; color: #555; }
.bloco-preco .avista strong { color: var(--cor-sucesso); }
.bloco-preco.grande .preco { font-size: 1.9rem; color: var(--cor-preco); }
.bloco-preco.grande .avista { font-size: 1rem; margin-top: 8px; }
.bloco-preco.pequeno .preco { font-size: 1.05rem; color: var(--cor-preco); }
.bloco-preco.pequeno .parcelas, .bloco-preco.pequeno .avista { font-size: .75rem; }

/* ===== Página do produto ===== */
.pp-topo { display: grid; grid-template-columns: 1.1fr 1fr; gap: 40px; background: #fff; padding: 28px; border-radius: var(--raio); }
.pp-galeria { display: flex; gap: 12px; align-items: flex-start; }
.pp-miniaturas { display: flex; flex-direction: column; gap: 10px; flex-shrink: 0; }
.pp-miniatura { width: 72px; height: 72px; padding: 0; border: 1px solid var(--cor-borda); border-radius: 6px; background: #fff; cursor: pointer; overflow: hidden; }
.pp-miniatura img { width: 100%; height: 100%; object-fit: contain; }
.pp-miniatura.ativa { border-color: var(--cor-texto); box-shadow: 0 0 0 1px var(--cor-texto); }
.pp-foto-principal { flex: 1; }
.pp-foto-principal img { width: 100%; aspect-ratio: 1; object-fit: contain; border-radius: var(--raio); background: #fafafa; }

.pp-info h1 { font-size: 1.6rem; line-height: 1.25; margin-bottom: 10px; }
.pp-nota { display: inline-block; margin-bottom: 10px; color: var(--cor-suave); text-decoration: none; font-size: .9rem; }
.pp-comprar { display: flex; gap: 10px; margin: 18px 0; padding-bottom: 20px; border-bottom: 1px solid var(--cor-borda); flex-wrap: wrap; }
.seletor-qtd { display: flex; border: 1px solid var(--cor-borda); border-radius: 4px; overflow: hidden; }
.seletor-qtd button { width: 34px; border: none; background: #f5f5f5; font-size: 1.1rem; cursor: pointer; }
.seletor-qtd button:hover { background: #e9e9e9; }
.seletor-qtd input { width: 50px; border: none; border-radius: 0; text-align: center; -moz-appearance: textfield; }
.seletor-qtd input::-webkit-inner-spin-button { -webkit-appearance: none; }
.btn-comprar {
    background: #111; color: #fff; border: none; padding: 12px 26px; border-radius: 4px; cursor: pointer;
    font-weight: 700; font-size: .85rem; text-transform: uppercase; letter-spacing: .04em;
}
.btn-comprar:hover { background: var(--cor-principal); }

.pp-frete label { display: block; font-size: .85rem; font-weight: 600; margin-bottom: 6px; }
.pp-frete-campo { display: flex; gap: 6px; max-width: 320px; }
.pp-frete-campo input { flex: 1; min-width: 0; }
.pp-frete-campo button { border: 1px solid var(--cor-borda); background: #f5f5f5; padding: 0 16px; border-radius: 6px; cursor: pointer; font-size: .8rem; font-weight: 700; text-transform: uppercase; }
.pp-frete > a { display: inline-block; margin-top: 6px; font-size: .8rem; color: var(--cor-texto); }
#resultado-frete { margin-top: 10px; font-size: .9rem; }
.frete-erro { color: var(--cor-erro); }

.pp-abas { background: #fff; border-radius: var(--raio); margin-top: 24px; padding: 0 28px 28px; }
.pp-abas-menu { display: flex; justify-content: center; gap: 4px; border-bottom: 1px solid var(--cor-borda); flex-wrap: wrap; }
.pp-abas-menu button {
    background: none; border: none; border-top: 3px solid transparent; padding: 16px 14px; cursor: pointer;
    font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--cor-suave);
}
.pp-abas-menu button.ativa { color: var(--cor-texto); border-top-color: var(--cor-texto); }
.pp-aba { display: none; padding-top: 22px; font-size: .92rem; color: #444; }
.pp-aba.ativa { display: block; }
.pp-aba h2 { font-size: 1.15rem; color: var(--cor-texto); }
.pp-aba strong { color: var(--cor-texto); }
.pp-tabela-info { width: 100%; border-collapse: collapse; }
.pp-tabela-info th, .pp-tabela-info td { padding: 10px 12px; border-bottom: 1px solid var(--cor-borda); text-align: left; }
.pp-tabela-info th { width: 30%; background: #fafafa; }

.pp-avaliacoes { background: #fff; border-radius: var(--raio); margin-top: 24px; padding: 28px; }
.pp-resumo-notas { max-width: 760px; margin: 0 auto 24px; }
.pp-media { display: flex; flex-direction: column; align-items: center; gap: 4px; margin-bottom: 16px; color: var(--cor-suave); font-size: .85rem; }
.pp-media .estrelas { font-size: 1.3rem; }
.pp-barra { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; font-size: .8rem; }
.pp-barra .estrelas { font-size: .85rem; flex-shrink: 0; }
.pp-barra-trilho { flex: 1; height: 8px; background: #eee; border-radius: 4px; overflow: hidden; }
.pp-barra-trilho div { height: 100%; background: #f5a623; }
.pp-barra > span:last-child { width: 24px; text-align: right; color: var(--cor-suave); }
.estrelas { color: #f5a623; letter-spacing: 1px; white-space: nowrap; }
.estrelas-vazias { color: #ddd; }
.pp-sem-avaliacao { color: var(--cor-suave); }
.pp-avaliacao { border-bottom: 1px solid var(--cor-borda); padding: 12px 0; }
.pp-avaliacao p { margin: 6px 0 0; color: #444; }
.pp-data { color: var(--cor-suave); font-size: .8rem; margin-left: 6px; }

.pp-form-avaliacao { display: flex; flex-direction: column; gap: 12px; margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--cor-borda); }
.pp-form-avaliacao h3 { margin: 0; font-size: 1rem; }
.pp-form-avaliacao label { display: flex; flex-direction: column; gap: 4px; font-size: .88rem; }
.pp-form-avaliacao .rotulo span, .pp-campo-nota > span span, .pp-aviso span { color: var(--cor-erro); }
.pp-aviso { margin: 0; font-size: .82rem; color: var(--cor-suave); }
.pp-form-linha { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.pp-form-avaliacao .btn-comprar { align-self: flex-start; }
.pp-campo-nota { display: flex; align-items: center; gap: 10px; font-size: .88rem; }
.seletor-estrelas { display: inline-flex; flex-direction: row-reverse; }
.seletor-estrelas input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.seletor-estrelas label { font-size: 1.5rem; color: #ddd; cursor: pointer; padding: 0 1px; }
.seletor-estrelas label:hover, .seletor-estrelas label:hover ~ label,
.seletor-estrelas input:checked ~ label { color: #f5a623; }
.seletor-estrelas input:focus-visible + label { outline: 2px solid var(--cor-principal); }

.pp-categorias { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px 24px; font-size: .88rem; margin: 22px 0; }
.pp-relacionados h2 { font-size: 1.2rem; }
.pp-grade-relacionados { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.pp-relacionado { background: #fff; border-radius: var(--raio); padding: 12px; text-decoration: none; color: inherit; text-align: center; }
.pp-relacionado:hover { box-shadow: 0 4px 14px rgba(0,0,0,.08); }
.pp-relacionado img { width: 100%; aspect-ratio: 1; object-fit: contain; }
.pp-relacionado h4 { font-size: .85rem; margin: 8px 0 4px; }
.pp-relacionado .bloco-preco { align-items: center; }

/* Admin: formulário de produto */
.formulario-largo { max-width: 900px; }
.ajuda { font-weight: 400; color: var(--cor-suave); font-size: .82rem; }
.ajuda code { background: #f3f4f6; padding: 1px 5px; border-radius: 4px; }
.campo-galeria { display: flex; flex-direction: column; gap: 8px; font-size: .95rem; }
.galeria-admin { display: flex; gap: 10px; flex-wrap: wrap; }
.galeria-admin-item { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.galeria-admin-item img { width: 90px; height: 90px; object-fit: cover; border-radius: 6px; border: 1px solid var(--cor-borda); }

.editor-pagina { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; align-items: start; }
.texto-pagina { font-family: ui-monospace, Consolas, monospace; font-size: .9rem; line-height: 1.6; }
.acoes-form { display: flex; gap: 10px; flex-wrap: wrap; }
.guia-formatacao table { width: 100%; font-size: .85rem; border-collapse: collapse; margin-bottom: 12px; }
.guia-formatacao td { padding: 5px 4px; border-bottom: 1px solid var(--cor-borda); }
.guia-formatacao code { background: #f3f4f6; padding: 1px 5px; border-radius: 4px; white-space: nowrap; }
.pagina-texto ul, .pp-aba ul { padding-left: 20px; }

/* ===== Cabeçalho da loja ===== */
.faixa-aviso {
    background: var(--aviso-fundo); color: var(--aviso-texto); text-align: center; padding: 8px 16px;
    font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
}
.faixa-aviso a { color: var(--aviso-texto); text-decoration: none; }
.cabecalho { background: var(--cab-fundo); border-bottom: 1px solid var(--cor-borda); position: sticky; top: 0; z-index: 50; }
.cabecalho .container { max-width: 1400px; }
.cabecalho-conteudo { display: flex; align-items: center; gap: 24px; min-height: 72px; padding-top: 8px; padding-bottom: 8px; }
.cab-logo { font-size: 1.5rem; font-weight: 800; color: var(--cab-texto); text-decoration: none; flex-shrink: 0; display: flex; align-items: center; }
.cab-logo img { display: block; width: auto; max-width: 360px; object-fit: contain; }
.cab-menu { flex: 1; display: flex; justify-content: center; gap: 18px; min-width: 0; }
.cab-menu a {
    color: var(--cab-texto); text-decoration: none; font-size: .8rem; text-transform: uppercase; letter-spacing: .02em;
    padding: 6px 0; border-bottom: 2px solid transparent; white-space: nowrap;
}
.cab-menu a:hover { color: var(--cor-principal); }
.cab-menu a.ativo { border-bottom-color: currentColor; }
.cab-menu-conta, .cab-fechar-menu, .cab-abrir-menu { display: none !important; }
.cab-acoes { display: flex; align-items: center; gap: 16px; flex-shrink: 0; }
.cab-icone { background: none; border: none; padding: 4px; cursor: pointer; color: var(--cab-texto); display: flex; }
.cab-icone:hover, .cab-conta:hover, .cab-carrinho:hover { color: var(--cor-principal); }
.cab-conta { display: flex; align-items: center; gap: 6px; color: var(--cab-texto); text-decoration: none; font-size: .78rem; text-transform: uppercase; white-space: nowrap; }
.cab-carrinho { position: relative; display: flex; color: var(--cab-texto); }
.cab-contador {
    position: absolute; top: -6px; right: -9px; min-width: 18px; height: 18px; padding: 0 4px;
    background: var(--cor-principal); color: #fff; border-radius: 999px; font-size: .68rem; font-weight: 700;
    display: flex; align-items: center; justify-content: center;
}
.cab-busca { display: none; border-top: 1px solid var(--cor-borda); padding: 12px 0; background: var(--cab-fundo); }
.busca-aberta .cab-busca { display: block; }
.cab-busca .container { display: flex; gap: 8px; }
.cab-busca input { flex: 1; min-width: 0; padding: 10px 14px; font-size: 1rem; }
.cab-busca button {
    display: flex; align-items: center; gap: 6px; border: none; border-radius: 8px; padding: 0 18px;
    background: #111; color: #fff; font-weight: 600; cursor: pointer;
}
.cab-fundo { display: none; }

/* Conta do cliente */
.titulo-conta { text-align: center; }
.conta-colunas { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 16px; align-items: start; }
.conta-colunas .formulario { max-width: none; }
.conta-colunas h2 { margin: 0; font-size: 1.15rem; }
.conta-colunas .btn-comprar { align-self: flex-start; }
.aviso-conta { background: #fff; border: 1px dashed var(--cor-borda); border-radius: var(--raio); padding: 12px 16px; }
.acoes-cliente summary { cursor: pointer; color: var(--cor-principal); }
.acoes-cliente form { margin-top: 8px; }
.acoes-cliente input { width: 130px; }

/* ===== Checkout ===== */
.ck { background: #fff; margin: -24px -16px 0; padding: 28px 16px 40px; }
.ck-ja-cliente { font-size: .88rem; font-weight: 600; margin: 0 0 20px; }
.ck-ja-cliente a { color: var(--cor-texto); }
.ck-colunas { display: grid; grid-template-columns: 1fr 1fr; gap: 0 40px; align-items: start; }
.ck h2 { font-size: 1.15rem; text-transform: uppercase; letter-spacing: .01em; margin: 24px 0 18px; }
.ck-dados label { display: block; font-size: .86rem; color: #333; }
.ck-dados label > input, .ck-dados label > select, .ck-dados label > textarea { display: block; margin-top: 6px; }
.ck-dados label > span:not(.ck-rotulo), .ck-rotulo > span:last-child { color: var(--cor-erro); }
.ck-grade { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 20px; }
.ck-inteiro { grid-column: 1 / -1; }
.ck input[type=text], .ck input[type=email], .ck input[type=tel], .ck input[type=password], .ck select, .ck textarea {
    border: 1px solid #ddd; border-radius: 2px; padding: 10px 12px; font-size: .9rem; background: #fff; width: 100%;
}
.ck input:focus, .ck select:focus, .ck textarea:focus { outline: none; border-color: #999; }
.ck select:disabled { color: #555; background: #fff; }
.ck-dados .ck-check { display: flex; align-items: center; gap: 8px; margin-top: 18px; font-weight: 600; }
.ck-dados .ck-check input { margin: 0; }
.ck-senha-conta { margin-top: 10px; max-width: 50%; }

.ck-pedido {
    position: relative; background: #f5f5f5; padding: 8px 22px 26px; margin-top: 12px;
}
.ck-pedido::before {
    content: ""; position: absolute; left: 0; right: 0; top: -8px; height: 8px;
    background: radial-gradient(circle at 6px 0, transparent 6px, #f5f5f5 6.5px) 0 0 / 12px 8px repeat-x;
}
.ck-pedido h2 { text-align: center; }
.ck-tabela { background: #fff; padding: 4px 18px; }
.ck-linha { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 0; border-bottom: 1px solid #e5e5e5; font-size: .86rem; }
.ck-linha:last-child { border-bottom: none; }
.ck-cabeca { font-weight: 700; text-transform: uppercase; font-size: .8rem; }
.ck-item { justify-content: flex-start; }
.ck-item img { width: 52px; height: 52px; object-fit: contain; flex-shrink: 0; }
.ck-item-info { flex: 1; display: flex; flex-direction: column; gap: 8px; }
.ck-item > strong { font-weight: 400; white-space: nowrap; }
.ck-remover button { background: none; border: none; font-size: 1.1rem; color: #888; cursor: pointer; padding: 0 2px; }
.ck-remover button:hover { color: var(--cor-erro); }
.ck-qtd { display: inline-flex; align-items: center; border: 1px solid #ddd; align-self: flex-start; }
.ck-qtd button { width: 24px; height: 24px; border: none; background: #fff; cursor: pointer; font-size: .85rem; }
.ck-qtd button:disabled { color: #ccc; cursor: not-allowed; }
.ck-qtd span { width: 28px; text-align: center; font-size: .8rem; border-left: 1px solid #ddd; border-right: 1px solid #ddd; line-height: 24px; }
.ck-total strong:last-child { font-size: 1.2rem; }
#valor-frete { text-align: right; }

.ck-banner-pix {
    display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; margin: 18px 0;
    padding: 14px; background: #e8f5e9; border: 1px solid #66bb6a; border-radius: 4px; color: #2e7d32; font-size: .88rem;
}
.ck-banner-pix > strong { font-size: 1rem; }
.ck-pagamento { border-bottom: 1px solid #e0e0e0; padding: 10px 0; }
.ck-opcao { display: flex; align-items: center; gap: 8px; font-size: .92rem; cursor: pointer; flex-wrap: wrap; }
.ck-selo-desconto { background: #2ecc71; color: #063; font-size: .7rem; font-weight: 700; padding: 1px 6px; border-radius: 3px; }
.ck-selo-parcelas { color: var(--cor-suave); font-size: .8rem; }
.ck-explicacao { display: none; background: #fff; margin-top: 10px; padding: 16px 18px; font-size: .85rem; color: #444; }
.ck-pagamento:has(input:checked) .ck-explicacao { display: block; }
.ck-explicacao p { margin: 0; }
.ck-passos { list-style: none; counter-reset: passo; margin: 0; padding: 0; display: grid; gap: 14px; }
.ck-passos li { counter-increment: passo; display: flex; gap: 10px; align-items: flex-start; }
.ck-passos li::before {
    content: counter(passo); flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%;
    background: #2ecc71; color: #063; font-weight: 700; font-size: .75rem; display: flex; align-items: center; justify-content: center;
}
.ck-privacidade { font-size: .85rem; color: #555; margin: 16px 0; }
.ck-privacidade a { color: var(--cor-texto); font-weight: 700; text-decoration: none; }
.ck-finalizar {
    width: 100%; background: #000; color: #fff; border: none; padding: 15px; cursor: pointer;
    font-weight: 700; font-size: .85rem; text-transform: uppercase; letter-spacing: .03em;
}
.ck-finalizar:hover { background: #333; }

/* ===== Frete: opções na loja ===== */
.ck-envio { flex-direction: column; align-items: stretch; }
#opcoes-frete { display: flex; flex-direction: column; gap: 10px; }
#opcoes-frete > span { color: var(--cor-suave); }
.ck-envio .frete-para { margin: 0; font-size: .82rem; }
.ck-envio .frete-tabela { background: #fff; }
.ck-frete-opcao { cursor: pointer; justify-content: flex-start !important; align-items: flex-start !important; gap: 10px !important; }
.ck-frete-opcao input { margin-top: 3px; flex-shrink: 0; }
.ck-frete-opcao .info { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.ck-frete-opcao .info strong { font-weight: 600; }
.ck-frete-opcao small { color: var(--cor-suave); font-size: .78rem; }
.ck-frete-opcao small:empty { display: none; }
.ck-frete-opcao.escolhida { background: #f6faf6; box-shadow: inset 3px 0 0 #2e7d32; }

/* ===== Frete: painel ===== */
.frete-cartoes { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; }
.frete-cartoes .formulario { max-width: none; }
.frete-admin h2, #faixas h2 { margin: 0; font-size: 1.15rem; }
.frete-estados { margin-bottom: 20px; }
.frete-estados .tabela input[type=text], .frete-faixas input[type=text] { width: 100%; padding: 6px 8px; font-size: .9rem; }
.frete-estados .tabela td { padding: 6px 12px; }
.frete-regiao td { background: #f3f4f6; }
.frete-salvar { position: sticky; bottom: 0; background: var(--cor-fundo); padding: 12px 0; margin-bottom: 20px; z-index: 5; }
#faixas { margin-bottom: 20px; }
.frete-faixas td { padding: 6px 8px; }
.frete-faixas .campo-cep { min-width: 100px; }
.frete-faixas input[name=nome] { min-width: 170px; }
#faixas { max-width: none; }
.frete-nova-faixa td { background: #f9fafb; }
#sim-resultado ul { margin: 8px 0 0; padding-left: 18px; }

/* Resultado do frete na página do produto */
.frete-resultado { max-width: 520px; font-size: .88rem; }
.frete-para { color: #555; margin: 8px 0; }
.frete-para strong { color: var(--cor-texto); }
.frete-tabela { border: 1px solid #e5e5e5; }
.frete-linha { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 12px 10px; }
.frete-linha + .frete-linha { border-top: 1px solid #e5e5e5; }
.frete-linha > span { display: flex; flex-direction: column; gap: 2px; }
.frete-linha small { color: var(--cor-suave); font-size: .78rem; }
.frete-linha small:empty { display: none; }
.frete-linha .frete-valor { white-space: nowrap; color: var(--cor-texto); }

/* Lojas de retirada no painel */
.loja-cartao { border: 1px solid var(--cor-borda); border-radius: var(--raio); padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.loja-nova { background: #f9fafb; border-style: dashed; }
.loja-campos { display: grid; grid-template-columns: 1.2fr 2fr 1.2fr .6fr 1fr; gap: 10px; }
.loja-campos label { font-size: .82rem; }
.loja-campos input, .loja-campos select { width: 100%; padding: 7px 9px; font-size: .9rem; }
.loja-campos label:nth-child(6) { grid-column: span 3; }
.loja-campos label:nth-child(7) { grid-column: span 2; }
.loja-acoes { display: flex; align-items: center; gap: 14px; }
.destaque-retirada { background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 6px; padding: 8px 10px; }

/* Dúvidas frequentes (perguntas que abrem e fecham) */
.pagina-faq h1 { margin-bottom: 20px; }
.faq { border-bottom: 1px solid var(--cor-borda); }
.faq summary {
    list-style: none; cursor: pointer; padding: 18px 28px 18px 0; position: relative;
    font-weight: 600; font-size: 1rem; color: var(--cor-titulo);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
    content: ""; position: absolute; right: 6px; top: 50%; width: 7px; height: 7px; margin-top: -6px;
    border-right: 1.5px solid #999; border-bottom: 1.5px solid #999; transform: rotate(45deg); transition: transform .2s;
}
.faq[open] summary::after { transform: rotate(-135deg); margin-top: -2px; }
.faq summary:hover { color: var(--cor-principal); }
.faq-resposta { padding: 0 0 18px; color: #555; line-height: 1.7; }
.faq-resposta p { margin: 0 0 10px; }

/* Página de Atendimento */
.pagina-atendimento { text-align: center; max-width: 900px; }
.pagina-atendimento h1 { font-size: 1.4rem; margin-bottom: 8px; }
.pagina-atendimento > p { color: #444; margin: 0 0 14px; line-height: 1.7; }
.form-contato { max-width: 540px; margin: 40px auto 10px; display: flex; flex-direction: column; gap: 16px; text-align: left; }
.form-contato label { display: flex; flex-direction: column; gap: 8px; font-size: .92rem; color: #2a3510; }
.form-contato input, .form-contato textarea { border: 1px solid #777; border-radius: 3px; padding: 10px 14px; font-size: .9rem; }
.form-contato button {
    background: #24300a; color: #fff; border: none; padding: 13px; cursor: pointer;
    font-weight: 700; font-size: .82rem; text-transform: uppercase; letter-spacing: .03em;
}
.form-contato button:hover { background: #3a4a12; }

/* Mensagens no painel */
.contador-menu { background: #ef4444; color: #fff; border-radius: 999px; padding: 0 7px; font-size: .75rem; font-weight: 700; }
.mensagem { background: #fff; border-radius: var(--raio); padding: 16px 18px; margin-bottom: 12px; border-left: 4px solid transparent; }
.mensagem-nova { border-left-color: var(--cor-principal); }
.mensagem-topo { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.mensagem-topo a { margin-left: 8px; font-size: .9rem; }
.mensagem p { margin: 10px 0 14px; white-space: normal; }

/* Admin → Aparência */
.aparencia { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 24px; align-items: start; }
.aparencia .formulario { max-width: none; }
.aparencia h2 { margin: 10px 0 0; font-size: 1.1rem; }
.logo-atual { background: #f3f4f6; border-radius: 8px; padding: 12px; display: inline-block; }
.logo-atual img { display: block; max-width: 100%; }
.grade-cores { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.campo-cor { flex-direction: row !important; align-items: center; gap: 10px !important; border: 1px solid var(--cor-borda); border-radius: 8px; padding: 8px 10px; cursor: pointer; }
.campo-cor input { width: 42px; height: 34px; padding: 0; border: none; background: none; cursor: pointer; flex-shrink: 0; }
.campo-cor span { display: flex; flex-direction: column; font-weight: 600; font-size: .88rem; }
.campo-cor small { font-weight: 400; color: var(--cor-suave); font-family: monospace; }
.previa-aparencia { position: sticky; top: 16px; background: #fff; border-radius: var(--raio); padding: 18px; }
.previa-aparencia h2 { margin: 0; font-size: 1.1rem; }
.previa { border: 1px solid var(--cor-borda); border-radius: 8px; overflow: hidden; background: var(--cor-fundo); }
.previa-faixa { background: var(--aviso-fundo); color: var(--aviso-texto); text-align: center; font-size: .65rem; font-weight: 700; text-transform: uppercase; padding: 5px; }
.previa-cabecalho { background: var(--cab-fundo); color: var(--cab-texto); display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-bottom: 1px solid var(--cor-borda); }
.previa-logo { font-weight: 800; flex-shrink: 0; max-width: 140px; overflow: hidden; }
.previa-logo img { display: block; max-width: 140px; object-fit: contain; }
.previa-menu { flex: 1; font-size: .6rem; text-align: center; white-space: nowrap; }
.previa-icones { display: flex; gap: 6px; }
.previa-corpo { background: #fff; margin: 12px; padding: 14px; border-radius: 8px; }
.previa-titulo { margin: 0 0 6px; font-size: .95rem; color: var(--cor-titulo); }
.previa-preco { font-weight: 700; font-size: 1.3rem; color: var(--cor-preco); margin-bottom: 10px; }
.previa-botao { background: var(--cor-principal); color: #fff; text-align: center; padding: 9px; border-radius: 8px; font-weight: 600; font-size: .85rem; }

/* Admin → Rodapé */
.rodape-admin { display: flex; flex-direction: column; gap: 20px; }
.rodape-admin h2 { margin: 0; font-size: 1.1rem; }
.destaque-secao { border: 2px solid var(--cor-principal); }
.previa-rodape { background: #fff; border: 1px dashed var(--cor-borda); border-radius: 8px; padding: 10px 14px; text-align: center; color: #666; font-size: .85rem; }
.previa-rodape p { margin: 3px 0; }
.previa-rodape .ajuda { display: block; text-align: left; }
.grade-beneficios { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.grade-beneficios > *, .beneficio-admin .linha > * { min-width: 0; }
.beneficio-admin input, .beneficio-admin textarea { width: 100%; }
.beneficio-admin { border: 1px solid var(--cor-borda); border-radius: 8px; padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.beneficio-admin strong { display: flex; align-items: center; gap: 8px; }
.beneficio-admin label { font-size: .85rem; }
.grade-pagamentos-admin { display: flex; flex-wrap: wrap; gap: 10px 22px; }
.grade-pagamentos-admin label { display: flex; align-items: center; gap: 8px; }

/* Pagamento do pedido (Pix com QR Code, empresas) */
.caixa-pagamento { background: #fff; border: 2px solid var(--cor-principal); border-radius: var(--raio); padding: 20px; margin-bottom: 20px; text-align: center; }
.caixa-pagamento.pago { border-color: var(--cor-sucesso); }
.caixa-pagamento h2 { margin-top: 0; font-size: 1.2rem; }
.valor-pix { font-size: 1.1rem; }
.qr-pix { width: 240px; max-width: 100%; margin: 6px auto 12px; }
.qr-pix svg { display: block; width: 100%; height: auto; }
.copia-cola { display: flex; gap: 8px; max-width: 520px; margin: 0 auto 10px; }
.copia-cola input { flex: 1; min-width: 0; font-family: monospace; font-size: .8rem; }
.ajuda-pix { color: var(--cor-suave); font-size: .85rem; }

/* Admin → Pagamentos */
.pagamentos-admin { display: flex; flex-direction: column; gap: 20px; }
.pagamentos-admin h2 { margin: 0; font-size: 1.1rem; }
.pag-cabeca { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.interruptor { flex-direction: row !important; align-items: center; gap: 6px !important; font-weight: 700; background: #f3f4f6; padding: 6px 12px; border-radius: 999px; cursor: pointer; }
.pix-admin { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 20px; align-items: start; }
.pix-campos { display: flex; flex-direction: column; gap: 12px; }
.pix-exemplo { text-align: center; }
.pix-exemplo .qr-pix { width: 180px; }
.campo-curto { max-width: 260px; }

/* Ligar e desligar formas de pagamento */
.interruptores-pagamento { margin-bottom: 20px; gap: 0 !important; }
.interruptores-pagamento h2 { margin: 0 0 4px; font-size: 1.1rem; }
.interruptores-pagamento > .ajuda { margin: 0 0 10px; }
.linha-interruptor { display: flex; align-items: center; gap: 14px; padding: 12px 0; border-top: 1px solid var(--cor-borda); }
.nome-forma { flex: 1; font-weight: 600; display: flex; flex-direction: column; }
.situacao { font-size: .8rem; font-weight: 700; color: var(--cor-suave); min-width: 80px; text-align: right; }
.situacao.ligada { color: var(--cor-sucesso); }
.chave-liga { position: relative; width: 48px; height: 26px; border-radius: 999px; border: none; background: #cbd5e1; cursor: pointer; flex-shrink: 0; transition: background .2s; }
.chave-liga span { position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: left .2s; }
.chave-liga.ligada { background: var(--cor-sucesso); }
.chave-liga.ligada span { left: 25px; }
.chave-liga:disabled { opacity: .45; cursor: not-allowed; }
.chave-liga:focus-visible { outline: 2px solid var(--cor-principal); outline-offset: 2px; }

/* Cartão de crédito dentro da loja */
.form-cartao { text-align: left; }
.cartao-grade { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items: end; }
.cartao-grade label { display: block; font-size: .82rem; color: #333; }
.cartao-grade input, .cartao-grade select { display: block; width: 100%; margin-top: 5px; border: 1px solid #ddd; border-radius: 3px; padding: 10px 12px; font-size: .92rem; background: #fff; }
.cartao-inteiro { grid-column: 1 / -1; }
.cartao-numero { position: relative; display: block; }
.cartao-numero input { padding-right: 90px; letter-spacing: .04em; }
.cartao-bandeira { position: absolute; right: 10px; top: 50%; transform: translateY(-30%); font-size: .75rem; font-weight: 800; color: var(--cor-principal); }
.cartao-erro { color: var(--cor-erro); font-weight: 600; font-size: .85rem; margin: 10px 0 0; min-height: 1em; }
.cartao-erro:empty { display: none; }
.cartao-seguro { color: var(--cor-suave); font-size: .78rem; margin: 10px 0 0; }
.form-pagar-cartao { max-width: 480px; margin: 0 auto; display: flex; flex-direction: column; gap: 12px; }

/* ===== Celular ===== */
@media (max-width: 1100px) {
    .cabecalho-conteudo { gap: 12px; min-height: 60px; }
    .cab-abrir-menu { display: flex !important; }
    .cab-logo { flex: 1; justify-content: center; font-size: 1.25rem; }
    .cab-logo img { max-height: 52px; max-width: 70vw; }
    .cab-conta span { display: none; }
    .cab-menu {
        position: fixed; top: 0; left: 0; bottom: 0; width: 280px; max-width: 85vw; z-index: 60;
        background: var(--cab-fundo); flex-direction: column; justify-content: flex-start; flex-wrap: nowrap; gap: 0;
        padding: 56px 20px 20px; transform: translateX(-100%); transition: transform .25s; overflow-y: auto;
    }
    .cab-menu a { font-size: .95rem; padding: 14px 0; border-bottom: 1px solid var(--cor-borda); }
    .cab-menu a.ativo { border-bottom-color: var(--cor-borda); color: var(--cor-principal); font-weight: 700; }
    .cab-menu-conta { display: block !important; }
    .cab-fechar-menu { display: flex !important; position: absolute; top: 12px; right: 12px; }
    .menu-aberto .cab-menu { transform: none; }
    .menu-aberto .cab-fundo { display: block; position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 55; }
}

@media (max-width: 720px) {
    .produto-detalhe, .checkout, .linha, .linha.linha-2 { grid-template-columns: 1fr; }
    .tabela { display: block; overflow-x: auto; }
    .menu-admin { margin-left: 0; }
}

@media (max-width: 900px) {
    .pix-admin { grid-template-columns: 1fr; }
    .grade-beneficios { grid-template-columns: 1fr; }
    .aparencia { grid-template-columns: 1fr; }
    .previa-aparencia { position: static; }
    .loja-campos { grid-template-columns: 1fr 1fr; }
    .loja-campos label:nth-child(n) { grid-column: auto; }
    .loja-campos .loja-endereco { grid-column: 1 / -1; }
    .frete-cartoes { grid-template-columns: 1fr; }
    .ck-colunas { grid-template-columns: 1fr; }
    .ck-pedido { margin-top: 28px; }
    .conta-colunas { grid-template-columns: 1fr; }
    .editor-pagina { grid-template-columns: 1fr; }
    .pp-topo { grid-template-columns: 1fr; gap: 24px; padding: 18px; }
    .pp-grade-relacionados { grid-template-columns: repeat(2, 1fr); }
    .rodape-grade-beneficios { grid-template-columns: repeat(2, 1fr); }
    .rodape-colunas { grid-template-columns: 1fr 1fr; }
    .rodape-newsletter { grid-column: 1 / -1; }
}

@media (max-width: 520px) {
    .cartao-grade { grid-template-columns: 1fr; }
    .ck-grade { grid-template-columns: 1fr; }
    .ck-senha-conta { max-width: none; }
    .ck-pedido { padding: 8px 12px 20px; }
    .ck-tabela { padding: 4px 10px; }
    .pp-galeria { flex-direction: column-reverse; }
    .pp-miniaturas { flex-direction: row; overflow-x: auto; max-width: 100%; }
    .pp-form-linha { grid-template-columns: 1fr; }
    .pp-abas, .pp-avaliacoes { padding-left: 16px; padding-right: 16px; }
    .rodape-grade-beneficios, .rodape-colunas { grid-template-columns: 1fr; }
    .rodape-colunas { text-align: center; }
    .rodape-redes { justify-content: center; }
}

/* Admin: parcelas de todos os produtos */
.parcelas-todos { display: flex; flex-direction: row; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin-bottom: 20px; }
.parcelas-todos label { flex: 1 1 280px; margin: 0; }
.parcelas-todos .ajuda { flex-basis: 100%; margin: 0; }

/* Admin: favicon */
.favicon-atual { display: flex; align-items: center; gap: 14px; }
.favicon-atual > img { border-radius: 6px; border: 1px solid var(--cor-borda); padding: 4px; background: #fff; }
.previa-aba { display: inline-flex; align-items: center; gap: 8px; background: #eef0f3; border-radius: 8px 8px 0 0; padding: 7px 14px; font-size: .85rem; font-weight: 400; max-width: 260px; overflow: hidden; white-space: nowrap; }

/* Selos de qualidade e segurança */
.selo-link { text-decoration: none; display: inline-flex; }
.selo-imagem { display: inline-flex; align-items: center; background: #fff; border: 1px solid #ddd; border-radius: 4px; padding: 3px 6px; }
.selo-imagem img { height: 46px; width: auto; display: block; }
.selos-admin { display: flex; flex-direction: column; gap: 10px; }
.selo-admin { display: flex; gap: 16px; align-items: center; border: 1px solid var(--cor-borda); border-radius: 8px; padding: 12px; }
.selo-admin-previa { flex: 0 0 150px; display: flex; justify-content: center; background: #f5f5f5; border-radius: 6px; padding: 10px; }
.selo-admin-campos { flex: 1; display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.selo-admin-campos label { flex: 1 1 130px; }
.selo-admin-campos .selo-ordem { flex: 0 0 70px; }
.selo-admin-campos .selo-link-campo { flex: 2 1 200px; }
.selo-admin-campos .checkbox { flex: 0 0 auto; padding-bottom: 8px; }
.selos-novos { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; }
.selo-novo input[type=file] { max-width: 100%; }
.selo-novo { border: 1px dashed var(--cor-borda); border-radius: 8px; padding: 12px; display: flex; flex-direction: column; gap: 10px; }
.selo-novo h3 { margin: 0; font-size: 1rem; }
@media (max-width: 760px) {
    .selo-admin { flex-direction: column; align-items: stretch; }
    .selo-admin-previa { flex-basis: auto; }
    .selos-novos { grid-template-columns: 1fr; }
}
.selo-novo .linha > *, .selo-novo label { min-width: 0; }
.selo-novo input, .selo-novo select { width: 100%; min-width: 0; box-sizing: border-box; }

/* Admin: Google Shopping */
.formulario .copia-cola { margin: 0; max-width: none; }
.texto-ok { color: #1b7f3b; font-weight: 600; }
.texto-erro { color: #b42318; font-size: .9rem; }
.passos-google { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; font-size: .95rem; }
.formulario h3 { margin: 6px 0 0; font-size: 1rem; }

/* Ficha técnica dentro da descrição */
.ficha-tecnica { margin: 12px 0 18px; border: 1px solid var(--cor-borda); border-radius: 8px; overflow: hidden; border-collapse: separate; border-spacing: 0; }
.ficha-tecnica tr:nth-child(even) th, .ficha-tecnica tr:nth-child(even) td { background: #f7f8f9; }
.ficha-tecnica tr:last-child th, .ficha-tecnica tr:last-child td { border-bottom: 0; }
.ficha-tecnica th { width: 38%; font-weight: 600; color: #333; background: #fff; }
.pp-tabela-info tr:nth-child(even) th, .pp-tabela-info tr:nth-child(even) td { background: #f7f8f9; }
.ficha-lista { list-style: none; padding: 0; margin: 12px 0 18px; border: 1px solid var(--cor-borda); border-radius: 8px; overflow: hidden; }
.ficha-lista li { padding: 9px 14px; border-bottom: 1px solid var(--cor-borda); }
.ficha-lista li:last-child { border-bottom: 0; }
.ficha-lista li:nth-child(even) { background: #f7f8f9; }
@media (max-width: 600px) {
    .ficha-tecnica th, .ficha-tecnica td { display: block; width: auto; }
    .ficha-tecnica th { padding-bottom: 2px; border-bottom: 0; }
    .ficha-tecnica td { padding-top: 0; }
}
.pp-aba .ficha-lista, .ficha-lista { padding-left: 0; margin-left: 0; }

/* Página do produto: marca, SKU e código de barras abaixo do nome */
.pp-codigos { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: -4px 0 12px; font-size: .85rem; color: var(--cor-suave, #666); }
.pp-codigos strong { color: #333; font-weight: 600; }

/* Página do produto: nada pode passar da largura da tela (ex.: muitas miniaturas no celular) */
.pp-topo > *, .pp-galeria, .pp-foto-principal, .pp-info { min-width: 0; }
.pp-info h1 { overflow-wrap: anywhere; }
@media (max-width: 520px) {
    .pp-miniaturas { width: 100%; padding-bottom: 4px; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
    .pp-miniatura { flex: 0 0 64px; width: 64px; height: 64px; scroll-snap-align: start; }
    .pp-comprar { flex-wrap: wrap; }
    .pp-comprar .btn-comprar { flex: 1 1 160px; }
}

/* Aviso de cookies (LGPD) */
.aviso-cookies { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 1000; display: flex; justify-content: center; }
.aviso-cookies[hidden] { display: none; }
.aviso-cookies-caixa { background: #fff; color: #333; max-width: 920px; width: 100%; border-radius: 12px; box-shadow: 0 10px 40px rgba(0,0,0,.25);
    padding: 18px 20px; display: flex; flex-direction: column; gap: 14px; max-height: calc(100vh - 32px); overflow-y: auto; }
.aviso-cookies-texto { margin: 0; font-size: .92rem; line-height: 1.5; }
.aviso-cookies-texto a { color: var(--cor-principal, #24300a); font-weight: 600; }
.aviso-cookies-opcoes { display: flex; flex-direction: column; gap: 10px; }
.aviso-cookies-opcoes[hidden] { display: none; }
.cookies-opcao { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid #e5e7eb; border-radius: 8px; font-size: .9rem; cursor: pointer; }
.cookies-opcao input { margin-top: 3px; width: 18px; height: 18px; accent-color: var(--cor-principal, #24300a); flex-shrink: 0; }
.cookies-opcao small { display: block; color: #666; margin-top: 2px; line-height: 1.4; }
.aviso-cookies-botoes { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; align-items: center; }
.aviso-cookies-botoes [hidden] { display: none; }
.btn-cookies, .btn-cookies-secundario { border-radius: 8px; padding: 10px 18px; font-weight: 700; font-size: .9rem; cursor: pointer; font-family: inherit; }
.btn-cookies { background: var(--cor-principal, #24300a); color: #fff; border: 1px solid var(--cor-principal, #24300a); }
.btn-cookies-secundario { background: #fff; color: #333; border: 1px solid #cfd4da; }
.btn-cookies-link { background: none; border: 0; color: #555; text-decoration: underline; cursor: pointer; font-size: .9rem; margin-right: auto; font-family: inherit; }
.link-cookies { color: inherit; font-size: .85rem; }
@media (max-width: 600px) {
    .aviso-cookies { left: 8px; right: 8px; bottom: 8px; }
    .aviso-cookies-botoes { justify-content: stretch; }
    .btn-cookies, .btn-cookies-secundario { flex: 1 1 100%; }
    .btn-cookies-link { margin: 0 auto; order: 5; }
}
.campo-codigo { font-family: monospace; font-size: .82rem; }

/* Carrinho no celular: cada produto vira um cartão (sem colunas espremidas) */
.item-produto img { object-fit: contain; background: #fff; flex-shrink: 0; }
@media (max-width: 640px) {
    .tabela-carrinho, .tabela-carrinho tbody { display: block; width: 100%; }
    .tabela-carrinho thead { display: none; }
    .tabela-carrinho tr { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 12px; padding: 14px; border-bottom: 1px solid var(--cor-borda); }
    .tabela-carrinho td { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 0; border: 0; }
    .tabela-carrinho td[data-rotulo]::before { content: attr(data-rotulo); color: var(--cor-suave, #666); font-size: .8rem; }
    .tabela-carrinho .item-produto { grid-column: 1 / -1; justify-content: flex-start; font-weight: 600; line-height: 1.35; margin-bottom: 6px; }
    .tabela-carrinho .item-produto img { width: 64px; height: 64px; }
    .tabela-carrinho td[data-rotulo="Preço"], .tabela-carrinho td[data-rotulo="Subtotal"] { grid-column: 1 / -1; }
    .tabela-carrinho td[data-rotulo="Quantidade"] { grid-column: 1 / 2; }
    .tabela-carrinho .item-subtotal { font-weight: 700; }
    .tabela-carrinho .item-remover { grid-column: 2 / 3; justify-content: flex-end; }
    .tabela-carrinho .qtd { width: 72px; }
    .carrinho-acoes > * { flex: 1 1 100%; }
    .carrinho-acoes .btn, .carrinho-acoes button { width: 100%; text-align: center; }
}
@media (max-width: 640px) {
    .carrinho-acoes .total { text-align: right; font-size: 1.1rem; order: -1; }
    .carrinho-acoes a.btn:not(.btn-secundario) { order: -1; padding: 14px; font-size: 1rem; }
}
@media (max-width: 640px) {
    .tabela-carrinho td[data-rotulo="Preço"] { grid-row: 2; }
    .tabela-carrinho td[data-rotulo="Quantidade"] { grid-row: 3; grid-column: 1; justify-content: flex-start; gap: 12px; }
    .tabela-carrinho .item-remover { grid-row: 3; grid-column: 2; }
    .tabela-carrinho td[data-rotulo="Subtotal"] { grid-row: 4; }
}

/* Admin: prévia do cabeçalho no celular */
.previa-celular { width: 360px; max-width: 100%; display: flex; align-items: center; gap: 10px; padding: 8px 12px; background: #fff;
    border: 1px solid var(--cor-borda); border-radius: 10px; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
.previa-celular-logo { flex: 1; display: flex; justify-content: center; font-weight: 800; overflow: hidden; }
.previa-celular-logo img { display: block; width: auto; max-width: 70%; object-fit: contain; }
.previa-celular-icone { font-size: 1.2rem; color: #555; }
