/* BASU Sales/POS reference redesign — scoped to .pos-modern only. */
.pos-modern {
    --pos-navy:#07346a;
    --pos-navy-2:#052754;
    --pos-blue:#0d6efd;
    --pos-ink:#08204a;
    --pos-muted:#6f7f99;
    --pos-line:#dfe7f2;
    --pos-soft:#f6f9fd;
    --pos-success:#11843f;
    --pos-danger:#dc2626;
    --pos-shadow:0 10px 28px rgba(8,32,74,.07);
    height:calc(100dvh - 118px);
    min-height:0;
}
.pos-modern-shell {height:100%; display:flex; flex-direction:column; gap:12px;}
.pos-modern-controls {
    background:#fff; border:1px solid var(--pos-line); border-radius:16px; box-shadow:var(--pos-shadow);
    display:grid; grid-template-columns:1.05fr .9fr .95fr 1.1fr; gap:14px; padding:16px 18px; flex:0 0 auto;
}
.pos-modern-control {display:block; min-width:0;}
.pos-modern-control>span,.pos-modern-money-grid label>span,.pos-modern-override label>span {
    display:block; color:var(--pos-ink); font-size:.72rem; font-weight:850; text-transform:uppercase; letter-spacing:.025em; margin:0 0 7px 2px;
}
.pos-modern-input-wrap {position:relative;}
.pos-modern-input-wrap>i {position:absolute; left:15px; top:50%; transform:translateY(-50%); z-index:2; color:#7185aa; font-size:1rem; pointer-events:none;}
.pos-modern-input-wrap .form-select,.pos-modern-input-wrap .form-control {
    min-height:52px; border:1px solid #d7e1ef; border-radius:13px; color:var(--pos-ink); background-color:#fff; box-shadow:none;
    padding-left:44px; font-size:.94rem;
}
.pos-modern-input-wrap .form-select:focus,.pos-modern-input-wrap .form-control:focus,.pos-modern-product-search .form-control:focus {
    border-color:#94b8ec; box-shadow:0 0 0 3px rgba(13,110,253,.08);
}
.pos-modern-main {display:grid; grid-template-columns:minmax(390px,.82fr) minmax(610px,1.28fr); gap:14px; flex:1 1 auto; min-height:0;}
.pos-modern-cart,.pos-modern-products {background:#fff; border:1px solid var(--pos-line); border-radius:16px; box-shadow:var(--pos-shadow); min-height:0; overflow:hidden;}
.pos-modern-cart {display:grid; grid-template-rows:auto minmax(90px,1fr) auto;}
.pos-modern-section-head {display:flex; align-items:center; justify-content:space-between; gap:12px; padding:17px 18px; border-bottom:1px solid #e6edf6;}
.pos-modern-title {display:flex; align-items:center; gap:12px; min-width:0;}
.pos-modern-title-icon {width:38px; height:38px; display:grid; place-items:center; border-radius:12px; background:#eef5ff; color:var(--pos-navy); font-size:1.15rem; flex:0 0 auto;}
.pos-modern-title h2 {font-size:1.05rem; line-height:1.2; color:var(--pos-ink); font-weight:900; margin:0;}
.pos-modern-title small {display:block; color:var(--pos-muted); font-size:.72rem; margin-top:2px;}
.pos-modern-count {background:#edf7ff; color:#0873c8; border-radius:999px; padding:8px 12px; font-size:.82rem; font-weight:850; white-space:nowrap;}
.pos-modern-cart-list {position:relative; overflow:auto; padding:0 14px; min-height:0;}
.pos-modern-cart-table {margin:0; font-size:.83rem;}
.pos-modern-cart-table thead {position:sticky; top:0; z-index:2; background:#f8fbff;}
.pos-modern-cart-table thead th {height:42px; padding:10px 8px; color:#637490; border-bottom:1px solid #e2e9f3; font-size:.68rem; font-weight:850; letter-spacing:.025em;}
.pos-modern-cart-table td {padding:9px 8px; border-color:#edf2f7;}
.pos-modern-cart-table .cart-item-title {font-size:.8rem; max-width:160px; white-space:normal;}
.pos-modern-cart-table .qty-control {grid-template-columns:28px 48px 28px;}
.pos-modern-cart-table .qty-control button,.pos-modern-cart-table .remove-item {width:28px; height:28px; border-radius:8px;}
.pos-modern-cart-table input.form-control {min-height:32px; border-radius:8px; font-size:.78rem;}
.pos-modern-empty {position:absolute; inset:44px 0 0; display:grid; place-content:center; justify-items:center; text-align:center; gap:6px; color:var(--pos-muted); pointer-events:none; padding:24px;}
.pos-modern-empty[hidden] {display:none!important;}
.pos-modern-empty>span {width:62px; height:62px; border-radius:50%; background:#eff6ff; color:#2d6fc7; display:grid; place-items:center; font-size:1.5rem; margin-bottom:4px;}
.pos-modern-empty strong {font-size:.92rem; color:var(--pos-ink);}
.pos-modern-empty small {font-size:.74rem;}
.pos-modern-checkout {border-top:1px solid #e7edf5; background:#fbfdff; padding:14px;}
.pos-modern-money-grid {display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:12px;}
.pos-modern-money-grid .input-group-text {background:#fff; border-color:#dbe4f0; color:var(--pos-muted); font-weight:700; border-radius:11px 0 0 11px;}
.pos-modern-money-grid .form-control {min-height:46px; border-color:#dbe4f0; border-radius:0 11px 11px 0; box-shadow:none;}
.pos-modern-totals {border:1px solid #dfe7f2; border-radius:14px; background:#fff; padding:12px 15px;}
.pos-modern-totals>div {display:flex; justify-content:space-between; gap:16px; padding:5px 0; font-size:.82rem; color:var(--pos-muted);}
.pos-modern-totals strong {color:#657692; font-weight:800;}
.pos-modern-totals .pos-modern-total {border-top:1px dashed #d5deeb; margin-top:5px; padding-top:11px; font-size:1.05rem; color:var(--pos-ink); font-weight:900;}
.pos-modern-totals .pos-modern-total strong {font-size:1.18rem; color:var(--pos-ink);}
.pos-modern-totals .pos-modern-change strong {color:#08783d;}
.pos-modern-override {margin-top:10px; padding:10px 12px; border:1px solid #f3cf77; background:#fffbeb; border-radius:12px;}
.pos-modern-override[hidden] {display:none!important;}
.pos-modern-override .form-control {min-height:40px; border-color:#ead28f; border-radius:9px;}
.pos-modern-override small {display:block; color:#8b6b1d; margin-top:5px; font-size:.7rem;}
.pos-modern-actions {display:grid; grid-template-columns:.9fr 1.1fr; gap:12px; margin-top:13px;}
.pos-modern-actions .btn {min-height:54px; border-radius:13px; font-weight:900; display:flex; align-items:center; justify-content:center; gap:9px;}
.pos-modern-clear {border:1.5px solid #ef4444!important; color:#c51d1d!important; background:#fff!important;}
.pos-modern-clear:hover {background:#fff5f5!important;}
.pos-modern-complete {border:1px solid var(--pos-navy)!important; background:linear-gradient(135deg,var(--pos-navy),#0b4b92)!important; color:#fff!important; box-shadow:0 8px 18px rgba(7,52,106,.18);}
.pos-modern-complete:hover {filter:brightness(1.06);}
.pos-modern-products {display:grid; grid-template-rows:auto minmax(0,1fr); padding:14px; position:relative;}
.pos-modern-product-header {display:grid; gap:10px; margin-bottom:12px;}
.pos-modern-product-search {position:relative;}
.pos-modern-product-search>i {position:absolute; left:15px; top:50%; transform:translateY(-50%); color:#6f83a8; z-index:2;}
.pos-modern-product-search .form-control {min-height:50px; border:1px solid #d8e2ef; border-radius:13px; padding-left:43px; padding-right:48px; box-shadow:none;}
.pos-modern-search-hint {position:absolute; right:13px; top:50%; transform:translateY(-50%); width:26px; height:26px; border:1px solid #dfe7f2; border-radius:7px; display:grid; place-items:center; font-weight:800; color:#93a1b5; background:#fff;}
.pos-modern-category-row {display:grid; grid-template-columns:32px minmax(0,1fr) 32px; gap:6px; align-items:center;}
.pos-modern-category-arrow {width:32px; height:32px; padding:0; border:1px solid #e0e7f1; border-radius:50%; background:#fff; color:#596d8d; display:grid; place-items:center;}
.pos-modern-category-arrow:hover {background:#f3f7fc; color:var(--pos-navy);}
.pos-modern-categories {gap:8px; padding:2px 0; scrollbar-width:none; scroll-behavior:smooth;}
.pos-modern-categories::-webkit-scrollbar {display:none;}
.pos-modern-categories button {padding:9px 15px; border-radius:999px; border-color:#dfe6f0; color:#72809a; font-size:.76rem; font-weight:850; box-shadow:0 2px 6px rgba(8,32,74,.02);}
.pos-modern-categories button.active {background:var(--pos-navy); border-color:var(--pos-navy); color:#fff; box-shadow:0 5px 12px rgba(7,52,106,.18);}
.pos-modern-grid {grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding:1px 2px 8px; scrollbar-width:thin; scrollbar-color:#aab4c2 transparent;}
.pos-modern-product-card {min-height:220px; border:1px solid #dfe6f0; border-radius:15px; padding:10px; grid-template-rows:92px auto auto; gap:8px; box-shadow:0 3px 12px rgba(8,32,74,.045);}
.pos-modern-product-card:hover {border-color:#b3cae8; box-shadow:0 12px 24px rgba(8,32,74,.10); transform:translateY(-2px);}
.pos-modern-product-card:focus-visible {outline:3px solid rgba(13,110,253,.18); outline-offset:2px;}
.pos-modern-product-card.is-out {opacity:.76; cursor:not-allowed;}
.pos-modern-product-card.is-out:hover {transform:none; box-shadow:0 3px 12px rgba(8,32,74,.045); border-color:#dfe6f0;}
.pos-modern-product-image {height:92px; border-radius:12px; background:linear-gradient(135deg,#f8f3e7 0%,#edf5f6 100%); color:#0873df;}
.pos-modern-fallback-icon {width:100%; height:100%; display:grid; place-items:center;}
.pos-modern-fallback-icon i {font-size:2.25rem; color:#0b6bdd; filter:drop-shadow(0 3px 7px rgba(11,107,221,.10));}
.pos-modern-product-info strong {font-size:.88rem; line-height:1.15; color:#071d47; min-height:2.05em; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.pos-modern-product-info small {font-size:.68rem; color:#697a98; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.pos-modern-product-info .pos-modern-meta {white-space:normal; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical;}
.pos-modern-stock {color:var(--pos-success)!important; font-weight:800; margin-top:4px!important;}
.pos-modern-stock.is-out {color:var(--pos-danger)!important;}
.pos-modern-product-footer b {font-size:.9rem; color:#082960;}
.pos-modern-add {width:38px!important; height:38px!important; border-radius:12px!important; background:var(--pos-navy)!important; box-shadow:0 5px 12px rgba(7,52,106,.18);}
.pos-modern-product-card.is-out .pos-modern-add {background:#9ca9bb!important; box-shadow:none;}
.pos-modern-no-results {position:absolute; inset:145px 18px 18px; background:rgba(255,255,255,.94); display:grid; place-content:center; justify-items:center; text-align:center; color:var(--pos-muted); gap:5px; z-index:3;}
.pos-modern-no-results[hidden] {display:none!important;}
.pos-modern-no-results i {font-size:2rem; color:#91a3bb;}
.pos-modern-no-results strong {color:var(--pos-ink);}
@media(max-width:1250px){
    .pos-modern{height:auto;min-height:0}.pos-modern-controls{grid-template-columns:1fr 1fr}.pos-modern-main{grid-template-columns:1fr}.pos-modern-cart{min-height:620px}.pos-modern-products{min-height:720px}.pos-modern-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media(max-width:800px){
    .pos-modern-controls{grid-template-columns:1fr;padding:12px}.pos-modern-main{gap:10px}.pos-modern-cart,.pos-modern-products{border-radius:13px}.pos-modern-money-grid,.pos-modern-actions{grid-template-columns:1fr}.pos-modern-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.pos-modern-section-head{padding:14px}.pos-modern-title small{display:none}
}
@media(max-width:520px){
    .pos-modern-grid{grid-template-columns:1fr}.pos-modern-product-card{min-height:205px}.pos-modern-control>span{font-size:.68rem}.pos-modern-category-row{grid-template-columns:minmax(0,1fr)}.pos-modern-category-arrow{display:none}.pos-modern-cart-table th:nth-child(3),.pos-modern-cart-table td:nth-child(3){display:none}.pos-modern-cart-table .cart-item-title{max-width:125px}
}


/* 2026-09-01 viewport hotfix: keep checkout actions visible above browser/taskbar. */
body.route-pos .page-body {
    padding-top: 12px;
    padding-bottom: 12px;
}
body.route-pos .pos-modern {
    max-height: calc(100dvh - 102px);
}
.pos-modern-cart,
.pos-modern-products {
    max-height: 100%;
}
.pos-modern-checkout {
    position: relative;
    z-index: 4;
}
.pos-modern-actions {
    position: sticky;
    bottom: 0;
    z-index: 6;
    padding-top: 4px;
    background: linear-gradient(180deg, rgba(251,253,255,0), #fbfdff 18%);
}

/* Compact laptop mode: 768p/900p screens with taskbar visible. */
@media (min-width:1251px) and (max-height:900px) {
    .pos-modern {
        height: calc(100dvh - 102px);
        max-height: calc(100dvh - 102px);
    }
    .pos-modern-shell { gap: 9px; }
    .pos-modern-controls { padding: 10px 14px; gap: 10px; border-radius: 14px; }
    .pos-modern-control>span { margin-bottom: 4px; font-size: .67rem; }
    .pos-modern-input-wrap .form-select,
    .pos-modern-input-wrap .form-control { min-height: 44px; border-radius: 11px; }
    .pos-modern-main { gap: 10px; }
    .pos-modern-section-head { padding: 11px 14px; }
    .pos-modern-title-icon { width: 34px; height: 34px; border-radius: 10px; }
    .pos-modern-title h2 { font-size: .98rem; }
    .pos-modern-title small { display:none; }
    .pos-modern-cart { grid-template-rows:auto minmax(56px,1fr) auto; }
    .pos-modern-cart-table thead th { height: 34px; padding: 7px 7px; }
    .pos-modern-cart-table td { padding: 6px 7px; }
    .pos-modern-empty { inset: 35px 0 0; padding: 12px; gap: 3px; }
    .pos-modern-empty>span { width: 46px; height: 46px; font-size: 1.2rem; }
    .pos-modern-checkout { padding: 9px 12px 10px; }
    .pos-modern-money-grid { gap: 9px; margin-bottom: 8px; }
    .pos-modern-money-grid label>span { margin-bottom: 4px; font-size:.67rem; }
    .pos-modern-money-grid .form-control { min-height: 39px; }
    .pos-modern-totals { padding: 8px 13px; border-radius: 12px; }
    .pos-modern-totals>div { padding: 2px 0; font-size:.76rem; }
    .pos-modern-totals .pos-modern-total { margin-top:3px; padding-top:7px; font-size:.96rem; }
    .pos-modern-totals .pos-modern-total strong { font-size:1.05rem; }
    .pos-modern-override { margin-top:7px; padding:7px 10px; }
    .pos-modern-actions { margin-top:8px; gap:9px; }
    .pos-modern-actions .btn { min-height:46px; border-radius:11px; }
    .pos-modern-products { padding: 10px; }
    .pos-modern-product-header { gap:7px; margin-bottom:8px; }
    .pos-modern-product-search .form-control { min-height:43px; }
    .pos-modern-categories button { padding:7px 13px; }
    .pos-modern-grid { gap:9px; padding-bottom:3px; }
    .pos-modern-product-card { min-height:190px; grid-template-rows:76px auto auto; gap:6px; padding:8px; }
    .pos-modern-product-image { height:76px; }
    .pos-modern-fallback-icon i { font-size:1.9rem; }
    .pos-modern-product-info strong { font-size:.82rem; }
    .pos-modern-product-info small { font-size:.64rem; }
    .pos-modern-product-footer b { font-size:.84rem; }
    .pos-modern-add { width:34px!important; height:34px!important; }
}

@media (min-width:1251px) and (max-height:760px) {
    body.route-pos .page-body { padding-top:8px; padding-bottom:8px; }
    .pos-modern { height:auto; max-height:none; }
    .pos-modern-main { min-height:560px; }
    .pos-modern-cart { min-height:560px; }
    .pos-modern-products { min-height:560px; }
}


/* 2026-09-01 compact current cart hotfix: reduce over-tall cart panel on desktop. */
@media (min-width:1251px) {
    body.route-pos .pos-modern-main {
        align-items: start;
    }
    body.route-pos .pos-modern-products {
        align-self: stretch;
        min-height: 100%;
    }
    body.route-pos .pos-modern-cart {
        align-self: start;
        max-height: min(720px, calc(100dvh - 188px));
        grid-template-rows: auto minmax(170px, 320px) auto;
    }
    body.route-pos .pos-modern-cart-list {
        max-height: min(320px, 34vh);
    }
    body.route-pos .pos-modern-empty {
        inset: 44px 0 8px;
        padding: 18px;
    }
    body.route-pos .pos-modern-checkout {
        padding: 12px 14px;
    }
    body.route-pos .pos-modern-money-grid {
        gap: 10px;
        margin-bottom: 10px;
    }
    body.route-pos .pos-modern-totals > div {
        padding: 4px 0;
    }
    body.route-pos .pos-modern-actions {
        margin-top: 10px;
    }
}

@media (min-width:1251px) and (max-height:900px) {
    body.route-pos .pos-modern-cart {
        max-height: min(650px, calc(100dvh - 165px));
        grid-template-rows: auto minmax(130px, 240px) auto;
    }
    body.route-pos .pos-modern-cart-list {
        max-height: min(240px, 27vh);
    }
    body.route-pos .pos-modern-empty {
        inset: 38px 0 6px;
        padding: 12px;
    }
    body.route-pos .pos-modern-checkout {
        padding: 10px 12px;
    }
    body.route-pos .pos-modern-totals {
        padding: 10px 12px;
    }
}

@media (max-width:1250px) {
    body.route-pos .pos-modern-main {
        align-items: stretch;
    }
    body.route-pos .pos-modern-cart {
        align-self: stretch;
        max-height: none;
    }
    body.route-pos .pos-modern-cart-list {
        max-height: none;
    }
}