/* Empório do Sabor — mobile-first fix / luxo */
:root{
  --m-bg:#f4f6f8;--m-card:#fff;--m-ink:#142033;--m-muted:#718096;
  --m-navy:#061525;--m-navy2:#0b3158;--m-gold:#d8a646;--m-line:#e6ebf1;
  --m-shadow:0 10px 30px rgba(7,24,45,.08);
}
/* CRÍTICO: regras antigas de mobile não podem reabrir telas marcadas como hidden */
#login.hidden,#app.hidden,#modal.hidden{display:none!important}
body.mobile-modal-open .sidebar{display:none!important}
body.mobile-modal-open{overflow:hidden!important}
.modal{z-index:4000!important}

@media(max-width:780px){
  html,body{width:100%;max-width:100%;overflow-x:hidden;background:var(--m-bg)!important}
  body{min-height:100dvh}
  #app.appShell:not(.hidden){display:block!important;min-height:100dvh!important}
  #login.loginPage:not(.hidden){display:grid!important}
  .content{padding:8px 10px 78px!important;min-height:100dvh!important}

  /* login realmente isolado do app */
  .loginPage{grid-template-rows:84px minmax(0,1fr)!important;height:100dvh!important;min-height:100dvh!important;background:linear-gradient(180deg,#071827 0,#0d3155 84px,#f4f6f8 84px)!important;overflow:auto!important}
  .loginBrand{height:84px!important;min-height:84px!important;padding:10px 16px!important;border-radius:0 0 28px 28px!important;background:linear-gradient(135deg,#061523,#0a2c50)!important}
  .loginBrandInner{grid-template-columns:46px 1fr!important;column-gap:11px!important}
  .loginBrand .logoMark{width:44px!important;height:44px!important;border-radius:14px!important;font-size:14px!important}
  .brandKicker{font-size:7px!important;letter-spacing:.18em!important}
  .loginBrand h1{font-size:22px!important;letter-spacing:-.035em!important}
  .loginSide{padding:14px 12px 24px!important;align-items:flex-start!important;overflow:visible!important}
  .loginCard{max-width:470px!important;padding:20px 18px 17px!important;border-radius:22px!important;border:1px solid #e6ebf1!important;box-shadow:0 16px 45px rgba(4,22,42,.10)!important}
  .loginTitle h2{font-size:27px!important}.loginTitle .muted{font-size:11px!important;line-height:1.45!important}
  .loginCard label{font-size:11px!important;margin-top:13px!important}.loginCard input{min-height:52px!important;border-radius:14px!important;padding:0 14px!important}
  .loginButton{min-height:52px!important;border-radius:14px!important;font-size:16px!important}.secureNote{font-size:9px!important}

  /* header */
  .topbar{min-height:52px!important;margin:-8px -10px 8px!important;padding:8px 10px!important;border-bottom:1px solid #e5e9ee!important;box-shadow:none!important}
  .pageHeading h1{font-size:20px!important;max-width:54vw!important}.pageHeading .eyebrow{font-size:7px!important}
  .statusPill{font-size:8px!important;padding:7px 8px!important}.iconBtn{width:36px!important;height:36px!important}

  /* menu inferior compacto de verdade */
  .sidebar{position:fixed!important;left:8px!important;right:8px!important;bottom:8px!important;top:auto!important;width:auto!important;height:60px!important;min-height:60px!important;padding:4px!important;border-radius:18px!important;background:rgba(5,20,36,.96)!important;backdrop-filter:blur(18px);box-shadow:0 12px 36px rgba(4,18,34,.25)!important;z-index:800!important}
  .sidebar nav{height:52px!important;display:flex!important;align-items:stretch!important;gap:4px!important;padding:0!important;margin:0!important;overflow:visible!important}
  .sidebar>.brand,.sidebar>.sideFoot{display:none!important}
  .navItem{height:52px!important;min-height:52px!important;max-height:52px!important;flex:1 1 0!important;padding:4px 2px!important;border-radius:14px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:1px!important;overflow:hidden!important}
  .navItem .navIcon{width:23px!important;height:23px!important;font-size:14px!important;line-height:23px!important}.navItem em{font-size:8px!important;line-height:1.1!important}
  .navItem.active{background:rgba(255,255,255,.10)!important}.navItem.active:before{top:0!important;height:2px!important;width:24px!important}
  .navItem.mobileSecondaryNav{display:none!important}.mobileMoreBtn,.mobileWaiterLogout{display:flex!important}

  /* mesas — uma coluna legível e rápida */
  #tablesTab>.panel{padding:12px!important;border-radius:17px!important}
  #tablesTab>.panel>.panelHead{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:start!important;gap:9px!important}
  #tablesTab .panelHead .muted{display:none!important}
  #tablesTab .headBtns .secondary{display:none!important}
  #openTableTop{min-height:38px!important;padding:8px 11px!important;font-size:11px!important}
  .tableGrid{grid-template-columns:1fr!important;gap:9px!important}
  .tableCard{padding:13px 13px 12px!important;border-radius:16px!important;box-shadow:0 7px 20px rgba(7,24,45,.055)!important}
  .tableCard>b{font-size:18px!important}.tableCard small{font-size:10px!important;line-height:1.4!important;min-height:0!important;margin:4px 0 9px!important}
  .tableCard button{min-height:39px!important;font-size:10px!important;border-radius:10px!important}
  .tableCard button.primary{width:100%!important}.tableCard button.secondary,.tableCard button.ghost{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:calc(50% - 3px)!important;margin-right:2px!important}

  /* pedido / catálogo */
  body[data-active-tab="order"] .topbar{display:none!important}
  body[data-active-tab="order"] .content{padding:6px 8px 76px!important}
  .posOrderHeader{position:sticky!important;top:0!important;z-index:120!important;margin:0 0 6px!important;padding:9px 10px!important;border-radius:14px!important;grid-template-columns:34px minmax(0,1fr) auto!important;box-shadow:0 8px 22px rgba(6,21,37,.12)!important}
  .posBack{width:32px!important;height:32px!important;font-size:24px!important}.posOrderHeader>div:nth-child(2) b{font-size:13px!important}.posHeaderMoney strong{font-size:15px!important}
  .posModeSwitch{position:sticky!important;top:48px!important;z-index:119!important;margin:0 0 6px!important;width:100%!important;border-radius:11px!important;padding:3px!important}
  .posModeSwitch button{padding:8px 6px!important;font-size:10px!important}
  .posLaunchView{display:block!important}.posReceiptView{display:none!important}.lux-pos[data-order-mode="view"] .posLaunchView{display:none!important}.lux-pos[data-order-mode="view"] .posReceiptView{display:block!important}

  /* substitui o carrinho fixo que cobria a tela */
  .posCart{display:none!important}
  .mobileOrderStrip{display:block!important;position:sticky;top:87px;z-index:115;background:#fff;border:1px solid #e1e7ee;border-radius:14px;margin:0 0 7px;padding:9px 9px 8px;box-shadow:0 8px 24px rgba(7,23,42,.09)}
  .mobileOrderStripTop{display:flex;align-items:center;justify-content:space-between;gap:8px}.mobileOrderStripTop div:first-child{min-width:0}.mobileOrderStripTop span{display:block;font-size:7px;letter-spacing:.12em;color:#8a96a5;font-weight:900}.mobileOrderStripTop b{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobileOrderStripTotal{text-align:right;white-space:nowrap}.mobileOrderStripTotal small{display:block;font-size:7px;color:#8793a2}.mobileOrderStripTotal strong{font-size:15px;color:#0d2d50}
  .mobileOrderChips{display:flex;gap:5px;overflow-x:auto;padding:7px 0 2px;scrollbar-width:none}.mobileOrderChips::-webkit-scrollbar{display:none}.mobileOrderChip{flex:0 0 auto;max-width:190px;border:1px solid #e4e9ef;background:#f7f9fb;border-radius:999px;padding:6px 9px;font-size:9px;color:#30455c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobileOrderChip b{color:#10253d;margin-right:3px}.mobileOrderEmpty{font-size:9px;color:#8490a1;padding:7px 1px 1px}
  .mobileOrderActions{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:7px}.mobileOrderActions button{min-height:35px;border:0;border-radius:10px;font-size:9px;font-weight:850}.mobileOrderActions .openCart{background:#eef2f7;color:#29435f}.mobileOrderActions .payNow{background:linear-gradient(135deg,#0c3158,#071827);color:#fff}

  .posCatalog{padding:9px!important;border-radius:14px!important;box-shadow:none!important}.posSearch input{height:44px!important;border-radius:11px!important;font-size:16px!important}.posCategories{padding:8px 0 5px!important}.posCategories button{font-size:9px!important;padding:7px 10px!important}
  .posProductGrid{grid-template-columns:1fr 1fr!important;gap:7px!important}.posProduct{border-radius:13px!important}.posProductMain{min-height:80px!important;grid-template-columns:30px minmax(0,1fr) auto!important;padding:9px!important;gap:6px!important}.posProductIcon{width:29px!important;height:29px!important}.posProductInfo b{font-size:11px!important}.posProductInfo small{font-size:9px!important}.posPlus{font-size:9px!important}.posQtyBadge{height:21px!important;min-width:21px!important;font-size:8px!important}.posCatalogScroll{padding-bottom:8px!important}

  /* comanda completa — sem barra cobrindo conteúdo */
  .luxReceipt{border:0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important}.luxReceiptToolbar{position:sticky;top:0;z-index:120;background:#f4f6f8!important;padding:5px 0 7px!important;border:0!important}.luxReceiptToolbar button{min-height:35px!important;font-size:9px!important;border-radius:10px!important}
  .luxReceiptHead{border-radius:16px 16px 0 0!important;padding:14px 12px!important;grid-template-columns:42px minmax(0,1fr)!important}.luxMonogram{width:40px!important;height:40px!important}.luxStatus{display:none!important}
  .luxSummary{border-radius:0 0 16px 16px!important;overflow:hidden!important;margin-bottom:8px!important}.luxSummary>div{padding:10px 8px!important}.luxSummary span{font-size:7px!important}.luxSummary b{font-size:12px!important}.luxSummary>div:first-child b{font-size:17px!important}
  .luxSection,.luxDetails{background:#fff!important;border:1px solid #e5eaf0!important;border-radius:14px!important;margin:8px 0!important;padding:11px 10px!important}.luxSectionTitle b{font-size:12px!important}.luxLine{grid-template-columns:35px minmax(0,1fr) auto!important;padding:9px 0!important}.luxLine b,.luxPayment b{font-size:10px!important}.luxLine small,.luxPayment small{font-size:8px!important}.luxLine strong,.luxPayment strong{font-size:10px!important}
  .luxBottomActions{position:static!important;z-index:auto!important;background:transparent!important;border:0!important;padding:4px 0 8px!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px!important}.luxBottomActions button{min-height:40px!important;font-size:10px!important;border-radius:11px!important}.luxBottomActions .payPrimary{grid-column:1/-1!important}

  /* modal: sempre acima da navegação e com botão alcançável */
  .modal{align-items:flex-end!important;padding:8px!important;background:rgba(4,17,31,.67)!important;backdrop-filter:blur(6px)!important}
  .modalCard{width:100%!important;max-width:520px!important;margin:0 auto!important;max-height:calc(100dvh - 16px)!important;overflow:auto!important;border-radius:22px!important;padding:18px 15px calc(22px + env(safe-area-inset-bottom))!important;box-shadow:0 24px 70px rgba(0,0,0,.30)!important}
  .modalCard h2{font-size:25px!important}.modalCard label{font-size:11px!important}.modalCard input,.modalCard select{min-height:51px!important;border-radius:13px!important}.modalCard .headBtns{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:6px!important}.modalCard .headBtns button{min-height:40px!important;font-size:10px!important}.modalCard #weightPreview{margin-top:10px!important}.modalCard>.primary.full{min-height:49px!important;margin-top:10px!important}

  /* home / caixa / admin */
  .panel{border-radius:16px!important}.stats{grid-template-columns:1fr 1fr!important}.twoCol{display:block!important}.formPanel{position:static!important;margin-bottom:9px!important}.cashHero{grid-template-columns:1fr!important}.cashState,.cashForm{border-radius:16px!important}
}

@media(max-width:390px){
  .posProductGrid{grid-template-columns:1fr 1fr!important}.mobileOrderChip{max-width:150px}.loginCard{padding-left:15px!important;padding-right:15px!important}
}

@media(min-width:781px){
  .mobileOrderStrip{display:none!important}
  .posLaunchView{grid-template-columns:minmax(0,1.6fr) minmax(360px,.55fr)!important;gap:18px!important}
  .posCatalog{border-radius:22px!important;padding:18px!important}.posProductGrid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important}.posProductMain{min-height:92px!important}.posCart{top:94px!important;border-radius:22px!important}
  .luxReceipt{max-width:980px;margin:0 auto!important;border-radius:22px!important}.tableGrid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))!important;gap:16px!important}.tableCard{padding:18px!important}
}

/* v14.1 — feedback discreto de sincronização em tempo real */
.topbar.syncPulse{animation:edsSyncPulse .45s ease}
@keyframes edsSyncPulse{0%{box-shadow:inset 0 2px 0 rgba(16,185,129,0)}45%{box-shadow:inset 0 2px 0 rgba(16,185,129,.75)}100%{box-shadow:inset 0 2px 0 rgba(16,185,129,0)}}

/* v14.5 — operação mobile mais rápida: mesa -> pedido e cards de toque */
@media(max-width:780px){
  #tablesTab>.panel{background:transparent!important;border:0!important;box-shadow:none!important;padding:2px!important}
  #tablesTab>.panel>.panelHead{background:#fff!important;border:1px solid #e4e9ef!important;border-radius:18px!important;padding:13px!important;margin-bottom:9px!important;box-shadow:0 7px 22px rgba(7,24,45,.055)!important}
  #tablesTab .panelHead h2{font-size:19px!important;margin-top:2px!important}
  #openTableTop{min-height:42px!important;border-radius:12px!important;padding:9px 12px!important;font-size:11px!important;box-shadow:0 7px 16px rgba(8,50,88,.14)!important}
  .tableGrid{gap:10px!important}
  .tableCard{padding:14px!important;border-radius:18px!important;border:1px solid #e2e8ef!important;box-shadow:0 8px 25px rgba(7,24,45,.065)!important}
  .tableCard:before{width:4px!important;border-radius:18px 0 0 18px!important}
  .tableCardHead{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:10px!important}
  .tableCardHead>div{min-width:0!important}.tableCardHead b{display:block!important;font-size:19px!important;line-height:1.05!important;color:#10253d!important}.tableCardHead small{display:block!important;margin:5px 0 0!important;min-height:0!important;font-size:12px!important;line-height:1.25!important;color:#566a81!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .tableOpenBadge{flex:0 0 auto!important;border-radius:999px!important;background:#e9f8f1!important;color:#087d5b!important;border:1px solid #c9eddd!important;padding:5px 8px!important;font-size:7px!important;font-weight:950!important;letter-spacing:.08em!important}
  .tableCardMeta{margin:8px 0 10px!important;font-size:9px!important;color:#8a96a5!important}
  .tableOrderBtn{min-height:46px!important;border-radius:13px!important;font-size:12px!important;font-weight:900!important;margin:0!important;background:linear-gradient(135deg,#0b3158,#061827)!important;box-shadow:0 8px 18px rgba(6,28,50,.15)!important}
  .tableCardActions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important;margin-top:7px!important}
  .tableCardActions button{width:100%!important;min-height:38px!important;margin:0!important;border-radius:11px!important;font-size:9px!important}

  body[data-active-tab="order"] .content{padding:6px 7px 76px!important;background:#f2f5f8!important}
  .posOrderHeader{border-radius:16px!important;padding:10px 11px!important;margin-bottom:6px!important;background:linear-gradient(135deg,#071625,#0c345d)!important}
  .posModeSwitch{top:55px!important;border-radius:12px!important;background:#e2e8ef!important}
  .posModeSwitch button{min-height:34px!important;font-weight:900!important}
  .mobileOrderStrip{top:96px!important;border-radius:15px!important;border-color:#dfe6ee!important;padding:9px 10px!important;margin-bottom:8px!important;box-shadow:0 7px 18px rgba(8,25,45,.07)!important}
  .mobileOrderActions button{min-height:38px!important;font-size:9px!important}
  .posCatalog{border:1px solid #e1e7ee!important;background:#fff!important;border-radius:16px!important;padding:10px!important}
  .posSearch{position:sticky!important;top:198px!important;z-index:108!important;background:#fff!important;padding-bottom:6px!important}
  .posSearch input{height:48px!important;border-radius:13px!important;background:#f6f8fa!important;border-color:#dbe3ec!important;padding-left:42px!important}
  .posCategories{position:sticky!important;top:252px!important;z-index:107!important;background:#fff!important;margin:0 -2px!important;padding:5px 2px 8px!important}
  .posCategories button{padding:8px 11px!important;min-height:34px!important;font-size:9px!important;border-radius:999px!important}
  .posProductGrid{gap:8px!important}.posProduct{border-radius:14px!important;box-shadow:0 3px 10px rgba(7,24,45,.025)!important}
  .posProductMain{min-height:92px!important;grid-template-columns:34px minmax(0,1fr)!important;grid-template-rows:auto auto!important;align-content:center!important;padding:11px 9px!important;gap:6px 8px!important}
  .posProductIcon{width:34px!important;height:34px!important;border-radius:11px!important;font-size:16px!important;grid-row:1/3!important}
  .posProductInfo b{font-size:11px!important;line-height:1.23!important}.posProductInfo small{font-size:9px!important;margin-top:4px!important;color:#526981!important}
  .posPlus{grid-column:2!important;justify-self:start!important;align-self:start!important;padding:5px 8px!important;border-radius:9px!important;font-size:8px!important}
  .posQtyBadge{top:6px!important;right:6px!important;height:22px!important;min-width:22px!important;font-size:8px!important}
  .posMinus{left:6px!important;bottom:6px!important;width:25px!important;height:25px!important}
  .posCatalogScroll{padding-bottom:16px!important}

  .modalCard{border-radius:24px 24px 0 0!important;padding:18px 15px calc(20px + env(safe-area-inset-bottom))!important}
  .modalCard>.primary.full,.payConfirm{min-height:52px!important;font-size:13px!important;border-radius:14px!important}
}
