body.waiter-page.staff-account-enabled .app-toolbar { grid-template-columns: 46px minmax(0,1fr) 44px 44px; }
body.waiter-page .account-menu-toggle { width: 44px; min-width: 44px; padding: 0; }
#selectedStaffAccount { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; letter-spacing: 0; text-transform: none; font-size: 11px; }
body.staff-account-enabled #sectionMenuTitle { display: none; }
body.staff-account-enabled #selectedStaffAccount { font-size: 14px; font-weight: 650; color: #242424; }
.staff-account-dialog.creating-account #staffAccountsPanel,
.staff-account-dialog.creating-account #staffDraftsPanel,
.staff-account-dialog.creating-account > [data-new-account] { display: none; }
.staff-account-dialog { width: min(480px,calc(100vw - 24px)); max-height: calc(100dvh - 32px); padding: 22px; border: 1px solid #eee; border-radius: 24px; background: #fafafa; color: #222; overflow: auto; box-shadow: 0 20px 70px #0003; }
.staff-account-dialog::backdrop { background: #1118; backdrop-filter: blur(5px); }
.staff-account-dialog header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:20px; }
.staff-account-dialog header h2 { font-size:22px; }
.staff-account-dialog header button { width:44px; height:44px; border:0; border-radius:50%; background:#eee; font-size:26px; color:#444; }
.staff-account-dialog section { margin-bottom:18px; }
.staff-account-dialog h3 { font-size:14px; margin-bottom:10px; }
.staff-account-dialog .staff-account-row { display:grid; width:100%; gap:5px; padding:14px; text-align:left; border:1px solid #e9e9ec; background:white; color:#222; border-radius:14px; margin-bottom:8px; min-height:54px; }
.staff-account-dialog .staff-account-row[aria-current="true"] { border-color:#555; }
.staff-account-dialog .staff-account-row span { font-size:12px; color:#666; }
.staff-account-dialog > .btn { width:100%; }
.staff-account-dialog form { display:grid; gap:14px; margin-top:16px; }
.staff-account-dialog form[hidden], .staff-account-dialog section[hidden] { display:none; }
.staff-service-choice { display:grid; gap:7px; font-size:13px; font-weight:700; }
.staff-service-buttons { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.staff-service-buttons .btn { width:100%; min-height:44px; }
.staff-account-dialog label { display:grid; gap:6px; font-size:14px; }
.staff-account-dialog input,.staff-account-dialog select { font-size:16px; }
.staff-account-dialog button:focus-visible { outline:2px solid #666; outline-offset:2px; }
.order-print-dialog { width:min(560px,calc(100vw - 24px)); max-height:calc(100dvh - 32px); padding:20px; border:0; border-radius:22px; background:white; color:#222; }
.order-print-dialog::backdrop { background:#1118; backdrop-filter:blur(5px); }
.order-print-dialog header { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.order-print-dialog h2 { font-size:22px; }
.order-print-dialog [data-close-preview] { border:0; border-radius:50%; width:44px; height:44px; font-size:26px; }
.order-print-dialog p { font-size:13px; color:#666; margin:12px 0; }
.order-print-dialog .btn { width:100%; min-height:44px; margin-bottom:14px; }
.order-print-dialog iframe { border:0; width:100%; height:55dvh; min-height:250px; }
body.orders-page .staff-payment-actions { display:grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 6px; }
.staff-payment-actions .btn { width: 100%; min-width: 0; min-height: 48px; padding-inline: 5px; white-space: nowrap; font-size: 13px; }
.staff-payment-actions .btn:last-child { grid-column: auto !important; }
.staff-payment-card .claim-summary { margin: 0; }
.staff-cash-fields { display:grid; gap:7px; margin:0; padding:0; border:0; background:transparent; font-size:13px; font-weight:700; }
.staff-exact-cash { width:100%; min-height:44px; }
.staff-cash-change { display:flex; justify-content:space-between; margin:0; padding:10px 0; font-size:13px; }
.staff-payment-card .modal-actions .btn { width:100%; min-height:48px; }
.staff-payment-card > .btn,
.staff-receipt-card > .btn { width:100%; min-height:48px; }
.staff-receipt-payment { margin:0; }
.staff-tpv-modal .claim-card { width:min(860px,100%); max-width:860px; max-height:min(820px,calc(100dvh - 32px)); gap:18px; padding:22px; border-radius:24px; background:#f7f7f9; }
.staff-tpv-modal .modal-header { align-items:center; padding-bottom:2px; }
.staff-tpv-modal .modal-header h2 { font-size:30px; letter-spacing:-.6px; }
.staff-tpv-modal .modal-header .muted { font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.staff-tpv-modal .claim-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); align-items:center; gap:10px; padding:16px; background:#fff; border:1px solid #e1e1e7; border-radius:18px; box-shadow:0 8px 22px rgba(0,0,0,.05); }
.staff-tpv-modal .claim-summary p { min-width:0; }
.staff-tpv-modal .claim-summary p:not(:first-child) { padding-left:10px; border-left:1px solid rgba(0,0,0,.1); }
.staff-tpv-modal .account-round { margin:0 0 10px; padding:14px; border:1px solid #e1e1e7; border-radius:16px; background:#fff; }
.staff-tpv-modal .account-round[open] > summary { padding-bottom:10px; border-bottom:1px solid #ececf0; }
.staff-tpv-modal .account-statuses { margin:12px 0 8px; }
.staff-tpv-modal .staff-payment-actions { position:sticky; bottom:-22px; margin:8px -22px -22px; padding:14px 22px 22px; background:linear-gradient(#f7f7f900,#f7f7f9 22%); }
.staff-status-actions { display:flex; flex-wrap:wrap; gap:7px; margin:8px 0 4px; }
.staff-status-actions .btn { min-height:36px; padding-inline:10px; font-size:12px; }
.staff-round-complete { margin:8px 0 4px; color:var(--muted); font-size:12px; font-weight:700; }

@media (max-width: 680px) {
  body.orders-page .layout { padding: 8px 10px 92px; }
  body.orders-page .app-toolbar-shell { width: 100%; margin-inline: 0; }
  body.waiter-page.staff-account-enabled .app-toolbar { grid-template-columns: 40px minmax(0, 1fr) 40px 40px; gap: 5px; padding: 5px; }
  body.orders-page .app-toolbar-logo,
  body.orders-page .app-menu-toggle { width: 40px; min-width: 40px; height: 40px; min-height: 40px; }
  body.orders-page .app-toolbar-logo { display:grid; place-items:center; aspect-ratio:1; padding:0; border-radius:12px; }
  body.orders-page .app-toolbar-logo img { display:block; width:100%; height:100%; object-fit:cover; border-radius:inherit; }
  body.orders-page .app-section-current { min-width: 0; overflow: hidden; }
  body.orders-page #selectedStaffAccount { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
  body.orders-page .menu-grid { min-width: 0; width: 100%; }
  body.orders-page .menu-section { min-width: 0; padding: 10px; border-radius: 15px; }
  body.orders-page .section-grid { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  body.orders-page .menu-card { min-width: 0; min-height: 0; padding: 12px; border-radius: 13px; }
  body.orders-page .card h3 { overflow-wrap: anywhere; font-size: 17px; }
  body.orders-page .card-actions { min-width: 0; }
  body.orders-page .add-float-action { flex: 0 0 38px; width: 38px; height: 38px; }
  body.orders-page .sidebar { left: 8px; right: 8px; bottom: 8px; max-width: none; padding: 40px 8px 8px; }
  body.orders-page .panel { min-width: 0; padding: 12px; border-radius: 14px; }
  body.orders-page .panel-title { gap: 8px; }
  body.orders-page .panel-title h2 { min-width: 0; font-size: 18px; }
  body.orders-page .panel-title-actions .btn { min-height: 36px; padding-inline: 9px; font-size: 12px; }
  body.orders-page .modal-card { width: calc(100vw - 20px); max-width: none; max-height: calc(100dvh - 20px); padding: 14px; border-radius: 16px; }
  body.orders-page .modal-header h2,
  body.orders-page .checkout-heading h2 { font-size: 21px; }
  body.orders-page .checkout-body { gap: 12px; padding: 14px; }
  body.orders-page .checkout-total { padding: 13px 10px; border-radius: 14px; }
  body.orders-page .checkout-total strong { font-size: 30px; }
  body.orders-page .checkout-close { width: 36px; height: 36px; min-height: 36px; font-size: 23px; }
  body.orders-page .staff-payment-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.orders-page .staff-payment-actions .btn { min-height: 44px; font-size: 12px; }
  body.orders-page .staff-payment-card .modal-actions,
  body.orders-page .staff-receipt-card .modal-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.orders-page .staff-account-dialog { width: calc(100vw - 20px); max-width: none; padding: 14px; }
  body.orders-page .staff-account-dialog .staff-account-row { min-width: 0; padding: 11px; }
  body.orders-page .staff-account-dialog form { min-width: 0; }
  body.orders-page .staff-tpv-modal .claim-card { width: calc(100vw - 12px); max-height: calc(100dvh - 12px); padding: 14px; border-radius: 18px 18px 12px 12px; gap: 12px; }
  body.orders-page .staff-tpv-modal .modal-header h2 { font-size: 22px; }
  body.orders-page .staff-tpv-modal .claim-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 10px; }
  body.orders-page .staff-tpv-modal .claim-summary p:not(:first-child) { padding-left: 8px; }
  body.orders-page .staff-tpv-modal .claim-summary p:nth-child(odd) { padding-left: 0; border-left: 0; }
  body.orders-page .staff-status-actions { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.orders-page .staff-status-actions .btn { min-width:0; padding-inline:5px; font-size:11px; white-space:normal; }
  body.orders-page .staff-tpv-modal .staff-payment-actions { bottom:-14px; margin:6px -14px -14px; padding:10px 14px 14px; }
}