/* Mobile layout A. All rules are isolated to the live POS page and small screens. */
.mobile-pos-heading,.mobile-cart-bar,.mobile-cart-backdrop,.mobile-pos-nav,.mobile-close-button,.mobile-more-dialog{display:none}

@media (max-width:650px){
  body.pos-active{background:#f3f5f5;padding-bottom:calc(132px + env(safe-area-inset-bottom))}
  body.pos-active .app-header{display:none}
  body.pos-active .app-shell{padding:0;max-width:none}
  body.pos-active .notification-board{margin:8px 12px;border-radius:12px;box-shadow:none}
  body.pos-active .notification-board>summary{padding:10px 12px}
  body.pos-active .notification-table-wrap{max-height:38vh}

  .mobile-pos-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:19px 17px 12px;background:#fff;border-bottom:1px solid var(--line)}
  .mobile-pos-heading>div:first-child>span{display:block;color:var(--green-dark);font-size:10px;font-weight:900;letter-spacing:1.3px}
  .mobile-pos-heading h1{margin:1px 0 4px;font-size:25px;line-height:1.05}
  .mobile-pos-heading small{font-size:11px;color:var(--muted)}
  .mobile-pos-user{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:11px;padding-top:4px}
  .mobile-pos-user a{width:42px;height:42px;border:1px solid var(--line);border-radius:13px;display:grid;place-items:center;color:var(--ink);text-decoration:none;font-size:22px;background:#fff}
  .pos-toolbar{display:none}

  .open-orders-strip{margin:0;padding:9px 12px;background:#fff;border-bottom:1px solid var(--line);display:block;scroll-margin-top:10px}
  .open-orders-list{gap:7px;padding:0}
  .open-order-card{flex-basis:155px;padding:7px 9px;border-radius:9px;box-shadow:none}
  .open-orders-strip .new-order{display:none}

  .pos-layout{display:block}
  .catalog-panel{width:100%}
  .catalog-head{border:0;border-radius:0;padding:10px 16px 8px;background:#fff;display:block}
  .catalog-head>div{display:none}
  .search{width:100%;height:45px;margin:0;border-radius:12px;background:#f2f5f4;border-color:#e1e6e4;padding-left:14px;font-size:15px}
  .category-filters{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none;padding:6px 16px 12px;border:0;border-bottom:1px solid var(--line);gap:8px;background:#fff}
  .category-filters::-webkit-scrollbar{display:none}
  .category-filter{flex:0 0 auto;min-height:42px;border:0;border-radius:22px;padding:0 16px;background:#f1f4f3;font-size:13px}
  .category-filter span{display:none}
  .category-filter.active{background:var(--green);color:#fff}

  .product-grid{display:grid;grid-template-columns:1fr;gap:0;max-height:none;padding:0 12px 12px;background:#f3f5f5;border:0;overflow:visible}
  .product-group-heading{display:none!important}
  .product-card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto 42px;grid-template-rows:auto auto;column-gap:10px;align-items:center;min-height:72px;width:100%;padding:12px 5px 11px 13px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:#fff;box-shadow:none;text-align:left;transform:none}
  .product-card:first-of-type{border-radius:14px 14px 0 0}
  .product-card:last-child{border-radius:0 0 14px 14px;border-bottom:0}
  .product-card:hover{transform:none;box-shadow:none;border-color:var(--line)}
  .product-card:active{background:#f3fbf8}
  .product-card::after{content:'+';grid-column:3;grid-row:1 / 3;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--green-soft);color:var(--green-dark);font-size:22px;font-weight:500}
  .product-card:disabled::after{content:'×';background:#f2f2f2;color:#9aa3a8}
  .product-name{grid-column:1;grid-row:1;min-height:0;font-size:13px;line-height:1.25;color:var(--ink)}
  .product-card strong{grid-column:2;grid-row:1 / 3;margin:0;color:var(--ink);font-size:15px;text-align:right;white-space:nowrap}
  .product-card small{grid-column:1;grid-row:2;margin:3px 0 0;font-size:11px;color:var(--muted)}
  .product-card.low{background:#fffaf6}
  .product-card:disabled{opacity:.48}
  .category-empty{margin:0 12px;border:0;border-radius:12px;text-align:center}
  .recent-section{display:none}

  .checkout-panel{display:block;position:fixed;z-index:82;left:0;right:0;bottom:0;top:auto;width:100%;max-height:calc(100dvh - 22px);overflow:auto;border:0;border-radius:22px 22px 0 0;box-shadow:0 -18px 50px rgba(16,43,63,.2);transform:translateY(110%);visibility:hidden;transition:transform .22s ease,visibility 0s linear .22s;overscroll-behavior:contain;padding-bottom:env(safe-area-inset-bottom)}
  body.mobile-cart-open{overflow:hidden}
  body.mobile-cart-open .checkout-panel{transform:translateY(0);visibility:visible;transition-delay:0s}
  .checkout-title{position:sticky;top:0;z-index:3;height:70px;padding:12px 16px;background:#fff}
  .checkout-title-actions{display:flex;align-items:center;gap:8px}
  .mobile-close-button{display:grid;width:42px;height:42px;place-items:center;border:0;border-radius:50%;background:#f2f5f4;color:var(--ink);font-size:27px;line-height:1;cursor:pointer}
  .customer-fields{grid-template-columns:minmax(0,1.5fr) minmax(105px,.8fr);gap:8px;padding:11px 16px}
  .customer-fields input{height:42px}
  .customer-fields small{font-size:10px}
  .cart-items{min-height:92px;max-height:32dvh;padding:4px 16px}
  .cart-empty{padding:34px 12px}
  .cart-line{padding:10px 0}
  .cart-controls{gap:7px}
  .cart-controls button{width:38px;height:38px;border-radius:9px;font-size:18px}
  .payment-switch{padding:11px 16px}
  .payment-switch span{height:44px}
  .cart-total{padding:4px 17px 11px}
  .checkout-button{height:50px;margin-bottom:12px}
  .checkout-button kbd{display:none}
  .save-order-form{padding-bottom:10px}
  .shift-shortcut{padding-bottom:18px}

  .mobile-cart-backdrop{position:fixed;display:block;z-index:80;inset:0;background:rgba(16,43,63,.48);opacity:0;visibility:hidden;transition:.2s;cursor:pointer}
  body.mobile-cart-open .mobile-cart-backdrop{opacity:1;visibility:visible}
  .mobile-cart-bar{position:fixed;display:flex;z-index:60;left:12px;right:12px;bottom:calc(66px + env(safe-area-inset-bottom));height:50px;padding:0 15px;border:0;border-radius:12px;align-items:center;justify-content:space-between;gap:8px;background:var(--green);color:#fff;font:600 13px inherit;box-shadow:0 8px 22px rgba(8,112,82,.25);cursor:pointer}
  .mobile-cart-bar strong{font-size:12px;white-space:nowrap}
  .mobile-pos-nav{position:fixed;display:grid;z-index:59;left:0;right:0;bottom:0;height:66px;padding:5px 8px calc(4px + env(safe-area-inset-bottom));grid-template-columns:repeat(4,1fr);background:#fff;border-top:1px solid var(--line);box-shadow:0 -5px 20px rgba(16,43,63,.07)}
  .mobile-pos-nav a,.mobile-pos-nav button{border:0;background:transparent;color:var(--muted);text-decoration:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font:500 10px inherit;cursor:pointer}
  .mobile-pos-nav span{font-size:19px;line-height:1.15}
  .mobile-pos-nav .active{color:var(--green-dark);font-weight:800}

  .mobile-more-dialog{width:calc(100% - 24px);max-width:420px;max-height:85dvh;margin:auto auto 10px;padding:0;border:0;border-radius:20px;color:var(--ink);box-shadow:0 22px 70px rgba(16,43,63,.28)}
  .mobile-more-dialog[open]{display:block}
  .mobile-more-dialog::backdrop{background:rgba(16,43,63,.55)}
  .mobile-more-head{display:flex;justify-content:space-between;align-items:center;padding:18px;border-bottom:1px solid var(--line)}
  .mobile-more-head span{font-size:9px;font-weight:900;letter-spacing:1.2px;color:var(--green-dark)}
  .mobile-more-head h2{margin:2px 0 0}
  .mobile-more-head button{width:40px;height:40px;border:0;border-radius:50%;font-size:25px;background:#f2f5f4}
  .mobile-more-links{display:grid;max-height:56dvh;overflow:auto;padding:7px 16px}
  .mobile-more-links a{min-height:48px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none;font-size:13px;font-weight:750}
  .mobile-more-dialog>form{padding:10px 16px 16px}

  .meal-dialog{position:fixed;inset:auto 0 0;width:100%;max-width:none;max-height:92dvh;margin:0;padding:20px 17px;border:0;border-radius:22px 22px 0 0;overflow:auto}
  .meal-dialog h2{font-size:21px}
  .meal-dialog .meal-options{grid-template-columns:1fr}
}

@media (max-width:360px){
  .mobile-pos-user>span{display:none}
  .product-card{min-height:68px}
  .customer-fields{grid-template-columns:1fr}
  .mobile-cart-bar{left:8px;right:8px}
  .mobile-cart-bar strong{font-size:11px}
}

@media (prefers-reduced-motion:reduce){.checkout-panel,.mobile-cart-backdrop{transition:none!important}}
