/* Painel do dono (ap-*). Depende dos tokens e componentes de vaninho.css */
.ap { display:grid; grid-template-columns:264px minmax(0,1fr); min-height:100vh; }
.ap-side { background:var(--ink); color:#A8A29E; position:sticky; top:0; height:100vh; padding:22px 14px 16px; display:flex; flex-direction:column; gap:4px; }
.ap-brand { display:flex; gap:12px; align-items:center; padding:2px 8px 24px; }
.ap-logo { width:42px; height:42px; border-radius:12px; background:var(--gold); color:var(--ink); display:grid; place-items:center; font-weight:900; font-size:21px; letter-spacing:-.04em; flex-shrink:0; }
.ap-brand b { display:block; color:#fff; font-size:15px; font-weight:800; letter-spacing:-.01em; line-height:1.2; } .ap-brand small { font-size:12px; color:#78716C; }
.ap-nav { display:flex; flex-direction:column; gap:3px; }
.ap-nav button { display:flex; align-items:center; gap:13px; padding:12px 13px; border-radius:12px; color:#A8A29E; font-weight:600; font-size:14.5px; background:transparent; border:0; cursor:pointer; text-align:left; width:100%; transition:background .15s, color .15s; }
.ap-nav button i { width:20px; text-align:center; font-size:16px; } .ap-nav button:hover { background:rgba(255,255,255,.06); color:#fff; }
.ap-nav button.on { background:rgba(245,184,0,.13); color:var(--gold); }
.ap-nav .ap-n { margin-left:auto; background:var(--gold); color:var(--ink); font-size:11px; font-weight:800; padding:2px 8px; border-radius:20px; min-width:22px; text-align:center; }
.ap-side-foot { margin-top:auto; border-top:1px solid rgba(255,255,255,.08); padding-top:14px; display:flex; flex-direction:column; gap:8px; }
.ap-side-foot .vn-btn { background:rgba(255,255,255,.07); color:#E7E5E4; justify-content:flex-start; } .ap-side-foot .vn-btn:hover { background:rgba(255,255,255,.13); }
.ap-main { padding:30px 36px 70px; min-width:0; }
.ap-head { display:flex; align-items:flex-end; gap:16px; margin-bottom:24px; flex-wrap:wrap; }
.ap-head h1 { margin:0; font-size:28px; font-weight:800; letter-spacing:-.035em; line-height:1.1; } .ap-head p { margin:5px 0 0; color:var(--mut); font-size:14px; }
.ap-head .sp { flex:1; }
.ap-live { display:inline-flex; align-items:center; gap:8px; font-size:12.5px; color:var(--mut); font-weight:600; background:#fff; border:1px solid var(--line); padding:7px 12px; border-radius:20px; white-space:nowrap; }
.ap-live i { width:8px; height:8px; border-radius:50%; background:var(--ok); box-shadow:0 0 0 0 rgba(22,163,74,.5); animation:apPulse 2s infinite; } .ap-live.off i { background:var(--busy); animation:none; }
@keyframes apPulse { 70% { box-shadow:0 0 0 8px rgba(22,163,74,0); } 100% { box-shadow:0 0 0 0 rgba(22,163,74,0); } }
.ap-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:22px; }
.ap-kpi { padding:18px 20px; display:flex; gap:14px; align-items:center; } .ap-kpi .ic { width:46px; height:46px; border-radius:13px; display:grid; place-items:center; font-size:19px; background:var(--gold-l); color:#9A7000; flex-shrink:0; }
.ap-kpi .ic.g { background:var(--ok-l); color:var(--ok); } .ap-kpi .ic.r { background:var(--busy-l); color:var(--busy); } .ap-kpi .ic.p { background:var(--bill-l); color:var(--bill); }
.ap-kpi small { display:block; color:var(--mut); font-size:12.5px; font-weight:600; } .ap-kpi b { display:block; font-size:25px; font-weight:800; letter-spacing:-.03em; font-variant-numeric:tabular-nums; line-height:1.2; }
.ap-bar { display:flex; align-items:center; gap:10px; margin-bottom:16px; flex-wrap:wrap; }
.ap-chips { display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; flex:1; min-width:0; }
.ap-chip { flex-shrink:0; border:1.5px solid var(--line); background:#fff; border-radius:12px; padding:9px 14px; font-size:13.5px; font-weight:600; color:var(--mut); cursor:pointer; display:inline-flex; gap:8px; align-items:center; font-family:inherit; }
.ap-chip b { color:var(--ink); } .ap-chip.on { background:var(--ink); border-color:var(--ink); color:#D6D3D1; } .ap-chip.on b { color:var(--gold); }
.ap-chip .d { width:9px; height:9px; border-radius:50%; } .d.disponivel { background:var(--ok); } .d.ocupada { background:var(--busy); } .d.conta { background:var(--bill); } .d.reservada { background:var(--res); }
.ap-search { position:relative; } .ap-search i { position:absolute; left:13px; top:50%; transform:translateY(-50%); color:#A8A29E; } .ap-search input { border:1.5px solid var(--line); background:#fff; border-radius:12px; padding:10px 14px 10px 38px; font-size:14px; outline:none; width:250px; font-family:inherit; } .ap-search input:focus { border-color:var(--gold); box-shadow:0 0 0 4px rgba(245,184,0,.18); }
.ap-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(176px,1fr)); gap:14px; }
.ap-mesa { text-align:left; background:#fff; border:1.5px solid var(--line); border-radius:18px; padding:16px 16px 14px; cursor:pointer; position:relative; overflow:hidden; box-shadow:var(--sh); min-height:138px; display:flex; flex-direction:column; transition:transform .12s, box-shadow .15s; font-family:inherit; color:var(--ink); }
.ap-mesa:hover { transform:translateY(-2px); box-shadow:0 10px 28px rgba(28,25,23,.12); }
.ap-mesa::before { content:""; position:absolute; left:0; right:0; top:0; height:5px; background:var(--ok); }
.ap-mesa .top { display:flex; align-items:center; justify-content:space-between; } .ap-mesa .num { font-size:36px; font-weight:800; letter-spacing:-.04em; line-height:1; margin-top:8px; }
.ap-mesa .inf { margin-top:auto; font-size:13px; color:var(--mut); font-variant-numeric:tabular-nums; } .ap-mesa .inf b { display:block; font-size:19px; color:var(--ink); font-weight:800; letter-spacing:-.02em; }
.ap-mesa.ocupada { background:#FFF8F8; border-color:#FECACA; } .ap-mesa.ocupada::before { background:var(--busy); }
.ap-mesa.conta { background:#FAF8FF; border-color:#DDD6FE; } .ap-mesa.conta::before { background:var(--bill); }
.ap-mesa.reservada { background:#F6F9FF; border-color:#BFDBFE; } .ap-mesa.reservada::before { background:var(--res); }
.ap-mesa.novo { animation:apFlash 1.6s 2; } @keyframes apFlash { 50% { box-shadow:0 0 0 5px rgba(245,184,0,.55); } }
.ap-tbl { overflow:hidden; } .ap-tr { display:grid; align-items:center; gap:14px; padding:13px 20px; border-bottom:1px solid #F0ECE3; } .ap-tr:last-child { border-bottom:0; }
.ap-tr.h { background:#FAF8F3; font-size:11.5px; font-weight:700; color:var(--mut); text-transform:uppercase; letter-spacing:.6px; padding-top:11px; padding-bottom:11px; }
.ap-tr:not(.h):hover { background:#FDFCF9; } .ap-tr b { font-weight:700; } .ap-tr .mut { color:var(--mut); font-size:13px; } .num { font-variant-numeric:tabular-nums; }
.ap-prod { grid-template-columns:56px minmax(0,2.2fr) minmax(0,1.1fr) 110px 120px 70px 90px; }
.ap-ped { grid-template-columns:70px 70px minmax(0,1fr) 140px 110px 110px; }
.ap-eq { grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) 110px 70px 190px; }
.ap-thumb { width:48px; height:48px; border-radius:12px; background:#F3EFE7 center/cover no-repeat; display:grid; place-items:center; color:#C9C2B3; font-size:18px; border:1px solid var(--line); }
.ap-tag { display:inline-block; font-size:12px; font-weight:700; padding:4px 10px; border-radius:20px; background:#F3EFE7; color:var(--ink-3); white-space:nowrap; } .ap-tag.ok { background:var(--ok-l); color:var(--ok); } .ap-tag.warn { background:var(--gold-l); color:#8A6500; } .ap-tag.bad { background:var(--busy-l); color:var(--busy); }
.ap-empty { text-align:center; padding:56px 20px; color:var(--mut); } .ap-empty i { font-size:34px; color:#D6D0C4; display:block; margin-bottom:12px; }
.ap-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:14px; } .ap-est { padding:20px; display:flex; flex-direction:column; gap:12px; } .ap-est h3 { margin:0; font-size:18px; font-weight:800; letter-spacing:-.02em; } .ap-est code { font-size:11.5px; background:#F6F4EF; padding:8px 10px; border-radius:10px; word-break:break-all; color:var(--mut); display:block; }
.ap-ov { position:fixed; inset:0; background:rgba(28,25,23,.5); backdrop-filter:blur(3px); z-index:1000; display:none; justify-content:flex-end; } .ap-ov.on { display:flex; }
.ap-panel { background:#fff; width:480px; max-width:100%; height:100%; overflow:auto; padding:26px 26px 30px; box-shadow:var(--sh-lg); animation:apIn .25s cubic-bezier(.2,.8,.2,1); }
@keyframes apIn { from { transform:translateX(40px); opacity:0; } to { transform:none; opacity:1; } }
.ap-panel h2 { margin:0 0 4px; font-size:23px; font-weight:800; letter-spacing:-.03em; } .ap-panel .sub { color:var(--mut); font-size:13.5px; margin-bottom:20px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.ap-x { float:right; background:#F3EFE7; border:0; width:38px; height:38px; border-radius:11px; cursor:pointer; font-size:15px; color:var(--ink-3); }
.ap-rod { background:#FAF8F3; border:1px solid #EFEADF; border-radius:14px; padding:13px 15px; margin-bottom:10px; } .ap-rod .h { display:flex; justify-content:space-between; align-items:center; font-size:12.5px; color:var(--mut); font-weight:600; margin-bottom:6px; } .ap-rod .h b { color:var(--ink); font-size:15px; }
.ap-rod pre { margin:0; white-space:pre-wrap; font:500 14px/1.55 "Inter",sans-serif; } .ap-rod.cx { opacity:.5; } .ap-rod.cx pre { text-decoration:line-through; }
.ap-seg { display:grid; grid-template-columns:repeat(5,1fr); gap:6px; margin-bottom:14px; } .ap-seg button { border:1.5px solid var(--line); background:#fff; border-radius:11px; padding:10px 4px; font-size:12.5px; font-weight:700; color:var(--ink-3); cursor:pointer; line-height:1.2; font-family:inherit; } .ap-seg button.on { background:var(--ink); border-color:var(--ink); color:var(--gold); }
.ap-sum { background:var(--ink); color:#D6D3D1; border-radius:16px; padding:18px 20px; margin:6px 0 16px; } .ap-sum .l { display:flex; justify-content:space-between; font-size:13.5px; padding:3px 0; } .ap-sum .t { display:flex; justify-content:space-between; align-items:baseline; border-top:1px solid rgba(255,255,255,.12); margin-top:8px; padding-top:12px; } .ap-sum .t b { font-size:32px; color:var(--gold); letter-spacing:-.03em; font-weight:800; } .ap-sum .pp { text-align:right; font-size:12.5px; color:#A8A29E; min-height:16px; }
.ap-photo { display:flex; gap:16px; align-items:center; margin-bottom:16px; } .ap-photo .pv { width:96px; height:96px; border-radius:18px; background:#F3EFE7 center/cover no-repeat; border:2px dashed #D6D0C4; display:grid; place-items:center; color:#B5AE9F; font-size:26px; cursor:pointer; flex-shrink:0; }
.ap-stepper { display:flex; align-items:center; border:1.5px solid var(--line); border-radius:12px; overflow:hidden; margin-bottom:14px; } .ap-stepper button { width:48px; height:46px; border:0; background:#F6F4EF; font-size:20px; cursor:pointer; font-weight:700; } .ap-stepper input { flex:1; border:0; text-align:center; font-size:17px; font-weight:700; outline:none; min-width:0; font-family:inherit; }
.ap-login { min-height:100vh; display:grid; grid-template-columns:1.1fr 1fr; } .ap-login .art { background:radial-gradient(900px 500px at 20% 10%, #3a3128, var(--ink) 70%); color:#fff; padding:56px; display:flex; flex-direction:column; justify-content:space-between; } .ap-login .art h2 { font-size:40px; letter-spacing:-.04em; line-height:1.1; margin:0 0 14px; font-weight:800; } .ap-login .art h2 span { color:var(--gold); } .ap-login .art p { color:#A8A29E; font-size:16px; max-width:420px; line-height:1.6; }
.ap-login .frm { display:flex; align-items:center; justify-content:center; padding:32px; } .ap-login form { width:100%; max-width:380px; } .ap-login form h1 { font-size:28px; font-weight:800; letter-spacing:-.03em; margin:0 0 6px; } .ap-login form p { color:var(--mut); margin:0 0 26px; }
.ap-tabbar, .ap-mtop { display:none; }
@media (max-width:1100px) { .ap-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); } .ap-prod { grid-template-columns:56px minmax(0,2fr) 100px 110px 70px 80px; } .ap-prod .cat { display:none; } }
@media (max-width:899px) {
  .ap { display:block; } .ap-side { display:none; } .ap-main { padding:16px 14px 100px; }
  .ap-mtop { display:flex; align-items:center; gap:12px; background:var(--ink); color:#fff; padding:calc(12px + env(safe-area-inset-top,0px)) 16px 12px; position:sticky; top:0; z-index:50; border-bottom:3px solid var(--gold); } .ap-mtop .ap-logo { width:36px; height:36px; font-size:17px; border-radius:10px; } .ap-mtop b { flex:1; font-size:15px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .ap-mtop a, .ap-mtop button { background:rgba(255,255,255,.1); color:#fff; border:0; border-radius:10px; padding:8px 12px; font-size:13px; font-weight:700; text-decoration:none; font-family:inherit; }
  .ap-tabbar { display:grid; grid-template-columns:repeat(5,1fr); position:fixed; left:0; right:0; bottom:0; z-index:60; background:#fff; border-top:1px solid var(--line); padding:6px 4px calc(6px + env(safe-area-inset-bottom,0px)); box-shadow:0 -6px 24px rgba(28,25,23,.08); }
  .ap-tabbar button { border:0; background:transparent; color:var(--mut); font-size:10.5px; font-weight:700; display:flex; flex-direction:column; align-items:center; gap:3px; padding:6px 0; position:relative; font-family:inherit; } .ap-tabbar button i { font-size:19px; } .ap-tabbar button.on { color:var(--ink); } .ap-tabbar button.on i { color:var(--gold-d); }
  .ap-tabbar .ap-n { position:absolute; top:0; left:calc(50% + 6px); background:var(--busy); color:#fff; font-size:10px; padding:1px 6px; border-radius:20px; }
  .ap-head h1 { font-size:23px; } .ap-search input { width:100%; } .ap-search { flex:1; min-width:180px; }
  .ap-kpis { gap:10px; } .ap-kpi { padding:14px; gap:10px; } .ap-kpi .ic { width:38px; height:38px; font-size:16px; } .ap-kpi b { font-size:19px; }
  .ap-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .ap-mesa { min-height:124px; padding:13px; } .ap-mesa .num { font-size:30px; }
  .ap-tr.h { display:none; } .ap-prod { grid-template-columns:52px minmax(0,1fr) auto auto; padding:12px 14px; } .ap-prod .cat, .ap-prod .prc { display:none; }
  .ap-ped { grid-template-columns:1fr auto; } .ap-ped .h2 { display:none; } .ap-eq { grid-template-columns:1fr auto; } .ap-eq .h2 { display:none; }
  .ap-ov { align-items:flex-end; } .ap-panel { width:100%; height:auto; max-height:93vh; border-radius:24px 24px 0 0; padding:20px 18px calc(24px + env(safe-area-inset-bottom,0px)); animation:vnUp .25s cubic-bezier(.2,.8,.2,1); }
  .ap-login { grid-template-columns:1fr; } .ap-login .art { display:none; }
}

.ap-est { height:100%; } .ap-est-h { display:flex; align-items:center; gap:14px; min-height:56px; } .ap-est-h > div:last-child { min-width:0; }
.ic-est { width:48px; height:48px; flex:0 0 48px; border-radius:13px; display:grid; place-items:center; font-size:20px; background:var(--gold-l); color:#9A7000; }
.ap-est code { margin-top:auto; }
.ap-est-acts { display:grid; grid-template-columns:1fr 1fr; gap:10px; } .ap-est-acts .vn-btn { padding:11px 14px; min-width:0; font-size:14px; } .ap-est-acts .vn-btn:first-child { grid-column:1 / -1; }

.ap-ped { grid-template-columns:70px 70px minmax(0,1fr) 150px 120px; } .ap-tr.clk { cursor:pointer; } .ap-tr.clk:hover { background:var(--gold-l) !important; }
.ap-its { background:#FAF8F3; border:1px solid #EFEADF; border-radius:14px; padding:6px 16px; } .ap-it { display:flex; justify-content:space-between; gap:14px; padding:11px 0; border-bottom:1px solid #EFEADF; font-size:15px; font-weight:500; } .ap-it:last-child { border-bottom:0; } .ap-it b { white-space:nowrap; } .ap-its.cx { opacity:.5; text-decoration:line-through; }
@media (max-width:899px) { .ap-ped { grid-template-columns:1fr auto; } }

.ap-tot { display:flex; justify-content:space-between; align-items:center; margin:14px 0 18px; padding:14px 18px; background:var(--ink); border-radius:14px; } .ap-tot span { color:#D6D3D1; font-size:14px; font-weight:600; } .ap-tot b { color:var(--gold); font-size:22px; font-weight:800; letter-spacing:-.02em; line-height:1; }

/* PDV de balcão */
.ap-pos { display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:20px; align-items:start; } .ap-pos-r { position:sticky; top:20px; max-height:calc(100vh - 40px); overflow:auto; }
.ap-pgrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; }
.ap-pc { text-align:left; background:#fff; border:1.5px solid var(--line); border-radius:16px; padding:8px; cursor:pointer; box-shadow:var(--sh); font-family:inherit; color:var(--ink); display:flex; flex-direction:column; gap:6px; transition:transform .1s, border-color .15s; }
.ap-pc:hover { border-color:var(--gold); transform:translateY(-1px); } .ap-pc:active { transform:scale(.97); } .ap-pc.esg { opacity:.45; cursor:not-allowed; }
.ap-pc .ph { position:relative; height:96px; border-radius:11px; background:#F3EFE7 center/cover no-repeat; display:grid; place-items:center; color:#C9C2B3; font-size:26px; }
.ap-pc .qn { position:absolute; top:6px; right:6px; background:var(--gold); color:var(--ink); font-size:12px; font-weight:800; min-width:24px; height:24px; border-radius:12px; display:grid; place-items:center; padding:0 6px; }
.ap-pc .nm { font-size:13.5px; font-weight:700; line-height:1.25; min-height:34px; padding:0 4px; } .ap-pc .pr { font-size:15px; font-weight:800; padding:0 4px 4px; }
.ap-cart .ch { display:flex; align-items:center; gap:10px; padding:16px 18px 10px; } .ap-cart .ch b { font-size:17px; font-weight:800; flex:1; }
.ap-cart .ci-list { padding:0 18px; } .ci { padding:12px 0; border-bottom:1px solid #F0ECE3; } .ci .top { display:flex; justify-content:space-between; gap:10px; font-size:14.5px; } .ci .bot { display:flex; gap:10px; margin-top:8px; align-items:center; }
.ap-qty { display:flex; align-items:center; border:1.5px solid var(--line); border-radius:10px; overflow:hidden; flex-shrink:0; } .ap-qty button { width:32px; height:32px; border:0; background:#F6F4EF; font-size:17px; font-weight:700; cursor:pointer; } .ap-qty span { min-width:30px; text-align:center; font-weight:700; font-size:14px; }
.ci input { flex:1; min-width:0; border:1.5px solid var(--line); border-radius:10px; padding:7px 10px; font-size:13px; font-family:inherit; outline:none; } .ci input:focus { border-color:var(--gold); }
.ap-cart .cf { padding:14px 18px 18px; } .ap-cart .cf .vn-in { margin-bottom:10px; padding:11px 13px; font-size:15px; } .ap-cart .ap-tot { margin:10px 0 12px; }
.ap-posbar { display:none !important; position:fixed; left:292px; right:28px; bottom:24px; z-index:55; background:var(--ink); color:#fff; border:0; border-radius:16px; padding:15px 18px; align-items:center; justify-content:space-between; font-size:15px; font-weight:700; box-shadow:var(--sh-lg); cursor:pointer; font-family:inherit; } .ap-posbar b { color:var(--gold); font-size:18px; }
@media (max-width:1100px) { .ap-posbar.on { display:flex !important; } .ap-pos { grid-template-columns:1fr; } .ap-pos-r { display:none; } .ap-pgrid { grid-template-columns:repeat(auto-fill,minmax(128px,1fr)); gap:10px; } .ap-pc .ph { height:78px; } }
@media (max-width:899px) { .ap-posbar { left:12px; right:12px; bottom:calc(76px + env(safe-area-inset-bottom,0px)); } .ap-tabbar { grid-template-columns:repeat(5,1fr); } .ap-tabbar button { font-size:10.5px; } }

/* navegação agrupada, aviso de assinatura, "Mais" */
.ap-sec { font-size:11px; font-weight:800; letter-spacing:.9px; text-transform:uppercase; color:#57534E; padding:16px 14px 6px; }
.ap-nav .ap-n.alerta, .ap-tabbar .ap-n.alerta { background:#DC2626; color:#fff; }
.ap-banner { display:flex; align-items:center; gap:12px; background:var(--gold-l); border:1px solid #F3DD8A; color:#7A5A00; padding:12px 16px; border-radius:14px; margin-bottom:18px; font-size:14px; font-weight:600; } .ap-banner span { flex:1; } .ap-banner.bad { background:var(--busy-l); border-color:#FECACA; color:#B91C1C; }
.ap-mais { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-top:14px; } .ap-mais button { border:1.5px solid var(--line); background:#fff; border-radius:16px; padding:18px 10px; display:flex; flex-direction:column; align-items:center; gap:8px; font-family:inherit; font-size:14px; font-weight:700; color:var(--ink); cursor:pointer; } .ap-mais button i { font-size:22px; color:var(--gold-d); } .ap-mais button.on { border-color:var(--gold); background:var(--gold-l); }
.ap-prn { font-size:12.5px; color:var(--mut); font-weight:600; display:flex; align-items:center; gap:7px; } .ap-prn.on { color:var(--ok); }
/* Relatórios */
.rl-custom { display:flex; gap:12px; align-items:flex-end; padding:16px 18px; margin-bottom:16px; flex-wrap:wrap; } .rl-custom > div { flex:1; min-width:140px; } .rl-custom .vn-in { margin-bottom:0; } .rl-custom .vn-btn { height:48px; }
.rl-card { padding:20px 22px; margin-bottom:16px; } .rl-card h3 { margin:0 0 14px; font-size:16px; font-weight:800; letter-spacing:-.01em; }
.rl-h { display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:6px; } .rl-h h3 { margin:0; } .rl-h span { color:var(--mut); font-size:13px; }
.rl-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; align-items:start; } .rl-grid .rl-card { margin-bottom:0; }
.rl-chart { display:flex; align-items:stretch; gap:6px; height:210px; padding-top:8px; overflow-x:auto; } .rl-chart.many { gap:3px; }
.rl-col { flex:1; min-width:22px; display:flex; flex-direction:column; align-items:center; gap:4px; } .rl-chart.many .rl-col { min-width:14px; }
.rl-val { font-size:10.5px; color:var(--mut); font-weight:700; height:14px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.rl-fill { flex:1; width:100%; display:flex; align-items:flex-end; } .rl-fill i { display:block; width:100%; background:linear-gradient(180deg,var(--gold),var(--gold-d)); border-radius:7px 7px 2px 2px; min-height:0; transition:height .4s; } .rl-col:hover .rl-fill i { background:var(--ink); }
.rl-d { font-size:11px; color:var(--mut); height:14px; font-weight:600; white-space:nowrap; }
.rl-row { margin-bottom:14px; } .rl-l { display:flex; justify-content:space-between; font-size:14px; margin-bottom:6px; } .rl-l span { color:var(--mut); font-size:13px; }
.rl-bar { height:10px; background:#F0ECE3; border-radius:10px; overflow:hidden; } .rl-bar i { display:block; height:100%; border-radius:10px; }
.rl-sub { color:var(--mut); font-size:13px; margin-top:4px; } .rl-vazio { color:var(--mut); font-size:14px; padding:8px 0; }
.rl-top { display:flex; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid #F0ECE3; font-size:14.5px; } .rl-top:last-child { border-bottom:0; } .rl-top b { flex:1; min-width:0; font-weight:700; } .rl-top .num { color:var(--mut); font-size:13px; white-space:nowrap; }
.rl-top .rk { width:28px; height:28px; border-radius:9px; background:var(--gold-l); color:#8A6500; display:grid; place-items:center; font-size:13px; font-weight:800; flex-shrink:0; } .rl-top .rk.warn { background:var(--busy-l); color:var(--busy); }
/* Ajustes */
.aj-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; align-items:start; } .aj-card { padding:22px; }
.aj-h { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:16px; } .aj-h h3 { margin:0 0 3px; font-size:17px; font-weight:800; letter-spacing:-.01em; } .aj-h p { margin:0; color:var(--mut); font-size:13.5px; line-height:1.45; }
.aj-emp { display:flex; gap:16px; align-items:center; } .aj-logo { width:76px; height:76px; border-radius:18px; background:#F3EFE7 center/contain no-repeat; border:1px solid var(--line); display:grid; place-items:center; color:#C9C2B3; font-size:26px; flex-shrink:0; }
.aj-l { color:var(--mut); font-size:13.5px; margin-top:4px; display:flex; gap:8px; align-items:center; } .aj-l i { width:16px; text-align:center; color:var(--gold-d); } .aj-l:empty { display:none; }
.aj-chk { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; } .aj-op { cursor:pointer; } .aj-op input { display:none; } .aj-op span { display:inline-block; padding:9px 14px; border:1.5px solid var(--line); border-radius:11px; font-size:13.5px; font-weight:600; color:var(--mut); background:#fff; } .aj-op input:checked + span { background:var(--ink); border-color:var(--ink); color:var(--gold); }
.aj-dica { color:var(--mut); font-size:12.5px; line-height:1.5; margin:-4px 0 14px; } .aj-dica code, .aj-code { background:#F6F4EF; padding:2px 7px; border-radius:7px; font-size:12px; }
.aj-code { display:block; padding:12px 14px; word-break:break-all; margin-bottom:14px; color:var(--ink-3); }
.aj-imp { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid #F0ECE3; font-size:14.5px; } .aj-imp:last-of-type { border-bottom:0; margin-bottom:6px; }
textarea.vn-in { resize:vertical; min-height:92px; line-height:1.5; }
/* Assinatura */
.as-card { padding:28px; max-width:640px; } .as-top { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:22px; } .as-top small, .as-venc small { display:block; color:var(--mut); font-size:12.5px; font-weight:600; margin-bottom:4px; } .as-top h2 { margin:0; font-size:26px; font-weight:800; letter-spacing:-.03em; }
.as-val { font-size:30px; font-weight:800; letter-spacing:-.03em; margin-top:6px; } .as-val span { font-size:15px; color:var(--mut); font-weight:600; }
.as-venc { display:grid; grid-template-columns:1fr 1fr; gap:16px; padding:18px 0; border-top:1px solid var(--line); } .as-venc b { font-size:20px; font-weight:800; letter-spacing:-.02em; }
.as-prog { height:10px; background:#F0ECE3; border-radius:10px; overflow:hidden; } .as-prog i { display:block; height:100%; border-radius:10px; background:var(--ok); } .as-prog i.warn { background:#F59E0B; } .as-prog i.bad { background:var(--busy); }
.as-acts { display:flex; gap:12px; flex-wrap:wrap; margin-top:22px; }
@media (max-width:899px) { .rl-grid, .aj-grid { grid-template-columns:1fr; } .rl-chart { height:170px; } .as-card { padding:20px; } }
/* resumo preto mais compacto (fechamento de conta) */
.ap-sum { padding:12px 16px; margin:4px 0 14px; border-radius:14px; }
.ap-sum .l { font-size:13px; padding:2px 0; }
.ap-sum .t { margin-top:6px; padding-top:8px; align-items:center; } .ap-sum .t span { font-size:14px; } .ap-sum .t b { font-size:22px; }
.ap-sum .pp { font-size:12px; min-height:0; } .ap-sum .pp:empty { display:none; }
/* remover item do carrinho */
.ci .top { align-items:center; } .ci .top b { flex:1; min-width:0; }
.ci-x { border:0; background:transparent; color:#A8A29E; width:30px; height:30px; border-radius:9px; cursor:pointer; font-size:16px; flex-shrink:0; margin-right:-6px; } .ci-x:hover { background:var(--busy-l); color:var(--busy); }
/* chips de categoria sempre inteiros: quebram de linha em vez de cortar */
.ap-chips { flex-wrap:wrap; overflow:visible; }
.ap-pos-l .ap-bar, .ap-bar:has(.ap-search) { align-items:flex-start; }
.ap-bar .ap-search { flex:0 0 auto; }
@media (max-width:899px) { .ap-bar .ap-search { flex:1 1 100%; } }
/* marca do menu sem subtítulo */
.ap-brand { padding-bottom:20px; align-items:center; }
.ap-logo.img { color:transparent; background:#fff center/contain no-repeat; border:1px solid rgba(255,255,255,.12); }

/* Ajustes: cartões empilham em colunas (sem buracos entre cartões de alturas diferentes) */
.aj-grid { display:block; column-count:2; column-gap:16px; }
.aj-grid .aj-card { break-inside:avoid; -webkit-column-break-inside:avoid; margin-bottom:16px; display:block; }
@media (max-width:899px) { .aj-grid { column-count:1; } }

/* categorias sempre em uma linha (rolagem lateral), busca em linha própria acima */
.ap-chips { flex-wrap:nowrap; overflow-x:auto; overflow-y:hidden; scrollbar-width:none; padding-bottom:4px; }
.ap-chips::-webkit-scrollbar { display:none; }
.ap-chip { white-space:nowrap; }
.ap-bar.stack { flex-direction:column; align-items:stretch; gap:12px; }
.ap-bar.stack .ap-search, .ap-bar.stack .ap-search input { width:100%; }
.ap-bar.stack .ap-chips { flex:none; width:100%; }
/* usuário logado no menu e cartão de usuários */
.ap-me { display:flex; align-items:center; gap:10px; padding:8px 6px 10px; color:#D6D3D1; } .ap-me i { font-size:30px; color:var(--gold); } .ap-me b { display:block; font-size:13.5px; color:#fff; line-height:1.2; } .ap-me small { font-size:11.5px; color:#78716C; }
.aj-user { display:flex; align-items:center; gap:12px; padding:12px 0; border-top:1px solid #F0ECE3; } .aj-user .av { width:40px; height:40px; border-radius:12px; background:var(--gold-l); color:#8A6500; display:grid; place-items:center; font-weight:800; flex-shrink:0; }
.aj-user .inf { flex:1; min-width:0; } .aj-user .inf b { display:block; font-size:14.5px; } .aj-user .inf span { font-size:12.5px; color:var(--mut); }
.aj-user .acts { display:flex; gap:6px; } .pf { font-style:normal; font-weight:700; } .pf.admin { color:var(--bill); } .pf.gerente { color:var(--res); } .pf.caixa { color:var(--ok); }
.aj-perfis { display:flex; flex-direction:column; gap:8px; margin-bottom:16px; } .aj-pf { cursor:pointer; } .aj-pf input { display:none; }
.aj-pf span { display:block; border:1.5px solid var(--line); border-radius:13px; padding:11px 14px; background:#fff; } .aj-pf b { display:block; font-size:14.5px; } .aj-pf small { color:var(--mut); font-size:12.5px; line-height:1.4; }
.aj-pf input:checked + span { border-color:var(--gold); background:var(--gold-l); }
/* ───── Caixa ───── */
.cx-abrir { display:flex; gap:22px; align-items:flex-start; padding:28px; max-width:640px; } .cx-abrir .ic { width:64px; height:64px; border-radius:18px; background:var(--gold-l); color:#8A6500; display:grid; place-items:center; font-size:28px; flex-shrink:0; }
.cx-abrir h2 { margin:0 0 6px; font-size:24px; font-weight:800; letter-spacing:-.03em; } .cx-abrir p { margin:0 0 18px; color:var(--mut); font-size:14px; line-height:1.5; } .cx-abrir > div:last-child { flex:1; min-width:0; }
.cx-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; align-items:start; } .cx-grid .rl-card { margin-bottom:0; }
.cx-linhas { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; } .cx-linhas div { background:#FAF8F3; border-radius:12px; padding:12px 14px; } .cx-linhas span { display:block; font-size:12px; color:var(--mut); font-weight:600; } .cx-linhas b { font-size:18px; }
.cx-linhas b.ok, .cx-ok { color:var(--ok); } .cx-linhas b.sob, .cx-sob { color:var(--res); } .cx-linhas b.fal, .cx-fal { color:var(--busy); }
.cx-conta { background:#FAF8F3; border:1px solid #EFEADF; border-radius:14px; padding:6px 16px; margin-bottom:12px; } .cx-conta > div { display:flex; justify-content:space-between; padding:9px 0; border-bottom:1px solid #EFEADF; font-size:14.5px; } .cx-conta > div:last-child { border-bottom:0; } .cx-conta span { color:var(--mut); } .cx-conta b.ok { color:var(--ok); } .cx-conta b.sob { color:var(--res); } .cx-conta b.fal { color:var(--busy); }
.cx-conta .tt { font-weight:800; } .cx-conta .tt span { color:var(--ink); } .cx-conta .tt b { font-size:18px; }
.cx-outras { font-size:12.5px; color:var(--mut); margin:0 2px 16px; line-height:1.6; } .cx-outras b { color:var(--ink); }
.cx-dif { padding:11px 14px; border-radius:12px; background:#F3EFE7; color:var(--mut); font-weight:700; font-size:14px; text-align:center; margin:-4px 0 16px; } .cx-dif.ok { background:var(--ok-l); color:var(--ok); } .cx-dif.sob { background:var(--res-l); color:var(--res); } .cx-dif.fal { background:var(--busy-l); color:var(--busy); }
.cx-tr { grid-template-columns:90px minmax(0,1fr) 110px 100px 100px 100px 110px 20px; } .cx-tr .r { text-align:right; }
@media (max-width:1100px) { .cx-tr { grid-template-columns:80px minmax(0,1fr) 100px 100px 20px; } .cx-tr .h2 { display:none; } }
@media (max-width:899px) { .cx-grid { grid-template-columns:1fr; } .cx-abrir { flex-direction:column; padding:20px; } .cx-linhas { grid-template-columns:1fr; } }

/* Relatórios e Caixa: cartões empilham em colunas, sem buracos entre alturas diferentes */
.rl-grid, .cx-grid { display:block; column-count:2; column-gap:16px; }
.rl-grid > .rl-card, .cx-grid > .rl-card { break-inside:avoid; -webkit-column-break-inside:avoid; margin-bottom:16px; display:block; }
@media (max-width:899px) { .rl-grid, .cx-grid { column-count:1; } }

/* botões de ação dos cabeçalhos: alinhados ao centro, em linha, com mesma altura */
.ap-head { align-items:center; }
.ap-head .vn-btn { height:44px; padding-top:0; padding-bottom:0; }
@media (max-width:899px) { .ap-head { flex-wrap:wrap; } .ap-head .sp { display:none; } .ap-head > div:first-child { flex:1 1 100%; } .ap-head .vn-btn { flex:1 1 auto; } }

/* cabeçalho: o título ocupa o espaço que sobra e os botões ficam sempre na mesma linha, à direita */
@media (min-width:900px) { .ap-head > div:first-child { flex:1 1 0; min-width:240px; } .ap-head .sp { display:none; } .ap-head .vn-btn { flex:0 0 auto; } }

/* Importar fotos em lote */
.ap-panel.wide { width:760px; }
.fl-drop { border:2px dashed #D6D0C4; border-radius:18px; background:#FAF8F3; padding:26px 18px; text-align:center; color:var(--mut); cursor:pointer; transition:.15s; } .fl-drop:hover, .fl-drop.on { border-color:var(--gold); background:var(--gold-l); }
.fl-drop i { font-size:30px; color:var(--gold-d); display:block; margin-bottom:8px; } .fl-drop b { color:var(--ink); display:block; font-size:15px; } .fl-drop small { display:block; margin-top:4px; font-size:12.5px; }
.fl-acts { display:flex; gap:8px; margin:12px 0 4px; flex-wrap:wrap; }
.fl-sum { display:flex; gap:10px; flex-wrap:wrap; margin:16px 0 10px; } .fl-sum span { font-size:12.5px; font-weight:700; padding:6px 12px; border-radius:20px; background:#F3EFE7; color:var(--ink-3); } .fl-sum .ok { background:var(--ok-l); color:var(--ok); } .fl-sum .warn { background:var(--gold-l); color:#8A6500; } .fl-sum .bad { background:var(--busy-l); color:var(--busy); }
.fl-list { max-height:48vh; overflow:auto; border:1px solid var(--line); border-radius:14px; }
.fl-row { display:grid; grid-template-columns:52px minmax(0,1fr) minmax(0,1.3fr) 26px; gap:12px; align-items:center; padding:10px 12px; border-bottom:1px solid #F0ECE3; } .fl-row:last-child { border-bottom:0; }
.fl-row .th { width:52px; height:52px; border-radius:10px; background:#F3EFE7 center/cover no-repeat; border:1px solid var(--line); }
.fl-row .nm { font-size:13px; font-weight:600; word-break:break-all; line-height:1.3; } .fl-row .nm small { display:block; color:var(--mut); font-weight:500; margin-top:2px; }
.fl-row select { width:100%; border:1.5px solid var(--line); border-radius:10px; padding:9px 10px; font-size:14px; font-family:inherit; background:#fff; } .fl-row.ok select { border-color:#86EFAC; } .fl-row.warn select { border-color:var(--gold); } .fl-row.bad select { border-color:#FCA5A5; }
.fl-row .st { text-align:center; font-size:16px; } .fl-row .st .fa-check-circle { color:var(--ok); } .fl-row .st .fa-times-circle { color:var(--busy); } .fl-row .st .fa-spinner { color:var(--gold-d); }
.fl-prog { height:8px; background:#F0ECE3; border-radius:8px; overflow:hidden; margin:14px 0 4px; display:none; } .fl-prog i { display:block; height:100%; width:0; background:var(--gold); transition:width .2s; }
@media (max-width:899px) { .ap-panel.wide { width:100%; } .fl-row { grid-template-columns:44px minmax(0,1fr) 22px; } .fl-row select { grid-column:2 / 3; } .fl-row .th { width:44px; height:44px; } .fl-row .nm { grid-column:2 / 3; } }
/* App nativo no celular: a página nunca rola para os lados (só os filtros deslizam, sem barra) */
@media (max-width:899px) {
  html, body.pg-painel { overflow-x:hidden; max-width:100%; overscroll-behavior-x:none; touch-action:pan-y; -webkit-text-size-adjust:100%; }
  body.pg-painel .ap, body.pg-painel .ap-main { max-width:100vw; overflow-x:clip; }
  body.pg-painel .ap-pos { grid-template-columns:minmax(0,1fr); } body.pg-painel .ap-pos-l { min-width:0; }
  body.pg-painel .ap-pgrid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }   /* produtos do balcão em grade 2 colunas */
  body.pg-painel .ap-chips { flex-wrap:wrap; overflow:visible; padding-bottom:0; justify-content:center; }   /* filtros quebram em linhas no celular: nada desliza para o lado */
  body.pg-painel .ap-chips, body.pg-painel .ap-sheet-body, body.pg-painel .ap-panel { touch-action:pan-x pan-y; }
  body.pg-painel .ap-chips, body.pg-painel .ap-panel, body.pg-painel .fl-list, body.pg-painel .rl-chart { scrollbar-width:none; }
  body.pg-painel .ap-chips::-webkit-scrollbar, body.pg-painel .ap-panel::-webkit-scrollbar, body.pg-painel .fl-list::-webkit-scrollbar, body.pg-painel .rl-chart::-webkit-scrollbar { display:none; }
}

/* ═══ Celular: acabamento do painel (tudo alinhado e centralizado) ═══ */
@media (max-width:899px) {
  /* cabeçalho de cada tela: título centralizado e ações em grade */
  body.pg-painel .ap-head { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:18px; text-align:center; }
  body.pg-painel .ap-head > div:first-child { grid-column:1 / -1; }
  body.pg-painel .ap-head h1 { font-size:24px; } body.pg-painel .ap-head p { margin-top:4px; font-size:13.5px; }
  body.pg-painel .ap-head .sp { display:none; }
  body.pg-painel .ap-head > .vn-btn { width:100%; height:46px; padding-left:8px; padding-right:8px; font-size:14px; }
  body.pg-painel .ap-head > .vn-btn:last-child:nth-child(odd) { grid-column:1 / -1; }

  /* cartões de números: ícone em cima, tudo centralizado */
  body.pg-painel .ap-kpi { flex-direction:column; justify-content:center; text-align:center; gap:8px; padding:16px 10px; min-height:112px; }
  body.pg-painel .ap-kpi .ic { margin:0 auto; } body.pg-painel .ap-kpi small { font-size:12px; } body.pg-painel .ap-kpi b { font-size:20px; }

  /* mesas e produtos do balcão */
  body.pg-painel .ap-mesa { align-items:center; text-align:center; }
  body.pg-painel .ap-pc { text-align:center; align-items:stretch; }

  /* Produtos: miniatura, nome, preço, estoque, chave e botão em linhas organizadas */
  body.pg-painel .ap-prod { grid-template-columns:56px minmax(0,1fr) auto; grid-template-areas:"th nm sw" "th pr st" "ed ed ed"; gap:6px 12px; align-items:center; padding:14px; }
  body.pg-painel .ap-prod > :nth-child(1) { grid-area:th; width:56px; height:56px; }
  body.pg-painel .ap-prod > :nth-child(2) { grid-area:nm; } body.pg-painel .ap-prod > :nth-child(2) b { white-space:normal; }
  body.pg-painel .ap-prod > .prc { grid-area:pr; display:block; font-size:15px; }
  body.pg-painel .ap-prod > :nth-child(5) { grid-area:st; justify-self:end; }
  body.pg-painel .ap-prod > .vn-sw { grid-area:sw; justify-self:end; }
  body.pg-painel .ap-prod > .vn-btn { grid-area:ed; width:100%; margin-top:4px; justify-content:center; }

  /* Equipe */
  body.pg-painel .ap-eq { grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"nm sw" "us sw" "ac ac"; gap:2px 12px; align-items:center; padding:14px; }
  body.pg-painel .ap-eq > :nth-child(1) { grid-area:nm; font-size:16px; }
  body.pg-painel .ap-eq > :nth-child(2) { grid-area:us; display:block; font-size:13px; } body.pg-painel .ap-eq > :nth-child(2)::before { content:"@"; }
  body.pg-painel .ap-eq > :nth-child(3) { display:none; }
  body.pg-painel .ap-eq > .vn-sw { grid-area:sw; }
  body.pg-painel .ap-eq > div:last-child { grid-area:ac; display:grid !important; grid-template-columns:1fr auto; gap:8px !important; margin-top:10px; }
  body.pg-painel .ap-eq > div:last-child .vn-btn { height:42px; justify-content:center; }
  body.pg-painel .ap-eq > div:last-child .vn-btn.danger { width:50px; padding:0; }

  /* Pedidos */
  body.pg-painel .ap-ped { grid-template-columns:auto minmax(0,1fr) auto; grid-template-areas:"ms hr tt" "it it it"; gap:6px 12px; align-items:center; padding:14px; }
  body.pg-painel .ap-ped > :nth-child(1) { grid-area:hr; } body.pg-painel .ap-ped > :nth-child(2) { grid-area:ms; background:var(--ink); color:var(--gold); border-radius:10px; padding:5px 12px; font-size:15px; text-align:center; }
  body.pg-painel .ap-ped > :nth-child(3) { grid-area:it; border-top:1px dashed var(--line); padding-top:8px; }
  body.pg-painel .ap-ped > :nth-child(5) { grid-area:tt; font-size:16px; }

  /* Histórico do caixa */
  body.pg-painel .cx-hh { flex-wrap:wrap; justify-content:center; text-align:center; gap:10px; }
  body.pg-painel .cx-hh h3 { flex:1 1 100%; } body.pg-painel .cx-hh > span { display:none; } body.pg-painel .cx-hh .vn-btn { width:100%; justify-content:center; height:44px; }
  body.pg-painel .cx-tr { grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"ab ve" "op df"; gap:4px 12px; align-items:center; padding:14px; }
  body.pg-painel .cx-tr > :nth-child(1) { grid-area:ab; } body.pg-painel .cx-tr > :nth-child(2) { grid-area:op; }
  body.pg-painel .cx-tr > :nth-child(3) { grid-area:ve; font-size:16px; } body.pg-painel .cx-tr > :nth-child(7) { grid-area:df; }
  body.pg-painel .cx-tr > :nth-child(4), body.pg-painel .cx-tr > :nth-child(5), body.pg-painel .cx-tr > :nth-child(6), body.pg-painel .cx-tr > :nth-child(8) { display:none; }

  /* menu Mais: o último botão (Sair), sozinho, ocupa a largura toda */
  body.pg-painel .ap-mais button:last-child:nth-child(odd) { grid-column:1 / -1; flex-direction:row; justify-content:center; padding:14px; }
  body.pg-painel .ap-panel h2:has(+ .ap-mais) { text-align:center; }

  /* Assinatura */
  body.pg-painel .as-top { flex-direction:column-reverse; align-items:center; text-align:center; gap:12px; }
  body.pg-painel .as-acts { flex-direction:column; align-items:stretch; } body.pg-painel .as-acts .vn-btn { width:100%; justify-content:center; }
  body.pg-painel .as-card .aj-dica, body.pg-painel .as-card p { text-align:center; }
  body.pg-painel .ap-banner { text-align:left; }

  /* Ajustes: cabeçalhos dos cartões centralizados, botões largos */
  body.pg-painel .aj-card { padding:18px; }
  body.pg-painel .aj-h { flex-direction:column; align-items:stretch; text-align:center; gap:12px; }
  body.pg-painel .aj-h .vn-btn { width:100%; height:44px; justify-content:center; font-size:14px; }
  body.pg-painel .aj-card .vn-btn.gold:not(.sm), body.pg-painel .aj-card .vn-btn.dark { width:100%; height:46px; justify-content:center; }
  body.pg-painel .aj-emp { flex-direction:column; text-align:center; gap:10px; }
  body.pg-painel .aj-l { justify-content:center; text-align:center; }
  body.pg-painel .aj-user { flex-direction:column; text-align:center; gap:8px; }
  body.pg-painel .aj-user .inf { flex:none; width:100%; }
  body.pg-painel .aj-user .acts { width:100%; justify-content:center; gap:10px; align-items:center; flex-wrap:wrap; }
}