:root {
  --brand: #ef6c35;
  --secondary: #2b2118;
  --ink: #25221f;
  --muted: #746f69;
  --line: #e8e2dc;
  --paper: #fffdfb;
  --canvas: #f5f2ee;
  --success: #217a52;
  --danger: #b43b3b;
  --card-radius: 18px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--canvas);
}

* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
a { color: inherit; }
.container { width: min(1160px, calc(100% - 32px)); margin: 0 auto; }
.topbar {
  position: sticky; top: 0; z-index: 10; background: rgba(255,253,251,.94);
  border-bottom: 1px solid var(--line); backdrop-filter: blur(12px);
}
.topbar-inner { min-height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.customer-nav-wrap { position: sticky; top: 68px; z-index: 9; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--paper) 96%, transparent); backdrop-filter: blur(12px); }
.customer-nav { display: flex; gap: 5px; overflow-x: auto; padding-top: 8px; padding-bottom: 8px; scrollbar-width: thin; }
.customer-nav-button { display: inline-flex; align-items: center; gap: 7px; flex: 0 0 auto; border: 0; border-radius: 10px; padding: 10px 14px; background: transparent; color: var(--muted); font-weight: 800; }
.customer-nav a { text-decoration: none; }
.customer-nav-button:hover { color: var(--ink); background: color-mix(in srgb, var(--brand) 7%, transparent); }
.customer-nav-button.active { color: var(--brand); background: color-mix(in srgb, var(--brand) 12%, white); }
.nav-count { min-width: 20px; height: 20px; display: inline-grid; place-items: center; border-radius: 999px; padding: 0 5px; color: white; background: var(--brand); font-size: .72rem; }
.brand { display: flex; align-items: center; gap: 12px; font-weight: 800; }
.brand-mark { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; color: white; background: var(--brand); overflow: hidden; }
.brand-mark img { width: 100%; height: 100%; object-fit: contain; border-radius: inherit; }
.brand-mark-logo { border-radius: 50%; background: transparent; box-shadow: 0 8px 22px rgba(20,31,54,.12); }
.brand-mark-logo img { object-fit: cover; }
.logo-preview { min-height: 120px; border: 1px dashed var(--line); border-radius: 16px; display: grid; place-items: center; color: var(--muted); margin-bottom: 12px; background: var(--canvas); }
.logo-preview img { max-width: 100%; max-height: 150px; object-fit: contain; }
.cover-preview { min-height: 120px; overflow: hidden; border: 1px dashed var(--line); border-radius: 16px; display: grid; place-items: center; color: var(--muted); margin-bottom: 12px; background: var(--canvas); }
.cover-preview img { width: 100%; height: 150px; object-fit: cover; }
.banner-preset-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.banner-preset-option { position: relative; min-height: 112px; overflow: hidden; display: flex; align-items: flex-end; padding: 14px; border: 2px solid transparent; border-radius: 16px; color: white; cursor: pointer; isolation: isolate; }
.banner-preset-option::after { content: ""; position: absolute; z-index: -1; width: 90px; height: 90px; right: -24px; top: -27px; border-radius: 50%; background: rgba(255,255,255,.22); }
.banner-preset-option input { position: absolute; top: 11px; right: 11px; width: 18px; height: 18px; accent-color: white; }
.banner-preset-option span { display: grid; gap: 4px; }
.banner-preset-option small { color: rgba(255,255,255,.84); line-height: 1.3; }
.banner-preset-option:has(input:checked) { border-color: var(--ink); box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 20%, transparent); }
.banner-free { background: linear-gradient(135deg, #16a34a, #64c45a); }
.banner-cashback { background: linear-gradient(135deg, #049b66, #047857); }
.banner-promo { background: linear-gradient(135deg, #ff6b35, #f43f5e); }
.banner-pickup { background: linear-gradient(135deg, #6c5ce7, #3b82f6); }
.settings-actions { position: sticky; bottom: 14px; z-index: 5; display: flex; justify-content: flex-end; gap: 10px; margin: 26px -6px -6px; padding: 13px; border: 1px solid var(--line); border-radius: 14px; background: color-mix(in srgb, var(--paper) 94%, transparent); box-shadow: 0 12px 35px rgba(45,34,27,.14); backdrop-filter: blur(12px); }
.muted { color: var(--muted); }
.small { font-size: .86rem; }
.btn {
  border: 0; border-radius: min(12px, var(--card-radius)); padding: 11px 16px; font-weight: 750;
  background: var(--brand); color: white; transition: transform .12s, opacity .12s;
}
.btn:hover { transform: translateY(-1px); }
.btn:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.btn-secondary { color: var(--ink); background: white; border: 1px solid var(--line); }
.btn-danger { background: var(--danger); }
.hero {
  padding: 48px 0 26px; background: linear-gradient(130deg, color-mix(in srgb, var(--brand) 13%, white), var(--paper));
  border-bottom: 1px solid var(--line);
}
.eyebrow { color: var(--brand); font-weight: 850; text-transform: uppercase; letter-spacing: .09em; font-size: .75rem; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 10px; font-size: clamp(2rem, 6vw, 3.6rem); line-height: .98; letter-spacing: -.04em; }
h2 { letter-spacing: -.025em; }
.badge { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 6px 10px; background: #eaf6ef; color: var(--success); font-size: .8rem; font-weight: 800; }
.badge.closed { background: #f8e9e9; color: var(--danger); }
.layout { display: grid; grid-template-columns: 1fr 350px; align-items: start; gap: 28px; padding: 30px 0 80px; }
.category { margin-bottom: 36px; }
.category-nav { display: flex; gap: 8px; overflow-x: auto; padding: 2px 0 18px; scrollbar-width: thin; }
.category-nav a { white-space: nowrap; text-decoration: none; border: 1px solid var(--line); background: var(--paper); border-radius: 999px; padding: 8px 13px; font-size: .86rem; font-weight: 750; }
.category-nav a:hover { border-color: var(--brand); color: var(--brand); }
.product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.card {
  border: 1px solid var(--line); border-radius: var(--card-radius); background: var(--paper);
  padding: 18px; box-shadow: 0 10px 35px rgba(58,45,36,.04);
}
.product { display: flex; flex-direction: column; min-height: 178px; }
.product-image { width: 100%; aspect-ratio: 16 / 10; object-fit: contain; border-radius: min(8px, var(--card-radius)); margin-bottom: 14px; background: white; }
.product .description { color: var(--muted); font-size: .9rem; flex: 1; line-height: 1.5; }
.product-footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.price { font-weight: 900; }
.cart { position: sticky; top: 94px; }
.cart-list { display: grid; gap: 10px; margin: 18px 0; }
.cart-item { display: grid; grid-template-columns: 1fr auto; gap: 6px; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.cart-controls { display: flex; gap: 6px; align-items: center; }
.floating-cart { position: fixed; right: 24px; bottom: 24px; z-index: 15; width: 62px; height: 62px; display: grid; place-items: center; border: 0; border-radius: 50%; color: white; background: var(--brand); box-shadow: 0 12px 34px color-mix(in srgb, var(--brand) 42%, transparent); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease; }
.floating-cart:hover { transform: translateY(-3px) scale(1.03); box-shadow: 0 16px 40px color-mix(in srgb, var(--brand) 52%, transparent); }
.floating-cart-icon { font-size: 1.55rem; line-height: 1; filter: grayscale(1) brightness(0) invert(1); }
.floating-cart-count { position: absolute; top: -5px; right: -3px; min-width: 24px; height: 24px; display: grid; place-items: center; padding: 0 5px; border: 2px solid white; border-radius: 999px; background: #d92d20; color: white; font-size: .72rem; font-weight: 900; }
.cart.cart-highlight { animation: cart-highlight .7s ease; }
@keyframes cart-highlight { 50% { box-shadow: 0 0 0 5px color-mix(in srgb, var(--brand) 24%, transparent), var(--shadow); } }
.icon-btn { width: 28px; height: 28px; border: 1px solid var(--line); border-radius: 8px; background: white; }
.summary { display: grid; gap: 8px; margin: 18px 0; }
.summary-row { display: flex; justify-content: space-between; }
.summary-total { font-size: 1.1rem; font-weight: 900; padding-top: 10px; border-top: 1px solid var(--line); }
.empty { padding: 30px 10px; text-align: center; color: var(--muted); }
.field { display: grid; gap: 7px; margin-bottom: 14px; }
.field label { font-size: .82rem; font-weight: 800; }
.field input, .field select, .field textarea {
  width: 100%; border: 1px solid #dcd4cc; border-radius: 11px; padding: 11px 12px;
  background: white; color: var(--ink); outline: none;
}
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--brand); box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 16%, transparent); }
.choice-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 14px; }
.choice { border: 1px solid var(--line); border-radius: 11px; padding: 10px; background: white; text-align: center; font-weight: 750; }
.choice.active { border-color: var(--brand); color: var(--brand); background: color-mix(in srgb, var(--brand) 8%, white); }
.hidden { display: none !important; }
.module-hidden { display: none !important; }
.toast { position: fixed; right: 24px; bottom: 24px; background: #24211e; color: white; padding: 14px 18px; border-radius: 12px; z-index: 30; box-shadow: 0 12px 40px #0003; }
.modal { position: fixed; inset: 0; z-index: 20; background: #18120c99; display: grid; place-items: center; padding: 20px; }
.modal-card { width: min(540px, 100%); max-height: 92vh; overflow: auto; background: var(--paper); border-radius: var(--card-radius); padding: 24px; }
.welcome-modal-head { position: sticky; top: -24px; z-index: 4; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: -24px -24px 12px; padding: 16px 24px 10px; background: color-mix(in srgb, var(--paper) 96%, transparent); backdrop-filter: blur(12px); }
.welcome-skip-top { min-height: 38px; padding: 8px 13px; white-space: nowrap; }
@media(max-width:520px) {
  .welcome-modal-head { top: -18px; margin: -18px -18px 12px; padding: 13px 18px 9px; }
  .welcome-skip-top { padding: 7px 10px; font-size: .78rem; }
}
.login-page { display: grid; min-height: 100vh; grid-template-columns: 1.05fr .95fr; }
.login-art { display: grid; align-content: center; padding: 8vw; background: #29221d; color: white; }
.login-art h1 { max-width: 620px; }
.login-panel { display: grid; place-items: center; padding: 30px; }
.login-box { width: min(420px, 100%); }
.shell { display: grid; grid-template-columns: 265px 1fr; min-height: 100vh; }
.sidebar { background: #26211d; color: white; padding: 26px 18px; display: flex; flex-direction: column; gap: 28px; }
.sidebar nav { display: grid; gap: 12px; }
.nav-group { display: grid; gap: 4px; }
.nav-group-toggle { width: 100%; display: flex; justify-content: space-between; align-items: center; border: 0; padding: 6px 10px; color: #92877f; background: transparent; text-transform: uppercase; letter-spacing: .08em; font-size: .68rem; font-weight: 850; text-align: left; }
.nav-chevron { font-size: 1rem; transition: transform .18s ease; }
.nav-group-toggle[aria-expanded="false"] .nav-chevron { transform: rotate(-90deg); }
.nav-submenu { display: grid; gap: 3px; }
.nav-group-toggle[aria-expanded="false"] + .nav-submenu { display: none; }
.nav-button { width: 100%; text-align: left; border: 0; border-radius: 11px; padding: 10px 13px 10px 17px; color: #d7cec6; background: transparent; font-weight: 720; }
.nav-button.active, .nav-button:hover { background: #ffffff14; color: white; }
.nav-group:has(.nav-button.active) .nav-group-toggle { color: #f1e8e1; }
[data-management-section] { scroll-margin-top: 24px; }
.sidebar-footer { margin-top: auto; }
.main { min-width: 0; background: #f6f4f1; }
.main-header { position: relative; z-index: 2; margin: 14px 18px 0; padding: 20px 24px; background: rgba(255,255,255,.9); border: 1px solid #ffffff; border-radius: 18px; box-shadow: 0 12px 34px rgba(54,42,33,.07); display: flex; justify-content: space-between; align-items: center; backdrop-filter: blur(12px); }
.content { padding: 28px 30px 60px; }
.board { display: grid; grid-template-columns: repeat(4, minmax(210px, 1fr)); gap: 14px; overflow-x: auto; padding-bottom: 14px; }
.column { min-height: 460px; border: 1px solid rgba(255,255,255,.8); border-radius: 18px; background: rgba(255,255,255,.58); padding: 14px; box-shadow: 0 14px 36px rgba(54,42,33,.07); backdrop-filter: blur(8px); }
.column-title { display: flex; justify-content: space-between; gap: 8px; font-weight: 850; padding: 5px 3px 13px; }
.order-card { background: white; border-radius: 13px; padding: 14px; margin-bottom: 10px; box-shadow: 0 4px 15px #3b302812; }
.whatsapp-attendances { margin-bottom: 22px; padding: 18px; border: 1px solid color-mix(in srgb, #25d366 24%, var(--line)); border-radius: 18px; background: color-mix(in srgb, #25d366 7%, white); }
.whatsapp-attendances-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px; }
.whatsapp-attendance-card { display: grid; gap: 9px; padding: 14px; border-radius: 13px; background: white; box-shadow: 0 5px 18px #3b302812; }
.order-head { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.order-items { font-size: .86rem; line-height: 1.6; color: var(--muted); }
.order-actions { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin-top: 12px; }
.courier-actions { grid-template-columns: minmax(120px, 1fr) auto auto; }
.courier-actions > [data-advance], .courier-actions > [data-dispatch], .courier-actions > select { grid-column: 1 / -1; }
.courier-actions select { min-width: 0; border: 1px solid var(--line); border-radius: 10px; padding: 9px; }
.settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.table-wrap { overflow: auto; border: 1px solid rgba(255,255,255,.85); border-radius: 18px; background: rgba(255,255,255,.88); box-shadow: 0 14px 36px rgba(54,42,33,.065); }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 13px 14px; border-bottom: 1px solid var(--line); text-align: left; }
th { font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.switch-line { display: flex; align-items: center; gap: 10px; margin: 12px 0; }
.status-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--success); display: inline-block; }
.metric-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 24px; }
.metric-card { background: rgba(255,255,255,.9); border: 1px solid rgba(255,255,255,.9); border-radius: 18px; padding: 18px; box-shadow: 0 12px 32px rgba(54,42,33,.065); }
.metric-card strong { display: block; margin-top: 6px; font-size: 1.7rem; letter-spacing: -.04em; }
.insights-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; }
.report-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px; margin-bottom: 20px; }
.insight-card { min-width: 0; padding: 20px; border: 1px solid rgba(255,255,255,.9); border-radius: 18px; background: rgba(255,255,255,.88); box-shadow: 0 14px 36px rgba(54,42,33,.065); }
.insight-card h3 { margin-bottom: 15px; }
.insight-list { display: grid; gap: 2px; }
.insight-row { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 11px 0; border-bottom: 1px solid rgba(75,59,48,.08); font-size: .9rem; }
.insight-row:last-child { border-bottom: 0; }
.insight-row span { display: flex; align-items: center; min-width: 0; gap: 9px; }
.insight-row span b { flex: 0 0 auto; width: 23px; height: 23px; display: grid; place-items: center; border-radius: 8px; background: color-mix(in srgb, var(--brand) 10%, white); color: var(--brand); font-size: .75rem; }
.insight-row > strong { flex: 0 0 auto; text-align: right; font-size: .82rem; }
.hours-card { max-width: 920px; }
.hours-list { display: grid; gap: 4px; }
.hours-row { display: grid; grid-template-columns: minmax(190px,1fr) 150px 150px; align-items: center; gap: 18px; padding: 12px 4px; border-bottom: 1px solid rgba(75,59,48,.09); }
.hours-row .field { margin: 0; }
.hours-row .field span { font-size: .75rem; color: var(--muted); font-weight: 750; }
.hours-row input:disabled { opacity: .45; }
.business-hours { display: grid; gap: 7px; }
.business-hour-line { display: flex; justify-content: space-between; gap: 20px; }
.payment-note, .privacy-consent { display:block; margin:10px 0 15px; padding:12px 14px; border:1px solid #cde2d3; border-radius:11px; background:#f0faf3; line-height:1.45; }
.privacy-consent input { margin-right:8px; }
.customer-identification { margin:16px 0 20px; padding:16px; border:1px solid color-mix(in srgb, var(--brand) 22%, var(--line)); border-radius:14px; background:color-mix(in srgb, var(--brand) 5%, white); }
.customer-channel-row { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.customer-channel-row label { display:flex; align-items:center; gap:7px; padding:9px 12px; border:1px solid #e6dcd3; border-radius:999px; background:#fff; font-size:.82rem; font-weight:850; cursor:pointer; }
.customer-channel-row input { accent-color:var(--brand); }
.customer-identification-row { display:grid; grid-template-columns:1fr auto; gap:8px; }
.customer-identification-row input { min-width:0; border:1px solid #dcd4cc; border-radius:11px; padding:11px 12px; }
.customer-code-box { display:grid; gap:7px; margin-top:14px; }
.customer-code-box label { font-size:.82rem; font-weight:800; }
.form-divider { display:flex; align-items:center; gap:10px; margin:20px 0; color:var(--muted); font-size:.8rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.form-divider::before, .form-divider::after { content:""; flex:1; height:1px; background:var(--line); }
.onboarding-list { display:grid; gap:12px; max-width:880px; }
.onboarding-item { display:grid; grid-template-columns:42px 1fr auto; align-items:center; gap:14px; width:100%; padding:18px; border:1px solid rgba(255,255,255,.9); border-radius:18px; background:rgba(255,255,255,.9); color:var(--ink); text-align:left; box-shadow:0 12px 32px rgba(54,42,33,.06); }
.onboarding-item > span { width:36px; height:36px; display:grid; place-items:center; border-radius:50%; background:#eee8e2; font-size:1.2rem; }
.onboarding-item.done > span { background:#e4f5eb; color:var(--success); }
.onboarding-item small { color:var(--muted); }
.week-checks { display:flex; flex-wrap:wrap; gap:8px; margin:10px 0 16px; }
.week-checks label { padding:8px 10px; border:1px solid var(--line); border-radius:10px; background:white; font-size:.82rem; }
.chatbot-rule-card { display:grid; grid-template-columns:1fr auto; gap:12px; align-items:center; }
.management-grid { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(320px,.7fr); gap:16px; align-items:start; }
.management-grid .insight-card { overflow:hidden; }
.manual-products-list { display:grid; gap:8px; max-height:260px; overflow:auto; margin:12px 0; }
.manual-product-row { display:grid; grid-template-columns:1fr 90px; gap:10px; align-items:center; padding:10px 12px; border:1px solid var(--line); border-radius:11px; }
.store-list { display: grid; gap: 12px; }
.store-card { display: grid; grid-template-columns: minmax(220px, 1.5fr) repeat(3, minmax(90px, .45fr)) auto; align-items: center; gap: 14px; }
.store-card.inactive { opacity: .62; }
.store-card.subscription-blocked { border-color: #efb2b7; background: linear-gradient(105deg,#fff 72%,#fff1f2); }
.wide-modal { width: min(920px, 100%); }
.saas-plans-section { margin: 25px 0; }
.saas-page-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 24px; }
.saas-plan-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(240px,1fr)); gap: 14px; }
.saas-plan-card { display: grid; gap: 13px; }
.saas-plan-card.inactive { opacity: .62; }
.saas-plan-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.saas-plan-head h3 { margin: 5px 0 0; }
.saas-plan-price { font-size: 1.65rem; }
.saas-plan-price small { margin-left: 4px; color: var(--muted); font-size: .75rem; font-weight: 700; }
.saas-plan-limits { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.saas-plan-limits span { display: grid; gap: 2px; padding: 9px; border-radius: 10px; background: #f5f7fb; font-size: .72rem; color: var(--muted); }
.saas-plan-limits strong { color: var(--ink); font-size: .86rem; }
.subscription-editor { margin: 20px 0; padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(135deg,#f8f9ff,#fff); }
.subscription-plan-summary { display: grid; gap: 4px; margin-top: 12px; padding: 13px; border-radius: 12px; color: #2f3f64; background: #edf1ff; }
.subscription-plan-summary span { font-size: .78rem; }
.subscription-summary,.dns-summary { display: grid; gap: 2px; margin-top: 9px; font-size: .75rem; }
.subscription-summary span,.dns-summary span { color: var(--muted); }
.plan-usage-grid { display: grid; grid-template-columns: repeat(3,minmax(105px,1fr)); gap: 8px; margin-top: 12px; }
.plan-usage-grid > div { display: grid; gap: 5px; }
.plan-usage-grid span { display: flex; justify-content: space-between; gap: 8px; font-size: .68rem; }
.plan-usage-grid i { height: 5px; overflow: hidden; border-radius: 999px; background: #e9edf4; }
.plan-usage-grid b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--brand),#ff9a54); }
.badge.subscription-suspensa,.badge.subscription-vencida { color: #a51d2a; background: #ffe9eb; }
.badge.subscription-teste { color: #744b00; background: #fff3cf; }
.badge.subscription-ativa { color: #087b4e; background: #ddf8ec; }
.badge.subscription-cortesia { color: #435071; background: #e9edf8; }
.saas-toolbar { display:grid; grid-template-columns:minmax(260px,1fr) 190px 190px; gap:14px; margin:18px 0; }
.saas-toolbar .field { margin:0; }
.saas-health { display:flex; align-items:center; gap:10px; margin-top:10px; font-size:.72rem; }
.saas-health > span { width:min(180px,45vw); height:7px; overflow:hidden; border-radius:999px; background:#e8ebf1; }
.saas-health i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--brand),#24b47e); }
.saas-alert { margin-top:6px; color:var(--danger); }
.saas-audit-card { margin-top:24px; }
.saas-audit-row { display:flex; justify-content:space-between; gap:16px; padding:12px 0; border-top:1px solid var(--line); }
.saas-audit-row > div:first-child { display:grid; gap:3px; }
.module-presets { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 12px; }
.saas-user-form { display:grid; gap:16px; margin-top:18px; }
.store-identity h3 { margin:0; }
.module-selector { margin: 10px 0 20px; padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: #f8f9fc; }
.module-selector .section-head { margin-bottom: 14px; }
.module-selector h3, .module-selector p { margin-bottom: 4px; }
.module-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.module-option { position: relative; display: flex; gap: 11px; min-height: 78px; padding: 13px; border: 1px solid #e2e6ee; border-radius: 14px; background: white; cursor: pointer; transition: border-color .18s, box-shadow .18s, transform .18s; }
.module-option:hover { transform: translateY(-1px); border-color: color-mix(in srgb, var(--brand) 42%, var(--line)); box-shadow: 0 8px 22px rgba(28,39,64,.07); }
.module-option:has(input:checked) { border-color: color-mix(in srgb, var(--brand) 58%, white); background: color-mix(in srgb, var(--brand) 5%, white); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--brand) 16%, transparent); }
.module-option input { flex: 0 0 auto; margin-top: 3px; accent-color: var(--brand); }
.module-option span { display: grid; align-content: start; gap: 4px; }
.module-option small { color: var(--muted); line-height: 1.35; }
.compact-settings { gap: 5px 20px; margin-bottom: 16px; }
.store-identity { min-width: 0; }
.store-type-badge { color: #5b4bc4; background: #efedff; }
.store-modules { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 10px; }
.store-modules span { padding: 4px 7px; border-radius: 7px; background: #f0f2f6; color: #596275; font-size: .68rem; font-weight: 800; }
.store-stat { text-align: center; }
.store-stat strong { display: block; }
.action-row { display: flex; gap: 8px; flex-wrap: wrap; }
.user-list { display: grid; gap: 9px; margin: 18px 0; }
.user-row { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 12px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; }
.option-group { padding: 16px 0; border-top: 1px solid var(--line); }
.option-group:first-child { border-top: 0; padding-top: 4px; }
.option-list { display: grid; gap: 8px; }
.option-row { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 11px; padding: 12px; border: 1px solid var(--line); border-radius: 11px; cursor: pointer; background: white; }
.option-row:has(input:checked) { border-color: var(--brand); background: color-mix(in srgb, var(--brand) 7%, white); }
.pizza-builder-grid { display: grid; grid-template-columns: minmax(260px, .85fr) 1.15fr; gap: 22px; align-items: start; }
.pizza-stage { position: sticky; top: 94px; display: grid; justify-items: center; text-align: center; gap: 8px; }
.pizza-visual { width: min(100%, 330px); aspect-ratio: 1; filter: drop-shadow(0 18px 22px rgba(91,52,23,.16)); transition: transform .2s; }
.pizza-visual:hover { transform: scale(1.02) rotate(1deg); }
.pizza-size-options { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
.pizza-size-card { display: grid; gap: 4px; text-align: left; border: 1px solid var(--line); border-radius: 13px; padding: 14px; background: white; color: var(--ink); }
.pizza-size-card span { color: var(--muted); font-size: .84rem; }
.pizza-size-card b { color: var(--brand); }
.pizza-size-card:hover, .pizza-size-card.active { border-color: var(--brand); box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 12%, transparent); }
.store-hero-content { display: flex; align-items: center; gap: 24px; }
.store-logo-hero { width: clamp(90px, 13vw, 150px); height: clamp(90px, 13vw, 150px); flex: 0 0 auto; display: grid; place-items: center; border-radius: var(--card-radius); background: var(--paper); border: 1px solid var(--line); padding: 10px; box-shadow: 0 15px 45px #38291d14; }
.store-logo-hero img { width: 100%; height: 100%; object-fit: contain; }
.info-row { display: grid; grid-template-columns: 120px 1fr; gap: 16px; padding: 13px 0; border-top: 1px solid var(--line); }
.info-row a { color: var(--brand); font-weight: 750; }
.tracking-page { padding: 34px 0 72px; }
.tracking-hero { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 18px; }
.tracking-hero h1 { margin: 7px 0 10px; }
.tracking-status {
  flex: 0 0 auto; max-width: 260px; padding: 13px 18px; border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 12%, white); color: var(--brand);
  font-size: 1.05rem; font-weight: 900; text-align: center;
}
.tracking-status.cancelled { background: #f8e9e9; color: var(--danger); }
.tracking-timeline { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.timeline-step { position: relative; display: grid; justify-items: center; gap: 9px; color: var(--muted); text-align: center; }
.timeline-step:not(:last-child)::after {
  content: ""; position: absolute; z-index: 0; top: 17px; left: calc(50% + 21px);
  width: calc(100% - 34px); height: 3px; border-radius: 3px; background: var(--line);
}
.timeline-step.completed:not(:last-child)::after { background: var(--brand); }
.timeline-dot {
  position: relative; z-index: 1; display: grid; place-items: center; width: 36px; height: 36px;
  border: 2px solid var(--line); border-radius: 50%; background: var(--paper); font-weight: 900;
}
.timeline-step.completed, .timeline-step.active { color: var(--ink); }
.timeline-step.completed .timeline-dot { border-color: var(--brand); background: var(--brand); color: white; }
.timeline-step.active .timeline-dot { border-color: var(--brand); color: var(--brand); box-shadow: 0 0 0 5px color-mix(in srgb, var(--brand) 13%, transparent); }
.timeline-step small { display: block; margin-top: 5px; line-height: 1.35; color: var(--muted); }
.tracking-columns { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); gap: 18px; margin-top: 18px; align-items: start; }
.tracking-item { display: flex; justify-content: space-between; gap: 18px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.action-stack { display: grid; gap: 9px; margin-top: 18px; }
.action-stack .btn { width: 100%; text-align: center; text-decoration: none; }
.whatsapp-button { background: #168b4a; }
.whatsapp-suggestion { margin: 18px 0; padding: 16px; border: 1px solid #bde5cc; border-radius: var(--card-radius); background: #effaf3; }
.whatsapp-suggestion p { margin: 6px 0 13px; }
.whatsapp-suggestion .btn { display: block; width: 100%; color: white; text-decoration: none; }
.active-orders-section { padding-top: 26px; }
.active-orders-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.active-orders-head h2 { margin: 5px 0 12px; }
.active-orders-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.active-order-card { display: flex; align-items: center; justify-content: space-between; gap: 18px; color: var(--ink); text-decoration: none; }
.active-order-card > div { display: grid; gap: 5px; }
.active-order-card > div:last-child { justify-items: end; text-align: right; }
.active-order-card:hover { border-color: var(--brand); transform: translateY(-1px); }
.active-order-status { color: var(--brand); font-size: .84rem; font-weight: 850; }
.orders-empty { grid-column: 1 / -1; padding: 42px 20px; text-align: center; }
.orders-empty p { max-width: 540px; margin: 9px auto 18px; line-height: 1.5; }
.delivery-settings { margin: 18px 0; background: color-mix(in srgb, var(--brand) 4%, var(--paper)); }
.delivery-tiers-list { display: grid; gap: 8px; margin-bottom: 14px; }
.delivery-tier-row { display: grid; grid-template-columns: auto minmax(90px, .6fr) auto minmax(100px, .6fr) auto; align-items: center; gap: 9px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 11px; background: var(--paper); }
.delivery-tier-row input { width: 100%; border: 1px solid #dcd4cc; border-radius: 9px; padding: 9px 10px; }
.delivery-quote { display: grid; gap: 3px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 11px; background: white; }
.delivery-quote.success { border-color: #9ed5b5; background: #effaf3; color: var(--success); }
.delivery-quote.error { border-color: #e4b7b7; background: #fff3f3; color: var(--danger); }
.delivery-quote span { font-size: .82rem; color: var(--muted); }
.new-order-flash { animation: order-flash .7s ease-in-out 3; }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.control-select { min-width: 180px; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: white; }
.product-admin-name { display: flex; align-items: center; gap: 12px; min-width: 230px; }
.product-admin-name img { width: 58px; height: 58px; object-fit: cover; border-radius: 7px; background: white; }
.product-photo-preview { min-height: 140px; display: grid; place-items: center; border: 1px dashed var(--line); border-radius: 8px; margin-bottom: 14px; color: var(--muted); background: white; }
.product-photo-preview img { max-width: 100%; max-height: 210px; object-fit: contain; }
.promotion-admin-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin-top: 16px; }
.promotion-admin-item { display: grid; gap: 8px; padding: 8px; border: 1px solid var(--line); border-radius: 8px; background: white; }
.promotion-admin-item img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; background: white; }
.order-password { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; padding: 8px 10px; border: 2px solid var(--ink); border-radius: 7px; font-weight: 800; }
.order-password strong { font-size: 1.5rem; }
.password-control { margin-bottom: 18px; padding: 18px; border-radius: 22px; background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,246,240,.92)); box-shadow: var(--shadow); }
.password-control-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; }
.password-control-card { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 12px; padding: 14px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.password-control-card .action-row { grid-column: 1 / -1; justify-content: flex-end; }
.password-control-card.is-ready { border-color: rgba(11,154,101,.35); background: #f1fcf8; }
.password-control-number { display: grid; place-items: center; min-width: 78px; padding: 8px; border-radius: 16px; background: var(--brand-soft); color: var(--brand); font-weight: 900; }
.password-control-number span { font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; }
.password-control-number strong { font-size: 2rem; line-height: 1; }
.print-frame { position: fixed; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

.kitchen-page { background: #f1f1ef; color: #181818; }
.kitchen-header { min-height: 86px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 24px; background: white; border-bottom: 1px solid #d8d8d5; }
.kitchen-header h1 { margin: 3px 0 0; font-size: 2rem; letter-spacing: 0; }
.kitchen-board { display: grid; grid-template-columns: repeat(4, minmax(280px, 1fr)); gap: 14px; padding: 18px; min-height: calc(100vh - 86px); overflow-x: auto; }
.kitchen-column { min-width: 280px; padding: 12px; border-radius: 8px; background: #e2e2df; }
.kitchen-column > header { display: flex; justify-content: space-between; align-items: center; padding: 4px 4px 12px; }
.kitchen-column h2 { margin: 0; font-size: 1.12rem; letter-spacing: 0; }
.kitchen-column > header strong { min-width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: white; }
.kitchen-order { padding: 15px; margin-bottom: 10px; border: 1px solid #d0d0cc; border-radius: 8px; background: white; box-shadow: 0 4px 14px #0000000c; }
.kitchen-order-head { display: flex; justify-content: space-between; gap: 12px; }
.kitchen-order-head > div { display: flex; gap: 10px; align-items: center; }
.kitchen-order-head strong { font-size: 1.25rem; }
.kitchen-order-head span { padding: 4px 7px; border-radius: 5px; background: #efefec; font-weight: 800; }
.kitchen-order h3 { margin: 12px 0 9px; }
.kitchen-items { display: grid; gap: 8px; }
.kitchen-items > div { padding-bottom: 8px; border-bottom: 1px solid #ececea; }
.kitchen-items small, .kitchen-items em { display: block; margin: 3px 0 0 22px; color: #60605d; font-style: normal; }
.kitchen-note { padding: 9px; margin: 10px 0; border-left: 4px solid #e0a000; background: #fff8df; }
.kitchen-action { width: 100%; margin-top: 12px; }
.kitchen-courier { width: 100%; margin-top: 12px; padding: 10px; border: 1px solid #cfcfcb; border-radius: 7px; background: white; }
.kitchen-dispatch { width: 100%; margin-top: 8px; }

.password-page { min-height: 100vh; overflow: hidden; background: #f3f4f2; color: #111; }
.password-header { height: 11vh; min-height: 76px; display: grid; grid-template-columns: 100px 1fr 120px; align-items: center; gap: 18px; margin: 14px 18px 0; padding: 10px 24px; border: 0; border-radius: 18px; background: rgba(255,255,255,.92); box-shadow: 0 12px 32px rgba(0,0,0,.06); }
.password-header h1 { margin: 0; text-align: center; font-size: clamp(1.6rem, 3vw, 2.5rem); letter-spacing: 0; }
.password-header img { max-width: 90px; max-height: 8vh; object-fit: contain; }
.password-header time { text-align: right; font-size: 1.25rem; font-weight: 800; }
.password-current-call { margin: 14px 18px 0; padding: 16px 22px; border-radius: 22px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 18px; background: #111; color: #fff; box-shadow: 0 18px 44px rgba(0,0,0,.18); }
.password-current-call span, .password-current-call small { font-weight: 900; text-transform: uppercase; letter-spacing: .08em; }
.password-current-call strong { text-align: center; font-size: clamp(3rem, 8vw, 6.5rem); line-height: .9; color: #ffd400; }
.password-current-call small { text-align: right; }
.password-current-call.is-new-call { animation: passwordPulse 1s ease-in-out 2; }
.password-grid { height: calc(89vh - 28px); display: grid; grid-template-columns: 1fr 1fr 1.15fr; gap: 18px; padding: 18px; background: transparent; }
body:has(.password-current-call:not(.hidden)) .password-grid { height: calc(72vh - 28px); }
@keyframes passwordPulse {
  0%, 100% { transform: scale(1); box-shadow: 0 18px 44px rgba(0,0,0,.18); }
  50% { transform: scale(1.015); box-shadow: 0 24px 60px rgba(239,108,53,.35); }
}
.password-column { min-width: 0; padding: 18px; border: 0; border-radius: 20px; background: rgba(255,255,255,.9); box-shadow: 0 16px 38px rgba(0,0,0,.065); }
.password-column.promotions { padding: 0; border-radius: 0; background: transparent; box-shadow: none; }
.password-column h2 { margin: 0 0 16px; padding-bottom: 12px; border-bottom: 3px solid #222; text-align: center; font-size: clamp(1.4rem, 2.4vw, 2rem); letter-spacing: 0; }
.password-column.ready h2 { color: #087a3f; border-color: #087a3f; }
.password-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.password-item { display: grid; place-items: center; min-height: 105px; padding: 10px; border: 2px solid #d7d7d7; border-radius: 8px; background: white; }
.password-item strong { font-size: clamp(2.2rem, 5vw, 4.7rem); line-height: .95; }
.password-item span { margin-top: 7px; font-weight: 800; color: #5d5d5d; }
.password-item.is-ready { border: 4px solid #087a3f; color: #087a3f; }
.password-promotion { height: 100%; display: grid; place-items: center; background: transparent; }
.password-promotion img { width: 100%; height: 100%; object-fit: contain; background: transparent; }
.password-empty { align-self: center; text-align: center; color: #777; }
.password-disabled { min-height: 89vh; display: grid; place-items: center; padding: 30px; font-size: 1.5rem; font-weight: 800; background: white; }
@keyframes order-flash {
  50% { filter: drop-shadow(0 0 12px color-mix(in srgb, var(--brand) 45%, transparent)); }
}

@media (max-width: 850px) {
  .layout { grid-template-columns: 1fr; }
  .cart { position: static; }
  .floating-cart { right: 16px; bottom: 16px; width: 58px; height: 58px; }
  .login-page { grid-template-columns: 1fr; }
  .login-art { display: none; }
  .shell { grid-template-columns: 1fr; }
  .sidebar { position: static; padding: 15px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 12px; }
  .sidebar .brand { grid-column: 1; grid-row: 1; }
  .sidebar nav { grid-column: 1 / -1; grid-row: 2; display: flex; overflow-x: auto; gap: 8px; padding-bottom: 5px; }
  .nav-group { flex: 0 0 auto; min-width: 158px; align-self: start; }
  .nav-group-toggle { color: #b7aaa0; }
  .sidebar-footer { grid-column: 2; grid-row: 1; margin: 0; }
  .main-header, .content { padding-left: 18px; padding-right: 18px; }
  .settings-grid { grid-template-columns: 1fr; }
  .metric-grid { grid-template-columns: 1fr 1fr; }
  .insights-grid, .report-grid { grid-template-columns: 1fr; }
  .management-grid { grid-template-columns:1fr; }
  .hours-row { grid-template-columns: 1fr 1fr; }
  .hours-row .switch-line { grid-column: 1 / -1; }
  .store-card { grid-template-columns: 1fr; }
  .saas-toolbar { grid-template-columns:1fr; }
  .saas-audit-row { align-items:flex-start; flex-direction:column; }
  .store-stat { text-align: left; display: flex; gap: 7px; }
  .pizza-builder-grid { grid-template-columns: 1fr; }
  .pizza-stage { position: static; }
  .tracking-timeline { grid-template-columns: 1fr; gap: 14px; }
  .timeline-step { grid-template-columns: 36px 1fr; justify-items: start; text-align: left; }
  .timeline-step:not(:last-child)::after { top: 39px; left: 17px; width: 3px; height: calc(100% - 23px); }
  .tracking-columns { grid-template-columns: 1fr; }
  .active-orders-list { grid-template-columns: 1fr; }
  .kitchen-board { grid-template-columns: repeat(4, minmax(280px, 1fr)); }
  .password-list { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .product-grid { grid-template-columns: 1fr; }
  .topbar-inner { min-height: 60px; }
  .customer-nav-wrap { top: 60px; }
  .hero { padding-top: 32px; }
  .container { width: min(100% - 22px, 1160px); }
  .store-hero-content { align-items: flex-start; }
  .store-logo-hero { width: 78px; height: 78px; }
  .info-row { grid-template-columns: 1fr; gap: 4px; }
  .customer-nav-button { padding: 9px 12px; font-size: .86rem; }
  .settings-actions { flex-direction: column-reverse; }
  .settings-actions .btn { width: 100%; }
  .tracking-hero { align-items: flex-start; flex-direction: column; }
  .tracking-status { max-width: none; width: 100%; }
  .active-order-card { align-items: flex-start; }
  .delivery-tier-row { grid-template-columns: auto 1fr auto; }
  .delivery-tier-row [data-tier-value] { grid-column: 2; }
  .delivery-tier-row .icon-btn { grid-column: 3; grid-row: 1 / span 2; }
  .customer-identification-row { grid-template-columns:1fr; }
}
@media (max-width: 480px) {
  .saas-page-head { align-items: stretch; flex-direction: column; }
  .saas-page-head .btn { width: 100%; }
  #saas-admin-name { display: none; }
  #saas-app .topbar-inner { gap: 8px; }
  #saas-app .topbar-inner .brand { min-width: 0; font-size: .86rem; }
  .metric-grid { grid-template-columns: 1fr; }
  .metric-card { min-width: 0; }
  .metric-card strong { overflow-wrap: anywhere; }
}

/* Interface 2026 — sistema visual inspirado em operações modernas de delivery */
:root {
  --brand: #ff6b35;
  --secondary: #17213b;
  --ink: #182033;
  --muted: #697386;
  --line: #e7eaf0;
  --paper: #ffffff;
  --canvas: #f5f7fb;
  --success: #0b9a65;
  --danger: #dc3545;
  --card-radius: 18px;
  --shadow: 0 12px 38px rgba(28, 39, 64, .08);
  --shadow-hover: 0 18px 45px rgba(28, 39, 64, .14);
}
body { background: var(--canvas); }
.btn { min-height: 43px; border-radius: 12px; box-shadow: 0 8px 20px color-mix(in srgb, var(--brand) 18%, transparent); transition: transform .18s ease, box-shadow .18s ease, filter .18s ease; }
.btn:hover { transform: translateY(-2px); filter: saturate(1.08); box-shadow: 0 12px 26px color-mix(in srgb, var(--brand) 25%, transparent); }
.btn-secondary { box-shadow: none; }
.btn-secondary:hover { border-color: color-mix(in srgb, var(--brand) 35%, var(--line)); }
.card, .insight-card, .metric-card, .table-wrap { border-color: #fff; box-shadow: var(--shadow); }
.field input, .field select, .field textarea, .control-select {
  min-height: 44px; border-color: #dfe3eb; border-radius: 12px; transition: border-color .18s, box-shadow .18s, background .18s;
}
.field input:hover, .field select:hover, .field textarea:hover, .control-select:hover { border-color: #c7cdd8; }
.modal { background: rgba(15, 23, 42, .68); backdrop-filter: blur(7px); }
.modal-card { border: 1px solid rgba(255,255,255,.75); box-shadow: 0 30px 80px rgba(15,23,42,.24); }

/* Painel */
.shell { grid-template-columns: 276px minmax(0, 1fr); }
.sidebar {
  position: sticky; top: 0; height: 100vh; overflow-y: auto; padding: 24px 17px;
  background:
    radial-gradient(circle at 10% 0%, rgba(108,92,231,.34), transparent 30%),
    linear-gradient(180deg, #18223d 0%, #10182c 100%);
  box-shadow: 12px 0 35px rgba(20, 29, 53, .10);
}
.sidebar .brand { padding: 0 10px 18px; font-size: 1.04rem; letter-spacing: -.02em; }
.sidebar .brand-mark { background: linear-gradient(135deg, #ff7a45, #ff4f65); box-shadow: 0 9px 22px rgba(255,107,53,.32); }
.sidebar .brand-mark-logo { background: transparent; box-shadow: 0 9px 22px rgba(20,31,54,.22); }
.nav-group-toggle { padding: 9px 11px 5px; color: #8590aa; }
.nav-group:has(.nav-button.active) .nav-group-toggle { color: #b9c3da; }
.nav-button {
  position: relative; display: flex; align-items: center; gap: 10px; min-height: 42px;
  padding: 10px 12px; color: #bdc6d9; border-radius: 12px; font-size: .89rem;
}
.nav-button::before { flex: 0 0 auto; width: 23px; text-align: center; font-size: 1rem; opacity: .78; }
.nav-button[data-page="dashboard"]::before { content: "⌂"; }
.nav-button[data-page="onboarding"]::before { content: "✓"; }
.nav-button[data-page="orders"]::before { content: "▤"; }
.nav-button[data-page="whatsapp"]::before { content: "◉"; }
.nav-button[data-page="couriers"]::before { content: "➤"; }
.nav-button[data-page="management"]::before { content: "♙"; }
.nav-button[data-page="reports"]::before { content: "▥"; }
.nav-button[data-page="menu"]::before { content: "◫"; }
.nav-button[data-page="appearance"]::before { content: "✦"; }
.nav-button[data-action="categories"]::before { content: "⌗"; }
.nav-button[data-page="pizza"]::before { content: "◉"; }
.nav-button[data-page="settings"]::before { content: "⚙"; }
.nav-button[data-page="hours"]::before { content: "◷"; }
.whatsapp-central-grid { display:grid; grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr); gap:18px; }
.whatsapp-status-head { display:flex; align-items:center; gap:13px; margin-bottom:20px; }
.whatsapp-status-head h3 { margin:3px 0 0; }
.whatsapp-status-dot { width:14px; height:14px; border-radius:50%; background:#98a2b3; box-shadow:0 0 0 6px #98a2b31c; }
.whatsapp-status-dot.status-conectado { background:#12a66a; box-shadow:0 0 0 6px #12a66a20; }
.whatsapp-status-dot.status-aguardando_login { background:#f0a020; box-shadow:0 0 0 6px #f0a02020; }
.whatsapp-status-dot.status-erro { background:#d92d20; box-shadow:0 0 0 6px #d92d2020; }
.whatsapp-status-details { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:0 0 18px; }
.whatsapp-status-details div { padding:12px; border-radius:12px; background:#f6f7fb; }
.whatsapp-status-details dt { color:var(--muted); font-size:.78rem; }
.whatsapp-status-details dd { margin:5px 0 0; font-weight:800; }
.whatsapp-steps { display:grid; gap:12px; padding-left:22px; color:var(--muted); }
.whatsapp-extension-card {
  display:flex; justify-content:space-between; align-items:center; gap:18px; margin-bottom:18px;
  background:
    radial-gradient(circle at 88% 20%, rgba(18,166,106,.18), transparent 30%),
    linear-gradient(135deg,#ffffff,#f4fff9);
  border:1px solid rgba(18,166,106,.16);
}
.whatsapp-extension-card h3 { margin:5px 0 6px; }
.whatsapp-extension-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:10px; }
.whatsapp-safety-note {
  margin:16px 0 0; padding:13px 14px; border-radius:14px;
  color:#19573b; background:#eafaf2; border:1px solid #c7f0dc; font-size:.9rem;
}
@media (max-width: 760px) {
  .whatsapp-central-grid { grid-template-columns:1fr; }
  .whatsapp-extension-card { align-items:flex-start; flex-direction:column; }
  .whatsapp-extension-actions { justify-content:flex-start; }
}
.connections-environment { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:12px; margin-bottom:18px; }
.connection-pill {
  min-width:0; padding:14px 16px; border:1px solid #e8ebf1; border-radius:18px;
  background:linear-gradient(135deg,#fff,rgba(108,92,231,.055)); box-shadow:0 8px 24px rgba(28,39,64,.06);
}
.connection-pill span { display:block; margin-bottom:5px; color:var(--muted); font-size:.74rem; font-weight:850; text-transform:uppercase; letter-spacing:.06em; }
.connection-pill strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink); font-size:.95rem; }
.connections-grid { display:grid; grid-template-columns:minmax(320px,.9fr) minmax(0,1.25fr); gap:18px; align-items:start; }
.connections-provider-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px; }
.connection-card { display:grid; gap:16px; }
.connection-card-head { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.connection-card-head h3 { margin:4px 0 5px; }
.connection-form { display:grid; gap:13px; }
.connection-form .btn { justify-self:start; }
@media (max-width: 980px) {
  .connections-grid { grid-template-columns:1fr; }
}
.sidebar-footer .nav-button::before { content: "↪"; }
.nav-button.active, .nav-button:hover { color: white; background: rgba(255,255,255,.085); }
.nav-button.active { background: linear-gradient(100deg, rgba(108,92,231,.34), rgba(255,255,255,.08)); box-shadow: inset 3px 0 #8b7cf6; }
.main { background: radial-gradient(circle at 90% 0%, rgba(108,92,231,.07), transparent 25%), var(--canvas); }
.main-header {
  position: sticky; top: 14px; z-index: 8; min-height: 76px; margin: 14px 20px 0;
  border-color: rgba(255,255,255,.75); box-shadow: 0 10px 34px rgba(28,39,64,.08);
}
.content { max-width: 1600px; width: 100%; margin: 0 auto; padding: 30px 32px 70px; }
.section-head h2 { margin-bottom: 5px; font-size: 1.6rem; }
.metric-grid { gap: 16px; }
.metric-card {
  position: relative; display: flex; align-items: center; gap: 15px; min-height: 112px; overflow: hidden;
  padding: 20px; background: white; transition: transform .2s ease, box-shadow .2s ease;
}
.metric-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); }
.metric-card::after { content: ""; position: absolute; z-index: 0; right: -42px; bottom: -44px; width: 100px; height: 100px; border-radius: 50%; background: var(--metric-soft, #f4f2ff); opacity: .7; pointer-events: none; }
.metric-card > * { position: relative; z-index: 1; }
.metric-icon { position: relative; z-index: 1; flex: 0 0 auto; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 15px; color: var(--metric-color, #6c5ce7); background: var(--metric-soft, #f0edff); font-size: 1.25rem; font-weight: 900; }
.metric-card > div:last-child { position: relative; z-index: 1; min-width: 0; }
.metric-card strong { font-size: clamp(1.45rem, 2.2vw, 1.85rem); }
.report-metric-card { display: block; min-width: 0; }
.report-metric-card > div { min-width: 0; }
.report-metric-card strong { max-width: calc(100% - 34px); overflow-wrap: anywhere; }
.report-metric-0 { --metric-soft: #efedff; }
.report-metric-1 { --metric-soft: #e6f8f1; }
.report-metric-2 { --metric-soft: #fff4d9; }
.report-metric-3 { --metric-soft: #eaf2ff; }
.metric-revenue { --metric-color: #0b9a65; --metric-soft: #e6f8f1; }
.metric-orders { --metric-color: #6c5ce7; --metric-soft: #efedff; }
.metric-ticket { --metric-color: #f59e0b; --metric-soft: #fff4d9; }
.metric-deliveries { --metric-color: #3b82f6; --metric-soft: #eaf2ff; }
.dashboard-visuals { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(300px, .85fr); gap: 16px; margin-bottom: 17px; }
.daily-insights-card { margin: 16px 0; }
.daily-insights-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:12px; }
.daily-insight-item { display:flex; justify-content:space-between; gap:12px; padding:14px; border-radius:16px; background:#f8f9fc; border:1px solid #edf0f6; }
.daily-insight-item span { display:block; margin-bottom:5px; color:#6c5ce7; font-size:.68rem; font-weight:900; text-transform:uppercase; letter-spacing:.08em; }
.daily-insight-item strong { display:block; margin-bottom:5px; color:var(--ink); }
.daily-insight-item p { margin:0; color:var(--muted); font-size:.86rem; line-height:1.42; }
.daily-insight-item em { align-self:flex-start; flex:0 0 auto; padding:5px 8px; border-radius:999px; background:#eef0f7; color:#596276; font-style:normal; font-size:.7rem; font-weight:900; }
.daily-insight-item.priority-alta { background:#fff3f0; border-color:#ffd9d0; }
.daily-insight-item.priority-alta em { background:#ffdfd8; color:#b42318; }
.daily-insight-item.priority-media { background:#fff9ea; border-color:#ffe9ad; }
.daily-insight-item.priority-media em { background:#ffedb8; color:#986900; }
.chart-card { min-height: 330px; }
.chart-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 15px; margin-bottom: 22px; }
.chart-head h3 { margin: 3px 0 0; }
.chart-kicker { color: #6c5ce7; font-size: .7rem; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
.chart-hint { padding: 6px 9px; border-radius: 9px; background: #f2f3f8; color: var(--muted); font-size: .73rem; font-weight: 800; }
.bar-chart { display: grid; gap: 17px; }
.bar-chart-row { display: grid; gap: 7px; }
.bar-chart-label { display: flex; justify-content: space-between; gap: 16px; font-size: .82rem; }
.bar-chart-label span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #475166; }
.bar-chart-label strong { flex: 0 0 auto; }
.bar-chart-track { height: 10px; overflow: hidden; border-radius: 999px; background: #edf0f5; }
.bar-chart-track span { display: block; width: var(--bar-size); height: 100%; border-radius: inherit; background: linear-gradient(90deg, #6c5ce7, #9b8cf8); animation: grow-bar .65s var(--bar-delay) both ease-out; transform-origin: left; }
@keyframes grow-bar { from { transform: scaleX(0); } }
.donut-chart-wrap { min-height: 225px; display: flex; align-items: center; justify-content: center; gap: 28px; }
.donut-chart { flex: 0 0 auto; width: 154px; aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%; transform: rotate(-60deg); box-shadow: inset 0 0 0 1px rgba(0,0,0,.03); }
.donut-chart > div { width: 96px; aspect-ratio: 1; display: grid; align-content: center; text-align: center; border-radius: 50%; background: white; transform: rotate(60deg); box-shadow: 0 5px 20px rgba(28,39,64,.08); }
.donut-chart strong { font-size: 1.7rem; line-height: 1; }
.donut-chart span { margin-top: 4px; color: var(--muted); font-size: .73rem; }
.donut-legend { flex: 1; display: grid; gap: 11px; }
.donut-legend > div { display: grid; grid-template-columns: 10px 1fr auto; align-items: center; gap: 8px; font-size: .78rem; }
.donut-legend i { width: 9px; height: 9px; border-radius: 50%; }
.insights-grid { gap: 16px; }
.insight-card { background: rgba(255,255,255,.95); transition: transform .2s ease, box-shadow .2s ease; }
.insight-card:hover { box-shadow: var(--shadow-hover); }
.insight-row span b { background: #efedff; color: #6c5ce7; }
.board { gap: 17px; }
.column { position: relative; min-height: 480px; padding: 14px; border: 1px solid #e8ebf1; background: rgba(241,243,248,.82); box-shadow: none; }
.column::before { content: ""; position: absolute; left: 14px; right: 14px; top: 0; height: 4px; border-radius: 0 0 6px 6px; background: var(--status-color, #6c5ce7); }
.column-title { align-items: center; padding: 8px 3px 15px; }
.column-title > span:last-child { min-width: 27px; height: 27px; display: grid; place-items: center; border-radius: 9px; color: var(--status-color, #6c5ce7); background: var(--status-soft, #efedff); font-size: .78rem; }
.status-novo { --status-color: #f97316; --status-soft: #fff0e6; }
.status-preparo { --status-color: #eab308; --status-soft: #fff8cf; }
.status-embalagem { --status-color: #3b82f6; --status-soft: #eaf2ff; }
.status-pronto { --status-color: #10b981; --status-soft: #e7f8f2; }
.order-card { border: 1px solid #eef0f4; border-left: 3px solid var(--status-color, #6c5ce7); box-shadow: 0 7px 20px rgba(28,39,64,.07); transition: transform .18s ease, box-shadow .18s ease; }
.order-card:hover { transform: translateY(-2px); box-shadow: 0 11px 26px rgba(28,39,64,.12); }
th { background: #f8f9fc; color: #667085; }
tbody tr { transition: background .15s ease; }
tbody tr:hover { background: #fafbff; }

/* Cardápio digital */
.topbar { background: rgba(255,255,255,.92); border-color: rgba(228,232,240,.9); }
.customer-nav-wrap { background: rgba(255,255,255,.94); }
.hero { position: relative; overflow: hidden; padding: 54px 0 34px; border: 0; background: linear-gradient(125deg, color-mix(in srgb, var(--brand) 17%, #fff) 0%, #fff 54%, color-mix(in srgb, var(--brand) 7%, #f2f5fb) 100%); }
.hero::after { content: ""; position: absolute; right: -80px; top: -150px; width: 360px; height: 360px; border-radius: 50%; background: color-mix(in srgb, var(--brand) 12%, transparent); filter: blur(2px); }
.store-hero-content { position: relative; z-index: 1; }
.delivery-area-banner {
  position: sticky; top: 0; z-index: 19; color: #fff;
  border-bottom: 1px solid rgba(255,255,255,.18);
  background: linear-gradient(110deg, #334155, #475569);
  box-shadow: 0 10px 28px rgba(15,23,42,.16);
}
.delivery-area-banner.inside { background: linear-gradient(110deg, #087443, #12a667); }
.delivery-area-banner.outside { background: linear-gradient(110deg, #a8222e, #d13a46); }
.delivery-area-banner.checking { background: linear-gradient(110deg, #2459a7, #3b82f6); }
html.delivery-area-blocked body { padding-top: var(--delivery-banner-offset, 64px); }
html.delivery-area-blocked .delivery-area-banner {
  position: fixed; inset: 0 0 auto; width: 100%;
  animation: delivery-area-alert .35s ease-out;
}
@keyframes delivery-area-alert {
  from { transform: translateY(-100%); }
  to { transform: translateY(0); }
}
.delivery-area-banner-inner { min-height: 64px; display: flex; align-items: center; gap: 13px; padding-top: 9px; padding-bottom: 9px; }
.delivery-area-pin { flex: 0 0 36px; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.16); font-size: 1.45rem; }
.delivery-area-copy { min-width: 0; flex: 1; display: grid; gap: 2px; }
.delivery-area-copy strong { line-height: 1.15; }
.delivery-area-copy span { font-size: .82rem; color: rgba(255,255,255,.86); }
.delivery-area-actions { display: flex; align-items: center; gap: 7px; }
.delivery-area-action, .delivery-area-close { border: 1px solid rgba(255,255,255,.42); color: #fff; background: rgba(255,255,255,.12); font-weight: 850; }
.delivery-area-action { min-height: 38px; padding: 8px 13px; border-radius: 10px; white-space: nowrap; }
.delivery-area-action:hover { background: rgba(255,255,255,.22); }
.delivery-area-action:disabled { cursor: progress; opacity: .72; }
.delivery-area-close { flex: 0 0 34px; width: 34px; height: 34px; border-radius: 50%; font-size: 1.2rem; }
.delivery-area-cep-form { display: grid; grid-template-columns: auto minmax(260px, 430px) 1fr; align-items: center; gap: 8px 13px; padding-top: 0; padding-bottom: 11px; }
.delivery-area-cep-form label { font-size: .78rem; font-weight: 850; }
.delivery-area-cep-form > div { display: flex; min-width: 0; }
.delivery-area-cep-form input { min-width: 0; flex: 1; height: 39px; padding: 8px 11px; border: 0; border-radius: 10px 0 0 10px; outline: 0; }
.delivery-area-cep-form button { min-height: 39px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.5); border-radius: 0 10px 10px 0; color: #fff; background: rgba(12,18,32,.24); font-weight: 850; }
.delivery-area-cep-form small { color: rgba(255,255,255,.78); font-size: .7rem; line-height: 1.3; }
.cart-area-blocked { display: grid; gap: 2px; margin-top: 12px; padding: 11px 12px; border: 1px solid #efabb1; border-radius: 11px; color: #9f1f2b; background: #fff2f3; }
.cart-area-blocked span { font-size: .78rem; line-height: 1.35; }
.hero.has-cover { min-height: clamp(280px, 38vw, 470px); display: flex; align-items: flex-end; padding-bottom: 38px; background-image: linear-gradient(180deg, rgba(12,18,32,.08) 20%, rgba(12,18,32,.78) 100%), var(--cover-image); background-position: center; background-size: cover; }
.hero.has-cover::after { display: none; }
.hero.has-cover .store-hero-content { color: white; }
.hero.has-cover .muted { color: rgba(255,255,255,.82); }
.hero.has-cover .eyebrow { color: #fff; }
.hero-store-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 16px; }
.hero-store-meta p { margin: 0; }
.hero.has-cover .hero-store-meta .badge { border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.16); color: white; backdrop-filter: blur(8px); }
.hero.has-cover .hero-store-meta .badge.closed { background: rgba(160,30,30,.42); color: white; }
.menu-integrated-nav { position: static; top: auto; margin-top: 18px; border: 0; background: transparent; backdrop-filter: none; }
.menu-integrated-nav .customer-nav { padding: 7px; border: 1px solid #e3e7ee; border-radius: 16px; background: rgba(255,255,255,.96); box-shadow: 0 10px 30px rgba(28,39,64,.07); backdrop-filter: blur(12px); }
.menu-integrated-nav .customer-nav-button { min-height: 43px; padding: 10px 17px; }
.menu-integrated-nav + .menu-toolbar { margin-top: 14px; }
.store-logo-hero { box-shadow: 0 16px 38px color-mix(in srgb, var(--brand) 18%, rgba(20,30,50,.08)); }
.menu-toolbar { position: relative; z-index: 3; display: flex; align-items: center; gap: 15px; margin-top: 24px; }
.menu-search { flex: 1; max-width: 640px; min-height: 52px; display: flex; align-items: center; gap: 12px; padding: 0 17px; border: 1px solid #e1e5ec; border-radius: 16px; background: white; box-shadow: 0 10px 30px rgba(28,39,64,.07); }
.menu-search > span { color: var(--brand); font-size: 1.55rem; line-height: 1; }
.menu-search input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--ink); }
.layout { gap: 30px; padding-top: 22px; }
.category-sticky { position: sticky; top: var(--delivery-banner-offset, 0px) !important; z-index: 8; margin-bottom: 24px; border: 1px solid #e4e7ee; border-radius: 14px; background: rgba(255,255,255,.96); box-shadow: 0 10px 28px rgba(28,39,64,.09); backdrop-filter: blur(12px); transition: top .2s ease; }
.current-category { width: 100%; min-height: 52px; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 0 17px; border: 0; border-radius: inherit; background: transparent; color: var(--ink); font-weight: 900; text-align: left; text-transform: uppercase; letter-spacing: .03em; }
.current-category-copy { display: grid; gap: 1px; }
.current-category-copy small { color: var(--muted); font-size: .68rem; font-weight: 750; letter-spacing: .02em; text-transform: none; }
.category-chevron { font-size: 1.3rem; transition: transform .2s ease; }
.category-sticky.open .category-chevron { transform: rotate(180deg); }
.category-nav.category-dropdown { position: absolute; top: calc(100% + 7px); left: 0; right: 0; max-height: 0; overflow: hidden; display: grid; gap: 4px; margin: 0; padding: 0 7px; border: 0; border-radius: 14px; background: white; box-shadow: 0 16px 40px rgba(28,39,64,.14); opacity: 0; transform: translateY(-7px); transition: max-height .24s ease, opacity .18s ease, transform .18s ease, padding .18s ease; }
.category-sticky.open .category-nav { max-height: min(55vh, 430px); overflow-y: auto; padding: 7px; opacity: 1; transform: translateY(0); }
.category-nav.category-dropdown a { padding: 12px 13px; border: 0; border-radius: 10px; background: transparent; box-shadow: none; }
.category-nav.category-dropdown a:hover, .category-nav.category-dropdown a.active { color: var(--brand); background: color-mix(in srgb, var(--brand) 9%, white); }
.category { scroll-margin-top: 82px; }
.menu-promotions { margin-top: 20px; }
.promo-carousel { position: relative; overflow: hidden; border-radius: 20px; box-shadow: var(--shadow); }
.promo-track { display: flex; transition: transform .48s cubic-bezier(.22,.75,.25,1); }
.promo-slide { position: relative; flex: 0 0 100%; min-height: 205px; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(190px, .65fr); align-items: center; padding: clamp(24px, 4vw, 42px); color: white; isolation: isolate; }
.promo-slide > div:first-child { position: relative; z-index: 2; max-width: 650px; }
.promo-slide span { font-size: .72rem; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; opacity: .84; }
.promo-slide h2 { margin: 7px 0 8px; color: white; font-size: clamp(1.65rem, 3.4vw, 2.65rem); line-height: 1; }
.promo-slide p { margin-bottom: 17px; color: rgba(255,255,255,.88); }
.promo-action { min-height: 39px; padding: 8px 14px; border: 0; border-radius: 10px; color: #17213b; background: white; font-weight: 900; }
.promo-free { background: linear-gradient(120deg, #168f47, #67c655); }
.promo-cashback { background: linear-gradient(120deg, #047857, #04a46d); }
.promo-offers { background: linear-gradient(120deg, #f4513b, #ff8b3d); }
.promo-pickup { background: linear-gradient(120deg, #5546c9, #3b82f6); }
.promo-art { position: relative; align-self: stretch; }
.promo-art i { position: absolute; display: block; border-radius: 50%; background: rgba(255,255,255,.16); box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); }
.promo-art i:nth-child(1) { width: 180px; height: 180px; right: -20px; top: -35px; }
.promo-art i:nth-child(2) { width: 95px; height: 95px; left: 0; bottom: -30px; }
.promo-art i:nth-child(3) { width: 46px; height: 46px; left: 42%; top: 20px; background: rgba(255,255,255,.3); }
.promo-arrow { position: absolute; z-index: 3; top: 50%; width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.42); border-radius: 50%; color: white; background: rgba(15,23,42,.22); font-size: 1.6rem; backdrop-filter: blur(8px); transform: translateY(-50%); }
.promo-prev { left: 12px; }
.promo-next { right: 12px; }
.promo-dots { min-height: 22px; display: flex; justify-content: center; gap: 6px; padding-top: 10px; }
.promo-dots button { width: 7px; height: 7px; padding: 0; border: 0; border-radius: 99px; background: #cbd0db; transition: width .2s, background .2s; }
.promo-dots button.active { width: 24px; background: var(--brand); }
.category-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; margin-bottom: 13px; }
.category-heading h2 { margin: 0; font-size: 1.45rem; }
.category-heading span { color: var(--muted); font-size: .78rem; font-weight: 750; white-space: nowrap; }
.product-grid { gap: 18px; }
.product { transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.product:hover, .product:focus-within { border-color: color-mix(in srgb, var(--brand) 38%, var(--line)); transform: translateY(-2px); }
.product { position: relative; overflow: hidden; min-height: 205px; border: 1px solid #eef0f4; transition: transform .2s ease, box-shadow .2s ease; }
.product:hover { transform: translateY(-4px); box-shadow: var(--shadow-hover); }
.product-image { aspect-ratio: 16 / 9; margin: -18px -18px 16px; width: calc(100% + 36px); object-fit: cover; border-radius: 0; }
.product h3 { margin-bottom: 8px; font-size: 1.08rem; }
.product .btn { min-height: 38px; padding: 8px 14px; }
.cart { top: 145px; overflow: hidden; border: 0; box-shadow: 0 18px 50px rgba(28,39,64,.11); }
.cart::before { content: ""; display: block; height: 5px; margin: -18px -18px 17px; background: linear-gradient(90deg, var(--brand), color-mix(in srgb, var(--brand) 55%, #6c5ce7)); }
.floating-cart { animation: float-cart 3s ease-in-out infinite; }
@keyframes float-cart { 50% { transform: translateY(-5px); } }
.active-order-card { border: 0; box-shadow: var(--shadow); transition: transform .18s, box-shadow .18s; }
.active-order-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); }

/* Login */
.login-page { grid-template-columns: minmax(480px, 1.12fr) minmax(420px, .88fr); background: white; }
.login-art { position: relative; isolation: isolate; overflow: hidden; padding: clamp(50px, 7vw, 110px); background: linear-gradient(145deg, #17213b 0%, #25255b 58%, #513b94 100%); }
.login-art::before { content: ""; position: absolute; inset: 0; z-index: -2; opacity: .14; background-image: linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(to bottom right, #000, transparent 78%); }
.login-art h1 { max-width: 700px; margin-top: 18px; font-size: clamp(2.7rem, 5vw, 5rem); }
.login-art .eyebrow { color: #ffc2a9; }
.login-brand-logo { width: min(290px, 54vw); max-height: 170px; object-fit: contain; object-position: left center; margin: 0 0 24px -8px; filter: drop-shadow(0 18px 36px rgba(0,0,0,.24)); }
.login-brand { color: #0d1835; font-size: 1.05rem; letter-spacing: -.01em; }
.login-brand .brand-mark { width: 48px; height: 48px; }
.login-orb { position: absolute; z-index: -1; border-radius: 50%; filter: blur(2px); }
.login-orb-one { width: 370px; height: 370px; right: -110px; top: -90px; background: rgba(255,107,53,.3); }
.login-orb-two { width: 260px; height: 260px; left: 18%; bottom: -150px; background: rgba(90,230,190,.16); }
.login-feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; max-width: 720px; margin-top: 46px; }
.login-feature-grid > div { display: grid; gap: 5px; padding: 17px; border: 1px solid rgba(255,255,255,.14); border-radius: 16px; background: rgba(255,255,255,.08); backdrop-filter: blur(10px); }
.login-feature-grid span { color: #ffb496; font-size: .72rem; font-weight: 900; }
.login-feature-grid strong { font-size: .88rem; }
.login-feature-grid small { color: #bfc7d9; line-height: 1.4; }
.login-panel { background: radial-gradient(circle at 100% 0%, #f1efff, transparent 35%), white; }
.login-box { padding: 32px; border: 1px solid #eef0f5; border-radius: 24px; background: rgba(255,255,255,.9); box-shadow: 0 24px 70px rgba(28,39,64,.10); }

/* Cozinha, acompanhamento e painel de senhas */
.kitchen-page { background: #f4f6fa; color: var(--ink); }
.kitchen-header { position: sticky; top: 0; z-index: 5; border: 0; box-shadow: 0 8px 25px rgba(28,39,64,.07); }
.kitchen-board { gap: 17px; padding: 20px; }
.kitchen-column { position: relative; overflow: hidden; border: 1px solid #e5e8ef; border-radius: 18px; background: #edf0f5; }
.kitchen-column::before { content: ""; position: absolute; inset: 0 0 auto; height: 5px; background: var(--status-color, #6c5ce7); }
.kitchen-column > header { padding: 9px 5px 14px; }
.kitchen-column > header strong { color: var(--status-color, #6c5ce7); background: var(--status-soft, white); }
.kitchen-order { border: 0; border-left: 4px solid var(--status-color, #6c5ce7); border-radius: 14px; box-shadow: 0 7px 22px rgba(28,39,64,.09); }
.tracking-card, .tracking-summary { box-shadow: var(--shadow); }
.timeline-dot { background: white; }
.password-page { background: radial-gradient(circle at 50% -20%, #e9e7ff, transparent 38%), #f4f6fa; }
.password-header, .password-column { border: 1px solid rgba(255,255,255,.85); box-shadow: var(--shadow); }
.password-item { border: 0; border-left: 5px solid #6c5ce7; border-radius: 14px; box-shadow: 0 7px 20px rgba(28,39,64,.08); }
.password-item.is-ready { border: 0; border-left: 6px solid #0b9a65; background: #f1fcf8; }

@media (max-width: 1180px) {
  .dashboard-visuals { grid-template-columns: 1fr; }
  .chart-card { min-height: 0; }
  .donut-chart-wrap { min-height: 190px; }
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 850px) {
  .shell { display: block; }
  .sidebar {
    position: relative; top: 0; z-index: 15; width: 100%; height: auto;
    overflow: hidden; display: grid; grid-template-columns: 1fr auto;
    gap: 9px 12px; padding: 11px 14px 10px; background: #17213b;
  }
  .sidebar .brand { padding: 0; }
  .sidebar nav {
    grid-column: 1 / -1; display: flex; gap: 6px; width: 100%;
    margin: 0; padding: 2px 0 5px; overflow-x: auto; scrollbar-width: thin;
  }
  .sidebar .nav-group { display: contents; }
  .sidebar .nav-group-toggle { display: none; }
  .sidebar .nav-submenu { display: contents !important; }
  .sidebar .nav-button {
    width: auto; min-height: 39px; flex: 0 0 auto; padding: 8px 12px;
    white-space: nowrap;
  }
  .sidebar-footer { grid-column: 2; grid-row: 1; margin: 0; }
  .main-header { position: relative; top: 0; flex-wrap: wrap; margin: 14px; }
  .main-header .action-row { order: 3; width: 100%; overflow-x: auto; }
  .content { padding: 22px 16px 60px; }
  .board { grid-template-columns: repeat(4, minmax(260px, 1fr)); }
  .category-sticky { top: 68px; }
  .login-page { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .metric-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .metric-card { min-height: 96px; padding: 14px; gap: 10px; }
  .metric-icon { width: 38px; height: 38px; border-radius: 12px; }
  .metric-card strong { font-size: 1.2rem; }
  .dashboard-visuals { gap: 12px; }
  .donut-chart-wrap { flex-direction: column; }
  .insight-card { padding: 16px; }
  .section-head { align-items: flex-start; flex-direction: column; }
  .section-head .control-select { width: 100%; }
  .menu-toolbar { margin-top: 15px; }
  .menu-search { min-height: 48px; }
  .layout { padding-top: 16px; }
  .category-sticky { top: 64px; }
  .menu-integrated-nav { margin-top: 12px; }
  .menu-integrated-nav .customer-nav { border-radius: 13px; }
  .menu-integrated-nav .customer-nav-button { min-height: 39px; padding: 9px 12px; }
  .banner-preset-grid { grid-template-columns: 1fr 1fr; }
  .promo-slide { min-height: 230px; grid-template-columns: 1fr; padding: 25px 28px; }
  .promo-art { position: absolute; inset: 0; z-index: -1; opacity: .7; }
  .promo-arrow { width: 34px; height: 34px; }
  .promo-prev { left: 7px; }
  .promo-next { right: 7px; }
  .product-image { margin: -18px -18px 14px; }
  .login-box { padding: 24px 20px; border: 0; box-shadow: none; }
  .login-panel { padding: 20px; }
  .module-grid { grid-template-columns: 1fr; }
}

/* Editor completo do cardápio */
.appearance-workspace { display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, .72fr); align-items: start; gap: 20px; }
.appearance-controls { display: grid; gap: 16px; }
.appearance-section h3 { margin-bottom: 16px; }
.appearance-upload-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.appearance-preview-panel { position: sticky; top: 110px; overflow: hidden; border: 1px solid #e4e7ee; border-radius: 20px; background: #eef1f6; box-shadow: var(--shadow); }
.appearance-preview-head { display: flex; justify-content: space-between; padding: 13px 16px; background: white; border-bottom: 1px solid var(--line); }
.appearance-preview { --preview-brand:#ef6c35; --preview-secondary:#2b2118; --preview-bg:#f5f2ee; --preview-card:#fffdfb; --preview-text:#25221f; --preview-columns:2; overflow: hidden; padding-bottom: 18px; color: var(--preview-text); background: var(--preview-bg); }
.preview-cover { position: relative; isolation: isolate; min-height: var(--preview-cover-height, 122px); overflow: hidden; display: flex; align-items: end; gap: 11px; padding: 18px; color: white; background: var(--preview-secondary); transition: min-height .2s; }
.preview-cover::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(135deg, var(--preview-secondary), var(--preview-brand)); opacity:var(--preview-cover-opacity, 1); }
.preview-cover h3 { margin: 2px 0 0; font-size: 1.25rem; }
.preview-logo { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 12px; color: var(--preview-brand); background: white; font-weight: 950; }
.preview-nav { padding: 10px 14px; color: var(--preview-brand); background: white; font-size: .58rem; font-weight: 900; word-spacing: 7px; }
.preview-search { margin: 13px; padding: 10px 12px; border-radius: 10px; color: #7b8495; background: white; font-size: .7rem; }
.preview-category { margin: 0 13px 10px; font-size: .69rem; font-weight: 950; }
.preview-products { display: grid; grid-template-columns: repeat(var(--preview-columns), minmax(0,1fr)); gap: 8px; padding: 0 13px; }
.preview-products article { min-width: 0; display: grid; gap: 5px; padding: 9px; border-radius: 11px; background: var(--preview-card); }
.preview-products article strong, .preview-products article b { font-size: .67rem; }
.preview-products article p { margin: 0; color: #778093; font-size: .56rem; line-height: 1.3; }
.preview-product-image { aspect-ratio: 16 / 9; border-radius: 7px; background: linear-gradient(135deg, var(--preview-brand), #ffd49f); }
.preview-product-image.alt { background: linear-gradient(135deg, #ffc857, var(--preview-secondary)); }
.appearance-preview[data-ratio="quadrada"] .preview-product-image { aspect-ratio: 1; }
.appearance-preview[data-ratio="retrato"] .preview-product-image { aspect-ratio: 4 / 5; }
.appearance-preview[data-fit="contain"] .preview-product-image { margin: 4px; background-size: 70%; }
.appearance-preview[data-grayscale="true"] .preview-product-image { filter: grayscale(1); }
.appearance-preview[data-cover-grayscale="true"] .preview-cover::before { filter: grayscale(1); }
.appearance-preview[data-shadow="nenhuma"] .preview-products article { box-shadow: none; }
.appearance-preview[data-shadow="suave"] .preview-products article { box-shadow: 0 4px 12px #1c274014; }
.appearance-preview[data-shadow="forte"] .preview-products article { box-shadow: 0 8px 18px #1c27402e; }
.appearance-preview[data-border="reto"] .preview-products article, .appearance-preview[data-border="reto"] .preview-product-image { border-radius: 1px; }
.appearance-preview[data-border="suave"] .preview-products article, .appearance-preview[data-border="suave"] .preview-product-image { border-radius: 6px; }
.appearance-preview[data-density="compacta"] .preview-products article { padding: 6px; }
.appearance-preview[data-density="ampla"] .preview-products article { padding: 13px; gap: 8px; }
.appearance-preview[data-orientation="horizontal"] .preview-products { grid-template-columns: 1fr; }
.appearance-preview[data-orientation="horizontal"] .preview-products article { grid-template-columns: 90px 1fr; align-items: center; }
.appearance-preview[data-orientation="horizontal"] .preview-product-image { grid-row: 1 / span 4; }
.appearance-preview.hide-descriptions article p, .appearance-preview.hide-images .preview-product-image { display: none; }
.appearance-banners { grid-template-columns: 1fr 1fr; }
.appearance-banners .banner-preset-option { min-height: 94px; }
.product-image-manager { margin-top: 20px; }
.appearance-product-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(145px, 1fr)); gap: 12px; }
.appearance-product-item { min-width: 0; display: grid; gap: 7px; padding: 9px; border: 1px solid var(--line); border-radius: 13px; background: white; text-align: left; transition: transform .18s, border-color .18s, box-shadow .18s; }
.appearance-product-item:hover { transform: translateY(-2px); border-color: var(--brand); box-shadow: var(--shadow); }
.appearance-product-item img, .appearance-product-item > span { width: 100%; aspect-ratio: 4 / 3; display: grid; place-items: center; object-fit: cover; border-radius: 9px; background: #f1f3f7; color: var(--muted); }
.appearance-product-item strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.appearance-product-item small { color: var(--brand); font-weight: 800; }

/* Histórico individual dos motoboys */
.courier-history-button { display: grid; min-width: 0; padding: 4px 8px 4px 0; border: 0; border-radius: 10px; color: inherit; background: transparent; text-align: left; cursor: pointer; }
.courier-history-button:hover .courier-name-button,
.courier-history-button:focus-visible .courier-name-button { color: var(--brand); }
.courier-history-button:focus-visible { outline: 3px solid color-mix(in srgb, var(--brand) 28%, transparent); outline-offset: 3px; }
.courier-name-button { display: block; max-width: 100%; margin: 0 0 3px; color: var(--ink); font-weight: 900; text-align: left; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--brand) 38%, transparent); text-underline-offset: 4px; }
.courier-history-hint { margin-top: 6px; color: var(--brand); font-size: .72rem; font-weight: 800; }
.courier-history-modal-card { width: min(1080px, 100%); }
.courier-period-tabs { display: flex; gap: 7px; margin-bottom: 18px; padding: 5px; border-radius: 13px; background: #f0f2f6; }
.courier-period-tabs button { flex: 1; min-height: 40px; border: 0; border-radius: 9px; color: var(--muted); background: transparent; font-weight: 850; }
.courier-period-tabs button.active { color: white; background: var(--brand); box-shadow: 0 7px 18px color-mix(in srgb, var(--brand) 22%, transparent); }
.courier-metric-grid { margin-bottom: 16px; }
.courier-chart-card { min-height: 240px; }
.courier-history-chart { min-height: 145px; display: flex; align-items: end; justify-content: center; gap: clamp(8px, 2vw, 20px); padding: 10px 8px 0; border-bottom: 1px solid var(--line); }
.courier-chart-column { width: min(62px, 12vw); height: 135px; display: grid; grid-template-rows: 20px 1fr 24px; justify-items: center; align-items: end; gap: 4px; }
.courier-chart-column > span { width: min(34px, 7vw); min-height: 8px; border-radius: 8px 8px 2px 2px; background: linear-gradient(180deg, #8b7cf6, #6c5ce7); animation: grow-courier-bar .45s ease-out both; transform-origin: bottom; }
.courier-chart-column strong, .courier-chart-column small { font-size: .72rem; }
@keyframes grow-courier-bar { from { transform: scaleY(0); } }
.badge.status-progress { color: #9a6700; background: #fff4cf; }

/* Variáveis aplicadas ao cardápio público */
.container { width: min(var(--menu-container-width, 1160px), calc(100% - 32px)); }
.product-grid { grid-template-columns: repeat(var(--product-columns, 2), minmax(0, 1fr)); }
.hero.has-cover {
  min-height: var(--cover-height, 380px);
  isolation: isolate;
  background-color: var(--secondary);
  background-image: none;
}
.hero.has-cover::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image: var(--cover-image);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  opacity: var(--cover-opacity, 1);
  filter: grayscale(var(--cover-grayscale, 0));
  transform: scale(1.002);
  pointer-events: none;
}
.hero.has-cover::after {
  content: "";
  display: block;
  position: absolute;
  inset: 0;
  z-index: 1;
  width: auto;
  height: auto;
  border-radius: 0;
  background: linear-gradient(180deg, rgba(10,14,24,.08) 10%, rgba(10,14,24,.28) 52%, rgba(10,14,24,.88) 100%);
  filter: none;
  pointer-events: none;
}
.hero.has-cover > .container { position: relative; z-index: 2; }
html[data-image-fit="cover"] .product-image { object-fit: cover; }
html[data-image-fit="contain"] .product-image { object-fit: contain; }
html[data-images-grayscale="true"] .product-image { filter: grayscale(1); }
html[data-show-descriptions="false"] .product .description { display: none; }
html[data-show-product-images="false"] .product .product-image { display: none; }
html[data-card-shadow="nenhuma"] .product { box-shadow: none; }
html[data-card-shadow="suave"] .product { box-shadow: var(--shadow); }
html[data-card-shadow="forte"] .product { box-shadow: 0 20px 48px rgba(28,39,64,.2); }
html[data-card-density="compacta"] .product { min-height: 0; padding: 13px; }
html[data-card-density="compacta"] .product-image { margin: -13px -13px 11px; width: calc(100% + 26px); }
html[data-card-density="ampla"] .product { padding: 24px; }
html[data-card-density="ampla"] .product-image { margin: -24px -24px 20px; width: calc(100% + 48px); }
.product-image { aspect-ratio: var(--product-image-ratio, 16 / 9); }
html[data-card-orientation="horizontal"] .product {
  min-height: 150px; display: grid; grid-template-columns: var(--product-image-width, 145px) minmax(0,1fr);
  grid-template-rows: auto 1fr auto; align-items: start; column-gap: 16px;
}
html[data-card-orientation="horizontal"] .product .product-image {
  grid-column: 1; grid-row: 1 / span 3; width: 100%; height: 100%; min-height: 125px;
  margin: 0; border-radius: min(12px, var(--card-radius));
}
html[data-card-orientation="horizontal"] .product h3,
html[data-card-orientation="horizontal"] .product .description,
html[data-card-orientation="horizontal"] .product .product-footer { grid-column: 2; }
html[data-card-orientation="horizontal"] .product:not(:has(.product-image)) { grid-template-columns: 1fr; }
html[data-card-orientation="horizontal"] .product:not(:has(.product-image)) > * { grid-column: 1; }
html[data-category-navigation="chips"] .current-category { display: none; }
html[data-category-navigation="chips"] .category-sticky { border: 0; background: color-mix(in srgb, var(--canvas) 92%, transparent); box-shadow: none; }
html[data-category-navigation="chips"] .category-nav.category-dropdown {
  position: static; max-height: none; overflow-x: auto; display: flex; gap: 7px; padding: 7px 2px;
  opacity: 1; transform: none; border-radius: 0; background: transparent; box-shadow: none;
  scroll-padding-inline: 40%; scroll-snap-type: x proximity; scrollbar-width: none;
}
html[data-category-navigation="chips"] .category-nav.category-dropdown::-webkit-scrollbar { display: none; }
html[data-category-navigation="chips"] .category-nav.category-dropdown a {
  flex: 0 0 auto; padding: 10px 14px; border: 1px solid var(--line); border-radius: 999px; background: white;
  scroll-snap-align: center; transition: color .2s, border-color .2s, background .2s, box-shadow .2s;
}
html[data-category-navigation="chips"] .category-nav.category-dropdown a.active { color: white; border-color: var(--brand); background: var(--brand); box-shadow: 0 7px 18px color-mix(in srgb, var(--brand) 28%, transparent); }

.courier-app { min-height:100vh; margin:0; background:#f4f6fb; color:#121826; }
.courier-app-header { position:sticky; top:0; z-index:10; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px max(18px, env(safe-area-inset-left)); background:#121826; color:#fff; box-shadow:0 10px 28px #12182626; }
.courier-app-header h1 { margin:3px 0 0; font-size:clamp(22px,5vw,30px); }
.courier-app-main { width:min(720px,100% - 28px); margin:18px auto 60px; display:grid; gap:16px; }
.courier-location-card,.courier-delivery-card { background:#fff; border:1px solid #e6e9f0; border-radius:22px; padding:18px; box-shadow:0 12px 35px #19213b0d; }
.courier-location-card { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.courier-location-card p { margin:4px 0 0; color:#687188; font-size:13px; }
.courier-app-orders { display:grid; gap:14px; }
.courier-route-card { display:grid; grid-template-columns:1fr auto; gap:14px; align-items:center; margin-bottom:2px; background:linear-gradient(135deg,#121826,#233250); color:#fff; border-radius:24px; padding:18px; box-shadow:0 16px 38px rgba(18,24,38,.2); }
.courier-route-card p { margin:5px 0 0; color:rgba(255,255,255,.78); }
.courier-delivery-head { display:flex; justify-content:space-between; gap:12px; color:#687188; }
.courier-delivery-card h2 { margin:16px 0 7px; }
.courier-delivery-card p { color:#556078; }
.courier-delivery-card .action-row > * { flex:1; text-align:center; }
.courier-code-box { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:14px 0; padding:10px 12px; border-radius:14px; background:#f6f8fb; }
.courier-code-box span { color:#596579; font-size:.82rem; font-weight:800; }
.courier-code-box input { width:88px; border:1px solid #d8deea; border-radius:12px; padding:10px; font-size:1.2rem; font-weight:900; text-align:center; letter-spacing:.18em; }
.delivery-confirmation-code { display:inline-flex; align-items:center; justify-content:center; min-width:76px; padding:8px 12px; border-radius:12px; background:#121826; color:#fff; font-size:1.2rem; letter-spacing:.18em; font-weight:950; }
.order-chat-messages { display:grid; gap:10px; max-height:360px; overflow:auto; padding:10px; border:1px solid #e6e9f0; border-radius:16px; background:#f7f8fb; }
.order-chat-bubble { width:min(88%, 420px); padding:10px 12px; border-radius:14px; background:#fff; border:1px solid #e8ebf2; box-shadow:0 6px 18px rgba(28,39,64,.06); }
.order-chat-bubble.from-loja { margin-left:auto; background:#fff4ee; border-color:#ffd9c7; }
.order-chat-bubble.from-motoboy { margin-left:auto; background:#eef5ff; border-color:#cfe3ff; }
.order-chat-bubble.from-cliente { margin-right:auto; background:#fff; }
.order-chat-bubble strong { font-size:.78rem; color:#687188; }
.order-chat-bubble p { margin:5px 0; color:#182033; }
.order-chat-bubble small { color:#8a94a8; font-size:.68rem; }
.order-chat-form { display:flex; gap:10px; margin-top:12px; }
.order-chat-form input { flex:1; border:1px solid #d8deea; border-radius:13px; padding:12px 14px; }
.module-action-row { margin:16px 0; }
.inventory-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px; margin-bottom:18px; }
.inventory-low { border-color:#f2a4a4; background:#fff8f8; }
.inventory-balance { display:block; margin:12px 0 4px; font-size:32px; }
.integration-card .btn { width:100%; margin-top:12px; }
.success-text { color:#16875b; }
.error-text { color:#b53b3b; }
.users-workspace { display:grid; grid-template-columns:minmax(420px,.9fr) minmax(360px,1.1fr); gap:22px; align-items:start; }
.user-registration-card { display:grid; gap:20px; position:sticky; top:20px; }
.user-registration-card h3 { margin:5px 0; }
.user-registration-card .settings-grid { gap:15px; }
.user-registration-card .action-row { justify-content:flex-end; }
.user-password-field { grid-column:1 / -1; }
.manual-order-section { margin:16px 0; padding:16px; border:1px solid var(--line); border-radius:16px; background:#fafbfe; }
.manual-order-section .section-head { margin-bottom:14px; }
.manual-order-section h3 { margin:0; }
.manual-full-field { grid-column:1 / -1; }
.manual-delivery-quote { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:15px; padding:13px; border-radius:13px; background:#fff; }
.manual-delivery-quote > div { display:grid; gap:3px; text-align:right; }
.manual-delivery-quote strong { font-size:1.15rem; color:var(--brand); }
@media(max-width:600px) {
  .manual-delivery-quote { align-items:stretch; flex-direction:column; }
  .manual-delivery-quote > div { text-align:left; }
}
@media(max-width:1050px) {
  .users-workspace { grid-template-columns:1fr; }
  .user-registration-card { position:static; }
}
@media(max-width:540px) {
  .courier-location-card { align-items:flex-start; flex-direction:column; }
  .courier-location-card .btn { width:100%; }
  .courier-route-card { grid-template-columns:1fr; }
  .order-chat-form { flex-direction:column; }
}

@media (max-width: 1180px) {
  .appearance-workspace { grid-template-columns: 1fr; }
  .appearance-preview-panel { position: static; }
  .appearance-preview { max-width: 680px; margin: 0 auto; }
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .appearance-upload-grid, .appearance-banners { grid-template-columns: 1fr; }
  .product-grid { grid-template-columns: 1fr; }
  html[data-card-orientation="horizontal"] .product { grid-template-columns: min(34vw, var(--product-image-width, 145px)) minmax(0,1fr); }
}
@media (max-width: 600px) {
  .delivery-area-banner-inner { min-height: 0; display: grid; grid-template-columns: 30px minmax(0,1fr) 30px; gap: 7px 9px; padding: 9px 12px; }
  .delivery-area-pin { flex-basis: 30px; width: 30px; height: 30px; font-size: 1.1rem; }
  .delivery-area-copy { grid-column: 2; }
  .delivery-area-copy span { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: .75rem; }
  .delivery-area-actions { grid-column: 1 / -1; grid-row: 2; display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .delivery-area-action { padding: 7px 9px; font-size: .73rem; white-space: normal; }
  .delivery-area-close { grid-column: 3; grid-row: 1; flex-basis: 30px; width: 30px; height: 30px; }
  .delivery-area-cep-form { grid-template-columns: 1fr; gap: 6px; padding: 0 12px 10px; }
  .delivery-area-cep-form > div { width: 100%; }
  .delivery-area-cep-form small { font-size: .66rem; }
  .layout, .layout > *, #menu, .category-sticky, .category-nav, .cart { min-width: 0; max-width: 100%; }
  .category-sticky { top: 0; }
  html[data-category-navigation="chips"] .category-nav.category-dropdown { width: 100%; }
  .hero.has-cover {
    min-height: clamp(340px, 100vw, 420px);
    padding: clamp(125px, 36vw, 155px) 0 24px;
  }
  .hero.has-cover::before {
    background-position: center center;
  }
  .hero.has-cover .store-hero-content { align-items: center; }
  .hero.has-cover .store-logo-hero { width: 66px; height: 66px; }
  .menu-integrated-nav { width: min(100% - 22px, var(--menu-container-width, 1160px)); margin-left: auto; margin-right: auto; }
  .menu-integrated-nav .customer-nav {
    width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px; overflow: visible; padding: 6px;
  }
  .menu-integrated-nav .customer-nav-button { width: 100%; justify-content: center; white-space: normal; text-align: center; }
  .menu-integrated-nav + .menu-toolbar { width: min(100% - 22px, var(--menu-container-width, 1160px)); }
  .courier-period-tabs { display: grid; grid-template-columns: 1fr; }
  .courier-metric-grid { grid-template-columns: 1fr 1fr; }
  .courier-history-modal-card { padding: 17px; }
}
@media (max-width: 480px) {
  .metric-grid { grid-template-columns: 1fr; }
  .metric-card { min-width: 0; }
  .metric-card strong { overflow-wrap: anywhere; }
  .plan-usage-grid { grid-template-columns: 1fr; }
}

.event-preview { min-height: 120px; display: grid; place-items: center; overflow: hidden; border: 1px dashed var(--line); border-radius: 16px; background: #fff; color: var(--muted); }
.event-preview img { width: 100%; max-height: 220px; object-fit: cover; display: block; }
.operation-event-banner { margin-top: 18px; }
.operation-event-card { display: grid; grid-template-columns: minmax(170px, 280px) 1fr; gap: 20px; align-items: center; padding: 20px; border-radius: 24px; background: linear-gradient(135deg, #fff3ed, #fffdf9); border: 1px solid rgba(239,108,53,.18); box-shadow: var(--shadow); }
.operation-event-card img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 18px; }
.operation-event-card h2 { margin: 6px 0; font-size: clamp(1.4rem, 4vw, 2.4rem); }
.operation-event-card p { margin: 0 0 10px; color: var(--muted); line-height: 1.6; }
.operation-event-card strong { color: var(--brand); }
@media (max-width: 720px) {
  .operation-event-card { grid-template-columns: 1fr; }
}
