/* Cardápio do cliente */
body.loja { background: var(--page-bg); padding-bottom: 96px; }
.wrap { max-width: 860px; margin: 0 auto; }
.cover { height: 170px; background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 85%, #000), var(--brand)); background-size: cover; background-position: center; position: relative; }
@media (min-width: 720px) { .cover { height: 230px; border-radius: 0 0 24px 24px; } }
.store-head { background: #fff; margin: -46px 12px 0; border-radius: var(--sheet-radius); padding: 56px 18px 16px; position: relative; box-shadow: var(--shadow); text-align: center; }
.store-logo { width: 92px; height: 92px; border-radius: 50%; position: absolute; top: -46px; left: 50%; transform: translateX(-50%); border: 4px solid #fff; background: #fff; object-fit: cover; box-shadow: var(--shadow); }
.store-head h1 { font-family: var(--display); font-size: 1.6rem; margin: 0 0 .2rem; letter-spacing: -.01em; }
.store-head .desc { color: var(--ink-2); max-width: 560px; margin: 0 auto .7rem; }
.status-pill { position: absolute; top: 12px; right: 12px; }
.facts { display: flex; flex-wrap: wrap; gap: .4rem .9rem; justify-content: center; font-size: .86rem; color: var(--ink-2); }
.facts span { display: inline-flex; gap: .3rem; align-items: center; }
.head-actions { display: flex; gap: .5rem; justify-content: center; margin-top: .8rem; flex-wrap: wrap; }
.closed-banner { margin: 12px; background: var(--bad-soft); color: var(--bad); border-radius: 14px; padding: .75rem 1rem; font-weight: 600; text-align: center; }

.sticky { position: sticky; top: 0; z-index: 20; background: var(--page-bg); padding: 10px 12px 0; }
.searchbar { display: flex; align-items: center; gap: .5rem; background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 0 .9rem; }
.searchbar input { border: 0; box-shadow: none !important; min-height: 44px; padding: 0; background: transparent; }
.tabs { display: flex; gap: .3rem; overflow-x: auto; padding: 10px 0 8px; scrollbar-width: none; }
.tabs::-webkit-scrollbar { display: none; }
.tabs a { flex: none; padding: .45rem .95rem; border-radius: var(--btn-radius); text-decoration: none; color: var(--ink-2); font-weight: 600; font-size: .92rem; background: #fff; border: 1px solid var(--line); }
.tabs a.on { background: var(--brand); color: var(--brand-ink); border-color: var(--brand); }

.cat { padding: 6px 12px 4px; scroll-margin-top: 112px; }
.cat h2 { font-family: var(--display); font-size: 1.3rem; margin: 14px 4px 10px; display: flex; align-items: center; gap: .5rem; }
.cat h2::before { content: ""; width: 6px; height: 22px; border-radius: 4px; background: var(--brand); }
.items { display: grid; gap: 10px; }
@media (min-width: 720px) { .items { grid-template-columns: 1fr 1fr; } }
.item { display: flex; gap: 12px; background: #fff; border: 1px solid var(--line); border-radius: var(--card-radius); padding: 12px; cursor: pointer; text-align: left; width: 100%; transition: box-shadow .15s, transform .06s; min-height: 112px; }
.item:hover { box-shadow: var(--shadow); }
.item:active { transform: scale(.99); }
.item .info { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.item h3 { font-size: 1rem; margin: 0 0 .2rem; }
.item .d { color: var(--ink-3); font-size: .86rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-bottom: .4rem; }
.item .p { margin-top: auto; display: flex; gap: .45rem; align-items: baseline; flex-wrap: wrap; }
.item .p .price { color: var(--accent); font-size: 1.02rem; }
.item img { width: 96px; height: 96px; border-radius: calc(var(--card-radius) * .75); object-fit: cover; flex: none; background: #f1ebe4; }
.item.off { opacity: .55; cursor: not-allowed; }
.item .from { font-size: .78rem; color: var(--ink-3); }

.cartbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); background: linear-gradient(transparent, var(--page-bg) 35%); }
.cartbar button { max-width: 836px; margin: 0 auto; width: 100%; display: flex; align-items: center; gap: .7rem; background: var(--brand); color: var(--brand-ink); border: 0; border-radius: 16px; padding: .95rem 1.1rem; font-weight: 700; font-size: 1rem; cursor: pointer; box-shadow: var(--shadow-lg); }
.cartbar button { border-radius: var(--card-radius) !important; }
.cartbar .count { background: rgba(255,255,255,.25); border-radius: 99px; min-width: 28px; height: 28px; display: grid; place-items: center; font-size: .85rem; }

/* Montador */
.b-hero { display: grid; gap: .8rem; margin-bottom: .6rem; }
.b-hero img { width: 100%; max-height: 220px; object-fit: cover; border-radius: 14px; background: #f1ebe4; }
.b-hero h2 { font-size: 1.25rem; margin: 0 0 .2rem; }
.b-hero .price { font-size: 1.1rem; color: var(--ok); }
.b-group { margin: .9rem -1rem 0; }
.b-group-head { display: flex; gap: .5rem; align-items: center; background: #f6f2ed; padding: .6rem 1rem; position: sticky; top: -1rem; z-index: 1; }
.b-group-head > div { flex: 1; }
.b-group .seg { margin: .6rem 1rem; }
.b-opt { display: flex; align-items: center; gap: .8rem; padding: .75rem 1rem; border-bottom: 1px solid var(--line); cursor: pointer; }
.b-opt:hover { background: #fcfaf7; }
.b-opt.selected { background: color-mix(in srgb, var(--brand) 5%, #fff); }
.b-opt-info { flex: 1; min-width: 0; }
.b-thumb { width: 56px; height: 56px; border-radius: 10px; object-fit: cover; flex: none; }
.price-add { color: var(--accent); font-weight: 600; }
.b-mark { width: 24px; height: 24px; border: 2px solid #cfc6bd; flex: none; display: grid; place-items: center; font-size: .78rem; font-weight: 800; color: #fff; transition: .12s; }
.b-mark.radio { border-radius: 50%; }
.b-mark.checkbox { border-radius: 7px; }
.b-mark.on { background: var(--brand); border-color: var(--brand); box-shadow: inset 0 0 0 3px #fff; }
.b-mark.checkbox.on { box-shadow: none; }
.b-mark.checkbox.on:empty::after { content: "✓"; }
.b-search { display: flex; align-items: center; gap: .5rem; margin: .6rem 1rem; border: 1px solid var(--line); border-radius: 999px; padding: 0 .8rem; }
.b-search input { border: 0; box-shadow: none !important; min-height: 38px; padding: 0; }
.btn-disabled-look { opacity: .65; }

/* Carrinho / checkout */
.cart-item { display: flex; gap: .7rem; padding: .8rem 0; border-bottom: 1px solid var(--line); align-items: flex-start; }
.cart-item .ci-info { flex: 1; min-width: 0; }
.cart-item .ci-info .small { color: var(--ink-3); }
.cart-item .ci-actions { display: flex; flex-direction: column; align-items: flex-end; gap: .4rem; }
.totals { margin-top: .8rem; display: grid; gap: .3rem; }
.totals div { display: flex; justify-content: space-between; }
.totals .grand { font-size: 1.15rem; font-weight: 800; border-top: 1px dashed var(--line); padding-top: .5rem; margin-top: .2rem; }
.coupon-row { display: flex; gap: .5rem; margin-top: .8rem; }
.choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.choice { border: 2px solid var(--line); border-radius: 14px; padding: .8rem; cursor: pointer; background: #fff; text-align: left; display: grid; gap: .2rem; }
.choice.on { border-color: var(--brand); background: color-mix(in srgb, var(--brand) 5%, #fff); }
.choice strong { font-size: .98rem; }
.choice small { color: var(--ink-3); }
.step-title { font-weight: 800; margin: 1.1rem 0 .55rem; font-size: 1rem; display: flex; gap: .5rem; align-items: center; }
.step-title:first-child { margin-top: 0; }
.step-title .n { width: 24px; height: 24px; border-radius: 50%; background: var(--brand); color: var(--brand-ink); display: grid; place-items: center; font-size: .8rem; }

.success { text-align: center; padding: .5rem 0 1rem; }
.success .tick { width: 74px; height: 74px; border-radius: 50%; background: var(--ok-soft); color: var(--ok); display: grid; place-items: center; margin: 0 auto .8rem; font-size: 2.2rem; }
.pix-box { border: 1px dashed var(--line); border-radius: 14px; padding: 1rem; margin: 1rem 0; text-align: center; }
.pix-box svg { width: 210px; height: 210px; margin: 0 auto .6rem; display: block; }
.pix-code { font-family: ui-monospace, monospace; font-size: .75rem; word-break: break-all; background: #f6f2ed; padding: .6rem; border-radius: 10px; text-align: left; max-height: 90px; overflow: auto; }
.info-list { display: grid; gap: .3rem; }
.info-list div { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 1px dashed var(--line); padding: .35rem 0; }
.footer { text-align: center; color: var(--ink-3); font-size: .82rem; padding: 2rem 1rem; }
.footer a { color: var(--ink-3); }
.share-box { margin-top: 1rem; background: var(--ok-soft); border-radius: 14px; padding: 1rem; text-align: center; }
.share-box .pix-code { text-align: center; }
.loyalty-card { background: #fff8e6; border: 1px dashed #e9c46a; border-radius: 14px; padding: .8rem; margin-top: .8rem; }
.loyalty-card .lc-head { display: flex; justify-content: space-between; margin-bottom: .5rem; }
.stamps { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: .5rem; }
.stamp { width: 28px; height: 28px; border-radius: 50%; border: 2px dashed #d4a72c; display: grid; place-items: center; font-size: .72rem; color: #b08a1e; font-weight: 700; }
.stamp.on { background: #e9a417; border: 2px solid #e9a417; color: #fff; font-size: .9rem; }
ol.rank { margin: .4rem 0 0; padding-left: 1.4rem; }
ol.rank li { padding: .25rem 0; border-bottom: 1px dashed var(--line); }
ol.rank li span { display: inline-block; min-width: 60%; }

/* Estilos de cabeçalho do tema */
[data-header="solid"] .cover { background-image: none !important; background: var(--brand); }
[data-header="minimal"] .cover { display: none; }
[data-header="minimal"] .store-head { margin-top: 12px; padding-top: 16px; display: grid; grid-template-columns: auto 1fr; gap: 0 14px; text-align: left; align-items: center; }
[data-header="minimal"] .store-logo { position: static; transform: none; width: 64px; height: 64px; grid-row: span 2; border-width: 2px; }
[data-header="minimal"] .store-head > *:not(.store-logo) { grid-column: 2; }
[data-header="minimal"] .facts, [data-header="minimal"] .head-actions { justify-content: flex-start; }
[data-header="minimal"] .store-head .desc { margin-left: 0; }
/* Loja de exemplo */
.demo-bar { position: sticky; top: 0; z-index: 30; display: flex; gap: .6rem; align-items: center; justify-content: center; flex-wrap: wrap; padding: .55rem .9rem; background: #1f1b18; color: #fff; font-size: .86rem; text-align: center; }
.demo-bar a { color: #1f1b18; background: #ffd45c; border-radius: 999px; padding: .3rem .8rem; font-weight: 800; text-decoration: none; white-space: nowrap; }
.demo-done { background: var(--ok-soft); color: var(--ink); border-radius: 14px; padding: .9rem 1rem; margin: .4rem 0 .6rem; text-align: left; }
.demo-done p { margin: .35rem 0 .7rem; font-size: .92rem; }
