/*
 * style.css — Naturallie
 * Folha da vitrine pública. Tokens de cor no :root, painel da
 * loja, cardápio, modais, gavetas de sacola e pedidos.
 */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Fraunces:opsz,wght@9..144,600;9..144,700&family=Nunito:wght@700;800;900&display=swap');

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

:root {

    --azul:            #10613f;
    --azul-claro:      #1f9d61;
    --azul-escuro:     #062a1c;
    --dourado:         #f5b800;
    --verde:           #12a05e;

    --v-900:           #041d13;
    --v-800:           #062a1c;
    --v-700:           #0f5334;
    --v-600:           #146f45;
    --v-500:           #1f9d61;
    --v-400:           #37c07e;
    --v-300:           #7fe0ae;
    --v-100:           #eaf7f0;
    --vermelho:        #dc2626;
    --bg:              #f1f3f6;
    --branco:          #ffffff;
    --cinza-100:       #f5f6f8;
    --cinza-200:       #e5e7eb;
    --cinza-300:       #d1d5db;
    --texto:           #1f2937;
    --texto-secundario:#6b7280;
    --texto-claro:     #9ca3af;
    --sombra:          0 2px 8px rgba(0,0,0,0.06);
    --sombra-hover:    0 8px 24px rgba(0,0,0,0.13);
    --radius:          8px;
    --nav-h:           68px;
    --header-fixo-h:   60px;
    --frete-top:       16px;

}

html, body {
    background: var(--bg);
    color: var(--texto);
    font-family: 'Plus Jakarta Sans', sans-serif;
    line-height: 1.5;
}
button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; }
ul { list-style: none; }
img { max-width: 100%; display: block; }

.header-principal {
    background: linear-gradient(112deg, #0a4530 0%, #0e5537 60%, #11603d 100%);
    height: 140px;
    position: relative;
    overflow: hidden;
}

.header-principal::before {
    content: ''; position: absolute; inset: 0; z-index: 1;
    background: radial-gradient(120% 150% at 30% -50%, rgba(255,255,255,.10), transparent 65%);
    pointer-events: none;
}

.capa-wrapper {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 28px;
    margin-top: -90px;
    position: relative;
    z-index: 5;
}
.capa {
    width: 100%;
    height: 320px;

    border-radius: 14px 14px 0 14px;
    border: 5px solid var(--branco);
    box-shadow: 0 16px 48px rgba(0,0,0,0.22);
    overflow: hidden;
    background: linear-gradient(135deg, var(--azul-escuro), var(--azul-claro));
    position: relative;
}
.capa-img {
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
}

.perfil-info-bar {
    max-width: 1280px;
    margin: -52px auto 0;
    padding: 0 28px;
    display: flex;
    align-items: flex-end;
    gap: 0;
    position: relative;
    z-index: 10;
}

.perfil-avatar {
    width: 160px;
    height: 160px;
    border-radius: 12px;
    border: 5px solid var(--branco);
    box-shadow: 0 6px 24px rgba(0,0,0,0.2);
    overflow: hidden;
    background: var(--branco);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 64px;
    flex-shrink: 0;
    margin-left: 48px;
    margin-bottom: 20px !important;
}
.perfil-avatar img {
    width: 100%; height: 100%;
    object-fit: cover;
}

@keyframes pulso { 0%,100% { opacity:1; } 50% { opacity:.5; } }

.container { max-width: 1280px; margin: 0 auto; padding: 0 28px; }

.barra-acoes {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    margin-top: 0;
}

.btn-categorias {
    background: var(--branco);
    border: 1px solid var(--cinza-300);
    border-radius: var(--radius);
    padding: 10px 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    color: var(--texto);
    font-size: 13px;
    transition: border-color .2s, box-shadow .2s;
    position: relative;
    white-space: nowrap;
    flex-shrink: 0;
}
.btn-categorias:hover { border-color: var(--azul); }
.btn-categorias.aberto {
    border-color: var(--azul);
    box-shadow: 0 0 0 3px rgba(10,37,64,0.08);
}
.btn-categorias svg { transition: transform .3s; }
.btn-categorias.aberto svg { transform: rotate(180deg); }

.dropdown-categorias {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 260px;
    background: var(--branco);
    border: 1px solid var(--cinza-200);
    border-radius: 12px;
    box-shadow: 0 16px 40px rgba(0,0,0,0.14);
    padding: 8px;
    z-index: 30;
    display: none;
}
.dropdown-categorias.aberto { display: block; animation: dropIn .18s ease; }
@keyframes dropIn { from { opacity:0; transform: translateY(-6px); } }

.dropdown-categorias a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 14px;
    color: var(--texto);
    text-decoration: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    transition: background .15s, color .15s;
    border-bottom: 1px solid var(--cinza-100);
}
.dropdown-categorias a:last-child { border-bottom: none; }
.dropdown-categorias a:hover { background: var(--cinza-100); color: var(--azul); }

.frete-wrap {
    position: relative;
    flex-shrink: 0;
}
.btn-frete {
    background: var(--branco);
    border: 1px solid var(--cinza-300);
    border-radius: var(--radius);
    padding: 10px 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    color: var(--texto);
    font-size: 13px;
    transition: border-color .2s;
    white-space: nowrap;
    cursor: pointer;
}
.btn-frete:hover { border-color: var(--azul); }
.btn-frete.aberto { border-color: var(--azul); box-shadow: 0 0 0 3px rgba(10,37,64,0.08); }
.btn-frete svg { transition: transform .3s; flex-shrink: 0; }
.btn-frete.aberto svg { transform: rotate(180deg); }

.frete-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 300px;
    background: var(--branco);
    border: 1px solid var(--cinza-200);
    border-radius: 12px;
    box-shadow: 0 16px 40px rgba(0,0,0,0.14);
    padding: 16px;
    z-index: 30;
    display: none;
}
.frete-dropdown.aberto { display: block; animation: dropIn .18s ease; }
.frete-dropdown h4 { font-size: 14px; font-weight: 700; color: var(--azul); margin-bottom: 12px; }
.frete-opcoes { display: flex; gap: 8px; margin-bottom: 14px; }
.frete-tab {
    flex: 1; padding: 9px; border-radius: 8px;
    border: 1.5px solid var(--cinza-200);
    font-size: 12px; font-weight: 600;
    display: flex; flex-direction: column; align-items: center; gap: 4px;
    cursor: pointer; transition: all .2s;
}
.frete-tab:hover, .frete-tab.ativo { border-color: var(--azul); background: rgba(10,37,64,.04); color: var(--azul); }
.frete-tab span:first-child { font-size: 20px; }
.frete-input-row { display: flex; gap: 8px; }
.frete-input-row input {
    flex: 1; padding: 9px 12px;
    border: 1px solid var(--cinza-300); border-radius: 8px;
    font-size: 13px; font-family: inherit; outline: none;
}
.frete-input-row input:focus { border-color: var(--azul); }
.frete-input-row button {
    background: var(--azul); color: var(--branco);
    padding: 9px 16px; border-radius: 8px;
    font-weight: 700; font-size: 13px;
    white-space: nowrap;
}
.frete-input-row button:hover { background: var(--azul-claro); }
.frete-info { font-size: 12px; color: var(--verde); margin-top: 10px; font-weight: 600; display: none; }
.frete-info.show { display: block; }

.busca-wrapper {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
    max-width: 340px;
    margin-left: 0;
    margin-right: auto;
}
.busca-input {
    width: 100%;
    background: var(--branco);
    border: 1px solid var(--cinza-300);
    border-radius: var(--radius);
    padding: 10px 14px 10px 38px;
    font-size: 13px;
    color: var(--texto);
    font-family: inherit;
    outline: none;
    transition: border-color .2s;
}
.busca-input:focus { border-color: var(--azul); }
.busca-icone { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--texto-claro); }

.btn-busca-mobile {
    display: none;
    width: 40px; height: 40px;
    border-radius: var(--radius);
    background: var(--branco);
    border: 1px solid var(--cinza-300);
    align-items: center; justify-content: center;
    cursor: pointer; color: var(--texto); flex-shrink: 0;
    margin-left: auto;
}

.layout-conteudo {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 24px;
    align-items: start;
    margin-top: 20px;
}
.coluna-esquerda { min-width: 0; display: flex; flex-direction: column; }
.coluna-produtos { min-width: 0; }

body.header-visivel { --frete-top: calc(var(--header-fixo-h) + 14px); }

.coluna-frete {
    position: sticky;

    top: var(--frete-top);
    align-self: start;
    max-height: calc(100vh - var(--frete-top) - 16px);
    transition: top .3s ease, max-height .3s ease;
    overflow-y: auto;
    overscroll-behavior: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--cinza-300) transparent;
}
.coluna-frete::-webkit-scrollbar { width: 6px; }
.coluna-frete::-webkit-scrollbar-thumb { background: var(--cinza-300); border-radius: 3px; }
.coluna-frete::-webkit-scrollbar-track { background: transparent; }

.box-entrega {
    background: var(--branco);
    border: 1px solid var(--cinza-200);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--sombra);
}

.aside-frete-drop {
    display: none;
    padding: 16px 18px;
    border-bottom: 1px solid var(--cinza-200);
    animation: dropIn .18s ease;
}
.aside-frete-drop.aberto { display: block; }

#asideCalcSeta svg { transition: transform .3s; }
#boxCalcular.aberto #asideCalcSeta svg { transform: rotate(90deg); }

.loja-meta-sep {
    font-size: 18px;
    font-weight: 900;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    user-select: none;
    color: var(--texto);
}
.loja-localizacao {
        display: inline-flex; align-items: center; gap: 4px;
        color: var(--texto); font-size: 13px;
        font-weight: 700; letter-spacing: 0.2px;
    }
    .loja-localizacao svg { color: var(--texto); flex-shrink: 0; }
.box-calcular {
    padding: 16px 18px;
    border-bottom: 1px solid var(--cinza-200);
    cursor: pointer;
    display: flex; align-items: center; gap: 14px;
    transition: background .2s;
}
.box-calcular:hover { background: var(--cinza-100); }
.box-calcular-icone {
    width: 40px; height: 40px; border-radius: 10px;
    background: linear-gradient(135deg, var(--azul), var(--azul-claro));
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0; color: var(--branco);
}
.box-calcular-icone svg { width: 20px; height: 20px; }
.box-calcular-texto { flex: 1; min-width: 0; }
.box-calcular-label { font-size: 11px; color: var(--texto-secundario); text-transform: uppercase; letter-spacing: .5px; font-weight: 600; }
.box-calcular-titulo { font-size: 13px; font-weight: 700; color: var(--azul); margin-top: 2px; }
.box-calcular-seta { color: var(--texto-claro); display: flex; align-items: center; }
.sacola-vazia { text-align: center; padding: 28px 16px; border-bottom: 1px solid var(--cinza-200); }
.sacola-vazia-icone { font-size: 32px; margin-bottom: 8px; opacity: .4; }
.sacola-vazia-texto { font-size: 13px; color: var(--texto-secundario); }
.box-cupom { padding: 14px 18px; display: flex; align-items: center; justify-content: space-between; cursor: pointer; transition: background .2s; }
.box-cupom:hover { background: var(--cinza-100); }
.box-cupom-label { font-size: 11px; color: var(--texto-secundario); text-transform: uppercase; letter-spacing: .5px; font-weight: 600; }
.box-cupom-valor { font-size: 13px; font-weight: 600; color: var(--texto-claro); margin-top: 2px; }
.box-cupom-btn { width: 28px; height: 28px; border-radius: 8px; background: var(--azul); color: var(--branco); font-size: 18px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-weight: 400; line-height: 1; }

.secao { margin-bottom: 36px; scroll-margin-top: 90px; }
/* Um risco embaixo do título é o que toda folha de estilo faz.
   Aqui o título ganha a marca ANTES dele: uma barra vertical
   curta, na altura do texto, mais o nome em Fraunces com uma
   palavra do assunto em peso menor. Ocupa menos altura e diz
   mais — a barra amarra a seção à faixa de marca do topo. */
.secao-titulo {
    position: relative;
    display: flex; align-items: baseline; gap: 12px;
    font-family: 'Fraunces', 'Nunito', serif;
    font-optical-sizing: auto;
    font-size: 27px; font-weight: 700; letter-spacing: -.025em;
    color: var(--v-800);
    margin-bottom: 20px; padding-left: 15px;
    text-transform: none;
}
.secao-titulo::before {
    content: ''; position: absolute; left: 0; top: .12em; bottom: .18em;
    width: 4px; border-radius: 4px;
    background: linear-gradient(180deg, var(--v-400), var(--v-600));
}
/* a linha fininha que atravessa até a borda, no lugar do risco */
.secao-titulo::after {
    content: ''; flex: 1; height: 1px; margin-left: 2px;
    background: linear-gradient(90deg, rgba(6,42,28,.14), transparent);
}
.secao-titulo em {
    font-family: 'Plus Jakarta Sans', sans-serif; font-style: normal;
    font-size: 12px; font-weight: 700; letter-spacing: .02em;
    color: var(--v-500); white-space: nowrap;
}

.carrossel-track {
    display: flex; gap: 16px;
    overflow-x: auto; scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-bottom: 4px;
}
.carrossel-track::-webkit-scrollbar { display: none; }

.card-destaque {
    background: var(--branco);
    border: 1px solid var(--cinza-200);
    border-radius: 10px; overflow: hidden; cursor: pointer;
    transition: all .25s; display: flex; flex-direction: column;
    flex: 0 0 calc(33.333% - 11px);
    scroll-snap-align: start; min-width: 0;
}
.card-destaque:hover { box-shadow: var(--sombra-hover); transform: translateY(-3px); }

.card-destaque-img {
    width: 100%; height: 200px;
    background: var(--branco);
    display: flex; align-items: center; justify-content: center;
    position: relative; flex-shrink: 0;
    padding: 12px 12px 0 12px;
}
.card-destaque-img img.produto-img {
    width: 100%; height: 100%;
    object-fit: cover;
    border-radius: 8px;
}
.card-destaque-img .emoji-produto {
    font-size: 80px; width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
}
.card-destaque-info { padding: 14px 16px; flex: 1; display: flex; flex-direction: column; }

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

.card-horizontal {
    background: var(--branco);
    border: 1px solid var(--cinza-200);
    border-radius: 10px; overflow: hidden; cursor: pointer;
    transition: all .25s; display: flex; align-items: stretch;
    min-height: 130px;
}
.card-horizontal:hover { box-shadow: var(--sombra-hover); transform: translateY(-2px); }

.card-horizontal-info {
    flex: 1; min-width: 0;
    padding: 14px 12px 14px 16px;
    display: flex; flex-direction: column; justify-content: center; gap: 4px;
}
.card-horizontal-img {
    width: 130px; flex-shrink: 0;
    background: var(--branco);
    display: flex; align-items: center; justify-content: center;
    position: relative;
    padding: 10px 10px 10px 0;
}
.card-horizontal-img img.produto-img {
    width: 100%; height: 100%;
    object-fit: cover;
    border-radius: 8px;
}
.card-horizontal-img .emoji-produto {
    font-size: 60px; width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
}

.card-titulo { font-size: 13px; font-weight: 700; color: var(--texto); margin-bottom: 2px; line-height: 1.3; }
.card-desc {
    font-size: 11px; color: var(--texto-secundario); margin-bottom: 8px;
    line-height: 1.45; flex: 1;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.card-precos { display: flex; align-items: baseline; gap: 8px; }
.card-valor { font-size: 14px; font-weight: 800; color: var(--verde); }
.card-valor-antigo { font-size: 11px; color: var(--texto-claro); text-decoration: line-through; }

.header-fixo {
    position: fixed; top: 0; left: 0; right: 0;
    background: var(--branco);
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    padding: 10px 0; z-index: 100;
    transform: translateY(-100%);
    transition: transform .3s ease;
}
.header-fixo.visivel { transform: translateY(0); }
.header-fixo-content { display: flex; align-items: center; gap: 14px; }
.header-fixo-logo {
    width: 40px; height: 40px; border-radius: 6px; overflow: hidden;
    flex-shrink: 0; background: var(--dourado);
    display: flex; align-items: center; justify-content: center; font-size: 20px;
    border: 2px solid var(--cinza-200);
}
.header-fixo-logo img { width: 100%; height: 100%; object-fit: cover; }
.header-fixo-cat {
    background: var(--cinza-100); border: 1px solid var(--cinza-200);
    border-radius: 8px; padding: 8px 12px;
    display: flex; align-items: center; gap: 6px;
    font-size: 13px; font-weight: 600; color: var(--texto);
    position: relative; white-space: nowrap;
}
.header-fixo-cat svg { transition: transform .3s; }
.header-fixo-cat.aberto svg { transform: rotate(180deg); }
.dropdown-fixo {
    position: absolute; top: calc(100% + 6px); left: 0; min-width: 200px;
    background: var(--branco); border: 1px solid var(--cinza-200);
    border-radius: 12px; box-shadow: 0 16px 40px rgba(0,0,0,0.14);
    padding: 8px; z-index: 50; display: none;
}
.dropdown-fixo.aberto { display: block; animation: dropIn .18s ease; }
.dropdown-fixo a {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 14px; color: var(--texto); text-decoration: none;
    border-radius: 8px; font-size: 13px; font-weight: 600;
    white-space: nowrap; border-bottom: 1px solid var(--cinza-100);
    transition: background .15s;
}
.dropdown-fixo a:last-child { border-bottom: none; }
.dropdown-fixo a:hover { background: var(--cinza-100); color: var(--azul); }
.header-fixo-busca { position: relative; width: 220px; }
.header-fixo-busca input {
    width: 100%; background: var(--cinza-100); border: 1px solid var(--cinza-200);
    border-radius: 8px; padding: 9px 12px 9px 34px;
    font-size: 13px; font-family: inherit; outline: none;
}
.header-fixo-busca input:focus { border-color: var(--azul); }
.header-fixo-busca svg { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--texto-claro); }
.header-fixo-lupa {
    display: none; width: 36px; height: 36px; border-radius: 8px;
    background: var(--cinza-100); border: 1px solid var(--cinza-200);
    align-items: center; justify-content: center; cursor: pointer; color: var(--texto); margin-left: auto;
}
.header-fixo-nav { display: flex; gap: 4px; margin-left: auto; }
.header-fixo-nav a {
    padding: 8px 14px; color: var(--texto-secundario); text-decoration: none;
    font-size: 13px; font-weight: 600; border-radius: 8px; transition: all .2s;
}
.header-fixo-nav a:hover, .header-fixo-nav a.ativo { background: var(--azul); color: var(--branco); }

.modal-overlay {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.5); z-index: 200;
    display: none; align-items: center; justify-content: center;
    padding: 20px; backdrop-filter: blur(3px);
}
.modal-overlay.aberto { display: flex; }
.modal {
    background: var(--branco); border-radius: 16px;
    max-width: 720px; width: 100%; max-height: 90vh; overflow: hidden;
    display: flex; flex-direction: column; animation: modalIn .25s ease;
}
@keyframes modalIn { from { transform: translateY(20px); opacity: 0; } }
.modal-fechar {
    position: absolute; top: 12px; right: 12px;
    width: 36px; height: 36px; border-radius: 50%;
    background: rgba(0,0,0,0.5); color: var(--branco);
    display: flex; align-items: center; justify-content: center;
    z-index: 10; font-size: 18px;
}
.modal-fechar:hover { background: rgba(0,0,0,0.7); }

.modal-produto { padding: 0; position: relative; max-width: 560px; }

.modal-produto-body {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

.modal-produto-capa {
    position: relative;
    width: 100%;
    height: 260px;
    flex: 0 0 auto;
    background: linear-gradient(135deg, #fff7e6 0%, #ffeccc 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.modal-produto-capa::after {
    content: '';
    position: absolute; inset: auto 0 0 0;
    height: 90px;
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,.75) 65%, #fff 100%);
    pointer-events: none;
}
.modal-produto-capa img.produto-img-modal {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
}
.modal-produto-capa .emoji-modal {
    font-size: 110px;
    line-height: 1;
    display: flex; align-items: center; justify-content: center;
    width: auto; height: auto; background: none; border-radius: 0;
    filter: drop-shadow(0 8px 18px rgba(0,0,0,.15));
}

.modal-produto-info {
    padding: 22px 28px 28px;
    background: var(--branco);
    position: relative;
    z-index: 2;
    margin-top: -22px;
    border-radius: 22px 22px 0 0;
}
.modal-produto-info h2 { font-family: 'Nunito', sans-serif; font-size: 26px; font-weight: 900; color: var(--azul); letter-spacing: -0.2px; line-height: 1.1; }
.modal-produto-info .desc { color: var(--texto-secundario); margin: 10px 0 18px; font-size: 14px; }
.modal-produto-info .precos { display: flex; gap: 10px; align-items: baseline; margin-bottom: 24px; padding-bottom: 20px; border-bottom: 1px solid var(--cinza-200); }
.modal-produto-info .valor { font-size: 24px; font-weight: 800; color: var(--verde); }
.modal-produto-info .valor-antigo { font-size: 14px; color: var(--texto-claro); text-decoration: line-through; }
.passo { margin-bottom: 22px; }
.passo-header { background: var(--cinza-100); padding: 12px 14px; border-radius: 8px; display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.passo-titulo { font-size: 14px; font-weight: 700; color: var(--texto); }
.passo-sub { font-size: 12px; color: var(--texto-secundario); margin-top: 2px; }
.passo-tag { font-size: 10px; font-weight: 700; padding: 4px 8px; border-radius: 4px; text-transform: uppercase; letter-spacing: .5px; }
.passo-tag.obrigatorio { background: var(--azul); color: var(--branco); }
.passo-tag.opcional { background: var(--cinza-200); color: var(--texto-secundario); }
.opcao { display: flex; align-items: center; justify-content: space-between; padding: 11px 4px; border-bottom: 1px solid var(--cinza-200); cursor: pointer; }
.opcao:last-child { border-bottom: none; }
.opcao-info { flex: 1; }
.opcao-nome { font-size: 14px; color: var(--texto); font-weight: 500; }
.opcao-valor { font-size: 12px; color: var(--verde); font-weight: 600; margin-top: 2px; }
.opcao-radio { width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--cinza-300); display: flex; align-items: center; justify-content: center; transition: all .15s; flex-shrink: 0; }
.opcao input { display: none; }
.opcao input:checked + .opcao-radio { border-color: var(--azul); background: var(--azul); }
.opcao input:checked + .opcao-radio::after { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--branco); }
.modal-produto-footer { padding: 16px 28px; border-top: 1px solid var(--cinza-200); display: flex; align-items: center; gap: 14px; }
.contador { display: flex; align-items: center; background: var(--cinza-100); border-radius: 10px; padding: 4px; }
.contador button { width: 32px; height: 32px; font-size: 18px; font-weight: 700; color: var(--azul); border-radius: 8px; }
.contador button:hover { background: var(--cinza-200); }
.contador span { min-width: 32px; text-align: center; font-weight: 700; font-size: 15px; }
.btn-adicionar { flex: 1; background: var(--azul); color: var(--branco); padding: 14px; border-radius: 10px; font-weight: 700; font-size: 14px; display: flex; justify-content: space-between; align-items: center; transition: background .2s; }
.btn-adicionar:hover { background: var(--azul-claro); }
.modal-info { padding: 0; max-width: 520px; }
.modal-info-header { background: linear-gradient(135deg, var(--azul-escuro), var(--azul)); padding: 28px; color: var(--branco); position: relative; }
.modal-info-header h2 { font-family: 'Nunito', sans-serif; font-size: 26px; font-weight: 900; letter-spacing: -0.2px; }
.modal-info-tabs { display: flex; background: var(--cinza-100); }
.modal-info-tab { flex: 1; padding: 14px; font-size: 13px; font-weight: 700; color: var(--texto-secundario); border-bottom: 3px solid transparent; transition: all .2s; }
.modal-info-tab.ativo { background: var(--branco); color: var(--azul); border-bottom-color: var(--azul); }
.modal-info-body { padding: 24px 28px; max-height: 50vh; overflow-y: auto; }
.modal-info-body h3 { font-size: 14px; color: var(--texto); margin-bottom: 8px; }
.modal-info-body p, .modal-info-body li { font-size: 14px; color: var(--texto-secundario); margin-bottom: 8px; line-height: 1.6; }
.modal-info-body ul { padding-left: 20px; }
.horario-linha { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid var(--cinza-200); font-size: 14px; }
.horario-linha span:last-child { font-weight: 600; color: var(--texto); }
.modal-pequeno { max-width: 420px; }
.modal-pequeno-header { padding: 20px 24px; border-bottom: 1px solid var(--cinza-200); position: relative; }
.modal-pequeno-header h3 { font-size: 17px; color: var(--azul); font-weight: 700; }
.modal-pequeno-body { padding: 24px; }
.input-grupo { margin-bottom: 16px; }
.input-grupo label { display: block; font-size: 13px; font-weight: 600; color: var(--texto); margin-bottom: 6px; }
.input-grupo input { width: 100%; padding: 12px 14px; border: 1px solid var(--cinza-300); border-radius: 8px; font-size: 14px; font-family: inherit; outline: none; }
.input-grupo input:focus { border-color: var(--azul); }
.btn-primario { width: 100%; background: var(--azul); color: var(--branco); padding: 14px; border-radius: 10px; font-weight: 700; font-size: 14px; }
.btn-primario:hover { background: var(--azul-claro); }
.modal-entrega-opcoes { max-width: 420px; }
.entrega-opcao-item { display: flex; align-items: center; gap: 16px; padding: 18px 16px; border: 2px solid var(--cinza-200); border-radius: 12px; cursor: pointer; margin-bottom: 12px; transition: all .2s; }
.entrega-opcao-item:hover { border-color: var(--azul); background: rgba(10,37,64,0.03); }
.entrega-opcao-icone { font-size: 28px; }
.entrega-opcao-titulo { font-size: 15px; font-weight: 700; color: var(--texto); }
.entrega-opcao-desc { font-size: 12px; color: var(--texto-secundario); margin-top: 2px; }

#modal-busca .modal { max-width: 100%; width: 100%; height: 100%; max-height: 100vh; border-radius: 0; }
.modal-busca-header { padding: 16px 20px; border-bottom: 1px solid var(--cinza-200); display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.modal-busca-input-wrap { flex: 1; position: relative; }
.modal-busca-input-wrap svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--texto-claro); }
.modal-busca-input-wrap input { width: 100%; border: 1px solid var(--cinza-300); border-radius: 10px; padding: 12px 14px 12px 38px; font-size: 15px; font-family: inherit; outline: none; background: var(--cinza-100); }
.modal-busca-input-wrap input:focus { border-color: var(--azul); background: var(--branco); }
.btn-cancelar-busca { color: var(--azul); font-size: 14px; font-weight: 600; white-space: nowrap; }
.modal-busca-resultados { flex: 1; overflow-y: auto; padding: 16px 20px; }
.busca-placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 200px; color: var(--texto-secundario); font-size: 14px; gap: 10px; }
.busca-placeholder span:first-child { font-size: 40px; }
.resultado-item { display: flex; align-items: center; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--cinza-200); cursor: pointer; }
.resultado-item:last-child { border-bottom: none; }
.resultado-img { width: 56px; height: 56px; border-radius: 10px; background: #fff7e6; display: flex; align-items: center; justify-content: center; font-size: 28px; flex-shrink: 0; overflow: hidden; }
.resultado-img img { width: 100%; height: 100%; object-fit: cover; border-radius: 10px; }
.resultado-info { flex: 1; }
.resultado-nome { font-size: 14px; font-weight: 700; color: var(--texto); }
.resultado-desc { font-size: 12px; color: var(--texto-secundario); margin-top: 2px; }
.resultado-valor { font-size: 14px; font-weight: 800; color: var(--verde); white-space: nowrap; }

.barra-entrega-mobile { display: none; }

.mobile-nav {
    position: fixed; bottom: 0; left: 0; right: 0;
    background: transparent; border-top: none;
    z-index: 750; display: none;
    padding-bottom: max(4px, env(safe-area-inset-bottom));
    overflow: visible;
    transform: translateZ(0); will-change: transform;
}

.mobile-nav::after {
    content: '';
    position: absolute; left: 0; right: 0;
    top: 38px; bottom: 0;
    background: var(--branco); z-index: 0;
    box-shadow: 0 -4px 16px rgba(0,0,0,.08);
}
.mobile-nav-curve {
    position: absolute; top: 0; left: 0;
    width: 100%; height: 40px;
    overflow: visible; z-index: 1;
    pointer-events: none; display: block;
}
.mobile-nav-inner { display: flex; position: relative; z-index: 2; }
.mobile-nav-item {
    flex: 1; display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    color: var(--texto-claro); text-decoration: none;
    min-height: 52px; transition: all .2s;
    padding: 6px 4px; background: none; border: none;
    border-radius: 8px; font-family: inherit; cursor: pointer; position: relative;
}
.mobile-nav-item svg { width: 22px; height: 22px; margin-bottom: 2px; }
.mobile-nav-item span.nav-label { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; }
.mobile-nav-item:hover, .mobile-nav-item.active { color: var(--azul); }
.cart-badge-mobile {
    position: absolute; top: 4px; right: 12px;
    background: var(--vermelho); color: var(--branco);
    border-radius: 50%; width: 16px; height: 16px;
    font-size: 9px; display: none; align-items: center; justify-content: center; font-weight: 700;
}

.mobile-nav-fab-wrap {
    flex: 0 0 74px; display: flex;
    justify-content: center; align-items: flex-end;
    position: relative;
    padding-bottom: max(5px, env(safe-area-inset-bottom));
}
.mobile-nav-fab {
    position: relative; z-index: 3;
    transform: translateY(-18px);
    width: 60px; height: 60px; border-radius: 50%;
    background: var(--branco);
    border: 1.5px solid rgba(20,111,69,0.22);
    box-shadow: 0 6px 20px rgba(6,42,28,.24), 0 0 0 4px rgba(20,111,69,.08);
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    transition: transform .25s, box-shadow .25s;
    -webkit-tap-highlight-color: transparent; padding: 0;
}
.mobile-nav-fab:active { transform: translateY(-14px) scale(.93); }

.mobile-nav-fab img { width: 50px; height: 50px; object-fit: contain; border-radius: 50%; }

@media (max-width: 900px) {

    body { padding-bottom: calc(60px + env(safe-area-inset-bottom)); }

    .header-principal { display: none; }

    :root {
        --encaixe:    -20px;
        --logo-sobe:   60px;
    }

    .capa-wrapper { padding: 0; margin: 0 0 var(--encaixe) !important; }
    .capa {
        height: 190px; border-radius: 0;
        border: none; box-shadow: none;
    }

    .perfil-info-bar {
        display: block;
        margin: 0 !important; padding: 0 !important;
        position: relative; z-index: 10;
    }

    .perfil-avatar {
        position: absolute; top: calc(var(--logo-sobe) * -1); left: 50%;
        transform: translateX(-50%);
        margin: 0 !important;
        width: 96px; height: 96px;
        border-radius: 50%;
        border: 4px solid var(--branco);
        box-shadow: 0 4px 16px rgba(0,0,0,0.2);
        z-index: 12;
    }

    .container { padding: 0 12px; }

    .barra-entrega-mobile { display: none !important; }

    .barra-acoes { margin-top: 10px; }
    .busca-wrapper { display: none; }
    .btn-busca-mobile { display: flex; }

    .layout-conteudo { grid-template-columns: 1fr; margin-top: 10px; gap: 0; }
    .layout-conteudo > aside,
    .coluna-frete { display: none; }
    .coluna-esquerda { min-width: 0; }

    .busca-wrapper { max-width: none; }

    .carrossel-track { display: flex; gap: 16px; }
    .card-destaque { flex: 0 0 170px; min-width: 170px; }
    .card-destaque-img { height: 140px; }

    .grid-horizontal { grid-template-columns: 1fr; }
    .card-horizontal-img { width: 110px; }

    .secao-titulo { font-size: 17px; }

    .header-fixo-nav { display: none; }
    .header-fixo-busca { display: none; }
    .header-fixo-content { gap: 10px; }
    .header-fixo-cat { flex: 1; }
    .header-fixo-lupa { display: flex; margin-left: auto; }

    .mobile-nav { display: block; }

    .modal-overlay { padding: 0; align-items: flex-end; }
    .modal { max-height: 100vh; height: 100vh; border-radius: 0; max-width: 100%; }
    .modal-produto { max-width: 100%; height: 100vh; max-height: 100vh; }

    #modal-produto { z-index: 200; }
    .modal-produto-body { display: flex; flex-direction: column; max-height: none; height: 100%; overflow-y: auto; }
    .modal-produto-capa { height: 46vw; min-height: 190px; max-height: 260px; flex: 0 0 auto; }
    .modal-produto-capa .emoji-modal { font-size: 92px; }
    .modal-produto-info { background: var(--branco); border-radius: 22px 22px 0 0; margin-top: -22px; padding: 26px 18px 24px; position: relative; z-index: 2; }
    .modal-produto-info::before { content: ''; position: absolute; top: 9px; left: 50%; transform: translateX(-50%); width: 42px; height: 4px; border-radius: 2px; background: var(--cinza-300); }
    .modal-produto-info h2 { font-size: 22px; }
    .modal-produto-footer { position: sticky; bottom: 0; left: 0; right: 0; background: var(--branco); border-top: 1px solid var(--cinza-200); padding: 14px 20px; padding-bottom: calc(14px + env(safe-area-inset-bottom)); z-index: 10; box-shadow: 0 -6px 20px rgba(0,0,0,.08); }
    .modal-info, .modal-pequeno, .modal-entrega-opcoes { max-width: 100%; border-radius: 20px 20px 0 0; }
    #modal-busca .modal { border-radius: 0; height: 100vh; }
}

.modal-produto { display: flex; flex-direction: column; max-height: 90vh; }
.modal-produto .modal-produto-body { flex: 1 1 auto; min-height: 0; }
.modal-produto .modal-produto-footer { flex: 0 0 auto; }

.modal-produto .modal-fechar {
    background: rgba(0,0,0,.45);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

@media (min-width: 901px) and (max-width: 1180px) {
    .layout-conteudo { grid-template-columns: minmax(0, 1fr) 280px; gap: 18px; }
    .busca-wrapper { max-width: 260px; }
    .btn-categorias span { font-size: 12px; }
}

@media (min-width: 901px) and (max-height: 720px) {
    .modal-produto-capa { height: 200px; }
}

@media (max-width: 380px) {
    .modal-produto-capa { min-height: 165px; }
    .modal-produto-info { padding: 24px 14px 20px; }
    .modal-produto-info h2 { font-size: 20px; }
    .modal-produto-footer { gap: 10px; padding: 12px 14px; }
    .btn-adicionar { padding: 12px; font-size: 13px; }
}

.pg-login{
  min-height:100vh;display:grid;place-items:center;padding:24px;
  background:#faf7f2;
}
.lg-caixa{
  width:min(400px,100%);padding:34px 30px 26px;border-radius:20px;
  background:#fff;border:1px solid rgba(0,0,0,.07);
  box-shadow:0 22px 60px rgba(0,0,0,.09);text-align:center;
}
.lg-marca{
  font-size:1.7rem;font-weight:800;letter-spacing:-.02em;
  color:#2f7d4f;text-decoration:none;display:block;
}
.lg-sub{ font-size:.78rem;color:#8a8f88;margin:4px 0 22px; }

.lg-abas{
  display:flex;gap:3px;padding:3px;border-radius:12px;
  background:#f1f0eb;margin-bottom:18px;
}
.lg-aba{
  flex:1;padding:9px;border:none;border-radius:9px;cursor:pointer;
  background:none;font-family:inherit;font-size:.8rem;font-weight:700;color:#8a8f88;
  transition:.18s ease;
}
.lg-aba.ativa{ background:#fff;color:#2f7d4f;box-shadow:0 1px 4px rgba(0,0,0,.06); }

.lg-form{ display:flex;flex-direction:column;gap:12px;text-align:left; }
.lg-form label{
  display:flex;flex-direction:column;gap:5px;
  font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#8a8f88;
}
.lg-form input{
  padding:12px 13px;border-radius:11px;font-family:inherit;font-size:.9rem;
  border:1px solid rgba(0,0,0,.12);background:#fbfbf9;color:#1d211c;
  transition:border-color .18s ease;
}
.lg-form input:focus{ outline:none;border-color:#2f7d4f;background:#fff; }

.lg-btn{
  margin-top:6px;padding:13px;border:none;border-radius:11px;cursor:pointer;
  background:#2f7d4f;color:#fff;font-family:inherit;
  font-size:.82rem;font-weight:800;letter-spacing:.04em;
  transition:.18s ease;
}
.lg-btn:hover{ background:#276841; }

.lg-aviso{
  padding:10px 13px;border-radius:10px;margin-bottom:14px;
  font-size:.78rem;text-align:left;
}
.lg-aviso.erro{ background:#fdeceb;color:#b42318;border:1px solid #f5c6c2; }
.lg-aviso.ok{   background:#e9f7ef;color:#1c6b41;border:1px solid #b9e2ca; }

.lg-voltar{
  display:inline-block;margin-top:18px;font-size:.74rem;
  color:#8a8f88;text-decoration:none;
}
.lg-voltar:hover{ color:#2f7d4f; }

.conta-entrar{
  padding:9px 16px;border-radius:99px;text-decoration:none;
  background:var(--v-600);color:#fff;font-size:.78rem;font-weight:700;
}
.conta{ position:relative; }
.conta-btn{
  display:flex;align-items:center;gap:9px;padding:6px 13px 6px 6px;
  border-radius:99px;cursor:pointer;font-family:inherit;font-size:.8rem;font-weight:700;
  background:#fff;border:1px solid rgba(0,0,0,.1);color:#1d211c;
}
.conta-ini{
  width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  background:var(--v-600);color:#fff;font-size:.75rem;
}
.conta-menu{
  position:absolute;top:calc(100% + 12px);right:-4px;width:268px;z-index:200;
  padding:9px;border-radius:16px;background:#fff;
  border:1px solid rgba(6,42,28,.09);
  box-shadow:0 2px 6px rgba(6,42,28,.06), 0 22px 50px -14px rgba(6,42,28,.30);
  opacity:0;visibility:hidden;transform:translateY(-8px) scale(.97);
  transform-origin:top right;
  transition:opacity .2s ease, transform .22s cubic-bezier(.22,1,.36,1), visibility .22s;
}

.conta-menu::after{
  content:'';position:absolute;left:0;right:0;top:-14px;height:14px;
}
.conta-menu.aberto{ opacity:1;visibility:visible;transform:none; }

.conta-menu::before{
  content:'';position:absolute;top:-6px;right:16px;
  width:11px;height:11px;transform:rotate(45deg);
  background:#fff;border-radius:2px 0 0 0;
  border-top:1px solid rgba(6,42,28,.09);
  border-left:1px solid rgba(6,42,28,.09);
}
.conta-cab{ padding:10px 11px 12px;border-bottom:1px solid rgba(0,0,0,.07);margin-bottom:6px; }
.conta-cab-lbl{
  font-size:.58rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#a8ada5;
}
.conta-cab-nome{ display:block;font-size:.86rem;margin-top:3px; }
.conta-cab-mail{ font-size:.7rem;color:#8a8f88; }
.conta-lista{ display:flex;flex-direction:column;gap:1px; }
.conta-item{
  display:block;padding:9px 11px;border-radius:9px;text-decoration:none;color:#1d211c;
  transition:background .15s ease;
}
.conta-item:hover{ background:var(--v-100); }
.conta-item b{ display:block;font-size:.8rem;font-weight:700; }
.conta-item em{ font-size:.68rem;color:#8a8f88;font-style:normal; }
.conta-sair{
  display:block;margin-top:6px;padding:10px 11px;border-radius:9px;
  border-top:1px solid rgba(0,0,0,.07);text-decoration:none;
  font-size:.78rem;font-weight:700;color:#b42318;text-align:center;
}
.conta-sair:hover{ background:#fdeceb; }

.secao-cardapio{ margin-top: 4px; }

.cat-abas{
  overflow-x:auto;overflow-y:hidden;margin-bottom:18px;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;
  overscroll-behavior-x:contain;
  border-bottom:1px solid rgba(0,0,0,.07);
}
.cat-abas::-webkit-scrollbar{ display:none; }

.cat-abas-trilho{
  position:relative;display:flex;gap:28px;width:max-content;
  padding:0 2px 11px;
}

.cat-aba{
  position:relative;white-space:nowrap;
  background:none;border:none;padding:2px 0;cursor:pointer;
  font-family:inherit;font-size:.95rem;font-weight:800;letter-spacing:-.01em;
  color:#9aa094;transition:color .22s ease;
  user-select:none;-webkit-user-select:none;
}
.cat-aba:hover{ color:#4b5347; }
.cat-aba.ativa{ color:var(--azul-claro); }

.cat-regua{
  position:absolute;left:0;bottom:-1px;height:3px;width:0;
  border-radius:3px 3px 0 0;background:var(--azul-claro);
  transition:transform .34s cubic-bezier(.22,1,.36,1),
             width .34s cubic-bezier(.22,1,.36,1);
  pointer-events:none;
}

.cat-abas.arrastando{ cursor:grabbing; }
.cat-abas.arrastando .cat-aba{ pointer-events:none; }

.cat-pagina{ display:none; }
.cat-pagina.ativa{
  display:block;
  animation: catEntra .3s cubic-bezier(.22,1,.36,1) both;
}
@keyframes catEntra{
  from{ opacity:0;transform:translateY(8px); }
  to  { opacity:1;transform:none; }
}

@media(max-width:900px){
  .cat-abas-trilho{ gap:22px;padding-bottom:10px; }
  .cat-aba{ font-size:.9rem; }
}
@media(prefers-reduced-motion:reduce){
  .cat-regua{ transition:none; }
  .cat-pagina.ativa{ animation:none; }
}

.conta-item{ display:flex;align-items:center;gap:10px; }
.conta-pontos .conta-saldo-num{
  margin-left:auto;font-size:.9rem;font-weight:800;color:var(--azul-claro);
}

.mobile-nav-inner{ padding-top:6px; }
.mobile-nav-item{
  flex:1 1 0;min-width:0;text-decoration:none;
}
.mobile-nav-item .nav-label{
  font-size:.6rem;letter-spacing:.01em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;
}
.mobile-nav-item.ativo{ color:var(--azul-claro); }
.mobile-nav-item.ativo svg{ stroke-width:2.1; }

[hidden]{ display:none!important; }

.perfil-avatar{ position:relative; z-index:12; }

.loja-painel{

  flex:1;min-width:0;
  margin:0 0 20px -24px;
  padding:16px 22px 16px 50px;
  min-height:108px;
  display:flex;align-items:center;gap:16px;
  position:relative;

  border:none;

  border-radius:0 0 16px 0;
  box-shadow:0 16px 36px -18px rgba(6,42,28,.30);
  background:
    radial-gradient(58% 180% at 88% 50%, rgba(31,157,97,.10), transparent 70%),
    linear-gradient(180deg,#ffffff 0%,#fbfdfb 100%);
}

.loja-identidade{
  flex:1;min-width:0;display:flex;flex-direction:column;gap:7px;
  position:relative;z-index:1;
}

.loja-titulo-linha{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;min-width:0;
}
.loja-titulo-linha .loja-status{ transform:translateY(5px); }

.loja-nome{
  margin:0!important;
  font-family:'Fraunces','Nunito',serif;
  font-optical-sizing:auto;
  font-size:34px;font-weight:700;letter-spacing:-.02em;line-height:1;
  color:var(--v-700);
  background:linear-gradient(96deg,var(--v-800) 0%,var(--v-600) 58%,var(--v-500) 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}

.loja-slogan{
  font-size:12.5px;font-weight:600;letter-spacing:.005em;color:#6d7a71;
}
.loja-slogan b{ font-weight:800;color:var(--v-600); }

.loja-caixa{
  flex-shrink:0;position:relative;z-index:1;
  display:flex;flex-direction:column;align-items:flex-start;gap:5px;
  padding:11px 16px;border-radius:14px;text-align:left;
  background:linear-gradient(180deg,var(--v-100) 0%,#f6fcf9 100%);
  border:1px solid rgba(31,157,97,.18);
}
.loja-caixa-topo{
  display:inline-flex;align-items:center;gap:6px;
  font-size:13px;font-weight:800;letter-spacing:.01em;color:var(--v-600);
}
.loja-caixa-sub{
  display:inline-flex;align-items:center;gap:6px;
  font-size:11.5px;font-weight:600;color:#7e8a81;
}
.loja-caixa-sub svg{ color:#9aa79f;flex-shrink:0; }

.loja-local{
  cursor:pointer;font-family:inherit;
  transition:border-color .18s ease,background .18s ease,
             transform .18s cubic-bezier(.22,1,.36,1),box-shadow .18s ease;
}
.loja-local:hover{
  background:linear-gradient(180deg,#ddf1e6 0%,#eef9f3 100%);
  border-color:rgba(31,157,97,.45);
  transform:translateY(-1px);box-shadow:0 6px 16px -6px rgba(20,111,69,.35);
}
.loja-local .loja-caixa-topo svg{ transition:transform .18s ease; }
.loja-local:hover .loja-caixa-topo svg{ transform:translateX(2px); }

.loja-meta.fechado{
  background:linear-gradient(180deg,#fdf1f1 0%,#fdf8f8 100%);
  border-color:rgba(220,38,38,.2);
}
.loja-status{
  display:inline-flex!important;align-items:center;gap:8px;margin:0!important;
  font-size:13px;font-weight:800;letter-spacing:.01em;color:var(--v-600);
}
.loja-status::before{ display:none!important; }
.loja-status i{
  width:8px;height:8px;border-radius:50%;flex-shrink:0;
  background:var(--v-400);
  animation:pulsoPonto 2.4s cubic-bezier(.4,0,.6,1) infinite;
}
@keyframes pulsoPonto{
  0%  { box-shadow:0 0 0 0   rgba(55,192,126,.55); }
  70% { box-shadow:0 0 0 7px rgba(55,192,126,0);   }
  100%{ box-shadow:0 0 0 0   rgba(55,192,126,0);   }
}
.loja-status.off{ color:#b42318; }
.loja-status.off i{
  background:#ef4444;animation:none;box-shadow:0 0 0 3px rgba(239,68,68,.18);
}

.perfil-conta{ display:flex;align-items:center;flex-shrink:0;position:relative;z-index:20; }
.perfil-conta .conta{ position:relative;z-index:21; }

.perfil-conta .conta-entrar,
.perfil-conta .conta-btn{
  display:inline-flex;align-items:center;gap:8px;
  height:auto;min-width:0;padding:0;
  background:none;border:none;box-shadow:none;border-radius:0;
  font-family:inherit;font-size:13px;font-weight:800;letter-spacing:.01em;
  color:var(--v-600);text-decoration:none;cursor:pointer;
  transition:color .18s ease,opacity .18s ease;
}
.perfil-conta .conta-entrar:hover,
.perfil-conta .conta-btn:hover{ color:var(--v-700); }
.perfil-conta .conta-entrar svg{ opacity:.85;flex-shrink:0; }

.perfil-conta .conta-ini,
.perfil-conta .conta-ponto{ display:none!important; }

.perfil-conta .conta-btn::before{
  content:'';width:8px;height:8px;border-radius:50%;flex-shrink:0;
  background:var(--v-400);
  animation:pulsoPonto 2.4s cubic-bezier(.4,0,.6,1) infinite;
}
.perfil-conta .conta-nome{ white-space:nowrap; }
.perfil-conta .conta-seta{
  opacity:.45;margin-left:-1px;
  transition:transform .22s ease,opacity .18s ease;
}
.perfil-conta .conta-btn:hover .conta-seta{ opacity:.75; }
.perfil-conta .conta-btn[aria-expanded="true"] .conta-seta{ transform:rotate(180deg); }

.conta-item{ display:flex;align-items:center;gap:10px; }
.conta-pontos .conta-saldo-num{
  margin-left:auto;font-size:.9rem;font-weight:800;color:var(--v-500);
}
.conta-menu{ right:0;z-index:600; }

@media(max-width:900px){
  .loja-painel{
    display:grid;grid-template-columns:1fr auto;
    grid-template-areas:"id    id"
                        "local local"
                        "meta  conta";

    width:100%;margin:0!important;min-height:0;flex:none;
    padding:calc(96px - var(--logo-sobe) + 8px) 0 0;gap:0;

    border:none;border-radius:0;

    box-shadow:0 12px 30px -14px rgba(6,42,28,.35);
    background:linear-gradient(180deg,#ffffff 0%,#fbfdfb 100%);
  }

  .loja-identidade{
    grid-area:id;align-items:center;text-align:center;gap:9px;
    padding:0 16px 16px;
  }
  .loja-titulo-linha{ justify-content:center;gap:12px; }
  .loja-titulo-linha .loja-status{ transform:translateY(3px); }
  .loja-nome{ font-size:26px;line-height:1.1; }
  .loja-status{ font-size:12.5px; }
  .loja-slogan{ font-size:12px; }

  .loja-local{
    grid-area:local;
    flex-direction:row-reverse;align-items:center;justify-content:space-between;
    gap:12px;padding:12px 16px;
    background:none;border:none;border-radius:0;
    border-top:1px solid rgba(6,42,28,.07);
  }
  .loja-local:hover{ background:none;transform:none;box-shadow:none; }
  .loja-local .loja-caixa-topo{ font-size:12.5px; }
  .loja-local .loja-caixa-sub{ font-size:12px;min-width:0; }

  .loja-meta{
    grid-area:meta;
    flex-direction:row;align-items:center;gap:9px;
    padding:12px 6px 13px 16px;
    background:none;border:none;border-radius:0;
    border-top:1px solid rgba(6,42,28,.07);
  }
  .loja-meta.fechado{ background:none; }

  .perfil-conta{
    grid-area:conta;
    padding:12px 16px 13px 6px;
    border-top:1px solid rgba(6,42,28,.07);
  }
  .perfil-conta .conta-entrar,
  .perfil-conta .conta-btn{ font-size:12.5px; }
  .conta-menu{ width:min(276px,calc(100vw - 32px));right:0; }
}

@media(min-width:901px) and (max-width:1180px){
  .loja-painel{ gap:12px;padding-right:16px; }
  .loja-nome{ font-size:28px; }
  .loja-slogan{ font-size:11.5px; }
  .loja-caixa{ padding:10px 13px; }
  .loja-caixa-topo{ font-size:12.5px; }
  .perfil-conta .conta-entrar,
  .perfil-conta .conta-btn{ font-size:12.5px; }
}

.lg-form{ animation: lgEntra .28s cubic-bezier(.22,1,.36,1) both; }
@keyframes lgEntra{
  from{ opacity:0;transform:translateY(10px); }
  to  { opacity:1;transform:none; }
}

.lg-abas{ position:relative; }
.lg-abas::after{
  content:'';position:absolute;top:3px;bottom:3px;left:3px;
  width:calc(50% - 3px);border-radius:9px;background:#fff;
  box-shadow:0 1px 4px rgba(0,0,0,.07);
  transition:transform .3s cubic-bezier(.22,1,.36,1);
  z-index:0;
}
.lg-abas.criar::after{ transform:translateX(100%); }
.lg-aba{ position:relative;z-index:1;background:none!important;box-shadow:none!important; }

.nav-pontos svg{
  width:21px;height:21px;color:#f5b301;
  filter:drop-shadow(0 1px 2px rgba(245,179,1,.35));
}
.nav-pontos.ativo svg,
.nav-pontos:hover svg{ color:#e0a200; }
.nav-pontos .nav-label{ color:inherit; }

.perfil-conta{ position:relative;z-index:20; }
.perfil-conta .conta{ position:relative;z-index:21; }
.conta-menu{ z-index:600; }

.modal-overlay{ z-index:900; }

.dropdown-categorias{
  min-width:0;width:max-content;max-width:min(280px,calc(100vw - 32px));
  border-radius:14px;padding:7px;
  border:1px solid rgba(6,42,28,.09);
  box-shadow:0 2px 6px rgba(6,42,28,.06), 0 22px 50px -14px rgba(6,42,28,.30);
  top:calc(100% + 12px);
}

.dropdown-categorias::before{
  content:'';position:absolute;top:-6px;left:20px;
  width:11px;height:11px;transform:rotate(45deg);
  background:#fff;border-radius:2px 0 0 0;
  border-top:1px solid rgba(6,42,28,.09);
  border-left:1px solid rgba(6,42,28,.09);
}

.dropdown-categorias::after{
  content:'';position:absolute;left:0;right:0;top:-14px;height:14px;
}
.dropdown-categorias a{
  padding:9px 14px;border-radius:9px;white-space:nowrap;font-size:13px;
}
.dropdown-categorias a:hover{ background:var(--v-100);color:var(--v-700); }

.dropdown-fixo{
  width:max-content;min-width:0;max-width:min(280px,calc(100vw - 32px));
  border-radius:14px;
}

.modal-info{ max-width:520px;border-radius:20px;overflow:hidden; }

.modal-info-topo{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 12px 10px 10px;border-bottom:1px solid rgba(6,42,28,.07);
}
.modal-info-voltar{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 13px 8px 9px;border-radius:10px;
  font-family:inherit;font-size:13px;font-weight:800;color:var(--v-600);
  background:var(--v-100);border:1px solid rgba(31,157,97,.20);
  cursor:pointer;transition:background .18s ease,border-color .18s ease;
}
.modal-info-voltar:hover{ background:#ddf1e6;border-color:rgba(31,157,97,.45); }
.modal-info .modal-fechar{
  position:static;background:none;color:var(--texto-claro);
  width:34px;height:34px;border-radius:9px;
}
.modal-info .modal-fechar:hover{ background:var(--cinza-100);color:var(--texto); }

.modal-info-tabs{ background:none;padding:0 10px;gap:2px;border-bottom:1px solid rgba(6,42,28,.07); }
.modal-info-tab{
  padding:13px 6px;font-size:13px;font-weight:800;
  border-bottom:2px solid transparent;color:#9aa094;
}
.modal-info-tab.ativo{ background:none;color:var(--v-600);border-bottom-color:var(--v-500); }

.modal-info-body{ padding:20px 22px 24px;max-height:min(58vh,460px); }
.modal-info-body h3{ font-size:13px;font-weight:800;color:var(--v-700);margin-bottom:8px; }
.modal-info-body p,.modal-info-body li{ font-size:13.5px;line-height:1.65; }
.modal-info-body ul{ padding-left:18px;list-style:disc; }
.horario-linha{ border-bottom:1px solid rgba(6,42,28,.06);font-size:13.5px; }
.horario-linha.hoje{ color:var(--v-700);font-weight:800; }
.horario-linha.hoje span:last-child{ color:var(--v-600); }

@media(max-width:900px){
  .modal-info{
    max-width:100%;width:100%;
    border-radius:20px 20px 0 0;
    max-height:88dvh;height:auto;
    display:flex;flex-direction:column;
  }
  .modal-info-topo{ padding:10px 10px 9px 8px; }
  .modal-info-tabs{ padding:0 6px; }
  .modal-info-tab{ font-size:12.5px;padding:12px 4px; }
  .modal-info-body{
    padding:18px 16px calc(22px + env(safe-area-inset-bottom));
    max-height:none;flex:1 1 auto;min-height:0;overflow-y:auto;
  }
}

@media(max-width:900px){
  .modal-overlay{ align-items:flex-end; }
  .modal-produto{
    height:100dvh;max-height:100dvh;
    padding-top:env(safe-area-inset-top);
  }
  #modal-produto{ z-index:900; }
  .modal-produto-capa{
    height:auto;min-height:0;max-height:none;
    aspect-ratio:16/10;
  }
  .modal-produto .modal-fechar{
    top:calc(12px + env(safe-area-inset-top));
  }

  .modal-produto-footer{
    padding-bottom:calc(14px + env(safe-area-inset-bottom));
  }
}

.gaveta-fundo{
  position:fixed;inset:0;z-index:1000;
  background:rgba(6,42,28,.45);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  opacity:0;visibility:hidden;transition:opacity .28s ease,visibility .28s;
}
.gaveta-fundo.aberta{ opacity:1;visibility:visible; }

.gaveta{
  position:fixed;top:0;right:0;z-index:1001;
  width:min(430px,100vw);height:100dvh;
  display:flex;flex-direction:column;
  background:#fbfdfb;
  box-shadow:-24px 0 60px -20px rgba(6,42,28,.45);
  transform:translateX(100%);
  transition:transform .34s cubic-bezier(.22,1,.36,1);
  visibility:hidden;
}
.gaveta.aberta{ transform:none;visibility:visible; }

.gaveta-topo{
  flex:0 0 auto;display:flex;align-items:center;gap:12px;
  padding:calc(16px + env(safe-area-inset-top)) 16px 14px;
  background:#fff;border-bottom:1px solid rgba(6,42,28,.07);
}
.gaveta-topo-txt{ flex:1;min-width:0;display:flex;flex-direction:column;gap:1px; }
.gaveta-lbl{
  font-size:.6rem;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;color:#a8ada5;
}
.gaveta-titulo{
  font-family:'Fraunces','Nunito',serif;
  font-size:20px;font-weight:700;letter-spacing:-.01em;color:var(--v-700);
}
.gaveta-x,.gaveta-voltar{
  flex-shrink:0;display:inline-flex;align-items:center;gap:6px;
  border-radius:10px;cursor:pointer;font-family:inherit;
  border:1px solid rgba(6,42,28,.10);background:#fff;color:#6b7266;
  transition:background .18s ease,color .18s ease,border-color .18s ease;
}
.gaveta-x{ width:36px;height:36px;justify-content:center;font-size:15px; }
.gaveta-voltar{ height:36px;padding:0 12px 0 9px;font-size:12.5px;font-weight:800;color:var(--v-600); }
.gaveta-x:hover,.gaveta-voltar:hover{ background:var(--v-100);border-color:rgba(31,157,97,.35);color:var(--v-700); }

.gaveta-corpo{
  flex:1 1 auto;min-height:0;overflow-y:auto;
  padding:14px 16px 18px;display:flex;flex-direction:column;gap:10px;
}
.gaveta-pe{
  flex:0 0 auto;background:#fff;
  border-top:1px solid rgba(6,42,28,.07);
  padding:14px 16px calc(14px + env(safe-area-inset-bottom));
  box-shadow:0 -8px 24px -16px rgba(6,42,28,.5);
}

.gaveta-vazio{
  margin:auto;text-align:center;padding:30px 20px;color:#8a9189;
}
.gaveta-vazio-icone{
  width:64px;height:64px;margin:0 auto 14px;border-radius:20px;
  display:grid;place-items:center;font-size:28px;
  background:linear-gradient(180deg,var(--v-100),#f4fbf7);
  border:1px solid rgba(31,157,97,.18);
}
.gaveta-vazio b{ display:block;font-size:14px;color:var(--v-700);margin-bottom:4px; }
.gaveta-vazio span{ font-size:12.5px; }
.gaveta-vazio-btn{
  margin-top:16px;display:inline-flex;align-items:center;gap:7px;
  padding:11px 18px;border-radius:11px;cursor:pointer;font-family:inherit;
  font-size:12.5px;font-weight:800;color:#fff;border:none;
  background:linear-gradient(180deg,var(--v-500),var(--v-600));
  box-shadow:0 8px 20px -8px rgba(20,111,69,.65);
}

.sac-item{
  display:flex;gap:12px;padding:12px;border-radius:14px;
  background:#fff;border:1px solid rgba(6,42,28,.07);
  box-shadow:0 1px 2px rgba(6,42,28,.04);
}
.sac-img{
  width:62px;height:62px;flex-shrink:0;border-radius:11px;overflow:hidden;
  background:var(--v-100);display:grid;place-items:center;font-size:26px;
}
.sac-img img{ width:100%;height:100%;object-fit:cover; }
.sac-info{ flex:1;min-width:0;display:flex;flex-direction:column;gap:3px; }
.sac-nome{ font-size:13.5px;font-weight:800;color:var(--v-800);line-height:1.25; }
.sac-extras{ font-size:11.5px;color:#8a9189;line-height:1.45; }
.sac-linha{ display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:5px; }
.sac-valor{ font-size:14px;font-weight:800;color:var(--v-600); }

.sac-qtd{
  display:inline-flex;align-items:center;gap:2px;
  border:1px solid rgba(6,42,28,.10);border-radius:10px;background:#fff;overflow:hidden;
}
.sac-qtd button{
  width:28px;height:28px;display:grid;place-items:center;
  font-size:15px;font-weight:800;color:var(--v-600);cursor:pointer;
  transition:background .15s ease;
}
.sac-qtd button:hover{ background:var(--v-100); }
.sac-qtd b{ min-width:22px;text-align:center;font-size:13px; }
.sac-lixo{
  width:28px;height:28px;border-radius:8px;display:grid;place-items:center;
  color:#c0776f;cursor:pointer;transition:background .15s ease;
}
.sac-lixo:hover{ background:#fdeceb; }

.sac-contas{ display:flex;flex-direction:column;gap:7px;margin-bottom:12px; }
.sac-conta{ display:flex;justify-content:space-between;font-size:12.5px;color:#6b7266; }
.sac-conta b{ font-weight:700;color:#4b5347; }
.sac-conta.gratis b{ color:var(--v-500); }
.sac-total{
  display:flex;justify-content:space-between;align-items:baseline;
  padding-top:10px;border-top:1px dashed rgba(6,42,28,.14);
  font-size:13px;font-weight:800;color:var(--v-800);
}
.sac-total b{ font-size:19px;color:var(--v-600); }

.btn-verde{
  width:100%;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:48px;border-radius:13px;border:none;cursor:pointer;font-family:inherit;
  font-size:13.5px;font-weight:800;letter-spacing:.02em;color:#fff;
  background:linear-gradient(180deg,var(--v-500),var(--v-600));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 10px 24px -10px rgba(20,111,69,.7);
  transition:transform .18s cubic-bezier(.22,1,.36,1),box-shadow .18s ease,filter .18s ease;
}
.btn-verde:hover{ transform:translateY(-1px);filter:saturate(1.06); }
.btn-verde:active{ transform:translateY(0); }
.btn-claro{
  width:100%;height:42px;border-radius:12px;cursor:pointer;font-family:inherit;
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  font-size:12.5px;font-weight:800;color:var(--v-600);
  background:#fff;border:1px solid rgba(31,157,97,.28);
  transition:background .18s ease,border-color .18s ease;
}
.btn-claro:hover{ background:var(--v-100);border-color:rgba(31,157,97,.5); }

.ped-card{
  display:flex;flex-direction:column;gap:9px;padding:14px;
  border-radius:14px;background:#fff;cursor:pointer;text-align:left;
  border:1px solid rgba(6,42,28,.07);font-family:inherit;width:100%;
  box-shadow:0 1px 2px rgba(6,42,28,.04);
  transition:border-color .18s ease,transform .18s cubic-bezier(.22,1,.36,1),box-shadow .18s ease;
}
.ped-card:hover{
  border-color:rgba(31,157,97,.4);transform:translateY(-1px);
  box-shadow:0 10px 22px -12px rgba(6,42,28,.35);
}
.ped-topo{ display:flex;align-items:center;justify-content:space-between;gap:10px; }
.ped-cod{ font-size:13px;font-weight:800;color:var(--v-800);letter-spacing:.01em; }
.ped-data{ font-size:11.5px;color:#8a9189; }
.ped-baixo{ display:flex;align-items:center;justify-content:space-between;gap:10px; }
.ped-itens{ font-size:12px;color:#6b7266;min-width:0; }
.ped-valor{ font-size:14px;font-weight:800;color:var(--v-600);flex-shrink:0; }

.selo{
  display:inline-flex;align-items:center;gap:6px;flex-shrink:0;
  padding:4px 10px;border-radius:99px;
  font-size:10.5px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;
}
.selo i{ width:6px;height:6px;border-radius:50%;background:currentColor; }
.selo.entregue{ background:var(--v-100);color:var(--v-600); }
.selo.andamento{ background:#fff5e0;color:#b07d10; }
.selo.cancelado{ background:#fdeceb;color:#b42318; }

.ext-cab{
  padding:16px;border-radius:14px;background:#fff;
  border:1px solid rgba(6,42,28,.07);display:flex;flex-direction:column;gap:10px;
}
.ext-cab-topo{ display:flex;align-items:center;justify-content:space-between;gap:10px; }
.ext-cod{ font-family:'Fraunces','Nunito',serif;font-size:19px;font-weight:700;color:var(--v-700); }
.ext-meta{ display:flex;flex-wrap:wrap;gap:6px 18px; }
.ext-meta div{ display:flex;flex-direction:column;gap:1px; }
.ext-meta span{ font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#a8ada5; }
.ext-meta b{ font-size:12.5px;font-weight:700;color:#4b5347; }

.ext-bloco{
  padding:14px 16px;border-radius:14px;background:#fff;
  border:1px solid rgba(6,42,28,.07);
}
.ext-bloco h4{
  font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:#a8ada5;margin-bottom:11px;
}
.ext-linha{
  display:flex;justify-content:space-between;gap:12px;
  padding:9px 0;border-top:1px dashed rgba(6,42,28,.10);
}
.ext-linha:first-of-type{ border-top:none;padding-top:0; }
.ext-linha-nome{ font-size:13px;font-weight:700;color:var(--v-800);line-height:1.3; }
.ext-linha-sub{ font-size:11.5px;color:#8a9189;margin-top:2px;line-height:1.45; }
.ext-linha-val{ font-size:13px;font-weight:800;color:#4b5347;white-space:nowrap; }

.ext-passos{ display:flex;flex-direction:column;gap:0; }
.ext-passo{ display:flex;gap:12px;position:relative;padding-bottom:16px; }
.ext-passo:last-child{ padding-bottom:0; }
.ext-passo::before{
  content:'';position:absolute;left:6px;top:15px;bottom:-1px;width:2px;
  background:rgba(6,42,28,.10);
}
.ext-passo:last-child::before{ display:none; }
.ext-bola{
  width:14px;height:14px;border-radius:50%;flex-shrink:0;margin-top:2px;
  background:#e3e8e4;border:3px solid #fff;box-shadow:0 0 0 1px rgba(6,42,28,.10);
  position:relative;z-index:1;
}
.ext-passo.feito .ext-bola{ background:var(--v-500);box-shadow:0 0 0 1px rgba(31,157,97,.35); }
.ext-passo.agora .ext-bola{ background:var(--v-400);animation:pulsoPonto 2.4s cubic-bezier(.4,0,.6,1) infinite; }
.ext-passo-txt b{ display:block;font-size:12.5px;font-weight:800;color:#4b5347; }
.ext-passo.feito .ext-passo-txt b,
.ext-passo.agora .ext-passo-txt b{ color:var(--v-700); }
.ext-passo-txt span{ font-size:11px;color:#9aa094; }

.gaveta-pe-duplo{ display:flex;gap:9px; }
.gaveta-pe-duplo .btn-claro,.gaveta-pe-duplo .btn-verde{ flex:1;height:44px; }

@media(max-width:900px){
  .gaveta{ width:100vw; }
  .gaveta-titulo{ font-size:18px; }
}

#folha-impressao{ display:none; }


.ck-bloco{
  padding:14px 16px;border-radius:14px;background:#fff;
  border:1px solid rgba(6,42,28,.07);display:flex;flex-direction:column;gap:9px;
}
.ck-bloco h4{
  font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:#a8ada5;margin:0 0 2px;
}
.ck-campo{
  width:100%;padding:11px 13px;border-radius:11px;font-family:inherit;font-size:13px;
  color:var(--v-800);background:#fbfdfb;border:1px solid rgba(6,42,28,.12);
  transition:border-color .18s ease,box-shadow .18s ease;
}
.ck-campo:focus{
  outline:none;border-color:var(--v-500);box-shadow:0 0 0 3px rgba(31,157,97,.14);
}
.ck-campo::placeholder{ color:#a8ada5; }
textarea.ck-campo{ resize:vertical;min-height:56px; }

.ck-duplo,.ck-formas{ display:flex;flex-wrap:wrap;gap:7px; }
.ck-duplo .ck-opc{ flex:1; }
.ck-opc{
  padding:10px 14px;border-radius:11px;cursor:pointer;font-family:inherit;
  font-size:12.5px;font-weight:800;color:#6b7266;
  background:#fbfdfb;border:1px solid rgba(6,42,28,.12);
  transition:background .18s ease,border-color .18s ease,color .18s ease;
}
.ck-opc:hover{ border-color:rgba(31,157,97,.4); }
.ck-opc.ativo{
  background:var(--v-100);border-color:var(--v-500);color:var(--v-700);
  box-shadow:inset 0 0 0 1px var(--v-500);
}

.ck-dias{
  display:flex;gap:7px;overflow-x:auto;padding-bottom:4px;
  scrollbar-width:none;-ms-overflow-style:none;
}
.ck-dias::-webkit-scrollbar{ display:none; }
.ck-dia{
  flex-shrink:0;padding:9px 13px;border-radius:10px;cursor:pointer;font-family:inherit;
  font-size:12px;font-weight:800;color:#6b7266;white-space:nowrap;
  background:#fbfdfb;border:1px solid rgba(6,42,28,.12);
  transition:background .18s ease,border-color .18s ease,color .18s ease;
}
.ck-dia.ativo{ background:var(--v-600);border-color:var(--v-600);color:#fff; }

.ck-slots{ display:flex;flex-direction:column;gap:7px; }
.ck-slot{
  display:flex;align-items:center;gap:10px;text-align:left;
  padding:11px 14px;border-radius:11px;cursor:pointer;font-family:inherit;width:100%;
  background:#fbfdfb;border:1px solid rgba(6,42,28,.12);
  transition:background .18s ease,border-color .18s ease;
}
.ck-slot:hover{ border-color:rgba(31,157,97,.4); }
.ck-slot.ativo{ background:var(--v-100);border-color:var(--v-500);box-shadow:inset 0 0 0 1px var(--v-500); }
.ck-slot b{ font-size:13px;font-weight:800;color:var(--v-800);min-width:62px; }
.ck-slot span{ font-size:12px;color:#6b7266;flex:1; }

.ck-slot em{
  font-style:normal;font-size:10.5px;font-weight:800;color:#b07d10;
  background:#fff5e0;padding:3px 8px;border-radius:99px;
}

.ck-nota{
  font-size:11.5px;line-height:1.55;color:#7e8a81;
  padding:10px 12px;border-radius:10px;background:var(--v-100);
}

.sac-alerta{
  font-size:12px;line-height:1.5;color:#b07d10;
  background:#fff5e0;border:1px solid rgba(176,125,16,.2);
  padding:10px 12px;border-radius:10px;margin-bottom:10px;
}
.btn-verde:disabled{
  opacity:.45;cursor:not-allowed;transform:none;box-shadow:none;filter:grayscale(.3);
}

.mp-obs{ margin-top:18px;display:flex;flex-direction:column;gap:7px; }
.mp-obs label{ font-size:12px;font-weight:800;color:var(--v-700); }
.mp-obs textarea{
  width:100%;padding:11px 13px;border-radius:11px;font-family:inherit;font-size:13px;
  background:#fbfdfb;border:1px solid rgba(6,42,28,.12);resize:vertical;
}
.mp-obs textarea:focus{
  outline:none;border-color:var(--v-500);box-shadow:0 0 0 3px rgba(31,157,97,.14);
}

.card-selo{
  font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  padding:3px 8px;border-radius:99px;background:var(--v-100);color:var(--v-600);
}
.card-selo.esgotado{ background:#fdeceb;color:#b42318; }
.card-destaque.esgotado,.card-horizontal.esgotado{ opacity:.5;cursor:default; }
.card-destaque.esgotado:hover,.card-horizontal.esgotado:hover{ transform:none;box-shadow:none; }

.aviso-categoria{
  font-size:12.5px;line-height:1.55;color:var(--v-700);
  background:linear-gradient(180deg,var(--v-100),#f6fcf9);
  border:1px solid rgba(31,157,97,.18);
  padding:11px 14px;border-radius:12px;margin-bottom:14px;
}

.busca-wrapper,.header-fixo-busca{ position:relative; }

.busca-drop{
  position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:120;
  max-height:min(60vh,380px);overflow-y:auto;padding:6px;
  border-radius:14px;background:#fff;
  border:1px solid rgba(6,42,28,.09);
  box-shadow:0 2px 6px rgba(6,42,28,.06), 0 22px 50px -14px rgba(6,42,28,.30);
  opacity:0;visibility:hidden;transform:translateY(-8px) scale(.98);
  transform-origin:top center;
  transition:opacity .2s ease, transform .22s cubic-bezier(.22,1,.36,1), visibility .22s;
}
.busca-drop.aberto{ opacity:1;visibility:visible;transform:none; }

.busca-drop.aberto::before{
  content:'';position:absolute;top:-6px;left:26px;
  width:11px;height:11px;transform:rotate(45deg);
  background:#fff;border-radius:2px 0 0 0;
  border-top:1px solid rgba(6,42,28,.09);
  border-left:1px solid rgba(6,42,28,.09);
}

.bd-item{
  display:flex;align-items:center;gap:11px;width:100%;text-align:left;
  padding:8px 10px;border-radius:10px;cursor:pointer;font-family:inherit;
  background:none;border:none;transition:background .15s ease;
}
.bd-item:hover{ background:var(--v-100); }
.bd-img{
  width:42px;height:42px;flex-shrink:0;border-radius:10px;overflow:hidden;
  background:var(--v-100);display:grid;place-items:center;font-size:20px;
}
.bd-img img{ width:100%;height:100%;object-fit:cover; }
.bd-txt{ flex:1;min-width:0;display:flex;flex-direction:column;gap:1px; }
.bd-txt b{ font-size:13px;font-weight:800;color:var(--v-800);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.bd-txt em{ font-style:normal;font-size:11.5px;color:#8a9189;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.bd-val{ font-size:13px;font-weight:800;color:var(--v-600);flex-shrink:0; }
.bd-vazio{ padding:16px 12px;text-align:center;font-size:12.5px;color:#8a9189; }

.cat-paginas{ position:relative; }
.cat-pagina.ativa{
  animation:catTroca .34s cubic-bezier(.22,1,.36,1) both;
}
@keyframes catTroca{
  from{ opacity:0;transform:translateY(10px) }
  to  { opacity:1;transform:none }
}
.lista-produtos > *{
  animation:catItem .38s cubic-bezier(.22,1,.36,1) both;
}

.lista-produtos > *:nth-child(1){ animation-delay:.02s }
.lista-produtos > *:nth-child(2){ animation-delay:.05s }
.lista-produtos > *:nth-child(3){ animation-delay:.08s }
.lista-produtos > *:nth-child(4){ animation-delay:.11s }
.lista-produtos > *:nth-child(5){ animation-delay:.14s }
@keyframes catItem{
  from{ opacity:0;transform:translateY(12px) }
  to  { opacity:1;transform:none }
}
@media (prefers-reduced-motion: reduce){
  .cat-pagina.ativa,.lista-produtos > *{ animation:none; }
}

@media(max-width:900px){
  .busca-drop{ display:none; }
}

.lista-produtos{
  display:grid;grid-template-columns:1fr;gap:14px;
}
@media(min-width:901px){
  .lista-produtos{ grid-template-columns:1fr 1fr;gap:16px; }
  .card-horizontal{ height:100%; }
}
@media(max-width:900px){
  .lista-produtos{ gap:12px;padding:0 2px; }
  .cat-paginas{ padding-top:4px; }
  .aviso-categoria{ margin-bottom:12px; }
}

.cat-abas-trilho{ position:relative; }
.cat-regua{ position:absolute;left:0;bottom:0;height:3px; }

@media(max-width:900px){
  .loja-painel{
    grid-template-columns:1fr;
    grid-template-areas:"id" "local" "conta";
  }
  .loja-local{ grid-area:local; }
  .perfil-conta{
    grid-area:conta;
    justify-content:center;
    padding:13px 16px 14px;
    border-top:1px solid rgba(180,125,16,.18);
    background:linear-gradient(180deg,#fff4d6 0%,#ffeab4 100%);
  }
  .perfil-conta .conta-entrar,
  .perfil-conta .conta-btn{
    color:#7a5407;font-size:13px;letter-spacing:.02em;
  }
  .perfil-conta .conta-entrar:hover,
  .perfil-conta .conta-btn:hover{ color:#5c3f05; }
  .perfil-conta .conta-btn::before{ background:#0f9d58; }
  .perfil-conta .conta-seta{ opacity:.6; }
  .loja-painel{
    background:linear-gradient(180deg,#ffffff 0%,#fbfdfb 100%);
  }
}

.frete-lista{ display:flex;flex-direction:column;gap:2px; }
.frete-linha{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:11px 0;border-bottom:1px dashed rgba(6,42,28,.10);
}
.frete-linha:last-child{ border-bottom:none; }
.frete-local b{ display:block;font-size:13px;font-weight:800;color:var(--v-800); }
.frete-local em{ font-style:normal;font-size:11.5px;color:#8a9189; }
.frete-valor{ font-size:14px;font-weight:800;color:var(--v-600);white-space:nowrap; }

.frete-gratis{
  margin-top:12px;padding:10px 13px;border-radius:10px;
  font-size:12px;line-height:1.5;color:var(--v-700);
  background:var(--v-100);border:1px solid rgba(31,157,97,.18);
}
.frete-gratis b{ font-weight:800; }

.frete-retirada{
  display:flex;align-items:center;gap:12px;margin-top:12px;
  padding:12px 14px;border-radius:12px;
  background:linear-gradient(180deg,#fff8e6,#fffdf7);
  border:1px solid rgba(180,125,16,.20);
}
.frete-retirada-ico{ font-size:22px;flex-shrink:0; }
.frete-retirada b{ display:block;font-size:13px;font-weight:800;color:#7a5407; }
.frete-retirada em{ font-style:normal;font-size:11.5px;color:#9a7a35; }

.loja-frete{
  display:none;align-items:center;gap:10px;text-align:left;
  font-family:inherit;background:none;border:none;cursor:pointer;min-width:0;
}
.loja-frete-ico{ font-size:19px;flex-shrink:0; }
.loja-frete-txt{ display:flex;flex-direction:column;gap:1px;min-width:0; }
.loja-frete-txt b{ font-size:12.5px;font-weight:800;color:#7a5407;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.loja-frete-txt em{ font-style:normal;font-size:10.5px;color:#9a7a35; }

@media(max-width:900px){
  .loja-painel{
    grid-template-columns:1fr auto;
    grid-template-areas:"id id" "local local" "frete conta";
  }
  .loja-frete{
    display:flex;grid-area:frete;
    padding:12px 6px 13px 16px;
    border-top:1px solid rgba(180,125,16,.18);
    background:linear-gradient(180deg,#fff4d6 0%,#ffeab4 100%);
  }
  .perfil-conta{
    grid-area:conta;justify-content:flex-end;
    padding:12px 16px 13px 6px;
  }
}

.modal-produto-capa{ position:relative; }
/* O X mora NA foto, canto superior direito, e sobe junto com ela.
   Preso no modal ele ficava pendurado sobre o texto na rolagem. */
.modal-produto .modal-fechar{
  position:absolute;top:12px;right:12px;z-index:6;
  width:34px;height:34px;border-radius:50%;
  display:grid;place-items:center;font-size:15px;
  color:#fff;background:rgba(6,42,28,.55);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.22);
  transition:background .18s ease,transform .18s ease;
}
.modal-produto .modal-fechar:hover{ background:rgba(6,42,28,.78);transform:scale(1.06); }
@media(max-width:900px){
  .modal-produto .modal-fechar{ top:12px; }
}

.loja-frete-wrap{ position:relative;min-width:0; }
.loja-frete{
  display:none;align-items:center;gap:10px;text-align:left;width:100%;
  font-family:inherit;background:none;border:none;cursor:pointer;min-width:0;
}
.loja-frete-ico{ font-size:19px;flex-shrink:0; }
.loja-frete-txt{ min-width:0; }
.loja-frete-txt b{
  display:block;font-size:12px;font-weight:800;color:#7a5407;line-height:1.2;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.loja-frete-seta{ color:#9a7a35;flex-shrink:0;transition:transform .22s ease; }
.loja-frete.aberto .loja-frete-seta{ transform:rotate(180deg); }

.frete-drop{
  position:absolute;top:calc(100% + 10px);left:14px;width:min(320px,calc(100vw - 32px));z-index:200;
  padding:14px 16px 16px;border-radius:14px;background:#fff;
  border:1px solid rgba(6,42,28,.09);
  box-shadow:0 2px 6px rgba(6,42,28,.06), 0 22px 50px -14px rgba(6,42,28,.30);
  opacity:0;visibility:hidden;transform:translateY(-8px) scale(.98);
  transform-origin:top left;
  transition:opacity .2s ease, transform .22s cubic-bezier(.22,1,.36,1), visibility .22s;
}
.frete-drop.aberto{ opacity:1;visibility:visible;transform:none; }
.frete-drop::after{
  content:'';position:absolute;top:-6px;left:20px;
  width:11px;height:11px;transform:rotate(45deg);
  background:#fff;border-radius:2px 0 0 0;
  border-top:1px solid rgba(6,42,28,.09);
  border-left:1px solid rgba(6,42,28,.09);
}
.frete-drop-tit{
  font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:#a8ada5;margin-bottom:8px;
}

.conta-item{
  width:100%;text-align:left;font-family:inherit;background:none;border:none;cursor:pointer;
}
.conta-admin{
  margin-top:6px;
  border:1px solid rgba(31,157,97,.35);
  background:linear-gradient(180deg,var(--v-100),#f6fcf9);
}
.conta-admin b{ color:var(--v-700); }
.conta-admin:hover{ border-color:var(--v-500);background:#ddf1e6; }

.pf-rot{
  font-size:11.5px;font-weight:800;color:var(--v-700);
  margin-top:4px;display:block;
}

.card-destaque .card-desc{
  min-height:2.9em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.card-destaque .card-titulo{
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;
}

@media(max-width:900px){
  .loja-painel{
    grid-template-columns:1fr auto;
    grid-template-areas:"id id" "local local" "frete conta";
  }
  /* A faixa é UMA linha. Os dois lados têm a mesma altura e o
     mesmo fundo, então ela lê como uma barra só — foi a segunda
     linha de texto no frete que tinha engordado tudo. */
  .loja-frete-wrap{
    grid-area:frete;display:flex;align-items:center;min-width:0;
    height:46px;padding:0 4px 0 14px;
    border-top:1px solid rgba(180,125,16,.18);
    background:linear-gradient(180deg,#fff4d6 0%,#ffeab4 100%);
  }
  /* A seta gruda no texto do frete. Com o texto em flex:1 ela ia
     pro fim da célula e parecia pertencer ao botão da conta. */
  .loja-frete{ display:flex;gap:7px;padding:0;justify-content:flex-start; }
  .loja-frete-ico{ font-size:16px; }
  .perfil-conta{
    grid-area:conta;justify-content:flex-end;align-items:center;
    height:46px;padding:0 14px 0 4px;
    border-top:1px solid rgba(180,125,16,.18);
    background:linear-gradient(180deg,#fff4d6 0%,#ffeab4 100%);
  }
  .perfil-conta .conta-entrar,
  .perfil-conta .conta-btn{ font-size:12px;white-space:nowrap; }
}

/* RODAPÉ */
.rodape{
  position:relative;margin-top:56px;color:#cfe6d8;
  background:linear-gradient(160deg,#06251a 0%,#0a3b28 55%,#0d4a30 100%);
}
.rodape-topo{
  height:3px;
  background:linear-gradient(90deg,var(--v-700) 0%,var(--v-500) 34%,var(--v-300) 58%,var(--v-500) 100%);
}
.rodape::after{
  content:'';position:absolute;inset:3px 0 0;pointer-events:none;
  background:radial-gradient(70% 100% at 12% 0%, rgba(55,192,126,.16), transparent 62%);
}

.rodape-corpo{
  position:relative;z-index:1;
  max-width:1280px;margin:0 auto;padding:44px 28px 30px;
  display:grid;grid-template-columns:1.5fr 1fr 1.3fr 1fr;gap:38px;
}

.rodape-logo{
  width:52px;height:52px;border-radius:14px;object-fit:cover;
  border:2px solid rgba(255,255,255,.14);margin-bottom:12px;
}
.rodape-nome{
  font-family:'Fraunces','Nunito',serif;font-optical-sizing:auto;
  font-size:26px;font-weight:700;letter-spacing:-.02em;color:#fff;margin-bottom:9px;
}
.rodape-frase{ font-size:12.5px;line-height:1.7;color:#9fc4ae;max-width:290px; }
.rodape-zap{
  display:inline-flex;align-items:center;gap:8px;margin-top:16px;
  padding:10px 16px;border-radius:11px;text-decoration:none;
  font-size:12.5px;font-weight:800;color:#06251a;
  background:linear-gradient(180deg,var(--v-300),var(--v-400));
  box-shadow:0 8px 20px -8px rgba(55,192,126,.5);
  transition:transform .18s cubic-bezier(.22,1,.36,1),box-shadow .18s ease;
}
.rodape-zap:hover{ transform:translateY(-1px);box-shadow:0 12px 26px -8px rgba(55,192,126,.6); }

.rodape-tit{
  font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:var(--v-300);margin-bottom:14px;
}

.rodape-estado{
  display:inline-flex;align-items:center;gap:8px;margin-bottom:14px;
  padding:6px 13px;border-radius:99px;font-size:12px;font-weight:800;
}
.rodape-estado i{ width:7px;height:7px;border-radius:50%;background:currentColor; }
.rodape-estado.on {
  color:#a7f3cf;background:rgba(55,192,126,.14);border:1px solid rgba(55,192,126,.3);
}
.rodape-estado.on i{ animation:pulsoPonto 2.4s cubic-bezier(.4,0,.6,1) infinite; }
.rodape-estado.off{
  color:#ffb4ab;background:rgba(239,68,68,.14);border:1px solid rgba(239,68,68,.3);
}

.rodape-lista{ list-style:none;display:flex;flex-direction:column;gap:1px; }
.rodape-lista li{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:7px 0;font-size:12.5px;color:#9fc4ae;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.rodape-lista li:last-child{ border-bottom:none; }
.rodape-lista li b{ font-weight:700;color:#e6f5ec;white-space:nowrap; }
.rodape-lista li em{
  display:block;font-style:normal;font-size:10.5px;color:#6f9b83;margin-top:1px;
}
/* o dia de hoje puxado pra frente: é a linha que se foi ler */
.rodape-lista li.agora{ color:var(--v-300); }
.rodape-lista li.agora b{ color:var(--v-300); }
.rodape-lista li.destaque b{ color:#a7f3cf; }

.rodape-regra{ display:flex;gap:11px;margin-bottom:16px; }
.rodape-regra:last-child{ margin-bottom:0; }
.rodape-regra-ico{
  font-size:17px;flex-shrink:0;width:34px;height:34px;border-radius:10px;
  display:grid;place-items:center;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);
}
.rodape-regra b{ display:block;font-size:12.5px;font-weight:800;color:#e6f5ec;margin-bottom:3px; }
.rodape-regra em{ font-style:normal;font-size:11.5px;line-height:1.6;color:#8fb8a1; }

.rodape-mapa{
  display:inline-flex;align-items:center;gap:7px;margin-top:14px;
  font-size:11.5px;color:#9fc4ae;text-decoration:none;line-height:1.4;
  transition:color .18s ease;
}
.rodape-mapa svg{ color:var(--v-400);flex-shrink:0; }
.rodape-mapa:hover{ color:#fff; }

.rodape-pe{
  position:relative;z-index:1;border-top:1px solid rgba(255,255,255,.08);
  max-width:1280px;margin:0 auto;padding:16px 28px 20px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  font-size:11.5px;color:#7ea992;
}
.rodape-links{ display:flex;gap:5px;flex-wrap:wrap; }
.rodape-links button{
  padding:6px 12px;border-radius:8px;cursor:pointer;font-family:inherit;
  font-size:11.5px;font-weight:700;color:#9fc4ae;background:none;border:none;
  transition:background .18s ease,color .18s ease;
}
.rodape-links button:hover{ background:rgba(255,255,255,.07);color:#fff; }

@media(max-width:1100px){
  .rodape-corpo{ grid-template-columns:1fr 1fr;gap:30px; }
  .rodape-frase{ max-width:none; }
}
@media(max-width:640px){
  .rodape{ margin-top:36px; }
  .rodape-corpo{ grid-template-columns:1fr;gap:26px;padding:32px 18px 24px; }
  .rodape-nome{ font-size:23px; }
  .rodape-pe{
    flex-direction:column-reverse;align-items:flex-start;gap:12px;padding:14px 18px 18px;
  }
  .rodape-links{ margin-left:-12px; }
}

.mp-minimo{
  display:flex;flex-direction:column;gap:3px;
  margin:0 0 18px;padding:12px 14px;border-radius:12px;
  background:linear-gradient(180deg,var(--v-100),#f6fcf9);
  border:1px solid rgba(31,157,97,.2);
}
.mp-minimo b{ font-size:13px;font-weight:800;color:var(--v-700); }
.mp-minimo span{ font-size:11.5px;line-height:1.55;color:#7e8a81; }

.frete-gratis{
  display:flex;align-items:center;gap:7px;flex-wrap:wrap;
  margin:14px 0 0;padding:11px 13px;border-radius:11px;
  font-size:12px;line-height:1.5;color:#7a5407;
  background:linear-gradient(180deg,#fff8e6,#fffdf7);
  border:1px solid rgba(180,125,16,.22);
}
.frete-gratis b{ font-weight:800; }
.frete-gratis em{
  font-style:normal;font-size:10.5px;font-weight:800;letter-spacing:.03em;
  text-transform:uppercase;padding:3px 8px;border-radius:99px;
  background:rgba(180,125,16,.14);color:#8a6209;
}
.frete-lista + .frete-gratis{ margin-top:16px; }

.loja-frete-wrap.promo .loja-frete-txt b,
.box-calcular.promo .box-calcular-titulo{ color:#8a6209; }

.produto-img.sem-foto,
.produto-img-modal.sem-foto,
.sac-img img.sem-foto{
  object-fit:contain;padding:14%;opacity:.5;transform:none!important;
  background:var(--v-100);
}

.ck-dia{
  display:flex;flex-direction:column;align-items:flex-start;gap:1px;
  min-width:74px;padding:9px 13px;
}
.ck-dia b{ font-size:12.5px;font-weight:800;line-height:1.2; }
.ck-dia span{ font-size:10.5px;opacity:.75; }
.ck-dia-outro{ border-style:dashed; }
.ck-calendario{
  position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;
}

.ck-retirada{ display:flex;align-items:center;gap:12px; }
.ck-retirada-txt{ flex:1;min-width:0; }
.ck-retirada-txt b{ display:block;font-size:13px;font-weight:800;color:var(--v-800);line-height:1.35; }
.ck-retirada-txt em{ font-style:normal;font-size:11.5px;color:#7e8a81; }
.ck-copiar{
  display:inline-flex;align-items:center;gap:6px;flex-shrink:0;
  padding:9px 13px;border-radius:10px;cursor:pointer;font-family:inherit;
  font-size:12px;font-weight:800;color:var(--v-600);
  background:var(--v-100);border:1px solid rgba(31,157,97,.25);
  transition:background .18s ease,color .18s ease;
}
.ck-copiar:hover{ background:#ddf1e6; }
.ck-copiar.ok{ background:var(--v-500);color:#fff;border-color:var(--v-500); }

.pix-topo{ text-align:center;padding:4px 0 6px; }
.pix-topo b{ display:block;font-size:15px;font-weight:800;color:var(--v-800);margin-bottom:4px; }
.pix-topo span{ font-size:12.5px;line-height:1.55;color:#7e8a81; }
.pix-qr{
  display:grid;place-items:center;padding:16px;border-radius:16px;
  background:#fff;border:1px solid rgba(6,42,28,.09);
  box-shadow:0 10px 30px -16px rgba(6,42,28,.4);
}
.pix-qr img{ width:min(240px,60vw);height:auto;display:block; }
.pix-copia label{
  display:block;font-size:11px;font-weight:800;letter-spacing:.06em;
  text-transform:uppercase;color:#a8ada5;margin-bottom:6px;
}
.pix-campo{ display:flex;gap:7px; }
.pix-campo input{
  flex:1;min-width:0;padding:11px 13px;border-radius:11px;font-family:monospace;
  font-size:11.5px;color:var(--v-800);background:#fbfdfb;
  border:1px solid rgba(6,42,28,.12);
}
.pix-campo button{
  flex-shrink:0;padding:0 15px;border-radius:11px;cursor:pointer;font-family:inherit;
  font-size:12px;font-weight:800;color:#fff;border:none;
  background:linear-gradient(180deg,var(--v-500),var(--v-600));
}
.pix-espera{
  display:flex;align-items:center;justify-content:center;gap:9px;
  padding:12px;border-radius:11px;font-size:12.5px;font-weight:700;color:var(--v-700);
  background:var(--v-100);border:1px solid rgba(31,157,97,.18);
}
.pix-bolinha{
  width:9px;height:9px;border-radius:50%;background:var(--v-400);
  animation:pulsoPonto 2.4s cubic-bezier(.4,0,.6,1) infinite;
}

.mp-campo{
  height:44px;padding:0 13px;border-radius:11px;
  background:#fbfdfb;border:1px solid rgba(6,42,28,.12);
}
.mp-campo iframe{ width:100%;height:100%;border:0; }
.mp-linha{ display:grid;grid-template-columns:1fr 1fr;gap:9px; }
.mp-bandeira{
  align-self:flex-start;padding:4px 10px;border-radius:99px;
  font-size:11px;font-weight:800;color:var(--v-600);background:var(--v-100);
}
.conf-cod{ display:block;font-size:12.5px;color:#8a9189;margin-top:2px; }

.ck-prazo{
  display:flex;align-items:center;gap:9px;
  padding:11px 13px;border-radius:11px;
  background:var(--v-100);border:1px solid rgba(31,157,97,.2);
}
.ck-prazo b{ font-size:12.5px;font-weight:800;color:var(--v-700);flex-shrink:0; }
.ck-prazo span{ flex:1;min-width:0;font-size:11.5px;color:#7e8a81;line-height:1.4; }
.ck-prazo em{ font-style:normal;font-size:13px;font-weight:800;color:var(--v-600);flex-shrink:0; }

.ck-resumo{
  display:flex;align-items:center;gap:9px;margin-bottom:11px;
  padding:10px 13px;border-radius:11px;
  background:linear-gradient(180deg,#fff8e6,#fffdf7);
  border:1px solid rgba(180,125,16,.2);
}
.ck-resumo span{ font-size:11.5px;font-weight:800;color:#8a6209;flex-shrink:0; }
.ck-resumo b{ flex:1;min-width:0;font-size:12.5px;font-weight:800;color:#7a5407;text-align:right; }

/* TRANSIÇÕES DA GAVETA

   A escadinha de entrada roda quando a TELA muda de passo —
   sacola, entrega, pagamento, pronto. Numa troca de quantidade
   ela reanimava tudo e a lista inteira tremia a cada clique;
   por isso o `.sem-entrada`, que o JS liga quando é só repintura
   do mesmo passo. */
.gaveta-corpo:not(.sem-entrada) > *{
  animation:gvEntra .34s cubic-bezier(.22,1,.36,1) both;
}
.gaveta-corpo:not(.sem-entrada) > *:nth-child(2){ animation-delay:.05s }
.gaveta-corpo:not(.sem-entrada) > *:nth-child(3){ animation-delay:.1s  }
.gaveta-corpo:not(.sem-entrada) > *:nth-child(4){ animation-delay:.14s }
.gaveta-corpo:not(.sem-entrada) > *:nth-child(5){ animation-delay:.17s }
@keyframes gvEntra{
  from{ opacity:0;transform:translateY(12px) }
  to  { opacity:1;transform:none }
}
.gaveta-pe > *{ animation:gvSobe .3s cubic-bezier(.22,1,.36,1) both; }
@keyframes gvSobe{
  from{ opacity:0;transform:translateY(8px) }
  to  { opacity:1;transform:none }
}

/* Item saindo: encolhe e some, em vez de sumir de um quadro pro
   outro. O tempo bate com os 220ms que o JS espera. */
.sac-item{
  transition:transform .22s cubic-bezier(.22,1,.36,1),
             box-shadow .22s ease, opacity .22s ease;
}
.sac-item.saindo{
  opacity:0;transform:translateX(28px) scale(.96);pointer-events:none;
}

/* O valor pisca de leve quando muda — é o retorno de que o
   clique no + fez alguma coisa. */
.sac-valor{ transition:color .25s ease,transform .25s cubic-bezier(.22,1,.36,1); }
.sac-qtd button{ transition:background .15s ease,transform .15s cubic-bezier(.22,1,.36,1); }
.sac-qtd button:active{ transform:scale(.86); }
.sac-qtd b{ transition:transform .2s cubic-bezier(.34,1.56,.64,1); }

.sac-total b,.sac-conta b{ transition:color .25s ease; }

.ck-opc,.ck-dia,.ck-slot,.btn-verde,.btn-claro,.ck-copiar,.loja-frete{
  transition:background .22s ease,border-color .22s ease,color .22s ease,
             transform .22s cubic-bezier(.22,1,.36,1),box-shadow .22s ease;
}
.ck-opc:active,.ck-dia:active,.ck-slot:active{ transform:scale(.97); }
.btn-verde:active,.btn-claro:active{ transform:scale(.985); }

@media (prefers-reduced-motion: reduce){
  .gaveta-corpo > *,.gaveta-pe > *{ animation:none; }
  .sac-item.saindo{ transition:none; }
}

.sac-mudou{
  display:flex;flex-direction:column;gap:5px;
  padding:13px 15px;border-radius:12px;margin-bottom:4px;
  background:linear-gradient(180deg,#fff8e6,#fffdf7);
  border:1px solid rgba(180,125,16,.25);
}
.sac-mudou b{ font-size:12.5px;font-weight:800;color:#7a5407; }
.sac-mudou span{ font-size:11.5px;line-height:1.5;color:#8a6209; }
.sac-mudou button{
  align-self:flex-start;margin-top:6px;
  padding:6px 13px;border-radius:8px;cursor:pointer;font-family:inherit;
  font-size:11.5px;font-weight:800;color:#7a5407;
  background:rgba(180,125,16,.14);border:none;
  transition:background .18s ease;
}
.sac-mudou button:hover{ background:rgba(180,125,16,.24); }

.produto-img-modal.ampliavel,#mpImg img.ampliavel{ cursor:zoom-in; }

/* Lightbox: a foto sem corte, fundo escuro, fecha em qualquer
   lugar. Sem biblioteca — é uma imagem e um overlay. */
.lightbox{
  position:fixed;inset:0;z-index:1400;
  display:grid;place-items:center;padding:24px;
  background:rgba(4,29,19,.88);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  opacity:0;visibility:hidden;cursor:zoom-out;
  transition:opacity .24s ease,visibility .24s;
}
.lightbox.aberto{ opacity:1;visibility:visible; }
.lightbox img{
  max-width:min(920px,100%);max-height:86vh;
  border-radius:14px;object-fit:contain;
  box-shadow:0 30px 80px -20px rgba(0,0,0,.7);
  transform:scale(.96);transition:transform .3s cubic-bezier(.22,1,.36,1);
}
.lightbox.aberto img{ transform:none; }
.lightbox-x{
  position:absolute;top:18px;right:18px;
  width:40px;height:40px;border-radius:50%;
  display:grid;place-items:center;cursor:pointer;font-size:16px;
  color:#fff;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.24);
  transition:background .18s ease;
}
.lightbox-x:hover{ background:rgba(255,255,255,.26); }

/* IMPRESSÃO
   O corte vinha do container com altura fixa e overflow: a folha
   herdava a caixa da tela em vez de crescer com o conteúdo. */


.ck-rot{
  display:block;font-size:11px;font-weight:800;color:var(--v-700);
  margin:10px 0 4px;
}
.ck-bloco .ck-rot:first-child{ margin-top:0; }

/* Rodapé: regras sem ícone, e a assinatura. */
.rodape-regra{ display:block;margin-bottom:14px; }
.rodape-regra b{ display:block;font-size:13px;font-weight:800;color:#e6f5ec;margin-bottom:3px; }
.rodape-regra em{ font-style:normal;font-size:11.5px;line-height:1.6;color:#8fb8a1; }

.rodape-coudfy{
  display:flex;flex-direction:column;gap:1px;text-decoration:none;
  padding:6px 12px;border-radius:9px;margin-right:auto;
  transition:background .18s ease;
}
.rodape-coudfy:hover{ background:rgba(255,255,255,.06); }
.rodape-coudfy b{ font-size:14px;font-weight:800;letter-spacing:-.02em;color:#fff; }
.rodape-coudfy b i{ font-style:normal;color:#4da3ff; }
.rodape-coudfy span{ font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:#6f9b83; }

/* Sugestão de bebida no fim do modal do produto. */
.mp-bebidas{ margin-top:20px;padding-top:18px;border-top:1px solid rgba(6,42,28,.08); }
.mp-beb-tit{ font-size:13px;font-weight:800;color:var(--v-800);margin-bottom:10px; }
.mp-beb-lista{ display:flex;flex-direction:column;gap:7px; }
.mp-beb{
  display:flex;align-items:center;gap:11px;width:100%;padding:9px 12px 9px 9px;
  border-radius:12px;cursor:pointer;font-family:inherit;text-align:left;
  background:#fbfdfb;border:1px solid rgba(6,42,28,.09);
  transition:border-color .18s ease,background .18s ease,transform .18s cubic-bezier(.22,1,.36,1);
}
.mp-beb:hover{ border-color:var(--v-400);background:var(--v-100); }
.mp-beb:active{ transform:scale(.985); }
.mp-beb.add{ border-color:var(--v-500);background:var(--v-100); }
.mp-beb.add .mp-beb-mais::after{ content:'✓'; }
.mp-beb-img{
  width:44px;height:44px;border-radius:9px;overflow:hidden;flex-shrink:0;
  background:var(--v-100);display:grid;place-items:center;
}
.mp-beb-img img{ width:100%;height:100%;object-fit:cover; }
.mp-beb-img img.sem-foto{ object-fit:contain;padding:8px;opacity:.5; }
.mp-beb-txt{ flex:1;min-width:0; }
.mp-beb-txt b{ display:block;font-size:12.5px;font-weight:700;color:var(--v-800); }
.mp-beb-txt span{ font-size:12px;font-weight:700;color:var(--v-600); }
.mp-beb-mais{
  width:26px;height:26px;border-radius:50%;flex-shrink:0;
  display:grid;place-items:center;font-style:normal;font-size:15px;font-weight:700;
  color:#fff;background:var(--v-500);
}
.mp-beb-mais::after{ content:'+'; }
.mp-beb.add .mp-beb-mais{ font-size:12px; }

/* IMPRESSÃO — mesma folha na vitrine e no painel. */
.imp-topo{ text-align:center;margin-bottom:14px; }
.imp-topo b{ display:block;font-size:19px;font-weight:800;letter-spacing:-.02em; }
.imp-topo span{ font-size:11px; }
.imp-pedido{
  text-align:center;font-size:13px;font-weight:800;letter-spacing:.04em;
  text-transform:uppercase;padding:7px 0;margin-bottom:12px;
  border-top:1px solid #000;border-bottom:1px solid #000;
}
.imp-dados{ margin-bottom:14px; }
.imp-dados div{ display:flex;justify-content:space-between;gap:14px;font-size:11.5px;padding:2px 0; }
.imp-dados span{ color:#555; }
.imp-dados b{ text-align:right;font-weight:700; }
.imp-tit{
  font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  padding-bottom:4px;margin-bottom:7px;border-bottom:1px solid #999;
}
.imp-item{ display:flex;justify-content:space-between;gap:14px;padding:4px 0;font-size:12px; }
.imp-item-nome small{ display:block;font-size:10.5px;color:#555; }
.imp-item-val{ white-space:nowrap;font-weight:700; }
.imp-contas{ margin-top:10px;padding-top:8px;border-top:1px solid #999; }
.imp-contas div{ display:flex;justify-content:space-between;font-size:12px;padding:2px 0; }
.imp-total{
  display:flex;justify-content:space-between;align-items:baseline;
  font-size:15px;font-weight:800;margin-top:6px;padding-top:7px;border-top:2px solid #000;
}
.imp-obs{ margin-top:12px;font-size:11.5px; }
.imp-obs b{ display:block;font-size:10px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:3px; }
.imp-rodape{ margin-top:18px;text-align:center;font-size:10.5px; }

/* ══ IMPRESSÃO ═════════════════════════════════════════════
   UM bloco só. Antes havia três empilhados e o último anulava
   os anteriores — foi por isso que a folha saía com o painel
   inteiro junto. */
@media print{
  @page{ size:auto;margin:12mm 10mm; }

  html,body{
    height:auto !important;min-height:0 !important;overflow:visible !important;
    margin:0 !important;padding:0 !important;background:#fff !important;
  }
  /* A folha nao e filha direta do body — ela mora dentro do
     wrapper da pagina. `body > *` escondia ela junto, e o
     navegador imprimia a tela inteira. Esconder por visibilidade
     e reexibir so a folha funciona em qualquer profundidade. */
  body *{ visibility:hidden !important; }
  #folha-impressao, #folha-impressao *{ visibility:visible !important; }
  #folha-impressao{
    position:absolute !important;left:0 !important;top:0 !important;
    width:100% !important;
  }
  #folha-impressao{
    display:block !important;
    width:auto !important;max-width:none !important;height:auto !important;
    overflow:visible !important;margin:0;padding:0;
    color:#000;background:#fff;font-size:12px;line-height:1.5;
  }
  #folha-impressao *{
    color:#000 !important;background:none !important;
    box-shadow:none !important;overflow:visible !important;
    max-height:none !important;height:auto !important;
    float:none !important;
  }

  .imp-topo{ text-align:center;margin-bottom:14px; }
  .imp-topo b{ display:block;font-size:19px;font-weight:800;letter-spacing:-.02em; }
  .imp-topo span{ font-size:11px; }
  .imp-pedido{
    text-align:center;font-size:13px;font-weight:800;letter-spacing:.04em;
    text-transform:uppercase;padding:7px 0;margin-bottom:12px;
    border-top:1px solid #000 !important;border-bottom:1px solid #000 !important;
  }
  .imp-dados{ margin-bottom:14px; }
  .imp-dados div{ display:flex;justify-content:space-between;gap:14px;font-size:11.5px;padding:2px 0; }
  .imp-dados b{ text-align:right;font-weight:700; }
  .imp-tit{
    font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
    padding-bottom:4px;margin-bottom:7px;border-bottom:1px solid #999 !important;
  }
  .imp-item{ display:flex;justify-content:space-between;gap:14px;padding:4px 0;font-size:12px;
             page-break-inside:avoid; }
  .imp-item-nome small{ display:block;font-size:10.5px; }
  .imp-item-val{ white-space:nowrap;font-weight:700; }
  .imp-contas{ margin-top:10px;padding-top:8px;border-top:1px solid #999 !important; }
  .imp-contas div{ display:flex;justify-content:space-between;font-size:12px;padding:2px 0; }
  .imp-total{
    display:flex;justify-content:space-between;font-size:15px;font-weight:800;
    margin-top:6px;padding-top:7px;border-top:2px solid #000 !important;
  }
  .imp-obs{ margin-top:12px;font-size:11.5px;page-break-inside:avoid; }
  .imp-obs b{ display:block;font-size:10px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:3px; }
  .imp-rodape{ margin-top:18px;text-align:center;font-size:10.5px; }
}