@import url("hero-desktop.css");

/* =========================
   CONFIGURAÇÕES GERAIS
========================= */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --cor-primaria: #22c55e;
    --cor-primaria-escura: #16a34a;
    --cor-verde-suave: #dcfce7;
    --cor-fundo: #f8fafc;
    --cor-card: #ffffff;
    --cor-texto: #1f2937;
    --cor-texto-suave: #64748b;
    --cor-borda: #e2e8f0;
    --cor-vermelho: #ef4444;
    --sombra: 0 10px 25px rgba(0, 0, 0, 0.06);
    --sombra-forte: 0 18px 40px rgba(0, 0, 0, 0.12);
}

body {
    font-family: Arial, sans-serif;
    background: var(--cor-fundo);
    color: var(--cor-texto);
    line-height: 1.5;
}

a {
    text-decoration: none;
}

img {
    display: block;
    max-width: 100%;
}

input,
select,
textarea {
    font-family: inherit;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--cor-primaria) !important;
    box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.12);
    outline: none;
}

/* =========================
   TOPO / HEADER
========================= */

.topo-info {
    background: #14532d;
    color: white;
    font-size: 13px;
    padding: 6px 20px;
    display: flex;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap;
}

.topo {
    background: white;
    color: var(--cor-texto);
    padding: 18px 40px 14px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    position: sticky;
    top: 0;
    z-index: 1000;
    border-bottom: 4px solid var(--cor-primaria);
}

.topo-superior {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 20px;
}

.logo-area {
    background: white;
    padding: 8px 14px;
    border-radius: 16px;
    display: flex;
    align-items: center;
}

.logo-link {
    display: flex;
    align-items: center;
}

.logo-img {
    height: 48px;
    width: auto;
    object-fit: contain;
}

.busca {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    background: #f1f5f9;
    border-radius: 999px;
    padding: 6px;
}

.busca input {
    flex: 1;
    border: none;
    background: transparent;
    padding: 10px 14px;
    font-size: 14px;
}

.busca button {
    border: none;
    background: var(--cor-primaria);
    color: white;
    padding: 10px 16px;
    border-radius: 999px;
    font-weight: bold;
    cursor: pointer;
    transition: 0.25s;
}

.busca button:hover {
    background: var(--cor-primaria-escura);
}

.acoes-topo {
    display: flex;
    align-items: center;
    gap: 16px;
}

.carrinho-topo {
    background: var(--cor-primaria);
    color: white;
    border-radius: 50%;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 48px;
    height: 48px;
    transition: 0.25s ease;
}

.carrinho-topo:hover {
    background: var(--cor-primaria-escura);
    transform: scale(1.04);
}

.icone-carrinho {
    width: 23px;
    height: 23px;
    object-fit: contain;
}

.contador-carrinho {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--cor-vermelho);
    color: white;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.usuario-info {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.nome-usuario {
    font-size: 13px;
    font-weight: bold;
    color: var(--cor-texto);
}

.btn-sair {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--cor-vermelho);
    font-weight: bold;
    transition: 0.2s;
}

.btn-sair:hover {
    color: #b91c1c;
}

.icone-sair {
    width: 14px;
    height: 14px;
}

.botoes-login-cadastro {
    display: flex;
    gap: 8px;
    justify-content: center;
    align-items: center;
}

.btn-topo-entrar,
.btn-topo-cadastrar {
    font-size: 12px;
    font-weight: bold;
    padding: 7px 10px;
    border-radius: 10px;
    transition: 0.25s;
}

.btn-topo-entrar {
    background: var(--cor-verde-suave);
    color: #166534;
    border: 1px solid #86efac;
}

.btn-topo-entrar:hover {
    background: #bbf7d0;
}

.btn-topo-cadastrar {
    background: var(--cor-primaria);
    color: white;
    border: 1px solid var(--cor-primaria);
}

.btn-topo-cadastrar:hover {
    background: var(--cor-primaria-escura);
}

.menu {
    margin-top: 10px;
    display: flex;
    gap: 20px;
    border-top: 1px solid #eee;
    padding-top: 10px;
    flex-wrap: wrap;
}

.menu a {
    color: var(--cor-texto);
    padding: 10px 16px;
    border-radius: 10px;
    transition: 0.25s;
    font-weight: 600;
}

.menu a:hover {
    background: var(--cor-verde-suave);
    color: var(--cor-primaria-escura);
}

/* =========================
   BASE / BOTÕES
========================= */

.conteudo {
    width: min(1200px, calc(100% - 32px));
    margin: 30px auto 50px;
}

.mini-destaque {
    display: inline-block;
    background: rgba(34, 197, 94, 0.15);
    color: var(--cor-primaria);
    padding: 7px 12px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: bold;
    margin-bottom: 16px;
}

.btn,
.btn-secundario,
.btn-outline-verde,
.btn-whatsapp,
.btn-whatsapp-home {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 12px 18px;
    border-radius: 12px;
    font-weight: bold;
    cursor: pointer;
    transition: transform 0.2s ease, filter 0.2s ease, background 0.2s ease;
    border: none;
}

.btn {
    background: linear-gradient(135deg, #22c55e, #16a34a);
    color: white;
}

.btn:hover,
.btn-secundario:hover,
.btn-whatsapp:hover,
.btn-whatsapp-home:hover,
.btn-outline-verde:hover {
    transform: translateY(-2px);
    filter: brightness(1.03);
}

.btn-secundario {
    background: white;
    color: var(--cor-texto);
    border: 1px solid var(--cor-borda);
}

.btn-outline-verde {
    color: white;
    border: 2px solid rgba(255,255,255,0.8);
    background: transparent;
}

.btn-outline-verde:hover {
    background: white;
    color: #14532d;
}

.icone-minimal {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: #ecfdf5;
    color: #166534;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 800;
    border: 1px solid #bbf7d0;
}

/* =========================
   HOME
========================= */


.atalhos-categorias {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin: 26px 0 34px;
}

.atalhos-categorias a {
    background: white;
    color: #14532d;
    border: 1px solid var(--cor-borda);
    border-radius: 18px;
    padding: 20px;
    box-shadow: var(--sombra);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    display: flex;
    align-items: center;
    gap: 10px;
}

.atalhos-categorias a:hover {
    transform: translateY(-5px);
    border-color: var(--cor-primaria);
}

.info-faixas {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin: 34px 0 36px;
}

.faixa-item {
    position: relative;
    overflow: hidden;
    background: white;
    padding: 26px;
    border-radius: 20px;
    box-shadow: 0 8px 22px rgba(0,0,0,0.06);
    border: 1px solid #e5e7eb;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.faixa-item::before {
    content: "";
    position: absolute;
    width: 70px;
    height: 70px;
    right: -20px;
    top: -20px;
    background: var(--cor-verde-suave);
    border-radius: 50%;
}

.faixa-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 14px 30px rgba(0,0,0,0.1);
}

.faixa-item h3 {
    color: var(--cor-primaria-escura);
    margin-bottom: 8px;
    letter-spacing: -0.2px;
}

.faixa-item p {
    color: var(--cor-texto-suave);
}

.bloco-confiança {
    margin-top: 50px;
    background: white;
    border: 1px solid var(--cor-borda);
    border-radius: 26px;
    padding: 34px;
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 24px;
    box-shadow: var(--sombra);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.bloco-confiança h2 {
    font-size: 34px;
    margin-bottom: 12px;
}

.bloco-confiança p {
    color: var(--cor-texto-suave);
}

.confiança-lista {
    display: grid;
    gap: 10px;
}

.confiança-lista span {
    background: #f0fdf4;
    color: #166534;
    padding: 12px 14px;
    border-radius: 14px;
    font-weight: bold;
    letter-spacing: -0.2px;
}

.chamada-whatsapp-home {
    margin-top: 50px;
    background: linear-gradient(135deg, #14532d, #16a34a);
    color: white;
    border-radius: 26px;
    padding: 34px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    box-shadow: var(--sombra);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.chamada-whatsapp-home h2 {
    font-size: 32px;
    margin-bottom: 10px;
}

.chamada-whatsapp-home p {
    color: #dcfce7;
}

.btn-whatsapp-home {
    background: white;
    color: #14532d;
    white-space: nowrap;
}

.btn-whatsapp-home img,
.btn-whatsapp img {
    width: 22px;
    height: 22px;
    object-fit: contain;
}

/* =========================
   TÍTULOS / CATÁLOGO
========================= */

.titulo-secao,
.pagina-topo {
    margin-bottom: 24px;
}

.titulo-secao {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 16px;
    flex-wrap: wrap;
}

.titulo-secao h2,
.pagina-topo h2 {
    font-size: 34px;
    line-height: 1.1;
}

.pagina-topo p:last-child {
    color: var(--cor-texto-suave);
    margin-top: 8px;
}

.topo-filtro {
    background: white;
    padding: 16px;
    border-radius: 16px;
    box-shadow: var(--sombra);
    margin-bottom: 24px;
}

.filtro-categorias {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 25px;
}

.filtro-categorias a {
    padding: 10px 14px;
    background: #f1f5f9;
    border-radius: 999px;
    border: 1px solid var(--cor-borda);
    color: var(--cor-texto);
    font-weight: 600;
    transition: 0.25s;
}

.filtro-categorias a:hover,
.filtro-categorias a.ativo {
    background: var(--cor-primaria);
    color: white;
}

/* =========================
   PRODUTOS
========================= */

.destaques {
    margin-top: 40px;
}

.grid-produtos {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 22px;
}

.card-produto {
    position: relative;
    background: white;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 8px 22px rgba(0,0,0,0.06);
    border: 1px solid #e5e7eb;
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.card-produto:hover {
    transform: translateY(-5px);
    box-shadow: var(--sombra-forte);
}

.selo-produto {
    position: absolute;
    top: 14px;
    left: 14px;
    background: var(--cor-primaria);
    color: white;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: bold;
    z-index: 2;
}

.card-imagem {
    background: #f9fafb;
    padding: 18px;
}

.card-imagem img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 14px;
}

.card-conteudo {
    padding: 20px;
}

.card-conteudo h3 {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 10px;
    min-height: 48px;
}

.categoria {
    color: var(--cor-texto-suave);
    font-size: 14px;
    margin-bottom: 10px;
}

.preco {
    font-size: 24px;
    color: var(--cor-primaria-escura);
    font-weight: bold;
    margin-bottom: 18px;
}

.card-conteudo .btn {
    width: 100%;
}

.sem-produtos {
    background: white;
    padding: 24px;
    border-radius: 20px;
    box-shadow: var(--sombra);
    border: 1px solid var(--cor-borda);
    text-align: center;
}

/* =========================
   CARRINHO / FINALIZAÇÃO
========================= */

.box-carrinho,
.carrinho-vazio {
    background: var(--cor-card);
    padding: 24px;
    border-radius: 20px;
    box-shadow: var(--sombra);
    border: 1px solid var(--cor-borda);
}

.carrinho-vazio {
    text-align: center;
}

.carrinho-vazio p {
    margin-bottom: 16px;
    font-size: 18px;
}

.tabela-carrinho {
    width: 100%;
    border-collapse: collapse;
}

.tabela-carrinho th,
.tabela-carrinho td {
    padding: 16px 14px;
    border-bottom: 1px solid var(--cor-borda);
    text-align: center;
}

.tabela-carrinho th {
    background: #f9fafb;
    color: var(--cor-texto);
    font-size: 15px;
}

.total-carrinho {
    margin-top: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.total-carrinho h3 {
    font-size: 28px;
}

.btn-remover {
    background: #dc2626;
    color: white;
    padding: 10px 14px;
    border-radius: 10px;
    display: inline-block;
    transition: 0.25s;
}

.btn-remover:hover {
    background: #b91c1c;
}

.box-finalizacao {
    margin-top: 24px;
    background: white;
    padding: 22px;
    border-radius: 18px;
    border: 1px solid var(--cor-borda);
    box-shadow: var(--sombra);
}

.box-finalizacao h3 {
    margin-bottom: 16px;
    color: #14532d;
}

.box-finalizacao label {
    display: block;
    font-weight: bold;
    margin: 12px 0 6px;
}

.box-finalizacao select,
.box-finalizacao textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--cor-borda);
    border-radius: 12px;
    font-size: 15px;
}

.box-finalizacao textarea {
    min-height: 90px;
    resize: vertical;
}

.box-finalizacao .btn {
    margin-top: 16px;
}

/* =========================
   LOGIN / CADASTRO
========================= */

.login-container,
.cadastro-container {
    min-height: 80vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(135deg, #f0fdf4, #ecfdf5);
}

.cadastro-container {
    min-height: 90vh;
}

.login-box,
.cadastro-box {
    width: 100%;
    background: white;
    padding: 40px;
    border-radius: 24px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.12);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.login-box {
    max-width: 420px;
    text-align: center;
}

.cadastro-box {
    max-width: 700px;
}

.login-header,
.cadastro-header {
    text-align: center;
    margin-bottom: 20px;
}

.logo-login {
    width: 140px;
    margin: 0 auto 10px;
}

.login-header h2,
.cadastro-header h2 {
    font-size: 24px;
    margin-bottom: 6px;
}

.login-header p {
    color: var(--cor-texto-suave);
    font-size: 14px;
}

.form-login {
    text-align: left;
}

.form-login label {
    font-weight: bold;
    font-size: 13px;
    margin-top: 12px;
    display: block;
}

.form-login input,
.form-cadastro-premium input,
.form-cadastro-premium select {
    width: 100%;
    padding: 12px;
    border-radius: 10px;
    border: 1px solid var(--cor-borda);
    margin-top: 6px;
}

.form-cadastro-premium h3 {
    margin: 20px 0 10px;
    color: var(--cor-primaria);
}

.grid-form,
.form-cadastro-premium .grid-form {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
}

.btn-login,
.btn-cadastro-grande {
    width: 100%;
    margin-top: 20px;
    padding: 14px;
    font-size: 16px;
}

.btn-cadastro-grande {
    padding: 16px;
}

.login-footer,
.cadastro-footer {
    text-align: center;
    margin-top: 20px;
}

.link-cadastro,
.cadastro-footer a {
    color: var(--cor-primaria);
    font-weight: bold;
}

.alerta-erro {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
    padding: 12px 14px;
    border-radius: 12px;
    font-weight: bold;
    margin-bottom: 18px;
}

/* =========================
   RODAPÉ
========================= */

.rodape {
    background: linear-gradient(180deg, #0f172a 0%, #020617 100%);
    color: #e2e8f0;
    margin-top: 80px;
    width: 100%;
    border-top: 4px solid #22c55e;
}

.rodape-conteudo {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 20px 40px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
}

.rodape-coluna h3 {
    font-size: 22px;
    margin-bottom: 14px;
    color: white;
}

.rodape-coluna h4 {
    font-size: 15px;
    margin-bottom: 14px;
    color: #22c55e;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.rodape-coluna p {
    margin-bottom: 10px;
    font-size: 14px;
    color: #cbd5e1;
    transition: 0.2s;
}

.rodape-coluna a {
    display: inline-block;
    color: #22c55e;
    font-weight: 500;
    transition: 0.2s;
}

.rodape-coluna a:hover {
    color: #4ade80;
    transform: translateX(3px);
}

.redes-sociais a {
    margin-right: 12px;
    font-size: 14px;
}

.redes-sociais {
    margin-top: 10px;
}

.redes-sociais a {
    display: inline-block;
    margin-right: 12px;
    font-weight: bold;
}

.rodape-final {
    border-top: 1px solid rgba(255,255,255,0.08);
    text-align: center;
    padding: 20px;
    font-size: 13px;
    color: #94a3b8;
}

.rodape-direitos {
    margin: 0;
}

.rodape-desenvolvedor {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px 9px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid rgba(255,255,255,0.055);
    color: #94a3b8;
    line-height: 1.45;
}

.rodape-desenvolvedor-rotulo {
    color: #cbd5e1;
}

.rodape-desenvolvedor strong {
    color: #4ade80;
    font-weight: 700;
    letter-spacing: .015em;
}

.rodape-desenvolvedor-escopo {
    color: #7f8ea3;
}

.rodape-desenvolvedor-escopo::before {
    content: "•";
    margin-right: 9px;
    color: rgba(74,222,128,.7);
}

.rodape-coluna {
    position: relative;
}

.rodape-coluna:not(:last-child)::after {
    content: "";
    position: absolute;
    right: -20px;
    top: 10px;
    width: 1px;
    height: 80%;
    background: rgba(255,255,255,0.05);
}

/* =========================
   RESPONSIVO
========================= */

@media (max-width: 992px) {
    .topo-superior {
        grid-template-columns: 1fr;
    }

    .info-faixas,
    .bloco-confiança {
        grid-template-columns: 1fr;
    }

    

    

    .atalhos-categorias {
        grid-template-columns: repeat(2, 1fr);
    }

    .chamada-whatsapp-home {
        flex-direction: column;
        align-items: flex-start;
    }

    .rodape-conteudo {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .topo {
        padding: 18px 16px 14px;
    }

    .conteudo {
        width: min(100% - 20px, 1200px);
        margin: 20px auto 40px;
    }

    .busca {
        flex-wrap: wrap;
    }

    .busca input {
        width: 100%;
    }

    .titulo-secao h2,
    .pagina-topo h2 {
        font-size: 28px;
    }

    .card-imagem img {
        height: 200px;
    }

    .tabela-carrinho {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }

    .total-carrinho {
        flex-direction: column;
        align-items: stretch;
    }

    .total-carrinho .btn {
        width: 100%;
    }

    .grid-form,
    .form-cadastro-premium .grid-form {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .topo-info {
        gap: 10px;
        font-size: 12px;
    }

    

    

    .atalhos-categorias,
    .rodape-conteudo {
        grid-template-columns: 1fr;
    }

    .chamada-whatsapp-home h2 {
        font-size: 24px;
    }

    .btn-whatsapp-home {
        width: 100%;
        text-align: center;
    }

    .logo-img {
        width: 180px;
    }

    .login-box,
    .cadastro-box {
        padding: 28px;
    }
}
@media (max-width: 900px) {
    .rodape-conteudo {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }

    .rodape-coluna::after {
        display: none;
    }
}

@media (max-width: 500px) {
    .rodape-conteudo {
        grid-template-columns: 1fr;
    }
}
/* RODAPÉ EXTRA PROFISSIONAL */

.rodape-extra {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px 20px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    border-top: 1px solid rgba(255,255,255,0.05);
}

.bloco-rodape h4 {
    color: #22c55e;
    margin-bottom: 12px;
    font-size: 14px;
    text-transform: uppercase;
}

.icones-pagamento,
.icones-seguranca {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.icones-pagamento img,
.icones-seguranca img {
    height: 28px;
    background: white;
    padding: 4px 6px;
    border-radius: 6px;
    transition: 0.2s;
}

.icones-pagamento img:hover,
.icones-seguranca img:hover {
    transform: scale(1.05);
}

.btn-mapa {
    display: inline-block;
    margin-top: 8px;
    padding: 10px 14px;
    background: #22c55e;
    color: white;
    border-radius: 8px;
    font-weight: bold;
}

.btn-mapa:hover {
    background: #16a34a;
}

/* RESPONSIVO */

@media (max-width: 900px) {
    .rodape-extra {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 500px) {
    .rodape-extra {
        grid-template-columns: 1fr;
    }
}
/* PRODUTOS EM DESTAQUE - MATRIZ 8x2 */

.destaques .grid-produtos {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 14px;
}

.destaques .card-produto {
    border-radius: 14px;
}

.destaques .card-imagem {
    padding: 10px;
}

.destaques .card-imagem img {
    height: 120px;
    border-radius: 10px;
}

.destaques .card-conteudo {
    padding: 12px;
}

.destaques .card-conteudo h3 {
    font-size: 13px;
    min-height: 38px;
    margin-bottom: 6px;
}

.destaques .categoria {
    font-size: 11px;
    margin-bottom: 5px;
}

.destaques .preco {
    font-size: 16px;
    margin-bottom: 10px;
}

.destaques .card-conteudo .btn {
    padding: 9px 10px;
    font-size: 12px;
}

.destaques .selo-produto,
.destaques .card-produto::after {
    font-size: 10px;
    padding: 4px 8px;
    top: 8px;
    left: 8px;
}

/* RESPONSIVO */
@media (max-width: 1200px) {
    .destaques .grid-produtos {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 700px) {
    .destaques .grid-produtos {
        grid-template-columns: repeat(2, 1fr);
    }
}
.textarea-entrega {
    width: 100%;
    min-height: 110px;
    margin-top: 14px;
    padding: 14px;
    border-radius: 12px;
    border: 1px solid var(--cor-borda);
    resize: vertical;
    font-size: 15px;
}
.card-produto {
    position: relative;
    overflow: visible;
}

.tag-promocao-img {
    position: absolute;
    top: -20px;
    left: -20px;
    width: 46px;
    height: auto;
    z-index: 10;
    pointer-events: none;
}

.card-imagem {
    overflow: hidden;
}

.preco-area {
    margin-bottom: 14px;
}

.preco-promocional-valor {
    color: #dc2626;
    font-size: 22px;
    font-weight: 800;
    margin-bottom: 4px;
}

.preco-original-cortado {
    color: #94a3b8;
    text-decoration: line-through;
    font-size: 14px;
    margin-bottom: 6px;
}

.contador-promocao {
    display: inline-block;
    background: #fff1f2;
    color: #be123c;
    border: 1px solid #fecdd3;
    padding: 5px 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: bold;
}



/* HERO SLIDER INTERATIVO */


/* =========================================================
   HOME PRO - layout limpo, moderno e com melhor aproveitamento
   Mantém as classes antigas e apenas melhora a apresentação.
========================================================= */

:root {
    --container-pro: 1280px;
    --radius-pro: 22px;
    --shadow-soft-pro: 0 12px 35px rgba(15, 23, 42, 0.08);
    --shadow-hover-pro: 0 22px 55px rgba(15, 23, 42, 0.14);
}

body {
    background:
        radial-gradient(circle at top left, rgba(34,197,94,0.09), transparent 30%),
        linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
}

.conteudo-pro,
.conteudo {
    width: min(var(--container-pro), calc(100% - 32px));
    margin: 22px auto 54px;
}

.topo-info-pro,
.topo-info {
    padding: 8px 18px;
    font-size: 12.5px;
    background: linear-gradient(90deg, #064e3b, #14532d);
}

.topo-pro,
.topo {
    padding: 14px 38px 10px;
    border-bottom: 1px solid rgba(34, 197, 94, 0.24);
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
    backdrop-filter: blur(10px);
}

.logo-area {
    padding: 0;
}

.logo-img {
    width: 190px;
}

.busca-pro,
.busca {
    max-width: 620px;
    margin: 0 auto;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.8);
}

.busca button {
    padding: 11px 18px;
}

.btn-header-whatsapp {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 13px;
    border-radius: 999px;
    background: #ecfdf5;
    color: #166534;
    border: 1px solid #bbf7d0;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}

.menu-pro,
.menu {
    justify-content: center;
    margin-top: 12px;
    padding-top: 10px;
    gap: 8px;
}

.menu a {
    padding: 9px 14px;
    font-size: 14px;
}


.home-metricas {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 28px;
}

.home-metricas div {
    background: rgba(255,255,255,0.92);
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 18px;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.05);
}

.home-metricas strong {
    display: block;
    color: #14532d;
    font-size: 24px;
    line-height: 1;
    margin-bottom: 6px;
}

.home-metricas span {
    color: #64748b;
    font-size: 13px;
    font-weight: 700;
}

.atalhos-pro,
.atalhos-categorias {
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 12px;
    margin: 26px 0 32px;
}

.atalhos-categorias a {
    min-height: 78px;
    padding: 16px;
    border-radius: 18px;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.05);
}

.info-pro,
.info-faixas {
    gap: 14px;
    margin: 28px 0 34px;
}

.faixa-item {
    padding: 22px;
    border-radius: 20px;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.05);
}

.icone-info {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: #ecfdf5;
    margin-bottom: 12px;
}

.titulo-pro {
    margin-top: 10px;
    padding-top: 8px;
}

.titulo-pro h2,
.titulo-secao h2 {
    font-size: clamp(28px, 3vw, 40px);
    letter-spacing: -0.8px;
}

.titulo-pro span {
    color: #64748b;
    display: block;
    margin-top: 6px;
}

.grid-produtos-home-pro,
.destaques .grid-produtos {
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 18px;
}

.card-produto-pro,
.card-produto {
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid #e5e7eb;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
    background: rgba(255,255,255,0.96);
}

.card-produto:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-hover-pro);
    border-color: rgba(34, 197, 94, 0.35);
}

.card-imagem {
    padding: 12px;
    background: linear-gradient(180deg, #f8fafc, #f1f5f9);
}

.card-imagem img,
.destaques .card-imagem img {
    height: 160px;
    object-fit: cover;
    border-radius: 14px;
}

.card-conteudo,
.destaques .card-conteudo {
    padding: 16px;
}

.card-conteudo h3,
.destaques .card-conteudo h3 {
    font-size: 15px;
    min-height: 44px;
    line-height: 1.25;
}

.destaques .categoria,
.categoria {
    font-size: 12px;
    font-weight: 700;
    color: #64748b;
}

.preco,
.destaques .preco {
    font-size: 20px;
    margin-bottom: 12px;
}

.card-conteudo .btn,
.destaques .card-conteudo .btn {
    padding: 11px 12px;
    font-size: 13px;
    border-radius: 12px;
}

.selo-promocao-pro {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 5;
    background: #dc2626;
    color: #fff;
    padding: 7px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 900;
    box-shadow: 0 8px 18px rgba(220, 38, 38, 0.28);
}

.bloco-pro,
.bloco-confiança {
    margin-top: 46px;
    border-radius: 28px;
    padding: 34px;
    box-shadow: var(--shadow-soft-pro);
}

.bloco-confiança h2 {
    letter-spacing: -0.7px;
}

.confiança-lista span {
    display: flex;
    align-items: center;
    gap: 10px;
}

.chamada-pro,
.chamada-whatsapp-home {
    margin-top: 34px;
    border-radius: 28px;
    padding: 34px;
    box-shadow: var(--shadow-soft-pro);
    background:
        radial-gradient(circle at top right, rgba(74,222,128,0.28), transparent 34%),
        linear-gradient(135deg, #064e3b, #16a34a);
}

.rodape {
    margin-top: 64px;
}

@media (max-width: 1050px) {
    .topo-superior {
        grid-template-columns: 1fr;
    }

    .busca-pro,
    .busca {
        max-width: 100%;
    }

    .acoes-topo {
        justify-content: center;
        flex-wrap: wrap;
    }

    .home-metricas {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .conteudo-pro,
    .conteudo {
        width: min(100% - 20px, var(--container-pro));
        margin-top: 16px;
    }

    

    

    .info-faixas,
    .home-metricas {
        grid-template-columns: 1fr;
    }

    .bloco-confiança,
    .chamada-whatsapp-home {
        padding: 24px;
    }
}

@media (max-width: 520px) {
    .topo {
        padding: 12px 12px 10px;
    }

    .logo-img {
        width: 160px;
        margin: 0 auto;
    }

    .btn-header-whatsapp {
        display: none;
    }

    .grid-produtos-home-pro,
    .destaques .grid-produtos {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .card-imagem img,
    .destaques .card-imagem img {
        height: 128px;
    }

    .card-conteudo,
    .destaques .card-conteudo {
        padding: 12px;
    }

    .card-conteudo h3,
    .destaques .card-conteudo h3 {
        font-size: 13px;
        min-height: 40px;
    }

    .preco,
    .destaques .preco {
        font-size: 16px;
    }
}

/* =========================
   HERO FULL WIDTH
========================= */


/* =========================
   FOOTER FULL WIDTH
========================= */

.rodape {
    width: 100%;
    margin-top: 80px;
}

/* =========================
   DROPDOWN CATEGORIAS
========================= */

.menu {
    align-items: center;
}

.menu-dropdown {
    position: relative;
}

.menu-link {
    display: inline-block;
}

.dropdown-categorias {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 230px;
    background: white;
    border: 1px solid var(--cor-borda);
    border-radius: 14px;
    box-shadow: var(--sombra-forte);
    padding: 8px;
    display: none;
    z-index: 2000;
}

.dropdown-categorias a {
    display: block;
    padding: 10px 12px;
    color: var(--cor-texto);
    border-radius: 10px;
    font-size: 14px;
}

.dropdown-categorias a:hover {
    background: var(--cor-verde-suave);
    color: var(--cor-primaria-escura);
}

.menu-dropdown:hover .dropdown-categorias {
    display: block;
}

/* =========================
   BOTÃO TEMA
========================= */

.btn-tema {
    border: 1px solid var(--cor-borda);
    background: white;
    color: var(--cor-texto);
    padding: 9px 13px;
    border-radius: 999px;
    cursor: pointer;
    font-weight: bold;
}

/* =========================
   MODO ESCURO
========================= */

body.modo-escuro {
    --cor-fundo: #020617;
    --cor-card: #0f172a;
    --cor-texto: #e5e7eb;
    --cor-texto-suave: #94a3b8;
    --cor-borda: #1e293b;
    background: #020617;
    color: #e5e7eb;
}

body.modo-escuro .topo,
body.modo-escuro .card-produto,
body.modo-escuro .faixa-item,
body.modo-escuro .bloco-confiança,
body.modo-escuro .box-carrinho,
body.modo-escuro .topo-filtro,
body.modo-escuro .dropdown-categorias {
    background: #0f172a;
    border-color: #1e293b;
}

body.modo-escuro .menu a,
body.modo-escuro .dropdown-categorias a,
body.modo-escuro .card-conteudo h3,
body.modo-escuro .titulo-secao h2,
body.modo-escuro .pagina-topo h2 {
    color: #e5e7eb;
}

body.modo-escuro .busca {
    background: #1e293b;
}

body.modo-escuro .busca input {
    color: #e5e7eb;
}

body.modo-escuro .categoria,
body.modo-escuro .pagina-topo p,
body.modo-escuro .faixa-item p,
body.modo-escuro .bloco-confiança p {
    color: #94a3b8;
}

body.modo-escuro .btn-tema {
    background: #1e293b;
    color: #e5e7eb;
    border-color: #334155;
}
.theme-switch {
    width: 54px;
    height: 28px;
    border: none;
    border-radius: 999px;
    background: #cbd5e1;
    padding: 3px;
    cursor: pointer;
    position: relative;
    transition: background 0.25s ease;
}

.theme-switch-bolinha {
    width: 22px;
    height: 22px;
    background: white;
    border-radius: 50%;
    display: block;
    transition: transform 0.25s ease;
    box-shadow: 0 2px 6px rgba(0,0,0,0.25);
}

body.modo-escuro .theme-switch {
    background: #22c55e;
}

body.modo-escuro .theme-switch-bolinha {
    transform: translateX(26px);
}
/* =========================
   HEADER INTEGRADO AO HERO
========================= */

body.home-integrada .topo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background: transparent;
    border-bottom: none;
    box-shadow: none;
    z-index: 999;
}

body.home-integrada .topo-info {
    display: none;
}

/* TEXTO DO MENU BRANCO SOBRE O HERO */
body.home-integrada .menu a,
body.home-integrada .menu-link,
body.home-integrada .nome-usuario,
body.home-integrada .btn-topo-entrar,
body.home-integrada .btn-topo-cadastrar {
    color: white;
}

/* BUSCA ESCURA PARA CONTRASTE */
body.home-integrada .busca {
    background: rgba(255,255,255,0.12);
    backdrop-filter: blur(6px);
}

body.home-integrada .busca input {
    color: white;
}

/* HERO MAIS LIMPO NO TOPO */


/* GRADIENTE SUAVE DO HERO */


/* =========================
   HEADER FIXO AO ROLAR
========================= */

.topo.scroll {
    position: fixed !important;
    background: white !important;
    box-shadow: 0 8px 20px rgba(0,0,0,0.1);
    border-bottom: 4px solid var(--cor-primaria);
}

.topo.scroll .menu a,
.topo.scroll .menu-link,
.topo.scroll .nome-usuario {
    color: var(--cor-texto);
}

.topo.scroll .busca {
    background: #f1f5f9;
}

/* =========================
   ANIMAÇÃO SUAVE
========================= */

.topo {
    transition: all 0.3s ease;
}
/* HEADER APPLE STYLE */

.topo-integrado {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999;
    background: transparent;
}

/* HERO (parte que some) */


/* BARRA FIXA */
.header-fixo {
    position: absolute;
    left: 50%;
    bottom: 26px;
    transform: translateX(-50%);
    width: min(1180px, calc(100% - 48px));
    padding: 14px 18px;
    border-radius: 999px;
    background: rgba(255,255,255,0.16);
    border: 1px solid rgba(255,255,255,0.25);
    backdrop-filter: blur(16px);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    transition: 0.35s ease;
    box-shadow: 0 18px 45px rgba(0,0,0,0.18);
}

/* QUANDO ROLA */
.header-scroll .header-fixo {
    position: fixed;
    top: 14px;
    bottom: auto;
    transform: translateX(-50%);
    background: rgba(255,255,255,0.88);
    border-color: rgba(226,232,240,0.9);
}

.header-scroll .header-fixo {
    top: 0;
}
/* =========================================================
   TOPO PREMIUM FIXO + HERO DESLOCADO
   Este bloco substitui visualmente as tentativas anteriores
   de header integrado/transparente, sem precisar apagar o CSS antigo.
========================================================= */

body.home-integrada,
body.home-premium {
    padding-top: 88px;
}

body.home-integrada .topo-info,
body.home-premium .topo-info {
    display: none !important;
}

.topo-integrado,
.topo-premium,
body.home-integrada .topo,
body.home-premium .topo {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 9999 !important;
    background: rgba(255,255,255,0.96) !important;
    border: none !important;
    border-bottom: 1px solid rgba(226,232,240,0.9) !important;
    box-shadow: 0 12px 36px rgba(15,23,42,0.08) !important;
    backdrop-filter: blur(18px) !important;
    padding: 0 !important;
}

/* Esconde a estrutura antiga do header apple, se ainda existir */


.topo-premium-inner {
    width: min(1380px, calc(100% - 36px));
    height: 88px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: auto auto minmax(260px, 520px) auto;
    align-items: center;
    gap: 18px;
}

.logo-premium {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px;
    border-radius: 18px;
    background: white;
    border: 1px solid rgba(226,232,240,0.9);
    box-shadow: 0 8px 22px rgba(15,23,42,0.06);
}

.logo-premium img {
    width: 132px;
    height: 56px;
    object-fit: contain;
}

.menu-premium {
    display: flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.menu-premium a,
.menu-dropdown-premium > a {
    color: #0f172a;
    font-size: 14px;
    font-weight: 800;
    padding: 10px 13px;
    border-radius: 999px;
    transition: 0.50s ease;
}

.menu-premium a:hover,
.menu-dropdown-premium:hover > a {
    background: #ecfdf5;
    color: #166534;
}

.menu-dropdown-premium {
    position: relative;
}

.dropdown-categorias-premium {
    position: absolute;
    top: calc(100% + 12px);
    left: 0;
    min-width: 240px;
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 8px;
    box-shadow: 0 24px 55px rgba(15,23,42,0.16);
    display: none;
    z-index: 10000;
}

.dropdown-categorias-premium a {
    display: block;
    border-radius: 12px;
    padding: 10px 12px;
    color: #334155;
}

.dropdown-categorias-premium a:hover {
    background: #f0fdf4;
    color: #166534;
}

/* A abertura por hover foi desativada. O estado é controlado por .aberto. */

.busca-premium,
.topo-premium .busca {
    width: 100%;
    max-width: 520px;
    min-width: 260px;
    margin: 0;
    padding: 5px;
    border-radius: 999px;
    background: #f8fafc;
    border: 1px solid #dbe4ee;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.9);
}

.busca-premium input,
.topo-premium .busca input {
    color: #0f172a;
    font-size: 14px;
    padding: 10px 13px;
}

.busca-premium button,
.topo-premium .busca button {
    padding: 10px 18px;
    border-radius: 999px;
    background: linear-gradient(135deg, #22c55e, #16a34a);
    box-shadow: 0 8px 18px rgba(34,197,94,0.24);
}

.acoes-premium {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.btn-whatsapp-premium,
.btn-login-premium,
.btn-cadastro-premium-topo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    padding: 0 14px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
    white-space: nowrap;
    transition: 0.22s ease;
}

.btn-whatsapp-premium {
    background: #ecfdf5;
    color: #166534;
    border: 1px solid #bbf7d0;
}

.btn-login-premium {
    background: #f8fafc;
    color: #0f172a;
    border: 1px solid #e2e8f0;
}

.btn-cadastro-premium-topo {
    background: #22c55e;
    color: white;
    border: 1px solid #22c55e;
    box-shadow: 0 8px 18px rgba(34,197,94,0.24);
}

.btn-whatsapp-premium:hover,
.btn-login-premium:hover,
.btn-cadastro-premium-topo:hover {
    transform: translateY(-1px);
    filter: brightness(1.03);
}

.carrinho-premium {
    position: relative;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #22c55e;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 18px rgba(34,197,94,0.24);
}

.carrinho-premium img {
    width: 21px;
    height: 21px;
    object-fit: contain;
}

.carrinho-premium span {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 19px;
    height: 19px;
    border-radius: 999px;
    background: #ef4444;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 900;
}

.usuario-premium {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    line-height: 1.1;
}

.usuario-premium strong {
    font-size: 12px;
    color: #0f172a;
    max-width: 110px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.usuario-premium a {
    color: #ef4444;
    font-size: 11px;
    font-weight: 900;
}

.login-premium {
    display: flex;
    align-items: center;
    gap: 8px;
}

.topo-premium .theme-switch,
.theme-switch {
    flex: 0 0 auto;
    width: 52px;
    height: 28px;
    border-radius: 999px;
    background: #cbd5e1;
    border: none;
    padding: 3px;
    cursor: pointer;
    box-shadow: inset 0 1px 3px rgba(15,23,42,0.18);
}

.topo-premium .theme-switch-bolinha,
.theme-switch-bolinha {
    width: 22px;
    height: 22px;
    background: white;
    border-radius: 50%;
    display: block;
    transition: transform 0.25s ease;
    box-shadow: 0 2px 8px rgba(15,23,42,0.25);
}

body.modo-escuro .theme-switch-bolinha {
    transform: translateX(24px);
}

/* Hero desce para abrir espaço para o topo branco */


body.home-premium .conteudo,
body.home-integrada .conteudo,
body.home-premium .conteudo-pro,
body.home-integrada .conteudo-pro {
    margin-top: 0 !important;
}

/* Mantém o modo escuro bonito no topo */
body.modo-escuro .topo-premium,
body.modo-escuro.home-premium .topo,
body.modo-escuro.home-integrada .topo {
    background: rgba(15,23,42,0.96) !important;
    border-bottom-color: #1e293b !important;
}

body.modo-escuro .logo-premium,
body.modo-escuro .busca-premium,
body.modo-escuro .topo-premium .busca,
body.modo-escuro .btn-login-premium {
    background: #111827;
    border-color: #1e293b;
}

body.modo-escuro .menu-premium a,
body.modo-escuro .menu-dropdown-premium > a,
body.modo-escuro .btn-login-premium,
body.modo-escuro .usuario-premium strong,
body.modo-escuro .busca-premium input,
body.modo-escuro .topo-premium .busca input {
    color: #e5e7eb;
}

body.modo-escuro .dropdown-categorias-premium {
    background: #0f172a;
    border-color: #1e293b;
}

body.modo-escuro .dropdown-categorias-premium a {
    color: #e5e7eb;
}

/* Responsivo */
@media (max-width: 1180px) {
    .topo-premium-inner {
        grid-template-columns: auto 1fr auto;
        height: auto;
        min-height: 88px;
        padding: 10px 0;
    }

    .menu-premium {
        display: none;
    }

    .busca-premium,
    .topo-premium .busca {
        max-width: none;
    }
}

@media (max-width: 760px) {
    body.home-integrada,
    body.home-premium {
        padding-top: 142px;
    }

    .topo-premium-inner {
        width: min(100% - 20px, 1380px);
        grid-template-columns: auto 1fr;
        gap: 10px;
    }

    .logo-premium img {
        width: 104px;
        height: 46px;
    }

    .busca-premium,
    .topo-premium .busca {
        grid-column: 1 / -1;
        order: 3;
    }

    .acoes-premium {
        justify-content: flex-end;
        gap: 7px;
    }

    .btn-whatsapp-premium,
    .btn-cadastro-premium-topo {
        display: none;
    }

    .btn-login-premium {
        height: 36px;
        padding: 0 11px;
    }

    .carrinho-premium {
        width: 38px;
        height: 38px;
    }

    
}
/* CORREÇÃO DO DROPDOWN PRODUTOS */

.menu-dropdown {
    position: relative;
    padding-bottom: 12px;
}

.dropdown-categorias {
    top: calc(100% - 4px);
    pointer-events: auto;
}

.menu-dropdown::after {
    content: "";
    position: absolute;
    left: 0;
    top: 100%;
    width: 260px;
    height: 18px;
    background: transparent;
}

.menu-dropdown:hover .dropdown-categorias,
.menu-dropdown:focus-within .dropdown-categorias {
    display: block;
}
.logo-img {
    animation: logoEntrada 0.7s ease both;
}

@keyframes logoEntrada {
    from {
        opacity: 0;
        transform: translateY(-8px) scale(0.96);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}
/* LOGO PADRÃO */
.logo-img {
    height: 48px;
    transition: opacity 1s ease;
}

/* A troca de logo do tema é controlada pelo header e pelo frontend-ui.js.
   Não usar content:url aqui: o caminho seria resolvido a partir da pasta /css. */
/* =========================================================
   AJUSTE GLOBAL DAS PÁGINAS INTERNAS
========================================================= */

body {
    overflow-x: hidden;
}

/* HOME mantém hero integrado */
body.home-premium .conteudo-pro,
body.home-premium .conteudo {
    margin-top: 20px;
}

/* PÁGINAS INTERNAS */
body:not(.home-premium) .conteudo-pro,
body:not(.home-premium) .conteudo {
    margin-top: 150px;
}

/* TOPO FIXO PROFISSIONAL */
.topo-premium {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: rgba(255,255,255,0.96);
    backdrop-filter: blur(16px);
    z-index: 9999;
}

/* ESPAÇAMENTO INTERNO */
.topo-premium-inner {
    min-height: 88px;
    display: flex;
    align-items: center;
}

/* LOGIN / CADASTRO */
.login-container,
.cadastro-container {
    padding-top: 40px;
    padding-bottom: 40px;
}

/* CARRINHO */
.box-carrinho {
    overflow-x: auto;
}

/* TABELA */
.tabela-carrinho {
    min-width: 700px;
}


/* TOPO DAS PÁGINAS */
.pagina-topo {
    margin-bottom: 35px;
}

/* FILTRO */
.topo-filtro {
    margin-bottom: 35px;
}

/* MELHOR RESPIRO VISUAL */
.grid-produtos {
    margin-top: 10px;
}
/* =========================================================
   ENQUADRAMENTO AUTOMÁTICO DAS IMAGENS DOS PRODUTOS
========================================================= */

.card-imagem {
    height: 190px;
    padding: 14px;
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-imagem img,
.destaques .card-imagem img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    border-radius: 12px;
    background: white;
}

/* =========================================================
   HERO SLIDER DINÂMICO
========================================================= */


/* POSIÇÃO DO TEXTO NO HERO */


/* =========================================================
   HERO DINÂMICO - RÉPLICA DO EDITOR VISUAL
========================================================= */


/* =========================================================
   BOTÕES DO HERO/BANNER
========================================================= */


/* =========================================================
   AJUSTES VISUAIS DOS BOTÕES DO HERO
========================================================= */


/* =========================================================
   CATÁLOGO PREMIUM - PRODUTOS PALADINI
========================================================= */

.catalogo-hero{
    position:relative;
    overflow:hidden;
    margin:28px 0 22px;
    padding:38px;
    border-radius:28px;
    background:
        radial-gradient(circle at top right, rgba(34,197,94,.22), transparent 34%),
        linear-gradient(135deg, #0f3d24, #15803d);
    color:#ffffff;
    display:grid;
    grid-template-columns:1.5fr .8fr;
    gap:24px;
    align-items:center;
    box-shadow:0 18px 45px rgba(20,83,45,.22);
}

.catalogo-hero h1{
    font-size:clamp(32px, 4vw, 56px);
    line-height:1.02;
    letter-spacing:-1.5px;
    max-width:780px;
    margin-bottom:14px;
}

.catalogo-hero p:not(.mini-destaque){
    color:#dcfce7;
    font-size:17px;
    max-width:720px;
}

.catalogo-hero .mini-destaque{
    background:rgba(255,255,255,.16);
    color:#ffffff;
}

.catalogo-resumo{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
}

.catalogo-resumo div{
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.18);
    border-radius:20px;
    padding:20px;
    backdrop-filter:blur(8px);
}

.catalogo-resumo strong{
    display:block;
    font-size:34px;
    line-height:1;
}

.catalogo-resumo span{
    display:block;
    margin-top:8px;
    color:#dcfce7;
    font-size:13px;
    font-weight:700;
}

.catalogo-toolbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;
    background:#ffffff;
    border:1px solid #e2e8f0;
    border-radius:22px;
    padding:16px;
    box-shadow:0 8px 24px rgba(0,0,0,.06);
    margin-bottom:22px;
}

.catalogo-busca{
    display:flex;
    align-items:center;
    gap:10px;
    flex:1;
    flex-wrap:wrap;
}

.campo-busca-produtos{
    flex:1;
    min-width:260px;
    display:flex;
    align-items:center;
    gap:8px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:16px;
    padding:0 12px;
}

.campo-busca-produtos input{
    border:none;
    box-shadow:none !important;
    background:transparent;
    margin:0;
    padding:13px 4px;
}

.catalogo-busca select{
    width:auto;
    min-width:190px;
    margin:0;
    border-radius:14px;
}

.catalogo-busca .btn,
.catalogo-busca .btn-secundario{
    margin:0;
    white-space:nowrap;
}

.catalogo-resultados{
    min-width:150px;
    text-align:right;
}

.catalogo-resultados strong{
    display:block;
    font-size:25px;
    color:#14532d;
}

.catalogo-resultados span{
    color:#64748b;
    font-size:13px;
    font-weight:700;
}

.catalogo-layout{
    display:grid;
    grid-template-columns:280px 1fr;
    gap:24px;
    align-items:start;
}

.catalogo-sidebar{
    position:sticky;
    top:112px;
    display:grid;
    gap:16px;
}

.box-filtro-catalogo,
.box-ajuda-catalogo{
    background:white;
    border:1px solid #e2e8f0;
    border-radius:22px;
    padding:18px;
    box-shadow:0 8px 24px rgba(0,0,0,.055);
}

.box-filtro-catalogo h3{
    color:#14532d;
    margin-bottom:12px;
    font-size:18px;
}

.box-filtro-catalogo a{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    color:#334155;
    padding:11px 12px;
    border-radius:13px;
    font-weight:700;
    transition:.2s;
    margin-bottom:6px;
    background:#f8fafc;
    border:1px solid transparent;
}

.box-filtro-catalogo a:hover,
.box-filtro-catalogo a.ativo{
    background:#dcfce7;
    color:#166534;
    border-color:#86efac;
    transform:translateX(3px);
}

.box-filtro-catalogo a.destaque{
    background:#fff7ed;
    color:#9a3412;
}

.box-filtro-catalogo a.destaque.ativo{
    background:#ffedd5;
    border-color:#fdba74;
}

.box-ajuda-catalogo strong{
    color:#14532d;
    font-size:17px;
}

.box-ajuda-catalogo p{
    margin-top:8px;
    color:#64748b;
    font-size:14px;
}

.chips-categorias-mobile{
    display:none;
}

.grid-catalogo-premium{
    grid-template-columns:repeat(auto-fill, minmax(245px, 1fr));
    align-items:stretch;
}

.card-produto-catalogo{
    border-radius:24px;
    overflow:hidden;
    border:1px solid #e5e7eb;
    background:#ffffff;
    box-shadow:0 8px 24px rgba(0,0,0,.055);
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.card-produto-catalogo:hover{
    transform:translateY(-6px);
    box-shadow:0 20px 44px rgba(0,0,0,.13);
    border-color:#bbf7d0;
}

.card-imagem-catalogo{
    position:relative;
    display:block;
    padding:18px;
    background:
        radial-gradient(circle at center, #ffffff 0%, #f8fafc 54%, #eef2f7 100%);
    overflow:hidden;
}

.card-imagem-catalogo img{
    width:100%;
    height:210px;
    object-fit:contain;
    border-radius:18px;
    transition:transform .35s ease;
}

.card-produto-catalogo:hover .card-imagem-catalogo img{
    transform:scale(1.06);
}

.badge-desconto,
.badge-catalogo{
    position:absolute;
    top:16px;
    left:16px;
    z-index:2;
    border-radius:999px;
    padding:7px 11px;
    font-size:12px;
    font-weight:900;
    box-shadow:0 8px 18px rgba(0,0,0,.12);
}

.badge-desconto{
    background:#ef4444;
    color:white;
}

.badge-catalogo{
    background:#dcfce7;
    color:#166534;
}

.card-conteudo-catalogo{
    padding:18px;
}

.linha-categoria-card{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
    margin-bottom:10px;
}

.linha-categoria-card .categoria{
    margin:0;
    font-size:13px;
    color:#64748b;
}

.linha-categoria-card span{
    font-size:11px;
    color:#166534;
    font-weight:800;
    background:#ecfdf5;
    border:1px solid #bbf7d0;
    padding:5px 8px;
    border-radius:999px;
    white-space:nowrap;
}

.card-conteudo-catalogo h3{
    font-size:18px;
    line-height:1.25;
    min-height:46px;
    margin-bottom:10px;
    color:#111827;
}

.descricao-card-produto{
    color:#64748b;
    font-size:13px;
    line-height:1.45;
    min-height:38px;
    margin-bottom:12px;
}

.preco-area-catalogo{
    margin:10px 0 14px;
}

.preco-catalogo,
.card-conteudo-catalogo .preco{
    font-size:26px;
    margin-bottom:14px;
    letter-spacing:-.6px;
}

.preco-original-cortado{
    color:#94a3b8;
    text-decoration:line-through;
    font-size:14px;
    margin-top:-8px;
}

.contador-promocao{
    display:inline-block;
    margin-top:7px;
    background:#fff1f2;
    color:#be123c;
    border:1px solid #fecdd3;
    padding:5px 8px;
    border-radius:999px;
    font-size:11px;
    font-weight:800;
}

.acoes-card-produto{
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px;
    align-items:center;
}

.acoes-card-produto .btn,
.acoes-card-produto .btn-secundario{
    width:100%;
    padding:11px 12px;
    border-radius:13px;
    font-size:13px;
}

.btn-card-secundario{
    min-width:92px;
}

.sem-produtos-catalogo{
    display:grid;
    justify-items:center;
    gap:10px;
    padding:44px 24px;
}

.sem-produtos-catalogo h3{
    color:#14532d;
    font-size:24px;
}

.sem-produtos-catalogo p{
    color:#64748b;
}

@media(max-width:1100px){
    .catalogo-layout{
        grid-template-columns:1fr;
    }

    .catalogo-sidebar{
        position:static;
        display:none;
    }

    .chips-categorias-mobile{
        display:flex;
        gap:10px;
        overflow-x:auto;
        padding:4px 2px 14px;
        margin-bottom:8px;
    }

    .chips-categorias-mobile a{
        flex:0 0 auto;
        padding:10px 14px;
        background:white;
        border:1px solid #e2e8f0;
        border-radius:999px;
        color:#334155;
        font-weight:800;
    }

    .chips-categorias-mobile a.ativo{
        background:#22c55e;
        color:white;
        border-color:#22c55e;
    }
}

@media(max-width:850px){
    .catalogo-hero{
        grid-template-columns:1fr;
        padding:28px;
    }

    .catalogo-resumo{
        grid-template-columns:1fr 1fr;
    }

    .catalogo-toolbar{
        align-items:stretch;
        flex-direction:column;
    }

    .catalogo-busca{
        width:100%;
    }

    .catalogo-busca select,
    .catalogo-busca .btn,
    .catalogo-busca .btn-secundario{
        width:100%;
    }

    .catalogo-resultados{
        text-align:left;
        width:100%;
    }
}

@media(max-width:560px){
    .catalogo-hero{
        border-radius:22px;
        padding:24px;
    }

    .catalogo-resumo{
        grid-template-columns:1fr;
    }

    .grid-catalogo-premium{
        grid-template-columns:1fr;
    }

    .card-imagem-catalogo img{
        height:230px;
    }

    .acoes-card-produto{
        grid-template-columns:1fr;
    }

    .btn-card-secundario{
        min-width:0;
    }
}

/* =========================================================
   CARRINHO PREMIUM - PALADINI
========================================================= */

.carrinho-premium-page{
    margin:28px 0 60px;
}

.carrinho-hero{
    position:relative;
    overflow:hidden;
    display:grid;
    grid-template-columns:1.4fr .55fr;
    gap:24px;
    align-items:center;
    margin-bottom:24px;
    padding:34px;
    border-radius:28px;
    background:
        radial-gradient(circle at top right, rgba(34,197,94,.24), transparent 36%),
        linear-gradient(135deg, #0f3d24, #15803d);
    color:#ffffff;
    box-shadow:0 18px 45px rgba(20,83,45,.22);
}

.carrinho-hero h1{
    font-size:clamp(32px, 4vw, 54px);
    line-height:1.04;
    letter-spacing:-1.4px;
    margin-bottom:12px;
    max-width:760px;
}

.carrinho-hero p:not(.mini-destaque){
    color:#dcfce7;
    font-size:17px;
    max-width:700px;
}

.carrinho-hero .mini-destaque{
    background:rgba(255,255,255,.16);
    color:#ffffff;
}

.carrinho-hero-resumo{
    justify-self:end;
    width:min(220px, 100%);
    background:rgba(255,255,255,.13);
    border:1px solid rgba(255,255,255,.18);
    border-radius:22px;
    padding:24px;
    backdrop-filter:blur(8px);
}

.carrinho-hero-resumo strong{
    display:block;
    font-size:48px;
    line-height:1;
}

.carrinho-hero-resumo span{
    display:block;
    margin-top:8px;
    color:#dcfce7;
    font-weight:800;
}

.carrinho-vazio-premium{
    display:grid;
    justify-items:center;
    gap:12px;
    padding:54px 24px;
    border-radius:28px;
    background:#ffffff;
    border:1px solid #e2e8f0;
    box-shadow:0 12px 32px rgba(0,0,0,.07);
}

.icone-carrinho-vazio{
    width:82px;
    height:82px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:24px;
    background:#dcfce7;
    font-size:38px;
}

.carrinho-vazio-premium h2{
    color:#14532d;
    font-size:30px;
}

.carrinho-vazio-premium p{
    color:#64748b;
    text-align:center;
    max-width:520px;
}

.carrinho-layout-premium{
    display:grid;
    grid-template-columns:minmax(0, 1fr) 380px;
    gap:24px;
    align-items:start;
}

.carrinho-itens-premium,
.resumo-card-carrinho{
    background:#ffffff;
    border:1px solid #e2e8f0;
    border-radius:28px;
    box-shadow:0 12px 32px rgba(0,0,0,.065);
}

.carrinho-itens-premium{
    padding:22px;
}

.carrinho-bloco-topo{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    flex-wrap:wrap;
    padding-bottom:18px;
    border-bottom:1px solid #e2e8f0;
    margin-bottom:18px;
}

.carrinho-bloco-topo h2,
.resumo-card-carrinho h2{
    color:#14532d;
    font-size:24px;
    line-height:1.1;
}

.carrinho-bloco-topo p{
    color:#64748b;
    font-weight:700;
    margin-top:4px;
}

.lista-itens-carrinho-premium{
    display:grid;
    gap:14px;
}

.item-carrinho-premium{
    display:grid;
    grid-template-columns:104px minmax(0, 1fr) auto auto;
    gap:16px;
    align-items:center;
    padding:14px;
    border:1px solid #e5e7eb;
    border-radius:22px;
    background:#f8fafc;
    transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.item-carrinho-premium:hover{
    transform:translateY(-2px);
    box-shadow:0 12px 26px rgba(0,0,0,.08);
    border-color:#bbf7d0;
}

.item-carrinho-img{
    width:104px;
    height:94px;
    border-radius:18px;
    background:#ffffff;
    border:1px solid #e2e8f0;
    padding:10px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
}

.item-carrinho-img img{
    width:100%;
    height:100%;
    object-fit:contain;
}

.item-carrinho-label{
    display:inline-block;
    color:#166534;
    background:#dcfce7;
    border:1px solid #bbf7d0;
    border-radius:999px;
    padding:5px 8px;
    font-size:11px;
    font-weight:900;
    margin-bottom:7px;
}

.item-carrinho-info h3{
    font-size:18px;
    color:#111827;
    line-height:1.25;
    margin-bottom:8px;
}

.item-carrinho-meta{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    color:#64748b;
    font-size:13px;
}

.item-carrinho-meta strong{
    color:#14532d;
}

.item-carrinho-subtotal{
    min-width:130px;
    text-align:right;
}

.item-carrinho-subtotal span{
    display:block;
    color:#64748b;
    font-size:12px;
    font-weight:800;
}

.item-carrinho-subtotal strong{
    display:block;
    color:#16a34a;
    font-size:20px;
    margin-top:4px;
    white-space:nowrap;
}

.btn-remover-premium{
    background:#fee2e2;
    color:#991b1b;
    border:1px solid #fecaca;
    padding:10px 12px;
    border-radius:13px;
    font-weight:900;
    transition:.2s;
    white-space:nowrap;
}

.btn-remover-premium:hover{
    background:#dc2626;
    color:#ffffff;
    transform:translateY(-2px);
}

.resumo-carrinho-premium{
    position:sticky;
    top:112px;
}

.resumo-card-carrinho{
    padding:22px;
}

.linha-resumo-carrinho{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    padding:14px 0;
    border-bottom:1px solid #e2e8f0;
    color:#334155;
}

.linha-resumo-carrinho strong{
    color:#14532d;
    font-size:17px;
}

.linha-resumo-carrinho.observacao{
    align-items:flex-start;
    flex-direction:column;
    gap:5px;
}

.linha-resumo-carrinho small{
    color:#64748b;
    line-height:1.4;
}

.total-final-carrinho{
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:12px;
    margin:18px 0;
    padding:18px;
    border-radius:20px;
    background:#f0fdf4;
    border:1px solid #bbf7d0;
}

.total-final-carrinho span{
    color:#166534;
    font-weight:900;
}

.total-final-carrinho strong{
    color:#14532d;
    font-size:28px;
    line-height:1;
    letter-spacing:-.8px;
}

.box-finalizacao-premium{
    margin-top:0;
    padding:0;
    background:transparent;
    border:none;
    box-shadow:none;
}

.box-finalizacao-premium h3{
    color:#14532d;
    margin:0 0 12px;
}

.box-finalizacao-premium label{
    color:#334155;
    font-weight:900;
}

.box-finalizacao-premium select{
    margin-bottom:14px;
    min-height:46px;
    border-radius:14px;
}

.btn-continuar-carrinho{
    width:100%;
    min-height:52px;
    border-radius:16px;
    font-size:15px;
}

.seguranca-carrinho{
    display:grid;
    gap:8px;
    margin-top:18px;
    padding-top:16px;
    border-top:1px solid #e2e8f0;
}

.seguranca-carrinho span{
    display:flex;
    align-items:center;
    gap:8px;
    color:#166534;
    font-size:13px;
    font-weight:800;
    background:#f0fdf4;
    border:1px solid #bbf7d0;
    padding:9px 10px;
    border-radius:12px;
}

@media(max-width:1050px){
    .carrinho-layout-premium{
        grid-template-columns:1fr;
    }

    .resumo-carrinho-premium{
        position:static;
    }
}

@media(max-width:760px){
    .carrinho-hero{
        grid-template-columns:1fr;
        padding:26px;
        border-radius:22px;
    }

    .carrinho-hero-resumo{
        justify-self:start;
    }

    .carrinho-itens-premium,
    .resumo-card-carrinho{
        border-radius:22px;
        padding:18px;
    }

    .item-carrinho-premium{
        grid-template-columns:86px 1fr;
        align-items:start;
    }

    .item-carrinho-img{
        width:86px;
        height:86px;
    }

    .item-carrinho-subtotal{
        text-align:left;
        grid-column:2;
        min-width:0;
    }

    .btn-remover-premium{
        grid-column:1 / -1;
        text-align:center;
    }

    .carrinho-bloco-topo .btn-secundario{
        width:100%;
    }

    .total-final-carrinho strong{
        font-size:24px;
    }
}

@media(max-width:480px){
    .item-carrinho-premium{
        grid-template-columns:1fr;
    }

    .item-carrinho-img{
        width:100%;
        height:170px;
    }

    .item-carrinho-subtotal{
        grid-column:auto;
    }
}
.whatsapp-flutuante {
    position: fixed;
    right: 24px;
    bottom: 24px;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: #22c55e;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 14px 30px rgba(0,0,0,0.25);
    z-index: 999;
    transition:
        transform .25s ease,
        bottom .25s ease,
        opacity .25s ease,
        background .25s ease;
}

.whatsapp-flutuante img {
    width: 34px;
    height: 34px;
    object-fit: contain;
}

.whatsapp-flutuante:hover {
    transform: translateY(-4px) scale(1.04);
    background: #16a34a;
}

/* Quando footer aparecer */
.whatsapp-flutuante.subir-footer {
    bottom: 180px;
}

@media (max-width: 768px) {

    .whatsapp-flutuante {
        width: 58px;
        height: 58px;
        right: 18px;
        bottom: 18px;
    }

    .whatsapp-flutuante img {
        width: 30px;
        height: 30px;
    }

    .whatsapp-flutuante.subir-footer {
        bottom: 140px;
    }
}
/* =========================================
   PAINEL DO CLIENTE
========================================= */

.conta-container{
    width:min(1400px, 94%);
    margin:140px auto 80px;
}

.conta-header{
    margin-bottom:35px;
}

.conta-header h1{
    font-size:42px;
    font-weight:800;
    color:#111827;
    margin-bottom:10px;
}

.conta-header p{
    color:#6b7280;
    font-size:16px;
}

.conta-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:24px;
}

.conta-card{
    background:#fff;
    border-radius:24px;
    padding:28px;
    text-decoration:none;
    color:#111827;
    border:1px solid #e5e7eb;
    transition:.25s;
    box-shadow:0 10px 30px rgba(0,0,0,.04);
}

.conta-card:hover{
    transform:translateY(-4px);
    border-color:var(--cor-primaria);
    box-shadow:0 18px 40px rgba(0,0,0,.08);
}

.conta-card h3{
    font-size:22px;
    margin-bottom:12px;
    color:#111827;
}

.conta-card p{
    color:#6b7280;
    line-height:1.5;
}

.conta-card-sair{
    border:1px solid #fecaca;
}

.conta-card-sair h3{
    color:#dc2626;
}

.conta-voltar{
    margin-bottom:25px;
}

.conta-voltar a{
    text-decoration:none;
    color:var(--cor-primaria);
    font-weight:700;
}

.conta-vazio{
    background:#fff;
    padding:50px;
    border-radius:24px;
    text-align:center;
    border:1px solid #e5e7eb;
}

.conta-vazio h2{
    margin-bottom:12px;
    font-size:28px;
}

.conta-vazio p{
    color:#6b7280;
    margin-bottom:25px;
}

/* =========================================
   TABELAS DO PAINEL
========================================= */

.tabela-conta-wrap{
    width:100%;
    overflow:auto;
    background:#fff;
    border-radius:24px;
    border:1px solid #e5e7eb;
}

.tabela-conta{
    width:100%;
    border-collapse:collapse;
    min-width:800px;
}

.tabela-conta thead{
    background:#f9fafb;
}

.tabela-conta th{
    text-align:left;
    padding:20px;
    font-size:14px;
    color:#374151;
    border-bottom:1px solid #e5e7eb;
}

.tabela-conta td{
    padding:20px;
    border-bottom:1px solid #f3f4f6;
    color:#374151;
}

.tabela-conta tr:hover{
    background:#f9fafb;
}

.tabela-conta a{
    color:var(--cor-primaria);
    font-weight:700;
    text-decoration:none;
}

/* =========================================
   DETALHES PEDIDO
========================================= */

.pedido-detalhes-card{
    background:#fff;
    border-radius:24px;
    padding:35px;
    border:1px solid #e5e7eb;
    margin-bottom:30px;
}

.pedido-detalhes-card p{
    margin-bottom:14px;
    color:#374151;
    line-height:1.6;
}

/* =========================================
   RESPONSIVO
========================================= */

@media(max-width:768px){

    .conta-container{
        margin-top:110px;
    }

    .conta-header h1{
        font-size:32px;
    }

    .conta-grid{
        grid-template-columns:1fr;
    }

    .conta-card{
        padding:22px;
    }

    .pedido-detalhes-card{
        padding:25px;
    }

    .tabela-conta{
        min-width:680px;
    }

}
.usuario-dropdown-premium{
    position:relative;
    z-index:9999;
    display:flex;
    align-items:center;
}

.usuario-dropdown-btn{
    border:2px solid #111827;
    background:#ffffff;
    border-radius:18px;
    padding:7px 38px 7px 14px;
    min-width:185px;
    cursor:pointer;

    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;

    position:relative;

    transition:.2s ease;

    box-shadow:
        0 8px 22px rgba(0,0,0,.06);
}

.usuario-dropdown-btn:hover{
    transform:translateY(-1px);
    box-shadow:
        0 12px 28px rgba(0,0,0,.10);
}

.minha-conta-label{
    font-size:11px;
    font-weight:800;
    color:var(--cor-primaria);
    line-height:1;
    margin-bottom:4px;
    text-transform:uppercase;
    letter-spacing:.4px;
}

.usuario-dropdown-btn strong{
    max-width:130px;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;

    font-size:14px;
    color:#111827;
    line-height:1.1;
}

.seta-usuario{
    position:absolute;
    right:14px;
    top:50%;
    transform:translateY(-50%);
    font-size:11px;
    color:#6b7280;
}

.usuario-dropdown-menu{
    display:none;

    position:absolute;
    right:0;
    top:calc(100% + 12px);

    width:240px;

    background:#ffffff;

    border:1px solid #e5e7eb;

    border-radius:24px;

    padding:14px;

    box-shadow:
        0 24px 60px rgba(0,0,0,.16);

    backdrop-filter:blur(14px);
}

.usuario-dropdown-menu.ativo{
    display:block;
    animation:fadeDropdown .18s ease;
}

@keyframes fadeDropdown{
    from{
        opacity:0;
        transform:translateY(-6px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

.usuario-dropdown-menu a{
    display:block;

    padding:14px 16px;

    border-radius:14px;

    text-decoration:none;

    color:#374151;

    font-size:15px;

    font-weight:700;

    transition:.18s ease;
}

.usuario-dropdown-menu a:hover{
    background:#f3f4f6;
    color:var(--cor-primaria);
}

.usuario-dropdown-menu hr{
    border:0;
    border-top:1px solid #e5e7eb;
    margin:10px 0;
}

.link-sair-usuario{
    color:#dc2626 !important;
}

.link-sair-usuario:hover{
    background:#fef2f2 !important;
    color:#b91c1c !important;
}
/* =========================================
   DASHBOARD DO CLIENTE - MODERNO / DISCRETO
========================================= */

.conta-dashboard{
    width:min(1240px, calc(100% - 32px));
    margin:118px auto 72px;
}

.conta-dashboard-pro{
    display:flex;
    flex-direction:column;
    gap:22px;
}

/* Cabeçalho menor, elegante e menos chamativo */
.conta-hero-cliente{
    display:grid;
    grid-template-columns:1fr 230px;
    gap:24px;
    align-items:stretch;
    background:
        radial-gradient(circle at top right, rgba(34,197,94,.12), transparent 34%),
        linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border:1px solid rgba(226,232,240,.95);
    color:#0f172a;
    padding:30px;
    border-radius:28px;
    box-shadow:0 18px 42px rgba(15,23,42,.07);
}

.conta-hero-texto{
    min-width:0;
}

.conta-hero-cliente .mini-destaque{
    margin-bottom:12px;
    background:#ecfdf5;
    color:#15803d;
    border:1px solid #bbf7d0;
}

.conta-hero-cliente h1{
    font-size:clamp(28px, 3vw, 40px);
    line-height:1.08;
    margin:0 0 10px;
    letter-spacing:-1px;
    color:#0f172a;
}

.conta-hero-cliente p{
    max-width:650px;
    color:#64748b;
    line-height:1.65;
    font-size:15px;
}

.conta-hero-acoes{
    margin-top:20px;
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

.btn-conta-principal,
.btn-conta-secundario{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:12px 16px;
    border-radius:14px;
    font-weight:800;
    font-size:14px;
    transition:.2s ease;
}

.btn-conta-principal{
    background:#16a34a;
    color:#fff;
    box-shadow:0 10px 22px rgba(22,163,74,.18);
}

.btn-conta-secundario{
    background:#fff;
    color:#166534;
    border:1px solid #bbf7d0;
}

.btn-conta-principal:hover,
.btn-conta-secundario:hover{
    transform:translateY(-2px);
}

.conta-resumo-pedido{
    border-radius:24px;
    background:#0f172a;
    color:#fff;
    padding:24px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:160px;
    box-shadow:0 18px 34px rgba(15,23,42,.16);
}

.conta-resumo-pedido span{
    font-size:13px;
    color:#bbf7d0;
    font-weight:800;
}

.conta-resumo-pedido strong{
    font-size:54px;
    line-height:1;
    margin:8px 0;
    letter-spacing:-2px;
}

.conta-resumo-pedido p{
    color:#cbd5e1;
    font-size:13px;
}

/* Cards intuitivos de acesso rápido */
.conta-acesso-rapido{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
}

.conta-card-acao{
    min-height:118px;
    display:grid;
    grid-template-columns:auto 1fr auto;
    gap:14px;
    align-items:center;
    background:#fff;
    color:#0f172a;
    border:1px solid #e2e8f0;
    border-radius:22px;
    padding:18px;
    box-shadow:0 10px 26px rgba(15,23,42,.045);
    transition:.22s ease;
}

.conta-card-acao:hover{
    transform:translateY(-3px);
    border-color:#86efac;
    box-shadow:0 18px 38px rgba(15,23,42,.08);
}

.conta-icone{
    width:44px;
    height:44px;
    border-radius:16px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#ecfdf5;
    color:#166534;
    border:1px solid #bbf7d0;
    font-size:20px;
    font-weight:900;
}

.conta-card-acao strong{
    display:block;
    font-size:15px;
    margin-bottom:4px;
}

.conta-card-acao p{
    color:#64748b;
    font-size:13px;
    line-height:1.35;
}

.conta-card-acao small{
    justify-self:end;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    color:#334155;
    padding:7px 9px;
    border-radius:999px;
    font-weight:900;
    font-size:12px;
}

/* Layout principal */
.conta-layout-dashboard{
    display:grid;
    grid-template-columns:minmax(0,1fr) 330px;
    gap:22px;
    align-items:start;
}

.conta-bloco-principal,
.conta-card-perfil,
.conta-card-atendimento,
.conta-atalhos{
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:26px;
    box-shadow:0 12px 30px rgba(15,23,42,.05);
}

.conta-bloco-principal{
    padding:26px;
}

.conta-bloco-titulo{
    display:flex;
    justify-content:space-between;
    gap:20px;
    align-items:flex-start;
    margin-bottom:22px;
}

.conta-subtitulo{
    display:block;
    color:#16a34a;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.5px;
    margin-bottom:6px;
}

.conta-bloco-titulo h2,
.conta-atalhos h2,
.conta-card-perfil h2,
.conta-card-atendimento h2{
    font-size:24px;
    margin:0 0 6px;
    color:#0f172a;
    letter-spacing:-.5px;
}

.conta-bloco-titulo p,
.conta-card-perfil p,
.conta-card-atendimento p{
    color:#64748b;
    font-size:14px;
    line-height:1.55;
}

.conta-bloco-titulo a{
    color:#16a34a;
    font-weight:900;
    font-size:14px;
    white-space:nowrap;
}

/* Lista de pedidos */
.lista-pedidos-dashboard{
    display:flex;
    flex-direction:column;
    gap:14px;
}

.pedido-dashboard-card{
    border:1px solid #e2e8f0;
    border-radius:22px;
    padding:20px;
    background:#fbfdff;
    transition:.2s ease;
}

.pedido-dashboard-card:hover{
    border-color:#bbf7d0;
    background:#fff;
}

.pedido-dashboard-topo{
    display:flex;
    justify-content:space-between;
    gap:16px;
    align-items:flex-start;
    margin-bottom:16px;
}

.pedido-data{
    display:block;
    color:#64748b;
    font-size:12px;
    font-weight:800;
    margin-bottom:4px;
}

.pedido-dashboard-topo h3{
    font-size:19px;
    margin:0;
    color:#0f172a;
}

.pedido-dashboard-statuses{
    display:flex;
    gap:8px;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:wrap;
}

.status-cliente{
    padding:7px 10px;
    border-radius:999px;
    font-size:11px !important;
    font-weight:900;
    white-space:nowrap;
}

.status-pago{
    background:#dcfce7;
    color:#15803d !important;
}

.status-aguardando{
    background:#fef3c7;
    color:#92400e !important;
}

.status-cancelado{
    background:#fee2e2;
    color:#b91c1c !important;
}

.status-entregue{
    background:#dbeafe;
    color:#1d4ed8 !important;
}

.status-padrao{
    background:#eef2f7;
    color:#334155 !important;
}

.pedido-dashboard-info{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
    margin-bottom:16px;
}

.pedido-dashboard-info p{
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:16px;
    padding:12px;
}

.pedido-dashboard-info span{
    display:block;
    color:#64748b;
    font-size:12px;
    font-weight:800;
    margin-bottom:4px;
}

.pedido-dashboard-info strong{
    color:#0f172a;
    font-size:14px;
}

.progresso-pedido-barra{
    width:100%;
    height:9px;
    background:#e2e8f0;
    border-radius:999px;
    overflow:hidden;
}

.progresso-pedido-barra span{
    display:block;
    height:100%;
    background:linear-gradient(90deg,#22c55e,#16a34a);
    border-radius:999px;
}

.progresso-cancelado .progresso-pedido-barra span{
    background:#ef4444;
}

.progresso-pedido-etapas{
    display:flex;
    justify-content:space-between;
    margin-top:8px;
    color:#64748b;
    font-size:11px;
    font-weight:800;
}

.pedido-card-rodape{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-top:16px;
}

.btn-detalhes-pedido,
.btn-comprar-novamente{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:10px 13px;
    border-radius:12px;
    font-size:13px;
    font-weight:900;
}

.btn-detalhes-pedido{
    background:#ecfdf5;
    color:#166534;
}

.btn-comprar-novamente{
    background:#f8fafc;
    color:#334155;
    border:1px solid #e2e8f0;
}

/* Lateral */
.conta-lateral{
    display:flex;
    flex-direction:column;
    gap:16px;
    position:sticky;
    top:112px;
}

.conta-card-perfil,
.conta-card-atendimento,
.conta-atalhos{
    padding:22px;
}

.conta-card-perfil{
    text-align:center;
}

.conta-avatar{
    width:68px;
    height:68px;
    border-radius:24px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto 14px;
    background:linear-gradient(135deg,#16a34a,#22c55e);
    color:#fff;
    font-size:28px;
    font-weight:900;
    box-shadow:0 14px 28px rgba(22,163,74,.22);
}

.conta-card-perfil a{
    display:inline-flex;
    margin-top:16px;
    padding:10px 14px;
    border-radius:12px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    color:#166534;
    font-weight:900;
    font-size:13px;
}

.conta-card-atendimento{
    background:
        radial-gradient(circle at top right, rgba(34,197,94,.16), transparent 34%),
        #0f172a;
    color:#fff;
    border-color:#0f172a;
}

.conta-card-atendimento span{
    color:#bbf7d0;
    font-weight:900;
    font-size:12px;
    text-transform:uppercase;
}

.conta-card-atendimento h2{
    color:#fff;
    margin-top:8px;
}

.conta-card-atendimento p{
    color:#cbd5e1;
}

.conta-card-atendimento button{
    width:100%;
    margin-top:16px;
    padding:12px;
    border:none;
    border-radius:14px;
    background:rgba(255,255,255,.12);
    color:#e2e8f0;
    font-weight:900;
    cursor:not-allowed;
}

.conta-atalhos h2{
    margin-bottom:12px;
}

.conta-atalhos a{
    display:flex;
    align-items:center;
    gap:10px;
    padding:13px 12px;
    border-radius:14px;
    color:#334155;
    font-weight:850;
    transition:.18s ease;
}

.conta-atalhos a:hover{
    background:#f0fdf4;
    color:#15803d;
}

.conta-atalhos .atalho-sair{
    color:#dc2626;
}

.conta-vazio-dashboard{
    background:#f8fafc;
    border:1px dashed #cbd5e1;
    border-radius:22px;
    padding:38px 24px;
    text-align:center;
}

.conta-vazio-dashboard > span{
    width:58px;
    height:58px;
    margin:0 auto 14px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:20px;
    background:#ecfdf5;
    border:1px solid #bbf7d0;
    font-size:26px;
}

.conta-vazio-dashboard h3{
    font-size:22px;
    margin-bottom:8px;
}

.conta-vazio-dashboard p{
    color:#64748b;
    margin-bottom:20px;
}

/* Modo escuro */
body.modo-escuro .conta-hero-cliente,
body.modo-escuro .conta-card-acao,
body.modo-escuro .conta-bloco-principal,
body.modo-escuro .conta-card-perfil,
body.modo-escuro .conta-atalhos,
body.modo-escuro .pedido-dashboard-card,
body.modo-escuro .pedido-dashboard-info p,
body.modo-escuro .conta-vazio-dashboard{
    background:#0f172a;
    border-color:#1e293b;
    color:#e5e7eb;
}

body.modo-escuro .conta-hero-cliente h1,
body.modo-escuro .conta-card-acao,
body.modo-escuro .conta-card-acao strong,
body.modo-escuro .conta-bloco-titulo h2,
body.modo-escuro .conta-atalhos h2,
body.modo-escuro .conta-card-perfil h2,
body.modo-escuro .pedido-dashboard-topo h3,
body.modo-escuro .pedido-dashboard-info strong{
    color:#e5e7eb;
}

body.modo-escuro .conta-card-acao small,
body.modo-escuro .btn-comprar-novamente,
body.modo-escuro .conta-card-perfil a{
    background:#1e293b;
    border-color:#334155;
    color:#e5e7eb;
}

/* Responsivo */
@media (max-width: 1050px){
    .conta-dashboard{
        margin-top:106px;
    }

    .conta-hero-cliente{
        grid-template-columns:1fr;
    }

    .conta-resumo-pedido{
        min-height:auto;
    }

    .conta-acesso-rapido{
        grid-template-columns:repeat(2,1fr);
    }

    .conta-layout-dashboard{
        grid-template-columns:1fr;
    }

    .conta-lateral{
        position:static;
        display:grid;
        grid-template-columns:repeat(2,1fr);
    }

    .conta-atalhos{
        grid-column:1 / -1;
    }
}

@media (max-width: 680px){
    .conta-dashboard{
        width:min(100% - 20px, 1240px);
        margin-top:96px;
    }

    .conta-hero-cliente{
        padding:22px;
        border-radius:22px;
    }

    .conta-hero-acoes,
    .pedido-card-rodape{
        flex-direction:column;
        align-items:stretch;
    }

    .btn-conta-principal,
    .btn-conta-secundario,
    .btn-detalhes-pedido,
    .btn-comprar-novamente{
        width:100%;
    }

    .conta-acesso-rapido,
    .conta-lateral,
    .pedido-dashboard-info{
        grid-template-columns:1fr;
    }

    .conta-card-acao{
        min-height:auto;
    }

    .pedido-dashboard-topo{
        flex-direction:column;
    }

    .pedido-dashboard-statuses{
        justify-content:flex-start;
    }

    .conta-bloco-principal,
    .conta-card-perfil,
    .conta-card-atendimento,
    .conta-atalhos{
        padding:20px;
        border-radius:22px;
    }
}

.gif-localizacao-footer{
    width:22px;
    height:22px;
    object-fit:contain;
    flex-shrink:0;
}
/* =========================================================
   TEMAS DA LOJA
========================================================= */

/* =========================
   NATAL
========================= */

body.tema-natal{
    --cor-primaria:#dc2626;
    --cor-primaria-escura:#991b1b;
    --cor-verde-suave:#fee2e2;
}



body.tema-natal .topo{
    border-bottom-color:#dc2626;
}

/* =========================
   BLACK FRIDAY
========================= */

body.tema-blackfriday{
    --cor-primaria:#facc15;
    --cor-primaria-escura:#ca8a04;
    --cor-verde-suave:#fef9c3;
    --cor-fundo:#0f172a;
    --cor-card:#111827;
    --cor-texto:#f8fafc;
    --cor-texto-suave:#cbd5e1;
    --cor-borda:#1e293b;
}

body.tema-blackfriday .topo,
body.tema-blackfriday .card-produto,
body.tema-blackfriday .faixa-item,
body.tema-blackfriday .bloco-confiança{
    background:#111827;
    color:#f8fafc;
}

body.tema-blackfriday .categoria,
body.tema-blackfriday p{
    color:#cbd5e1;
}

/* =========================
   PÁSCOA
========================= */

body.tema-pascoa{
    --cor-primaria:#a855f7;
    --cor-primaria-escura:#7e22ce;
    --cor-verde-suave:#f3e8ff;
}

body.tema-pascoa .topo{
    border-bottom-color:#a855f7;
}


/* =========================================================
   ÍCONES MODERNOS - MINHA CONTA
   Usar arquivos SVG ou PNG dentro da pasta /img
========================================================= */
.conta-icone img,
.conta-atalhos a span img,
.conta-vazio-icone img,
.atendimento-label img {
    width: 24px;
    height: 24px;
    object-fit: contain;
    display: block;
}

.conta-icone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    min-width: 46px;
    border-radius: 16px;
    background: #ecfdf5;
    border: 1px solid #bbf7d0;
}

.conta-atalhos a span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    min-width: 28px;
    border-radius: 10px;
    background: #f0fdf4;
}

.conta-vazio-icone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 20px;
    background: #ecfdf5;
    border: 1px solid #bbf7d0;
    margin-bottom: 14px;
}

.conta-vazio-icone img {
    width: 30px;
    height: 30px;
}

.atendimento-label {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
}

.atendimento-label img {
    width: 20px;
    height: 20px;
}

/* =========================================================
   CARRINHO V2 - mesmo padrão visual da Minha Conta
========================================================= */

.carrinho-page-v2 {
    width: min(1320px, calc(100% - 40px));
    margin: 34px auto 70px;
}

.carrinho-page-v2 img {
    display: block;
    object-fit: contain;
}

.carrinho-topo-v2 {
    min-height: 150px;
    padding: 30px;
    border-radius: 28px;
    background:
        radial-gradient(circle at 92% 20%, rgba(34, 197, 94, 0.12), transparent 32%),
        linear-gradient(135deg, #ffffff, #f8fafc);
    border: 1px solid #e5e7eb;
    box-shadow: 0 16px 45px rgba(15, 23, 42, 0.07);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 26px;
    margin-bottom: 22px;
}

.conta-tag-v2 {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 999px;
    background: #ecfdf5;
    color: #15803d;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .4px;
    margin-bottom: 14px;
}

.conta-tag-v2 img {
    width: 17px;
    height: 17px;
}

.carrinho-topo-texto-v2 h1 {
    font-size: clamp(28px, 3vw, 42px);
    line-height: 1.05;
    color: #0f172a;
    letter-spacing: -1px;
    margin-bottom: 8px;
}

.carrinho-topo-texto-v2 p {
    color: #64748b;
    font-size: 15px;
    max-width: 620px;
}

.carrinho-topo-status-v2 {
    min-width: 270px;
    padding: 20px;
    border-radius: 22px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    gap: 16px;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}

.carrinho-status-icone-v2,
.carrinho-vazio-icone-v2,
.carrinho-ajuda-v2 > div:first-child {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    background: #ecfdf5;
    display: flex;
    align-items: center;
    justify-content: center;
}

.carrinho-status-icone-v2 img,
.carrinho-ajuda-v2 img {
    width: 30px;
    height: 30px;
}

.carrinho-topo-status-v2 strong {
    display: block;
    font-size: 34px;
    line-height: 1;
    color: #0f172a;
}

.carrinho-topo-status-v2 span {
    color: #64748b;
    font-size: 14px;
    font-weight: 700;
}

.carrinho-layout-v2 {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 390px;
    gap: 22px;
    align-items: start;
}

.carrinho-card-v2,
.carrinho-vazio-v2,
.carrinho-ajuda-v2,
.carrinho-garantias-v2 {
    background: rgba(255,255,255,0.96);
    border: 1px solid #e5e7eb;
    border-radius: 26px;
    box-shadow: 0 14px 38px rgba(15, 23, 42, 0.06);
}

.carrinho-lista-card-v2 {
    padding: 24px;
}

.carrinho-card-header-v2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    margin-bottom: 18px;
}

.carrinho-card-header-v2 h2,
.carrinho-resumo-header-v2 h2,
.carrinho-ajuda-v2 h3 {
    color: #0f172a;
    letter-spacing: -0.45px;
}

.carrinho-card-header-v2 p {
    color: #64748b;
    font-size: 14px;
    margin-top: 3px;
}

.carrinho-lista-v2 {
    display: grid;
    gap: 14px;
}

.carrinho-item-v2 {
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr) 110px 150px auto;
    align-items: center;
    gap: 16px;
    padding: 16px;
    border: 1px solid #e5e7eb;
    border-radius: 22px;
    background: linear-gradient(135deg, #ffffff, #fbfdff);
    transition: .22s ease;
}

.carrinho-item-v2:hover {
    transform: translateY(-2px);
    border-color: rgba(34, 197, 94, 0.35);
    box-shadow: 0 14px 28px rgba(15, 23, 42, 0.07);
}

.carrinho-item-imagem-v2 {
    width: 88px;
    height: 88px;
    border-radius: 18px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    overflow: hidden;
    padding: 8px;
}

.carrinho-item-imagem-v2 img {
    width: 100%;
    height: 100%;
    border-radius: 12px;
    object-fit: cover;
}

.carrinho-item-info-v2 span {
    display: block;
    color: #16a34a;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 900;
    letter-spacing: .45px;
    margin-bottom: 4px;
}

.carrinho-item-info-v2 h3 {
    color: #0f172a;
    font-size: 17px;
    line-height: 1.25;
    margin-bottom: 10px;
}

.carrinho-item-dados-v2 small,
.carrinho-quantidade-v2 small,
.carrinho-subtotal-v2 small {
    display: block;
    color: #64748b;
    font-size: 12px;
    margin-bottom: 3px;
}

.carrinho-item-dados-v2 strong,
.carrinho-quantidade-v2 strong,
.carrinho-subtotal-v2 strong {
    color: #0f172a;
}

.carrinho-quantidade-v2 {
    text-align: center;
}

.carrinho-quantidade-v2 strong {
    display: inline-flex;
    min-width: 42px;
    height: 42px;
    border-radius: 14px;
    background: #f1f5f9;
    align-items: center;
    justify-content: center;
}

.carrinho-subtotal-v2 {
    text-align: right;
}

.carrinho-remover-v2 {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #dc2626;
    font-weight: 800;
    font-size: 13px;
    padding: 10px 12px;
    border-radius: 12px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    transition: .2s;
}

.carrinho-remover-v2:hover {
    background: #fee2e2;
    transform: translateY(-1px);
}

.carrinho-remover-v2 img {
    width: 15px;
    height: 15px;
}

.btn-carrinho-principal-v2,
.btn-carrinho-secundario-v2 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 44px;
    padding: 12px 16px;
    border-radius: 14px;
    font-weight: 900;
    border: none;
    cursor: pointer;
    transition: .22s ease;
    text-align: center;
}

.btn-carrinho-principal-v2 {
    background: linear-gradient(135deg, #22c55e, #15803d);
    color: #fff;
    box-shadow: 0 10px 22px rgba(22, 163, 74, .22);
}

.btn-carrinho-secundario-v2 {
    background: #f8fafc;
    color: #0f172a;
    border: 1px solid #e5e7eb;
}

.btn-carrinho-principal-v2:hover,
.btn-carrinho-secundario-v2:hover {
    transform: translateY(-2px);
    filter: brightness(1.02);
}

.btn-carrinho-principal-v2 img,
.btn-carrinho-secundario-v2 img {
    width: 18px;
    height: 18px;
}

.carrinho-resumo-v2 {
    position: sticky;
    top: 110px;
}

.carrinho-resumo-card-v2 {
    padding: 24px;
}

.carrinho-resumo-header-v2 {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    margin-bottom: 20px;
}

.carrinho-resumo-header-v2 span {
    display: block;
    color: #16a34a;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 900;
    letter-spacing: .45px;
}

.carrinho-resumo-header-v2 img {
    width: 38px;
    height: 38px;
}

.carrinho-resumo-linhas-v2 {
    display: grid;
    gap: 12px;
    margin-bottom: 18px;
}

.carrinho-resumo-linhas-v2 > div {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e5e7eb;
}

.carrinho-resumo-linhas-v2 span,
.carrinho-resumo-linhas-v2 small {
    color: #64748b;
}

.carrinho-resumo-linhas-v2 strong {
    color: #0f172a;
}

.carrinho-total-v2 {
    background: #ecfdf5;
    border: 1px solid #bbf7d0;
    border-radius: 18px;
    padding: 16px;
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: center;
    margin-bottom: 18px;
}

.carrinho-total-v2 span {
    color: #166534;
    font-weight: 800;
}

.carrinho-total-v2 strong {
    color: #14532d;
    font-size: 24px;
}

.carrinho-forma-v2 label {
    display: block;
    color: #0f172a;
    font-weight: 900;
    margin-bottom: 8px;
}

.carrinho-forma-v2 select {
    width: 100%;
    height: 48px;
    border: 1px solid #dbe3ef;
    border-radius: 14px;
    padding: 0 14px;
    color: #0f172a;
    background: #fff;
    margin-bottom: 12px;
}

.carrinho-forma-v2 .btn-carrinho-principal-v2 {
    width: 100%;
}

.carrinho-garantias-v2 {
    padding: 18px;
    margin-top: 14px;
    display: grid;
    gap: 12px;
}

.carrinho-garantias-v2 div {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #334155;
    font-weight: 700;
    font-size: 13px;
}

.carrinho-garantias-v2 img {
    width: 20px;
    height: 20px;
}

.carrinho-ajuda-v2 {
    margin-top: 18px;
    padding: 22px;
    display: flex;
    align-items: center;
    gap: 16px;
}

.carrinho-ajuda-v2 p {
    color: #64748b;
    font-size: 14px;
    margin-top: 4px;
}

.carrinho-vazio-v2 {
    min-height: 390px;
    padding: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
}

.carrinho-vazio-icone-v2 {
    width: 84px;
    height: 84px;
    margin-bottom: 18px;
}

.carrinho-vazio-icone-v2 img {
    width: 42px;
    height: 42px;
}

.carrinho-vazio-v2 h2 {
    color: #0f172a;
    font-size: 28px;
    letter-spacing: -.5px;
    margin-bottom: 8px;
}

.carrinho-vazio-v2 p {
    color: #64748b;
    max-width: 460px;
    margin-bottom: 20px;
}

.carrinho-vazio-acoes-v2 {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
}

/* Modo escuro, caso esteja usando o tema */
body.modo-escuro .carrinho-topo-v2,
body.modo-escuro .carrinho-card-v2,
body.modo-escuro .carrinho-vazio-v2,
body.modo-escuro .carrinho-ajuda-v2,
body.modo-escuro .carrinho-garantias-v2,
body.modo-escuro .carrinho-item-v2 {
    background: #0f172a;
    border-color: #1e293b;
}

body.modo-escuro .carrinho-topo-texto-v2 h1,
body.modo-escuro .carrinho-topo-status-v2 strong,
body.modo-escuro .carrinho-card-header-v2 h2,
body.modo-escuro .carrinho-resumo-header-v2 h2,
body.modo-escuro .carrinho-item-info-v2 h3,
body.modo-escuro .carrinho-item-dados-v2 strong,
body.modo-escuro .carrinho-quantidade-v2 strong,
body.modo-escuro .carrinho-subtotal-v2 strong,
body.modo-escuro .carrinho-vazio-v2 h2,
body.modo-escuro .carrinho-ajuda-v2 h3,
body.modo-escuro .carrinho-forma-v2 label {
    color: #e5e7eb;
}

body.modo-escuro .carrinho-topo-texto-v2 p,
body.modo-escuro .carrinho-card-header-v2 p,
body.modo-escuro .carrinho-ajuda-v2 p,
body.modo-escuro .carrinho-vazio-v2 p {
    color: #94a3b8;
}

@media (max-width: 1100px) {
    .carrinho-layout-v2 {
        grid-template-columns: 1fr;
    }

    .carrinho-resumo-v2 {
        position: static;
    }
}

@media (max-width: 820px) {
    .carrinho-page-v2 {
        width: min(100% - 22px, 1320px);
        margin-top: 20px;
    }

    .carrinho-topo-v2 {
        flex-direction: column;
        align-items: flex-start;
        padding: 24px;
        border-radius: 22px;
    }

    .carrinho-topo-status-v2 {
        width: 100%;
        min-width: 0;
    }

    .carrinho-card-header-v2 {
        flex-direction: column;
        align-items: stretch;
    }

    .carrinho-item-v2 {
        grid-template-columns: 74px 1fr;
        align-items: start;
    }

    .carrinho-item-imagem-v2 {
        width: 74px;
        height: 74px;
    }

    .carrinho-quantidade-v2,
    .carrinho-subtotal-v2 {
        text-align: left;
    }

    .carrinho-remover-v2 {
        grid-column: 1 / -1;
        justify-content: center;
    }

    .carrinho-ajuda-v2 {
        align-items: flex-start;
    }
}

@media (max-width: 520px) {
    .carrinho-lista-card-v2,
    .carrinho-resumo-card-v2 {
        padding: 18px;
        border-radius: 22px;
    }

    .carrinho-topo-texto-v2 h1 {
        font-size: 28px;
    }

    .carrinho-vazio-v2 {
        padding: 30px 18px;
    }

    .carrinho-total-v2 {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* ==========================================
   FAVORITOS
========================================== */

.favoritos-topo{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:30px;
}

.favoritos-topo img{
    width:40px;
    height:40px;
}

.favoritos-topo h1{
    font-size:32px;
    color:#14532d;
}

.favoritos-topo p{
    color:#64748b;
    margin-top:4px;
}

.conta-voltar{
    margin-bottom:25px;
}

.conta-voltar a{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 16px;
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:12px;
    color:#334155;
    font-weight:600;
}

.conta-voltar a:hover{
    background:#f8fafc;
}

.card-acoes{
    display:flex;
    gap:10px;
    margin-top:15px;
}

.btn-ver-produto{
    flex:1;
    background:#16a34a;
    color:#fff;
    text-align:center;
    padding:10px;
    border-radius:10px;
    font-weight:600;
}

.btn-ver-produto:hover{
    background:#15803d;
}

.btn-remover-favorito{
    background:#ef4444;
    color:#fff;
    padding:10px 14px;
    border-radius:10px;
    font-weight:600;
}

.btn-remover-favorito:hover{
    background:#dc2626;
}

/* =========================================================
   FAVORITOS - visual moderno no padrão Minha Conta / Carrinho
   Bloco isolado para não quebrar telas antigas.
========================================================= */

.favoritos-page{
    width:min(1280px, calc(100% - 32px));
    margin:34px auto 70px;
}

.favoritos-hero{
    position:relative;
    overflow:hidden;
    min-height:190px;
    background:
        radial-gradient(circle at 88% 20%, rgba(34,197,94,.22), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f8fafc 58%, #ecfdf5 100%);
    border:1px solid rgba(226,232,240,.95);
    border-radius:30px;
    box-shadow:0 18px 50px rgba(15,23,42,.07);
    padding:34px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
}

.favoritos-hero::before{
    content:"";
    position:absolute;
    width:260px;
    height:260px;
    right:-90px;
    top:-95px;
    border-radius:50%;
    background:rgba(34,197,94,.08);
}

.favoritos-hero-info{
    position:relative;
    z-index:1;
}

.favoritos-tag{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 12px;
    border-radius:999px;
    background:#ecfdf5;
    border:1px solid #bbf7d0;
    color:#166534;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.04em;
    margin-bottom:16px;
}

.favoritos-tag img{
    width:17px;
    height:17px;
    object-fit:contain;
}

.favoritos-hero h1{
    font-size:clamp(30px, 3.4vw, 46px);
    line-height:1.02;
    letter-spacing:-1.4px;
    color:#0f172a;
    margin-bottom:10px;
}

.favoritos-hero p{
    max-width:620px;
    color:#64748b;
    font-size:15px;
}

.favoritos-resumo-card{
    position:relative;
    z-index:1;
    min-width:240px;
    background:rgba(255,255,255,.86);
    border:1px solid #e2e8f0;
    border-radius:24px;
    padding:22px;
    display:flex;
    align-items:center;
    gap:15px;
    box-shadow:0 12px 35px rgba(15,23,42,.06);
}

.favoritos-resumo-card img{
    width:42px;
    height:42px;
    object-fit:contain;
    padding:9px;
    border-radius:16px;
    background:#dcfce7;
}

.favoritos-resumo-card strong{
    display:block;
    font-size:34px;
    line-height:1;
    color:#0f172a;
    letter-spacing:-1px;
}

.favoritos-resumo-card span{
    color:#64748b;
    font-size:13px;
    font-weight:700;
}

.favoritos-toolbar{
    margin:20px 0 24px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}

.favoritos-voltar,
.favoritos-continuar{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    min-height:44px;
    padding:0 16px;
    border-radius:14px;
    font-size:14px;
    font-weight:900;
    transition:.22s ease;
}

.favoritos-voltar{
    background:#ffffff;
    color:#334155;
    border:1px solid #e2e8f0;
    box-shadow:0 6px 18px rgba(15,23,42,.04);
}

.favoritos-continuar{
    background:#ecfdf5;
    color:#166534;
    border:1px solid #bbf7d0;
}

.favoritos-voltar:hover,
.favoritos-continuar:hover{
    transform:translateY(-2px);
    box-shadow:0 10px 24px rgba(15,23,42,.08);
}

.favoritos-voltar img,
.favoritos-continuar img{
    width:18px;
    height:18px;
    object-fit:contain;
}

.favoritos-vazio{
    background:#ffffff;
    border:1px solid #e2e8f0;
    border-radius:28px;
    min-height:320px;
    padding:46px 24px;
    box-shadow:0 18px 45px rgba(15,23,42,.06);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
}

.favoritos-vazio-icone{
    width:84px;
    height:84px;
    border-radius:28px;
    background:#ecfdf5;
    border:1px solid #bbf7d0;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:18px;
}

.favoritos-vazio-icone img{
    width:42px;
    height:42px;
    object-fit:contain;
}

.favoritos-vazio h2{
    font-size:26px;
    color:#0f172a;
    letter-spacing:-.6px;
    margin-bottom:8px;
}

.favoritos-vazio p{
    max-width:470px;
    color:#64748b;
    margin-bottom:22px;
}

.favoritos-btn-produtos img{
    width:18px;
    height:18px;
    object-fit:contain;
    filter:brightness(0) invert(1);
}

.favoritos-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(250px, 1fr));
    gap:18px;
}

.favorito-card{
    position:relative;
    overflow:hidden;
    background:#ffffff;
    border:1px solid #e2e8f0;
    border-radius:24px;
    box-shadow:0 10px 28px rgba(15,23,42,.06);
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.favorito-card:hover{
    transform:translateY(-5px);
    border-color:rgba(34,197,94,.38);
    box-shadow:0 20px 45px rgba(15,23,42,.1);
}

.favorito-card::after{
    content:"";
    position:absolute;
    top:14px;
    right:14px;
    width:38px;
    height:38px;
    border-radius:50%;
    background:#ecfdf5 url("img/icon-favoritos.png") center/20px 20px no-repeat;
    border:1px solid #bbf7d0;
    box-shadow:0 8px 18px rgba(15,23,42,.06);
}

.favorito-imagem{
    display:block;
    padding:14px;
    background:linear-gradient(180deg, #f8fafc, #f1f5f9);
}

.favorito-imagem img{
    width:100%;
    height:190px;
    object-fit:cover;
    border-radius:18px;
}

.favorito-conteudo{
    padding:18px;
}

.favorito-categoria{
    display:inline-flex;
    color:#16a34a;
    background:#f0fdf4;
    border:1px solid #bbf7d0;
    border-radius:999px;
    padding:5px 9px;
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.03em;
    margin-bottom:10px;
}

.favorito-conteudo h3{
    font-size:16px;
    line-height:1.25;
    min-height:42px;
    color:#0f172a;
    margin-bottom:12px;
}

.favorito-preco{
    color:#166534;
    font-size:22px;
    font-weight:950;
    letter-spacing:-.5px;
    margin-bottom:16px;
}

.favorito-acoes{
    display:grid;
    grid-template-columns:1fr 46px;
    gap:10px;
}

.favorito-btn-ver,
.favorito-btn-remover{
    min-height:44px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border-radius:14px;
    font-size:13px;
    font-weight:950;
    transition:.22s ease;
}

.favorito-btn-ver{
    background:linear-gradient(135deg, #22c55e, #16a34a);
    color:white;
    box-shadow:0 10px 22px rgba(34,197,94,.22);
}

.favorito-btn-remover{
    background:#fff1f2;
    color:#dc2626;
    border:1px solid #fecdd3;
}

.favorito-btn-ver:hover,
.favorito-btn-remover:hover{
    transform:translateY(-2px);
    filter:brightness(1.02);
}

.favorito-btn-ver img{
    width:17px;
    height:17px;
    object-fit:contain;
    filter:brightness(0) invert(1);
}

.favorito-btn-remover img{
    width:18px;
    height:18px;
    object-fit:contain;
}

/* Compatibilidade com modo escuro */
body.modo-escuro .favoritos-hero,
body.modo-escuro .favoritos-resumo-card,
body.modo-escuro .favoritos-voltar,
body.modo-escuro .favoritos-vazio,
body.modo-escuro .favorito-card{
    background:#0f172a;
    border-color:#1e293b;
}

body.modo-escuro .favoritos-hero h1,
body.modo-escuro .favoritos-resumo-card strong,
body.modo-escuro .favoritos-vazio h2,
body.modo-escuro .favorito-conteudo h3{
    color:#e5e7eb;
}

body.modo-escuro .favoritos-hero p,
body.modo-escuro .favoritos-resumo-card span,
body.modo-escuro .favoritos-vazio p{
    color:#94a3b8;
}

body.modo-escuro .favorito-imagem{
    background:linear-gradient(180deg, #111827, #0f172a);
}

@media (max-width: 760px){
    .favoritos-page{
        width:min(100% - 20px, 1280px);
        margin-top:22px;
    }

    .favoritos-hero{
        padding:24px;
        border-radius:24px;
        align-items:flex-start;
        flex-direction:column;
    }

    .favoritos-resumo-card{
        width:100%;
        min-width:0;
    }

    .favoritos-toolbar{
        align-items:stretch;
    }

    .favoritos-voltar,
    .favoritos-continuar{
        width:100%;
    }

    .favoritos-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:12px;
    }

    .favorito-imagem{
        padding:10px;
    }

    .favorito-imagem img{
        height:140px;
        border-radius:14px;
    }

    .favorito-conteudo{
        padding:13px;
    }

    .favorito-conteudo h3{
        font-size:13px;
        min-height:38px;
    }

    .favorito-preco{
        font-size:17px;
    }

    .favorito-acoes{
        grid-template-columns:1fr;
    }

    .favorito-btn-remover{
        width:100%;
    }
}

/* =========================================================
   MEUS DADOS / EDITAR CADASTRO DO CLIENTE
========================================================= */
.dados-cliente-page{
    width:min(1280px, calc(100% - 32px));
    margin:34px auto 70px;
}

.dados-cliente-topo{
    display:grid;
    gap:18px;
    margin-bottom:22px;
}

.dados-voltar{
    width:max-content;
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 14px;
    border:1px solid #e2e8f0;
    border-radius:14px;
    background:#fff;
    color:#334155;
    font-weight:800;
    box-shadow:0 8px 22px rgba(15,23,42,.04);
}

.dados-voltar img{
    width:18px;
    height:18px;
    object-fit:contain;
}

.dados-cliente-hero{
    background:rgba(255,255,255,.92);
    border:1px solid #e2e8f0;
    border-radius:28px;
    padding:26px;
    display:flex;
    align-items:center;
    gap:18px;
    box-shadow:0 14px 36px rgba(15,23,42,.06);
}

.dados-cliente-icone{
    width:62px;
    height:62px;
    border-radius:22px;
    background:linear-gradient(135deg,#dcfce7,#bbf7d0);
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
}

.dados-cliente-icone img{
    width:34px;
    height:34px;
    object-fit:contain;
}

.dados-cliente-hero span{
    display:block;
    color:#16a34a;
    font-size:13px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.6px;
    margin-bottom:4px;
}

.dados-cliente-hero h1{
    color:#0f172a;
    font-size:clamp(28px,3vw,42px);
    line-height:1.05;
    letter-spacing:-1px;
    margin-bottom:8px;
}

.dados-cliente-hero p{
    color:#64748b;
}

.dados-alerta{
    padding:14px 16px;
    border-radius:16px;
    font-weight:800;
    margin-bottom:16px;
    border:1px solid transparent;
}

.dados-alerta-sucesso{
    background:#ecfdf5;
    color:#166534;
    border-color:#bbf7d0;
}

.dados-alerta-erro{
    background:#fef2f2;
    color:#991b1b;
    border-color:#fecaca;
}

.dados-cliente-layout{
    display:grid;
    grid-template-columns:1fr 340px;
    gap:18px;
    align-items:start;
}

.dados-cliente-card{
    background:rgba(255,255,255,.94);
    border:1px solid #e2e8f0;
    border-radius:24px;
    box-shadow:0 12px 32px rgba(15,23,42,.055);
}

.dados-cliente-principal{
    padding:24px;
}

.dados-card-titulo{
    display:flex;
    justify-content:space-between;
    gap:14px;
    margin-bottom:20px;
}

.dados-card-titulo h2{
    color:#0f172a;
    font-size:22px;
    letter-spacing:-.4px;
    margin-bottom:4px;
}

.dados-card-titulo p{
    color:#64748b;
    font-size:14px;
}

.dados-grid-form{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:15px;
}

.dados-grid-form label{
    display:grid;
    gap:7px;
}

.dados-grid-form span{
    color:#334155;
    font-size:13px;
    font-weight:900;
}

.dados-grid-form input{
    width:100%;
    border:1px solid #dbe4ee;
    background:#f8fafc;
    color:#0f172a;
    border-radius:14px;
    padding:13px 14px;
    font-size:14px;
}

.dados-grid-form input:disabled{
    background:#eef2f7;
    color:#64748b;
    cursor:not-allowed;
}

.dados-grid-form small{
    color:#64748b;
    font-size:12px;
    line-height:1.35;
}

.dados-cliente-lateral{
    display:grid;
    gap:14px;
    position:sticky;
    top:110px;
}

.dados-resumo-card,
.dados-ajuda-card{
    padding:22px;
    text-align:center;
}

.dados-avatar{
    width:74px;
    height:74px;
    border-radius:26px;
    margin:0 auto 14px;
    background:linear-gradient(135deg,#22c55e,#16a34a);
    color:white;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:32px;
    font-weight:900;
    box-shadow:0 14px 30px rgba(34,197,94,.22);
}

.dados-resumo-card h3{
    color:#0f172a;
    font-size:22px;
    margin-bottom:4px;
}

.dados-resumo-card p,
.dados-ajuda-card p{
    color:#64748b;
    font-size:14px;
}

.dados-status-box{
    margin-top:16px;
    padding:11px 12px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    background:#ecfdf5;
    border:1px solid #bbf7d0;
    border-radius:14px;
    color:#166534;
    font-weight:900;
    font-size:13px;
}

.dados-status-box img{
    width:18px;
    height:18px;
    object-fit:contain;
}

.dados-ajuda-card h3{
    color:#0f172a;
    margin-bottom:7px;
}

.dados-btn-salvar{
    width:100%;
    min-height:50px;
    border-radius:16px;
    font-size:15px;
}

.dados-btn-salvar img{
    width:20px;
    height:20px;
    object-fit:contain;
    filter:brightness(0) invert(1);
}

body.modo-escuro .dados-cliente-hero,
body.modo-escuro .dados-cliente-card,
body.modo-escuro .dados-voltar{
    background:#0f172a;
    border-color:#1e293b;
}

body.modo-escuro .dados-cliente-hero h1,
body.modo-escuro .dados-card-titulo h2,
body.modo-escuro .dados-resumo-card h3,
body.modo-escuro .dados-ajuda-card h3,
body.modo-escuro .dados-grid-form span{
    color:#e5e7eb;
}

body.modo-escuro .dados-grid-form input{
    background:#111827;
    border-color:#1e293b;
    color:#e5e7eb;
}

@media (max-width: 980px){
    .dados-cliente-layout{
        grid-template-columns:1fr;
    }

    .dados-cliente-lateral{
        position:static;
        order:-1;
    }
}

@media (max-width: 640px){
    .dados-cliente-page{
        width:min(100% - 20px, 1280px);
        margin-top:22px;
    }

    .dados-cliente-hero{
        align-items:flex-start;
        padding:22px;
        border-radius:22px;
    }

    .dados-cliente-icone{
        width:52px;
        height:52px;
        border-radius:18px;
    }

    .dados-cliente-icone img{
        width:28px;
        height:28px;
    }

    .dados-grid-form{
        grid-template-columns:1fr;
    }
}


/* =========================================================
   AJUSTE SEGURO - MEUS DADOS V2
   Mantém o CSS anterior e apenas melhora o layout da tela
   meus-dados.php / meus-dados_melhorado.php
========================================================= */

.dados-cliente-layout-v2{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:18px !important;
    align-items:start !important;
}

.dados-card-full{
    width:100%;
}

.dados-cliente-principal.dados-card-full{
    padding:24px;
}

.dados-card-titulo-v2{
    align-items:flex-start;
    border-bottom:1px solid #eef2f7;
    padding-bottom:16px;
    margin-bottom:20px;
}

.dados-section-tag{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:94px;
    height:34px;
    padding:0 12px;
    border-radius:999px;
    background:#ecfdf5;
    color:#166534;
    border:1px solid #bbf7d0;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.4px;
    white-space:nowrap;
}

.dados-grid-endereco{
    grid-template-columns:repeat(4, minmax(0, 1fr));
}

.dados-grid-endereco .campo-maior{
    grid-column:span 2;
}

.dados-cliente-rodape{
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
    margin-top:18px;
}

.dados-resumo-horizontal{
    padding:18px 20px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    text-align:left;
}

.dados-resumo-horizontal .dados-avatar-menor{
    width:58px;
    height:58px;
    border-radius:20px;
    margin:0;
    font-size:26px;
    flex:0 0 auto;
    box-shadow:0 10px 24px rgba(34,197,94,.18);
}

.dados-resumo-horizontal > div:nth-child(2){
    flex:1;
}

.dados-resumo-horizontal h3{
    color:#0f172a;
    font-size:20px;
    margin-bottom:3px;
}

.dados-resumo-horizontal p{
    color:#64748b;
    font-size:13px;
}

.dados-status-box-v2{
    margin:0;
    min-width:190px;
    padding:10px 14px;
    border-radius:999px;
    background:#f8fafc;
    border:1px solid #dbe4ee;
    color:#166534;
    font-size:12px;
    box-shadow:none;
}

.dados-status-box-v2 img{
    width:16px;
    height:16px;
    object-fit:contain;
}

.dados-cliente-card.dados-ajuda-card{
    padding:18px 20px;
    text-align:center;
    background:linear-gradient(180deg,#ffffff,#f8fafc);
}

.dados-cliente-card.dados-ajuda-card h3{
    font-size:18px;
    margin-bottom:6px;
}

.dados-cliente-card.dados-ajuda-card p{
    color:#64748b;
    font-size:13px;
}

.dados-btn-salvar-v2{
    width:100%;
    min-height:54px;
    margin-top:0;
    border-radius:18px;
    font-size:15px;
    font-weight:900;
    box-shadow:0 14px 28px rgba(34,197,94,.22);
}

.dados-btn-salvar-v2:hover{
    transform:translateY(-2px);
    box-shadow:0 18px 34px rgba(34,197,94,.28);
}

.dados-btn-salvar-v2 img{
    width:20px;
    height:20px;
    object-fit:contain;
    filter:brightness(0) invert(1);
}

/* Mantém a tela antiga legível caso alguma página ainda use o layout lateral */
.dados-cliente-layout:not(.dados-cliente-layout-v2){
    align-items:start;
}

/* Modo escuro - Meus Dados V2 */
body.modo-escuro .dados-card-titulo-v2{
    border-bottom-color:#1e293b;
}

body.modo-escuro .dados-section-tag{
    background:rgba(34,197,94,.12);
    color:#86efac;
    border-color:rgba(34,197,94,.28);
}

body.modo-escuro .dados-status-box-v2{
    background:#111827;
    border-color:#1e293b;
    color:#86efac;
}

body.modo-escuro .dados-cliente-card.dados-ajuda-card{
    background:#0f172a;
}

/* Responsivo - Meus Dados V2 */
@media (max-width: 980px){
    .dados-grid-endereco{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .dados-grid-endereco .campo-maior{
        grid-column:span 2;
    }

    .dados-resumo-horizontal{
        align-items:flex-start;
        flex-direction:column;
    }

    .dados-status-box-v2{
        width:100%;
        justify-content:center;
    }
}

@media (max-width: 640px){
    .dados-card-titulo-v2{
        flex-direction:column;
    }

    .dados-section-tag{
        width:max-content;
    }

    .dados-grid-endereco,
    .dados-grid-endereco .campo-maior{
        grid-template-columns:1fr;
        grid-column:span 1;
    }

    .dados-resumo-horizontal{
        padding:18px;
    }

    .dados-btn-salvar-v2{
        min-height:52px;
    }
}


/* =========================================================
   ENDEREÇOS DO CLIENTE
   Integração segura adicionada ao final do style.css
========================================================= */

.enderecos-page{
    width:min(1280px, calc(100% - 32px));
    margin:34px auto 70px;
}

.enderecos-topo{
    margin-bottom:24px;
}

.enderecos-voltar{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 14px;
    border-radius:14px;
    background:#fff;
    border:1px solid #dbe4ee;
    color:#334155;
    font-size:13px;
    font-weight:800;
    box-shadow:0 8px 20px rgba(15,23,42,.04);
    margin-bottom:16px;
    transition:.22s ease;
}

.enderecos-voltar:hover{
    transform:translateY(-1px);
    border-color:#bbf7d0;
    color:#166534;
}

.enderecos-voltar img{
    width:17px;
    height:17px;
    object-fit:contain;
}

.enderecos-hero{
    display:flex;
    align-items:center;
    gap:18px;
    padding:26px;
    border-radius:28px;
    background:
        radial-gradient(circle at top right, rgba(34,197,94,.18), transparent 34%),
        linear-gradient(135deg, #ffffff, #f8fafc);
    border:1px solid #dbe4ee;
    box-shadow:0 16px 38px rgba(15,23,42,.07);
}

.enderecos-hero-icone{
    width:68px;
    height:68px;
    border-radius:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:linear-gradient(135deg, #22c55e, #16a34a);
    box-shadow:0 14px 32px rgba(34,197,94,.22);
    flex:0 0 auto;
}

.enderecos-hero-icone img{
    width:34px;
    height:34px;
    object-fit:contain;
}

.enderecos-hero span,
.enderecos-card-titulo span{
    display:inline-block;
    color:#16a34a;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.08em;
    margin-bottom:4px;
}

.enderecos-hero h1{
    font-size:clamp(28px, 3vw, 42px);
    line-height:1.05;
    letter-spacing:-1px;
    color:#0f172a;
}

.enderecos-hero p{
    color:#64748b;
    margin-top:8px;
    max-width:720px;
}

.enderecos-alerta{
    padding:14px 16px;
    border-radius:16px;
    font-size:14px;
    font-weight:800;
    margin:16px 0;
    border:1px solid transparent;
}

.enderecos-alerta-sucesso{
    background:#ecfdf5;
    color:#166534;
    border-color:#bbf7d0;
}

.enderecos-alerta-erro{
    background:#fef2f2;
    color:#991b1b;
    border-color:#fecaca;
}

.enderecos-layout{
    display:grid;
    grid-template-columns:minmax(0, 1.05fr) minmax(360px, .95fr);
    gap:22px;
    align-items:start;
}

.enderecos-form-card,
.enderecos-lista-card{
    background:rgba(255,255,255,.96);
    border:1px solid #dbe4ee;
    border-radius:26px;
    padding:24px;
    box-shadow:0 14px 34px rgba(15,23,42,.06);
}

.enderecos-card-titulo{
    margin-bottom:20px;
}

.enderecos-card-titulo h2{
    color:#0f172a;
    font-size:24px;
    letter-spacing:-.4px;
}

.enderecos-card-titulo p{
    color:#64748b;
    font-size:14px;
    margin-top:5px;
}

.enderecos-grid-form{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
}

.enderecos-grid-form label{
    display:flex;
    flex-direction:column;
    gap:7px;
}

.enderecos-grid-form label > span{
    font-size:12px;
    font-weight:900;
    color:#0f172a;
    letter-spacing:.04em;
}

.enderecos-grid-form input{
    width:100%;
    min-height:48px;
    border:1px solid #cbd5e1;
    background:#f8fafc;
    border-radius:14px;
    padding:12px 13px;
    color:#0f172a;
    font-size:14px;
}

.enderecos-grid-form small{
    font-size:11px;
    color:#64748b;
    line-height:1.35;
}

.cep-status-sucesso{
    color:#15803d !important;
    font-weight:800;
}

.cep-status-erro{
    color:#dc2626 !important;
    font-weight:800;
}

.cep-status-carregando{
    color:#2563eb !important;
    font-weight:800;
}

.enderecos-grid-form .campo-maior{
    grid-column:span 2;
}

.enderecos-check-principal{
    display:flex;
    align-items:center;
    gap:10px;
    margin:18px 0;
    padding:13px 14px;
    border-radius:16px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    color:#334155;
    font-size:14px;
    font-weight:800;
    cursor:pointer;
}

.enderecos-check-principal input{
    width:18px;
    height:18px;
    accent-color:#16a34a;
}

.enderecos-btn-salvar{
    width:100%;
    min-height:52px;
    border-radius:16px;
    font-size:15px;
    box-shadow:0 14px 26px rgba(34,197,94,.24);
}

.enderecos-btn-salvar img{
    width:20px;
    height:20px;
    object-fit:contain;
}

.enderecos-vazio{
    min-height:250px;
    border:1px dashed #cbd5e1;
    background:#f8fafc;
    border-radius:22px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:28px;
}

.enderecos-vazio img{
    width:42px;
    height:42px;
    object-fit:contain;
    margin-bottom:14px;
    opacity:.75;
}

.enderecos-vazio h3{
    color:#0f172a;
    font-size:20px;
}

.enderecos-vazio p{
    color:#64748b;
    margin-top:6px;
    max-width:360px;
}

.enderecos-grid-lista{
    display:grid;
    gap:14px;
}

.endereco-item-card{
    border:1px solid #e2e8f0;
    background:#fff;
    border-radius:22px;
    padding:18px;
    transition:.22s ease;
}

.endereco-item-card:hover{
    transform:translateY(-2px);
    border-color:#bbf7d0;
    box-shadow:0 14px 28px rgba(15,23,42,.07);
}

.endereco-item-topo{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    margin-bottom:12px;
}

.endereco-item-topo h3{
    color:#0f172a;
    font-size:18px;
    letter-spacing:-.2px;
}

.endereco-item-topo img{
    width:30px;
    height:30px;
    object-fit:contain;
}

.tag-principal{
    display:inline-flex;
    align-items:center;
    margin-top:7px;
    padding:5px 9px;
    border-radius:999px;
    background:#ecfdf5;
    color:#166534;
    border:1px solid #bbf7d0;
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.05em;
}

.endereco-item-card p{
    color:#475569;
    font-size:14px;
    line-height:1.65;
}

.endereco-excluir{
    display:inline-flex;
    align-items:center;
    gap:7px;
    margin-top:14px;
    padding:9px 12px;
    border-radius:12px;
    background:#fef2f2;
    color:#b91c1c;
    font-size:13px;
    font-weight:900;
    transition:.22s ease;
}

.endereco-excluir:hover{
    background:#fee2e2;
    transform:translateY(-1px);
}

.endereco-excluir img{
    width:16px;
    height:16px;
    object-fit:contain;
}

body.modo-escuro .enderecos-hero,
body.modo-escuro .enderecos-form-card,
body.modo-escuro .enderecos-lista-card,
body.modo-escuro .endereco-item-card,
body.modo-escuro .enderecos-voltar{
    background:#0f172a;
    border-color:#1e293b;
}

body.modo-escuro .enderecos-hero h1,
body.modo-escuro .enderecos-card-titulo h2,
body.modo-escuro .enderecos-grid-form label > span,
body.modo-escuro .endereco-item-topo h3,
body.modo-escuro .enderecos-vazio h3{
    color:#e5e7eb;
}

body.modo-escuro .enderecos-hero p,
body.modo-escuro .enderecos-card-titulo p,
body.modo-escuro .endereco-item-card p,
body.modo-escuro .enderecos-vazio p{
    color:#94a3b8;
}

body.modo-escuro .enderecos-grid-form input,
body.modo-escuro .enderecos-check-principal,
body.modo-escuro .enderecos-vazio{
    background:#111827;
    border-color:#1e293b;
    color:#e5e7eb;
}

@media (max-width: 980px){
    .enderecos-layout{
        grid-template-columns:1fr;
    }
}

@media (max-width: 640px){
    .enderecos-page{
        width:min(100% - 20px, 1280px);
        margin-top:22px;
    }

    .enderecos-hero{
        padding:22px;
        align-items:flex-start;
    }

    .enderecos-hero-icone{
        width:54px;
        height:54px;
        border-radius:18px;
    }

    .enderecos-hero-icone img{
        width:28px;
        height:28px;
    }

    .enderecos-form-card,
    .enderecos-lista-card{
        padding:18px;
        border-radius:22px;
    }

    .enderecos-grid-form{
        grid-template-columns:1fr;
    }

    .enderecos-grid-form .campo-maior{
        grid-column:auto;
    }
}


/* =========================================================
   FAVORITOS NO CATÁLOGO
========================================================= */

.card-produto-catalogo{
    position:relative;
}

.form-favorito-card{
    position:absolute;
    top:14px;
    right:14px;
    z-index:30;
    margin:0;
}

.btn-favorito-card{
    width:42px;
    height:42px;
    border-radius:50%;
    border:1px solid rgba(226,232,240,0.95);
    background:rgba(255,255,255,0.96);
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    box-shadow:0 10px 24px rgba(15,23,42,0.12);
    transition:transform .22s ease, box-shadow .22s ease, background .22s ease, border-color .22s ease;
    backdrop-filter:blur(10px);
}

.btn-favorito-card:hover{
    transform:translateY(-2px) scale(1.04);
    box-shadow:0 14px 30px rgba(15,23,42,0.18);
    border-color:#bbf7d0;
}

.btn-favorito-card.ativo{
    background:#fef2f2;
    border-color:#fecaca;
}

.btn-favorito-card img{
    width:22px;
    height:22px;
    object-fit:contain;
}

body.modo-escuro .btn-favorito-card{
    background:#0f172a;
    border-color:#1e293b;
    color:#e5e7eb;
}

body.modo-escuro .btn-favorito-card.ativo{
    background:#3f1d1d;
    border-color:#7f1d1d;
    color:#fecaca;
}

@media (max-width:560px){
    .form-favorito-card{
        top:10px;
        right:10px;
    }

    .btn-favorito-card{
        width:38px;
        height:38px;
    }

    .btn-favorito-card img{
        width:20px;
        height:20px;
    }
}

/* =========================================================
   CATÁLOGO / PRODUTOS - MODERNO, DISCRETO E INTUITIVO
   Bloco de sobrescrita seguro: mantém o CSS anterior e refina a tela produtos.php.
========================================================= */

.catalogo-hero{
    width:min(1280px, calc(100% - 32px));
    margin:28px auto 18px;
    padding:34px;
    border-radius:28px;
    background:
        radial-gradient(circle at top right, rgba(34,197,94,.18), transparent 34%),
        linear-gradient(135deg, #ffffff 0%, #f8fafc 58%, #ecfdf5 100%);
    border:1px solid rgba(226,232,240,.95);
    box-shadow:0 18px 50px rgba(15,23,42,.07);
    display:grid;
    grid-template-columns:minmax(0, 1.35fr) auto;
    align-items:center;
    gap:24px;
}

.catalogo-hero .mini-destaque{
    margin-bottom:12px;
    background:#ecfdf5;
    color:#15803d;
    border:1px solid #bbf7d0;
    font-size:12px;
    letter-spacing:.04em;
    text-transform:uppercase;
}

.catalogo-hero h1{
    max-width:760px;
    font-size:clamp(30px, 3.5vw, 48px);
    line-height:1.04;
    letter-spacing:-1.4px;
    color:#0f172a;
    margin-bottom:12px;
}

.catalogo-hero p:not(.mini-destaque){
    max-width:680px;
    color:#64748b;
    font-size:15px;
}

.catalogo-resumo{
    display:grid;
    grid-template-columns:repeat(2, minmax(130px, 1fr));
    gap:12px;
}

.catalogo-resumo div{
    min-width:145px;
    padding:20px;
    border-radius:20px;
    background:rgba(255,255,255,.88);
    border:1px solid #e2e8f0;
    box-shadow:0 10px 26px rgba(15,23,42,.05);
}

.catalogo-resumo strong{
    display:block;
    color:#16a34a;
    font-size:30px;
    line-height:1;
    letter-spacing:-.8px;
    margin-bottom:8px;
}

.catalogo-resumo span{
    color:#64748b;
    font-size:12px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.catalogo-toolbar{
    width:min(1280px, calc(100% - 32px));
    margin:0 auto 14px;
    padding:14px;
    border-radius:22px;
    background:rgba(255,255,255,.92);
    border:1px solid #e2e8f0;
    box-shadow:0 10px 30px rgba(15,23,42,.05);
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    gap:16px;
    align-items:center;
}

.catalogo-busca{
    display:grid;
    grid-template-columns:minmax(260px, 1fr) minmax(180px, 220px) auto auto;
    gap:10px;
    align-items:center;
}

.campo-busca-produtos{
    display:flex;
    align-items:center;
    gap:10px;
    min-height:46px;
    padding:5px 6px 5px 14px;
    border-radius:999px;
    background:#f8fafc;
    border:1px solid #dbe4ee;
}

.catalogo-icone-busca{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height:28px;
    padding:0 10px;
    border-radius:999px;
    background:#ecfdf5;
    color:#166534;
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.campo-busca-produtos input{
    width:100%;
    border:none;
    background:transparent;
    color:#0f172a;
    font-size:14px;
    padding:9px 8px;
}

.catalogo-busca select{
    height:46px;
    border:1px solid #dbe4ee;
    background:#f8fafc;
    border-radius:14px;
    padding:0 12px;
    color:#334155;
    font-weight:700;
}

.catalogo-busca .btn,
.catalogo-busca .btn-secundario{
    height:46px;
    border-radius:14px;
    padding:0 18px;
    white-space:nowrap;
}

.catalogo-resultados{
    min-width:150px;
    padding:12px 16px;
    border-radius:18px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    text-align:center;
}

.catalogo-resultados strong{
    display:block;
    font-size:22px;
    line-height:1;
    color:#16a34a;
}

.catalogo-resultados span{
    color:#64748b;
    font-size:12px;
    font-weight:800;
}

.catalogo-intuicao{
    width:min(1280px, calc(100% - 32px));
    margin:0 auto 18px;
    padding:16px 18px;
    border-radius:20px;
    background:#0f172a;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    box-shadow:0 16px 40px rgba(15,23,42,.10);
}

.catalogo-intuicao strong{
    display:block;
    font-size:15px;
    margin-bottom:2px;
}

.catalogo-intuicao span{
    color:#cbd5e1;
    font-size:13px;
}

.catalogo-intuicao a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height:40px;
    padding:0 15px;
    border-radius:999px;
    background:#22c55e;
    color:#fff;
    font-weight:900;
    white-space:nowrap;
}

.catalogo-layout{
    width:min(1280px, calc(100% - 32px));
    margin:0 auto 60px;
    display:grid;
    grid-template-columns:250px minmax(0, 1fr);
    gap:20px;
    align-items:start;
}

.catalogo-sidebar{
    position:sticky;
    top:104px;
    display:grid;
    gap:14px;
}

.box-filtro-catalogo,
.box-ajuda-catalogo{
    background:rgba(255,255,255,.96);
    border:1px solid #e2e8f0;
    border-radius:22px;
    box-shadow:0 10px 30px rgba(15,23,42,.05);
    padding:18px;
}

.box-filtro-catalogo h3{
    font-size:15px;
    color:#0f172a;
    margin-bottom:12px;
    letter-spacing:-.2px;
}

.box-filtro-catalogo a{
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:40px;
    padding:10px 12px;
    border-radius:13px;
    color:#475569;
    font-weight:800;
    font-size:13px;
    transition:.22s ease;
}

.box-filtro-catalogo a:hover,
.box-filtro-catalogo a.ativo{
    background:#ecfdf5;
    color:#166534;
}

.box-filtro-catalogo a.destaque{
    color:#15803d;
}

.box-ajuda-catalogo{
    background:linear-gradient(135deg, #052e16, #166534);
    color:#fff;
}

.box-ajuda-catalogo strong{
    display:block;
    font-size:15px;
    margin-bottom:8px;
}

.box-ajuda-catalogo p{
    color:#dcfce7;
    font-size:13px;
}

.chips-categorias-mobile{
    display:none;
}

.grid-catalogo-premium{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(230px, 1fr));
    gap:18px;
}

.card-produto-catalogo{
    position:relative;
    border-radius:24px;
    overflow:hidden;
    background:#fff;
    border:1px solid #e2e8f0;
    box-shadow:0 10px 30px rgba(15,23,42,.06);
    transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.card-produto-catalogo:hover{
    transform:translateY(-4px);
    border-color:rgba(34,197,94,.45);
    box-shadow:0 20px 50px rgba(15,23,42,.12);
}

.card-imagem-catalogo{
    position:relative;
    display:block;
    padding:14px;
    background:linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.card-imagem-catalogo img{
    width:100%;
    height:190px;
    object-fit:contain;
    border-radius:18px;
    background:#fff;
}

.badge-catalogo,
.badge-desconto{
    position:absolute;
    top:14px;
    left:14px;
    z-index:3;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 10px;
    border-radius:999px;
    font-size:11px;
    font-weight:900;
    letter-spacing:.02em;
}

.badge-catalogo{
    background:#ecfdf5;
    color:#166534;
    border:1px solid #bbf7d0;
}

.badge-desconto{
    background:#ef4444;
    color:#fff;
    box-shadow:0 10px 18px rgba(239,68,68,.22);
}

.form-favorito-card{
    position:absolute;
    top:14px;
    right:14px;
    z-index:8;
}

.btn-favorito-card{
    width:42px;
    height:42px;
    border-radius:50%;
    border:1px solid #e2e8f0;
    background:rgba(255,255,255,.94);
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    box-shadow:0 10px 22px rgba(15,23,42,.09);
    transition:.22s ease;
}

.btn-favorito-card:hover{
    transform:scale(1.06);
    border-color:#bbf7d0;
}

.btn-favorito-card.ativo{
    background:#fff1f2;
    border-color:#fecdd3;
}

.btn-favorito-card img{
    width:21px;
    height:21px;
    object-fit:contain;
}

.card-conteudo-catalogo{
    padding:16px 16px 18px;
}

.linha-categoria-card{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:10px;
}

.linha-categoria-card .categoria{
    margin:0;
    color:#64748b;
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.status-disponivel-card{
    display:inline-flex;
    align-items:center;
    gap:5px;
    color:#15803d;
    background:#f0fdf4;
    border:1px solid #bbf7d0;
    border-radius:999px;
    padding:5px 8px;
    font-size:11px;
    font-weight:900;
    white-space:nowrap;
}

.status-disponivel-card img{
    width:13px;
    height:13px;
    object-fit:contain;
}

.card-conteudo-catalogo h3{
    min-height:44px;
    color:#0f172a;
    font-size:16px;
    line-height:1.25;
    letter-spacing:-.3px;
    margin-bottom:8px;
}

.descricao-card-produto{
    min-height:38px;
    color:#64748b;
    font-size:13px;
    line-height:1.45;
    margin-bottom:12px;
}

.preco-area-catalogo{
    min-height:64px;
    margin-bottom:12px;
}

.preco-catalogo,
.preco-area-catalogo .preco{
    color:#16a34a;
    font-size:24px;
    line-height:1.05;
    letter-spacing:-.6px;
    margin-bottom:5px;
}

.preco-original-cortado{
    color:#94a3b8;
    font-size:13px;
}

.contador-promocao{
    margin-top:6px;
}

.acoes-card-produto{
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px;
    align-items:center;
}

.acoes-card-produto .btn,
.acoes-card-produto .btn-secundario{
    min-height:43px;
    border-radius:14px;
    font-size:13px;
    font-weight:900;
    padding:0 14px;
}

.btn-card-secundario{
    min-width:88px;
}

.sem-produtos-catalogo{
    padding:40px;
    border-radius:24px;
    background:#fff;
    border:1px dashed #cbd5e1;
}

body.modo-escuro .catalogo-hero,
body.modo-escuro .catalogo-toolbar,
body.modo-escuro .box-filtro-catalogo,
body.modo-escuro .card-produto-catalogo,
body.modo-escuro .sem-produtos-catalogo{
    background:#0f172a;
    border-color:#1e293b;
}

body.modo-escuro .catalogo-hero h1,
body.modo-escuro .box-filtro-catalogo h3,
body.modo-escuro .card-conteudo-catalogo h3{
    color:#e5e7eb;
}

body.modo-escuro .campo-busca-produtos,
body.modo-escuro .catalogo-busca select,
body.modo-escuro .catalogo-resultados,
body.modo-escuro .catalogo-resumo div{
    background:#111827;
    border-color:#1e293b;
}

body.modo-escuro .campo-busca-produtos input,
body.modo-escuro .catalogo-busca select{
    color:#e5e7eb;
}

@media (max-width:1100px){
    .catalogo-hero,
    .catalogo-toolbar{
        grid-template-columns:1fr;
    }

    .catalogo-layout{
        grid-template-columns:1fr;
    }

    .catalogo-sidebar{
        position:static;
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .box-ajuda-catalogo{
        grid-column:1 / -1;
    }
}

@media (max-width:820px){
    .catalogo-hero,
    .catalogo-toolbar,
    .catalogo-intuicao,
    .catalogo-layout{
        width:min(100% - 20px, 1280px);
    }

    .catalogo-hero{
        padding:24px;
        border-radius:24px;
    }

    .catalogo-resumo{
        grid-template-columns:1fr 1fr;
    }

    .catalogo-busca{
        grid-template-columns:1fr;
    }

    .catalogo-resultados{
        text-align:left;
    }

    .catalogo-sidebar{
        display:none;
    }

    .chips-categorias-mobile{
        display:flex;
        gap:8px;
        overflow-x:auto;
        padding:4px 0 14px;
        margin-bottom:4px;
    }

    .chips-categorias-mobile a{
        white-space:nowrap;
        border-radius:999px;
        padding:9px 13px;
        background:#fff;
        border:1px solid #e2e8f0;
        color:#475569;
        font-weight:800;
        font-size:13px;
    }

    .chips-categorias-mobile a.ativo{
        background:#22c55e;
        border-color:#22c55e;
        color:#fff;
    }

    .catalogo-intuicao{
        flex-direction:column;
        align-items:flex-start;
    }

    .catalogo-intuicao a{
        width:100%;
    }
}

@media (max-width:560px){
    .catalogo-hero h1{
        font-size:28px;
    }

    .catalogo-resumo{
        grid-template-columns:1fr;
    }

    .grid-catalogo-premium{
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:12px;
    }

    .card-imagem-catalogo{
        padding:10px;
    }

    .card-imagem-catalogo img{
        height:128px;
        border-radius:14px;
    }

    .card-conteudo-catalogo{
        padding:12px;
    }

    .linha-categoria-card{
        align-items:flex-start;
        flex-direction:column;
        gap:6px;
    }

    .card-conteudo-catalogo h3{
        min-height:40px;
        font-size:13px;
    }

    .descricao-card-produto{
        display:none;
    }

    .preco-catalogo,
    .preco-area-catalogo .preco{
        font-size:18px;
    }

    .acoes-card-produto{
        grid-template-columns:1fr;
        gap:8px;
    }

    .btn-card-secundario{
        display:none;
    }

    .btn-favorito-card{
        width:38px;
        height:38px;
    }
}

/* =========================================================
   CHECKOUT ENTREGA - PALADINI
   Tela de escolha/cadastro de endereço na finalização
========================================================= */

.checkout-entrega-page{
    width:min(1280px, calc(100% - 32px));
    margin:34px auto 70px;
}

.checkout-entrega-hero{
    display:flex;
    align-items:center;
    gap:18px;
    padding:28px;
    border-radius:30px;
    background:
        radial-gradient(circle at top right, rgba(34,197,94,.20), transparent 35%),
        linear-gradient(135deg, #ffffff, #f8fafc);
    border:1px solid #dbe4ee;
    box-shadow:0 18px 42px rgba(15,23,42,.075);
    margin-bottom:22px;
}

.checkout-entrega-icone{
    width:72px;
    height:72px;
    border-radius:24px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:linear-gradient(135deg, #22c55e, #16a34a);
    box-shadow:0 14px 32px rgba(34,197,94,.24);
    flex:0 0 auto;
}

.checkout-entrega-icone img{
    width:38px;
    height:38px;
    object-fit:contain;
}

.checkout-entrega-hero span,
.checkout-entrega-card-titulo span{
    display:inline-block;
    color:#16a34a;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.08em;
    margin-bottom:5px;
}

.checkout-entrega-hero h1{
    color:#0f172a;
    font-size:clamp(28px, 3vw, 42px);
    line-height:1.05;
    letter-spacing:-1px;
}

.checkout-entrega-hero p{
    color:#64748b;
    max-width:760px;
    margin-top:8px;
}

.checkout-entrega-alerta{
    padding:14px 16px;
    border-radius:16px;
    font-size:14px;
    font-weight:800;
    margin:0 0 18px;
    border:1px solid transparent;
}

.checkout-entrega-alerta-erro{
    background:#fef2f2;
    color:#991b1b;
    border-color:#fecaca;
}

.checkout-entrega-layout{
    display:grid;
    grid-template-columns:minmax(0, 1.08fr) minmax(380px, .92fr);
    gap:22px;
    align-items:start;
}

.checkout-entrega-card{
    background:rgba(255,255,255,.97);
    border:1px solid #dbe4ee;
    border-radius:28px;
    padding:24px;
    box-shadow:0 15px 36px rgba(15,23,42,.065);
}

.checkout-entrega-card-titulo{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    margin-bottom:20px;
}

.checkout-entrega-card-titulo h2{
    color:#0f172a;
    font-size:25px;
    line-height:1.12;
    letter-spacing:-.5px;
}

.checkout-entrega-card-titulo p{
    color:#64748b;
    font-size:14px;
    margin-top:6px;
}

.checkout-btn-novo{
    min-height:44px;
    padding:0 14px;
    border-radius:14px;
    background:#ecfdf5;
    border:1px solid #bbf7d0;
    color:#166534;
    font-weight:900;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    cursor:pointer;
    transition:.22s ease;
    white-space:nowrap;
}

.checkout-btn-novo:hover{
    transform:translateY(-1px);
    background:#dcfce7;
}

.checkout-btn-novo img{
    width:17px;
    height:17px;
    object-fit:contain;
}

.checkout-enderecos-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
}

.checkout-endereco-card{
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    min-height:250px;
    border:1px solid #e2e8f0;
    background:#fff;
    border-radius:24px;
    padding:18px;
    transition:.22s ease;
}

.checkout-endereco-card:hover{
    transform:translateY(-2px);
    border-color:#bbf7d0;
    box-shadow:0 16px 30px rgba(15,23,42,.075);
}

.checkout-endereco-principal{
    border-color:#86efac;
    background:linear-gradient(180deg, #ffffff, #f0fdf4);
}

.checkout-endereco-topo{
    display:flex;
    align-items:flex-start;
    gap:12px;
    margin-bottom:12px;
}

.checkout-endereco-topo img{
    width:32px;
    height:32px;
    object-fit:contain;
    flex:0 0 auto;
}

.checkout-endereco-topo h3{
    color:#0f172a;
    font-size:18px;
    line-height:1.18;
    letter-spacing:-.2px;
}

.checkout-endereco-topo small{
    display:inline-flex;
    margin-top:7px;
    padding:5px 9px;
    border-radius:999px;
    background:#ecfdf5;
    border:1px solid #bbf7d0;
    color:#166534;
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.05em;
}

.checkout-endereco-card p{
    color:#475569;
    font-size:14px;
    line-height:1.65;
    margin-bottom:16px;
}

.form-usar-endereco{
    margin-top:auto;
}

.checkout-btn-usar,
.checkout-btn-confirmar{
    width:100%;
    min-height:52px;
    border-radius:16px;
    box-shadow:0 14px 28px rgba(34,197,94,.22);
}

.checkout-btn-usar img,
.checkout-btn-confirmar img{
    width:20px;
    height:20px;
    object-fit:contain;
}

.checkout-entrega-vazio{
    min-height:300px;
    border:1px dashed #cbd5e1;
    background:#f8fafc;
    border-radius:24px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:32px;
}

.checkout-entrega-vazio img{
    width:48px;
    height:48px;
    object-fit:contain;
    margin-bottom:14px;
    opacity:.78;
}

.checkout-entrega-vazio h3{
    color:#0f172a;
    font-size:21px;
}

.checkout-entrega-vazio p{
    color:#64748b;
    margin:7px 0 18px;
    max-width:380px;
}

.checkout-novo-endereco{
    position:sticky;
    top:118px;
}

.checkout-grid-form{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
}

.checkout-grid-form label{
    display:flex;
    flex-direction:column;
    gap:7px;
}

.checkout-grid-form label > span{
    font-size:12px;
    font-weight:900;
    color:#0f172a;
    letter-spacing:.04em;
}

.checkout-grid-form input{
    width:100%;
    min-height:48px;
    border:1px solid #cbd5e1;
    background:#f8fafc;
    border-radius:14px;
    padding:12px 13px;
    color:#0f172a;
    font-size:14px;
}

.checkout-grid-form small{
    font-size:11px;
    color:#64748b;
    line-height:1.35;
}

.checkout-grid-form .campo-maior{
    grid-column:span 2;
}

.checkout-textarea-entrega{
    width:100%;
    min-height:104px;
    margin-top:14px;
    padding:14px;
    border-radius:16px;
    border:1px solid #cbd5e1;
    background:#f8fafc;
    resize:vertical;
    font-size:14px;
}

.checkout-check-salvar{
    display:flex;
    align-items:center;
    gap:10px;
    margin:16px 0;
    padding:13px 14px;
    border-radius:16px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    color:#334155;
    font-size:14px;
    font-weight:800;
    cursor:pointer;
}

.checkout-check-salvar input{
    width:18px;
    height:18px;
    accent-color:#16a34a;
}

.cep-status-sucesso{color:#15803d !important;font-weight:900;}
.cep-status-erro{color:#dc2626 !important;font-weight:900;}
.cep-status-carregando{color:#2563eb !important;font-weight:900;}

body.modo-escuro .checkout-entrega-hero,
body.modo-escuro .checkout-entrega-card,
body.modo-escuro .checkout-endereco-card{
    background:#0f172a;
    border-color:#1e293b;
}

body.modo-escuro .checkout-entrega-hero h1,
body.modo-escuro .checkout-entrega-card-titulo h2,
body.modo-escuro .checkout-endereco-topo h3,
body.modo-escuro .checkout-grid-form label > span,
body.modo-escuro .checkout-entrega-vazio h3{
    color:#e5e7eb;
}

body.modo-escuro .checkout-entrega-hero p,
body.modo-escuro .checkout-entrega-card-titulo p,
body.modo-escuro .checkout-endereco-card p,
body.modo-escuro .checkout-entrega-vazio p{
    color:#94a3b8;
}

body.modo-escuro .checkout-grid-form input,
body.modo-escuro .checkout-textarea-entrega,
body.modo-escuro .checkout-check-salvar,
body.modo-escuro .checkout-entrega-vazio{
    background:#111827;
    border-color:#1e293b;
    color:#e5e7eb;
}

@media (max-width: 1100px){
    .checkout-entrega-layout{
        grid-template-columns:1fr;
    }

    .checkout-novo-endereco{
        position:static;
    }
}

@media (max-width: 760px){
    .checkout-enderecos-grid{
        grid-template-columns:1fr;
    }

    .checkout-entrega-card-titulo{
        flex-direction:column;
    }

    .checkout-btn-novo{
        width:100%;
    }
}

@media (max-width: 640px){
    .checkout-entrega-page{
        width:min(100% - 20px, 1280px);
        margin-top:22px;
    }

    .checkout-entrega-hero{
        padding:22px;
        align-items:flex-start;
    }

    .checkout-entrega-icone{
        width:56px;
        height:56px;
        border-radius:18px;
    }

    .checkout-entrega-icone img{
        width:30px;
        height:30px;
    }

    .checkout-entrega-card{
        padding:18px;
        border-radius:24px;
    }

    .checkout-grid-form{
        grid-template-columns:1fr;
    }

    .checkout-grid-form .campo-maior{
        grid-column:auto;
    }
}

/* =========================================================
   CHECKOUT ENTREGA - AJUSTES DE USO/SALVAMENTO DE ENDEREÇO
========================================================= */
.checkout-acoes-endereco {
    margin: 18px 0 14px;
    display: grid;
    gap: 8px;
}

.checkout-btn-salvar-endereco {
    width: 100%;
    min-height: 54px;
    border-radius: 16px;
    font-weight: 900;
}

.checkout-btn-salvar-endereco img {
    width: 20px;
    height: 20px;
    object-fit: contain;
}

.checkout-acoes-endereco small {
    color: #64748b;
    font-size: 12px;
    line-height: 1.35;
}

.checkout-btn-desabilitado,
.checkout-btn-salvar-endereco:disabled {
    opacity: .58;
    cursor: not-allowed;
    filter: grayscale(.25);
    transform: none !important;
}

.checkout-endereco-card.checkout-endereco-selecionado {
    border-color: #22c55e !important;
    box-shadow: 0 16px 38px rgba(34, 197, 94, .16) !important;
    background: linear-gradient(180deg, #ffffff, #f0fdf4);
}

.btn-usar-endereco {
    border: none;
}


/* =========================================================
   MINHA CONTA / PEDIDOS - REFINAMENTO ENTREGA E RECEBIMENTO
========================================================= */
.pedido-dashboard-card-pro{
    position:relative;
    overflow:hidden;
    background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%);
}

.pedido-dashboard-card-pro::before{
    content:"";
    position:absolute;
    inset:0 auto 0 0;
    width:5px;
    background:linear-gradient(180deg,#22c55e,#16a34a);
}

.pedido-dashboard-identificacao h3{
    display:flex;
    align-items:center;
    gap:10px;
}

.pedido-dashboard-identificacao h3 img{
    width:24px;
    height:24px;
    object-fit:contain;
}

.pedido-dashboard-info-pro{
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.progresso-pedido-cabecalho{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:8px;
    color:#64748b;
    font-size:12px;
    font-weight:900;
}

.progresso-pedido-cabecalho strong{
    color:#166534;
}

.progresso-pedido-etapas-pro small:last-child{
    color:#166534;
}

.pedido-card-rodape-pro form{
    margin:0;
}

.btn-confirmar-mini,
.btn-confirmar-recebimento{
    border:none;
    background:linear-gradient(135deg,#16a34a,#22c55e);
    color:#fff;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    border-radius:13px;
    font-weight:900;
    cursor:pointer;
    transition:.2s ease;
}

.btn-confirmar-mini{
    padding:10px 13px;
    font-size:13px;
}

.btn-confirmar-mini img,
.btn-confirmar-recebimento img{
    width:18px;
    height:18px;
    object-fit:contain;
    filter:brightness(0) invert(1);
}

.btn-confirmar-mini:hover,
.btn-confirmar-recebimento:hover{
    transform:translateY(-2px);
    filter:brightness(1.03);
}

.pedido-pro-page{
    margin-top:120px;
}

.pedido-pro-voltar{
    margin-bottom:18px;
}

.pedido-pro-voltar a{
    color:#16a34a;
    font-weight:900;
}

.pedido-alerta-sucesso{
    background:#ecfdf5;
    color:#166534;
    border:1px solid #bbf7d0;
    border-radius:18px;
    padding:14px 18px;
    font-weight:800;
    margin-bottom:18px;
}

.pedido-pro-hero{
    display:grid;
    grid-template-columns:minmax(0,1fr) 280px;
    gap:22px;
    align-items:stretch;
    background:radial-gradient(circle at top right, rgba(34,197,94,.12), transparent 34%), #fff;
    border:1px solid #e2e8f0;
    border-radius:30px;
    padding:30px;
    box-shadow:0 18px 42px rgba(15,23,42,.07);
    margin-bottom:22px;
}

.pedido-pro-hero h1{
    font-size:clamp(30px,4vw,46px);
    line-height:1.04;
    letter-spacing:-1px;
    margin:0 0 10px;
    color:#0f172a;
}

.pedido-pro-hero p{
    color:#64748b;
    max-width:650px;
    line-height:1.6;
}

.pedido-pro-badges{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-top:18px;
}

.pedido-badge{
    display:inline-flex;
    align-items:center;
    min-height:34px;
    padding:0 13px;
    border-radius:999px;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.pedido-badge-pagamento{background:#dcfce7;color:#166534;}
.pedido-badge-operador{background:#dbeafe;color:#1d4ed8;}
.pedido-badge-cancelado{background:#fee2e2;color:#991b1b;}

.pedido-pro-total-card{
    border-radius:24px;
    background:#0f172a;
    color:#fff;
    padding:24px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    box-shadow:0 18px 34px rgba(15,23,42,.16);
}

.pedido-pro-total-card span{
    color:#bbf7d0;
    font-weight:900;
    font-size:13px;
}

.pedido-pro-total-card strong{
    font-size:34px;
    line-height:1;
    margin:9px 0;
}

.pedido-pro-total-card small{
    color:#cbd5e1;
    font-weight:800;
}

.pedido-pro-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) 360px;
    gap:22px;
    align-items:start;
}

.pedido-pro-card{
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:26px;
    padding:24px;
    box-shadow:0 12px 30px rgba(15,23,42,.05);
    margin-bottom:22px;
}

.pedido-pro-card-titulo{
    display:flex;
    justify-content:space-between;
    gap:18px;
    align-items:flex-start;
    margin-bottom:18px;
}

.pedido-pro-card-titulo span{
    display:block;
    color:#16a34a;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.5px;
    margin-bottom:5px;
}

.pedido-pro-card-titulo h2{
    margin:0;
    color:#0f172a;
    font-size:24px;
    letter-spacing:-.5px;
}

.pedido-pro-card-titulo > strong{
    color:#166534;
    background:#ecfdf5;
    border:1px solid #bbf7d0;
    border-radius:999px;
    padding:8px 12px;
}

.pedido-pro-barra{
    width:100%;
    height:11px;
    background:#e2e8f0;
    border-radius:999px;
    overflow:hidden;
    margin-bottom:22px;
}

.pedido-pro-barra span{
    display:block;
    height:100%;
    background:linear-gradient(90deg,#22c55e,#16a34a);
    border-radius:999px;
}

.pedido-pro-timeline{
    display:grid;
    gap:16px;
}

.pedido-pro-etapa{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:14px;
    position:relative;
}

.pedido-pro-etapa:not(:last-child)::after{
    content:"";
    position:absolute;
    left:17px;
    top:38px;
    bottom:-18px;
    width:2px;
    background:#e2e8f0;
}

.pedido-pro-etapa.ativa:not(:last-child)::after{
    background:#86efac;
}

.pedido-pro-etapa-icone{
    width:36px;
    height:36px;
    border-radius:999px;
    background:#e2e8f0;
    color:#64748b;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:900;
    z-index:1;
}

.pedido-pro-etapa.ativa .pedido-pro-etapa-icone{
    background:#22c55e;
    color:#fff;
}

.pedido-pro-etapa-texto strong{
    display:block;
    color:#0f172a;
    font-size:15px;
}

.pedido-pro-etapa-texto span,
.pedido-pro-etapa-texto small{
    display:block;
    color:#64748b;
    font-size:13px;
    line-height:1.45;
}

.pedido-pro-etapa-texto small{
    margin-top:4px;
    font-weight:900;
    color:#166534;
}

.pedido-confirmar-recebimento{
    margin-top:22px;
    background:#f0fdf4;
    border:1px solid #bbf7d0;
    border-radius:20px;
    padding:18px;
}

.btn-confirmar-recebimento{
    min-height:52px;
    padding:0 18px;
    width:100%;
    font-size:15px;
}

.pedido-confirmar-recebimento p{
    color:#64748b;
    margin:10px 0 0;
    font-size:13px;
    text-align:center;
}

.pedido-recebido-ok{
    margin-top:22px;
    display:flex;
    gap:12px;
    align-items:center;
    background:#ecfdf5;
    border:1px solid #bbf7d0;
    border-radius:18px;
    padding:14px;
}

.pedido-recebido-ok img{
    width:28px;
    height:28px;
}

.pedido-recebido-ok strong,
.pedido-recebido-ok span{
    display:block;
}

.pedido-recebido-ok strong{color:#166534;}
.pedido-recebido-ok span{color:#64748b;font-size:13px;}

.pedido-itens-lista{
    display:grid;
    gap:10px;
}

.pedido-item-card{
    display:flex;
    justify-content:space-between;
    gap:18px;
    align-items:center;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:18px;
    padding:14px;
}

.pedido-item-card strong,
.pedido-item-card span{
    display:block;
}

.pedido-item-card strong{color:#0f172a;}
.pedido-item-card span{color:#64748b;font-size:13px;margin-top:3px;}
.pedido-item-card b{color:#166534;white-space:nowrap;}

.pedido-info-lista{
    display:grid;
    gap:10px;
}

.pedido-info-lista p{
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:16px;
    padding:12px;
    margin:0;
}

.pedido-info-lista span,
.pedido-info-lista strong{
    display:block;
}

.pedido-info-lista span{
    color:#64748b;
    font-size:12px;
    font-weight:900;
    margin-bottom:3px;
}

.pedido-info-lista strong{
    color:#0f172a;
    font-size:14px;
}

.pedido-endereco-texto{
    color:#334155;
    line-height:1.65;
}

.pedido-observacao-box{
    margin-top:14px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:16px;
    padding:14px;
}

.pedido-observacao-box span{
    display:block;
    color:#64748b;
    font-size:12px;
    font-weight:900;
    margin-bottom:6px;
}

.pedido-observacao-box p{
    margin:0;
    color:#334155;
}


/* =========================================================
   FLUXO RETIRADA NA LOJA - PEDIDO CLIENTE
========================================================= */
.pedido-retirada-pronta{
    margin-top:18px;
    display:flex;
    gap:14px;
    align-items:flex-start;
    background:linear-gradient(135deg,#ecfdf5,#f0fdf4);
    border:1px solid #bbf7d0;
    border-radius:18px;
    padding:16px;
    color:#14532d;
}

.pedido-retirada-pronta img{
    width:34px;
    height:34px;
    object-fit:contain;
    flex:0 0 auto;
}

.pedido-retirada-pronta strong{
    display:block;
    font-size:16px;
    margin-bottom:4px;
}

.pedido-retirada-pronta p{
    margin:0;
    color:#166534;
    line-height:1.45;
    font-size:14px;
}
.status-indisponivel-card {
    background: #fff1f2 !important;
    border: 1px solid #fecaca !important;
    color: #b91c1c !important;
}

.status-indisponivel-card img {
    filter: none !important;
}
.carrinho-ajuda-v2{
    text-decoration: none;
    color: inherit;
    transition: all .2s ease;
    cursor: pointer;
}

.carrinho-ajuda-v2:hover{
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0,0,0,.08);
}
.btn-carrinho-secundario-v2 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    padding: 14px 22px;
    border-radius: 16px;

    background: linear-gradient(135deg, #16a34a, #22c55e);
    color: #fff !important;
    border: 1px solid #16a34a;

    font-weight: 700;
    text-decoration: none;

    box-shadow:
        0 0 8px rgba(34, 197, 94, 0.18),
        0 6px 18px rgba(34, 197, 94, 0.15);

    transition: all 0.25s ease;
}

.btn-carrinho-secundario-v2:hover {
    transform: translateY(-2px);
    background: linear-gradient(135deg, #15803d, #16a34a);
    box-shadow:
        0 0 12px rgba(34, 197, 94, 0.25),
        0 10px 24px rgba(34, 197, 94, 0.22);
}

.btn-carrinho-secundario-v2 img {
    width: 18px;
    height: 18px;
    object-fit: contain;
}
/* =========================================================
   REFORMA HOME PALADINI 2026 - MARKETPLACE PROFISSIONAL
   Aplicado parcialmente ao index: header/hero/produtos/footer.
   Mantém paleta verde e branco e preserva as lógicas existentes.
========================================================= */

body.home-marketplace,
body.home-premium {
    background: #f6faf8;
}

body.home-marketplace .topo,
body.home-marketplace .topo-premium,
body.home-premium .topo-premium,
body.home-premium .topo {
    background: rgba(255,255,255,0.98) !important;
    border-bottom: 1px solid #dbeafe !important;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08) !important;
    backdrop-filter: blur(16px) !important;
}

body.home-marketplace .topo-premium-inner,
body.home-premium .topo-premium-inner {
    width: min(1320px, calc(100% - 36px));
    min-height: 82px;
}

body.home-marketplace .logo-premium,
body.home-premium .logo-premium,
body.home-marketplace .logo-area,
body.home-premium .logo-area {
    border-radius: 16px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.05);
}

body.home-marketplace .menu-premium a,
body.home-premium .menu-premium a,
body.home-marketplace .menu-dropdown-premium > a,
body.home-premium .menu-dropdown-premium > a,
body.home-marketplace .menu a,
body.home-premium .menu a {
    color: #0f172a;
    font-weight: 900;
}

body.home-marketplace .menu-premium a:hover,
body.home-premium .menu-premium a:hover,
body.home-marketplace .menu-dropdown-premium:hover > a,
body.home-premium .menu-dropdown-premium:hover > a,
body.home-marketplace .menu a:hover,
body.home-premium .menu a:hover {
    background: #ecfdf5;
    color: #166534;
}

body.home-marketplace .busca-premium,
body.home-premium .busca-premium,
body.home-marketplace .topo-premium .busca,
body.home-premium .topo-premium .busca,
body.home-marketplace .busca,
body.home-premium .busca {
    background: #f8fafc !important;
    border: 1px solid #dce7ef !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.9) !important;
}

body.home-marketplace .busca-premium button,
body.home-premium .busca-premium button,
body.home-marketplace .topo-premium .busca button,
body.home-premium .topo-premium .busca button,
body.home-marketplace .busca button,
body.home-premium .busca button,
.btn-card-comprar {
    background: linear-gradient(135deg, #22c55e, #15803d) !important;
    color: #ffffff !important;
    box-shadow: 0 10px 22px rgba(34, 197, 94, 0.22);
}

/* Hero estilo marketplace: grande, limpo, com cantos e impacto visual */


.conteudo-home-marketplace {
    width: min(1320px, calc(100% - 36px)) !important;
    margin: 22px auto 0 !important;
}

/* Benefícios logo abaixo do hero, sem botões de categorias */
.home-beneficios-marketplace {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin: 16px 0 30px;
}

.home-beneficios-marketplace div {
    min-height: 88px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 18px;
    display: grid;
    grid-template-columns: 42px 1fr;
    grid-template-areas: "icon title" "icon text";
    align-items: center;
    column-gap: 12px;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.055);
}

.home-beneficios-marketplace span {
    grid-area: icon;
    width: 42px;
    height: 42px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #ecfdf5;
    border: 1px solid #bbf7d0;
    font-size: 20px;
}

.home-beneficios-marketplace strong {
    grid-area: title;
    color: #14532d;
    line-height: 1.1;
    font-size: 15px;
}

.home-beneficios-marketplace p {
    grid-area: text;
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
    margin: 0;
}

.home-section-marketplace {
    margin-top: 34px;
}

.home-produtos-cabecalho {
    margin-bottom: 18px;
    align-items: flex-end;
}

.home-produtos-cabecalho h2 {
    font-size: clamp(27px, 2.5vw, 36px) !important;
    color: #0f172a;
    letter-spacing: -0.8px;
}

.home-produtos-cabecalho span {
    color: #64748b;
    font-weight: 600;
}

.home-section-marketplace .grid-produtos,
.home-section-marketplace.grid-produtos,
.home-section-marketplace .grid-produtos-home-pro {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 16px !important;
    margin-top: 0 !important;
}

.card-marketplace,
.destaques .card-marketplace {
    position: relative;
    min-width: 0;
    border-radius: 18px !important;
    overflow: hidden;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06) !important;
    transition: transform 0.24s ease, box-shadow 0.24s ease, border-color 0.24s ease !important;
}

.card-marketplace:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(34, 197, 94, 0.42) !important;
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.13) !important;
}

.card-marketplace .favorito-home {
    position: absolute;
    z-index: 8;
    top: 12px;
    right: 12px;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    background: rgba(255,255,255,0.94);
    border: 1px solid #e5e7eb;
    color: #334155;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 900;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
}

.card-marketplace .card-imagem,
.destaques .card-marketplace .card-imagem {
    height: 176px !important;
    padding: 14px !important;
    background: linear-gradient(180deg, #f8fafc, #f1f5f9) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.card-marketplace .card-imagem img,
.destaques .card-marketplace .card-imagem img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    border-radius: 13px !important;
    background: #ffffff !important;
}

.card-marketplace .card-conteudo,
.destaques .card-marketplace .card-conteudo {
    padding: 14px !important;
}

.card-marketplace .categoria {
    display: block;
    font-size: 11px !important;
    line-height: 1.2;
    min-height: 14px;
    color: #64748b !important;
    font-weight: 800;
    margin-bottom: 7px !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.card-marketplace h3,
.destaques .card-marketplace h3 {
    min-height: 42px !important;
    margin-bottom: 9px !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
    font-weight: 900 !important;
}

.card-marketplace h3 a {
    color: #111827;
}

.card-marketplace h3 a:hover {
    color: #166534;
}

.card-marketplace .preco,
.destaques .card-marketplace .preco {
    margin: 0 0 8px !important;
    color: #15803d !important;
    font-size: 20px !important;
    line-height: 1.05 !important;
    font-weight: 950 !important;
    letter-spacing: -0.5px;
}

.card-marketplace .preco-original-cortado {
    margin: -3px 0 5px !important;
    color: #94a3b8;
    text-decoration: line-through;
    font-size: 12px;
    font-weight: 800;
}

.card-marketplace .contador-promocao {
    display: inline-flex;
    margin-bottom: 9px;
    padding: 4px 8px;
    border-radius: 999px;
    background: #dcfce7;
    color: #166534;
    font-size: 10px;
    font-weight: 900;
}

.card-marketplace .selo-produto,
.card-marketplace .selo-promocao-pro {
    top: 12px !important;
    left: 12px !important;
    z-index: 7 !important;
    padding: 5px 9px !important;
    font-size: 10px !important;
    letter-spacing: 0.2px;
}

.card-marketplace .selo-produto {
    background: #22c55e !important;
}

.btn-card-comprar {
    width: 100%;
    min-height: 39px;
    padding: 0 12px !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    font-weight: 950 !important;
}

.vitrine-home-loop {
    transition: opacity .35s ease, transform .35s ease;
}

.vitrine-home-loop.vitrine-home-trocando {
    opacity: 0;
    transform: translateY(8px);
}

.bloco-confiança-marketplace {
    margin-top: 38px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
}

.chamada-marketplace {
    background:
        radial-gradient(circle at top right, rgba(187, 247, 208, 0.35), transparent 34%),
        linear-gradient(135deg, #14532d, #16a34a) !important;
}

/* Rodapé com cara de marketplace, sem abandonar o verde Paladini */
.rodape {
    margin-top: 62px !important;
    border-top: 4px solid #22c55e !important;
    background: linear-gradient(180deg, #0b1f18 0%, #020617 100%) !important;
}

.rodape-conteudo,
.rodape-extra {
    max-width: 1320px !important;
}

.rodape-coluna h4,
.bloco-rodape h4,
.rodape-coluna a {
    color: #4ade80 !important;
}

body.modo-escuro .card-marketplace,
body.modo-escuro .home-beneficios-marketplace div,
body.modo-escuro .bloco-confiança-marketplace {
    background: #0f172a !important;
    border-color: #1e293b !important;
}

body.modo-escuro .home-produtos-cabecalho h2,
body.modo-escuro .card-marketplace h3 a {
    color: #e5e7eb !important;
}

body.modo-escuro .card-marketplace .card-imagem {
    background: #111827 !important;
}

@media (max-width: 1180px) {
    .home-section-marketplace .grid-produtos,
    .home-section-marketplace .grid-produtos-home-pro {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }

    
}

@media (max-width: 920px) {
    .home-beneficios-marketplace {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-section-marketplace .grid-produtos,
    .home-section-marketplace .grid-produtos-home-pro {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 768px) {
    

    .conteudo-home-marketplace {
        width: 100% !important;
        padding: 0 12px !important;
        margin-top: 14px !important;
    }

    

    

    

    

    .home-beneficios-marketplace {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        margin: 12px 0 22px;
    }

    .home-beneficios-marketplace div {
        min-height: 88px;
        padding: 13px;
        grid-template-columns: 36px 1fr;
        column-gap: 9px;
        border-radius: 17px;
    }

    .home-beneficios-marketplace span {
        width: 36px;
        height: 36px;
        font-size: 17px;
    }

    .home-produtos-cabecalho {
        display: grid !important;
        grid-template-columns: 1fr auto;
        align-items: end !important;
        gap: 8px;
    }

    .home-produtos-cabecalho h2 {
        font-size: 23px !important;
    }

    .home-produtos-cabecalho span {
        display: none;
    }

    .home-produtos-cabecalho .btn-secundario {
        min-height: 36px;
        padding: 0 11px;
        border-radius: 999px;
        font-size: 12px;
    }

    .home-section-marketplace .grid-produtos,
    .home-section-marketplace .grid-produtos-home-pro {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .card-marketplace .card-imagem,
    .destaques .card-marketplace .card-imagem {
        height: 132px !important;
        padding: 8px !important;
    }

    .card-marketplace .card-conteudo {
        padding: 10px !important;
    }

    .card-marketplace h3,
    .destaques .card-marketplace h3 {
        font-size: 13px !important;
        min-height: 38px !important;
    }

    .card-marketplace .preco {
        font-size: 18px !important;
    }

    .btn-card-comprar {
        min-height: 37px;
    }
}

@media (max-width: 420px) {
    .home-beneficios-marketplace strong {
        font-size: 13px;
    }

    .home-beneficios-marketplace p {
        font-size: 11px;
    }

    .card-marketplace .favorito-home {
        width: 30px;
        height: 30px;
    }
}

/* =========================================================
   AJUSTES FINOS - HERO DISCRETO + HEADER POR CLIQUE
   Solicitação: hero menor, mais perto do topo e sem gradiente verde.
========================================================= */

body.home-marketplace,
body.home-marketplace.home-premium {
    padding-top: 88px !important;
}

body.home-marketplace .topo-premium,
body.home-marketplace .topo,
body.home-premium.home-marketplace .topo-premium,
body.home-premium.home-marketplace .topo {
    min-height: 76px !important;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.075) !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

body.home-marketplace .topo-premium-inner,
body.home-premium.home-marketplace .topo-premium-inner {
    min-height: 76px !important;
    height: 76px !important;
    width: min(1320px, calc(100% - 36px)) !important;
    gap: 14px !important;
}

body.home-marketplace .logo-premium,
body.home-premium.home-marketplace .logo-premium {
    border-radius: 15px !important;
    padding: 5px !important;
    box-shadow: 0 5px 15px rgba(15, 23, 42, 0.055) !important;
}

body.home-marketplace .logo-premium img,
body.home-marketplace .logo-img,
body.home-premium.home-marketplace .logo-premium img,
body.home-premium.home-marketplace .logo-img {
    height: 50px !important;
    max-height: 50px !important;
    object-fit: contain !important;
}

body.home-marketplace .menu-premium a,
body.home-premium.home-marketplace .menu-premium a,
body.home-marketplace .menu-dropdown-premium > a,
body.home-premium.home-marketplace .menu-dropdown-premium > a {
    min-height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 0 14px !important;
    border-radius: 999px !important;
    letter-spacing: 0.2px !important;
}

body.home-marketplace .menu-premium a:hover,
body.home-premium.home-marketplace .menu-premium a:hover,
body.home-marketplace .menu-dropdown-premium > a:hover,
body.home-premium.home-marketplace .menu-dropdown-premium > a:hover,
body.home-marketplace .menu-dropdown-premium.aberto > a,
body.home-premium.home-marketplace .menu-dropdown-premium.aberto > a {
    background: #ecfdf5 !important;
    color: #166534 !important;
}

/* Produtos agora abre apenas por clique via JS. */
body.home-marketplace .menu-dropdown-premium:hover .dropdown-categorias-premium,
body.home-premium.home-marketplace .menu-dropdown-premium:hover .dropdown-categorias-premium {
    display: none !important;
}

body.home-marketplace .menu-dropdown-premium.aberto .dropdown-categorias-premium,
body.home-premium.home-marketplace .menu-dropdown-premium.aberto .dropdown-categorias-premium {
    display: grid !important;
    gap: 5px !important;
    animation: fadeDropdown .18s ease;
}

body.home-marketplace .dropdown-categorias-premium,
body.home-premium.home-marketplace .dropdown-categorias-premium {
    top: calc(100% + 10px) !important;
    min-width: 265px !important;
    padding: 10px !important;
    border-radius: 20px !important;
    box-shadow: 0 24px 58px rgba(15, 23, 42, 0.16) !important;
}

body.home-marketplace .dropdown-categorias-premium a,
body.home-premium.home-marketplace .dropdown-categorias-premium a {
    min-height: 42px !important;
    display: flex !important;
    align-items: center !important;
    border-radius: 14px !important;
    font-weight: 850 !important;
}

body.home-marketplace .busca-premium,
body.home-premium.home-marketplace .busca-premium,
body.home-marketplace .topo-premium .busca,
body.home-premium.home-marketplace .topo-premium .busca {
    min-height: 46px !important;
    max-width: 520px !important;
}

body.home-marketplace .btn-whatsapp-premium,
body.home-premium.home-marketplace .btn-whatsapp-premium,
body.home-marketplace .btn-login-premium,
body.home-premium.home-marketplace .btn-login-premium,
body.home-marketplace .btn-cadastro-premium-topo,
body.home-premium.home-marketplace .btn-cadastro-premium-topo,
body.home-marketplace .usuario-dropdown-btn,
body.home-premium.home-marketplace .usuario-dropdown-btn {
    min-height: 42px !important;
    border-radius: 999px !important;
    box-shadow: 0 7px 18px rgba(15, 23, 42, 0.06) !important;
}

body.home-marketplace .usuario-dropdown-btn,
body.home-premium.home-marketplace .usuario-dropdown-btn {
    border: 1px solid #d1fae5 !important;
    min-width: 165px !important;
}

body.home-marketplace .carrinho-premium,
body.home-premium.home-marketplace .carrinho-premium {
    width: 42px !important;
    height: 42px !important;
}


.conteudo-home-marketplace {
    margin-top: 14px !important;
}



/* =========================================================
   AJUSTE FINAL - HERO COLADO AO HEADER
   Remove o respiro branco excessivo entre o topo e o banner.
   Mantém o header no fluxo da página usando sticky.
========================================================= */

body.home-marketplace,
body.home-marketplace.home-premium {
    padding-top: 0 !important;
}

body.home-marketplace .topo,
body.home-marketplace .topo-premium,
body.home-premium.home-marketplace .topo,
body.home-premium.home-marketplace .topo-premium {
    position: sticky !important;
    top: 0 !important;
    left: auto !important;
    width: 100% !important;
    z-index: 9999 !important;
}



body.home-marketplace .conteudo-home-marketplace,
body.home-premium.home-marketplace .conteudo-home-marketplace {
    margin-top: 12px !important;
}

@media (max-width: 768px) {
    body.home-marketplace,
    body.home-marketplace.home-premium {
        padding-top: 0 !important;
    }

    body.home-marketplace .topo,
    body.home-marketplace .topo-premium,
    body.home-premium.home-marketplace .topo,
    body.home-premium.home-marketplace .topo-premium {
        position: sticky !important;
        top: 0 !important;
    }

    
}


/* =========================================================
   CORREÇÃO DEFINITIVA - ESPAÇO ENTRE HEADER E HERO
   Evita o espaço branco que reaparecia após a rolagem.
   Causa provável: regras antigas de header fixo/scroll e padding-top
   do body.home-premium competindo com o novo layout marketplace.
========================================================= */

html,
body {
    scroll-padding-top: 0 !important;
}

body.home-premium,
body.home-integrada,
body.home-marketplace,
body.home-premium.home-marketplace,
body.home-integrada.home-marketplace,
body.home-marketplace.header-scroll,
body.home-premium.home-marketplace.header-scroll {
    padding-top: 0 !important;
}

body.home-marketplace .topo,
body.home-marketplace .topo-premium,
body.home-premium.home-marketplace .topo,
body.home-premium.home-marketplace .topo-premium,
body.home-marketplace .topo.scroll,
body.home-marketplace .topo-premium.scroll,
body.home-premium.home-marketplace .topo.scroll,
body.home-premium.home-marketplace .topo-premium.scroll,
body.home-marketplace.header-scroll .topo,
body.home-marketplace.header-scroll .topo-premium,
body.home-premium.home-marketplace.header-scroll .topo,
body.home-premium.home-marketplace.header-scroll .topo-premium {
    position: sticky !important;
    top: 0 !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    z-index: 9999 !important;
    transform: none !important;
}

body.home-marketplace .topo.scroll,
body.home-premium.home-marketplace .topo.scroll,
body.home-marketplace .topo-premium.scroll,
body.home-premium.home-marketplace .topo-premium.scroll {
    min-height: 76px !important;
    border-bottom: 1px solid rgba(226,232,240,0.95) !important;
    box-shadow: 0 8px 24px rgba(15,23,42,0.075) !important;
}

body.home-marketplace .conteudo,
body.home-marketplace .conteudo-pro,
body.home-marketplace .conteudo-home-marketplace,
body.home-premium.home-marketplace .conteudo,
body.home-premium.home-marketplace .conteudo-pro,
body.home-premium.home-marketplace .conteudo-home-marketplace {
    margin-top: 0 !important;
    padding-top: 0 !important;
}



body.home-marketplace .home-beneficios-marketplace,
body.home-premium.home-marketplace .home-beneficios-marketplace {
    margin-top: 14px !important;
}

/* =========================================================
   LOGO DO HEADER - OPÇÃO SEM MOLDURA
   Visual mais limpo: sem cartão, sem borda e sem caixa.
   Mantém presença com tamanho, nitidez e sombra sutil.
========================================================= */

.topo-premium .logo-premium,
.logo-premium,
body.home-marketplace .logo-premium,
body.home-premium.home-marketplace .logo-premium {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 118px !important;
    min-width: 118px !important;
    height: 64px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    isolation: auto !important;
    transition: transform .22s ease, filter .22s ease !important;
}

.topo-premium .logo-premium::before,
.topo-premium .logo-premium::after,
.logo-premium::before,
.logo-premium::after,
body.home-marketplace .logo-premium::before,
body.home-marketplace .logo-premium::after,
body.home-premium.home-marketplace .logo-premium::before,
body.home-premium.home-marketplace .logo-premium::after {
    display: none !important;
    content: none !important;
}

.topo-premium .logo-premium img,
.logo-premium img,
#logoSite,
body.home-marketplace .logo-premium img,
body.home-premium.home-marketplace .logo-premium img,
body.home-marketplace #logoSite,
body.home-premium.home-marketplace #logoSite {
    position: relative !important;
    z-index: 1 !important;
    display: block !important;
    width: 122px !important;
    max-width: none !important;
    height: 54px !important;
    max-height: 54px !important;
    object-fit: contain !important;
    object-position: center !important;
    transform: none !important;
    transform-origin: center center !important;
    filter:
        drop-shadow(0 8px 14px rgba(15, 23, 42, .12))
        drop-shadow(0 2px 4px rgba(34, 197, 94, .10))
        contrast(1.08)
        saturate(1.08) !important;
    transition: transform .22s ease, filter .22s ease !important;
}

.topo-premium .logo-premium:hover,
.logo-premium:hover,
body.home-marketplace .logo-premium:hover,
body.home-premium.home-marketplace .logo-premium:hover {
    transform: translateY(-1px) !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

.topo-premium .logo-premium:hover img,
.logo-premium:hover img,
.topo-premium .logo-premium:hover #logoSite,
.logo-premium:hover #logoSite {
    transform: scale(1.035) !important;
    filter:
        drop-shadow(0 10px 18px rgba(15, 23, 42, .16))
        drop-shadow(0 3px 8px rgba(34, 197, 94, .13))
        contrast(1.1)
        saturate(1.1) !important;
}

body.modo-escuro .logo-premium,
body.modo-escuro .topo-premium .logo-premium {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

body.modo-escuro .logo-premium img,
body.modo-escuro #logoSite {
    filter:
        drop-shadow(0 8px 16px rgba(0, 0, 0, .28))
        drop-shadow(0 2px 8px rgba(34, 197, 94, .18))
        contrast(1.08)
        saturate(1.08) !important;
}

@media (max-width: 768px) {
    .topo-premium .logo-premium,
    .logo-premium,
    body.home-marketplace .logo-premium,
    body.home-premium.home-marketplace .logo-premium {
        width: 92px !important;
        min-width: 92px !important;
        height: 48px !important;
        padding: 0 !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }

    .topo-premium .logo-premium img,
    .logo-premium img,
    #logoSite,
    body.home-marketplace .logo-premium img,
    body.home-premium.home-marketplace .logo-premium img,
    body.home-marketplace #logoSite,
    body.home-premium.home-marketplace #logoSite {
        width: 92px !important;
        height: 42px !important;
        max-height: 42px !important;
        transform: none !important;
    }
}

/* =========================================================
   LOGO DO HEADER - SEM MOLDURA / VERSÃO MAIOR
   Mantém a logo solta no header, porém com mais presença visual.
   Ideal para destacar a marca sem criar uma caixa/moldura ao redor.
========================================================= */

.topo-premium .logo-premium,
.logo-premium,
body.home-marketplace .logo-premium,
body.home-premium.home-marketplace .logo-premium {
    width: 150px !important;
    min-width: 150px !important;
    height: 68px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
    isolation: auto !important;
}

.topo-premium .logo-premium::before,
.logo-premium::before,
.topo-premium .logo-premium::after,
.logo-premium::after {
    display: none !important;
    content: none !important;
}

.topo-premium .logo-premium img,
.logo-premium img,
#logoSite,
body.home-marketplace .logo-premium img,
body.home-premium.home-marketplace .logo-premium img,
body.home-marketplace #logoSite,
body.home-premium.home-marketplace #logoSite {
    width: 152px !important;
    max-width: 152px !important;
    height: 62px !important;
    max-height: 62px !important;
    object-fit: contain !important;
    object-position: center !important;
    transform: scale(1.10) !important;
    transform-origin: center center !important;
    filter:
        contrast(1.09)
        saturate(1.08)
        drop-shadow(0 8px 16px rgba(15, 23, 42, 0.10)) !important;
    transition: transform 0.24s ease, filter 0.24s ease !important;
}

.topo-premium .logo-premium:hover img,
.logo-premium:hover img,
.logo-premium:hover #logoSite {
    transform: scale(1.14) translateY(-1px) !important;
    filter:
        contrast(1.12)
        saturate(1.10)
        drop-shadow(0 11px 20px rgba(15, 23, 42, 0.14)) !important;
}

/* Dá um pouco mais de respiro entre a logo maior e o menu */
.topo-premium-inner {
    column-gap: 24px !important;
}

@media (max-width: 1180px) {
    .topo-premium .logo-premium,
    .logo-premium,
    body.home-marketplace .logo-premium,
    body.home-premium.home-marketplace .logo-premium {
        width: 132px !important;
        min-width: 132px !important;
        height: 62px !important;
    }

    .topo-premium .logo-premium img,
    .logo-premium img,
    #logoSite,
    body.home-marketplace .logo-premium img,
    body.home-premium.home-marketplace .logo-premium img,
    body.home-marketplace #logoSite,
    body.home-premium.home-marketplace #logoSite {
        width: 134px !important;
        max-width: 134px !important;
        height: 56px !important;
        max-height: 56px !important;
        transform: scale(1.08) !important;
    }
}

@media (max-width: 768px) {
    .topo-premium .logo-premium,
    .logo-premium,
    body.home-marketplace .logo-premium,
    body.home-premium.home-marketplace .logo-premium {
        width: 112px !important;
        min-width: 112px !important;
        height: 52px !important;
    }

    .topo-premium .logo-premium img,
    .logo-premium img,
    #logoSite,
    body.home-marketplace .logo-premium img,
    body.home-premium.home-marketplace .logo-premium img,
    body.home-marketplace #logoSite,
    body.home-premium.home-marketplace #logoSite {
        width: 116px !important;
        max-width: 116px !important;
        height: 46px !important;
        max-height: 46px !important;
        transform: scale(1.05) !important;
        filter:
            contrast(1.08)
            saturate(1.07)
            drop-shadow(0 5px 11px rgba(15, 23, 42, 0.09)) !important;
    }

    .topo-premium-inner {
        column-gap: 12px !important;
    }
}

/* =========================================================
   PADRONIZAÇÃO GLOBAL — MENU PRODUTOS DO HEADER
   Esta camada final prevalece em todas as páginas da loja.
   O dropdown só abre quando o JavaScript adiciona a classe
   .aberto após um clique no botão Produtos.
========================================================= */
.menu-dropdown-premium {
    position: relative;
}

.menu-produtos-toggle {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 13px;
    margin: 0;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: #0f172a;
    font: inherit;
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.menu-produtos-toggle:hover,
.menu-produtos-toggle:focus-visible,
.menu-dropdown-premium.aberto .menu-produtos-toggle {
    background: #ecfdf5;
    color: #166534;
}

.menu-produtos-toggle:focus-visible {
    outline: 3px solid rgba(34, 197, 94, 0.22);
    outline-offset: 2px;
}

.menu-produtos-seta {
    display: inline-block;
    font-size: 12px;
    line-height: 1;
    transition: transform 0.2s ease;
}

.menu-dropdown-premium.aberto .menu-produtos-seta {
    transform: rotate(180deg);
}

/* Bloqueia definitivamente hover/focus antigos quando o clique não abriu. */
.menu-dropdown-premium:not(.aberto) .dropdown-categorias-premium,
.menu-dropdown-premium:not(.aberto):hover .dropdown-categorias-premium,
.menu-dropdown-premium:not(.aberto):focus-within .dropdown-categorias-premium,
body.home-marketplace .menu-dropdown-premium:not(.aberto):hover .dropdown-categorias-premium,
body.home-premium .menu-dropdown-premium:not(.aberto):hover .dropdown-categorias-premium {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

.menu-dropdown-premium.aberto .dropdown-categorias-premium,
body.home-marketplace .menu-dropdown-premium.aberto .dropdown-categorias-premium,
body.home-premium .menu-dropdown-premium.aberto .dropdown-categorias-premium {
    display: grid !important;
    visibility: visible !important;
    pointer-events: auto !important;
    gap: 5px;
    animation: fadeDropdown 0.18s ease;
}

body.modo-escuro .menu-produtos-toggle {
    color: #e5e7eb;
}

body.modo-escuro .menu-produtos-toggle:hover,
body.modo-escuro .menu-produtos-toggle:focus-visible,
body.modo-escuro .menu-dropdown-premium.aberto .menu-produtos-toggle {
    background: #1e293b;
    color: #86efac;
}


/* =========================================================
   DETALHES DO PEDIDO 2026 - TIMELINE REAL DO CLIENTE
   Etapa 5 do fluxo operacional Paladini.
   Escopo isolado em .pedido-rastreamento-page.
========================================================= */
.pedido-rastreamento-page{
    width:min(1240px,calc(100% - 32px));
    margin:126px auto 58px;
    color:#0f172a;
}

.pedido-rastreamento-page *{
    box-sizing:border-box;
}

.pedido-rastreamento-voltar{
    margin-bottom:16px;
}

.pedido-rastreamento-voltar a{
    display:inline-flex;
    align-items:center;
    gap:7px;
    color:#15803d;
    font-size:14px;
    font-weight:900;
    transition:.18s ease;
}

.pedido-rastreamento-voltar a:hover{
    transform:translateX(-3px);
    color:#166534;
}

.pedido-rastreamento-alerta{
    margin-bottom:18px;
    border-radius:18px;
    padding:14px 17px;
    font-size:14px;
    font-weight:850;
    border:1px solid transparent;
    box-shadow:0 8px 22px rgba(15,23,42,.05);
}

.pedido-rastreamento-alerta.sucesso{
    background:#ecfdf5;
    color:#166534;
    border-color:#bbf7d0;
}

.pedido-rastreamento-alerta.atencao{
    background:#fffbeb;
    color:#92400e;
    border-color:#fde68a;
}

.pedido-rastreamento-alerta.informacao{
    background:#eff6ff;
    color:#1d4ed8;
    border-color:#bfdbfe;
}

.pedido-rastreamento-alerta.erro{
    background:#fef2f2;
    color:#991b1b;
    border-color:#fecaca;
}

.pedido-rastreamento-hero{
    position:relative;
    overflow:hidden;
    display:grid;
    grid-template-columns:minmax(0,1fr) 300px;
    gap:22px;
    align-items:stretch;
    margin-bottom:22px;
    padding:28px;
    border:1px solid #dfe7e3;
    border-radius:30px;
    background:
        radial-gradient(circle at 84% 4%,rgba(34,197,94,.17),transparent 31%),
        linear-gradient(145deg,#ffffff 0%,#f7fbf8 100%);
    box-shadow:0 22px 52px rgba(15,23,42,.085);
}

.pedido-rastreamento-hero::after{
    content:"";
    position:absolute;
    right:250px;
    bottom:-105px;
    width:260px;
    height:260px;
    border-radius:50%;
    background:rgba(34,197,94,.055);
    pointer-events:none;
}

.pedido-rastreamento-hero-principal{
    position:relative;
    z-index:1;
    min-width:0;
}

.pedido-rastreamento-kicker{
    display:inline-flex;
    align-items:center;
    min-height:29px;
    padding:0 11px;
    border-radius:999px;
    background:#dcfce7;
    color:#166534;
    font-size:11px;
    font-weight:950;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.pedido-rastreamento-titulo-linha{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    margin-top:14px;
}

.pedido-rastreamento-titulo-linha h1{
    margin:0;
    color:#0f172a;
    font-size:clamp(31px,4vw,49px);
    line-height:1;
    letter-spacing:-1.4px;
}

.pedido-rastreamento-titulo-linha p{
    margin:8px 0 0;
    color:#64748b;
    font-size:13px;
    font-weight:750;
}

.pedido-rastreamento-tipo{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:34px;
    padding:0 12px;
    border-radius:999px;
    white-space:nowrap;
    font-size:11px;
    font-weight:950;
    text-transform:uppercase;
    letter-spacing:.05em;
}

.pedido-rastreamento-tipo.entrega{
    background:#eff6ff;
    color:#1d4ed8;
    border:1px solid #bfdbfe;
}

.pedido-rastreamento-tipo.retirada{
    background:#fff7ed;
    color:#9a3412;
    border:1px solid #fed7aa;
}

.pedido-rastreamento-status-atual{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:13px;
    align-items:flex-start;
    max-width:760px;
    margin-top:22px;
    padding:16px;
    border:1px solid #dbe4ee;
    border-radius:20px;
    background:rgba(255,255,255,.85);
    box-shadow:0 9px 24px rgba(15,23,42,.055);
}

.pedido-rastreamento-status-ponto{
    width:13px;
    height:13px;
    margin-top:6px;
    border-radius:999px;
    background:#2563eb;
    box-shadow:0 0 0 6px rgba(37,99,235,.11);
}

.pedido-rastreamento-status-atual.natureza-sucesso .pedido-rastreamento-status-ponto{
    background:#16a34a;
    box-shadow:0 0 0 6px rgba(22,163,74,.12);
}

.pedido-rastreamento-status-atual.natureza-atencao .pedido-rastreamento-status-ponto{
    background:#f59e0b;
    box-shadow:0 0 0 6px rgba(245,158,11,.13);
}

.pedido-rastreamento-status-atual.natureza-erro .pedido-rastreamento-status-ponto{
    background:#dc2626;
    box-shadow:0 0 0 6px rgba(220,38,38,.12);
}

.pedido-rastreamento-status-atual small{
    display:block;
    margin-bottom:3px;
    color:#64748b;
    font-size:10px;
    font-weight:950;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.pedido-rastreamento-status-atual strong{
    display:block;
    color:#0f172a;
    font-size:19px;
    line-height:1.2;
}

.pedido-rastreamento-status-atual p{
    margin:5px 0 0;
    color:#475569;
    font-size:13px;
    line-height:1.5;
}

.pedido-rastreamento-status-atual time{
    display:block;
    margin-top:6px;
    color:#15803d;
    font-size:11px;
    font-weight:900;
}

.pedido-rastreamento-badges{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:14px;
}

.pedido-rastreamento-badge{
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:0 10px;
    border-radius:999px;
    font-size:10px;
    font-weight:950;
    text-transform:uppercase;
    letter-spacing:.05em;
    background:#f1f5f9;
    color:#475569;
    border:1px solid #e2e8f0;
}

.pedido-rastreamento-badge.ok{
    background:#ecfdf5;
    color:#166534;
    border-color:#bbf7d0;
}

.pedido-rastreamento-badge.pendente{
    background:#fffbeb;
    color:#92400e;
    border-color:#fde68a;
}

.pedido-rastreamento-badge.cancelado{
    background:#fef2f2;
    color:#991b1b;
    border-color:#fecaca;
}

.pedido-rastreamento-total{
    position:relative;
    z-index:1;
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:220px;
    padding:24px;
    border-radius:25px;
    background:
        radial-gradient(circle at top right,rgba(74,222,128,.25),transparent 35%),
        linear-gradient(145deg,#0f172a,#14532d);
    color:#fff;
    box-shadow:0 21px 44px rgba(15,23,42,.22);
}

.pedido-rastreamento-total > span{
    color:#bbf7d0;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.07em;
}

.pedido-rastreamento-total > strong{
    margin:9px 0 7px;
    color:#fff;
    font-size:35px;
    line-height:1;
    letter-spacing:-1px;
}

.pedido-rastreamento-total > small{
    color:#d1fae5;
    font-size:12px;
    font-weight:750;
}

.pedido-rastreamento-total-frete{
    display:flex;
    justify-content:space-between;
    gap:12px;
    margin-top:18px;
    padding-top:15px;
    border-top:1px solid rgba(255,255,255,.18);
    color:#d1fae5;
    font-size:12px;
    font-weight:850;
}

.pedido-rastreamento-total-frete b{
    color:#fff;
}

.pedido-rastreamento-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 350px;
    gap:22px;
    align-items:start;
}

.pedido-rastreamento-coluna-principal,
.pedido-rastreamento-lateral{
    min-width:0;
}

.pedido-rastreamento-card{
    margin-bottom:22px;
    padding:23px;
    border:1px solid #e2e8f0;
    border-radius:25px;
    background:#fff;
    box-shadow:0 12px 32px rgba(15,23,42,.06);
}

.pedido-rastreamento-card-cabecalho{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    margin-bottom:18px;
}

.pedido-rastreamento-card-cabecalho.compacto{
    margin-bottom:14px;
}

.pedido-rastreamento-card-cabecalho span{
    display:block;
    margin-bottom:4px;
    color:#16a34a;
    font-size:10px;
    font-weight:950;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.pedido-rastreamento-card-cabecalho h2{
    margin:0;
    color:#0f172a;
    font-size:23px;
    line-height:1.15;
    letter-spacing:-.55px;
}

.pedido-rastreamento-card-cabecalho > strong{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:34px;
    padding:0 11px;
    border-radius:999px;
    background:#ecfdf5;
    color:#166534;
    border:1px solid #bbf7d0;
    white-space:nowrap;
    font-size:11px;
    font-weight:950;
}

.pedido-rastreamento-card-progresso.pedido-cancelado .pedido-rastreamento-card-cabecalho > strong{
    background:#fef2f2;
    color:#991b1b;
    border-color:#fecaca;
}

.pedido-rastreamento-barra{
    width:100%;
    height:10px;
    margin-bottom:18px;
    overflow:hidden;
    border-radius:999px;
    background:#e2e8f0;
}

.pedido-rastreamento-barra span{
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,#22c55e,#15803d);
    transition:width .45s ease;
}

.pedido-rastreamento-card-progresso.pedido-cancelado .pedido-rastreamento-barra span{
    background:linear-gradient(90deg,#f87171,#dc2626);
}

.pedido-rastreamento-proxima{
    margin-bottom:19px;
    padding:14px 15px;
    border:1px solid #bfdbfe;
    border-radius:18px;
    background:#eff6ff;
}

.pedido-rastreamento-proxima span{
    display:block;
    margin-bottom:4px;
    color:#1d4ed8;
    font-size:10px;
    font-weight:950;
    letter-spacing:.06em;
    text-transform:uppercase;
}

.pedido-rastreamento-proxima strong{
    display:block;
    color:#1e3a8a;
    font-size:15px;
}

.pedido-rastreamento-proxima p{
    margin:4px 0 0;
    color:#475569;
    font-size:12px;
    line-height:1.45;
}

.pedido-rastreamento-timeline{
    display:grid;
    gap:0;
}

.pedido-rastreamento-etapa{
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:13px;
    position:relative;
    min-height:82px;
}

.pedido-rastreamento-etapa-trilho{
    position:relative;
    display:flex;
    justify-content:center;
}

.pedido-rastreamento-etapa:not(:last-child) .pedido-rastreamento-etapa-trilho::after{
    content:"";
    position:absolute;
    top:37px;
    bottom:-3px;
    width:2px;
    background:#e2e8f0;
}

.pedido-rastreamento-etapa.estado-concluida:not(:last-child) .pedido-rastreamento-etapa-trilho::after,
.pedido-rastreamento-etapa.estado-atual:not(:last-child) .pedido-rastreamento-etapa-trilho::after{
    background:#86efac;
}

.pedido-rastreamento-etapa-icone{
    position:relative;
    z-index:1;
    display:flex;
    align-items:center;
    justify-content:center;
    width:34px;
    height:34px;
    border-radius:999px;
    background:#f1f5f9;
    color:#94a3b8;
    border:2px solid #e2e8f0;
    font-size:12px;
    font-weight:950;
}

.pedido-rastreamento-etapa.estado-concluida .pedido-rastreamento-etapa-icone{
    background:#dcfce7;
    color:#166534;
    border-color:#86efac;
}

.pedido-rastreamento-etapa.estado-atual .pedido-rastreamento-etapa-icone{
    background:#16a34a;
    color:#fff;
    border-color:#16a34a;
    box-shadow:0 0 0 7px rgba(22,163,74,.12);
    animation:pedidoEtapaAtualPulse 1.8s infinite;
}

.pedido-rastreamento-etapa.estado-cancelada .pedido-rastreamento-etapa-icone{
    background:#dc2626;
    color:#fff;
    border-color:#dc2626;
    box-shadow:0 0 0 7px rgba(220,38,38,.10);
}

@keyframes pedidoEtapaAtualPulse{
    0%,100%{box-shadow:0 0 0 6px rgba(22,163,74,.10)}
    50%{box-shadow:0 0 0 10px rgba(22,163,74,.05)}
}

.pedido-rastreamento-etapa-conteudo{
    padding:1px 0 21px;
    min-width:0;
}

.pedido-rastreamento-etapa-topo{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.pedido-rastreamento-etapa-topo strong{
    color:#0f172a;
    font-size:15px;
    line-height:1.3;
}

.pedido-rastreamento-etapa-topo span{
    display:inline-flex;
    align-items:center;
    min-height:23px;
    padding:0 8px;
    border-radius:999px;
    background:#f1f5f9;
    color:#64748b;
    font-size:9px;
    font-weight:950;
    text-transform:uppercase;
    letter-spacing:.05em;
    white-space:nowrap;
}

.pedido-rastreamento-etapa.estado-atual .pedido-rastreamento-etapa-topo span{
    background:#dcfce7;
    color:#166534;
}

.pedido-rastreamento-etapa.estado-concluida .pedido-rastreamento-etapa-topo span{
    background:#ecfdf5;
    color:#15803d;
}

.pedido-rastreamento-etapa.estado-cancelada .pedido-rastreamento-etapa-topo span{
    background:#fee2e2;
    color:#991b1b;
}

.pedido-rastreamento-etapa-conteudo p{
    margin:4px 0 0;
    color:#64748b;
    font-size:12px;
    line-height:1.48;
}

.pedido-rastreamento-etapa.estado-pendente .pedido-rastreamento-etapa-conteudo{
    opacity:.67;
}

.pedido-rastreamento-etapa-conteudo time{
    display:block;
    margin-top:5px;
    color:#15803d;
    font-size:10px;
    font-weight:900;
}

.pedido-rastreamento-etapa.estado-cancelada .pedido-rastreamento-etapa-conteudo time{
    color:#b91c1c;
}

.pedido-rastreamento-destaque{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:13px;
    align-items:flex-start;
    margin-top:18px;
    padding:16px;
    border-radius:19px;
}

.pedido-rastreamento-destaque.retirada,
.pedido-rastreamento-destaque.recebido{
    background:#ecfdf5;
    color:#14532d;
    border:1px solid #bbf7d0;
}

.pedido-rastreamento-destaque-icone{
    display:flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    border-radius:13px;
    background:#fff;
    color:#16a34a;
    border:1px solid #bbf7d0;
    font-size:20px;
    font-weight:950;
}

.pedido-rastreamento-destaque strong{
    display:block;
    font-size:15px;
}

.pedido-rastreamento-destaque p{
    margin:4px 0 0;
    color:#166534;
    font-size:12px;
    line-height:1.45;
}

.pedido-rastreamento-confirmar{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:15px;
    align-items:center;
    margin-top:18px;
    padding:17px;
    border:1px solid #86efac;
    border-radius:20px;
    background:linear-gradient(135deg,#ecfdf5,#f7fee7);
}

.pedido-rastreamento-confirmar strong{
    display:block;
    color:#14532d;
    font-size:15px;
}

.pedido-rastreamento-confirmar p{
    margin:4px 0 0;
    color:#4d7c5d;
    font-size:12px;
}

.pedido-rastreamento-confirmar button{
    min-height:46px;
    padding:0 16px;
    border:0;
    border-radius:14px;
    background:linear-gradient(135deg,#16a34a,#22c55e);
    color:#fff;
    box-shadow:0 10px 22px rgba(22,163,74,.22);
    cursor:pointer;
    font-size:12px;
    font-weight:950;
    transition:.18s ease;
}

.pedido-rastreamento-confirmar button:hover{
    transform:translateY(-1px);
    filter:brightness(1.03);
}

.pedido-rastreamento-feed{
    display:grid;
    gap:10px;
}

.pedido-rastreamento-feed-item{
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:12px;
    padding:13px;
    border:1px solid #e2e8f0;
    border-radius:17px;
    background:#f8fafc;
}

.pedido-rastreamento-feed-item.feed-extra{
    display:none;
}

.pedido-rastreamento-feed-card.historico-aberto .pedido-rastreamento-feed-item.feed-extra{
    display:grid;
}

.pedido-rastreamento-feed-icone{
    width:11px;
    height:11px;
    margin-top:6px;
    border-radius:999px;
    background:#2563eb;
    box-shadow:0 0 0 5px rgba(37,99,235,.10);
}

.pedido-rastreamento-feed-item.natureza-sucesso .pedido-rastreamento-feed-icone{
    background:#16a34a;
    box-shadow:0 0 0 5px rgba(22,163,74,.10);
}

.pedido-rastreamento-feed-item.natureza-atencao{
    background:#fffbeb;
    border-color:#fde68a;
}

.pedido-rastreamento-feed-item.natureza-atencao .pedido-rastreamento-feed-icone{
    background:#f59e0b;
    box-shadow:0 0 0 5px rgba(245,158,11,.11);
}

.pedido-rastreamento-feed-item.natureza-erro{
    background:#fef2f2;
    border-color:#fecaca;
}

.pedido-rastreamento-feed-item.natureza-erro .pedido-rastreamento-feed-icone{
    background:#dc2626;
    box-shadow:0 0 0 5px rgba(220,38,38,.10);
}

.pedido-rastreamento-feed-topo{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.pedido-rastreamento-feed-topo strong{
    color:#0f172a;
    font-size:13px;
}

.pedido-rastreamento-feed-topo span{
    display:inline-flex;
    align-items:center;
    min-height:22px;
    padding:0 8px;
    border-radius:999px;
    background:#fef3c7;
    color:#92400e;
    white-space:nowrap;
    font-size:9px;
    font-weight:950;
    text-transform:uppercase;
}

.pedido-rastreamento-feed-item p{
    margin:4px 0 0;
    color:#64748b;
    font-size:12px;
    line-height:1.45;
}

.pedido-rastreamento-feed-item time{
    display:block;
    margin-top:5px;
    color:#15803d;
    font-size:10px;
    font-weight:900;
}

.pedido-rastreamento-ver-historico{
    width:100%;
    min-height:42px;
    margin-top:12px;
    border:1px solid #dbe4ee;
    border-radius:14px;
    background:#fff;
    color:#14532d;
    cursor:pointer;
    font-size:12px;
    font-weight:950;
    transition:.18s ease;
}

.pedido-rastreamento-ver-historico:hover{
    background:#ecfdf5;
    border-color:#bbf7d0;
}

.pedido-rastreamento-itens{
    display:grid;
    gap:9px;
}

.pedido-rastreamento-item{
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    gap:11px;
    align-items:center;
    padding:13px;
    border:1px solid #e2e8f0;
    border-radius:17px;
    background:#f8fafc;
}

.pedido-rastreamento-item-qtd{
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:43px;
    height:36px;
    border:1px solid #bbf7d0;
    border-radius:12px;
    background:#ecfdf5;
    color:#166534;
    font-size:12px;
    font-weight:950;
}

.pedido-rastreamento-item strong{
    display:block;
    color:#0f172a;
    font-size:13px;
    line-height:1.3;
}

.pedido-rastreamento-item span:not(.pedido-rastreamento-item-qtd){
    display:block;
    margin-top:3px;
    color:#64748b;
    font-size:11px;
    font-weight:700;
}

.pedido-rastreamento-item b{
    color:#166534;
    white-space:nowrap;
    font-size:13px;
}

.pedido-rastreamento-vazio{
    margin:0;
    padding:18px;
    border:1px dashed #cbd5e1;
    border-radius:16px;
    color:#64748b;
    text-align:center;
    font-weight:800;
}

.pedido-rastreamento-valores{
    display:grid;
    gap:7px;
    margin-top:17px;
    padding-top:14px;
    border-top:1px dashed #cbd5e1;
}

.pedido-rastreamento-valores p{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin:0;
    padding:6px 2px;
    color:#64748b;
    font-size:12px;
}

.pedido-rastreamento-valores strong{
    color:#334155;
}

.pedido-rastreamento-valores p.total{
    margin-top:4px;
    padding-top:12px;
    border-top:1px solid #e2e8f0;
    color:#0f172a;
    font-size:14px;
    font-weight:900;
}

.pedido-rastreamento-valores p.total strong{
    color:#15803d;
    font-size:19px;
}

.pedido-rastreamento-lateral{
    position:sticky;
    top:108px;
}

.pedido-rastreamento-card-lateral{
    padding:19px;
}

.pedido-rastreamento-card-lateral .pedido-rastreamento-card-cabecalho h2{
    font-size:19px;
}

.pedido-rastreamento-dados{
    display:grid;
    gap:8px;
}

.pedido-rastreamento-dados p{
    margin:0;
    padding:10px 11px;
    border:1px solid #e2e8f0;
    border-radius:14px;
    background:#f8fafc;
}

.pedido-rastreamento-dados span,
.pedido-rastreamento-dados strong{
    display:block;
}

.pedido-rastreamento-dados span{
    margin-bottom:3px;
    color:#64748b;
    font-size:10px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.pedido-rastreamento-dados strong{
    color:#0f172a;
    font-size:12px;
    line-height:1.35;
}

.pedido-rastreamento-logistica-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
}

.pedido-rastreamento-logistica-grid > div{
    padding:11px;
    border:1px solid #bfdbfe;
    border-radius:15px;
    background:#eff6ff;
}

.pedido-rastreamento-logistica-grid span,
.pedido-rastreamento-logistica-grid strong{
    display:block;
}

.pedido-rastreamento-logistica-grid span{
    margin-bottom:4px;
    color:#1d4ed8;
    font-size:9px;
    font-weight:950;
    text-transform:uppercase;
}

.pedido-rastreamento-logistica-grid strong{
    color:#1e3a8a;
    font-size:12px;
}

.pedido-rastreamento-rota{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:10px;
    align-items:flex-start;
    margin-top:10px;
    padding:12px;
    border:1px solid #bbf7d0;
    border-radius:16px;
    background:#ecfdf5;
}

.pedido-rastreamento-rota-icone{
    display:flex;
    align-items:center;
    justify-content:center;
    width:31px;
    height:31px;
    border-radius:11px;
    background:#fff;
    color:#16a34a;
    font-size:19px;
    font-weight:950;
}

.pedido-rastreamento-rota strong{
    display:block;
    color:#14532d;
    font-size:12px;
}

.pedido-rastreamento-rota p{
    margin:3px 0 0;
    color:#4d7c5d;
    font-size:10px;
    line-height:1.4;
}

.pedido-rastreamento-equipe-entrega{
    display:grid;
    gap:8px;
    margin-top:10px;
}

.pedido-rastreamento-equipe-entrega p{
    margin:0;
    padding:10px 11px;
    border:1px solid #e2e8f0;
    border-radius:14px;
    background:#f8fafc;
}

.pedido-rastreamento-equipe-entrega span,
.pedido-rastreamento-equipe-entrega strong,
.pedido-rastreamento-equipe-entrega small{
    display:block;
}

.pedido-rastreamento-equipe-entrega span{
    color:#64748b;
    font-size:9px;
    font-weight:950;
    text-transform:uppercase;
}

.pedido-rastreamento-equipe-entrega strong{
    margin-top:3px;
    color:#0f172a;
    font-size:12px;
}

.pedido-rastreamento-equipe-entrega small{
    margin-top:2px;
    color:#64748b;
    font-size:9px;
}

.pedido-rastreamento-endereco{
    margin:0;
    color:#334155;
    font-size:12px;
    font-weight:750;
    line-height:1.62;
    overflow-wrap:anywhere;
}

.pedido-rastreamento-observacao{
    margin-top:12px;
    padding:12px;
    border:1px solid #fde68a;
    border-radius:15px;
    background:#fffbeb;
}

.pedido-rastreamento-observacao span{
    display:block;
    margin-bottom:4px;
    color:#92400e;
    font-size:9px;
    font-weight:950;
    text-transform:uppercase;
}

.pedido-rastreamento-observacao p{
    margin:0;
    color:#78350f;
    font-size:11px;
    line-height:1.45;
}

.pedido-rastreamento-ajuda{
    display:grid;
    gap:13px;
    padding:19px;
    border-radius:22px;
    background:linear-gradient(145deg,#0f172a,#14532d);
    color:#fff;
    box-shadow:0 18px 38px rgba(15,23,42,.18);
}

.pedido-rastreamento-ajuda span{
    display:block;
    color:#86efac;
    font-size:9px;
    font-weight:950;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.pedido-rastreamento-ajuda strong{
    display:block;
    margin-top:3px;
    color:#fff;
    font-size:16px;
}

.pedido-rastreamento-ajuda p{
    margin:5px 0 0;
    color:#d1fae5;
    font-size:11px;
    line-height:1.45;
}

.pedido-rastreamento-ajuda a{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:41px;
    border-radius:13px;
    background:#fff;
    color:#14532d;
    font-size:11px;
    font-weight:950;
    transition:.18s ease;
}

.pedido-rastreamento-ajuda a:hover{
    transform:translateY(-1px);
    background:#ecfdf5;
}

body.modo-escuro .pedido-rastreamento-page{
    color:#e5e7eb;
}

body.modo-escuro .pedido-rastreamento-hero,
body.modo-escuro .pedido-rastreamento-card{
    background:#0f172a;
    border-color:#1e293b;
}

body.modo-escuro .pedido-rastreamento-titulo-linha h1,
body.modo-escuro .pedido-rastreamento-status-atual strong,
body.modo-escuro .pedido-rastreamento-card-cabecalho h2,
body.modo-escuro .pedido-rastreamento-etapa-topo strong,
body.modo-escuro .pedido-rastreamento-feed-topo strong,
body.modo-escuro .pedido-rastreamento-item strong,
body.modo-escuro .pedido-rastreamento-dados strong,
body.modo-escuro .pedido-rastreamento-equipe-entrega strong{
    color:#f8fafc;
}

body.modo-escuro .pedido-rastreamento-status-atual,
body.modo-escuro .pedido-rastreamento-feed-item,
body.modo-escuro .pedido-rastreamento-item,
body.modo-escuro .pedido-rastreamento-dados p,
body.modo-escuro .pedido-rastreamento-equipe-entrega p{
    background:#111827;
    border-color:#253247;
}

body.modo-escuro .pedido-rastreamento-titulo-linha p,
body.modo-escuro .pedido-rastreamento-status-atual p,
body.modo-escuro .pedido-rastreamento-etapa-conteudo p,
body.modo-escuro .pedido-rastreamento-feed-item p,
body.modo-escuro .pedido-rastreamento-item span:not(.pedido-rastreamento-item-qtd),
body.modo-escuro .pedido-rastreamento-endereco{
    color:#94a3b8;
}

@media(max-width:1050px){
    .pedido-rastreamento-layout{
        grid-template-columns:minmax(0,1fr) 310px;
    }

    .pedido-rastreamento-hero{
        grid-template-columns:minmax(0,1fr) 270px;
    }
}

@media(max-width:860px){
    .pedido-rastreamento-page{
        width:min(100% - 22px,1240px);
        margin-top:154px;
    }

    .pedido-rastreamento-hero,
    .pedido-rastreamento-layout{
        grid-template-columns:1fr;
    }

    .pedido-rastreamento-total{
        min-height:0;
    }

    .pedido-rastreamento-lateral{
        position:static;
    }

    .pedido-rastreamento-lateral{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:14px;
    }

    .pedido-rastreamento-lateral > *{
        margin-bottom:0;
    }

    .pedido-rastreamento-ajuda{
        grid-column:1 / -1;
    }
}

@media(max-width:620px){
    .pedido-rastreamento-page{
        width:calc(100% - 14px);
        margin-top:150px;
        margin-bottom:35px;
    }

    .pedido-rastreamento-hero{
        padding:17px;
        border-radius:22px;
    }

    .pedido-rastreamento-titulo-linha{
        display:grid;
        grid-template-columns:1fr;
        gap:11px;
    }

    .pedido-rastreamento-titulo-linha h1{
        font-size:33px;
    }

    .pedido-rastreamento-tipo{
        width:max-content;
    }

    .pedido-rastreamento-status-atual{
        padding:14px;
    }

    .pedido-rastreamento-total{
        padding:20px;
        border-radius:20px;
    }

    .pedido-rastreamento-total > strong{
        font-size:30px;
    }

    .pedido-rastreamento-card{
        padding:16px;
        border-radius:21px;
    }

    .pedido-rastreamento-card-cabecalho{
        align-items:center;
    }

    .pedido-rastreamento-card-cabecalho h2{
        font-size:20px;
    }

    .pedido-rastreamento-card-cabecalho > strong{
        max-width:115px;
        text-align:center;
        white-space:normal;
        line-height:1.2;
        padding:7px 9px;
    }

    .pedido-rastreamento-etapa{
        grid-template-columns:36px minmax(0,1fr);
        gap:10px;
    }

    .pedido-rastreamento-etapa-icone{
        width:31px;
        height:31px;
    }

    .pedido-rastreamento-etapa:not(:last-child) .pedido-rastreamento-etapa-trilho::after{
        top:34px;
    }

    .pedido-rastreamento-etapa-topo{
        align-items:flex-start;
        flex-direction:column;
        gap:5px;
    }

    .pedido-rastreamento-confirmar{
        grid-template-columns:1fr;
    }

    .pedido-rastreamento-confirmar button{
        width:100%;
    }

    .pedido-rastreamento-feed-topo{
        align-items:flex-start;
        flex-direction:column;
        gap:5px;
    }

    .pedido-rastreamento-item{
        grid-template-columns:auto minmax(0,1fr);
    }

    .pedido-rastreamento-item b{
        grid-column:2;
    }

    .pedido-rastreamento-lateral{
        grid-template-columns:1fr;
    }

    .pedido-rastreamento-ajuda{
        grid-column:auto;
    }

    .pedido-rastreamento-logistica-grid{
        grid-template-columns:1fr;
    }
}


/* =========================================================
   REFINAMENTO VISUAL FINAL — ACOMPANHAMENTO DO PEDIDO
   Camada aditiva e isolada. Mantém intacta a lógica da Etapa 5.
========================================================= */
body.pedido-rastreamento-body{
    background:
        radial-gradient(circle at 12% 8%,rgba(34,197,94,.075),transparent 28%),
        radial-gradient(circle at 92% 24%,rgba(37,99,235,.045),transparent 24%),
        #f5f8f6;
}

.pedido-rastreamento-page{
    --pedido-verde:#15803d;
    --pedido-verde-escuro:#14532d;
    --pedido-verde-claro:#ecfdf5;
    --pedido-azul:#2563eb;
    --pedido-laranja:#d97706;
    --pedido-vermelho:#dc2626;
    --pedido-texto:#0f172a;
    --pedido-suave:#64748b;
    --pedido-borda:#dfe7e3;
    --pedido-sombra:0 14px 38px rgba(15,23,42,.07);
    --pedido-sombra-hover:0 22px 52px rgba(15,23,42,.11);
    width:min(1280px,calc(100% - 36px));
    margin-top:112px;
}

.pedido-rastreamento-voltar a{
    min-height:38px;
    padding:0 12px;
    border:1px solid #d7e3dc;
    border-radius:999px;
    background:rgba(255,255,255,.82);
    box-shadow:0 6px 18px rgba(15,23,42,.045);
}

.pedido-rastreamento-voltar a:focus-visible,
.pedido-rastreamento-page button:focus-visible,
.pedido-rastreamento-page a:focus-visible{
    outline:3px solid rgba(34,197,94,.28);
    outline-offset:3px;
}

.pedido-rastreamento-hero{
    grid-template-columns:minmax(0,1fr) 315px;
    padding:30px;
    border-color:#d7e3dc;
    background:
        linear-gradient(110deg,rgba(255,255,255,.98),rgba(247,251,248,.96)),
        radial-gradient(circle at top right,rgba(34,197,94,.16),transparent 35%);
    box-shadow:0 24px 58px rgba(15,23,42,.085);
}

.pedido-rastreamento-hero::before{
    content:"";
    position:absolute;
    inset:0 auto 0 0;
    width:6px;
    background:linear-gradient(180deg,#22c55e,#14532d);
}

.pedido-rastreamento-kicker::before{
    content:"";
    width:7px;
    height:7px;
    margin-right:7px;
    border-radius:50%;
    background:#22c55e;
    box-shadow:0 0 0 5px rgba(34,197,94,.12);
}

.pedido-rastreamento-status-atual{
    position:relative;
    overflow:hidden;
    border-color:#cfe0d6;
    background:linear-gradient(135deg,#ffffff,#f4fbf6);
    box-shadow:0 12px 28px rgba(15,23,42,.065);
}

.pedido-rastreamento-status-atual::after{
    content:"";
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width:4px;
    background:#2563eb;
}

.pedido-rastreamento-status-atual.natureza-sucesso::after{background:#16a34a}
.pedido-rastreamento-status-atual.natureza-atencao::after{background:#f59e0b}
.pedido-rastreamento-status-atual.natureza-erro::after{background:#dc2626}

.pedido-rastreamento-status-atual.natureza-andamento .pedido-rastreamento-status-ponto,
.pedido-rastreamento-status-atual.natureza-informacao .pedido-rastreamento-status-ponto{
    animation:pedidoStatusPulse 1.9s ease-out infinite;
}

@keyframes pedidoStatusPulse{
    0%{box-shadow:0 0 0 0 rgba(37,99,235,.22)}
    70%{box-shadow:0 0 0 9px rgba(37,99,235,0)}
    100%{box-shadow:0 0 0 0 rgba(37,99,235,0)}
}

.pedido-rastreamento-total{
    min-height:0;
    padding:25px;
    border:1px solid rgba(255,255,255,.08);
    background:
        radial-gradient(circle at 86% 0,rgba(74,222,128,.32),transparent 36%),
        linear-gradient(145deg,#07111f,#14532d);
}

.pedido-rastreamento-layout{
    grid-template-columns:minmax(0,1fr) 365px;
    gap:24px;
}

.pedido-rastreamento-card{
    border-color:#dfe7e3;
    box-shadow:var(--pedido-sombra);
    transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}

.pedido-rastreamento-card:hover{
    border-color:#c7dbce;
    box-shadow:var(--pedido-sombra-hover);
}

.pedido-rastreamento-card-progresso{
    position:relative;
    overflow:hidden;
}

.pedido-rastreamento-card-progresso::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    right:0;
    height:4px;
    background:linear-gradient(90deg,#22c55e,#15803d,#2563eb);
}

.pedido-rastreamento-barra{
    height:12px;
    padding:2px;
    background:#e7eeea;
    box-shadow:inset 0 1px 3px rgba(15,23,42,.09);
}

.pedido-rastreamento-barra span{
    min-width:0;
    box-shadow:0 4px 12px rgba(21,128,61,.22);
    transition:width .45s ease;
}

.pedido-rastreamento-proxima{
    position:relative;
    padding:15px 16px 15px 19px;
    border-left:4px solid #2563eb;
    background:linear-gradient(135deg,#eff6ff,#f8fbff);
}

.pedido-rastreamento-etapa{
    gap:14px;
    padding:4px 0 17px;
}

.pedido-rastreamento-etapa-conteudo{
    padding:13px 14px;
    border:1px solid transparent;
    border-radius:17px;
    transition:.2s ease;
}

.pedido-rastreamento-etapa.estado-atual .pedido-rastreamento-etapa-conteudo{
    border-color:#bfdbfe;
    background:linear-gradient(135deg,#eff6ff,#ffffff);
    box-shadow:0 10px 24px rgba(37,99,235,.08);
}

.pedido-rastreamento-etapa.estado-concluida .pedido-rastreamento-etapa-conteudo{
    background:#fbfefc;
}

.pedido-rastreamento-etapa.estado-pendente .pedido-rastreamento-etapa-conteudo{
    border-color:#edf1ef;
    background:#fafcfb;
}

.pedido-rastreamento-etapa.estado-atual .pedido-rastreamento-etapa-icone{
    animation:pedidoEtapaAtual 1.8s ease-in-out infinite;
}

@keyframes pedidoEtapaAtual{
    0%,100%{transform:scale(1)}
    50%{transform:scale(1.08)}
}

.pedido-rastreamento-feed-item{
    border:1px solid #e4ebe7;
    border-radius:17px;
    padding:13px 14px 13px 44px;
    background:#fbfdfc;
    transition:.18s ease;
}

.pedido-rastreamento-feed-item:hover{
    border-color:#cfe0d6;
    background:#fff;
    transform:translateX(2px);
}

.pedido-rastreamento-feed-icone{
    left:14px;
    top:16px;
}

.pedido-rastreamento-item{
    border-color:#e3eae6;
    background:linear-gradient(135deg,#fff,#fbfdfc);
    transition:.18s ease;
}

.pedido-rastreamento-item:hover{
    border-color:#cfe0d6;
    transform:translateY(-1px);
    box-shadow:0 8px 20px rgba(15,23,42,.055);
}

.pedido-rastreamento-item-qtd{
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);
}

.pedido-rastreamento-valores{
    border-top:1px dashed #ccd9d1;
    background:#fbfdfc;
    border-radius:0 0 18px 18px;
    padding:15px 16px 5px;
}

.pedido-rastreamento-lateral{
    position:sticky;
    top:105px;
}

.pedido-rastreamento-card-lateral{
    margin-bottom:16px;
}

.pedido-rastreamento-dados p,
.pedido-rastreamento-equipe-entrega p{
    transition:.16s ease;
}

.pedido-rastreamento-dados p:hover,
.pedido-rastreamento-equipe-entrega p:hover{
    border-color:#cfe0d6;
    background:#fff;
}

.pedido-rastreamento-rota{
    border-left:4px solid #2563eb;
}

.pedido-rastreamento-ajuda{
    overflow:hidden;
    background:
        radial-gradient(circle at 100% 0,rgba(74,222,128,.24),transparent 38%),
        linear-gradient(145deg,#0b1822,#14532d);
    box-shadow:0 18px 38px rgba(20,83,45,.18);
}

.pedido-rastreamento-ajuda a{
    min-height:44px;
    box-shadow:0 10px 22px rgba(0,0,0,.14);
}

body.modo-escuro.pedido-rastreamento-body{
    background:
        radial-gradient(circle at 10% 8%,rgba(34,197,94,.08),transparent 26%),
        #020617;
}

body.modo-escuro .pedido-rastreamento-etapa.estado-atual .pedido-rastreamento-etapa-conteudo,
body.modo-escuro .pedido-rastreamento-etapa.estado-concluida .pedido-rastreamento-etapa-conteudo,
body.modo-escuro .pedido-rastreamento-etapa.estado-pendente .pedido-rastreamento-etapa-conteudo,
body.modo-escuro .pedido-rastreamento-feed-item,
body.modo-escuro .pedido-rastreamento-item,
body.modo-escuro .pedido-rastreamento-valores{
    background:#111827;
    border-color:#263244;
}

@media(max-width:1040px){
    .pedido-rastreamento-layout{grid-template-columns:minmax(0,1fr) 320px}
    .pedido-rastreamento-lateral{position:static}
}

@media(max-width:820px){
    .pedido-rastreamento-page{
        width:min(100% - 22px,1280px);
        margin-top:104px;
    }
    .pedido-rastreamento-hero{
        grid-template-columns:1fr;
        padding:22px;
        border-radius:24px;
    }
    .pedido-rastreamento-total{
        min-height:auto;
        display:grid;
        grid-template-columns:1fr auto;
        align-items:center;
        gap:5px 16px;
    }
    .pedido-rastreamento-total > strong{grid-column:2;grid-row:1 / span 2;text-align:right}
    .pedido-rastreamento-total-frete{grid-column:1 / -1}
    .pedido-rastreamento-layout{grid-template-columns:1fr}
}

@media(max-width:560px){
    .pedido-rastreamento-page{
        width:calc(100% - 14px);
        margin-top:92px;
        margin-bottom:35px;
    }
    .pedido-rastreamento-voltar{margin:0 4px 11px}
    .pedido-rastreamento-voltar a{min-height:34px;padding:0 10px;font-size:12px}
    .pedido-rastreamento-hero{padding:18px;border-radius:21px;margin-bottom:14px}
    .pedido-rastreamento-titulo-linha h1{font-size:31px}
    .pedido-rastreamento-status-atual{padding:14px}
    .pedido-rastreamento-total{padding:18px;border-radius:20px}
    .pedido-rastreamento-total > strong{font-size:27px}
    .pedido-rastreamento-card{padding:17px;border-radius:21px;margin-bottom:14px}
    .pedido-rastreamento-card-cabecalho h2{font-size:20px}
    .pedido-rastreamento-card-cabecalho > strong{min-height:30px}
    .pedido-rastreamento-etapa-conteudo{padding:11px 12px}
    .pedido-rastreamento-feed-item{padding:12px 12px 12px 40px}
    .pedido-rastreamento-item{grid-template-columns:43px 1fr}
    .pedido-rastreamento-item b{grid-column:2;text-align:left;margin-top:4px}
    .pedido-rastreamento-ajuda{border-radius:21px;padding:18px}
}

@media(prefers-reduced-motion:reduce){
    .pedido-rastreamento-status-ponto,
    .pedido-rastreamento-etapa-icone,
    .pedido-rastreamento-card,
    .pedido-rastreamento-item,
    .pedido-rastreamento-feed-item{
        animation:none !important;
        transition:none !important;
    }
}

/* =========================================================
   DETALHES DO PEDIDO — MODO COMPACTO DESKTOP / TABLET
   Camada final isolada em .pedido-rastreamento-page.
   Mantém integralmente a lógica, textos e histórico do pedido.
========================================================= */
.pedido-rastreamento-page{
    width:min(1180px,calc(100% - 28px));
    margin:98px auto 30px;
}

.pedido-rastreamento-voltar{
    margin-bottom:8px;
}

.pedido-rastreamento-voltar a{
    min-height:31px;
    padding:0 10px;
    gap:5px;
    font-size:12px;
    box-shadow:none;
}

.pedido-rastreamento-alerta{
    margin-bottom:10px;
    padding:10px 13px;
    border-radius:13px;
    font-size:12px;
}

.pedido-rastreamento-hero{
    grid-template-columns:minmax(0,1fr) 245px;
    gap:14px;
    margin-bottom:14px;
    padding:18px;
    border-radius:21px;
    box-shadow:0 13px 32px rgba(15,23,42,.065);
}

.pedido-rastreamento-hero::before{
    width:4px;
}

.pedido-rastreamento-hero::after{
    right:205px;
    bottom:-150px;
}

.pedido-rastreamento-kicker{
    min-height:23px;
    padding:0 9px;
    font-size:9px;
    letter-spacing:.065em;
}

.pedido-rastreamento-kicker::before{
    width:5px;
    height:5px;
    margin-right:6px;
    box-shadow:0 0 0 3px rgba(34,197,94,.11);
}

.pedido-rastreamento-titulo-linha{
    gap:10px;
    margin-top:8px;
}

.pedido-rastreamento-titulo-linha h1{
    font-size:clamp(27px,3vw,38px);
    letter-spacing:-1px;
}

.pedido-rastreamento-titulo-linha p{
    margin-top:5px;
    font-size:11.5px;
    line-height:1.35;
}

.pedido-rastreamento-tipo{
    min-height:27px;
    padding:0 9px;
    font-size:9px;
}

.pedido-rastreamento-status-atual{
    gap:10px;
    max-width:none;
    margin-top:11px;
    padding:10px 12px;
    border-radius:14px;
    box-shadow:0 6px 17px rgba(15,23,42,.045);
}

.pedido-rastreamento-status-ponto{
    width:10px;
    height:10px;
    margin-top:5px;
    box-shadow:0 0 0 4px rgba(37,99,235,.10);
}

.pedido-rastreamento-status-atual.natureza-sucesso .pedido-rastreamento-status-ponto,
.pedido-rastreamento-status-atual.natureza-atencao .pedido-rastreamento-status-ponto,
.pedido-rastreamento-status-atual.natureza-erro .pedido-rastreamento-status-ponto{
    box-shadow:0 0 0 4px rgba(22,163,74,.10);
}

.pedido-rastreamento-status-atual small{
    margin-bottom:2px;
    font-size:8.5px;
}

.pedido-rastreamento-status-atual strong{
    font-size:16px;
}

.pedido-rastreamento-status-atual p{
    margin-top:3px;
    font-size:11.5px;
    line-height:1.35;
}

.pedido-rastreamento-status-atual time{
    margin-top:4px;
    font-size:10px;
}

.pedido-rastreamento-badges{
    gap:6px;
    margin-top:8px;
}

.pedido-rastreamento-badge{
    min-height:23px;
    padding:0 8px;
    font-size:8.5px;
}

.pedido-rastreamento-total{
    min-height:0;
    padding:16px;
    border-radius:18px;
    box-shadow:0 13px 28px rgba(15,23,42,.17);
}

.pedido-rastreamento-total > span{
    font-size:9.5px;
}

.pedido-rastreamento-total > strong{
    margin:6px 0 5px;
    font-size:27px;
}

.pedido-rastreamento-total > small{
    font-size:10.5px;
}

.pedido-rastreamento-total-frete{
    margin-top:10px;
    padding-top:9px;
    font-size:10.5px;
}

.pedido-rastreamento-layout{
    grid-template-columns:minmax(0,1fr) 320px;
    gap:14px;
}

.pedido-rastreamento-card{
    margin-bottom:14px;
    padding:16px;
    border-radius:18px;
    box-shadow:0 8px 22px rgba(15,23,42,.05);
}

.pedido-rastreamento-card-progresso::before{
    height:3px;
}

.pedido-rastreamento-card-cabecalho{
    gap:10px;
    margin-bottom:11px;
}

.pedido-rastreamento-card-cabecalho.compacto{
    margin-bottom:9px;
}

.pedido-rastreamento-card-cabecalho span{
    margin-bottom:2px;
    font-size:8.5px;
}

.pedido-rastreamento-card-cabecalho h2{
    font-size:19px;
    letter-spacing:-.3px;
}

.pedido-rastreamento-card-cabecalho > strong{
    min-height:27px;
    padding:0 9px;
    font-size:9px;
}

.pedido-rastreamento-barra{
    height:8px;
    margin-bottom:11px;
    padding:1px;
}

.pedido-rastreamento-proxima{
    margin-bottom:11px;
    padding:9px 11px 9px 13px;
    border-radius:12px;
    border-left-width:3px;
}

.pedido-rastreamento-proxima span{
    margin-bottom:2px;
    font-size:8.5px;
}

.pedido-rastreamento-proxima strong{
    font-size:13px;
}

.pedido-rastreamento-proxima p{
    margin-top:2px;
    font-size:10.5px;
    line-height:1.35;
}

.pedido-rastreamento-etapa{
    grid-template-columns:32px minmax(0,1fr);
    gap:9px;
    min-height:0;
    padding:0 0 8px;
}

.pedido-rastreamento-etapa-trilho{
    min-height:45px;
}

.pedido-rastreamento-etapa:not(:last-child) .pedido-rastreamento-etapa-trilho::after{
    top:29px;
    bottom:-1px;
}

.pedido-rastreamento-etapa-icone{
    width:27px;
    height:27px;
    border-width:1px;
    font-size:10px;
}

.pedido-rastreamento-etapa.estado-atual .pedido-rastreamento-etapa-icone,
.pedido-rastreamento-etapa.estado-cancelada .pedido-rastreamento-etapa-icone{
    box-shadow:0 0 0 4px rgba(22,163,74,.09);
}

.pedido-rastreamento-etapa-conteudo{
    padding:8px 10px;
    border-radius:12px;
}

.pedido-rastreamento-etapa-topo{
    gap:7px;
}

.pedido-rastreamento-etapa-topo strong{
    font-size:13px;
    line-height:1.2;
}

.pedido-rastreamento-etapa-topo span{
    min-height:19px;
    padding:0 6px;
    font-size:7.5px;
}

.pedido-rastreamento-etapa-conteudo p{
    margin-top:3px;
    font-size:10.5px;
    line-height:1.32;
}

.pedido-rastreamento-etapa-conteudo time{
    margin-top:3px;
    font-size:9px;
}

.pedido-rastreamento-destaque,
.pedido-rastreamento-confirmar{
    margin-top:11px;
    padding:11px 12px;
    border-radius:14px;
}

.pedido-rastreamento-destaque-icone{
    width:34px;
    height:34px;
    font-size:15px;
}

.pedido-rastreamento-destaque strong,
.pedido-rastreamento-confirmar strong{
    font-size:13px;
}

.pedido-rastreamento-destaque p,
.pedido-rastreamento-confirmar p{
    margin-top:3px;
    font-size:10.5px;
    line-height:1.35;
}

.pedido-rastreamento-confirmar button{
    min-height:37px;
    padding:0 12px;
    border-radius:11px;
    font-size:10.5px;
}

.pedido-rastreamento-feed{
    gap:7px;
}

.pedido-rastreamento-feed-item{
    padding:9px 10px 9px 34px;
    border-radius:12px;
}

.pedido-rastreamento-feed-icone{
    left:11px;
    top:12px;
    width:9px;
    height:9px;
}

.pedido-rastreamento-feed-topo strong{
    font-size:12px;
}

.pedido-rastreamento-feed-topo span,
.pedido-rastreamento-feed-item time{
    font-size:8.5px;
}

.pedido-rastreamento-feed-item p{
    margin-top:3px;
    font-size:10.5px;
    line-height:1.35;
}

.pedido-rastreamento-ver-historico{
    min-height:34px;
    margin-top:9px;
    font-size:10.5px;
}

.pedido-rastreamento-itens{
    gap:7px;
}

.pedido-rastreamento-item{
    gap:8px;
    padding:9px 10px;
    border-radius:12px;
}

.pedido-rastreamento-item-qtd{
    min-width:34px;
    height:29px;
    border-radius:9px;
    font-size:10.5px;
}

.pedido-rastreamento-item strong{
    font-size:12px;
}

.pedido-rastreamento-item span:not(.pedido-rastreamento-item-qtd){
    margin-top:2px;
    font-size:10px;
}

.pedido-rastreamento-item b{
    font-size:11.5px;
}

.pedido-rastreamento-valores{
    margin-top:8px;
    padding:10px 11px 3px;
    border-radius:0 0 13px 13px;
}

.pedido-rastreamento-valores p{
    margin-bottom:7px;
    font-size:10.5px;
}

.pedido-rastreamento-valores p.total{
    padding-top:8px;
    font-size:12px;
}

.pedido-rastreamento-valores p.total strong{
    font-size:17px;
}

.pedido-rastreamento-lateral{
    top:96px;
}

.pedido-rastreamento-card-lateral{
    margin-bottom:10px;
}

.pedido-rastreamento-dados,
.pedido-rastreamento-equipe-entrega{
    gap:6px;
}

.pedido-rastreamento-dados p,
.pedido-rastreamento-equipe-entrega p{
    padding:8px 9px;
    border-radius:10px;
}

.pedido-rastreamento-dados span,
.pedido-rastreamento-logistica-grid span,
.pedido-rastreamento-equipe-entrega span{
    font-size:8.5px;
}

.pedido-rastreamento-dados strong,
.pedido-rastreamento-logistica-grid strong,
.pedido-rastreamento-equipe-entrega strong{
    font-size:11.5px;
}

.pedido-rastreamento-logistica-grid{
    gap:7px;
}

.pedido-rastreamento-logistica-grid > div{
    padding:9px;
    border-radius:11px;
}

.pedido-rastreamento-rota,
.pedido-rastreamento-observacao{
    margin-top:8px;
    padding:9px 10px;
    border-radius:11px;
}

.pedido-rastreamento-rota-icone{
    width:31px;
    height:31px;
}

.pedido-rastreamento-rota strong,
.pedido-rastreamento-observacao span{
    font-size:10.5px;
}

.pedido-rastreamento-rota p,
.pedido-rastreamento-observacao p,
.pedido-rastreamento-endereco{
    font-size:10.5px;
    line-height:1.4;
}

.pedido-rastreamento-ajuda{
    padding:14px;
    border-radius:17px;
}

.pedido-rastreamento-ajuda span{
    font-size:8.5px;
}

.pedido-rastreamento-ajuda strong{
    margin-top:3px;
    font-size:14px;
}

.pedido-rastreamento-ajuda p{
    margin:4px 0 9px;
    font-size:10.5px;
    line-height:1.35;
}

.pedido-rastreamento-ajuda a{
    min-height:36px;
    font-size:10.5px;
}

@media(max-width:1040px) and (min-width:821px){
    .pedido-rastreamento-page{
        width:min(100% - 22px,1100px);
    }

    .pedido-rastreamento-layout{
        grid-template-columns:minmax(0,1fr) 290px;
    }

    .pedido-rastreamento-hero{
        grid-template-columns:minmax(0,1fr) 225px;
    }
}

/* =========================================================
   CRÉDITOS DO DESENVOLVEDOR — CONTATOS V1.2
   ========================================================= */
.rodape-desenvolvedor{
    flex-direction:column;
    gap:10px;
}

.rodape-desenvolvedor-identidade{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:6px 9px;
}

.rodape-desenvolvedor-contatos{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:8px;
}

.rodape-desenvolvedor-email,
.rodape-desenvolvedor-whatsapp{
    min-height:36px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    text-decoration:none;
    font-size:12px;
    font-weight:700;
    line-height:1;
    transition:transform .18s ease, border-color .18s ease, background-color .18s ease, color .18s ease, box-shadow .18s ease;
}

.rodape-desenvolvedor-email{
    padding:0 12px;
    color:#cbd5e1;
    border:1px solid rgba(148,163,184,.2);
    background:rgba(15,23,42,.34);
}

.rodape-desenvolvedor-email:hover{
    color:#fff;
    border-color:rgba(74,222,128,.45);
    background:rgba(15,23,42,.62);
    transform:translateY(-1px);
}

.rodape-desenvolvedor-whatsapp{
    gap:7px;
    padding:0 13px;
    color:#052e16;
    border:1px solid rgba(134,239,172,.6);
    background:linear-gradient(135deg,#86efac,#22c55e);
    box-shadow:0 8px 20px rgba(34,197,94,.16);
}

.rodape-desenvolvedor-whatsapp svg{
    width:17px;
    height:17px;
    flex:0 0 17px;
    fill:currentColor;
}

.rodape-desenvolvedor-whatsapp:hover{
    color:#022c16;
    transform:translateY(-1px);
    box-shadow:0 10px 24px rgba(34,197,94,.24);
}

.rodape-desenvolvedor-email:focus-visible,
.rodape-desenvolvedor-whatsapp:focus-visible{
    outline:3px solid rgba(74,222,128,.28);
    outline-offset:2px;
}


/* Rodapé V1.3 — remove o endereço duplicado e equilibra a faixa institucional. */
.rodape-extra.rodape-extra-enxuto {
    max-width: 900px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: start;
}

@media (max-width: 500px) {
    .rodape-extra.rodape-extra-enxuto {
        grid-template-columns: 1fr !important;
    }
}