/* POS workspace only. Compact gross-price rows; financial calculations stay unchanged. */
.pos-feedback[hidden], .pos-portal [hidden] { display: none !important; }
.prod-add-button { display: flex; flex: 1; width: 100%; flex-direction: column; border: 0; background: transparent; color: inherit; text-align: left; cursor: pointer; font: inherit; }
.prod-options-button { display: flex; justify-content: center; align-items: center; gap: 7px; width: 100%; padding: 9px; border: 0; border-top: 1px solid #e7ece1; background: #f6f9f1; color: #58724d; cursor: pointer; font: inherit; font-size: 12px; }
.pos-item-name { display: block; width: 100%; white-space: normal; padding: 0; border: 0; background: transparent; color: inherit; text-align: left; font: inherit; font-weight: 700; cursor: pointer; }
.pos-line-note { display: inline-flex; align-items: center; justify-content: center; margin: 0; padding: 0; border: 0; background: transparent; color: #72816c; font: inherit; font-size: 12px; cursor: pointer; }
.pos-item-dialog { width: min(460px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); margin: auto; padding: 24px; border: 1px solid #dce5d5; border-radius: 18px; color: #2c4632; background: #ffffff; box-shadow: 0 24px 90px #10231740; overflow-y: auto; }
.pos-item-dialog::backdrop { background: #15281db3; backdrop-filter: blur(3px); }
.pos-item-dialog-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 24px; }
.pos-item-dialog-heading p { margin-bottom: 7px; color: #7b8b72; font-size: 10px; letter-spacing: 1.5px; }
.pos-item-dialog-heading h2 { font-size: 20px; line-height: 1.5; }
.pos-item-dialog-heading > button { flex-shrink: 0; width: 36px; height: 36px; border: 1px solid #dce5d5; border-radius: 8px; background: #f5f8f0; color: #59744c; cursor: pointer; }
.pos-item-dialog label { display: block; margin: 16px 0 8px; color: #576d4d; font-size: 13px; font-weight: 600; }
.pos-item-dialog input, .pos-item-dialog textarea { width: 100%; padding: 12px; border: 1px solid #d8e3d0; border-radius: 9px; font: inherit; font-size: 15px; background: #fbfcf8; }
.pos-note-presets { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }
.pos-note-presets button { min-height: 38px; padding: 8px 11px; border: 1px solid #dbe6d3; border-radius: 20px; background: #f2f7eb; color: #557644; font: inherit; font-size: 12px; cursor: pointer; }
.pos-item-help { margin-top: 16px; color: #7a8673; font-size: 12px; line-height: 1.7; }
.pos-item-dialog-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 24px; }
.pos-item-dialog-actions button { min-height: 44px; padding: 10px 22px; border: 1px solid #dce5d5; border-radius: 9px; background: #f6f9f1; color: #567249; font: inherit; cursor: pointer; }
.pos-item-dialog-actions .pos-primary-button { border-color: #216546; background: #216546; color: #ffffff; }
.pos-feedback { position: fixed; z-index: 120000; left: 50%; bottom: 24px; display: flex; align-items: center; gap: 14px; width: max-content; max-width: min(650px, calc(100vw - 24px)); padding: 14px 16px; border: 1px solid #3e6847; border-radius: 12px; background: #233e2b; color: #ffffff; box-shadow: 0 8px 28px #16301a35; transform: translateX(-50%); font-size: 13px; line-height: 1.6; }
.pos-feedback > span { min-width: 0; }
.pos-feedback button { flex-shrink: 0; min-height: 38px; padding: 7px 11px; border: 1px solid #ffffff47; border-radius: 7px; background: transparent; color: #ffffff; font: inherit; cursor: pointer; }

@media screen {
    .pos-portal body { height: 100dvh; background: #f3f6ef; -webkit-font-smoothing: antialiased; }
    .pos-portal :is(button, input, textarea, select, a):focus-visible { outline: 3px solid #78b690; outline-offset: 2px; }
    .pos-portal button:disabled { cursor: not-allowed; opacity: .5; transform: none !important; }
    .pos-portal .main-body, .pos-portal .tab-pane, .pos-portal .pos-workspace { min-height: 0; min-width: 0; }
    .pos-portal .app-header { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: 'brand actions' 'nav nav'; gap: 0 14px !important; height: auto !important; padding: 0 16px !important; background: #154f38; box-shadow: 0 1px 6px #1a392420; }
    .pos-portal .header-left { grid-area: brand; min-width: 0; gap: 12px !important; padding: 10px 0; }
    .pos-portal .brand-logo-white-badge { min-width: 0; padding: 5px 10px 5px 5px; border-radius: 9px; box-shadow: none; }
    .pos-portal .brand-logo-img { width: 34px; height: 30px; flex-shrink: 0; }
    .pos-portal .brand-text-container { min-width: 0; }
    .pos-portal .brand-logo-text { font-size: 14px; overflow: hidden; text-overflow: ellipsis; }
    .pos-portal .brand-author-text, .pos-portal .brand-sub-badge, .pos-portal .branch-lock-badge { display: none !important; }
    .pos-portal .branch-select-container { min-width: 0; max-width: 220px; flex: 0 1 190px; padding: 8px 11px; background: #ffffff0e; border-color: #ffffff26; }
    .pos-portal .branch-select { min-width: 0; width: 100%; font-size: 13px; }
    .pos-portal .branch-select:disabled { opacity: 1; color: #ffffff; }
    .pos-portal .header-right { grid-area: actions; margin: 0; gap: 10px !important; flex-wrap: nowrap; }
    .pos-portal .btn-header-sync .btn-sync-text { display: none; }
    .pos-portal .btn-header-sync { min-height: 34px; padding: 7px 10px !important; border-radius: 8px !important; background: #ffffff0c !important; box-shadow: none !important; }
    .pos-portal .clock-badge { color: #c8dacb; background: #103f2b; font-size: 12px; font-weight: 500; }
    .pos-portal .user-profile-badge { gap: 9px; padding: 0; border: 0; background: transparent; }
    .pos-portal .cashier-info { max-width: 160px; min-width: 0; font-size: 12px; font-weight: 500; }
    .pos-portal #cashierName { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .pos-portal .user-role-tag { font-size: 10px; background: #dbead8; color: #355c34; }
    .pos-portal .btn-logout { width: 34px; height: 34px; }
    .pos-portal .network-status-badge { font-size: 11px; }
    .pos-portal .system-nav { grid-area: nav; order: initial; width: 100%; padding: 7px 0; gap: 6px !important; border-top: 1px solid #ffffff1c; }
    .pos-portal .sys-tab-btn { padding: 7px 12px !important; font-size: 12px !important; font-weight: 500 !important; }
    /* Nút "Bán Hàng (POS)" chỉ hiện khi đang ở tab khác (vd. Lịch sử hóa đơn) để quay lại màn hình bán */
    .pos-portal #tabBtnPos.active { display: none !important; }

    .pos-portal .pos-workspace { display: grid; grid-template-columns: minmax(0, 1fr) minmax(440px, 42%); }
    .pos-portal .pos-left-panel { min-width: 0; width: auto; height: 100%; border-right: 1px solid #dce5d6; background: #f4f7f0; }
    .pos-portal .pos-sub-header { min-height: 54px; height: auto; flex-shrink: 0; padding: 8px 12px; gap: 10px; border-color: #e1e8da; }
    .pos-portal .btn-sub-toggle { min-height: 38px; padding: 8px 12px; font-size: 13px; font-weight: 600; box-shadow: none; }
    .pos-portal .search-box-f3 { max-width: 320px; min-width: 100px; }
    .pos-portal .search-box-f3 input { min-height: 38px; background: #f6f9f1; border-color: #dce5d5; font-size: 13px; }
    .pos-portal .pos-order-controls { display: flex; align-items: center; flex-wrap: wrap; flex-shrink: 0; gap: 8px; min-height: 48px; padding: 8px 12px; border-bottom: 1px solid #e3eadc; background: #ffffff; }
    .pos-portal .pos-control-label { margin-right: 2px; color: #7a8a70; font-size: 11px; }
    .pos-portal .pos-mode-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 32px; padding: 6px 11px; border: 1px solid #dce5d6; border-radius: 7px; background: #f8faf4; color: #6b7e5d; font: inherit; font-size: 12px; cursor: pointer; }
    .pos-portal .pos-mode-button.active { border-color: #c3d8bd; background: #eaf3e3; color: #376b38; font-weight: 600; }
    .pos-portal #posContextHint { display: -webkit-box; min-width: 0; max-width: 100%; margin-left: auto; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow-wrap: anywhere; color: #728568; font-size: 11px; }
    .pos-portal .category-tabs-bar { min-height: 0; max-height: none; padding: 5px 6px; gap: 4px; background: #f6f9f1; border-color: #e0e8d8; overflow: hidden; }
    .pos-portal .cat-tabs-row { display: flex; flex-wrap: nowrap; justify-content: space-between; overflow-x: auto; overflow-y: hidden; gap: 3px; scrollbar-width: none; -ms-overflow-style: none; }
    .pos-portal .cat-tabs-row::-webkit-scrollbar { display: none; }
    .pos-portal .cat-tab-btn { flex: 1 1 auto !important; min-width: max-content; height: 27px; padding: 2px 3px; font-size: clamp(9.5px, 0.66vw, 11px); font-weight: 700; letter-spacing: -0.35px; border-radius: 6px; }
    .pos-portal .filter-bar-tables { gap: 10px; padding: 12px; flex-wrap: wrap; }
    .pos-portal .status-radio-group { flex-wrap: wrap; }
    .pos-portal .area-pill { min-height: 36px; font-size: 12px; padding: 8px 12px; }
    .pos-portal .kv-table-card { min-width: 0; }
    .pos-portal .tables-matrix-large .table-name { display: -webkit-box; max-width: 100%; padding: 0 5px; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow-wrap: anywhere; line-height: 1.25; font-size: 13px !important; }
    .pos-portal .table-subgroup { max-width: 100%; overflow-wrap: anywhere; }
    .pos-portal .kv-table-card:focus-visible { outline: 3px solid #66ab80; outline-offset: 3px; border-radius: 12px; }
    .pos-portal .products-scroll-area, .pos-portal .tables-scroll-area { min-height: 0; padding: 16px !important; }
    .pos-portal .products-matrix-large { grid-template-columns: repeat(auto-fill, minmax(145px, 1fr)) !important; gap: 12px !important; }
    .pos-portal .products-matrix-large .kv-product-card { min-height: 0 !important; border: 1px solid #dbe5d3; border-radius: 12px; box-shadow: 0 2px 3px #2d482205; overflow: hidden; }
    .pos-portal .products-matrix-large .prod-preview-box { height: 94px !important; border: 0; background-color: #f4f8ee; }
    .pos-portal .products-matrix-large .prod-preview-text { color: #8b9e7b; font-size: 24px; }
    .pos-portal .products-matrix-large .prod-info { flex: 1; width: 100%; min-width: 0; padding: 12px; }
    .pos-portal .products-matrix-large .prod-title { min-height: 39px !important; font-size: 13px !important; font-weight: 600; line-height: 1.5 !important; white-space: normal; overflow-wrap: anywhere; }
    .pos-portal .products-matrix-large .prod-price { margin-top: 8px; font-size: 17px !important; font-weight: 700; color: #296343; }
    .pos-portal .thuc-don-footer, .pos-portal .phong-ban-footer { min-height: 42px; height: auto; padding: 6px 12px; border-color: #dfe7d7; }
    .pos-portal .pos-result-count { color: #7b8c70; font-size: 11px; }
    .pos-portal .btn-back-tables { min-height: 32px; font-size: 11px; font-weight: 500; border-color: #d0dfc6; background: #f3f8eb; color: #5b7a46; }

    .pos-portal .pos-right-panel { display: flex; width: auto; min-width: 0; height: 100%; min-height: 0; background: #ffffff; }
    .pos-portal .cart-top-bar { display: grid; grid-template-columns: minmax(0, 1fr) auto; min-height: 0; height: auto !important; padding: 12px; gap: 8px; flex-shrink: 0; border-color: #e2eadb; }
    .pos-portal .btn-mobile-back-menu { display: none !important; }
    .pos-portal .active-table-pill { min-width: 0; width: fit-content; max-width: 100%; padding: 7px 10px; font-size: 13px; white-space: normal; }
    .pos-portal #cartTableName { min-width: 0; overflow-wrap: anywhere; }
    .pos-portal .btn-top-transfer { margin: 0; padding: 7px 10px; font-size: 11px; border-color: #dce7d3; color: #4e7140; background: #f5f9ef; }
    .pos-portal .customer-search-box { min-width: 0; width: 100%; height: 36px; grid-column: 1; order: initial; }
    .pos-portal .customer-search-box input { min-width: 0; width: 100%; font-size: 12px; }
    .pos-portal .price-mode-badge { grid-column: 2; padding: 6px 8px; order: initial; max-width: 140px; overflow-wrap: anywhere; white-space: normal; font-size: 10px; }
    .pos-portal .pos-order-scroll { flex: 1; min-height: 0; min-width: 0; display: grid; grid-template-rows: minmax(160px, 1fr) minmax(0, auto); overflow: hidden; }
    .pos-portal .cart-body-area { min-height: 0; min-width: 0; overflow-y: auto; }
    .pos-portal .empty-cart-kv { min-height: 110px; padding: 20px; }
    .pos-portal .empty-icon-box { width: 44px; height: 44px; font-size: 22px; }
    .pos-portal .empty-cart-kv h4 { margin-top: 12px; font-size: 14px; }
    .pos-portal .empty-cart-kv p { font-size: 12px; line-height: 1.7; }
    .pos-portal .cart-items-table-container { overflow-x: auto; overscroll-behavior-inline: contain; }
    .pos-portal .cart-items-table { --pos-quantity-width: max(88px, var(--pos-quantity-min, 76px)); --pos-unit-width: max(72px, var(--pos-unit-min, 55px)); --pos-total-width: max(80px, var(--pos-line-total-min, 59px)); --pos-delete-width: 28px; width: 100%; min-width: calc(100px + var(--pos-quantity-width) + var(--pos-unit-width) + var(--pos-total-width) + var(--pos-delete-width)); table-layout: fixed; }
    .pos-portal .cart-items-table th { padding: 8px 4px !important; white-space: nowrap; font-size: 11px; font-weight: 600; background: #f5f8f0; }
    .pos-portal .cart-item-row td { padding: 4px !important; white-space: nowrap; font-size: 12px !important; vertical-align: middle; }
    .pos-portal .cart-items-table th:nth-child(1) { width: auto !important; }
    .pos-portal .cart-items-table th:nth-child(2) { width: var(--pos-quantity-width) !important; }
    .pos-portal .cart-items-table th:nth-child(3) { width: var(--pos-unit-width) !important; }
    .pos-portal .cart-items-table th:nth-child(4) { width: var(--pos-total-width) !important; }
    .pos-portal .cart-items-table th:nth-child(5) { width: var(--pos-delete-width) !important; padding-inline: 0 !important; }
    .pos-portal .pos-line-main { display: flex; align-items: center; gap: 4px; min-width: 0; }
    .pos-portal .pos-item-name { flex: 1; width: auto; min-width: 0; min-height: 36px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; overflow-wrap: normal; font-size: 13px; line-height: 1.4; }
    .pos-portal .pos-item-name > i { display: none !important; }
    .pos-portal .pos-line-note { flex: 0 0 24px; width: 24px; height: 36px; border-radius: 6px; }
    .pos-portal .pos-line-note:hover { background: #edf3e6; color: #2d6340; }
    .pos-portal .pos-line-note.has-note { color: #176544; background: #e7f2e4; }
    .pos-portal .pos-unit-price { display: flex; align-items: center; justify-content: flex-end; width: 100%; min-height: 36px; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; white-space: nowrap; font-variant-numeric: tabular-nums; }
    .pos-portal .pos-unit-price.is-editable { color: #176544; text-decoration: underline dotted; text-underline-offset: 4px; cursor: pointer; }
    .pos-portal .cart-item-row .item-total-col { font-weight: 700; font-variant-numeric: tabular-nums; }
    .pos-portal .qty-control-kv { gap: 2px; justify-content: center; }
    .pos-portal .btn-qty-kv { flex-shrink: 0; width: 28px !important; height: 36px !important; min-height: 36px; font-size: 17px; border-color: #dce6d2; background: #f4f8ed; border-radius: 6px; }
    .pos-portal .qty-val-kv { min-width: 0 !important; font-size: 12px !important; font-variant-numeric: tabular-nums; }
    .pos-portal .cart-item-row .item-delete-col { padding-inline: 0 !important; }
    .pos-portal .btn-del-item { width: 24px; min-width: 24px; min-height: 36px; padding: 0; border: 0; border-radius: 6px; background: transparent; font-size: 12px; }
    .pos-portal .cart-bottom-area { min-height: 0; max-height: min(34dvh, 310px); overflow-y: auto; padding: 12px; gap: 10px; border-color: #e1e9d9; scrollbar-width: thin; }
    .pos-portal .cart-meta-row { gap: 10px; flex-wrap: wrap; }
    .pos-portal .cashier-select-wrap { font-size: 11px; font-weight: 500; color: #68815b; }
    .pos-portal .meta-tools { margin-left: auto; gap: 6px; }
    .pos-portal .meta-tools .btn-meta-tool { min-height: 34px; padding: 6px 10px; border-color: #dbe5d2; border-radius: 7px; background: #f7faf2; font-size: 11px; font-weight: 500; }
    .pos-portal .cart-financial-summary > .summary-line:first-child, .pos-portal .subtotal-summary-line, .pos-portal .vat-summary-line, .pos-portal #vatBreakdownDetails { display: none !important; }
    .pos-portal .cash-tendered-box { border-color: #dce7d3; background: #f5f9ef; }
    .pos-portal .payment-method-row { gap: 7px; flex-wrap: wrap; }
    .pos-portal .btn-pm-tab { min-height: 34px; padding: 7px 10px; font-size: 12px; }
    .pos-portal .cash-chip { min-height: 34px; padding: 7px 8px; font-size: 11px; }
    .pos-portal .quick-cash-chips { flex-wrap: wrap; }
    .pos-portal .tendered-inputs { gap: 10px; flex-wrap: wrap; }
    .pos-portal .t-col input { min-height: 38px; max-width: 130px; }
    .pos-portal .pos-payment-feedback { margin-top: 6px; color: #547847; font-size: 11px; line-height: 1.7; }
    .pos-portal .pos-payment-feedback.is-short { color: #a65918; font-weight: 600; }
    .pos-portal .einvoice-toggle-top-bar { flex-wrap: wrap; gap: 8px; }
    .pos-portal .einvoice-cart-toggle-row { border-color: #dce6d3; }
    .pos-portal .pos-checkout-dock { flex-shrink: 0; padding: 12px; border-top: 1px solid #dce6d3; box-shadow: 0 -5px 16px #25402a08; background: #ffffff; z-index: 2; }
    .pos-portal .pos-feedback { bottom: 180px; }
    .pos-portal .pos-dock-heading { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; margin-bottom: 10px; text-align: center; }
    .pos-portal .pos-dock-heading > div { width: 100%; min-width: 0; }
    .pos-portal .pos-dock-label { display: block; color: #43624e; font-size: 12px; font-weight: 600; }
    .pos-portal #cartTotalText { display: block; margin-top: 3px; color: #c33712; font-size: 56px; line-height: 1.1; font-weight: 800; font-variant-numeric: tabular-nums; letter-spacing: -1px; overflow-wrap: anywhere; }
    .pos-portal .pos-draft-status { max-width: 100%; padding: 2px 8px; border: 1px solid #dce7d3; border-radius: 18px; background: #f2f7eb; color: #64814f; font-size: 9px; line-height: 1.5; overflow-wrap: anywhere; }
    .pos-portal .pos-draft-status[data-state='draft'] { color: #946625; border-color: #ecdfc5; background: #fcf8ee; }
    .pos-portal .pos-draft-status[data-state='error'] { color: #a34c41; border-color: #ecd5cd; background: #fff5f0; }
    .pos-portal .cart-action-buttons { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin: 0; }
    .pos-portal .btn-kv-action { min-width: 0; height: 36px; border-width: 1px; border-radius: 8px; font-size: 11px; font-weight: 600; box-shadow: none; }
    .pos-portal .btn-kv-checkout { height: 46px; grid-column: 1 / -1; background: #216546; font-size: 15px; font-weight: 600; box-shadow: none; }
    .pos-portal .btn-kv-print-kitchen { background: #faf6ec; border-color: #e5dcc5; color: #9a782e; }
    .pos-portal .btn-kv-print-customer { background: #f5f8f0; border-color: #dce5d2; color: #6a815a; }
    .pos-portal .pos-save-button { background: #eff5e7; color: #507442; border: 1px solid #ccdcbc; }
    .pos-portal kbd { margin-left: 4px; font: inherit; font-size: 9px; opacity: .65; }
    .pos-portal.pos-locked :is(.kv-product-card, .kv-table-card, .pos-line-note, .pos-item-name, .pos-unit-price.is-editable, .qty-control-kv, .btn-del-item) { pointer-events: none; opacity: .65; }

    @media (max-width: 1200px) {
        .pos-portal .clock-badge { display: none; }
        .pos-portal .cashier-info { max-width: 130px; }
        .pos-portal .tables-matrix-large { grid-template-columns: repeat(auto-fill, minmax(105px, 1fr)) !important; }
    }
    @media (max-width: 900px) {
        .pos-portal .pos-workspace { display: flex; flex-direction: column; }
        .pos-portal .pos-left-panel { flex: 1 1 auto !important; height: auto !important; padding-bottom: 66px !important; }
        .pos-portal .pos-workspace.mobile-cart-open .pos-left-panel { flex: 0 0 auto !important; padding-bottom: 0 !important; }
        .pos-portal .pos-workspace.mobile-cart-open .pos-order-controls { display: none; }
        .pos-portal .pos-workspace.mobile-cart-open .pos-right-panel { display: flex !important; overflow: hidden !important; min-height: 0; }
        .pos-portal .pos-workspace.mobile-cart-open .pos-order-scroll { display: block; overflow-y: auto; -webkit-overflow-scrolling: touch; }
        .pos-portal .pos-workspace.mobile-cart-open .cart-body-area { min-height: 0 !important; overflow: visible; flex: initial !important; }
        .pos-portal .pos-workspace.mobile-cart-open .cart-bottom-area { max-height: none; overflow: visible; padding-bottom: 12px !important; }
        .pos-portal .pos-checkout-dock { padding-bottom: max(12px, env(safe-area-inset-bottom)); }
        .pos-portal .mobile-floating-cart-bar { background: #244b32; border-color: #8ab06d; box-shadow: 0 -3px 14px #233b2520; }
        .pos-portal .m-cart-bar-btn { background: #e3efda; color: #315b2e; box-shadow: none; font-size: 12px; }
    }
    @media (max-width: 640px) {
        .pos-portal .app-header { grid-template-columns: minmax(0, 1fr); grid-template-areas: 'brand' 'actions' 'nav'; padding: 0 10px !important; }
        .pos-portal .header-left { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); width: 100%; padding: 8px 0 6px; gap: 8px !important; }
        .pos-portal .brand-logo-white-badge { max-width: 100%; padding: 4px 6px !important; }
        .pos-portal .brand-logo-img { width: 26px !important; height: 26px !important; }
        .pos-portal .brand-logo-text { font-size: 11px !important; }
        .pos-portal .branch-select-container { width: 100%; max-width: none; padding: 6px 8px !important; }
        .pos-portal .branch-select { max-width: 100%; font-size: 16px !important; }
        .pos-portal .header-right { justify-content: flex-end; width: 100%; padding-bottom: 7px; }
        .pos-portal .network-status-badge { margin-right: auto; }
        .pos-portal .header-right .user-role-tag, .pos-portal .header-right .cashier-info { display: none; }
        .pos-portal .system-nav { padding: 6px 0; }
        .pos-portal .pos-sub-header { padding: 6px 8px; gap: 6px; }
        .pos-portal .btn-sub-toggle { padding: 8px 10px; font-size: 12px; }
        .pos-portal .left-toggle-buttons { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; gap: 5px; }
        .pos-portal .left-toggle-buttons .btn-sub-toggle { min-width: 0; padding: 8px 4px !important; gap: 4px; font-size: 11px !important; white-space: nowrap; }
        .pos-portal .mobile-cart-tab-badge { min-width: 17px; padding: 1px 3px; font-size: 10px; }
        .pos-portal .pos-order-controls { padding: 6px 8px; gap: 6px; }
        .pos-portal .pos-control-label { display: none; }
        .pos-portal #posContextHint { font-size: 10px; }
        .pos-portal .cat-tabs-row { flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
        .pos-portal .cat-tab-btn { flex: 0 0 auto !important; padding: 4px 9px; font-size: 11px; }
        .pos-portal .products-scroll-area, .pos-portal .tables-scroll-area { padding: 10px !important; }
        .pos-portal .products-matrix-large { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 9px !important; }
        .pos-portal .products-matrix-large .prod-preview-box { height: 74px !important; }
        .pos-portal .products-matrix-large .prod-info { padding: 10px; }
        .pos-portal .products-matrix-large .prod-title { font-size: 12px !important; }
        .pos-portal .products-matrix-large .prod-price { font-size: 16px !important; }
        .pos-portal .prod-options-button { min-height: 36px; font-size: 11px; }
        .pos-portal .cart-top-bar { padding: 8px; grid-template-columns: minmax(0, 1fr) auto; gap: 7px; }
        .pos-portal .customer-search-box { grid-column: 1 / -1; }
        .pos-portal .price-mode-badge { display: none; }
        .pos-portal .active-table-pill { padding: 6px 8px; font-size: 12px !important; }
        .pos-portal .cart-items-table { --pos-quantity-width: max(76px, var(--pos-quantity-min, 76px)); --pos-unit-width: max(55px, var(--pos-unit-min, 55px)); --pos-total-width: max(59px, var(--pos-line-total-min, 59px)); --pos-delete-width: 24px; }
        .pos-portal .cart-items-table th { font-size: 10px !important; }
        .pos-portal .cart-item-row td { font-size: 11px !important; }
        .pos-portal .pos-item-name { font-size: 12px; }
        .pos-portal .btn-qty-kv { width: 24px !important; }
        .pos-portal .qty-val-kv { font-size: 11px !important; }
        .pos-portal .cart-bottom-area { padding: 10px !important; }
        .pos-portal .pos-checkout-dock { padding: 10px; padding-bottom: max(10px, env(safe-area-inset-bottom)); }
        .pos-portal #cartTotalText { font-size: 44px; }
        .pos-portal .btn-kv-action { font-size: 11px !important; min-height: 36px; height: 36px !important; }
        .pos-portal .btn-kv-checkout { min-height: 44px; height: 44px !important; font-size: 14px !important; }
        .pos-portal .meta-tools { width: auto; margin-left: auto; }
        .pos-portal .cashier-select-wrap { max-width: 140px; }
        .pos-portal .cash-chip { padding: 7px 6px; }
        .pos-portal .tendered-inputs { flex-direction: row; }
        .pos-portal .pos-feedback { bottom: 180px; gap: 8px; font-size: 12px; padding: 10px 12px; }
        .pos-portal .pos-feedback #btnDismissPosFeedback { display: none; }
    }
    @media (prefers-reduced-motion: reduce) {
        .pos-portal *, .pos-portal *::before, .pos-portal *::after { transition-duration: 0s !important; animation-duration: 0s !important; scroll-behavior: auto !important; }
    }
    @media (max-height: 500px) and (max-width: 900px) {
        .pos-portal .pos-checkout-dock { padding: 6px; }
        .pos-portal .pos-dock-heading { margin-bottom: 6px; }
        .pos-portal .pos-dock-label { display: none; }
        .pos-portal #cartTotalText { margin: 0; font-size: 34px; }
    }
}
@media print { .pos-checkout-dock, .pos-order-controls, .pos-feedback, .pos-item-dialog { display: none !important; } }

/* ================= IN ẤN: nút trạng thái, khay phiếu đã gửi, hộp thoại máy này ================= */
.app-header .btn-print-settings { position: relative; display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: 7px; min-width: 44px; height: 44px; padding: 7px 10px; border: 1px solid #ffffff29; border-radius: 8px; background: transparent; color: #fff; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
.app-header .btn-print-settings[hidden] { display: none !important; }
.app-header .btn-print-settings.is-ok::after, .app-header .btn-print-settings.is-error::after { content: ''; position: absolute; top: 6px; right: 6px; width: 9px; height: 9px; border: 2px solid #154f38; border-radius: 50%; background: #4ade80; }
.app-header .btn-print-settings.is-error::after { background: #f97316; }
/* Top right, under the header: the bottom of the POS screen holds the checkout button. */
.print-job-tray { position: fixed; right: 16px; top: 64px; z-index: 99990; display: flex; flex-direction: column; gap: 8px; width: min(340px, calc(100vw - 32px)); }
.print-job-tray[hidden] { display: none; }
.print-job-card { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border: 1px solid #cfe3d4; border-left: 4px solid #176544; border-radius: 10px; background: #fff; color: #20382d; box-shadow: 0 10px 30px #12372326; font-size: 13px; line-height: 1.5; }
.print-job-card strong { font-size: 13px; }
.print-job-card.is-warning { border-color: #f3d2bd; border-left-color: #ea580c; background: #fff8f2; }
.print-job-card.is-done { border-left-color: #22c55e; }
.print-job-actions { display: flex; gap: 8px; margin-top: 6px; }
.print-job-actions button { min-height: 40px; padding: 8px 12px; border: 1px solid #176544; border-radius: 8px; background: #176544; color: #fff; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.print-job-actions button.is-quiet { border-color: #d6e2d7; background: #fff; color: #42624e; }
.print-job-actions button:disabled { opacity: .6; cursor: default; }
.print-settings-dialog { width: min(520px, calc(100vw - 28px)); max-height: calc(100dvh - 28px); margin: auto; padding: 22px; overflow-y: auto; border: 1px solid #d9e4da; border-radius: 16px; background: #fff; color: #20382d; box-shadow: 0 24px 80px #12372340; }
.print-settings-dialog::backdrop { background: #142b20a6; }
.print-settings-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.print-settings-heading h2 { font-size: 19px; }
.print-settings-heading > button { width: 40px; height: 40px; border: 1px solid #dce5dd; border-radius: 9px; background: #f4f7f1; color: #42624e; cursor: pointer; }
.print-settings-dialog section { margin-top: 18px; padding-top: 14px; border-top: 1px solid #e6eee7; }
.print-settings-dialog h3 { margin-bottom: 10px; font-size: 14px; color: #203e2c; }
.print-routes-summary { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.print-routes-summary li { display: flex; justify-content: space-between; gap: 12px; padding: 9px 12px; border-radius: 8px; background: #f4f8f3; font-size: 13px; }
.print-routes-summary strong { text-align: right; }
.print-station-toggle { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.5; cursor: pointer; }
.print-station-toggle input { width: 20px; height: 20px; margin-top: 1px; flex: 0 0 auto; }
.print-station-label { display: block; margin-top: 12px; font-size: 12px; font-weight: 600; }
.print-station-label input { display: block; width: 100%; min-height: 44px; margin-top: 6px; padding: 10px 12px; border: 1px solid #d5e2d7; border-radius: 9px; font: inherit; font-size: 16px; }
.print-station-status { margin-top: 12px; padding: 9px 12px; border-radius: 8px; background: #f1f4f2; font-size: 13px; }
.print-station-status.is-ok { background: #e8f6ec; color: #1f6b3d; }
.print-station-status.is-error { background: #fff1e8; color: #9c3c1d; }
.print-settings-hint { margin-top: 8px; color: #677a6b; font-size: 12px; line-height: 1.6; }
.print-settings-hint code { padding: 1px 5px; border-radius: 4px; background: #eef3ee; font-size: 12px; }
.print-settings-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 20px; }
@media (max-width: 480px) { .print-settings-actions > button { flex: 1 1 0; } }
@media print { .print-job-tray, .print-settings-dialog { display: none !important; } }