:root {
  --ink: #17221d;
  --muted: #66736c;
  --paper: #fffdf8;
  --surface: #ffffff;
  --line: #e4e8e5;
  --brand: #e85d3f;
  --brand-dark: #bd3e27;
  --green: #167a4c;
  --green-soft: #e7f4ed;
  --amber: #bd7410;
  --shadow: 0 14px 40px rgba(28, 48, 37, 0.09);
}
* { box-sizing: border-box; }
body { margin: 0; font-family: Inter, ui-sans-serif, system-ui, sans-serif; background: var(--paper); color: var(--ink); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.topbar { position: sticky; top: 0; z-index: 10; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 16px clamp(20px, 5vw, 72px); background: rgba(255,253,248,.94); border-bottom: 1px solid var(--line); backdrop-filter: blur(14px); }
.brand { font-weight: 850; letter-spacing: -.03em; font-size: 1.2rem; }
.brand span { color: var(--brand); }
.nav { display: flex; gap: 10px; align-items: center; }
.shell { width: min(1180px, calc(100% - 32px)); margin: 32px auto 80px; }
.hero { display: grid; grid-template-columns: 1.3fr .7fr; gap: 24px; padding: clamp(28px, 6vw, 72px); border-radius: 28px; background: #173f31; color: white; box-shadow: var(--shadow); overflow: hidden; }
.hero h1 { margin: 0 0 16px; font-size: clamp(2.3rem, 6vw, 5rem); line-height: .98; letter-spacing: -.06em; }
.hero p { margin: 0; max-width: 650px; color: #d8e9e1; font-size: 1.08rem; }
.hero-mark { display: grid; place-items: center; font-size: clamp(5rem, 14vw, 10rem); filter: drop-shadow(0 20px 30px rgba(0,0,0,.2)); }
.grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 20px; margin-top: 24px; }
.panel { grid-column: span 12; padding: 24px; border: 1px solid var(--line); border-radius: 20px; background: var(--surface); box-shadow: var(--shadow); }
.panel.half { grid-column: span 6; }
.panel.third { grid-column: span 4; }
.panel h2, .panel h3 { margin: 0 0 16px; letter-spacing: -.025em; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
.field { display: grid; gap: 6px; }
.field.full { grid-column: 1 / -1; }
label { font-size: .82rem; color: var(--muted); font-weight: 750; }
input, select, textarea { width: 100%; padding: 12px 13px; color: var(--ink); background: white; border: 1px solid #cfd7d2; border-radius: 10px; outline: none; }
input:focus, select:focus, textarea:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(22,122,76,.12); }
.password-control { position: relative; }
.password-control input { padding-right: 82px; }
.password-toggle { position: absolute; right: 7px; top: 50%; transform: translateY(-50%); border: 0; border-radius: 7px; padding: 6px 8px; color: var(--green); background: transparent; font-size: .84rem; font-weight: 700; cursor: pointer; }
.password-toggle:hover, .password-toggle:focus-visible { background: rgba(22,122,76,.1); outline: none; }
.remember { display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: .92rem; cursor: pointer; }
.remember input { width: 18px; height: 18px; accent-color: var(--green); }
.addon-row { display: grid; grid-template-columns: 1fr 105px auto; gap: 8px; align-items: center; }
.addon-options { display: grid; gap: 7px; margin: 12px 0; }
.addon-options label { display: flex; align-items: center; gap: 7px; color: var(--muted); }
.addon-options input { width: 18px; height: 18px; accent-color: var(--green); }
.product-photo { width: 100%; height: 170px; object-fit: cover; border-radius: 10px; margin-bottom: 12px; }
@media (max-width: 520px) { .addon-row { grid-template-columns: 1fr 90px; } .addon-row button { grid-column: 1 / -1; } }
.store-grid { display: grid; gap: 16px; }
.store-card { overflow:hidden; border:0; border-radius:22px; background:white; box-shadow:0 12px 32px rgba(20,20,30,.09); }
.store-cover, .showcase-cover { position: relative; min-height: 145px; background: linear-gradient(135deg,#07173d,#1c3f7d); background-position: center; background-size: cover; }
.store-logo, .showcase-logo { position: absolute; left: 18px; bottom: -28px; width: 66px; height: 66px; object-fit: cover; border: 4px solid white; border-radius: 50%; background: white; }
.store-card-body { display: grid; gap: 8px; padding: 38px 18px 18px; }
.store-card-body h3, .catalog-content h3 { margin: 0; }
.store-facts { color: #34443b; font-size: .88rem; font-weight: 700; }
.catalog-panel { scroll-margin-top: 76px; }
.store-showcase { overflow: hidden; margin: -24px -24px 20px; }
.store-showcase > div:last-child { padding: 38px 24px 16px; }
.store-showcase h2 { margin: 0 0 5px; }
.category-tabs { position: sticky; top: 62px; z-index: 5; display: flex; gap: 8px; overflow-x: auto; margin: 0 -8px 18px; padding: 8px; background: rgba(255,255,255,.96); scrollbar-width: none; }
.category-tabs a { flex: 0 0 auto; padding: 9px 14px; color: var(--ink); border-radius: 999px; background: #eef2ef; font-size: .9rem; font-weight: 700; text-decoration: none; }
.category-tabs a:focus, .category-tabs a:hover { color: white; background: var(--green); }
.catalog-list { display: grid; gap: 26px; }
.catalog-category { scroll-margin-top: 120px; }
.featured-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.product-list { display: grid; gap: 10px; }
.catalog-card { display: grid; grid-template-columns: 1fr 118px; min-height: 138px; overflow: hidden; border: 1px solid #e7ebe8; border-radius: 14px; background: white; }
.catalog-card .catalog-photo { grid-column: 2; grid-row: 1; width: 118px; height: 100%; min-height: 138px; object-fit: cover; }
.catalog-content { grid-column: 1; grid-row: 1; display: grid; align-content: start; gap: 7px; padding: 14px; }
.featured-product { display: flex; flex-direction: column; }
.featured-product .catalog-photo { width: 100%; height: 130px; min-height: 130px; }
.featured-product .catalog-content { display: grid; padding: 11px; }
@media (max-width:700px){.featured-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.store-showcase{margin:-18px -18px 18px}.catalog-card{grid-template-columns:1fr 105px}.catalog-card .catalog-photo{width:105px}.featured-product .catalog-photo{width:100%;height:118px}.featured-product .addon-options{font-size:.8rem}}
.checkout-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 28px; }
.payment-options { display: grid; gap: 10px; margin-bottom: 18px; }
.payment-options label { display: flex; align-items: center; gap: 12px; padding: 14px; border: 1px solid #dce3de; border-radius: 12px; cursor: pointer; }
.payment-options label:has(input:checked) { border-color: var(--green); background: rgba(22,122,76,.07); }
.payment-options input { width: 19px; height: 19px; accent-color: var(--green); }
.payment-options span { display: grid; gap: 2px; }
.payment-options small { color: var(--muted); }
.checkout-summary { padding: 18px; border-radius: 14px; background: #f5f7f5; }
.checkout-line { display: flex; justify-content: space-between; gap: 12px; }
.success-mark { display: grid; place-items: center; width: 68px; height: 68px; color: white; background: var(--green); border-radius: 50%; font-size: 2rem; font-weight: 900; }
@media (max-width:700px){.checkout-grid{grid-template-columns:1fr}.checkout-summary{order:-1}}
.driver-hero { background: linear-gradient(135deg,#07173d,#174b3a); }
.delivery-list { display: grid; gap: 12px; }
.delivery-card { display: grid; gap: 9px; padding: 16px; border: 1px solid #dfe6e1; border-radius: 14px; background: white; }
.delivery-card p { margin: 0; }
.active-delivery { border-left: 5px solid var(--green); }
.btn { display: inline-flex; justify-content: center; align-items: center; gap: 8px; min-height: 42px; padding: 10px 16px; border: 0; border-radius: 11px; color: white; background: var(--brand); font-weight: 800; text-decoration: none; }
.btn:hover { background: var(--brand-dark); }
.btn.secondary { background: var(--green); }
.btn.ghost { color: var(--ink); background: #f0f3f1; }
.btn.small { min-height: 34px; padding: 7px 11px; font-size: .86rem; }
.actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 16px; }
.stack { display: grid; gap: 12px; }
.card { padding: 17px; border: 1px solid var(--line); border-radius: 15px; background: white; }
.card-title { display: flex; justify-content: space-between; gap: 15px; align-items: start; }
.card h3 { margin: 0 0 5px; }
.meta { color: var(--muted); font-size: .9rem; }
.price { font-size: 1.12rem; font-weight: 850; color: var(--green); }
.pill { display: inline-flex; padding: 5px 9px; border-radius: 999px; background: var(--green-soft); color: var(--green); font-size: .74rem; font-weight: 850; }
.pill.warn { background: #fff1dc; color: var(--amber); }
.empty { padding: 28px; border: 1px dashed #cbd4cf; border-radius: 14px; text-align: center; color: var(--muted); }
.hidden { display: none !important; }
.toast { position: fixed; right: 20px; bottom: 20px; max-width: 380px; padding: 14px 18px; border-radius: 12px; color: white; background: #26352e; box-shadow: var(--shadow); z-index: 30; }
.cart-row { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center; }
.total { display: flex; justify-content: space-between; padding-top: 14px; border-top: 1px solid var(--line); font-size: 1.15rem; font-weight: 850; }
.landing-cards { display: grid; grid-template-columns: repeat(2,1fr); gap: 20px; margin-top: 24px; }
.landing-card { padding: 30px; border: 1px solid var(--line); border-radius: 20px; background: white; color: inherit; text-decoration: none; transition: transform .2s ease; }
.landing-card:hover { transform: translateY(-3px); }
.landing-card strong { display:block; margin-bottom: 8px; font-size: 1.5rem; }
@media (max-width: 780px) { .hero { grid-template-columns: 1fr; } .hero-mark { display:none; } .panel.half, .panel.third { grid-column: span 12; } .form-grid, .landing-cards { grid-template-columns: 1fr; } .topbar { align-items:flex-start; } .nav { flex-wrap:wrap; justify-content:flex-end; } }

/* Experiência do cliente */
.customer-app { --brand:#ee3157; --brand-dark:#cf1f45; --green:#0b8a70; --paper:#f8f6fa; background:radial-gradient(circle at 8% 8%,rgba(255,178,196,.28),transparent 28%),radial-gradient(circle at 92% 32%,rgba(255,199,139,.22),transparent 30%),linear-gradient(180deg,#fff 0,#f8f6fa 460px); background-attachment:fixed; }
.customer-shell { width:min(1040px,100%); margin:0 auto; padding:0 20px 100px; }
.customer-topbar { background:#fff; }
.auth-layout { display:grid; grid-template-columns:.9fr 1.1fr; gap:28px; padding:45px 0; }
.auth-welcome { align-self:center; padding:38px; }
.auth-welcome img { width:88px; border-radius:24px; }
.auth-welcome h1 { margin:22px 0 10px; font-size:clamp(2.3rem,5vw,4.5rem); line-height:.98; letter-spacing:-.055em; }
.auth-welcome p { color:var(--muted); font-size:1.06rem; }
.auth-forms { display:grid; gap:12px; align-content:center; }
.auth-tabs { display:grid; grid-template-columns:1fr 1fr; gap:5px; padding:5px; border-radius:15px; background:#ececf1; }
.auth-tabs button { padding:11px; color:#6d6d76; border:0; border-radius:11px; background:transparent; font-weight:850; }
.auth-tabs button.active { color:#17171d; background:white; box-shadow:0 3px 12px rgba(20,20,30,.08); }
.auth-card { display:none; }
.auth-card.active { display:block; }
.wide { width:100%; }
.text-button { padding:0; border:0; color:var(--brand); background:none; font-weight:800; }
.auth-links { justify-items:end; }
.customer-content { min-height:75vh; }
.customer-app .panel { border-color:rgba(255,255,255,.82); background:rgba(255,255,255,.78); box-shadow:0 16px 42px rgba(45,25,35,.08); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
.app-view { display:none; animation:viewIn .22s ease; }
.app-view.active { display:block; }
@keyframes viewIn { from { opacity:.35; transform:translateY(5px) } }
.customer-heading { display:flex; align-items:center; justify-content:space-between; padding:24px 2px 18px; }
.delivery-address { display:grid; gap:4px; padding:0; text-align:left; border:0; background:none; }
.delivery-address .eyebrow { color:var(--muted); font-size:.88rem; }
.delivery-address strong { max-width:72vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:1.05rem; }
.avatar-button { width:46px; height:46px; padding:0; overflow:hidden; border:3px solid #f2dbe1; border-radius:50%; background:#fff; }
.avatar-button img { width:100%; height:100%; object-fit:cover; }
.promo-banner { position:relative; display:flex; align-items:center; justify-content:space-between; min-height:190px; padding:28px clamp(24px,5vw,52px); overflow:hidden; color:white; border-radius:28px; background:radial-gradient(circle at 85% 20%,rgba(255,255,255,.28),transparent 25%),linear-gradient(120deg,#ef3154,#ff7248); box-shadow:0 18px 40px rgba(239,63,85,.22); }
.promo-banner div:first-child { display:grid; gap:8px; max-width:520px; }
.promo-banner span { font-size:.76rem; font-weight:900; letter-spacing:.13em; }
.promo-banner strong { font-size:clamp(1.7rem,4vw,3rem); line-height:1; }
.promo-banner small { color:#fff4f4; font-size:.95rem; }
.promo-emoji { font-size:clamp(4.5rem,12vw,8rem); transform:rotate(-8deg); }
.search-box { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px; margin:20px 0; padding:8px 8px 8px 17px; border:1px solid rgba(255,255,255,.78); border-radius:19px; background:rgba(255,255,255,.72); box-shadow:0 10px 30px rgba(45,25,35,.08); backdrop-filter:blur(18px) saturate(1.25); -webkit-backdrop-filter:blur(18px) saturate(1.25); }
.search-box input { padding:8px 0; border:0; box-shadow:none; }
.search-box button { padding:10px 14px; border:0; border-radius:11px; color:white; background:var(--brand); font-weight:800; }
.category-shortcuts { display:grid; grid-template-columns:repeat(6,1fr); gap:12px; margin:20px 0 34px; }
.category-shortcuts button { display:grid; place-items:center; gap:8px; min-height:98px; padding:12px 6px; border:1px solid rgba(255,255,255,.82); border-radius:20px; background:rgba(255,255,255,.68); font-size:1.75rem; box-shadow:0 8px 22px rgba(45,25,35,.06); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); transition:transform .18s ease,background .18s ease; }
.category-shortcuts button:active { transform:scale(.96); background:rgba(255,255,255,.92); }
.category-shortcuts span { color:#303038; font-size:.76rem; font-weight:750; }
.home-section { margin:32px 0; }
.section-heading { display:flex; justify-content:space-between; margin-bottom:14px; }
.section-heading h2 { margin:0; font-size:1.45rem; }
.section-heading p { margin:4px 0 0; color:var(--muted); }
.restaurant-rail,.store-grid { display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.restaurant-rail .store-card { min-width:0; }
.offer-rail { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.offer-card { display:grid; align-content:end; gap:7px; min-height:190px; padding:23px; color:white; border-radius:23px; }
.offer-card span { font-size:.7rem; font-weight:900; letter-spacing:.14em; }
.offer-card strong { font-size:1.4rem; line-height:1.05; }
.offer-card small { color:rgba(255,255,255,.86); }
.offer-red { background:linear-gradient(145deg,#e82943,#ff765b); }.offer-green { background:linear-gradient(145deg,#08765c,#24ad82); }.offer-orange { background:linear-gradient(145deg,#f07a29,#ffb133); }
.view-title { display:flex; align-items:center; gap:16px; padding:26px 0 18px; }
.view-title h1 { margin:0; font-size:1.8rem; }.view-title p { margin:3px 0 0; color:var(--muted); }
.back-link { padding:10px 13px; border:0; border-radius:12px; background:#ececef; font-weight:850; }
.profile-hero { display:grid; place-items:center; padding:36px 20px 24px; text-align:center; }
.profile-hero h1 { margin:14px 0 4px; }.profile-hero p { margin:0; color:var(--muted); }
.profile-photo { position:relative; display:grid; justify-items:center; gap:5px; cursor:pointer; }
.profile-photo img { width:104px; height:104px; object-fit:cover; border:4px solid white; border-radius:50%; box-shadow:0 10px 28px rgba(0,0,0,.13); }
.profile-photo span { color:var(--brand); font-size:.8rem; }.profile-photo input { position:absolute; width:1px; height:1px; opacity:0; }
.settings-list { overflow:hidden; border:1px solid rgba(255,255,255,.85); border-radius:24px; background:rgba(255,255,255,.72); box-shadow:0 14px 40px rgba(45,25,35,.07); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
.settings-list button { display:grid; grid-template-columns:38px 1fr auto; align-items:center; gap:10px; width:100%; padding:16px 18px; text-align:left; border:0; border-bottom:1px solid rgba(225,222,228,.72); background:transparent; }
.settings-list button:last-child { border-bottom:0; }.settings-list button>span { font-size:1.3rem; }.settings-list button div { display:grid; gap:3px; }.settings-list small { color:var(--muted); }.settings-list b { color:#a2a2aa; font-size:1.6rem; }
.toggle-list { display:grid; gap:0; }.toggle-list label { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:18px 0; border-bottom:1px solid #eee; }
.toggle-list label div { display:grid; gap:4px; }.toggle-list small { color:var(--muted); font-weight:500; }.toggle-list input { width:22px; height:22px; accent-color:var(--brand); }
.payment-card { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:12px; padding:16px; border:1px solid #eee; border-radius:15px; }.payment-card div { display:grid; gap:3px; }.payment-card small { color:var(--muted); }
.saved-addresses { display:grid; gap:10px; margin-top:16px; }.saved-address { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px; border:1px solid #eee; border-radius:14px; }.saved-address>div { display:grid; gap:3px; }.saved-address small { color:var(--muted); }.saved-address>div:last-child { display:flex; gap:12px; }
.security-note { color:var(--muted); font-size:.84rem; }
.success-panel { display:grid; justify-items:center; margin-top:40px; text-align:center; }
.bottom-nav { position:fixed; z-index:50; left:50%; bottom:0; display:grid; grid-template-columns:repeat(4,1fr); width:min(620px,100%); min-height:72px; padding:8px 8px max(8px,env(safe-area-inset-bottom)); border:0; border-top:1px solid rgba(255,255,255,.82); border-radius:20px 20px 0 0; background:rgba(255,255,255,.76); box-shadow:0 -10px 34px rgba(45,25,35,.11); backdrop-filter:blur(24px) saturate(1.35); -webkit-backdrop-filter:blur(24px) saturate(1.35); transform:translateX(-50%); }
.bottom-nav button { position:relative; display:grid; place-items:center; gap:2px; padding:5px; color:#83838c; border:0; background:none; font-size:.7rem; font-weight:750; }.bottom-nav button span { font-size:1.42rem; line-height:1; }.bottom-nav button.active { color:var(--brand); }.bottom-nav button.active::before { content:""; position:absolute; top:-8px; width:28px; height:3px; border-radius:99px; background:var(--brand); }
.bottom-nav .nav-profile-icon { display:block; width:21px; height:21px; }
.bottom-nav .nav-profile-icon svg { display:block; width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
dialog { max-width:440px; padding:26px; border:0; border-radius:22px; box-shadow:0 25px 80px rgba(0,0,0,.25); } dialog::backdrop { background:rgba(18,18,22,.55); } dialog h2 { margin-top:0; }
@media(max-width:780px){
  .customer-topbar { display:none!important; }.customer-shell { padding:0 16px 112px; }.auth-layout { grid-template-columns:1fr; padding:18px 0; }.auth-welcome { display:grid; justify-items:center; padding:10px 10px 6px; text-align:center; }.auth-welcome img { width:72px; border-radius:20px; }.auth-welcome h1 { margin:12px 0 6px; font-size:2rem; }.auth-welcome p { margin:0; font-size:.92rem; }.auth-forms .panel { border:0; border-radius:24px; box-shadow:0 15px 45px rgba(25,25,35,.09); }.auth-tabs { margin-top:8px; }
  .customer-heading { padding-top:20px; }.promo-banner { min-height:154px; padding:23px; border-radius:24px; }.promo-banner strong { max-width:235px; font-size:1.62rem; }.promo-banner small { max-width:225px; }.promo-emoji { position:absolute; right:-8px; bottom:-8px; font-size:4.8rem; opacity:.92; }
  .category-shortcuts { display:flex; overflow-x:auto; gap:10px; margin-right:-14px; padding-right:14px; scrollbar-width:none; }.category-shortcuts button { flex:0 0 86px; min-height:88px; }
  .restaurant-rail,.store-grid { display:flex!important; overflow-x:auto; gap:12px; margin-right:-14px; padding:0 14px 8px 0; scroll-snap-type:x mandatory; scrollbar-width:none; }.restaurant-rail .store-card,.store-grid .store-card { flex:0 0 79vw; scroll-snap-align:start; }
  .offer-rail { display:flex; overflow-x:auto; margin-right:-14px; padding-right:14px; scrollbar-width:none; }.offer-card { flex:0 0 78vw; min-height:170px; }
  .panel { padding:18px; }.profile-hero { padding-top:25px; }
}

/* O atributo hidden precisa vencer o display dos botoes. */
[hidden] { display: none !important; }
.aceite{display:flex;gap:8px;align-items:flex-start;font-size:.85rem;line-height:1.4;margin:4px 0 10px}
.aceite input{margin-top:3px;flex:0 0 auto}