/**
 * Top Food — Admin / Branch Frontend Theme
 * Dark surfaces + gold accents matching logo (layout unchanged)
 */
@import url("https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800&display=swap");

:root {
    /* Top Food brand sheet — yellow / black / white */
    --brand-black: #0A0A0A;
    --brand-surface: #141414;
    --brand-card: #1A1A1A;
    --brand-card-border: rgba(253, 184, 19, 0.14);
    --brand-gold: #FDB813;
    --brand-gold-dark: #E5A100;
    --brand-gold-soft: rgba(253, 184, 19, 0.16);
    --brand-gold-glow: rgba(253, 184, 19, 0.4);
    --brand-violet: var(--brand-gold);
    --brand-violet-bright: var(--brand-gold);
    --brand-violet-soft: var(--brand-gold-soft);
    --brand-violet-glow: var(--brand-gold-glow);
    --brand-text-on-dark: #FFFFFF;
    --brand-muted-on-dark: #B8B8B8;
    --brand-page: #0A0A0A;
    --brand-text: #F5F5F5;
    --brand-blue: #3B82F6;
    --brand-amber: #FDB813;
    --brand-green: #22C55E;
    --primary: #FDB813;
    --blue: #FDB813;
    --dark: #0A0A0A;
}

html,
body {
    font-family: "Cairo", "Segoe UI", Tahoma, Arial, sans-serif !important;
    background: var(--brand-page) !important;
    color: var(--brand-text);
}

/* Primary CTA — gold (matches Top Food logo) */
.btn-primary,
.btn--primary,
.btn.btn-primary {
    background-color: var(--brand-gold) !important;
    border-color: var(--brand-gold) !important;
    color: #0A0A0A !important;
    font-weight: 800;
    box-shadow: 0 6px 18px var(--brand-gold-glow);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle,
.btn--primary:hover {
    background-color: var(--brand-gold-dark) !important;
    border-color: var(--brand-gold-dark) !important;
    color: #fff !important;
}

.btn-outline-primary,
.btn-soft-primary {
    background: transparent !important;
    border: 1px solid rgba(253, 184, 19, 0.5) !important;
    color: #FDB813 !important;
    font-weight: 600;
    box-shadow: none !important;
}

.btn-secondary,
.btn.btn-secondary,
.dt-buttons .btn-secondary,
.dt-buttons .btn.btn-secondary,
.buttons-print,
.buttons-pdf,
.buttons-csv,
.buttons-excel,
.buttons-copy {
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    color: rgba(255, 255, 255, 0.82) !important;
    font-weight: 600;
    box-shadow: none !important;
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active,
.btn.btn-secondary:hover,
.btn.btn-secondary:focus,
.dt-buttons .btn-secondary:hover,
.buttons-print:hover,
.buttons-pdf:hover,
.buttons-csv:hover,
.buttons-excel:hover,
.buttons-copy:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.22) !important;
    color: #fff !important;
    filter: none;
}

.btn-outline-primary:hover,
.btn-soft-primary:hover {
    background: var(--brand-gold-soft) !important;
    border-color: var(--brand-gold) !important;
    color: #fff !important;
    filter: none;
}

a:not(.btn):not(.nav-link):not(.dropdown-item):hover {
    color: var(--brand-violet-bright);
}

.text-primary,
a.text-primary {
    color: var(--brand-violet-bright) !important;
}

.bg-primary {
    background-color: var(--brand-violet) !important;
    color: #fff !important;
}

.border-primary {
    border-color: rgba(212, 175, 55, 0.45) !important;
}

.badge-primary,
.badge-soft-primary,
.badge-soft-c1 {
    background-color: var(--brand-violet-soft) !important;
    color: #F3E7C0 !important;
}

.custom-control-input:checked ~ .custom-control-label::before,
.form-control:focus,
.form-control-lg:focus {
    border-color: rgba(212, 175, 55, 0.55) !important;
    box-shadow: 0 0 0 0.15rem rgba(212, 175, 55, 0.25) !important;
}

.custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--brand-violet) !important;
}

.form-control,
.form-control-lg,
.select2-container--default .select2-selection--single {
    background-color: var(--brand-card) !important;
    border: 1px solid rgba(253, 184, 19, 0.18) !important;
    color: var(--brand-text-on-dark) !important;
    border-radius: 8px !important;
}

.form-control:focus,
.form-control-lg:focus,
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--brand-gold) !important;
    box-shadow: 0 0 0 0.15rem rgba(253, 184, 19, 0.2) !important;
}

.form-control::placeholder {
    color: var(--brand-muted-on-dark) !important;
}

/* Sidebar */
.navbar-vertical-aside,
.navbar-vertical {
    background: linear-gradient(180deg, #0B0815 0%, #1A1225 100%) !important;
    border-inline-end: 1px solid var(--brand-card-border);
}

.navbar-vertical .navbar-nav .nav-link,
.navbar-vertical .navbar-brand-text,
.navbar-vertical-aside .nav-link {
    color: var(--brand-text-on-dark) !important;
}

.navbar-vertical .navbar-nav .nav-link .nav-icon,
.navbar-vertical .navbar-nav .nav-link .tio {
    color: var(--brand-muted-on-dark) !important;
}

.navbar-vertical-aside-has-menu.show > .nav-link,
.navbar-vertical .navbar-nav.nav-tabs .active > .nav-link,
.navbar-vertical .navbar-nav.nav-tabs .active.nav-link,
.navbar-vertical .navbar-nav .nav-link:hover,
.navbar-vertical .nav-item.active > .nav-link,
.navbar-vertical-aside-has-menu.active > .nav-link {
    color: #fff !important;
    background: var(--brand-violet-soft) !important;
    box-shadow: inset 3px 0 0 var(--brand-violet);
}

.navbar-vertical .navbar-nav .nav-link:hover .nav-icon,
.navbar-vertical-aside-has-menu.active > .nav-link .nav-icon,
.navbar-vertical .navbar-nav.nav-tabs .active > .nav-link .nav-icon {
    color: var(--brand-violet-bright) !important;
}

.navbar-vertical .nav-subtitle {
    color: var(--brand-violet-bright) !important;
    opacity: 0.95;
    font-weight: 700;
}

.navbar-vertical .nav-indicator-icon {
    color: var(--brand-violet) !important;
}

.sidebar--search-form .search--form-group input {
    background: rgba(30, 30, 45, 0.9) !important;
    border-color: var(--brand-card-border) !important;
    color: var(--brand-text-on-dark) !important;
}

.sidebar--search-form .search--form-group input::placeholder {
    color: var(--brand-muted-on-dark) !important;
}

.topfood-sidebar-toggle {
    width: 34px;
    height: 34px;
    min-width: 34px;
    padding: 0;
    border: 1px solid rgba(253, 184, 19, 0.45);
    border-radius: 10px;
    background: rgba(253, 184, 19, 0.12);
    color: #FDB813 !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.topfood-sidebar-toggle:hover,
.topfood-sidebar-toggle:focus {
    background: #FDB813 !important;
    border-color: #FDB813 !important;
    color: #0A0A0A !important;
    transform: translateY(-1px);
}

.topfood-sidebar-toggle .tio {
    font-size: 18px;
    line-height: 1;
}

.navbar-vertical-aside-mini-mode .topfood-sidebar-toggle {
    background: rgba(253, 184, 19, 0.18);
}

/* Header */
#header.navbar,
#header.navbar-container,
#header .navbar-nav-wrap {
    background: rgba(11, 8, 21, 0.92) !important;
    border-bottom: 1px solid var(--brand-card-border) !important;
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.25);
    backdrop-filter: blur(12px);
}

#header.navbar-fixed {
    z-index: 1040;
}

#accountNavbarDropdown.hs-unfold-content {
    z-index: 1041;
    margin-top: 0.35rem;
}

#accountNavbarDropdown.hs-unfold-hidden {
    display: none !important;
}

#accountNavbarDropdown.hs-unfold-content-initialized:not(.hs-unfold-hidden) {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

#header .navbar-brand-wrapper {
    background: transparent !important;
}

#header .navbar-brand-logo,
#header .navbar-brand-logo-mini {
    max-height: 42px;
    width: auto;
    border-radius: 50%;
    box-shadow: 0 0 0 1.5px rgba(212, 175, 55, 0.45);
}

#header .btn-ghost-secondary,
#header .btn-icon,
#header .tio,
#header .navbar-dropdown-account-wrapper,
#header .card-title,
#header .card-text,
#header .js-navbar-vertical-aside-toggle-invoker {
    color: var(--brand-text-on-dark) !important;
}

#header .btn-ghost-secondary:hover,
#header .btn-icon:hover,
#header .navbar-dropdown-account-wrapper:hover .card-title {
    color: var(--brand-violet-bright) !important;
}

#header .btn-status-c1 {
    background-color: var(--brand-violet) !important;
    color: #fff !important;
    font-weight: 700;
}

#header .navbar-dropdown-account-wrapper .card-title.h5 {
    color: #fff !important;
    font-weight: 700;
}

#header .navbar-dropdown-account-wrapper .card-text {
    color: var(--brand-violet-bright) !important;
}

#header .avatar-status-success {
    background-color: var(--brand-green) !important;
}

/* Footer */
.footer {
    background: var(--brand-black) !important;
    border-top: 1px solid var(--brand-card-border) !important;
    color: var(--brand-muted-on-dark) !important;
    padding-top: 0.9rem !important;
    padding-bottom: 0.9rem !important;
}

.footer p,
.footer .font-size-sm {
    color: var(--brand-muted-on-dark) !important;
}

.footer a,
.footer .list-inline-menu a span {
    color: var(--brand-text-on-dark) !important;
}

.footer a:hover,
.footer .list-inline-menu a:hover span {
    color: var(--brand-violet-bright) !important;
}

.footer .badge-soft-c1 {
    background: var(--brand-violet-soft) !important;
    color: var(--brand-violet-bright) !important;
    border: 1px solid rgba(212, 175, 55, 0.35);
}

/* Pages */
.main#content,
#content.main {
    background:
        radial-gradient(ellipse at 20% 100%, rgba(212, 175, 55, 0.18) 0%, transparent 45%),
        radial-gradient(ellipse at 80% 0%, rgba(59, 130, 246, 0.08) 0%, transparent 40%),
        var(--brand-page) !important;
}

.content .page-header-title,
.content .h1,
.content h1.h1,
.content h2.h1,
.content h1,
.content h2,
.content h3,
.content h4,
.content h5,
.content label,
.content .form-label,
.content .card-header-title,
.content .card-title,
.content .text-dark,
.content .text-body {
    color: var(--brand-text-on-dark) !important;
}

.content .text-muted,
.content .text-secondary,
.content small,
.content .form-text {
    color: var(--brand-muted-on-dark) !important;
}

.content .card {
    background: rgba(30, 30, 45, 0.72) !important;
    border: 1px solid var(--brand-card-border) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
    backdrop-filter: blur(14px);
    color: var(--brand-text);
}

.content .card-header {
    background: rgba(30, 30, 45, 0.55) !important;
    border-bottom: 1px solid var(--brand-card-border) !important;
}

.content .card-body,
.content .card-footer {
    color: var(--brand-text);
}

.nav-tabs .nav-link.active,
.inline-page-menu ul li.active a,
.nav-tabs .nav-item .nav-link.active {
    color: #F3E7C0 !important;
    border-color: transparent !important;
    box-shadow: inset 0 -2px 0 var(--brand-violet);
    font-weight: 700;
    background: transparent !important;
}

.nav-tabs .nav-link {
    color: var(--brand-muted-on-dark) !important;
}

.nav-tabs .nav-link:hover {
    color: var(--brand-violet-bright) !important;
}

.toggle-switch-input:checked + .toggle-switch-label {
    background-color: var(--brand-violet) !important;
}

.page-item.active .page-link {
    background-color: var(--brand-violet) !important;
    border-color: var(--brand-violet) !important;
    color: #fff !important;
}

.page-link {
    color: var(--brand-text);
    background: transparent;
    border-color: var(--brand-card-border);
}

.page-link:hover {
    color: var(--brand-violet-bright);
}

/* Login */
.auth-wrapper-left {
    background: linear-gradient(160deg, #0B0815 0%, #1A1225 55%, #2E1065 100%) !important;
    background-image: none !important;
}

.auth-wrapper-left .auth-left-cont img {
    max-width: 200px !important;
    max-height: 200px !important;
    width: auto !important;
    border-radius: 50%;
    box-shadow: 0 0 0 2px rgba(212, 175, 55, 0.5), 0 0 24px var(--brand-violet-glow);
}

.auth-wrapper-left .title,
.auth-wrapper-left .c1,
.auth-wrapper-left .text--039D55 {
    color: var(--brand-violet-bright) !important;
}

.auth-wrapper-right {
    background: var(--brand-page) !important;
    color: var(--brand-text);
}

.auth-wrapper-right .title,
.auth-wrapper-right .input-label,
.auth-wrapper-right .auth-header,
.auth-wrapper-right label {
    color: var(--brand-text-on-dark) !important;
}

.auth-wrapper-right .text-muted,
.auth-wrapper-right .text-capitalize {
    color: var(--brand-muted-on-dark) !important;
}

.auth-wrapper-right .btn--primary,
.auth-wrapper-right .btn-primary {
    background: var(--brand-gold) !important;
    border-color: var(--brand-gold) !important;
    color: #1C1C1C !important;
    box-shadow: 0 0 18px var(--brand-gold-glow);
}

.auth-header .badge {
    background: var(--brand-violet-soft) !important;
    color: #F3E7C0 !important;
}

.auth-wrapper-right a {
    color: var(--brand-violet-bright);
}

.alert-soft-primary,
.alert-primary {
    background-color: var(--brand-violet-soft) !important;
    color: #F3E7C0 !important;
    border-color: rgba(212, 175, 55, 0.35) !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[data-selected] {
    background-color: var(--brand-violet) !important;
    color: #fff !important;
}

input[type="checkbox"]:checked,
input[type="radio"]:checked {
    accent-color: var(--brand-violet);
}

.direction-toggle {
    background: var(--brand-black) !important;
    color: var(--brand-violet-bright) !important;
}

.toast-info {
    background-color: var(--brand-surface) !important;
}

/* Tables */
.table {
    color: var(--brand-text) !important;
}

.table thead th {
    background: rgba(26, 18, 37, 0.95) !important;
    color: var(--brand-text-on-dark) !important;
    border-bottom-color: var(--brand-card-border) !important;
}

.table td,
.table th {
    border-color: var(--brand-card-border) !important;
}

.table-hover tbody tr:hover {
    background-color: var(--brand-violet-soft) !important;
}

.dropdown-menu {
    background: var(--brand-card) !important;
    border: 1px solid var(--brand-card-border) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.45) !important;
}

.dropdown-item {
    color: var(--brand-text) !important;
    padding: 8px 16px !important;
}

.dropdown-item:hover,
.dropdown-item:focus,
.dropdown-item.active,
.dropdown-item:active {
    background: var(--brand-violet-soft) !important;
    color: #fff !important;
}

.dropdown-item-text {
    color: var(--brand-text) !important;
}

.dropdown-divider {
    border-color: rgba(255,255,255,0.1) !important;
}

.modal-content {
    background: #1E1E2D !important;
    border: 1px solid var(--brand-card-border) !important;
    color: var(--brand-text) !important;
}

.modal-header,
.modal-footer {
    border-color: var(--brand-card-border) !important;
}

.breadcrumb-item,
.breadcrumb-item a {
    color: var(--brand-muted-on-dark) !important;
}

.breadcrumb-item.active {
    color: var(--brand-violet-bright) !important;
}

/* Dashboard / utility surfaces that stayed white or gold */
.content .card.bg-white,
.content .bg-white,
.content .card-body.bg-white,
.card.bg-white,
.pos-cashier-page .bg-white,
.pos-cart-panel .bg-white,
#cart .bg-white,
.modal .bg-white,
.modal-footer.bg-white,
#quick-view .bg-white,
#quick-view .modal-footer {
    background: #141414 !important;
    color: var(--brand-text-on-dark) !important;
}

.content .grid-option .btn.active,
.content .btn-soft-secondary.active,
.content .option-select-btn.active,
.content [class*="grid"] .active {
    background: var(--brand-gold) !important;
    border-color: var(--brand-gold) !important;
    color: #1C1C1C !important;
}

.bg-c1,
.btn-c1,
.badge-c1 {
    background-color: var(--brand-gold) !important;
    color: #1C1C1C !important;
}

.text-c1,
.c1 {
    color: var(--brand-violet-bright) !important;
}

.badge-soft-c1 {
    background: var(--brand-violet-soft) !important;
    color: #F3E7C0 !important;
}

.input-group-text {
    background: var(--brand-card) !important;
    border: 1px solid rgba(253, 184, 19, 0.18) !important;
    color: var(--brand-muted-on-dark) !important;
    border-radius: 8px !important;
}

.list-group-item {
    background: transparent !important;
    border-color: var(--brand-card-border) !important;
    color: var(--brand-text) !important;
}

.hs-unfold-content,
.navbar-dropdown-account {
    background: #1E1E2D !important;
    border: 1px solid var(--brand-card-border) !important;
}

/* POS product grid — cashier menu layout */
.pos-item-wrap {
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)) !important;
    gap: 12px !important;
}

.pos-product-item_thumb {
    height: 140px !important;
    cursor: pointer;
    overflow: hidden;
    border-radius: 12px 12px 0 0;
    background: rgba(0, 0, 0, 0.25);
}

.pos-product-item_thumb .img-fit {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pos-product-click-area {
    cursor: pointer;
}

/* Cashier menu redesign — keep Top Food brand colors */
.pos-cashier-layout {
    align-items: stretch;
}
.pos-menu-panel {
    overflow: hidden;
}
.pos-menu-toolbar {
    padding: 12px 14px;
    border-bottom: 1px solid var(--brand-card-border);
    background: rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.pos-menu-search {
    position: relative;
}
.pos-menu-search > i {
    position: absolute;
    inset-inline-start: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(255, 255, 255, 0.4);
    font-size: 18px;
    pointer-events: none;
}
.pos-menu-search__input {
    border-radius: 16px !important;
    padding-inline-start: 42px !important;
    min-height: 46px;
    background: rgba(0, 0, 0, 0.25) !important;
}
.pos-category-cells {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    width: 100%;
    overflow-x: auto;
    padding-bottom: 4px;
    -webkit-overflow-scrolling: touch;
}
.pos-menu-toolbar .pos-category-cell.pos-category-circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: auto;
    min-width: max-content;
    min-height: 38px;
    margin: 0;
    padding: 8px 16px;
    border: 0;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.05);
    color: rgba(255, 255, 255, 0.6);
    font-weight: 700;
    font-size: 0.75rem;
    line-height: 1.25;
    text-align: center;
    white-space: nowrap;
    word-break: normal;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease;
}
.pos-menu-toolbar .pos-category-cell.pos-category-circle:hover {
    border-color: transparent;
    color: #fff;
    background: rgba(255, 255, 255, 0.1);
}
.pos-menu-toolbar .pos-category-cell.pos-category-circle.active {
    background: #f59e0b !important;
    border-color: #f59e0b !important;
    color: #111 !important;
}
.pos-category-cell__count {
    opacity: 0.85;
}
.pos-menu-products {
    padding: 12px 14px 8px;
}
.pos-menu-products .card-body {
    padding: 0 !important;
}
.pos-product-item {
    border: 1px solid var(--brand-card-border) !important;
    border-radius: 12px !important;
    overflow: hidden;
    background: var(--brand-card) !important;
    display: flex;
    flex-direction: column;
    min-height: 100%;
}
.pos-product-item_content {
    padding: 10px 12px 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}
.pos-product-item_title {
    color: var(--brand-text-on-dark) !important;
    font-weight: 700;
    font-size: 0.95rem;
    line-height: 1.35;
    min-height: 2.5em;
}
.pos-product-item_meta {
    color: var(--brand-gold);
    font-size: 0.8rem;
    margin-top: 2px;
}
.pos-product-item_footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: auto;
}
.pos-product-item_price {
    color: var(--brand-gold) !important;
    font-weight: 800;
    font-size: 1rem;
}
.pos-product-add-btn {
    width: 34px;
    height: 34px;
    border: none;
    border-radius: 8px;
    background: var(--brand-gold);
    color: #1c1c1c;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 0 12px var(--brand-gold-glow);
}
.pos-product-add-btn:hover,
.pos-product-add-btn:focus {
    background: var(--brand-gold-dark);
    color: #fff;
}
.pos-product-badge {
    position: absolute;
    top: 8px;
    inset-inline-start: 8px;
    background: rgba(11, 8, 21, 0.75);
    color: var(--brand-gold);
    border: 1px solid rgba(212, 175, 55, 0.35);
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 2px 8px;
    z-index: 1;
}
.pos-product-qty-badge {
    position: absolute;
    top: 8px;
    inset-inline-end: 8px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--brand-gold);
    color: #1c1c1c;
    font-size: 0.75rem;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
}
.pos-cart-panel {
    display: flex;
    flex-direction: column;
    min-height: 70vh;
    border-radius: 0 !important;
    overflow: hidden;
    border: none !important;
    border-left: 1px solid rgba(255, 255, 255, 0.12) !important;
    background: #11151b !important;
    transition: width 0.3s ease, opacity 0.3s ease, min-width 0.3s ease, padding 0.3s ease;
}
.pos-menu-panel.card {
    border-radius: 0 !important;
    overflow: hidden;
    border: none !important;
    background: #11151b !important;
}
.pos-cart-panel__header {
    flex-shrink: 0;
    padding: 16px 18px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.pos-cart-panel__header .text-amber,
.pos-cart-panel__header .tio-shopping-cart {
    color: #f59e0b !important;
}
.pos-cart-panel__body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    padding: 8px 10px 12px;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
}
.pos-cart-panel__body::-webkit-scrollbar {
    display: none !important;
}
.pos-cart-panel__body #cart {
    min-height: 0;
}
.pos-cart-count-badge {
    color: #f59e0b;
    font-weight: 700;
}
.pos-cart-side-actions .btn-primary {
    background: #f59e0b !important;
    border-color: #f59e0b !important;
    color: #111 !important;
    border-radius: 16px !important;
    font-weight: 800;
    box-shadow: none !important;
}
.pos-cart-side-actions .btn-primary:hover {
    background: #fbbf24 !important;
    border-color: #fbbf24 !important;
    color: #111 !important;
}
.pos-cart-empty {
    min-height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px dashed rgba(255, 255, 255, 0.14);
    border-radius: 24px;
    margin: 8px;
    background: rgba(255, 255, 255, 0.03) !important;
    color: rgba(255, 255, 255, 0.45) !important;
}

.pos-cart-surface {
    background: rgba(0, 0, 0, 0.22) !important;
}

.pos-cart-surface__inner {
    background: transparent !important;
}

.pos-cart-list {
    border: 0 !important;
    background: transparent !important;
}

.pos-cart-side-actions .btn-secondary,
.pos-cart-side-actions .btn.btn-secondary {
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    color: rgba(255, 255, 255, 0.8) !important;
    border-radius: 16px !important;
    font-weight: 800;
}

.pos-cart-side-actions .btn-secondary:hover,
.pos-cart-side-actions .btn.btn-secondary:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #fff !important;
}

.pos-cart-side-actions .btn-primary[disabled],
.pos-cart-side-actions .btn-primary:disabled {
    opacity: 0.55;
    box-shadow: none !important;
}

/* Dark scrollbars on cashier surfaces */
.pos-cashier-page,
.pos-menu-products,
.pos-category-cells,
.pos-cart-panel__body,
.pos-item-wrap {
    scrollbar-width: thin;
    scrollbar-color: rgba(245, 158, 11, 0.45) rgba(255, 255, 255, 0.06);
}
.pos-cashier-page::-webkit-scrollbar,
.pos-menu-products::-webkit-scrollbar,
.pos-category-cells::-webkit-scrollbar,
.pos-cart-panel__body::-webkit-scrollbar,
.pos-item-wrap::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
.pos-cashier-page::-webkit-scrollbar-track,
.pos-menu-products::-webkit-scrollbar-track,
.pos-category-cells::-webkit-scrollbar-track,
.pos-cart-panel__body::-webkit-scrollbar-track,
.pos-item-wrap::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.04);
    border-radius: 99px;
}
.pos-cashier-page::-webkit-scrollbar-thumb,
.pos-menu-products::-webkit-scrollbar-thumb,
.pos-category-cells::-webkit-scrollbar-thumb,
.pos-cart-panel__body::-webkit-scrollbar-thumb,
.pos-item-wrap::-webkit-scrollbar-thumb {
    background: rgba(245, 158, 11, 0.45);
    border-radius: 99px;
}
.pos-cashier-page::-webkit-scrollbar-thumb:hover,
.pos-menu-products::-webkit-scrollbar-thumb:hover,
.pos-category-cells::-webkit-scrollbar-thumb:hover,
.pos-cart-panel__body::-webkit-scrollbar-thumb:hover,
.pos-item-wrap::-webkit-scrollbar-thumb:hover {
    background: rgba(245, 158, 11, 0.7);
}

@media (min-width: 992px) {
    .pos-cashier-layout {
        min-height: 0 !important;
    }
    .pos-cart-panel {
        position: relative !important;
        top: 0 !important;
        max-height: none !important;
    }
}

.pos-cart-side-actions {
    position: sticky;
    bottom: 0;
    z-index: 3;
    padding-top: 8px;
    background: linear-gradient(180deg, transparent, var(--brand-card, #1e1e2d) 28%);
}

.pos-open-checkout.d-flex {
    gap: 8px;
    white-space: nowrap;
}

.pos-place-order-total {
    opacity: 0.95;
    letter-spacing: 0.01em;
}

/* Checkout wizard — order type step */
.pos-checkout-wizard .modal-header {
    align-items: flex-start;
}

.pos-checkout-wizard__heading .modal-title {
    font-weight: 700;
    font-size: 1.25rem;
    color: var(--brand-text-on-dark);
}

.pos-checkout-stage-label {
    font-size: 0.9rem;
    color: var(--brand-muted-on-dark) !important;
}

.pos-checkout-wizard-footer {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    flex-wrap: wrap;
    padding-top: 0.5rem;
    padding-bottom: 1.25rem;
}

.pos-checkout-wizard-footer .pos-checkout-next {
    margin-left: auto;
    min-width: 220px;
    border-radius: 999px !important;
    padding: 0.7rem 1.5rem;
}

.pos-checkout-wizard-footer .pos-takeaway-save-print,
.pos-checkout-wizard-footer .pos-takeaway-save-no-print {
    min-width: 180px;
    border-radius: 999px !important;
    padding: 0.7rem 1.25rem;
}
.pos-checkout-wizard-footer .pos-takeaway-save-print {
    margin-left: auto;
}

.pos-checkout-wizard-footer .pos-checkout-cancel,
.pos-checkout-wizard-footer .pos-checkout-back {
    border-radius: 999px !important;
    min-width: 96px;
}

.pos-order-type-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.pos-order-type-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    min-height: 168px;
    padding: 20px 14px;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.03);
    color: var(--brand-text-on-dark);
    text-align: center;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, transform 0.15s ease;
}

.pos-order-type-card:hover {
    border-color: rgba(212, 175, 55, 0.55);
    background: rgba(212, 175, 55, 0.06);
    transform: translateY(-1px);
}

.pos-order-type-card.is-selected {
    border-color: var(--brand-gold);
    background: rgba(212, 175, 55, 0.1);
    box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.35), 0 10px 28px rgba(0, 0, 0, 0.28);
}

.pos-order-type-card__icon {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.6rem;
    line-height: 1;
}

.pos-order-type-card__icon i {
    font-size: inherit;
    line-height: 1;
    color: inherit;
    display: block;
}

.pos-order-type-card__icon--table {
    color: #c4b5fd;
    background: rgba(167, 139, 250, 0.16);
}

.pos-order-type-card__icon--takeaway {
    color: #fb7185;
    background: rgba(251, 113, 133, 0.14);
}

.pos-order-type-card__icon--delivery {
    color: #f472b6;
    background: rgba(244, 114, 182, 0.14);
}

.pos-order-type-card__title {
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.2;
}

.pos-order-type-card__desc {
    font-size: 0.82rem;
    line-height: 1.45;
    color: var(--brand-muted-on-dark);
    max-width: 14rem;
}

.pos-delivery-source-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

#pos-checkout-modal .pos-checkout-step[data-step="3"] {
    display: flex;
    flex-direction: column;
}

#pos-checkout-modal .pos-checkout-step[data-step="3"].d-none {
    display: none !important;
}

#pos-checkout-modal #home_delivery_section {
    order: -1;
}

.pos-order-type-card__icon--phone {
    color: #38bdf8;
    background: rgba(56, 189, 248, 0.16);
}

.pos-order-type-card__icon--app {
    color: #34d399;
    background: rgba(52, 211, 153, 0.16);
}

.pos-delivery-apps-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.pos-delivery-app-chip {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.03);
    color: var(--brand-text-on-dark);
    font-weight: 700;
    text-align: center;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.pos-delivery-app-chip:hover {
    border-color: rgba(212, 175, 55, 0.55);
    background: rgba(212, 175, 55, 0.06);
}

.pos-delivery-app-chip.is-selected {
    border-color: var(--brand-gold);
    background: rgba(212, 175, 55, 0.1);
    box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.35);
}

@media (max-width: 767.98px) {
    .pos-order-type-grid,
    .pos-delivery-source-grid,
    .pos-delivery-apps-grid {
        grid-template-columns: 1fr;
    }

    .pos-order-type-card {
        min-height: 120px;
        flex-direction: row;
        justify-content: flex-start;
        text-align: start;
        padding: 16px;
    }

    .pos-order-type-card__desc {
        max-width: none;
    }

    .pos-checkout-wizard-footer .pos-checkout-next {
        width: 100%;
        min-width: 0;
        order: -1;
    }
}

#pos-checkout-modal .modal-dialog {
    margin: 0.75rem auto !important;
    max-height: calc(100vh - 1.5rem) !important;
    height: auto !important;
    max-width: min(800px, calc(100vw - 1rem));
    display: flex !important;
    align-items: stretch !important;
}

#pos-checkout-modal .modal-dialog.modal-dialog-scrollable,
#pos-checkout-modal .modal-dialog.modal-dialog-centered {
    height: auto !important;
    max-height: calc(100vh - 1.5rem) !important;
}

#pos-checkout-modal .modal-dialog.modal-dialog-scrollable .modal-content,
#pos-checkout-modal .modal-dialog.modal-dialog-centered .modal-content,
#pos-checkout-modal .modal-content {
    max-height: calc(100vh - 1.5rem) !important;
    height: auto !important;
    width: 100%;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
}

#pos-checkout-modal .modal-header,
#pos-checkout-modal .modal-footer {
    flex-shrink: 0;
}

#pos-checkout-modal .modal-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: calc(100vh - 1.5rem - 150px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding-bottom: 0.5rem;
}

/* Keep Place Order / Draft always reachable while payment section scrolls */
#pos-checkout-modal .pos-order-btn {
    position: sticky !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    margin-top: 0.75rem;
    padding: 12px 4px 8px !important;
    background: #121212 !important;
    border: 0 !important;
    z-index: 5;
    box-shadow: 0 -8px 18px rgba(0, 0, 0, 0.35);
}

#pos-checkout-modal #order_place,
#pos-checkout-modal .pos-data-table,
#pos-checkout-modal #pos-checkout-details,
#pos-checkout-modal .pos-checkout-step {
    position: static;
    overflow: visible;
    max-height: none;
}

@media (max-height: 900px) {
    #pos-checkout-modal .modal-dialog,
    #pos-checkout-modal .modal-dialog.modal-dialog-scrollable,
    #pos-checkout-modal .modal-dialog.modal-dialog-centered {
        margin-top: 0.4rem !important;
        margin-bottom: 0.4rem !important;
        max-height: calc(100vh - 0.8rem) !important;
    }

    #pos-checkout-modal .modal-dialog.modal-dialog-scrollable .modal-content,
    #pos-checkout-modal .modal-content {
        max-height: calc(100vh - 0.8rem) !important;
    }

    #pos-checkout-modal .modal-body {
        max-height: calc(100vh - 0.8rem - 140px) !important;
    }
}

@media (max-height: 700px) {
    #pos-checkout-modal .modal-dialog,
    #pos-checkout-modal .modal-dialog.modal-dialog-scrollable,
    #pos-checkout-modal .modal-dialog.modal-dialog-centered {
        margin-top: 0.25rem !important;
        margin-bottom: 0.25rem !important;
        max-height: calc(100vh - 0.5rem) !important;
    }

    #pos-checkout-modal .modal-dialog.modal-dialog-scrollable .modal-content,
    #pos-checkout-modal .modal-content {
        max-height: calc(100vh - 0.5rem) !important;
    }

    #pos-checkout-modal .modal-body {
        max-height: calc(100vh - 0.5rem - 120px) !important;
        padding-top: 0.75rem;
        padding-bottom: 0.5rem;
    }
}


.pos-cart-action-btn {
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid var(--brand-card-border, rgba(255,255,255,.12));
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.08);
    color: var(--brand-text-on-dark, #f3f4f6);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    cursor: pointer;
}

.pos-cart-action-btn i {
    font-size: 14px;
}

.pos-cart-action-btn:hover,
.pos-cart-action-btn:focus {
    color: var(--brand-gold, #d4af37);
    border-color: var(--brand-gold, #d4af37);
    background: rgba(212, 175, 55, 0.12);
}

.pos-cart-action-btn--danger {
    color: #f87171;
}

.pos-cart-action-btn--danger:hover,
.pos-cart-action-btn--danger:focus {
    color: #fff;
    border-color: #ef4444;
    background: #ef4444;
}


/* POS product grid — was #334257 on dark cards */
.pos-product-item_title {
    color: var(--brand-text-on-dark) !important;
}
.pos-product-item_price {
    color: var(--brand-gold) !important;
}

/* Select2 closed control text */
.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-container--default .select2-selection--multiple .select2-selection__rendered,
.select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: var(--brand-text-on-dark) !important;
}

/* Select2 dropdown panel */
.select2-dropdown {
    background: var(--brand-card) !important;
    border-color: var(--brand-card-border) !important;
    color: var(--brand-text) !important;
}
.select2-container--default .select2-results__option {
    color: var(--brand-text) !important;
}
.select2-container--default .select2-results__option[aria-selected="true"] {
    background: rgba(212, 175, 55, 0.15) !important;
    color: var(--brand-text-on-dark) !important;
}
.select2-search--dropdown .select2-search__field {
    background: var(--brand-page) !important;
    border-color: var(--brand-card-border) !important;
    color: var(--brand-text-on-dark) !important;
}

/* Leftover light-theme dark text utilities */
.text-c2,
.c2 {
    color: var(--brand-gold) !important;
}
.tc-clr {
    color: var(--brand-muted-on-dark) !important;
}
label,
.input-label {
    color: var(--brand-text-on-dark) !important;
}
.table .thead-light th,
.thead-light th {
    color: var(--brand-text-on-dark) !important;
    background: rgba(26, 18, 37, 0.95) !important;
}

/* POS billing / invoice values — dark theme tables */
.pos-data-table dd,
.pos-data-table dt {
    color: var(--brand-text) !important;
}

/* Print / invoice preview: white paper + dark clear Arabic text */
#print-invoice .modal-body #printableArea,
#print-invoice .print-area-content,
#printableArea,
#printableAreaContent,
.print-area-content {
    font-family: "Cairo", "Segoe UI", Tahoma, Arial, sans-serif !important;
    background: #ffffff !important;
    color: #111827 !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    padding: 16px !important;
    border-radius: 8px;
}
#print-invoice .modal-body #printableArea *,
#printableArea *,
#printableAreaContent *,
.print-area-content * {
    font-family: "Cairo", "Segoe UI", Tahoma, Arial, sans-serif !important;
    color: #111827 !important;
    background-color: transparent !important;
    -webkit-text-fill-color: #111827 !important;
}
#print-invoice .modal-body #printableArea table,
#printableArea table,
.print-area-content table,
#printableArea .table,
.print-area-content .table {
    background: #ffffff !important;
    color: #111827 !important;
}
#print-invoice .modal-body #printableArea th,
#print-invoice .modal-body #printableArea td,
#printableArea th,
#printableArea td,
.print-area-content th,
.print-area-content td {
    background: #ffffff !important;
    color: #111827 !important;
    border-color: #d1d5db !important;
}
#printableArea dd,
#printableArea dt,
#printableAreaContent dd,
#printableAreaContent dt,
.print-area-content dd,
.print-area-content dt,
.print-area-content h2,
.print-area-content h5,
.print-area-content span,
.print-area-content strong,
.print-area-content .text-body,
.print-area-content .text-dark,
.print-area-content .text-muted,
.print-area-content .custom-dl {
    color: #111827 !important;
    -webkit-text-fill-color: #111827 !important;
    font-weight: 600;
    background: transparent !important;
}
.print-area-content .custom-h5,
.print-area-content .custom-phone {
    font-weight: 600 !important;
    color: #111827 !important;
}

/* Keep modal chrome text light, but NEVER override invoice paper */
.modal-content .text-dark:not(#printableArea *):not(.print-area-content *),
.modal-content .text-title:not(#printableArea *):not(.print-area-content *),
.modal-content h3:not(#printableArea *):not(.print-area-content *),
.modal-content h4:not(#printableArea *):not(.print-area-content *),
.modal-content h5:not(#printableArea *):not(.print-area-content *) {
    color: var(--brand-text-on-dark) !important;
}
.pos-order-btn {
    background: var(--brand-card) !important;
    color: var(--brand-text-on-dark) !important;
    border-color: var(--brand-card-border) !important;
}
.btn-bordered,
.check-label {
    color: var(--brand-text-on-dark) !important;
}

/* Selected payment method in checkout — match Place Order gold */
#pos-checkout-modal .option-buttons input:checked + label.btn-bordered,
#pos-checkout-modal #order_place .option-buttons input:checked + label,
.pos-table-pay .option-buttons input:checked + label.btn-bordered {
    background-color: var(--brand-gold) !important;
    border-color: var(--brand-gold) !important;
    color: #1C1C1C !important;
    font-weight: 700;
    box-shadow: 0 0 16px var(--brand-gold-glow);
}

#pos-checkout-modal .option-buttons input:checked + label.btn-bordered:hover,
#pos-checkout-modal #order_place .option-buttons input:checked + label:hover,
.pos-table-pay .option-buttons input:checked + label.btn-bordered:hover {
    background-color: var(--brand-gold-dark) !important;
    border-color: var(--brand-gold-dark) !important;
    color: #fff !important;
}

/* Modal / POS secondary text — keep readable (except invoice paper) */
.modal-content .text-muted:not(#printableArea *):not(.print-area-content *),
.modal-content small:not(#printableArea *):not(.print-area-content *),
.modal-content .text-secondary:not(#printableArea *):not(.print-area-content *) {
    color: var(--brand-muted-on-dark) !important;
}

/* Upload helper islands — readable on white boxes */
.upload-file_custom .upload-file__wrapper .text-c2,
.upload-file_custom .upload-file__wrapper .tc-clr,
.upload-file_custom .upload-file__wrapper .text-muted {
    color: #4B5563 !important;
}

/* Form controls text */
.form-control,
.custom-select,
select.form-control {
    background-color: var(--brand-card) !important;
    border: 1px solid rgba(253, 184, 19, 0.18) !important;
    color: var(--brand-text-on-dark) !important;
    border-radius: 8px !important;
}
.form-control::placeholder {
    color: var(--brand-muted-on-dark) !important;
    opacity: 1;
}
textarea.form-control {
    min-height: 80px;
    resize: vertical;
}
.input-group-text {
    background-color: var(--brand-card) !important;
    border: 1px solid rgba(253, 184, 19, 0.18) !important;
    color: var(--brand-muted-on-dark) !important;
    border-radius: 8px !important;
}
.custom-select option {
    background-color: var(--brand-card);
    color: var(--brand-text-on-dark);
}

/* POS category nav — vertical column (icon beside name) */
.pos-category-nav-card {
    overflow: hidden;
}
.pos-category-nav {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 10px 10px 14px;
    max-height: calc(100vh - 220px);
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
}
.pos-category-nav::-webkit-scrollbar {
    width: 4px;
}
.pos-category-nav::-webkit-scrollbar-thumb {
    background: rgba(212, 175, 55, 0.45);
    border-radius: 4px;
}
.pos-category-nav__item {
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(30, 30, 45, 0.75);
    border-radius: 10px;
    padding: 8px 10px;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    color: var(--brand-text);
    text-align: start;
    transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}
.pos-category-nav__thumb {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(18, 16, 28, 0.95);
    display: grid;
    place-items: center;
}
.pos-category-nav__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.pos-category-nav__thumb--all {
    color: var(--brand-gold);
    font-size: 18px;
}
.pos-category-nav__label {
    flex: 1 1 auto;
    font-size: 13px;
    line-height: 1.3;
    font-weight: 600;
    color: var(--brand-muted-on-dark);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.pos-category-nav__item:hover {
    border-color: rgba(212, 175, 55, 0.45);
    background: rgba(40, 38, 58, 0.95);
}
.pos-category-nav__item.active {
    border-color: var(--brand-gold);
    box-shadow: 0 0 0 2px rgba(212, 175, 55, 0.22);
    background: rgba(212, 175, 55, 0.12);
}
.pos-category-nav__item.active .pos-category-nav__label {
    color: var(--brand-gold);
}

/* Mobile: categories become horizontal strip above products */
@media (max-width: 767.98px) {
    .pos-category-nav {
        flex-direction: row;
        max-height: none;
        overflow-x: auto;
        overflow-y: hidden;
        padding-bottom: 8px;
    }
    .pos-category-nav__item {
        flex: 0 0 auto;
        width: auto;
        min-width: 140px;
    }
}

/* Legacy horizontal circles (kept for safety if used elsewhere) */
.pos-category-circles {
    display: flex;
    flex-wrap: nowrap;
    gap: 14px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
}
.pos-category-circles::-webkit-scrollbar {
    height: 4px;
}
.pos-category-circles::-webkit-scrollbar-thumb {
    background: rgba(212, 175, 55, 0.45);
    border-radius: 4px;
}
.pos-category-circle {
    flex: 0 0 auto;
    border: 0;
    background: transparent;
    padding: 0;
    cursor: pointer;
    color: var(--brand-text);
}
.pos-category-circle__thumb {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid rgba(255, 255, 255, 0.15);
    background: rgba(30, 30, 45, 0.95);
    display: grid;
    place-items: center;
}
.pos-category-circle__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.pos-category-circle__thumb--all {
    color: var(--brand-gold);
    font-size: 22px;
}
.pos-category-circle__label {
    font-size: 11px;
    line-height: 1.2;
    text-align: center;
    max-width: 76px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--brand-muted-on-dark);
}
.pos-category-circle:hover .pos-category-circle__thumb,
.pos-category-circle.active .pos-category-circle__thumb {
    border-color: var(--brand-gold);
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.25);
}
.pos-category-circle.active .pos-category-circle__label {
    color: var(--brand-gold);
    font-weight: 700;
}

/* POS cart quantity counter */
.pos-qty-counter {
    display: inline-flex;
    align-items: center;
    gap: 0;
    border: 1px solid rgba(212, 175, 55, 0.45);
    border-radius: 8px;
    overflow: hidden;
    background: rgba(30, 30, 45, 0.95);
    min-width: 98px;
}
.pos-qty-btn {
    width: 28px;
    height: 30px;
    border: 0;
    background: rgba(212, 175, 55, 0.18);
    color: var(--brand-gold);
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    padding: 0;
}
.pos-qty-btn:hover {
    background: rgba(212, 175, 55, 0.35);
}
.pos-qty-input.form-control.qty,
.pos-qty-counter .pos-qty-input {
    width: 42px !important;
    min-width: 42px;
    height: 30px;
    border: 0 !important;
    border-radius: 0 !important;
    text-align: center;
    padding: 0 2px !important;
    background: transparent !important;
    color: var(--brand-text) !important;
    box-shadow: none !important;
    -moz-appearance: textfield;
    cursor: text;
    pointer-events: auto;
}
.pos-qty-counter .pos-qty-input:focus {
    background: rgba(212, 175, 55, 0.22) !important;
    outline: 2px solid var(--brand-gold, #d4af37);
    outline-offset: -2px;
}

/* POS cart item cards */
.pos-cart-list {
    background: rgba(255, 255, 255, 0.02);
}
.pos-cart-item:last-child {
    border-bottom: 0 !important;
}
.pos-cart-item__img {
    width: 52px;
    height: 52px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid var(--brand-card-border, rgba(255,255,255,.12));
}
.pos-cart-item__name {
    color: var(--brand-text-on-dark, #f3f4f6);
    font-size: 14px;
    font-weight: 600;
}
.pos-cart-item__variant {
    font-size: 11px;
    line-height: 1.3;
}
.pos-cart-item__price {
    color: var(--brand-gold, #d4af37);
    font-size: 14px;
}
.pos-cart-price-input {
    width: 76px;
    min-width: 64px;
    height: 28px;
    padding: 2px 6px;
    font-weight: 800;
    font-size: 13px;
    text-align: center;
    border-radius: 8px;
}
.pos-cart-price-symbol {
    font-size: 12px;
    font-weight: 700;
}
.pos-cart-item__line-total {
    font-size: 11px;
    font-weight: 600;
}
.pos-cart-item__addons {
    border-top: 1px dashed rgba(255, 255, 255, 0.08);
    margin-top: 2px;
    padding-top: 6px;
}
.pos-cart-addon-row {
    font-size: 12px;
}
.pos-cart-addon-label {
    color: var(--brand-text-on-dark, #f3f4f6);
    cursor: pointer;
}
.pos-cart-addon-label input[type="checkbox"] {
    flex-shrink: 0;
    accent-color: var(--brand-gold, #d4af37);
}
.pos-cart-addon-unit-price {
    font-size: 11px;
}
.pos-cart-addon-qty {
    min-width: 88px;
    flex-shrink: 0;
}
.pos-cart-addon-qty .pos-qty-btn {
    width: 24px;
    height: 26px;
    font-size: 14px;
}
.pos-cart-addon-qty .pos-qty-input {
    width: 32px !important;
    min-width: 32px;
    height: 26px;
    font-size: 12px;
    padding: 0;
}
.pos-cart-note-btn {
    font-size: 12px;
    border-color: rgba(212, 175, 55, 0.35);
    color: var(--brand-muted-on-dark, #9ca3af);
}
.pos-cart-note-btn:hover,
.pos-cart-note-btn:focus {
    color: var(--brand-gold, #d4af37);
    border-color: var(--brand-gold, #d4af37);
    background: rgba(212, 175, 55, 0.08);
}
.pos-cart-empty {
    font-size: 13px;
    font-weight: 600;
}

/* Draft status — high contrast on dark theme (old soft-secondary was invisible) */
.badge-soft-draft,
span.badge-soft-draft {
    color: #FCD34D !important;
    background-color: rgba(245, 158, 11, 0.28) !important;
    border: 1px solid rgba(245, 158, 11, 0.55);
    font-weight: 700;
}
.status-draft .badge-soft-secondary {
    color: #FCD34D !important;
    background-color: rgba(245, 158, 11, 0.28) !important;
    border: 1px solid rgba(245, 158, 11, 0.55);
    font-weight: 700;
}

/* POS order status menu (sidebar-like) */
.pos-status-menu {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 0;
    list-style: none;
    margin: 0;
    padding: 8px 0 4px;
    border-bottom: 1px solid var(--brand-card-border);
}
.pos-status-menu > .nav-item {
    min-width: 160px;
    flex: 1 1 160px;
    max-width: 220px;
}
.pos-status-menu > .nav-item > .nav-link {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    color: var(--brand-muted-on-dark);
    border-radius: 8px;
    transition: background-color 0.15s ease, color 0.15s ease;
}
.pos-status-menu > .nav-item > .nav-link .nav-indicator-icon {
    font-size: 8px;
    opacity: 0.55;
}
.pos-status-menu > .nav-item > .nav-link .sidebar--badge-container {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
}
.pos-status-menu > .nav-item:hover > .nav-link,
.pos-status-menu > .nav-item.active > .nav-link {
    color: var(--brand-gold);
    background: rgba(212, 175, 55, 0.12);
}
.pos-status-menu > .nav-item.active > .nav-link .nav-indicator-icon {
    color: var(--brand-gold);
    opacity: 1;
}

/* Cashier shell — header / tabs / shift timer (adapted from prior Top Food cashier UI) */
.pos-cashier-page {
    margin-top: 0 !important;
}

.cashier-shell-header {
    position: sticky;
    top: 0;
    z-index: 40;
    margin: 0 0 12px;
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 16px;
    background: rgba(11, 8, 21, 0.92);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.28);
}

.cashier-shell-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    max-width: 1600px;
    margin: 0 auto;
    padding: 10px 14px;
}

.cashier-shell-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    flex: 0 1 auto;
}

.cashier-shell-brand__logo {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    object-fit: cover;
    flex-shrink: 0;
    border: 1px solid rgba(245, 158, 11, 0.35);
    background: #111;
}

.cashier-shell-brand__meta {
    min-width: 0;
}

.cashier-shell-brand__title {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 800;
    line-height: 1.1;
    color: #f59e0b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cashier-shell-brand__user {
    margin: 2px 0 0;
    font-size: 10px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.45);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cashier-shell-brand__timer,
#cashier-shift-timer.business-day-bar__timer {
    margin: 4px 0 0;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 10px;
    font-weight: 800;
    color: #22c55e;
    background: transparent;
    padding: 0;
    min-width: 0;
    letter-spacing: 0.02em;
}

.cashier-shell-tabs {
    display: flex;
    align-items: center;
    gap: 4px;
    flex: 1 1 auto;
    justify-content: center;
    flex-wrap: wrap;
}

.cashier-shell-tab {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 0;
    border-radius: 12px;
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.6);
    background: transparent;
    text-decoration: none !important;
    transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
    white-space: nowrap;
    cursor: pointer;
}

.cashier-shell-tab i {
    font-size: 15px;
    line-height: 1;
}

.cashier-shell-tab:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.06);
}

.cashier-shell-tab.is-active {
    color: #111 !important;
    background: #f59e0b !important;
    box-shadow: 0 4px 14px rgba(245, 158, 11, 0.35);
}

.cashier-shell-tab--open-day {
    color: #f59e0b !important;
    background: rgba(245, 158, 11, 0.12) !important;
    border: 1px solid rgba(245, 158, 11, 0.35) !important;
    font-weight: 800 !important;
}

.cashier-shell-tab--open-day:hover {
    background: #f59e0b !important;
    color: #111 !important;
    border-color: #f59e0b !important;
}

.cashier-shell-tab--timer {
    color: #22c55e !important;
    background: rgba(34, 197, 94, 0.1) !important;
    border: 1px solid rgba(34, 197, 94, 0.3) !important;
    cursor: default !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
}

.cashier-shell-tab--timer:hover {
    background: rgba(34, 197, 94, 0.1) !important;
    color: #22c55e !important;
}

.cashier-shell-tab--close-day {
    color: #ef4444 !important;
    background: rgba(239, 68, 68, 0.1) !important;
    border: 1px solid rgba(239, 68, 68, 0.3) !important;
    font-weight: 800 !important;
}

.cashier-shell-tab--close-day:hover {
    background: #ef4444 !important;
    color: #ffffff !important;
    border-color: #ef4444 !important;
}

.cashier-shell-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.cashier-shell-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-radius: 12px;
    padding: 8px 12px;
    font-size: 11px;
    font-weight: 700;
    border: 1px solid transparent;
    text-decoration: none !important;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
    white-space: nowrap;
    cursor: pointer;
    background: transparent;
}

.cashier-shell-btn--icon {
    width: 36px;
    height: 36px;
    padding: 0;
    border-color: rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.04);
    color: #fbbf24;
}

.cashier-shell-btn--icon:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #f59e0b;
}

.cashier-shell-btn--amber {
    border-color: rgba(245, 158, 11, 0.25);
    background: rgba(245, 158, 11, 0.12);
    color: #f59e0b;
}

.cashier-shell-btn--amber:hover {
    background: rgba(245, 158, 11, 0.22);
}

.cashier-shell-btn--ghost {
    border-color: rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.04);
    color: rgba(255, 255, 255, 0.75);
}

.cashier-shell-btn--ghost:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
}

.cashier-shell-btn--danger {
    border-color: rgba(239, 68, 68, 0.25);
    background: rgba(239, 68, 68, 0.12);
    color: #ef4444;
}

.cashier-shell-btn--danger:hover {
    background: rgba(239, 68, 68, 0.22);
    color: #fecaca;
}

@media (max-width: 991.98px) {
    .cashier-shell-header__inner {
        flex-wrap: wrap;
    }
    .cashier-shell-tabs {
        order: 3;
        width: 100%;
        justify-content: flex-start;
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 2px;
    }
    .cashier-shell-tab span {
        display: none;
    }
    .cashier-shell-tab {
        padding: 8px 10px;
    }
}

/* Light cashier theme (matches prior React light mode) */
html.cashier-theme-light .pos-cashier-page,
.pos-cashier-page.cashier-theme-light {
    --cashier-surface: #f9fafb;
    --cashier-text: #111827;
}

html.cashier-theme-light .cashier-shell-header,
.pos-cashier-page.cashier-theme-light .cashier-shell-header {
    background: rgba(255, 255, 255, 0.96);
    border-color: #e5e7eb;
    box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
}

html.cashier-theme-light .cashier-shell-brand__user,
.pos-cashier-page.cashier-theme-light .cashier-shell-brand__user {
    color: #6b7280;
}

html.cashier-theme-light .cashier-shell-tab,
.pos-cashier-page.cashier-theme-light .cashier-shell-tab {
    color: #4b5563;
}

html.cashier-theme-light .cashier-shell-tab:hover,
.pos-cashier-page.cashier-theme-light .cashier-shell-tab:hover {
    color: #111827;
    background: #f3f4f6;
}

html.cashier-theme-light .cashier-shell-btn--icon,
.pos-cashier-page.cashier-theme-light .cashier-shell-btn--icon {
    border-color: #e5e7eb;
    background: #fff;
    color: #d97706;
}

html.cashier-theme-light .cashier-shell-btn--ghost,
.pos-cashier-page.cashier-theme-light .cashier-shell-btn--ghost {
    border-color: #e5e7eb;
    background: #fff;
    color: #4b5563;
}

html.cashier-theme-light .cashier-shell-btn--ghost:hover,
.pos-cashier-page.cashier-theme-light .cashier-shell-btn--ghost:hover {
    background: #f9fafb;
    color: #111827;
}

html.cashier-theme-light .pos-cart-empty,
.pos-cashier-page.cashier-theme-light .pos-cart-empty {
    background: rgba(255, 255, 255, 0.04) !important;
    color: rgba(255, 255, 255, 0.75) !important;
    border-color: rgba(253, 184, 19, 0.35) !important;
}
html.cashier-theme-light .pos-cart-surface,
.pos-cashier-page.cashier-theme-light .pos-cart-surface {
    background: rgba(0, 0, 0, 0.22) !important;
}
html.cashier-theme-light .pos-cart-side-actions .btn-secondary,
.pos-cashier-page.cashier-theme-light .pos-cart-side-actions .btn-secondary {
    background: #1A1A1A !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    color: #F5F5F5 !important;
}

.business-day-bar__timer {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-weight: 700;
}
/* Closing preview — dark Top Food palette (must beat theme light cards) */
#close-business-day-modal .closing-preview,
#close-business-day-modal .closing-preview * {
    color: #F5F5F5;
}
#close-business-day-modal .closing-preview__box,
.closing-preview__box {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 8px;
    padding: 10px 12px !important;
    background: #1A1A1A !important;
    border: 1px solid rgba(253, 184, 19, 0.18) !important;
    border-radius: 10px !important;
    margin-bottom: 8px !important;
    color: #F5F5F5 !important;
    box-shadow: none !important;
}
#close-business-day-modal .closing-preview__box span,
.closing-preview__box span {
    color: rgba(255, 255, 255, 0.55) !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
}
#close-business-day-modal .closing-preview__box strong,
.closing-preview__box strong {
    color: #FFFFFF !important;
    font-weight: 800 !important;
    -webkit-text-fill-color: #FFFFFF !important;
}
#close-business-day-modal .closing-preview__amount,
.closing-preview__amount {
    font-size: 1.35rem !important;
    font-weight: 900 !important;
    color: #FDB813 !important;
    -webkit-text-fill-color: #FDB813 !important;
    margin: 0 0 0.75rem !important;
}
#close-business-day-modal .closing-preview h6,
.closing-preview h6 {
    color: #FDB813 !important;
    font-weight: 800 !important;
    font-size: 0.85rem !important;
}
#close-business-day-modal .closing-preview__payments li,
.closing-preview__payments li {
    display: flex !important;
    justify-content: space-between !important;
    padding: 8px 0 !important;
    border-bottom: 1px dashed rgba(255, 255, 255, 0.14) !important;
    color: #F5F5F5 !important;
}
#close-business-day-modal .closing-preview__payments li span,
.closing-preview__payments li span {
    color: rgba(255, 255, 255, 0.62) !important;
}
#close-business-day-modal .closing-preview__payments li strong,
.closing-preview__payments li strong {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}
#close-business-day-modal .closing-preview .alert,
#close-business-day-modal .closing-preview .alert-soft-info,
#close-business-day-modal .closing-preview .alert-soft-primary,
#close-business-day-modal .closing-preview .alert-soft-warning,
.closing-preview .alert-soft-info,
.closing-preview .alert-soft-primary,
.closing-preview .alert-soft-warning {
    background: rgba(253, 184, 19, 0.12) !important;
    border: 1px solid rgba(253, 184, 19, 0.28) !important;
    color: #FFE08A !important;
    border-radius: 10px !important;
}
#close-business-day-modal .closing-preview .alert strong {
    color: #FDB813 !important;
    -webkit-text-fill-color: #FDB813 !important;
}
#close-business-day-modal .modal-content {
    background: #121212 !important;
    color: #F5F5F5 !important;
    border: 1px solid rgba(253, 184, 19, 0.18) !important;
}
#close-business-day-modal .modal-header,
#close-business-day-modal .modal-footer {
    background: #121212 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}
#close-business-day-modal .modal-title,
#close-business-day-modal .form-label,
#close-business-day-modal label {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}
#close-business-day-modal .form-control {
    background: #1A1A1A !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    color: #F5F5F5 !important;
    -webkit-text-fill-color: #F5F5F5 !important;
}
#close-business-day-modal .form-control:focus {
    border-color: #FDB813 !important;
    box-shadow: 0 0 0 0.15rem rgba(253, 184, 19, 0.25) !important;
}
#close-business-day-modal .close,
#close-business-day-modal .close span {
    color: #fff !important;
    text-shadow: none;
    opacity: 0.85;
}
#close-business-day-modal .btn-danger {
    background: #dc2626 !important;
    border-color: #dc2626 !important;
    color: #fff !important;
    font-weight: 800;
}
#close-business-day-modal .btn-secondary {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: rgba(255, 255, 255, 0.85) !important;
}
#close-business-day-modal .modal-body::-webkit-scrollbar {
    width: 8px;
}
#close-business-day-modal .modal-body::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.04);
}
#close-business-day-modal .modal-body::-webkit-scrollbar-thumb {
    background: rgba(253, 184, 19, 0.45);
    border-radius: 999px;
}

#purchases-payments-modal .modal-content {
    background: #121212 !important;
    color: #F5F5F5 !important;
    border: 1px solid rgba(253, 184, 19, 0.18) !important;
}
#purchases-payments-modal .modal-header,
#purchases-payments-modal .modal-footer {
    border-color: rgba(255, 255, 255, 0.1) !important;
}
#purchases-payments-modal .modal-title,
#purchases-payments-modal .form-label,
#purchases-payments-modal label {
    color: #FFFFFF !important;
}
#purchases-payments-modal .nav-tabs {
    border-bottom-color: rgba(255, 255, 255, 0.12) !important;
}
#purchases-payments-modal .nav-tabs .nav-link {
    color: rgba(255, 255, 255, 0.65) !important;
    border: none !important;
}
#purchases-payments-modal .nav-tabs .nav-link.active {
    color: #FDB813 !important;
    background: transparent !important;
    border-bottom: 2px solid #FDB813 !important;
}
#purchases-payments-modal .form-control,
#purchases-payments-modal select.form-control {
    background: #1A1A1A !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    color: #F5F5F5 !important;
}
#purchases-payments-modal .input-group-text {
    background: #1A1A1A !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    color: #FDB813 !important;
}
#purchases-payments-modal .alert-soft-info,
#purchases-payments-modal .alert-warning {
    background: rgba(253, 184, 19, 0.12) !important;
    border: 1px solid rgba(253, 184, 19, 0.25) !important;
    color: #FFE08A !important;
}
#purchases-payments-modal .btn-primary {
    background: #FDB813 !important;
    border-color: #FDB813 !important;
    color: #0A0A0A !important;
    font-weight: 800;
}
#purchases-payments-modal .close,
#purchases-payments-modal .close span {
    color: #fff !important;
    text-shadow: none;
    opacity: 0.85;
}

/* Close-day modal: keep footer visible and scroll the preview body */
#close-business-day-modal .modal-dialog {
    margin: 0.75rem auto;
    max-height: calc(100vh - 1.5rem);
    pointer-events: auto;
}
#close-business-day-modal .modal-content {
    max-height: calc(100vh - 1.5rem) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    pointer-events: auto;
}
#purchases-payments-modal .modal-dialog,
#purchases-payments-modal .modal-content {
    pointer-events: auto;
}
#close-business-day-modal .modal-header {
    flex-shrink: 0;
}
#close-business-day-modal .close-business-day-form,
#close-business-day-modal #close-business-day-form {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
}
#close-business-day-modal .modal-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}
#close-business-day-modal .modal-footer {
    flex-shrink: 0 !important;
}

@media (max-height: 700px) {
    #close-business-day-modal .modal-dialog {
        margin: 0.35rem auto;
        max-height: calc(100vh - 0.7rem);
    }
    #close-business-day-modal .modal-content {
        max-height: calc(100vh - 0.7rem) !important;
    }
}

.supplier-payment-summary {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    padding: 12px 14px;
    color: #F5F5F5;
}
.supplier-payment-summary__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 0;
    font-size: 0.95rem;
    color: #F5F5F5;
}
.supplier-payment-summary__row span {
    color: rgba(255, 255, 255, 0.6);
}
.supplier-payment-summary__row strong {
    color: #FFFFFF;
}
.supplier-payment-summary__row + .supplier-payment-summary__row {
    border-top: 1px dashed rgba(255, 255, 255, 0.12);
}
.supplier-payment-summary__row--remaining {
    margin-top: 4px;
    padding-top: 10px;
    font-size: 1.05rem;
}
.supplier-payment-summary__row--remaining strong {
    color: #FDB813;
}
.supplier-payment-summary__row--remaining strong.text-success {
    color: #34d399 !important;
}

/* POS upsell bottom sheet (fries / drinks) */
.pos-upsell-sheet {
    position: fixed;
    inset: 0;
    z-index: 1080;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
.pos-upsell-sheet[hidden] {
    display: none !important;
}
.pos-upsell-sheet__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
}
.pos-upsell-sheet__panel {
    position: relative;
    z-index: 1;
    width: min(560px, 100%);
    max-height: min(82vh, 720px);
    display: flex;
    flex-direction: column;
    border-radius: 28px 28px 0 0;
    background: #11151b;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom: 0;
    box-shadow: 0 -18px 40px rgba(0, 0, 0, 0.45);
    padding: 16px 18px 18px;
}
@media (min-width: 576px) {
    .pos-upsell-sheet {
        align-items: center;
    }
    .pos-upsell-sheet__panel {
        border-radius: 28px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }
}
.pos-upsell-marquee {
    overflow: hidden;
    border-radius: 12px;
    background: linear-gradient(90deg, #f59e0b, #d97706);
    margin-bottom: 12px;
}
.pos-upsell-marquee__track {
    display: inline-flex;
    gap: 28px;
    white-space: nowrap;
    padding: 8px 12px;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    animation: pos-upsell-marquee 18s linear infinite;
}
@keyframes pos-upsell-marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
.pos-upsell-sheet__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}
.pos-upsell-sheet__title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 800;
    color: #fff;
}
.pos-upsell-sheet__subtitle {
    margin: 4px 0 0;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
}
.pos-upsell-sheet__close {
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.7);
}
.pos-upsell-sheet__body {
    overflow-y: auto;
    min-height: 0;
    flex: 1;
    padding-bottom: 8px;
}
.pos-upsell-section + .pos-upsell-section {
    margin-top: 14px;
}
.pos-upsell-section__label {
    margin: 0 0 8px;
    font-size: 12px;
    font-weight: 800;
}
.pos-upsell-section__label--fries { color: #f59e0b; }
.pos-upsell-section__label--drinks { color: #3b82f6; }
.pos-upsell-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
.pos-upsell-card {
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 14px;
    padding: 10px;
    background: rgba(0, 0, 0, 0.2);
}
.pos-upsell-card.is-selected--fries {
    border-color: #f59e0b;
    background: rgba(245, 158, 11, 0.1);
}
.pos-upsell-card.is-selected--drinks {
    border-color: #3b82f6;
    background: rgba(59, 130, 246, 0.1);
}
.pos-upsell-card__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}
.pos-upsell-card__name {
    margin: 0;
    font-size: 12px;
    font-weight: 800;
    color: #fff;
}
.pos-upsell-card__price {
    margin: 2px 0 0;
    font-size: 10px;
    font-weight: 700;
    color: #f59e0b;
}
.pos-upsell-card.is-selected--drinks .pos-upsell-card__price {
    color: #60a5fa;
}
.pos-upsell-card__qty {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.pos-upsell-qty-btn {
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 8px;
    background: rgba(245, 158, 11, 0.18);
    color: #fbbf24;
    font-weight: 800;
}
.pos-upsell-card.is-selected--drinks .pos-upsell-qty-btn {
    background: rgba(59, 130, 246, 0.18);
    color: #93c5fd;
}
.pos-upsell-qty-val {
    min-width: 20px;
    text-align: center;
    font-size: 12px;
    font-weight: 800;
    color: #fff;
}
.pos-upsell-card__toggle {
    margin-top: 8px;
    width: 100%;
    border: 0;
    border-radius: 10px;
    padding: 7px 8px;
    font-size: 11px;
    font-weight: 800;
    background: rgba(245, 158, 11, 0.16);
    color: #fbbf24;
}
.pos-upsell-card.is-selected .pos-upsell-card__toggle {
    background: #f59e0b;
    color: #111;
}
.pos-upsell-card.is-selected--drinks .pos-upsell-card__toggle {
    background: #3b82f6;
    color: #fff;
}
.pos-upsell-empty {
    text-align: center;
    padding: 28px 12px;
    color: rgba(255, 255, 255, 0.45);
    font-size: 13px;
}
.pos-upsell-sheet__footer {
    display: flex;
    gap: 8px;
    margin-top: 12px;
}
.pos-upsell-btn {
    border-radius: 14px;
    padding: 12px 14px;
    font-size: 13px;
    font-weight: 800;
    border: 1px solid transparent;
}
.pos-upsell-btn--primary {
    flex: 1;
    background: #f59e0b;
    color: #111;
}
.pos-upsell-btn--ghost {
    background: transparent;
    border-color: rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.75);
}
body.pos-upsell-open {
    overflow: hidden;
}

/* Cashier invoices board */
.pos-cashier-page:has(.pos-invoices-board) {
    display: flex;
    flex-direction: column;
    overflow: hidden !important;
}
.pos-invoices-board {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    padding-bottom: 8px;
}
body:has(.pos-invoices-board) .footer {
    display: none !important;
}
body:has(.pos-invoices-board).footer-offset {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}
.pos-inv-summary-wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex-shrink: 0;
}
.pos-inv-summary-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: #11151b;
}
.pos-inv-summary-toolbar__title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.85);
}
.pos-inv-summary-toolbar__title > i {
    color: #f59e0b;
}
.pos-inv-summary-toolbar__actions {
    display: flex;
    gap: 8px;
}
.pos-inv-summary-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.04);
    color: rgba(255, 255, 255, 0.85);
    font-size: 12px;
    font-weight: 700;
    padding: 6px 12px;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}
.pos-inv-summary-btn:hover {
    background: rgba(253, 184, 19, 0.12);
    border-color: rgba(253, 184, 19, 0.35);
    color: #fdb813;
}
.pos-inv-summary-btn--show {
    border-color: rgba(253, 184, 19, 0.35);
    color: #fdb813;
}
.pos-inv-summary-collapsed {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px;
    border-radius: 16px;
    border: 1px dashed rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.02);
    color: rgba(255, 255, 255, 0.55);
    font-size: 12px;
}
.pos-inv-summary-collapsed > i {
    color: #f59e0b;
    font-size: 16px;
}
.pos-inv-summary-modal .modal-content {
    border-radius: 16px;
}
#pos-inv-summary-password-modal .modal-content {
    background: #121212 !important;
    color: #F5F5F5 !important;
    border: 1px solid rgba(253, 184, 19, 0.18) !important;
}
#pos-inv-summary-password-modal .modal-header,
#pos-inv-summary-password-modal .modal-footer {
    background: #121212 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}
#pos-inv-summary-password-modal .modal-title,
#pos-inv-summary-password-modal .form-label {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}
#pos-inv-summary-password-modal .pos-inv-summary-modal__hint {
    color: rgba(255, 255, 255, 0.65) !important;
    font-size: 0.9rem;
}
#pos-inv-summary-password-modal .pos-inv-summary-modal__error {
    margin: 0.65rem 0 0;
    padding: 0.55rem 0.75rem;
    border-radius: 10px;
    background: rgba(239, 68, 68, 0.14) !important;
    border: 1px solid rgba(248, 113, 113, 0.45) !important;
    color: #FCA5A5 !important;
    -webkit-text-fill-color: #FCA5A5 !important;
    font-size: 0.85rem;
    font-weight: 700;
    text-align: center;
}
#pos-inv-summary-password-modal .form-control.is-invalid,
#pos-inv-summary-password-modal .pos-inv-summary-modal__input.is-invalid {
    border-color: #F87171 !important;
    box-shadow: 0 0 0 0.15rem rgba(248, 113, 113, 0.22) !important;
}
#pos-inv-summary-password-modal .pos-inv-summary-modal__input,
#pos-inv-summary-password-modal .form-control {
    background: #1A1A1A !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    color: #F5F5F5 !important;
    -webkit-text-fill-color: #F5F5F5 !important;
}
#pos-inv-summary-password-modal .pos-inv-summary-modal__input:focus,
#pos-inv-summary-password-modal .form-control:focus {
    border-color: #FDB813 !important;
    box-shadow: 0 0 0 0.15rem rgba(253, 184, 19, 0.25) !important;
}
#pos-inv-summary-password-modal .close,
#pos-inv-summary-password-modal .close span {
    color: #fff !important;
    text-shadow: none;
    opacity: 0.85;
}
#pos-inv-summary-password-modal .pos-inv-summary-modal__btn-submit {
    background: #FDB813 !important;
    border-color: #FDB813 !important;
    color: #111 !important;
    font-weight: 800;
}
#pos-inv-summary-password-modal .pos-inv-summary-modal__btn-cancel {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: rgba(255, 255, 255, 0.85) !important;
}
#pos-inv-summary-password-modal .pos-inv-summary-modal__btn-cancel:hover {
    background: rgba(255, 255, 255, 0.06) !important;
    color: #fff !important;
}
#pos-inv-summary-password-modal .pos-inv-summary-modal__btn-submit:hover {
    background: #e5a811 !important;
    border-color: #e5a811 !important;
    color: #0A0A0A !important;
}
#pos-inv-summary-password-modal .modal-dialog,
#pos-inv-summary-password-modal .modal-content {
    pointer-events: auto;
}
#pos-inv-summary-password-modal .modal-body {
    background: #121212 !important;
}

/* Password modal stays dark even in light cashier theme */
html.cashier-theme-light #pos-inv-summary-password-modal .cashier-day-modal__content,
.cashier-theme-light #pos-inv-summary-password-modal .cashier-day-modal__content,
html.cashier-theme-light #pos-inv-summary-password-modal .modal-content,
.cashier-theme-light #pos-inv-summary-password-modal .modal-content {
    background: #121212 !important;
    color: #F5F5F5 !important;
    border-color: rgba(253, 184, 19, 0.18) !important;
}
html.cashier-theme-light #pos-inv-summary-password-modal .modal-title,
.cashier-theme-light #pos-inv-summary-password-modal .modal-title,
html.cashier-theme-light #pos-inv-summary-password-modal .form-label,
.cashier-theme-light #pos-inv-summary-password-modal .form-label,
html.cashier-theme-light #pos-inv-summary-password-modal .pos-inv-summary-modal__hint,
.cashier-theme-light #pos-inv-summary-password-modal .pos-inv-summary-modal__hint {
    color: rgba(255, 255, 255, 0.88) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.88) !important;
}
html.cashier-theme-light #pos-inv-summary-password-modal .cashier-day-modal__input,
.cashier-theme-light #pos-inv-summary-password-modal .cashier-day-modal__input,
html.cashier-theme-light #pos-inv-summary-password-modal .form-control,
.cashier-theme-light #pos-inv-summary-password-modal .form-control {
    background: #1A1A1A !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    color: #F5F5F5 !important;
    -webkit-text-fill-color: #F5F5F5 !important;
}
html.cashier-theme-light #pos-inv-summary-password-modal .pos-inv-summary-modal__error,
.cashier-theme-light #pos-inv-summary-password-modal .pos-inv-summary-modal__error {
    color: #FCA5A5 !important;
    -webkit-text-fill-color: #FCA5A5 !important;
    background: rgba(239, 68, 68, 0.18) !important;
}

/* Invoice summary: keep dark readable panel on all cashier themes */
.pos-inv-summary-lock-form {
    margin: 0;
    display: inline-flex;
}

/* Invoice summary: keep dark readable panel on all cashier themes */
html.cashier-theme-light .pos-invoices-board .pos-inv-summary-toolbar,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-summary-toolbar,
html.cashier-theme-light .pos-invoices-board .pos-inv-summary__card,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-summary__card,
html.cashier-theme-light .pos-invoices-board .pos-inv-summary-collapsed,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-summary-collapsed {
    background: #11151b !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}
html.cashier-theme-light .pos-invoices-board .pos-inv-summary-toolbar__title,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-summary-toolbar__title {
    color: rgba(255, 255, 255, 0.9) !important;
}
html.cashier-theme-light .pos-invoices-board .pos-inv-summary__label,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-summary__label {
    color: rgba(255, 255, 255, 0.55) !important;
}
html.cashier-theme-light .pos-invoices-board .pos-inv-summary-btn,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-summary-btn {
    background: rgba(255, 255, 255, 0.04) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    color: rgba(255, 255, 255, 0.88) !important;
}
html.cashier-theme-light .pos-invoices-board .pos-inv-summary-btn--show,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-summary-btn--show {
    border-color: rgba(253, 184, 19, 0.35) !important;
    color: #fdb813 !important;
}
html.cashier-theme-light .pos-invoices-board .pos-inv-summary-collapsed,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-summary-collapsed {
    color: rgba(255, 255, 255, 0.55) !important;
}

/* Invoices board filters/cards stay dark + readable in light cashier theme */
html.cashier-theme-light .pos-invoices-board .pos-inv-filter,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-filter,
html.cashier-theme-light .pos-invoices-board .pos-inv-card,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-card,
html.cashier-theme-light .pos-invoices-board .pos-inv-empty,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-empty,
html.cashier-theme-light .pos-invoices-board .pos-inv-table-wrap,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-table-wrap {
    background: #11151b !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}
html.cashier-theme-light .pos-invoices-board .pos-inv-filter > span,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-filter > span,
html.cashier-theme-light .pos-invoices-board .pos-inv-filter .form-control,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-filter .form-control,
html.cashier-theme-light .pos-invoices-board .pos-inv-search > i,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-search > i {
    color: rgba(255, 255, 255, 0.55) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.88) !important;
}
html.cashier-theme-light .pos-invoices-board .pos-inv-card__number,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-card__number,
html.cashier-theme-light .pos-invoices-board .pos-inv-card__main,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-card__main,
html.cashier-theme-light .pos-invoices-board .pos-inv-action,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-action {
    color: #fff !important;
}
html.cashier-theme-light .pos-invoices-board .pos-inv-action--pay,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-action--pay {
    color: #34d399 !important;
}
html.cashier-theme-light .pos-invoices-board .pos-inv-card__void,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-card__void,
html.cashier-theme-light .pos-invoices-board .pos-inv-card__void i,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-card__void i {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    background: #dc2626;
}
html.cashier-theme-light .pos-invoices-board .pos-inv-action--void,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-action--void {
    color: #f87171 !important;
}
html.cashier-theme-light .pos-invoices-board .pos-inv-card__customer,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-card__customer,
html.cashier-theme-light .pos-invoices-board .pos-inv-card__date,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-card__date {
    color: rgba(255, 255, 255, 0.45) !important;
}
html.cashier-theme-light .pos-invoices-board .pos-inv-pill,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-pill {
    color: rgba(255, 255, 255, 0.72) !important;
    background: rgba(255, 255, 255, 0.06) !important;
}
html.cashier-theme-light .pos-invoices-board .pos-inv-pill.is-active,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-pill.is-active,
html.cashier-theme-light .pos-invoices-board .pos-inv-pill:hover,
.pos-cashier-page.cashier-theme-light .pos-invoices-board .pos-inv-pill:hover {
    color: #111 !important;
    background: #f59e0b !important;
}

.pos-inv-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
@media (min-width: 992px) {
    .pos-inv-summary {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
.pos-inv-summary__card {
    text-align: center;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: #11151b;
    padding: 12px 10px;
}
.pos-inv-summary__card > i {
    font-size: 18px;
    color: #f59e0b;
    display: block;
    margin-bottom: 4px;
}
.pos-inv-summary__value {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 800;
    color: #f59e0b;
}
.pos-inv-summary__value.text-success { color: #10b981 !important; }
.pos-inv-summary__value.text-info { color: #3b82f6 !important; }
.pos-inv-summary__label {
    margin: 2px 0 0;
    font-size: 10px;
    color: rgba(255, 255, 255, 0.5);
}
.pos-inv-filters {
    display: grid;
    gap: 8px;
    grid-template-columns: 1fr;
}
@media (min-width: 992px) {
    .pos-inv-filters {
        grid-template-columns: 1.4fr 0.9fr 0.9fr 0.9fr auto;
        align-items: end;
    }
}
.pos-inv-filter {
    margin: 0;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: #11151b;
    padding: 8px 12px;
}
.pos-inv-filter > span {
    display: block;
    margin-bottom: 4px;
    font-size: 10px;
    font-weight: 800;
    color: rgba(255, 255, 255, 0.4);
}
.pos-inv-filter .form-control {
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    min-height: 28px;
}
.pos-inv-search {
    position: relative;
}
.pos-inv-search > i {
    position: absolute;
    inset-inline-start: 0;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(255, 255, 255, 0.35);
}
.pos-inv-search .form-control {
    padding-inline-start: 26px !important;
}
.pos-inv-filter-actions {
    display: flex;
    gap: 6px;
    align-items: end;
}
.pos-inv-btn {
    border-radius: 14px !important;
    min-height: 44px;
    font-weight: 700;
}
.pos-inv-btn--icon {
    width: 44px;
    padding: 0 !important;
}
.pos-inv-status-pills {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    padding-bottom: 2px;
}
.pos-inv-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 11px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.65);
    background: rgba(255, 255, 255, 0.05);
    text-decoration: none !important;
}
.pos-inv-pill span {
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    padding: 1px 7px;
    font-size: 10px;
}
.pos-inv-pill.is-active,
.pos-inv-pill:hover {
    color: #111;
    background: #f59e0b;
}
.pos-inv-pill.is-active span,
.pos-inv-pill:hover span {
    background: rgba(0, 0, 0, 0.15);
    color: #111;
}
.pos-inv-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.pos-inv-list > .pos-inv-empty {
    width: 100%;
}
.pos-inv-table-wrap {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    background: #141414;
    scrollbar-width: thin;
    scrollbar-color: rgba(253, 184, 19, 0.55) rgba(255, 255, 255, 0.08);
}
.pos-inv-table-wrap::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}
.pos-inv-table-wrap::-webkit-scrollbar-thumb {
    background: rgba(253, 184, 19, 0.55);
    border-radius: 8px;
}
.pos-inv-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 920px;
    table-layout: auto;
}
.pos-inv-table thead th {
    padding: 12px 14px;
    font-size: 12px;
    font-weight: 800;
    color: #FDB813;
    background: #1a1a1a;
    border-bottom: 1px solid rgba(253, 184, 19, 0.25);
    white-space: nowrap;
    text-align: start;
    position: sticky;
    top: 0;
    z-index: 2;
}
.pos-inv-table tbody td {
    padding: 10px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    vertical-align: middle;
    color: #e5e7eb;
    font-size: 13px;
    text-align: start;
}
.pos-inv-table tbody tr:last-child td {
    border-bottom: 0;
}
.pos-inv-table__row:hover td {
    background: rgba(253, 184, 19, 0.05);
}
.pos-inv-table__row.is-canceled td {
    opacity: 0.55;
}
.pos-inv-table__row.is-takeaway td:first-child {
    border-inline-start: 4px solid #fbbf24;
}
.pos-inv-table__row.is-dinein td:first-child {
    border-inline-start: 4px solid #60a5fa;
}
.pos-inv-table__row.is-delivery td:first-child {
    border-inline-start: 4px solid #34d399;
}
.pos-inv-table__id {
    display: inline-block;
    padding: 0;
    border: 0;
    background: transparent;
    color: #FDB813;
    font-size: 16px;
    font-weight: 800;
    cursor: pointer;
}
.pos-inv-table__id:hover {
    text-decoration: underline;
}
.pos-inv-table__amount {
    display: block;
    margin-top: 2px;
    color: #FDB813;
    font-size: 13px;
    font-weight: 800;
}
.pos-inv-table__meta {
    display: block;
    margin-top: 2px;
    font-size: 11px;
    color: rgba(255, 255, 255, 0.55);
    font-weight: 700;
}
.pos-inv-table__type {
    font-weight: 800;
    white-space: nowrap;
}
.pos-inv-table__row.is-takeaway .pos-inv-table__type { color: #fbbf24; }
.pos-inv-table__row.is-dinein .pos-inv-table__type { color: #60a5fa; }
.pos-inv-table__row.is-delivery .pos-inv-table__type { color: #34d399; }
.pos-inv-table__customer {
    font-weight: 700;
    max-width: 220px;
}
.pos-inv-table__pay .pos-inv-card__pay {
    display: inline-block;
    font-size: 13px;
    font-weight: 800;
}
.pos-inv-table__pay .pos-inv-card__pay.is-paid { color: #34d399; }
.pos-inv-table__pay .pos-inv-card__pay.is-partial { color: #fbbf24; }
.pos-inv-table__pay .pos-inv-card__pay.is-unpaid { color: #f87171; }
.pos-inv-table__pay .pos-inv-card__pay.is-cod { color: #fb923c; }
.pos-inv-table__pay .pos-inv-card__pay.is-voided { color: #f87171; }
.pos-inv-table__pay .pos-inv-card__split {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-top: 4px;
    font-size: 11px;
    font-weight: 800;
}
.pos-inv-table__pay .pos-inv-card__split-paid { color: #34d399; }
.pos-inv-table__pay .pos-inv-card__split-due { color: #f87171; }
.pos-inv-table__actions {
    width: 1%;
    white-space: nowrap;
}
.pos-inv-table__actions-inner {
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 6px;
}
.pos-inv-table__actions .pos-inv-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-height: 34px;
    padding: 6px 10px;
    margin: 0;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.04);
    color: rgba(255, 255, 255, 0.88);
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    line-height: 1;
}
.pos-inv-table__actions .pos-inv-action:hover {
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
}
.pos-inv-table__actions .pos-inv-action--pay { color: #34d399; }
.pos-inv-table__actions .pos-inv-action--pay:hover {
    color: #6ee7b7;
    background: rgba(16, 185, 129, 0.12);
}
.pos-inv-table__actions .pos-inv-action--receipt { color: #fb923c; }
.pos-inv-table__actions .pos-inv-action--receipt:hover {
    color: #fdba74;
    background: rgba(251, 146, 60, 0.14);
}
.pos-inv-table__actions .pos-inv-action--void { color: #f87171; }
.pos-inv-table__actions .pos-inv-action--void:hover {
    color: #fca5a5;
    background: rgba(248, 113, 113, 0.12);
}
@media (max-width: 991px) {
    .pos-inv-table__actions .pos-inv-action span {
        display: none;
    }
}
.pos-inv-card--row {
    align-items: center;
    border-radius: 12px;
    min-height: 56px;
}
.pos-inv-card--row.is-takeaway {
    border-inline-start: 4px solid #fbbf24;
}
.pos-inv-card--row.is-dinein {
    border-inline-start: 4px solid #60a5fa;
}
.pos-inv-card--row.is-delivery {
    border-inline-start: 4px solid #34d399;
}
.pos-inv-card--row .pos-inv-card__main {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    text-align: start;
    gap: 8px 14px;
    padding: 8px 14px;
}
.pos-inv-card--row .pos-inv-card__number {
    margin: 0;
    font-size: 15px;
    font-weight: 800;
    white-space: nowrap;
}
.pos-inv-card--row .pos-inv-card__type {
    font-size: 12px;
    font-weight: 800;
}
.pos-inv-card--row.is-takeaway .pos-inv-card__type { color: #fbbf24; }
.pos-inv-card--row.is-dinein .pos-inv-card__type { color: #60a5fa; }
.pos-inv-card--row.is-delivery .pos-inv-card__type { color: #34d399; }
.pos-inv-card--row .pos-inv-card__table {
    font-size: 12px;
    font-weight: 700;
    color: #60a5fa;
    white-space: nowrap;
}
.pos-inv-card--row .pos-inv-card__customer {
    font-size: 12px;
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pos-inv-card--row .pos-inv-card__pay {
    margin: 0;
    font-size: 12px;
    font-weight: 800;
}
.pos-inv-card--row .pos-inv-card__pay.is-paid { color: #34d399; }
.pos-inv-card--row .pos-inv-card__pay.is-partial { color: #fbbf24; }
.pos-inv-card--row .pos-inv-card__pay.is-unpaid { color: #f87171; }
.pos-inv-card--row .pos-inv-card__pay.is-cod { color: #fb923c; }
.pos-inv-card--row .pos-inv-card__pay.is-voided { color: #f87171; }
.pos-inv-card--row .pos-inv-card__split {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    font-size: 11px;
    font-weight: 800;
}
.pos-inv-card--row .pos-inv-card__split-paid { color: #34d399; }
.pos-inv-card--row .pos-inv-card__split-due { color: #f87171; }
.pos-inv-card--row .pos-inv-card__amount {
    margin: 0;
    margin-inline-start: auto;
    font-size: 15px;
    font-weight: 800;
    white-space: nowrap;
}
.pos-inv-card--row .pos-inv-card__date {
    font-size: 11px;
    white-space: nowrap;
}
.pos-inv-card--row .pos-inv-card__actions {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    border-inline-start: 1px solid rgba(255, 255, 255, 0.08);
    border-top: 0;
    padding: 4px 6px;
    gap: 2px;
    flex: 0 0 auto;
}
.pos-inv-card--row .pos-inv-action {
    flex: 0 0 auto;
    min-width: 0;
    min-height: 38px;
    padding: 6px 10px;
    gap: 5px;
    font-size: 12px;
    font-weight: 700;
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.82);
}
.pos-inv-card--row .pos-inv-action + .pos-inv-action {
    border-top: 0;
}
.pos-inv-card--row .pos-inv-action span {
    white-space: nowrap;
}
.pos-inv-card--row .pos-inv-action--pay {
    color: #34d399;
}
.pos-inv-card--row .pos-inv-action--pay:hover {
    color: #6ee7b7;
    background: rgba(16, 185, 129, 0.12);
}
.pos-inv-card--row .pos-inv-action--receipt {
    color: #fb923c;
    font-weight: 800;
}
.pos-inv-card--row .pos-inv-action--receipt:hover {
    color: #fdba74;
    background: rgba(251, 146, 60, 0.14);
}

.pos-dinein-tables-grid--rows {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}
.pos-dinein-table-card--row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 12px;
    min-height: 56px;
    border-radius: 12px;
}
.pos-dinein-table-card--row .pos-dinein-table-card__bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 14px;
    min-width: 0;
    flex: 1 1 auto;
}
.pos-dinein-table-card--row .pos-dinein-table-card__name {
    font-size: 15px;
    margin: 0;
    white-space: nowrap;
}
.pos-dinein-table-card--row .pos-dinein-table-card__status {
    margin: 0;
    font-size: 12px;
    font-weight: 700;
}
.pos-dinein-table-card--row .pos-dinein-table-card__order {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    margin: 0;
    font-size: 13px;
    width: auto;
}
.pos-dinein-table-card--row .pos-dinein-table-card__empty {
    margin: 0;
    color: rgba(255, 255, 255, 0.45);
    font-size: 13px;
}
.pos-dinein-table-card--row .pos-dinein-table-card__actions {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 2px;
    flex: 0 0 auto;
}
.pos-dinein-table-card--row .pos-dinein-table-card__actions .pos-inv-action {
    min-height: 38px;
    padding: 6px 10px;
    gap: 5px;
    font-size: 12px;
    font-weight: 700;
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.82);
}

@media (max-width: 991px) {
    .pos-inv-card--row .pos-inv-action span,
    .pos-dinein-table-card--row .pos-inv-action span {
        display: none;
    }
    .pos-inv-card--row .pos-inv-card__amount {
        margin-inline-start: 0;
    }
}
.pos-inv-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 14px;
    align-items: stretch;
}
.pos-inv-grid > .pos-inv-empty {
    grid-column: 1 / -1;
}
.pos-inv-card {
    display: flex;
    align-items: stretch;
    gap: 0;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: #11151b;
    overflow: hidden;
}
.pos-inv-card.is-canceled {
    opacity: 0.6;
}
.pos-inv-card--tile {
    position: relative;
    flex-direction: column;
    min-height: 100%;
}
.pos-inv-card__void {
    position: absolute;
    top: 8px;
    inset-inline-start: 8px;
    z-index: 3;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 10px;
    background: #dc2626 !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
}
.pos-inv-card__void i,
.pos-inv-card__void .tio-delete,
.pos-inv-card__void .fa {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    font-size: 16px;
    line-height: 1;
}
.pos-inv-card__void:hover {
    background: #b91c1c !important;
    color: #fff !important;
}
.pos-inv-action--void {
    color: #f87171 !important;
}
.pos-inv-action--void:hover {
    color: #fecaca !important;
    background: rgba(239, 68, 68, 0.12);
}
.swal2-popup.pos-void-swal,
.swal2-container .swal2-popup,
.swal2-popup .swal2-title,
.swal2-popup .swal2-content,
.swal2-popup .swal2-html-container,
.swal2-radio,
.swal2-radio label,
.swal2-radio span,
.swal2-popup label,
.swal2-popup span.swal2-label {
    color: #111827 !important;
    -webkit-text-fill-color: #111827 !important;
}
.swal2-radio {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
}
.swal2-radio label {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 16px !important;
    font-weight: 800 !important;
}
.pos-void-hint {
    margin: 0 0 14px;
    color: #374151 !important;
    -webkit-text-fill-color: #374151 !important;
    font-size: 14px;
}
.pos-void-choices {
    display: flex;
    gap: 10px;
    justify-content: center;
    flex-wrap: wrap;
}
.pos-void-choice {
    min-width: 120px;
    border: 1px solid #d1d5db;
    background: #f3f4f6;
    color: #111827 !important;
    -webkit-text-fill-color: #111827 !important;
    border-radius: 10px;
    padding: 10px 16px;
    font-weight: 800;
    cursor: pointer;
}
.pos-void-choice.is-return {
    background: #fef3c7;
    border-color: #f59e0b;
    color: #92400e !important;
    -webkit-text-fill-color: #92400e !important;
}
.pos-void-choice.is-cancel {
    background: #fee2e2;
    border-color: #ef4444;
    color: #991b1b !important;
    -webkit-text-fill-color: #991b1b !important;
}
.pos-inv-card--tile .pos-inv-card__pay.is-voided { color: #f87171; }
.pos-inv-card--tile.is-takeaway {
    border-color: rgba(245, 158, 11, 0.35);
}
.pos-inv-card--tile.is-dinein {
    border-color: rgba(96, 165, 250, 0.35);
}
.pos-inv-card--tile.is-delivery {
    border-color: rgba(52, 211, 153, 0.35);
}
.pos-inv-card--tile .pos-inv-card__main {
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    text-align: center;
    padding: 18px 14px 14px;
    gap: 12px;
}
.pos-inv-card--tile .pos-inv-card__number {
    font-size: 1.05rem;
    letter-spacing: 0.02em;
    word-break: break-word;
}
.pos-inv-card--tile .pos-inv-card__facts {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}
.pos-inv-card--tile .pos-inv-card__type {
    font-size: 13px;
    font-weight: 800;
    color: rgba(255, 255, 255, 0.82);
}
.pos-inv-card--tile.is-takeaway .pos-inv-card__type { color: #fbbf24; }
.pos-inv-card--tile.is-dinein .pos-inv-card__type { color: #60a5fa; }
.pos-inv-card--tile.is-delivery .pos-inv-card__type { color: #34d399; }
.pos-inv-card--tile .pos-inv-card__pay {
    margin-top: 0;
    font-size: 12px;
}
.pos-inv-card--tile .pos-inv-card__pay-line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px 10px;
}
.pos-inv-card--tile .pos-inv-card__split {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px 10px;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
}
.pos-inv-card--tile .pos-inv-card__split-paid {
    color: #34d399;
}
.pos-inv-card--tile .pos-inv-card__split-due {
    color: #f87171;
}
.pos-inv-card--tile .pos-inv-card__pay.is-paid { color: #34d399; }
.pos-inv-card--tile .pos-inv-card__pay.is-partial { color: #fbbf24; }
.pos-inv-card--tile .pos-inv-card__pay.is-unpaid { color: #f87171; }
.pos-inv-card--tile .pos-inv-card__pay.is-cod { color: #fb923c; }
.pos-inv-card--tile .pos-inv-card__amount {
    font-size: 1.05rem;
}
.pos-inv-card--tile .pos-inv-card__actions {
    flex-direction: row;
    flex-wrap: wrap;
    border-inline-start: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.pos-inv-card--tile .pos-inv-action {
    flex: 1 1 46%;
    min-height: 40px;
    gap: 6px;
    font-size: 12px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.78);
}
.pos-inv-card--tile .pos-inv-action + .pos-inv-action {
    border-top: 0;
}
.pos-inv-card--tile .pos-inv-action:nth-child(odd) {
    border-inline-end: 1px solid rgba(255, 255, 255, 0.08);
}
.pos-inv-card--tile .pos-inv-action:nth-child(-n+2) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.pos-inv-card--tile .pos-inv-action:last-child:nth-child(odd) {
    flex-basis: 100%;
    border-inline-end: 0;
}
.pos-inv-card--tile .pos-inv-action--pay {
    color: #34d399;
}
.pos-inv-card--tile .pos-inv-action--pay:hover {
    color: #6ee7b7;
    background: rgba(16, 185, 129, 0.12);
}
.pos-inv-card--tile .pos-inv-action--receipt {
    color: #fb923c;
    font-weight: 800;
}
.pos-inv-card--tile .pos-inv-action--receipt:hover {
    color: #fdba74;
    background: rgba(251, 146, 60, 0.14);
}
.pos-inv-card__main {
    flex: 1;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: start;
    padding: 12px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
    cursor: pointer;
    text-decoration: none;
}
.pos-inv-card__main:hover {
    background: rgba(255, 255, 255, 0.03);
}
.pos-inv-card__meta {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    flex-wrap: wrap;
}
.pos-inv-status,
.pos-inv-source {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border-radius: 999px;
    padding: 3px 8px;
    font-size: 10px;
    font-weight: 800;
}
.pos-inv-status--success { color: #34d399; background: rgba(16, 185, 129, 0.12); }
.pos-inv-status--pending,
.pos-inv-status--cooking { color: #fbbf24; background: rgba(245, 158, 11, 0.12); }
.pos-inv-status--info { color: #60a5fa; background: rgba(59, 130, 246, 0.12); }
.pos-inv-status--danger { color: #f87171; background: rgba(239, 68, 68, 0.12); }
.pos-inv-status--draft { color: rgba(255, 255, 255, 0.55); background: rgba(255, 255, 255, 0.08); }
.pos-inv-source {
    color: #f59e0b;
    background: rgba(245, 158, 11, 0.12);
}
.pos-inv-card__number {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 800;
    color: #fff;
}
.pos-inv-card__customer {
    margin: 2px 0 0;
    font-size: 10px;
    color: rgba(255, 255, 255, 0.4);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 320px;
}
.pos-inv-card__aside {
    text-align: end;
    flex-shrink: 0;
}
.pos-inv-card__amount {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 800;
    color: #f59e0b;
}
.pos-inv-card__date {
    margin: 2px 0 0;
    font-size: 10px;
    color: rgba(255, 255, 255, 0.4);
}
.pos-inv-card__pay {
    display: inline-block;
    margin-top: 2px;
    font-size: 10px;
    font-weight: 700;
}
.pos-inv-card__actions {
    display: flex;
    flex-direction: column;
    border-inline-start: 1px solid rgba(255, 255, 255, 0.08);
}
.pos-inv-action {
    flex: 1;
    min-width: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, 0.55);
    background: transparent;
    border: 0;
    text-decoration: none !important;
}
.pos-inv-action + .pos-inv-action {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.pos-inv-action:hover {
    color: #f59e0b;
    background: rgba(245, 158, 11, 0.08);
}
.pos-inv-action.pay-table-order-btn {
    color: #10b981;
}
.pos-inv-action.pay-table-order-btn:hover {
    color: #059669;
    background: rgba(16, 185, 129, 0.12);
}
.pos-inv-empty {
    border: 1px dashed rgba(255, 255, 255, 0.12);
    border-radius: 16px;
    padding: 48px 16px;
    text-align: center;
    color: rgba(255, 255, 255, 0.4);
}
.pos-inv-empty i {
    font-size: 28px;
    display: block;
    margin-bottom: 8px;
}
.pos-inv-summary-wrap,
.pos-inv-filters,
.pos-inv-type-tabs,
.pos-inv-status-pills,
.pos-inv-summary-wrap,
.pos-inv-filters,
.pos-inv-type-tabs,
.pos-inv-status-pills,
.pos-inv-pagination {
    flex-shrink: 0;
}
.pos-inv-pagination {
    display: flex;
    justify-content: flex-end;
}
.pos-inv-detail {
    border-radius: 24px !important;
    background: #11151b !important;
    border: 1px solid rgba(255, 255, 255, 0.1);
}
.pos-inv-detail .modal-header,
.pos-inv-detail .modal-footer {
    border-color: rgba(255, 255, 255, 0.08) !important;
}
.pos-inv-detail__grid {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-radius: 14px;
    background: rgba(0, 0, 0, 0.22);
    padding: 12px;
    font-size: 12px;
    margin-bottom: 12px;
}
.pos-inv-detail__totals {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.pos-inv-detail__totals > div {
    border-radius: 12px;
    background: rgba(0, 0, 0, 0.22);
    padding: 10px;
    text-align: center;
}
.pos-inv-detail__totals span {
    display: block;
    font-size: 10px;
    color: rgba(255, 255, 255, 0.45);
    margin-bottom: 4px;
}
.pos-inv-detail__totals strong {
    font-size: 13px;
}
.pos-inv-item-img {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    object-fit: cover;
    flex-shrink: 0;
}
.pos-inv-items-table td {
    vertical-align: top;
}
.pos-dinein-table-card__order-btn {
    display: block;
    width: 100%;
    background: transparent;
    border: 0;
    color: inherit;
    text-align: inherit;
    padding: 0;
    cursor: pointer;
}
.text-amber {
    color: #f59e0b !important;
}

/* ── Tracking board ── */
.pos-tracking-board {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.pos-track-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
}
.pos-track-toolbar__title {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    color: #fff;
}
.cashier-theme-light .pos-track-toolbar__title { color: #111827; }
.pos-track-toolbar__sub {
    margin: .25rem 0 0;
    font-size: .75rem;
    color: rgba(255,255,255,.5);
}
.cashier-theme-light .pos-track-toolbar__sub { color: #6b7280; }
.pos-track-refresh {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    border: 1px solid rgba(245,158,11,.25);
    background: rgba(245,158,11,.12);
    color: #f59e0b;
    border-radius: .9rem;
    padding: .55rem .9rem;
    font-size: .8rem;
    font-weight: 700;
}
.pos-track-filters {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: .75rem;
}
.pos-track-filter > span {
    display: block;
    font-size: 10px;
    font-weight: 700;
    color: rgba(255,255,255,.45);
    margin-bottom: .35rem;
}
.cashier-theme-light .pos-track-filter > span { color: #6b7280; }
.pos-track-pills {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}
.pos-track-pill {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .4rem .75rem;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.1);
    color: rgba(255,255,255,.7);
    font-size: .75rem;
    font-weight: 600;
    text-decoration: none !important;
}
.cashier-theme-light .pos-track-pill {
    border-color: #e5e7eb;
    color: #4b5563;
    background: #fff;
}
.pos-track-pill.is-active {
    background: rgba(245,158,11,.18);
    border-color: rgba(245,158,11,.4);
    color: #f59e0b;
}
.pos-track-pill span {
    opacity: .75;
}
.pos-track-grid {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: .9rem;
}
@media (min-width: 768px) {
    .pos-track-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1200px) {
    .pos-track-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.pos-track-card {
    border: 1px solid rgba(255,255,255,.08);
    background: #11151b;
    border-radius: 1rem;
    padding: 1rem;
}
.cashier-theme-light .pos-track-card {
    background: #fff;
    border-color: #e5e7eb;
}
.pos-track-card__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: .5rem;
    margin-bottom: .65rem;
}
.pos-track-card__title {
    margin: 0;
    font-size: .95rem;
    font-weight: 700;
    color: #fff;
}
.cashier-theme-light .pos-track-card__title { color: #111827; }
.pos-track-status {
    font-size: 10px;
    font-weight: 700;
    padding: .25rem .5rem;
    border-radius: .45rem;
}
.pos-track-status--amber { background: rgba(245,158,11,.15); color: #f59e0b; }
.pos-track-status--blue { background: rgba(59,130,246,.15); color: #60a5fa; }
.pos-track-status--success { background: rgba(16,185,129,.15); color: #34d399; }
.pos-track-status--info { background: rgba(99,102,241,.15); color: #a5b4fc; }
.pos-track-card__meta p {
    margin: 0 0 .35rem;
    font-size: .78rem;
    color: rgba(255,255,255,.55);
    display: flex;
    align-items: center;
    gap: .35rem;
}
.cashier-theme-light .pos-track-card__meta p { color: #6b7280; }
.pos-track-card__amount {
    font-weight: 700 !important;
    color: #f59e0b !important;
}
.pos-track-card__actions {
    display: flex;
    gap: .5rem;
    margin-top: .85rem;
}
.pos-track-btn {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    border-radius: .7rem;
    padding: .55rem .7rem;
    font-size: .75rem;
    font-weight: 700;
    text-decoration: none !important;
}
.pos-track-btn--ghost {
    border: 1px solid rgba(255,255,255,.12);
    color: rgba(255,255,255,.8);
}
.cashier-theme-light .pos-track-btn--ghost {
    border-color: #e5e7eb;
    color: #374151;
}
.pos-track-btn--amber {
    background: #fbbf24;
    color: #111 !important;
}
.pos-track-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 3rem 1rem;
    color: rgba(255,255,255,.4);
}
.cashier-theme-light .pos-track-empty { color: #9ca3af; }
.pos-track-empty > i {
    font-size: 2rem;
    display: block;
    margin-bottom: .5rem;
}

/* ── Daily close board ── */
.pos-daily-close {
    max-width: 42rem;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: .85rem;
}
.pos-close-branch-switch {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: .75rem;
}
.pos-close-branch-switch label > span {
    display: block;
    font-size: 10px;
    font-weight: 700;
    color: rgba(255,255,255,.45);
    margin-bottom: .3rem;
}
.pos-close-link {
    color: #f59e0b;
    font-size: .8rem;
    font-weight: 700;
}
.pos-close-panel {
    border: 1px solid rgba(255,255,255,.08);
    background: #11151b;
    border-radius: 1.1rem;
    padding: 1.1rem;
}
.cashier-theme-light .pos-close-panel {
    background: #11151b;
    border-color: rgba(255,255,255,.08);
}
.pos-close-panel__title {
    margin: 0 0 .75rem;
    font-size: .85rem;
    font-weight: 700;
    color: #fff;
    display: flex;
    align-items: center;
    gap: .4rem;
}
.cashier-theme-light .pos-close-panel__title { color: #fff; }
.pos-close-open-wrap {
    min-height: 55vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.pos-close-open-card {
    width: 100%;
    max-width: 24rem;
    text-align: center;
}
.pos-close-open-icon {
    width: 4rem;
    height: 4rem;
    margin: 0 auto .75rem;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(245,158,11,.12);
    color: #f59e0b;
    font-size: 1.75rem;
}
.pos-close-open-card h2 {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
    color: #fff;
}
.cashier-theme-light .pos-close-open-card h2 { color: #fff; }
.pos-close-open-card > p {
    margin: .4rem 0 1rem;
    font-size: .75rem;
    color: rgba(255,255,255,.5);
}
.pos-close-open-form,
.pos-close-movement-form {
    display: grid;
    gap: .75rem;
    text-align: start;
}
.pos-close-open-form label > span,
.pos-close-movement-form label > span {
    display: block;
    font-size: 10px;
    font-weight: 700;
    color: rgba(255,255,255,.45);
    margin-bottom: .3rem;
}
.pos-close-input-lg {
    text-align: center;
    font-size: 1.15rem !important;
    font-weight: 700;
}
.pos-close-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    width: 100%;
    border: none;
    border-radius: .9rem;
    padding: .8rem 1rem;
    font-size: .85rem;
    font-weight: 700;
}
.pos-close-btn--amber {
    background: #f59e0b;
    color: #111;
}
.pos-close-btn--cash-in {
    border: 1px solid rgba(16,185,129,.25);
    background: rgba(16,185,129,.12);
    color: #34d399;
}
.pos-close-btn--ghost {
    border: 1px solid rgba(255,255,255,.12);
    background: transparent;
    color: #fff;
}
.cashier-theme-light .pos-close-btn--ghost {
    border-color: rgba(255,255,255,.16);
    color: rgba(255,255,255,.85);
    background: rgba(255,255,255,.06);
}
.pos-close-btn--danger {
    background: #ef4444;
    color: #fff;
}
.pos-close-status-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    color: #fff;
}
.cashier-theme-light .pos-close-status-row { color: #fff; }
.pos-close-muted {
    font-size: 10px;
    color: rgba(255,255,255,.45);
}
.cashier-theme-light .pos-close-muted { color: rgba(255,255,255,.55); }
.pos-close-kpi-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .5rem;
    margin-top: .85rem;
}
.pos-close-kpi {
    border-radius: .85rem;
    padding: .65rem;
    text-align: center;
    background: rgba(0,0,0,.22);
}
.cashier-theme-light .pos-close-kpi { background: rgba(255,255,255,.06); }
.pos-close-kpi span {
    display: block;
    font-size: 10px;
    color: rgba(255,255,255,.45);
    margin-bottom: .2rem;
}
.cashier-theme-light .pos-close-kpi span { color: rgba(255,255,255,.55); }
.pos-close-kpi strong {
    font-size: .85rem;
    color: #fff;
}
.cashier-theme-light .pos-close-kpi strong { color: #fff; }
.pos-close-history {
    max-height: 10rem;
    overflow: auto;
    display: flex;
    flex-direction: column;
    gap: .35rem;
}
.pos-close-history__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .5rem;
    border-radius: .7rem;
    padding: .45rem .65rem;
    font-size: 10px;
    background: rgba(0,0,0,.22);
    color: rgba(255,255,255,.65);
}
.cashier-theme-light .pos-close-history__row {
    background: rgba(0,0,0,.22);
    color: rgba(255,255,255,.75);
}
.pos-close-lock-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: .75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(245,158,11,.12);
    color: #f59e0b;
}
.pos-close-sales-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .6rem;
}
.pos-close-sales-card {
    border-radius: .9rem;
    border: 1px solid transparent;
    padding: .85rem;
    text-align: center;
}
.pos-close-sales-card > i {
    display: block;
    font-size: 1.2rem;
    margin-bottom: .25rem;
}
.pos-close-sales-card span {
    display: block;
    font-size: 10px;
    margin-bottom: .2rem;
}
.pos-close-sales-card--cash {
    border-color: rgba(16,185,129,.25);
    background: rgba(16,185,129,.08);
    color: #34d399;
}
.pos-close-sales-card--card {
    border-color: rgba(59,130,246,.25);
    background: rgba(59,130,246,.08);
    color: #60a5fa;
}
.pos-close-sales-card strong {
    font-size: 1.05rem;
}
.pos-close-action-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .75rem;
    margin: .85rem 0 1rem;
}
@media (max-width: 640px) {
    .pos-close-action-row { grid-template-columns: 1fr; }
}
.pos-close-btn--cash-out {
    background: rgba(239, 68, 68, .12);
    color: #f87171;
    border: 1px solid rgba(239, 68, 68, .25);
}
.cashier-theme-light .pos-close-btn--cash-out {
    background: rgba(239, 68, 68, .12);
    color: #f87171;
}
.pos-close-summary-rows {
    display: grid;
    gap: .45rem;
}
.pos-close-summary-row {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .55rem .7rem;
    border-radius: .75rem;
    background: rgba(255,255,255,.04);
    color: rgba(255,255,255,.78);
}
.cashier-theme-light .pos-close-summary-row {
    background: rgba(255,255,255,.04);
    color: rgba(255,255,255,.85);
}
.pos-close-preview {
    border: 1px solid rgba(245, 158, 11, .28);
    border-radius: 1rem;
    padding: .9rem;
    background: rgba(245, 158, 11, .08);
}
.cashier-theme-light .pos-close-preview {
    background: rgba(245, 158, 11, .08);
    border-color: rgba(245, 158, 11, .28);
}
.pos-close-preview__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .55rem;
}
.pos-close-preview__grid > div {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    padding: .55rem .65rem;
    border-radius: .7rem;
    background: rgba(0,0,0,.18);
}
.cashier-theme-light .pos-close-preview__grid > div { background: rgba(0,0,0,.22); }
.pos-close-preview__grid span {
    font-size: .72rem;
    color: rgba(255,255,255,.55);
}
.cashier-theme-light .pos-close-preview__grid span { color: rgba(255,255,255,.6); }
.pos-close-preview__diff {
    margin-top: .75rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .7rem .8rem;
    border-radius: .8rem;
    font-weight: 800;
}
.pos-close-preview__diff.is-ok { background: rgba(16,185,129,.15); color: #34d399; }
.pos-close-preview__diff.is-over { background: rgba(59,130,246,.15); color: #60a5fa; }
.pos-close-preview__diff.is-short { background: rgba(239,68,68,.15); color: #f87171; }
.pos-close-preview__warnings {
    margin-top: .75rem;
    padding: .7rem .8rem;
    border-radius: .8rem;
    background: rgba(245,158,11,.12);
    color: #fbbf24;
}
.pos-close-preview__warnings ul {
    margin: .4rem 0 0;
    padding-inline-start: 1.1rem;
}
#pos-cash-in-modal .modal-dialog {
    pointer-events: auto;
}
.pos-close-modal {
    border-radius: 1.1rem;
    overflow: hidden;
    background: #121212 !important;
    color: #fff !important;
}
#pos-cash-in-modal .modal-content {
    background: #121212 !important;
    color: #fff !important;
}
#pos-cash-in-modal .modal-header,
#pos-cash-in-modal .modal-footer {
    border-color: rgba(255, 255, 255, 0.1) !important;
}
#pos-cash-in-modal .form-label,
#pos-cash-in-modal .modal-title,
#pos-cash-in-modal label {
    color: rgba(255, 255, 255, 0.9) !important;
}
#pos-cash-in-modal .form-control,
#pos-cash-in-modal select.form-control,
#pos-cash-in-modal textarea.form-control {
    background: #1A1A1A !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    color: #F5F5F5 !important;
}
#pos-cash-in-modal .form-control:focus {
    border-color: #FDB813 !important;
    box-shadow: 0 0 0 0.15rem rgba(253, 184, 19, 0.25) !important;
}
#pos-cash-in-modal .btn-success {
    background: #FDB813 !important;
    border-color: #FDB813 !important;
    color: #0A0A0A !important;
    font-weight: 800;
}
#pos-cash-in-modal .btn-success:hover,
#pos-cash-in-modal .btn-success:focus {
    background: #E5A100 !important;
    border-color: #E5A100 !important;
    color: #0A0A0A !important;
}
#pos-cash-in-modal .btn-secondary {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: rgba(255, 255, 255, 0.85) !important;
}
#pos-cash-in-modal .close,
#pos-cash-in-modal .close span {
    color: #fff !important;
    opacity: 0.85;
    text-shadow: none;
}
.pos-daily-close .text-amber { color: #f59e0b !important; }

/* ── Open day modal (CashierDayStatusModal) ── */
.cashier-day-modal .modal-dialog { max-width: 24rem; }
.cashier-day-modal__content {
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 1.5rem;
    background: #111827;
    color: #fff;
    overflow: hidden;
}
.cashier-theme-light .cashier-day-modal__content {
    background: #fff;
    border-color: #e5e7eb;
    color: #111827;
}
.cashier-day-modal__body { padding: 2rem 1.75rem; text-align: center; }
.cashier-day-modal__title {
    margin: 0 0 1.25rem;
    font-size: 1.4rem;
    font-weight: 800;
}
.cashier-day-modal__label {
    display: block;
    text-align: start;
    font-size: .8rem;
    color: rgba(255,255,255,.55);
    margin-bottom: .45rem;
}
.cashier-theme-light .cashier-day-modal__label { color: #6b7280; }
.cashier-day-modal__input-wrap {
    position: relative;
    margin-bottom: 1.25rem;
}
.cashier-day-modal__input-wrap > i {
    position: absolute;
    right: .85rem;
    top: 50%;
    transform: translateY(-50%);
    color: #f59e0b;
}
.cashier-day-modal__input {
    width: 100%;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.05);
    color: #fff;
    border-radius: .9rem;
    padding: .85rem 2.5rem .85rem 1rem;
    font-weight: 700;
    font-size: 1.05rem;
    text-align: center;
}
.cashier-theme-light .cashier-day-modal__input {
    background: #f9fafb;
    border-color: #e5e7eb;
    color: #111827;
}
.cashier-day-modal__actions { display: grid; gap: .65rem; }
.cashier-day-modal__btn {
    width: 100%;
    border: none;
    border-radius: .9rem;
    padding: .85rem 1rem;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
}
.cashier-day-modal__btn--open { background: #22c55e; color: #fff; }
.cashier-day-modal__btn--skip {
    background: rgba(255,255,255,.1);
    color: #fff;
}
.cashier-theme-light .cashier-day-modal__btn--skip {
    background: #f3f4f6;
    color: #111827;
}

/* ── Thermal receipts ── */
.thermal-receipt,
.kitchen-receipt,
.kitchen-ticket {
    width: 80mm;
    max-width: 80mm;
    margin: 0 auto;
    background: #fff !important;
    color: #000 !important;
    font-family: 'Courier New', Tahoma, monospace;
    padding: 3mm 5mm 4mm;
    /* Extra inset on the left (inline-end in RTL) so qty/totals are not clipped by the printer */
    padding-inline-start: 5mm;
    padding-inline-end: 9mm;
    box-sizing: border-box;
    line-height: 1.4;
    font-size: 15px;
    font-weight: bold;
    overflow: visible;
}

.thermal-top { text-align: center; }
.thermal-logo { max-width: 42mm; max-height: 22mm; object-fit: contain; margin: 0 auto 1mm; }
.thermal-store { text-align: center; font-size: 19px; font-weight: 900; }
.thermal-tagline { text-align: center; font-size: 13px; margin-bottom: 1mm; font-weight: bold; }
.thermal-sep { border-top: 1px dashed #000; margin: 1.5mm 0; }
.thermal-sep-solid { border-top: 2px solid #000; margin: 1.5mm 0; }
.thermal-invoice-no { text-align: center; font-size: 22px; font-weight: 900; letter-spacing: 1px; direction: ltr; }
.thermal-invoice-title {
    text-align: center;
    font-size: 15px;
    font-weight: 900;
    margin: 1.5mm 0;
    padding: 1.5mm 2mm;
    border: 2px solid #000;
    background: #fff8d6;
}
.thermal-copy-badge {
    text-align: center;
    font-size: 12px;
    font-weight: 900;
    margin: 1mm 0 2mm;
    letter-spacing: .4px;
}
.thermal-header { display: flex; justify-content: space-between; font-size: 13px; font-weight: 700; gap: 2mm; }
.thermal-table { width: 100%; border-collapse: collapse; }
.thermal-table th,
.thermal-table td { padding: 1.2mm 1mm; vertical-align: top; font-size: 14px; font-weight: bold; }
.thermal-table th:nth-child(2),
.thermal-table td:nth-child(2) { text-align: center; white-space: nowrap; width: 10mm; min-width: 10mm; }
.thermal-table th:nth-child(3),
.thermal-table td:nth-child(3),
.thermal-table th:nth-child(4),
.thermal-table td:nth-child(4) { text-align: center; white-space: nowrap; width: 14mm; }
.thermal-table .item-note { display: block; font-size: 13px; font-weight: 700; margin-top: .4mm; padding-inline-start: 2mm; }
.thermal-table .item-addon { font-size: 13px; font-weight: 700; padding-inline-start: 2mm; }
.thermal-table .item-removed {
    font-size: 13px;
    font-weight: 700;
    color: #991b1b;
    white-space: normal;
    padding-inline-start: 2mm;
}
.thermal-item-sep-row td {
    padding: 2mm 0 !important;
    line-height: 0;
    height: auto;
}
.thermal-item-sep {
    display: block;
    width: 100%;
    border-top: 2px dashed #000;
    height: 0;
    margin: 0;
}
.thermal-total-row,
.thermal-grand-total,
.thermal-info-row {
    display: flex;
    justify-content: space-between;
    gap: 2mm;
    font-size: 14px;
    font-weight: 700;
    margin: .8mm 0;
}
.thermal-grand-total { font-size: 17px; font-weight: 900; }
.thermal-info { margin-top: 1mm; }
.thermal-info-val { text-align: left; max-width: 48mm; }
.thermal-thanks { text-align: center; font-weight: 900; margin-top: 2mm; font-size: 15px; }

.kitchen-header { text-align: center; font-size: 20px; font-weight: 900; margin-bottom: 1mm; }
.kitchen-subheader { text-align: center; font-size: 15px; font-weight: 700; }
.kitchen-time { text-align: center; font-size: 13px; font-weight: 700; margin-bottom: 2mm; }
.kitchen-sep { border-top: 2px solid #000; margin: 1.5mm 0; }
.kitchen-invoice { text-align: center; font-size: 26px; font-weight: 900; letter-spacing: 2px; direction: ltr; }
.kitchen-item-block {
    padding: 1.2mm 0 2.2mm;
    margin-bottom: 1.2mm;
    border-bottom: 2px dashed #000;
}
.kitchen-item-block:last-child {
    border-bottom: 0;
    margin-bottom: 0;
    padding-bottom: 0.5mm;
}
.kitchen-item {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 4mm;
    padding: 0.6mm 0 0.8mm;
    border-bottom: 0;
}
.kitchen-item-name { flex: 1; font-size: 16px; font-weight: 900; line-height: 1.35; }
.kitchen-item-qty {
    flex: 0 0 auto;
    min-width: 10mm;
    font-size: 20px;
    font-weight: 900;
    text-align: center;
    white-space: nowrap;
    padding: 0 2mm;
    line-height: 1.2;
}
.kitchen-mod {
    font-size: 14px;
    font-weight: 700;
    margin: 0.5mm 0;
    padding-inline-start: 2mm;
    line-height: 1.35;
}
.kitchen-mod--add { color: #166534; }
.kitchen-mod--remove { color: #991b1b; }
.kitchen-item-note { font-size: 14px; font-weight: 700; margin: .4mm 0 1mm; }
.kitchen-note-box { border: 1px dashed #000; padding: 1mm; font-size: 13px; font-weight: 700; margin-top: 1mm; }
.kitchen-footer { text-align: center; font-size: 14px; font-weight: 700; margin-top: 2mm; }

.kitchen-ticket__brand { text-align: center; border-bottom: 2px dashed #000; padding-bottom: 2mm; margin-bottom: 2mm; }
.kitchen-ticket__brand h2 { margin: 0; font-size: 18px; font-weight: 900; }
.kitchen-ticket__brand p { margin: 1mm 0 0; font-size: 11px; color: #666; }
.kitchen-ticket__type {
    text-align: center;
    font-weight: 900;
    font-size: 15px;
    border: 2px solid #000;
    padding: 1.5mm 2mm;
    margin: 0 auto 2mm;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
}
.kitchen-ticket__type--addition { border-color: #16a34a; color: #16a34a; }
.kitchen-ticket__type--cancellation { border-color: #dc2626; color: #dc2626; }
.kitchen-ticket__type--modification { border-color: #d97706; color: #d97706; }
.kitchen-ticket__meta { width: 100%; font-size: 13px; margin-bottom: 2mm; }
.kitchen-ticket__meta td { padding: .6mm 0; }
.kitchen-ticket__meta td:last-child { text-align: left; direction: ltr; }
.kitchen-ticket__items { width: 100%; border-top: 1px dashed #000; font-size: 14px; border-collapse: collapse; }
.kitchen-ticket__items th,
.kitchen-ticket__items td { padding: 1.6mm 1.2mm; vertical-align: top; }
.kitchen-ticket__items th:first-child,
.kitchen-ticket__items td:first-child { width: 12mm; min-width: 12mm; text-align: center; font-size: 16px; font-weight: 900; white-space: nowrap; }
.kitchen-ticket__items tbody tr { border-bottom: 2px dashed #000; }
.kitchen-ticket__items tbody tr:last-child { border-bottom: 0; }
.kitchen-ticket__note { font-size: 13px; color: #111; font-style: normal; font-weight: 700; margin-top: 0.8mm; }
.kitchen-ticket__footer { border-top: 2px dashed #000; margin-top: 2mm; padding-top: 2mm; text-align: center; font-size: 12px; color: #666; }

@media print {
    @page { size: 80mm auto; margin: 0 0 0 2mm; }
    html, body {
        width: 80mm !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #fff !important;
    }
    body * { visibility: hidden !important; }
    .print-invoice-wrapper,
    .print-invoice-wrapper *,
    .thermal-receipt, .thermal-receipt *,
    .kitchen-receipt, .kitchen-receipt *,
    .kitchen-ticket, .kitchen-ticket * {
        visibility: visible !important;
    }
    #pos-cart-invoice-sample,
    #pos-cart-invoice-sample *,
    #pos-invoice-sample-modal,
    #pos-invoice-sample-modal * {
        visibility: hidden !important;
        display: none !important;
    }
    .thermal-receipt,
    .kitchen-receipt,
    .kitchen-ticket {
        position: static !important;
        left: auto !important;
        top: auto !important;
        width: 80mm !important;
        max-width: 80mm !important;
        margin: 0 !important;
        padding: 3mm 5mm 4mm !important;
        padding-inline-start: 5mm !important;
        padding-inline-end: 9mm !important;
        background: #fff !important;
        color: #000 !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
        overflow: visible !important;
    }
    .kitchen-item { display: flex !important; }
    .kitchen-item-qty { flex-shrink: 0 !important; }
    .non-printable { display: none !important; }
}

/* ── POS Resize Toggle Bar ── */
.pos-resize-bar {
    display: flex;
    gap: 6px;
    padding: 6px 12px;
    margin-bottom: 6px;
}
.pos-resize-btn {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.7);
    padding: 4px 12px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.82rem;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.pos-resize-btn:hover {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}
.pos-resize-btn.active {
    background: rgba(245, 158, 11, 0.2);
    border-color: rgba(245, 158, 11, 0.4);
    color: #f59e0b;
}

/* Collapsed states */
.pos-cart-panel.collapsed {
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    padding: 0 !important;
    opacity: 0;
    overflow: hidden;
    border: none !important;
}
#pos-cart-col.d-none {
    display: none !important;
}
.pos-menu-search.d-none {
    display: none !important;
}
#pos-cart-col.d-none ~ .pos-main-resize-bar {
    display: none !important;
}

.pos-menu-panel .d-flex.collapsed-categories > .pos-vertical-categories-wrap {
    width: 0 !important;
    min-width: 0 !important;
    padding: 0 !important;
    opacity: 0;
    overflow: hidden;
    border: none !important;
}
.pos-menu-panel .d-flex.collapsed-categories > .pos-inner-resize-bar {
    width: 0 !important;
    min-width: 0 !important;
    padding: 0 !important;
    opacity: 0;
}
.pos-menu-panel .d-flex.collapsed-categories > .pos-vertical-products-wrap {
    width: 100% !important;
    flex: 1 1 100% !important;
}

.pos-vertical-categories-wrap,
.pos-vertical-products-wrap {
    transition: width 0.3s ease, opacity 0.3s ease, padding 0.3s ease, flex 0.3s ease;
}

/* ===== Draggable Resize Bars ===== */
.pos-main-resize-bar,
.pos-inner-resize-bar {
    width: 6px;
    cursor: col-resize;
    background: rgba(255, 255, 255, 0.06);
    flex-shrink: 0;
    position: relative;
    z-index: 10;
    transition: background 0.2s ease;
}
.pos-main-resize-bar:hover,
.pos-inner-resize-bar:hover {
    background: rgba(245, 158, 11, 0.35);
}
.pos-main-resize-bar::after,
.pos-inner-resize-bar::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 2px;
    height: 40px;
    border-radius: 1px;
    background: rgba(255, 255, 255, 0.18);
}
.pos-main-resize-bar:hover::after,
.pos-inner-resize-bar:hover::after {
    background: rgba(245, 158, 11, 0.7);
    height: 60px;
}
body.pos-resizing {
    cursor: col-resize !important;
    user-select: none;
    -webkit-user-select: none;
}
body.pos-resizing iframe,
body.pos-resizing object,
body.pos-resizing embed {
    pointer-events: none;
}

/* ===== POS Slider Styles ===== */
.pos-resize-slider {
    width: 100%;
    height: 6px;
    -webkit-appearance: none;
    appearance: none;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 3px;
    outline: none;
}
.pos-resize-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #f59e0b;
    cursor: pointer;
    border: 2px solid rgba(255, 255, 255, 0.2);
    transition: transform 0.15s ease;
}
.pos-resize-slider::-webkit-slider-thumb:hover {
    transform: scale(1.2);
}
.pos-resize-slider::-moz-range-thumb {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #f59e0b;
    cursor: pointer;
    border: 2px solid rgba(255, 255, 255, 0.2);
}

/* ===== POS Flex Layout (replaces Bootstrap grid for resizable) ===== */
.pos-layout-row {
    flex-wrap: nowrap !important;
}
.pos-menu-col,
.pos-cart-col {
    transition: flex 0.15s ease, max-width 0.15s ease;
}

/* ===================================================================
   COMPREHENSIVE DARK THEME — Fix invisible text on all admin pages
   =================================================================== */

/* DataTables — ensure dark background + visible text */
.dataTables_wrapper,
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate,
.dataTables_wrapper .dataTables_processing {
    color: var(--brand-text) !important;
}

.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
    background-color: var(--brand-card) !important;
    border: 1px solid rgba(253, 184, 19, 0.18) !important;
    color: var(--brand-text-on-dark) !important;
    border-radius: 8px !important;
    padding: 4px 10px !important;
}

.dataTables_wrapper .dataTables_filter input:focus,
.dataTables_wrapper .dataTables_length select:focus {
    border-color: var(--brand-gold) !important;
    box-shadow: 0 0 0 0.15rem rgba(253, 184, 19, 0.2) !important;
    outline: none !important;
}

.dataTables_wrapper .dataTables_filter input::placeholder {
    color: var(--brand-muted-on-dark) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    color: var(--brand-text) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    background: var(--brand-card) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: var(--brand-violet-soft) !important;
    color: #fff !important;
    border-color: var(--brand-gold) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: var(--brand-gold) !important;
    color: #0A0A0A !important;
    border-color: var(--brand-gold) !important;
    font-weight: 800;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
    color: rgba(255,255,255,0.3) !important;
    background: transparent !important;
    border-color: transparent !important;
}

/* All tables — override any white backgrounds */
.table,
.table-bordered,
table.dataTable {
    background: transparent !important;
}

.table > tbody > tr,
.table > thead > tr,
.table-bordered > tbody > tr,
table.dataTable tbody tr {
    background-color: transparent !important;
}

.table > tbody > tr:nth-child(odd),
.table-bordered > tbody > tr:nth-child(odd) {
    background-color: rgba(255,255,255,0.02) !important;
}

.table > tbody > tr > td,
.table > tbody > tr > th,
.table-bordered > tbody > tr > td,
table.dataTable tbody td {
    color: var(--brand-text) !important;
    border-color: rgba(255,255,255,0.08) !important;
    vertical-align: middle !important;
}

.table > thead > tr > th,
.table-bordered > thead > tr > th,
table.dataTable thead th {
    color: var(--brand-text-on-dark) !important;
    border-color: rgba(255,255,255,0.08) !important;
}

.table-hover > tbody > tr:hover,
table.dataTable tbody tr:hover {
    background-color: rgba(253, 184, 19, 0.06) !important;
}

/* Cards — enforce dark on any white card */
.card,
.card-body,
.card-header,
.card-footer {
    background-color: var(--brand-card) !important;
    color: var(--brand-text) !important;
    border-color: rgba(255,255,255,0.08) !important;
}

.card-header {
    border-bottom-color: rgba(255,255,255,0.08) !important;
}

.card-title,
.card-text,
.card-body .card-title,
.card-body h5,
.card-body h4,
.card-body h3 {
    color: var(--brand-text-on-dark) !important;
}

/* Page content area */
.content,
.content .card-body,
.content .card-footer {
    color: var(--brand-text) !important;
}

/* Badge / tag text contrast */
.badge-dark,
.badge-secondary,
.badge-light {
    color: var(--brand-text-on-dark) !important;
    background: rgba(255,255,255,0.1) !important;
}

/* Pagination */
.page-link {
    background: var(--brand-card) !important;
    border-color: rgba(255,255,255,0.08) !important;
    color: var(--brand-text) !important;
}
.page-item.active .page-link {
    background: var(--brand-gold) !important;
    border-color: var(--brand-gold) !important;
    color: #0A0A0A !important;
}
.page-link:hover {
    background: var(--brand-violet-soft) !important;
    color: #fff !important;
}

/* Alert / notification boxes */
.alert {
    border: 1px solid rgba(255,255,255,0.1) !important;
    color: var(--brand-text) !important;
}

/* Text utility overrides — always ensure readability */
.text-dark { color: var(--brand-text-on-dark) !important; }
.text-body { color: var(--brand-text) !important; }
.text-muted { color: var(--brand-muted-on-dark) !important; }

/* Modal backdrop — ensure dark overlay */
.modal-backdrop {
    background-color: rgba(0, 0, 0, 0.7) !important;
    z-index: 9998 !important;
}
.modal {
    z-index: 9999 !important;
}
.modal.show .modal-dialog {
    z-index: 10000 !important;
}

/* hr */
hr {
    border-color: rgba(255,255,255,0.08) !important;
}

/* Sidebar arrow (caret chevron for expandable menu items) */
.navbar-vertical-aside-has-menu > .nav-link-toggle::after {
    background: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='%23FDB813' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.72,15.78a.75.75,0,0,1-.53.22h-.38a.77.77,0,0,1-.53-.22L6.15,10.64a.5.5,0,0,1,0-.71l.71-.71a.49.49,0,0,1,.7,0L12,13.67l4.44-4.45a.5.5,0,0,1,.71,0l.7.71a.5.5,0,0,1,0,.71Z'/%3E%3C/svg%3E") no-repeat right center/1rem 1rem !important;
}

/* Sidebar dot indicator */
.navbar-vertical-aside-has-menu > .nav-link-toggle::before {
    background-color: rgba(253, 184, 19, 0.4) !important;
}
.navbar-vertical-aside .navbar-vertical-aside-has-menu.show > .nav-link-toggle::before,
.navbar-vertical-aside .navbar-vertical-aside-has-menu > .nav-link-toggle.active::before,
.navbar-vertical-aside .navbar-vertical-aside-has-menu > .nav-link-toggle:hover::before {
    background-color: #FDB813 !important;
}

/* ===================================================================
   DARK THEME — Force dark backgrounds on white Bootstrap elements
   =================================================================== */

/* Common list and chart legends */
.common-list,
.common-list li,
.common-list li h5,
.common-list li p,
.common-list li span,
.apex-legends,
.apex-legends span,
.apex-legends div {
    color: var(--brand-text) !important;
    background: transparent !important;
}

/* Cards and panels — dark, never white */
.card,
.card-body,
.card-header,
.card-footer,
.list-group,
.list-group-item,
.tab-content,
.tab-pane,
.popover,
.popover-body,
.toast,
.toast-body,
.jumbotron,
.well,
.panel,
.panel-body,
.panel-heading,
.panel-footer,
.media-body,
.feedback-list,
.section {
    background-color: var(--brand-card) !important;
    color: var(--brand-text) !important;
}

/* DO NOT touch modal-content/body/header/footer — they need solid backgrounds */

/* Background color utilities from Bootstrap that keep white */
.bg-white,
.bg-light,
.bg-default,
.bg-gray-100,
.bg-gray-50,
.bg-gradient-light {
    background-color: var(--brand-card) !important;
    color: var(--brand-text) !important;
}

/* Specifically target any element with inline white background via style attribute */
*[style*="background-color: white"],
*[style*="background-color: #fff"],
*[style*="background-color: #ffffff"],
*[style*="background: white"],
*[style*="background: #fff"],
*[style*="background: #ffffff"] {
    background: var(--brand-card) !important;
    background-color: var(--brand-card) !important;
    color: var(--brand-text) !important;
}

/* Branch product management */
.tf-product-page {
    padding-bottom: 2.5rem;
}
.tf-product-hero {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.25rem;
    padding: 1.25rem 1.4rem;
    border: 1px solid var(--brand-card-border);
    border-radius: 18px;
    background:
        radial-gradient(1200px 180px at 100% 0%, rgba(253, 184, 19, 0.12), transparent 55%),
        var(--brand-card);
}
.tf-product-hero__eyebrow {
    display: block;
    color: var(--brand-gold);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    margin-bottom: 0.25rem;
}
.tf-product-hero__title {
    margin: 0;
    font-size: 1.55rem;
    font-weight: 800;
    color: #fff;
}
.tf-product-hero__hint {
    margin: 0.35rem 0 0;
    color: var(--brand-muted-on-dark);
    font-size: 0.92rem;
    max-width: 42rem;
}
.tf-product-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}
.tf-btn-ghost {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(253, 184, 19, 0.35) !important;
    color: #FDB813 !important;
    font-weight: 700;
}
.tf-btn-ghost:hover {
    background: var(--brand-gold-soft) !important;
    color: #fff !important;
}
.tf-product-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem;
    margin-bottom: 1rem;
}
.tf-product-toolbar__count {
    display: flex;
    align-items: baseline;
    gap: 0.45rem;
    color: var(--brand-muted-on-dark);
}
.tf-product-toolbar__count strong {
    color: var(--brand-gold);
    font-size: 1.25rem;
}
.tf-product-toolbar__form {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    flex: 1 1 420px;
    justify-content: flex-end;
}
.tf-product-select,
.tf-product-search .form-control {
    min-height: 42px;
    border-radius: 10px;
    background: #121212 !important;
    border-color: rgba(253, 184, 19, 0.2) !important;
    color: #fff !important;
}
.tf-product-select {
    max-width: 220px;
}
.tf-product-search {
    min-width: min(100%, 280px);
}
.tf-product-card {
    overflow: hidden;
    border: 1px solid var(--brand-card-border) !important;
    border-radius: 16px !important;
}
.tf-product-table thead th {
    background: rgba(253, 184, 19, 0.08) !important;
    color: var(--brand-gold) !important;
    font-weight: 700;
    border: 0 !important;
    white-space: nowrap;
}
.tf-product-table tbody tr:hover {
    background: rgba(253, 184, 19, 0.05);
}
.tf-product-sl {
    color: var(--brand-muted-on-dark);
    font-weight: 700;
}
.tf-product-identity {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 220px;
}
.tf-product-identity img {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    object-fit: cover;
    border: 1px solid rgba(253, 184, 19, 0.2);
}
.tf-product-name {
    display: block;
    color: #fff !important;
    font-weight: 700;
}
.tf-product-id {
    color: var(--brand-muted-on-dark);
    font-size: 0.78rem;
}
.tf-product-cat {
    display: inline-flex;
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    background: rgba(253, 184, 19, 0.12);
    color: var(--brand-gold);
    font-size: 0.8rem;
    font-weight: 700;
}
.tf-product-price {
    font-weight: 800;
    color: #fff;
}
.tf-product-stock {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    color: var(--brand-muted-on-dark);
    font-size: 0.82rem;
}
.tf-product-actions {
    display: flex;
    justify-content: center;
    gap: 0.35rem;
}
.tf-icon-btn {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #fff !important;
    background: rgba(255, 255, 255, 0.04);
}
.tf-icon-btn:hover {
    border-color: var(--brand-gold);
    color: var(--brand-gold) !important;
}
.tf-icon-btn--gold {
    background: var(--brand-gold);
    border-color: var(--brand-gold);
    color: #0A0A0A !important;
}
.tf-icon-btn--gold:hover {
    background: var(--brand-gold-dark);
    color: #fff !important;
}
.tf-product-empty {
    text-align: center;
    padding: 2.5rem 1rem;
}
.tf-product-empty img {
    width: 110px;
    margin-bottom: 0.75rem;
}
.tf-product-pager {
    padding: 1rem 1.25rem;
    display: flex;
    justify-content: flex-end;
}
.tf-reorder-cats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}
.tf-reorder-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.45rem 0.9rem;
    border-radius: 999px;
    border: 1px solid rgba(253, 184, 19, 0.22);
    color: var(--brand-muted-on-dark) !important;
    background: rgba(255, 255, 255, 0.03);
    font-weight: 700;
}
.tf-reorder-chip:hover,
.tf-reorder-chip.is-active {
    background: var(--brand-gold);
    border-color: var(--brand-gold);
    color: #0A0A0A !important;
}
.tf-reorder-list {
    list-style: none;
    margin: 0;
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}
.tf-reorder-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.7rem 0.85rem;
    border-radius: 14px;
    border: 1px solid rgba(253, 184, 19, 0.14);
    background: #121212;
}
.tf-reorder-item img {
    width: 46px;
    height: 46px;
    border-radius: 10px;
    object-fit: cover;
}
.tf-reorder-handle {
    cursor: grab;
    color: var(--brand-gold);
    font-size: 1.15rem;
    padding: 0.2rem;
}
.tf-reorder-index {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(253, 184, 19, 0.14);
    color: var(--brand-gold);
    font-weight: 800;
    font-size: 0.8rem;
}
.tf-reorder-meta {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}
.tf-reorder-meta strong {
    color: #fff;
}
.tf-reorder-meta span {
    color: var(--brand-muted-on-dark);
    font-size: 0.85rem;
}
.tf-reorder-ghost {
    opacity: 0.45;
}
.tf-reorder-chosen {
    border-color: var(--brand-gold) !important;
    box-shadow: 0 8px 24px rgba(253, 184, 19, 0.18);
}