/* (2026-11-03) distrib-app: loja no estilo do app mandado pelo dono (vermelho, preto e cartões brancos) */
:root { --da-red: #E30613; --da-red2: #B30010; --da-preto: #0B0B0C; --da-fundo: #F1F1F3; --da-txt: #1B1B1D; --da-cinza: #6E6E73; --da-borda: #E6E6EA; }

/* esconde a loja antiga do template (mesma lista do bobs_ifood) */
html:has(.da-page), body:has(.da-page) { background: var(--da-fundo) !important; }
body:has(.da-page) { padding-top: 0 !important; }
body:has(.da-page) .navbar.fixed-top, body:has(.da-page) #slider, body:has(.da-page) #area_busca,
body:has(.da-page) section#categoria, body:has(.da-page) #promocao, body:has(.da-page) #combo,
body:has(.da-page) .rodape, body:has(.da-page) footer, body:has(.da-page) .busca-topo-wrap,
body:has(.da-page) .status-delivery-topo, body:has(.da-page) .img-aberto,
body:has(.da-page) #botao-instalar, body:has(.da-page) .scroll-top, body:has(.da-page) .cnpj-legal { display: none !important; }
body:has(.da-page) .main-container > :not(.da-page):not(script):not(style):not(link) { display: none !important; }
body:has(.da-page) .main-container { margin: 0 !important; padding: 0 !important; background: var(--da-fundo) !important; max-width: none !important; }

.da-page { font-family: Roboto, "Segoe UI", Arial, sans-serif; color: var(--da-txt); min-height: 100vh; padding-bottom: calc(78px + env(safe-area-inset-bottom)); -webkit-tap-highlight-color: transparent; }
.da-page button { font-family: inherit; cursor: pointer; }
.da-page [hidden] { display: none !important; }

.da-page h1, .da-page h2, .da-page h3, body:has(.da-page) #cat-lateral-body, body:has(.da-page) #cat-lateral-body h5, body:has(.da-page) #cat-lateral-body p { font-family: Roboto, "Segoe UI", Arial, sans-serif !important; }

/* topo */
.da-topo { position: sticky; top: 0; z-index: 50; display: flex; align-items: center; gap: 8px; height: calc(64px + env(safe-area-inset-top)); padding: env(safe-area-inset-top) 10px 0; background: var(--da-preto); color: #fff; }
.da-topo__btn { position: relative; flex: none; width: 44px; height: 44px; display: grid; place-items: center; border: 0; background: none; color: #fff; font-size: 26px; text-decoration: none; }
.da-topo__btn:hover { color: #fff; }
.da-topo__logo { flex: 1; display: flex; justify-content: center; }
.da-topo__logo img { height: 46px; width: auto; display: block; }
.da-topo__tit { flex: 1; margin: 0; text-align: center; font-size: 19px; font-weight: 700; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.da-qtd { position: absolute; top: 2px; right: 0; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 10px; background: var(--da-red); color: #fff; font-size: 11.5px; font-weight: 700; display: grid; place-items: center; line-height: 1; }
.da-page[data-view="home"] .da-nao-home, .da-page:not([data-view="home"]) .da-so-home { display: none !important; }
.da-fechada { background: #2A2A2D; color: #fff; text-align: center; padding: 9px 12px; font-size: 14px; font-weight: 500; }

/* busca (fica abaixo do topo na Início e no resultado da busca) e banner */
.da-buscaw { padding: 0 12px 12px; background: var(--da-preto); }
.da-page[data-view="cats"] .da-buscaw, .da-page[data-view="lista"]:not([data-filtro="busca"]) .da-buscaw { display: none; }
.da-page[data-view="lista"] .da-buscaw { position: sticky; top: calc(64px + env(safe-area-inset-top)); z-index: 30; padding-top: 4px; }
.da-busca { display: flex; align-items: center; gap: 10px; margin: 0 12px; padding: 0 16px; height: 48px; border-radius: 14px; background: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.18); cursor: text; }
.da-busca i { font-size: 18px; color: var(--da-txt); }
.da-busca input { flex: 1; min-width: 0; height: 100%; margin: 0 !important; padding: 0 !important; border: 0 !important; outline: 0; box-shadow: none !important; background: transparent !important; font: 400 16px Roboto, "Segoe UI", Arial, sans-serif !important; font-style: normal !important; color: var(--da-txt); }
.da-busca input::-webkit-search-cancel-button { cursor: pointer; }
.da-topo__logo img { mix-blend-mode: lighten; }
.da-busca input::placeholder { color: #55555A; }
.da-hero { position: relative; margin: 0; aspect-ratio: 828 / 525; overflow: hidden; background: #8B0000; }
.da-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .6s ease; cursor: pointer; }
.da-hero__img--on { opacity: 1; }

/* categorias */
.da-cats { display: grid; gap: 8px; }
.da-cats--home { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 10px 10px 4px; background: #fff; margin-top: -14px; position: relative; border-radius: 16px 16px 0 0; }
.da-cat { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 8px 6px 10px; border: 1px solid var(--da-borda); border-radius: 14px; background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.06); color: var(--da-txt); min-width: 0; }
.da-cat__img { width: 100%; aspect-ratio: 1.45; display: grid; place-items: center; overflow: hidden; }
.da-cat__img { border-radius: 10px; }
.da-cat__img img { width: 100%; height: 100%; object-fit: cover; }
.da-cat__img i { font-size: 34px; color: var(--da-red); }
.da-cat__nome { font-size: 13px; font-weight: 600; line-height: 1.15; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.da-view[data-v="cats"] { background: var(--da-preto); min-height: calc(100vh - 64px); padding: 4px 12px 18px; }
.da-cats--grande { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.da-cats--grande .da-cat { border: 0; border-radius: 16px; padding: 12px 10px 14px; }
.da-cats--grande .da-cat__img { aspect-ratio: 1.3; }
.da-cats--grande .da-cat__nome { font-size: 16px; font-weight: 700; }
.da-faixa { display: block; width: 100%; margin-top: 12px; border-radius: 16px; }

/* seções da home */
.da-sec { background: #fff; padding: 12px 0 14px; }
.da-sec + .da-sec { border-top: 8px solid var(--da-fundo); }
.da-sec__tit { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 12px 10px; }
.da-sec__tit h2 { margin: 0; font-size: 19px; font-weight: 800; color: var(--da-txt); letter-spacing: -.2px; }
.da-sec__tit button { flex: none; border: 0; background: none; color: var(--da-red); font-size: 13.5px; font-weight: 600; padding: 4px 0; }
.da-trilho { display: flex; gap: 10px; overflow-x: auto; padding: 2px 12px 6px; scroll-snap-type: x mandatory; scrollbar-width: none; }
.da-trilho::-webkit-scrollbar { display: none; }

/* cartão de produto */
.da-card { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--da-borda); border-radius: 14px; box-shadow: 0 1px 5px rgba(0,0,0,.07); padding: 8px 8px 10px; min-width: 0; }
.da-card--trilho { flex: 0 0 calc((100% - 34px) / 2.15); scroll-snap-align: start; }
.da-card__abre { display: flex; flex-direction: column; flex: 1; padding: 0; border: 0; background: none; text-align: left; color: inherit; }
.da-card__abre img { width: 100%; aspect-ratio: 1; object-fit: contain; display: block; margin-bottom: 6px; }
.da-card__nome { font-size: 14px; font-weight: 500; line-height: 1.25; color: var(--da-txt); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.5em; }
.da-card__preco { margin: 6px 0 8px; font-size: 18px; font-weight: 800; color: var(--da-red); }
.da-card__preco small { font-size: 11px; font-weight: 500; color: var(--da-cinza); }
.da-card__add { display: flex; align-items: center; justify-content: center; gap: 6px; height: 38px; border: 0; border-radius: 10px; background: var(--da-red); color: #fff; font-size: 14.5px; font-weight: 600; box-shadow: 0 3px 8px rgba(227,6,19,.28); }
.da-card__add:active { transform: scale(.97); }
.da-card__add:disabled { background: #C9C9CE; box-shadow: none; }
.da-card__add--ok { background: #16A34A; box-shadow: none; }
.da-card__selo { position: absolute; top: 8px; right: 8px; z-index: 2; padding: 3px 9px; border-radius: 999px; background: var(--da-red); color: #fff; font-size: 12.5px; font-weight: 700; }
.da-card__fav { position: absolute; top: 6px; right: 6px; z-index: 2; width: 34px; height: 34px; border: 0; border-radius: 50%; background: rgba(255,255,255,.9); color: var(--da-txt); font-size: 19px; display: grid; place-items: center; }
.da-card__fav--on { color: var(--da-red); }
.da-card--trilho .da-card__fav, .da-card:has(.da-card__selo) .da-card__fav { display: none; }
.da-grade .da-card .da-card__selo { display: none; }
.da-grade .da-card .da-card__fav { display: grid; }

/* lista */
.da-view[data-v="lista"] { background: #fff; min-height: calc(100vh - 64px); }
.da-chips { position: sticky; top: calc(64px + env(safe-area-inset-top)); z-index: 30; display: flex; gap: 8px; overflow-x: auto; padding: 12px; background: #fff; scrollbar-width: none; }
.da-chips::-webkit-scrollbar { display: none; }
.da-chip { flex: none; padding: 8px 14px; border: 0; border-radius: 10px; background: #F0F0F3; color: var(--da-txt); font-size: 14px; font-weight: 500; white-space: nowrap; }
.da-chip--on { background: var(--da-red); color: #fff; font-weight: 700; }
.da-grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 0 12px 16px; }
.da-vazio { padding: 40px 16px; text-align: center; color: var(--da-cinza); font-size: 15px; }

/* barra de baixo */
.da-nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; display: grid; grid-template-columns: repeat(4, 1fr); padding: 8px 6px max(8px, env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid var(--da-borda); box-shadow: 0 -2px 12px rgba(0,0,0,.06); }
.da-nav__item { display: flex; flex-direction: column; align-items: center; gap: 2px; color: #2B2B2E; text-decoration: none; font-size: 12.5px; }
.da-nav__item i { font-size: 22px; }
.da-nav__item:hover { color: #2B2B2E; }
.da-nav__item--on, .da-nav__item--on:hover { color: var(--da-red); font-weight: 600; }
/* (2026-11-03) distrib-menu-flutuante: no celular fica o menu flutuante original do sistema (pílula), no vermelho da loja */
@media (max-width: 575px) {
	.da-nav { display: none !important; }
	body:has(.da-page) .menu-flutuante-app { display: flex !important; z-index: 60; background: linear-gradient(135deg, #FF2A1A, var(--da-red) 55%, var(--da-red2)) !important; }
	.da-toast { bottom: calc(100px + env(safe-area-inset-bottom)); }
}

/* menu lateral (Conta / hambúrguer) */
.da-menu { position: fixed; inset: 0; z-index: 9000; background: rgba(0,0,0,.5); }
.da-menu__caixa { position: absolute; top: 0; bottom: 0; left: 0; width: min(310px, 84vw); background: #fff; padding: max(18px, env(safe-area-inset-top)) 0 18px; display: flex; flex-direction: column; overflow-y: auto; animation: da-entra .22s ease; }
@keyframes da-entra { from { transform: translateX(-100%); } }
.da-menu__logo { align-self: center; width: 70%; max-width: 210px; border-radius: 12px; background: var(--da-preto); padding: 8px 12px; margin-bottom: 10px; }
.da-menu__status { margin: 0 0 10px; text-align: center; font-size: 14px; font-weight: 600; color: var(--da-red); }
.da-menu__status--on { color: #16A34A; }
.da-menu a { display: flex; align-items: center; gap: 14px; padding: 14px 22px; color: var(--da-txt); text-decoration: none; font-size: 16px; font-weight: 500; border-top: 1px solid #F1F1F3; }
.da-menu a i { font-size: 20px; color: var(--da-red); width: 22px; text-align: center; }
.da-menu__end { margin: 8px 22px 0; font-size: 13px; color: var(--da-cinza); }
.da-menu a.da-menu__painel { margin-top: auto; font-size: 13.5px; color: var(--da-cinza); }
.da-menu a.da-menu__painel i { color: var(--da-cinza); }

.da-toast { position: fixed; left: 50%; bottom: calc(92px + env(safe-area-inset-bottom)); z-index: 9500; transform: translate(-50%, 20px); max-width: calc(100% - 32px); padding: 12px 18px; border-radius: 12px; background: #1B1B1D; color: #fff; font-size: 14.5px; font-weight: 500; box-shadow: 0 6px 20px rgba(0,0,0,.25); opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; }
.da-toast--on { opacity: 1; transform: translate(-50%, 0); }

/* janela do produto (produto_painel.php): página inteira, foto sobre fundo vermelho, cartão branco */
body:has(.da-page) #cat-lateral-overlay { background: rgba(0,0,0,.55) !important; }
body:has(.da-page) #cat-lateral-painel { top: 0 !important; bottom: 0 !important; left: 50% !important; right: auto !important; height: auto !important; width: 100% !important; max-width: 560px !important; transform: translate(-50%, 104%); transition: transform .38s cubic-bezier(.22,.88,.35,1) !important; border-radius: 0; background: #fff !important; box-shadow: none !important; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; }
body:has(.da-page) #cat-lateral-painel.aberto { transform: translate(-50%, 0); }
body:has(.da-page) #cat-lateral-painel > :not(#cat-lateral-body) { display: none !important; }
body:has(.da-page) #cat-lateral-body { padding: 0 !important; background: #fff; color: var(--da-txt); font-family: Roboto, "Segoe UI", Arial, sans-serif; }
body:has(.da-page) #cat-lateral-painel .prod-lateral-topo { position: relative; height: min(52vh, 380px); margin: 0 !important; padding: calc(56px + env(safe-area-inset-top)) 20px 40px !important; display: flex; align-items: center; justify-content: center; background: radial-gradient(ellipse at 50% 75%, #FF2A1A 0%, #C40010 38%, #3A0004 72%, #0B0B0C 100%) !important; border-radius: 0 !important; }
body:has(.da-page) #cat-lateral-painel .prod-lateral-topo::before, body:has(.da-page) #cat-lateral-painel .prod-lateral-topo::after { display: none !important; }
body:has(.da-page) #cat-lateral-painel .prod-lateral-foto { width: auto !important; height: 100% !important; max-width: 100%; max-height: none !important; object-fit: contain; border-radius: 18px; background: transparent; filter: drop-shadow(0 14px 22px rgba(0,0,0,.45)); }
body:has(.da-page) #cat-lateral-painel .bp-loja, body:has(.da-page) #cat-lateral-painel .bp-loja-box { display: none !important; }
body:has(.da-page) #cat-lateral-painel .bp-fechar { position: absolute !important; top: calc(10px + env(safe-area-inset-top)) !important; left: 8px !important; right: auto !important; z-index: 6; width: 44px; height: 44px; border: 0 !important; background: none !important; color: #fff !important; font-size: 26px; box-shadow: none !important; }
body:has(.da-page) #cat-lateral-painel .bp-fechar .bp-ic-cel, body:has(.da-page) #cat-lateral-painel .bp-fechar .bp-ic-web { display: none !important; }
body:has(.da-page) #cat-lateral-painel .bp-fechar::before { content: "\F284"; font-family: "bootstrap-icons" !important; }
body:has(.da-page) #cat-lateral-painel .prod-lateral-info { position: relative; z-index: 2; margin: -26px 0 0 !important; padding: 22px 20px 4px !important; background: #fff !important; border-radius: 24px 24px 0 0; display: flex; flex-direction: column; }
body:has(.da-page) #cat-lateral-painel .prod-lateral-nome { order: 1; margin: 0 0 10px !important; font-size: 23px !important; font-weight: 800 !important; line-height: 1.2 !important; color: var(--da-txt) !important; text-transform: none !important; text-align: left !important; }
body:has(.da-page) #cat-lateral-painel .bp-preco { order: 2; display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; margin: 2px 0 16px !important; font-size: 29px !important; font-weight: 800 !important; color: var(--da-red) !important; }
body:has(.da-page) #cat-lateral-painel #bp_a_partir:empty { display: none; }
body:has(.da-page) #cat-lateral-painel .prod-lateral-obs textarea { min-height: 0; height: 64px; }
body:has(.da-page) #cat-lateral-painel .bp-preco s { order: 2; font-size: 16px; font-weight: 500; color: #8E8E93; }
body:has(.da-page) #cat-lateral-painel .da-selo-prod { order: 3; margin-left: auto; align-self: center; padding: 6px 14px; border-radius: 999px; background: var(--da-red); color: #fff; font-size: 17px; font-weight: 800; }
body:has(.da-page) #cat-lateral-painel .prod-lateral-descricao { order: 3; margin: 0 !important; font-size: 15.5px !important; line-height: 1.45 !important; color: #3A3A3D !important; }
body:has(.da-page) #cat-lateral-painel .prod-lateral-descricao:not(:empty)::before { content: "Descrição"; display: block; margin: 4px 0 6px; font-size: 19px; font-weight: 800; color: var(--da-txt); }
body:has(.da-page) #cat-lateral-painel .bp-grupo { margin: 16px 0 0 !important; padding: 12px 20px !important; background: #F4F4F6 !important; }
body:has(.da-page) #cat-lateral-painel .bp-obrig { background: var(--da-red) !important; color: #fff !important; }
body:has(.da-page) #cat-lateral-painel .prod-lateral-lista-grade { padding: 0 20px !important; }
body:has(.da-page) #cat-lateral-painel .prod-lateral-obs { margin: 16px 20px 0 !important; }
body:has(.da-page) #cat-lateral-painel .prod-lateral-obs textarea { border-radius: 12px; background: #F4F4F6; border: 1px solid var(--da-borda); color: var(--da-txt); }
body:has(.da-page) #cat-lateral-painel #cat-lateral-body .bp-rodape { position: sticky !important; bottom: 0 !important; left: auto !important; right: auto !important; width: auto !important; max-width: none !important; margin: 16px 0 0 !important; padding: 12px 20px max(14px, env(safe-area-inset-bottom)) !important; display: flex; flex-direction: column; align-items: stretch; gap: 12px; background: #fff !important; border-top: 1px solid var(--da-borda); box-shadow: 0 -4px 14px rgba(0,0,0,.06); }
body:has(.da-page) #cat-lateral-painel .bp-qtd { align-self: center; display: flex; align-items: center; gap: 18px; height: auto; border: 0 !important; background: none !important; }
body:has(.da-page) #cat-lateral-painel .bp-qtd button { width: 44px; height: 44px; border: 0; border-radius: 12px; background: #EEF0F4 !important; color: var(--da-txt) !important; font-size: 20px; display: grid; place-items: center; }
body:has(.da-page) #cat-lateral-painel .bp-qtd .prod-lateral-qtd__valor { min-width: 28px; text-align: center; font-size: 20px; font-weight: 700; color: var(--da-txt) !important; }
body:has(.da-page) #cat-lateral-painel #cat-lateral-body .bp-add { flex: none; display: flex; align-items: center; justify-content: center; gap: 10px; height: 54px; border: 0; border-radius: 14px; background: var(--da-red) !important; color: #fff !important; font-size: 17px; font-weight: 700; box-shadow: 0 6px 14px rgba(227,6,19,.3); }
body:has(.da-page) #cat-lateral-painel #cat-lateral-body .bp-add > span:first-child::before { content: "\F5EA"; font-family: "bootstrap-icons"; margin-right: 8px; font-weight: 400; }
body:has(.da-page) #cat-lateral-painel #cat-lateral-body .bp-add > span:first-child::after { content: " ao Carrinho"; }
body:has(.da-page) #cat-lateral-painel #cat-lateral-body .bp-add > span:last-child { opacity: .9; font-weight: 600; }
body:has(.da-page) #cat-lateral-painel #cat-lateral-body .bp-add > span:last-child::before { content: "• "; }
body:has(.da-page) #cat-lateral-painel #cat-lateral-body .bp-add:disabled, body:has(.da-page) #cat-lateral-painel #cat-lateral-body .bp-add.bp-add--off { background: #F3A7AC !important; box-shadow: none; }

/* computador: mesma identidade, mais colunas */
@media (min-width: 900px) {
	.da-page { padding-bottom: 110px; }
	.da-topo { padding: 0 max(24px, calc((100% - 1180px) / 2)); height: 72px; }
	.da-topo__logo { flex: 0 0 auto; margin-right: auto; }
	.da-topo__logo img { height: 54px; }
	.da-view { max-width: 1180px; margin: 0 auto; }
	.da-buscaw { padding: 0 max(24px, calc((100% - 1180px) / 2)) 16px; }
	.da-page[data-view="lista"] .da-buscaw { top: 72px; }
	.da-busca { margin: 0; height: 52px; }
	.da-hero { margin-top: 16px; border-radius: 18px; aspect-ratio: auto; height: 400px; background: radial-gradient(ellipse at 50% 50%, #C40010 0%, #5A0006 60%, #120001 100%); }
	.da-hero__img { object-fit: contain; }
	.da-cats--home { grid-template-columns: repeat(6, minmax(0, 1fr)); margin-top: 16px; border-radius: 16px; padding: 14px; gap: 12px; }
	.da-sec { margin-top: 16px; border-radius: 16px; padding: 18px 4px; }
	.da-sec + .da-sec { border-top: 0; }
	.da-card--trilho { flex-basis: 200px; }
	.da-view[data-v="cats"] { max-width: none; padding: 20px max(24px, calc((100% - 1180px) / 2)); }
	.da-cats--grande { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
	.da-faixa { max-height: 260px; object-fit: cover; }
	.da-view[data-v="lista"] { max-width: none; padding: 0 max(24px, calc((100% - 1180px) / 2)); }
	.da-chips { top: 72px; padding: 16px 0; }
	.da-grade { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; padding: 0 0 24px; }
	.da-nav { left: 50%; right: auto; bottom: 16px; transform: translateX(-50%); width: 420px; border-radius: 18px; border: 1px solid var(--da-borda); padding: 8px 6px; }
	.da-toast { bottom: 100px; }
	body:has(.da-page) #cat-lateral-painel { top: 50% !important; bottom: auto !important; height: min(760px, 92vh) !important; max-width: 520px !important; border-radius: 22px; transform: translate(-50%, -46%); opacity: 0; visibility: hidden; transition: transform .25s ease, opacity .2s ease, visibility 0s .25s !important; }
	body:has(.da-page) #cat-lateral-painel.aberto { transform: translate(-50%, -50%); opacity: 1; visibility: visible; transition: transform .25s ease, opacity .2s ease !important; }
	body:has(.da-page) #cat-lateral-painel .prod-lateral-topo { height: 330px; padding-top: 50px !important; }
}
@media (prefers-reduced-motion: reduce) { .da-splash, body:has(.da-page) #cat-lateral-painel { transition: none !important; } .da-splash__gira { animation-duration: 2s; } }