/* ===== Extracted style block 1 ===== */
:root {
      --bg:#f3f6fb; --card:#fff; --line:#dbe3ef; --text:#1f2937; --muted:#6b7280;
      --primary:#1d4ed8; --primary2:#2563eb; --danger:#dc2626; --success:#059669;
      --warning:#d97706; --shadow:0 10px 30px rgba(0,0,0,.08); --radius:18px;
    }
    *{box-sizing:border-box} html,body{height:100%;overflow:hidden} body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text)}
    h1,h2,h3,h4,p{margin:0} button,input,select,textarea{font:inherit}
    .hidden{display:none!important}.small{font-size:12px;color:var(--muted)}
    .login-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:linear-gradient(135deg,#dbeafe,#eff6ff)}
    .login-card{width:100%;max-width:430px;background:var(--card);border-radius:24px;box-shadow:var(--shadow);padding:28px}
    .brand-title{font-size:30px;font-weight:700;color:var(--primary);margin-bottom:8px}.brand-sub{color:var(--muted);margin-bottom:24px;font-size:14px}
    .form-group{margin-bottom:14px}.form-group label{display:block;margin-bottom:6px;font-weight:600;font-size:14px}
    .input,.select,.textarea{width:100%;border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:#fff;outline:none}
    .input:focus,.select:focus,.textarea:focus{border-color:var(--primary2);box-shadow:0 0 0 3px rgba(37,99,235,.12)}
    .btn{border:none;border-radius:12px;padding:12px 16px;cursor:pointer;transition:.2s ease;font-weight:600}.btn:hover{transform:translateY(-1px)}
    .btn-primary{background:var(--primary);color:#fff}.btn-secondary{background:#eef2ff;color:#1e3a8a}.btn-danger{background:#fee2e2;color:#991b1b}.btn-success{background:#dcfce7;color:#166534}.btn-warning{background:#ffedd5;color:#9a3412}.btn-dark{background:#1f2937;color:#fff}.btn-block{width:100%}
    .hint-box{margin-top:18px;background:#f8fafc;border:1px solid var(--line);border-radius:14px;padding:14px;font-size:13px;color:var(--muted)}
    .app-shell{display:grid;grid-template-columns:260px 1fr;min-height:100vh}.sidebar{background:#0f172a;color:#e5e7eb;padding:18px}.sidebar h2{font-size:24px;margin-bottom:6px}.sidebar .store-text{font-size:13px;color:#94a3b8;margin-bottom:20px}
    .user-badge{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:14px;margin-bottom:18px;font-size:14px}
    .sidebar-nav{display:grid;gap:8px}.nav-group{border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.03);overflow:hidden}.nav-group.hidden{display:none!important}.nav-group-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;text-align:left;border:none;padding:12px 14px;background:transparent;color:#e5e7eb;cursor:pointer;font-weight:700}.nav-group-trigger:hover,.nav-group.open .nav-group-trigger{background:rgba(59,130,246,.18);color:#fff}.nav-group-icon{transition:transform .2s ease}.nav-group.open .nav-group-icon{transform:rotate(180deg)}.nav-submenu{display:none;padding:0 8px 10px}.nav-group.open .nav-submenu{display:grid;gap:6px}.nav-btn{width:100%;text-align:left;border:none;padding:10px 12px;border-radius:10px;background:transparent;color:#cbd5e1;cursor:pointer;font-weight:600;margin:0}
    .nav-btn.active,.nav-btn:hover{background:rgba(59,130,246,.18);color:#fff}.nav-group{margin-bottom:10px}.nav-group-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;border:none;border-radius:14px;padding:12px 14px;background:rgba(255,255,255,.06);color:#fff;cursor:pointer;font-weight:700}.nav-group-trigger:hover{background:rgba(59,130,246,.18)}.nav-group-title{display:flex;align-items:center;gap:10px}.menu-logo{width:30px;height:30px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:#fff;box-shadow:0 8px 18px rgba(0,0,0,.18)}.logo-main{background:linear-gradient(135deg,#3b82f6,#2563eb)}.logo-catalog{background:linear-gradient(135deg,#10b981,#059669)}.logo-people{background:linear-gradient(135deg,#f59e0b,#d97706)}.logo-transactions{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}.logo-system{background:linear-gradient(135deg,#ef4444,#dc2626)}.nav-group-icon{transition:transform .2s ease}.nav-group.open .nav-group-icon{transform:rotate(180deg)}.nav-submenu{display:none;padding:8px 0 0 10px}.nav-group.open .nav-submenu{display:block}.nav-btn{display:flex;align-items:center;gap:10px}.nav-item-icon{width:26px;height:26px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;font-size:14px;color:#fff;flex:0 0 26px}.icon-dashboard{background:#2563eb}.icon-pos{background:#0ea5e9}.icon-sales{background:#14b8a6}.icon-reports{background:#06b6d4}.icon-products{background:#22c55e}.icon-categories{background:#84cc16}.icon-inventory{background:#f59e0b}.icon-promos{background:#eab308;color:#111827}.icon-customers{background:#f97316}.icon-suppliers{background:#fb7185}.icon-users{background:#ec4899}.icon-purchases{background:#8b5cf6}.icon-returns{background:#a855f7}.icon-credit{background:#6366f1}.icon-quotations{background:#3b82f6}.icon-settings{background:#475569}.icon-audit{background:#dc2626}.icon-backup{background:#0f766e}.icon-logout{background:#334155}.main{padding:20px;overflow:auto;height:100vh}.view-section{height:calc(100vh - 40px);overflow:auto}.view-section:not(.hidden){display:block}.topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px;flex-wrap:wrap}.topbar h1{font-size:28px}.topbar p{color:var(--muted);font-size:14px;margin-top:4px}
    .grid{display:grid;gap:18px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
    .card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;border:1px solid rgba(219,227,239,.7)}.card-title{font-size:18px;font-weight:700;margin-bottom:14px}
    .stat{background:linear-gradient(180deg,#fff,#f8fbff);border:1px solid var(--line);border-radius:18px;padding:16px}.stat .label{color:var(--muted);font-size:13px;margin-bottom:8px}.stat .value{font-size:28px;font-weight:700}.stat .sub{margin-top:6px;color:var(--muted);font-size:13px}
    table{width:100%;border-collapse:collapse}th,td{border-bottom:1px solid #edf2f7;padding:10px 8px;text-align:left;font-size:14px;vertical-align:top}th{background:#f8fafc;color:#334155}.table-wrap{overflow:auto;max-height:420px;border:1px solid #edf2f7;border-radius:14px}
    .toolbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px;align-items:end}.toolbar>*{min-width:160px;flex:1}.toolbar .compact{flex:0 0 auto;min-width:auto}
    .tag{display:inline-block;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:700;background:#eff6ff;color:#1d4ed8}.tag.low{background:#fff7ed;color:#c2410c}.tag.ok{background:#ecfdf5;color:#047857}.tag.danger{background:#fee2e2;color:#b91c1c}
    .pos-layout{display:grid;grid-template-columns:1.25fr 1fr;gap:18px;height:calc(100vh - 170px);align-items:stretch}.pos-layout>.card{overflow:hidden;display:flex;flex-direction:column}.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin-top:14px;max-height:420px;overflow:auto}
    .product-tile{border:1px solid var(--line);border-radius:16px;padding:14px;cursor:pointer;background:#fff}.product-tile:hover{border-color:var(--primary2);box-shadow:0 6px 18px rgba(37,99,235,.12)}.product-tile .name{font-weight:700;margin-bottom:8px}.product-tile .meta{font-size:13px;color:var(--muted);margin-bottom:4px}.product-thumb,.cart-thumb,.form-image-preview{width:58px;height:58px;border-radius:14px;border:1px solid var(--line);object-fit:cover;background:#f8fafc}.product-thumb.large{width:72px;height:72px}.cart-thumb{width:46px;height:46px;border-radius:12px}.image-preview-box{display:flex;align-items:center;gap:12px;padding:10px;border:1px dashed var(--line);border-radius:14px;background:#fafcff}.image-preview-box .small{line-height:1.4}
    .summary-row{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px dashed #e5e7eb;font-size:14px}.summary-row.total{font-size:22px;font-weight:700;border-bottom:none;padding-top:14px}.right-actions{display:grid;gap:10px;margin-top:12px}.inline-actions{display:flex;gap:6px;flex-wrap:wrap}.empty{text-align:center;color:var(--muted);padding:28px 16px}
    .toast{position:fixed;left:50%;transform:translateX(-50%);bottom:18px;background:#111827;color:#fff;padding:12px 18px;border-radius:12px;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:.25s ease;z-index:1000;min-width:320px;max-width:520px;font-size:14px;text-align:center}.toast.show{opacity:1}
    .footer-note{margin-top:14px;color:var(--muted);font-size:13px}.list-block{display:grid;gap:8px}.mini-card{border:1px solid var(--line);border-radius:14px;padding:12px;background:#fafcff}.product-list{display:grid;gap:8px;margin-top:14px;max-height:420px;overflow:auto}.product-row{display:grid;grid-template-columns:90px 1.7fr .9fr .8fr .8fr auto;gap:10px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:12px;background:#fff}.product-row:hover{border-color:var(--primary2);box-shadow:0 6px 18px rgba(37,99,235,.12)}.product-row .meta{font-size:13px;color:var(--muted)}.product-row .price{font-weight:700;color:#1d4ed8}.modal-overlay{position:fixed;inset:0;background:rgba(15,23,42,.55);display:flex;align-items:center;justify-content:center;padding:24px;z-index:2000}.modal-card{width:100%;max-width:560px;background:#fff;border-radius:24px;box-shadow:var(--shadow);padding:24px}.modal-card.large{max-width:680px}.modal-title{font-size:28px;font-weight:700;margin-bottom:8px}.modal-sub{color:var(--muted);margin-bottom:18px}.shortcut-note{margin-top:10px;font-size:12px;color:var(--muted)}.permission-box{border:1px solid var(--line);border-radius:14px;padding:12px;background:#fafcff;max-height:220px;overflow:auto}.permission-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.check-item{display:flex;gap:8px;align-items:center;font-size:14px}.fullscreen-pos #appScreen,.fullscreen-pos .app-shell{min-height:100vh}.fullscreen-pos #appScreen{width:100vw}.fullscreen-pos .app-shell{grid-template-columns:260px 1fr!important}.fullscreen-pos .sidebar{display:none!important}.fullscreen-pos .main{padding:14px;width:100%}.fullscreen-pos .view-section.hidden{display:none!important}.fullscreen-pos .topbar h1{font-size:24px}
    .scroll-card{height:calc(100vh - 170px);overflow:hidden;display:flex;flex-direction:column}.scroll-card .table-wrap{flex:1;max-height:none}.fixed-two-col{height:calc(100vh - 170px);align-items:stretch}.fixed-two-col>.card{overflow:hidden;display:flex;flex-direction:column}.fixed-two-col>.card .table-wrap{flex:1;max-height:none}.report-panels{height:calc(100vh - 260px);overflow:auto;padding-right:4px}.modal-body-scroll{max-height:70vh;overflow:auto;padding-right:4px}.print-only-title{display:none}
    @media (max-width:1200px){.pos-layout{grid-template-columns:1fr}} @media (max-width:900px){.app-shell{grid-template-columns:1fr}.sidebar{position:sticky;top:0;z-index:10}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}
  
    /* VERY LARGE MODE / TOUCHSCREEN POS */
    body{font-size:18px;overflow:auto}
    .main{padding:18px;overflow:hidden}
    .card{padding:20px;border-radius:22px}
    .card-title{font-size:24px;margin-bottom:16px}
    .topbar h1{font-size:34px}
    .topbar p,.footer-note,.small,.shortcut-note{font-size:15px}
    .btn{font-size:22px;padding:18px 22px;border-radius:16px;min-height:64px;touch-action:manipulation}
    .input,.select,.textarea{font-size:20px;padding:16px 18px;border-radius:14px;min-height:60px}
    label{font-size:17px}
    .toolbar{gap:12px}
    .toolbar>*{min-width:180px}
    .product-list{gap:12px;max-height:none;overflow:auto;padding-right:4px}
    .product-row{grid-template-columns:110px 1.7fr .9fr .8fr .9fr auto;gap:14px;padding:16px;border-radius:18px}
    .product-thumb.large{width:88px;height:88px;border-radius:16px}
    .product-row .name,.product-tile .name{font-size:22px;font-weight:800;line-height:1.15}
    .product-row .meta,.product-tile .meta{font-size:16px;line-height:1.3}
    .product-row .price{font-size:26px;font-weight:900}
    .product-row .btn{min-width:100px;padding:14px 18px;font-size:20px}
    .table-wrap{border-radius:18px}
    th,td{font-size:17px;padding:14px 10px}
    #cartTableBody td{font-size:20px;font-weight:700;padding:14px 8px}
    #cartTableBody td:first-child{font-size:22px;font-weight:800}
    #cartTableBody td:nth-child(2){font-size:20px}
    #cartTableBody td:nth-child(3),#cartTableBody td:nth-child(4){font-size:22px;font-weight:900}
    #cartTableBody td:nth-child(4){color:var(--primary)}
    .cart-thumb{width:58px;height:58px;border-radius:14px}
    .summary-row{font-size:22px;padding:12px 0}
    .summary-row strong{font-size:24px}
    #cartSubtotal,#promoDiscountLabel,#cartChange{font-size:26px;font-weight:900}
    .summary-row.total{font-size:34px;font-weight:900;padding-top:18px;align-items:center;background:#eefcf6;border-radius:18px;padding:18px 16px;margin-top:10px;border:2px solid #86efac}
    #cartTotal{font-size:46px;font-weight:900;color:var(--success);letter-spacing:.5px}
    .right-actions{position:sticky;bottom:0;background:#fff;padding-top:12px;z-index:5}
    .tag{font-size:15px;padding:8px 14px}
    .stat{padding:20px;border-radius:22px}
    .stat .label{font-size:16px}
    .stat .value{font-size:40px;font-weight:900}
    .stat .sub{font-size:15px}
    .pos-layout{height:calc(100vh - 118px);align-items:stretch}
    #view-pos .card{height:100%;display:flex;flex-direction:column;min-height:0}
    #view-pos .card .table-wrap{flex:1;min-height:0;overflow:auto}
    #view-pos .card .product-list{flex:1;min-height:0}
    .modal-card{border-radius:28px;padding:28px;max-width:760px}
    .modal-card.large{max-width:900px}
    .modal-title{font-size:40px}
    .modal-sub{font-size:18px}
    .modal-body-scroll{max-height:68vh;overflow:auto;padding-right:6px}
    .modal-card .btn{min-height:72px;font-size:24px}
    .modal-card .input,.modal-card .select{font-size:24px;min-height:68px}
    .mini-card{font-size:18px;padding:16px;border-radius:18px}
    .change-modal-value{font-size:110px!important;font-weight:900!important;text-align:center;color:#059669;padding:26px 0 12px;line-height:1;letter-spacing:1px;text-shadow:0 0 18px rgba(5,150,105,.22)}
    .blink-change{animation:blinkChange 1s steps(2,start) infinite}
    @keyframes blinkChange{50%{opacity:.35;transform:scale(1.03)}}
    .touch-btn{min-height:82px!important;font-size:28px!important;border-radius:18px!important;padding:20px 24px!important}
    .touch-pill-cash{background:#dcfce7!important;color:#166534!important;border:2px solid #86efac}
    .touch-pill-credit{background:#fee2e2!important;color:#991b1b!important;border:2px solid #fca5a5}
    @media (max-width:1200px){.topbar h1{font-size:28px}.product-row{grid-template-columns:96px 1.5fr .9fr .8fr .9fr auto}.change-modal-value{font-size:82px!important}}

  

    /* POS ALIGNMENT REFINEMENT */
    #view-pos .topbar{margin-bottom:14px}
    #view-pos .topbar h1{font-size:30px;line-height:1.1;margin-bottom:4px}
    #view-pos .topbar p{font-size:15px;color:#64748b}
    #view-pos .pos-layout{
      grid-template-columns:minmax(0,1.55fr) minmax(380px,.95fr);
      gap:20px;
      height:auto;
      min-height:calc(100vh - 120px);
      align-items:start;
    }
    #view-pos .card{
      border-radius:22px;
      border:1px solid #d8e1ef;
      box-shadow:0 10px 26px rgba(15,23,42,.06);
      background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
    }
    #view-pos .card:first-child{min-height:calc(100vh - 150px)}
    #view-pos .toolbar{
      display:grid;
      grid-template-columns:1.35fr .95fr .85fr auto;
      gap:12px;
      align-items:end;
      padding:4px 0 14px;
      margin-bottom:10px;
      border-bottom:1px solid #e7eef7;
    }
    #view-pos .toolbar > *{min-width:0;flex:none}
    #view-pos label{display:block;font-size:13px;font-weight:700;color:#475569;margin-bottom:7px}
    #view-pos .input,
    #view-pos .select{
      min-height:48px;
      font-size:15px;
      border-radius:14px;
      border:1px solid #cfd9e7;
      background:#fff;
      box-shadow:none;
      padding:12px 14px;
    }
    #view-pos .compact label{visibility:hidden}
    #view-pos .compact .btn{min-width:88px}
    #view-pos .product-list{
      flex:1;
      display:grid;
      gap:10px;
      padding-right:2px;
      margin-top:2px;
      align-content:start;
    }
    #view-pos .product-row{
      grid-template-columns:78px minmax(0,1.6fr) .8fr .75fr .75fr auto;
      gap:12px;
      padding:12px 14px;
      border-radius:16px;
      border:1px solid #dde6f2;
      box-shadow:0 2px 10px rgba(15,23,42,.03);
    }
    #view-pos .product-thumb.large{width:70px;height:70px;border-radius:14px}
    #view-pos .product-row .name,
    #view-pos .product-tile .name{font-size:17px;font-weight:800;line-height:1.2}
    #view-pos .product-row .meta,
    #view-pos .product-tile .meta{font-size:12px;line-height:1.35;color:#64748b}
    #view-pos .product-row .price{font-size:18px;font-weight:800}
    #view-pos .product-row .btn{min-height:42px;padding:10px 14px;font-size:14px;border-radius:12px}
    #view-pos .scroll-card{
      position:sticky;
      top:18px;
      height:calc(100vh - 56px);
      padding-bottom:16px;
      overflow:hidden;
    }
    #view-pos .card-title{
      font-size:22px;
      margin-bottom:14px;
      padding-bottom:12px;
      border-bottom:1px solid #e8eef6;
    }
    #view-pos .table-wrap{
      border-radius:16px;
      border:1px solid #e4ebf5;
      background:#fbfdff;
      overflow:auto;
    }
    #view-pos table thead th{
      position:sticky;
      top:0;
      z-index:1;
      background:#f6f9fd;
      font-size:13px;
      font-weight:800;
      color:#475569;
    }
    #view-pos th,
    #view-pos td{padding:12px 10px;font-size:14px}
    #view-pos #cartTableBody td{font-size:14px;font-weight:600}
    #view-pos #cartTableBody td:first-child{font-size:14px;font-weight:700}
    #view-pos #cartTableBody td:nth-child(3),
    #view-pos #cartTableBody td:nth-child(4){font-size:14px;font-weight:700}
    #view-pos .cart-thumb{width:42px;height:42px;border-radius:10px}
    #view-pos .summary-row{
      display:grid;
      grid-template-columns:150px minmax(0,1fr);
      align-items:center;
      gap:12px;
      padding:10px 0;
      border-bottom:1px dashed #e2e8f0;
      font-size:14px;
    }
    #view-pos .summary-row > span:first-child{font-weight:700;color:#475569}
    #view-pos .summary-row strong{font-size:16px}
    #view-pos .summary-row .input,
    #view-pos .summary-row .select{max-width:none !important;width:100%}
    #view-pos .summary-row.total{
      grid-template-columns:120px 1fr;
      margin-top:10px;
      padding:14px 16px;
      border:none;
      border-radius:18px;
      background:linear-gradient(135deg,#effaf3,#f8fffb);
      border:1px solid #b7e4c3;
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);
      font-size:18px;
      align-items:center;
    }
    #view-pos #cartTotal{font-size:30px;font-weight:900;color:#059669;justify-self:end}
    #view-pos #cartSubtotal,
    #view-pos #promoDiscountLabel,
    #view-pos #cartChange{font-size:16px;font-weight:800}
    #view-pos .right-actions{
      display:grid;
      grid-template-columns:1fr;
      gap:10px;
      margin-top:14px;
      padding-top:14px;
      border-top:1px solid #e8eef6;
      background:transparent;
      position:static;
    }
    #view-pos .right-actions .btn{
      min-height:50px;
      font-size:16px;
      font-weight:800;
      border-radius:14px;
    }
    #view-pos .footer-note,
    #view-pos .shortcut-note{font-size:12px;color:#64748b}
    #view-pos .footer-note{margin-top:12px}
    @media (max-width:1280px){
      #view-pos .toolbar{grid-template-columns:1fr 1fr}
      #view-pos .scroll-card{position:relative;top:auto;height:auto;min-height:unset}
      #view-pos .pos-layout{grid-template-columns:1fr;min-height:auto}
      #view-pos .card:first-child{min-height:unset}
    }
    @media (max-width:760px){
      #view-pos .toolbar{grid-template-columns:1fr}
      #view-pos .product-row{grid-template-columns:64px 1fr;gap:10px}
      #view-pos .product-row > :nth-child(n+3){grid-column:2}
      #view-pos .summary-row{grid-template-columns:1fr}
      #view-pos #cartTotal{justify-self:start}
    }


/* TABLET TWO-COLUMN POS FIX - keep POS left/right on tablet landscape */
@media (max-width:1280px) and (min-width:761px){
  body.pos-compact-full #view-pos .pos-layout,
  body.pos-compact-full #view-pos .enhanced-pos-layout,
  #view-pos .enhanced-pos-layout{
    display:grid!important;
    grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr)!important;
    gap:8px!important;
    height:calc(100dvh - 12px)!important;
    min-height:0!important;
    overflow:hidden!important;
    align-items:stretch!important;
  }
  body.pos-compact-full #view-pos .enhanced-pos-layout>.card,
  #view-pos .enhanced-pos-layout>.card{
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  body.pos-compact-full #view-pos .left-pos-stack,
  #view-pos .left-pos-stack{
    display:grid!important;
    grid-template-rows:auto minmax(0,1fr)!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  body.pos-compact-full #view-pos .left-pos-stack .receipt-preview,
  #view-pos .left-pos-stack .receipt-preview{
    min-height:0!important;
    overflow:auto!important;
  }
  body.pos-compact-full #view-pos .scroll-card,
  #view-pos .enhanced-pos-layout .scroll-card{
    position:relative!important;
    top:auto!important;
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
  }
}



/* DASHBOARD AMOUNT SIZE FIX - prevents peso amounts from overflowing cards on Android/tablet */
#view-dashboard .stat .value,
#view-dashboard #dashTodaySales,
#view-dashboard #dashOpenCredit,
#view-dashboard #dashTotalProductAmount {
  font-size:clamp(22px, 2.4vw, 32px) !important;
  line-height:1.12 !important;
  max-width:100% !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
  white-space:normal !important;
}
#view-dashboard .stat {
  min-width:0 !important;
  overflow:hidden !important;
}
#view-dashboard .grid-4 {
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
}
@media (max-width:1100px){
  #view-dashboard .grid-4{grid-template-columns:repeat(2, minmax(0, 1fr)) !important;}
  #view-dashboard .stat .value{font-size:clamp(20px, 4vw, 30px) !important;}
}
@media (max-width:620px){
  #view-dashboard .grid-4{grid-template-columns:1fr !important;}
  #view-dashboard .stat .value{font-size:24px !important;}
}



/* Lightweight pagination controls - original design preserved */
.pagination-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:10px;padding:10px 0;border-top:1px solid #e8eef6}
.pagination-bar .small{font-weight:700}
.pagination-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.pagination-actions .btn{min-height:42px!important;font-size:14px!important;padding:10px 14px!important;border-radius:12px!important}
@media (max-width:760px){.pagination-bar{align-items:stretch}.pagination-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.pagination-actions .btn{width:100%}}


    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 2 ===== */
body{font-family:Arial,sans-serif;padding:24px;color:#111} h1,h2,h3,p{margin:0 0 10px} table{width:100%;border-collapse:collapse;margin-top:14px} td,th{border:1px solid #dbe3ef;padding:8px;text-align:left;font-size:13px} .meta{margin:4px 0;color:#475569} .right{text-align:right} .tag{display:inline-block;padding:4px 8px;border-radius:999px;background:#eff6ff} .section{margin-top:22px}
    /* VERY LARGE MODE / TOUCHSCREEN POS */
    body{font-size:18px;overflow:auto}
    .main{padding:18px;overflow:hidden}
    .card{padding:20px;border-radius:22px}
    .card-title{font-size:24px;margin-bottom:16px}
    .topbar h1{font-size:34px}
    .topbar p,.footer-note,.small,.shortcut-note{font-size:15px}
    .btn{font-size:22px;padding:18px 22px;border-radius:16px;min-height:64px;touch-action:manipulation}
    .input,.select,.textarea{font-size:20px;padding:16px 18px;border-radius:14px;min-height:60px}
    label{font-size:17px}
    .toolbar{gap:12px}
    .toolbar>*{min-width:180px}
    .product-list{gap:12px;max-height:none;overflow:auto;padding-right:4px}
    .product-row{grid-template-columns:110px 1.7fr .9fr .8fr .9fr auto;gap:14px;padding:16px;border-radius:18px}
    .product-thumb.large{width:88px;height:88px;border-radius:16px}
    .product-row .name,.product-tile .name{font-size:22px;font-weight:800;line-height:1.15}
    .product-row .meta,.product-tile .meta{font-size:16px;line-height:1.3}
    .product-row .price{font-size:26px;font-weight:900}
    .product-row .btn{min-width:100px;padding:14px 18px;font-size:20px}
    .table-wrap{border-radius:18px}
    th,td{font-size:17px;padding:14px 10px}
    #cartTableBody td{font-size:20px;font-weight:700;padding:14px 8px}
    #cartTableBody td:first-child{font-size:22px;font-weight:800}
    #cartTableBody td:nth-child(2){font-size:20px}
    #cartTableBody td:nth-child(3),#cartTableBody td:nth-child(4){font-size:22px;font-weight:900}
    #cartTableBody td:nth-child(4){color:var(--primary)}
    .cart-thumb{width:58px;height:58px;border-radius:14px}
    .summary-row{font-size:22px;padding:12px 0}
    .summary-row strong{font-size:24px}
    #cartSubtotal,#promoDiscountLabel,#cartChange{font-size:26px;font-weight:900}
    .summary-row.total{font-size:34px;font-weight:900;padding-top:18px;align-items:center;background:#eefcf6;border-radius:18px;padding:18px 16px;margin-top:10px;border:2px solid #86efac}
    #cartTotal{font-size:46px;font-weight:900;color:var(--success);letter-spacing:.5px}
    .right-actions{position:sticky;bottom:0;background:#fff;padding-top:12px;z-index:5}
    .tag{font-size:15px;padding:8px 14px}
    .stat{padding:20px;border-radius:22px}
    .stat .label{font-size:16px}
    .stat .value{font-size:40px;font-weight:900}
    .stat .sub{font-size:15px}
    .pos-layout{height:calc(100vh - 118px);align-items:stretch}
    #view-pos .card{height:100%;display:flex;flex-direction:column;min-height:0}
    #view-pos .card .table-wrap{flex:1;min-height:0;overflow:auto}
    #view-pos .card .product-list{flex:1;min-height:0}
    .modal-card{border-radius:28px;padding:28px;max-width:760px}
    .modal-card.large{max-width:900px}
    .modal-title{font-size:40px}
    .modal-sub{font-size:18px}
    .modal-body-scroll{max-height:68vh;overflow:auto;padding-right:6px}
    .modal-card .btn{min-height:72px;font-size:24px}
    .modal-card .input,.modal-card .select{font-size:24px;min-height:68px}
    .mini-card{font-size:18px;padding:16px;border-radius:18px}
    .change-modal-value{font-size:110px!important;font-weight:900!important;text-align:center;color:#059669;padding:26px 0 12px;line-height:1;letter-spacing:1px;text-shadow:0 0 18px rgba(5,150,105,.22)}
    .blink-change{animation:blinkChange 1s steps(2,start) infinite}
    @keyframes blinkChange{50%{opacity:.35;transform:scale(1.03)}}
    .touch-btn{min-height:82px!important;font-size:28px!important;border-radius:18px!important;padding:20px 24px!important}
    .touch-pill-cash{background:#dcfce7!important;color:#166534!important;border:2px solid #86efac}
    .touch-pill-credit{background:#fee2e2!important;color:#991b1b!important;border:2px solid #fca5a5}
    @media (max-width:1200px){.topbar h1{font-size:28px}.product-row{grid-template-columns:96px 1.5fr .9fr .8fr .9fr auto}.change-modal-value{font-size:82px!important}}

  

    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 3 ===== */
body{font-family:Arial,sans-serif;padding:18px;color:#111} .center{text-align:center} h2,h3,p{margin:0} table{width:100%;border-collapse:collapse;margin-top:14px} td,th{font-size:12px;padding:6px 4px;border-bottom:1px dashed #aaa} .totals div{display:flex;justify-content:space-between;margin-top:6px;font-size:13px} .grand{font-weight:700;font-size:15px;margin-top:10px}
    /* VERY LARGE MODE / TOUCHSCREEN POS */
    body{font-size:18px;overflow:auto}
    .main{padding:18px;overflow:hidden}
    .card{padding:20px;border-radius:22px}
    .card-title{font-size:24px;margin-bottom:16px}
    .topbar h1{font-size:34px}
    .topbar p,.footer-note,.small,.shortcut-note{font-size:15px}
    .btn{font-size:22px;padding:18px 22px;border-radius:16px;min-height:64px;touch-action:manipulation}
    .input,.select,.textarea{font-size:20px;padding:16px 18px;border-radius:14px;min-height:60px}
    label{font-size:17px}
    .toolbar{gap:12px}
    .toolbar>*{min-width:180px}
    .product-list{gap:12px;max-height:none;overflow:auto;padding-right:4px}
    .product-row{grid-template-columns:110px 1.7fr .9fr .8fr .9fr auto;gap:14px;padding:16px;border-radius:18px}
    .product-thumb.large{width:88px;height:88px;border-radius:16px}
    .product-row .name,.product-tile .name{font-size:22px;font-weight:800;line-height:1.15}
    .product-row .meta,.product-tile .meta{font-size:16px;line-height:1.3}
    .product-row .price{font-size:26px;font-weight:900}
    .product-row .btn{min-width:100px;padding:14px 18px;font-size:20px}
    .table-wrap{border-radius:18px}
    th,td{font-size:17px;padding:14px 10px}
    #cartTableBody td{font-size:20px;font-weight:700;padding:14px 8px}
    #cartTableBody td:first-child{font-size:22px;font-weight:800}
    #cartTableBody td:nth-child(2){font-size:20px}
    #cartTableBody td:nth-child(3),#cartTableBody td:nth-child(4){font-size:22px;font-weight:900}
    #cartTableBody td:nth-child(4){color:var(--primary)}
    .cart-thumb{width:58px;height:58px;border-radius:14px}
    .summary-row{font-size:22px;padding:12px 0}
    .summary-row strong{font-size:24px}
    #cartSubtotal,#promoDiscountLabel,#cartChange{font-size:26px;font-weight:900}
    .summary-row.total{font-size:34px;font-weight:900;padding-top:18px;align-items:center;background:#eefcf6;border-radius:18px;padding:18px 16px;margin-top:10px;border:2px solid #86efac}
    #cartTotal{font-size:46px;font-weight:900;color:var(--success);letter-spacing:.5px}
    .right-actions{position:sticky;bottom:0;background:#fff;padding-top:12px;z-index:5}
    .tag{font-size:15px;padding:8px 14px}
    .stat{padding:20px;border-radius:22px}
    .stat .label{font-size:16px}
    .stat .value{font-size:40px;font-weight:900}
    .stat .sub{font-size:15px}
    .pos-layout{height:calc(100vh - 118px);align-items:stretch}
    #view-pos .card{height:100%;display:flex;flex-direction:column;min-height:0}
    #view-pos .card .table-wrap{flex:1;min-height:0;overflow:auto}
    #view-pos .card .product-list{flex:1;min-height:0}
    .modal-card{border-radius:28px;padding:28px;max-width:760px}
    .modal-card.large{max-width:900px}
    .modal-title{font-size:40px}
    .modal-sub{font-size:18px}
    .modal-body-scroll{max-height:68vh;overflow:auto;padding-right:6px}
    .modal-card .btn{min-height:72px;font-size:24px}
    .modal-card .input,.modal-card .select{font-size:24px;min-height:68px}
    .mini-card{font-size:18px;padding:16px;border-radius:18px}
    .change-modal-value{font-size:110px!important;font-weight:900!important;text-align:center;color:#059669;padding:26px 0 12px;line-height:1;letter-spacing:1px;text-shadow:0 0 18px rgba(5,150,105,.22)}
    .blink-change{animation:blinkChange 1s steps(2,start) infinite}
    @keyframes blinkChange{50%{opacity:.35;transform:scale(1.03)}}
    .touch-btn{min-height:82px!important;font-size:28px!important;border-radius:18px!important;padding:20px 24px!important}
    .touch-pill-cash{background:#dcfce7!important;color:#166534!important;border:2px solid #86efac}
    .touch-pill-credit{background:#fee2e2!important;color:#991b1b!important;border:2px solid #fca5a5}
    @media (max-width:1200px){.topbar h1{font-size:28px}.product-row{grid-template-columns:96px 1.5fr .9fr .8fr .9fr auto}.change-modal-value{font-size:82px!important}}

  

    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 4 ===== */
body{font-family:Arial,sans-serif;padding:18px;color:#111} .center{text-align:center} h2,h3,p{margin:0} table{width:100%;border-collapse:collapse;margin-top:14px} td,th{font-size:12px;padding:6px 4px;border-bottom:1px dashed #aaa} .totals div{display:flex;justify-content:space-between;margin-top:6px;font-size:13px} .grand{font-weight:700;font-size:15px;margin-top:10px}
    /* VERY LARGE MODE / TOUCHSCREEN POS */
    body{font-size:18px;overflow:auto}
    .main{padding:18px;overflow:hidden}
    .card{padding:20px;border-radius:22px}
    .card-title{font-size:24px;margin-bottom:16px}
    .topbar h1{font-size:34px}
    .topbar p,.footer-note,.small,.shortcut-note{font-size:15px}
    .btn{font-size:22px;padding:18px 22px;border-radius:16px;min-height:64px;touch-action:manipulation}
    .input,.select,.textarea{font-size:20px;padding:16px 18px;border-radius:14px;min-height:60px}
    label{font-size:17px}
    .toolbar{gap:12px}
    .toolbar>*{min-width:180px}
    .product-list{gap:12px;max-height:none;overflow:auto;padding-right:4px}
    .product-row{grid-template-columns:110px 1.7fr .9fr .8fr .9fr auto;gap:14px;padding:16px;border-radius:18px}
    .product-thumb.large{width:88px;height:88px;border-radius:16px}
    .product-row .name,.product-tile .name{font-size:22px;font-weight:800;line-height:1.15}
    .product-row .meta,.product-tile .meta{font-size:16px;line-height:1.3}
    .product-row .price{font-size:26px;font-weight:900}
    .product-row .btn{min-width:100px;padding:14px 18px;font-size:20px}
    .table-wrap{border-radius:18px}
    th,td{font-size:17px;padding:14px 10px}
    #cartTableBody td{font-size:20px;font-weight:700;padding:14px 8px}
    #cartTableBody td:first-child{font-size:22px;font-weight:800}
    #cartTableBody td:nth-child(2){font-size:20px}
    #cartTableBody td:nth-child(3),#cartTableBody td:nth-child(4){font-size:22px;font-weight:900}
    #cartTableBody td:nth-child(4){color:var(--primary)}
    .cart-thumb{width:58px;height:58px;border-radius:14px}
    .summary-row{font-size:22px;padding:12px 0}
    .summary-row strong{font-size:24px}
    #cartSubtotal,#promoDiscountLabel,#cartChange{font-size:26px;font-weight:900}
    .summary-row.total{font-size:34px;font-weight:900;padding-top:18px;align-items:center;background:#eefcf6;border-radius:18px;padding:18px 16px;margin-top:10px;border:2px solid #86efac}
    #cartTotal{font-size:46px;font-weight:900;color:var(--success);letter-spacing:.5px}
    .right-actions{position:sticky;bottom:0;background:#fff;padding-top:12px;z-index:5}
    .tag{font-size:15px;padding:8px 14px}
    .stat{padding:20px;border-radius:22px}
    .stat .label{font-size:16px}
    .stat .value{font-size:40px;font-weight:900}
    .stat .sub{font-size:15px}
    .pos-layout{height:calc(100vh - 118px);align-items:stretch}
    #view-pos .card{height:100%;display:flex;flex-direction:column;min-height:0}
    #view-pos .card .table-wrap{flex:1;min-height:0;overflow:auto}
    #view-pos .card .product-list{flex:1;min-height:0}
    .modal-card{border-radius:28px;padding:28px;max-width:760px}
    .modal-card.large{max-width:900px}
    .modal-title{font-size:40px}
    .modal-sub{font-size:18px}
    .modal-body-scroll{max-height:68vh;overflow:auto;padding-right:6px}
    .modal-card .btn{min-height:72px;font-size:24px}
    .modal-card .input,.modal-card .select{font-size:24px;min-height:68px}
    .mini-card{font-size:18px;padding:16px;border-radius:18px}
    .change-modal-value{font-size:110px!important;font-weight:900!important;text-align:center;color:#059669;padding:26px 0 12px;line-height:1;letter-spacing:1px;text-shadow:0 0 18px rgba(5,150,105,.22)}
    .blink-change{animation:blinkChange 1s steps(2,start) infinite}
    @keyframes blinkChange{50%{opacity:.35;transform:scale(1.03)}}
    .touch-btn{min-height:82px!important;font-size:28px!important;border-radius:18px!important;padding:20px 24px!important}
    .touch-pill-cash{background:#dcfce7!important;color:#166534!important;border:2px solid #86efac}
    .touch-pill-credit{background:#fee2e2!important;color:#991b1b!important;border:2px solid #fca5a5}
    @media (max-width:1200px){.topbar h1{font-size:28px}.product-row{grid-template-columns:96px 1.5fr .9fr .8fr .9fr auto}.change-modal-value{font-size:82px!important}}

  

    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 5 ===== */
body{font-family:Arial;padding:20px} table{width:100%;border-collapse:collapse;margin-top:14px} td,th{border-bottom:1px solid #ddd;padding:8px;text-align:left}
    /* VERY LARGE MODE / TOUCHSCREEN POS */
    body{font-size:18px;overflow:auto}
    .main{padding:18px;overflow:hidden}
    .card{padding:20px;border-radius:22px}
    .card-title{font-size:24px;margin-bottom:16px}
    .topbar h1{font-size:34px}
    .topbar p,.footer-note,.small,.shortcut-note{font-size:15px}
    .btn{font-size:22px;padding:18px 22px;border-radius:16px;min-height:64px;touch-action:manipulation}
    .input,.select,.textarea{font-size:20px;padding:16px 18px;border-radius:14px;min-height:60px}
    label{font-size:17px}
    .toolbar{gap:12px}
    .toolbar>*{min-width:180px}
    .product-list{gap:12px;max-height:none;overflow:auto;padding-right:4px}
    .product-row{grid-template-columns:110px 1.7fr .9fr .8fr .9fr auto;gap:14px;padding:16px;border-radius:18px}
    .product-thumb.large{width:88px;height:88px;border-radius:16px}
    .product-row .name,.product-tile .name{font-size:22px;font-weight:800;line-height:1.15}
    .product-row .meta,.product-tile .meta{font-size:16px;line-height:1.3}
    .product-row .price{font-size:26px;font-weight:900}
    .product-row .btn{min-width:100px;padding:14px 18px;font-size:20px}
    .table-wrap{border-radius:18px}
    th,td{font-size:17px;padding:14px 10px}
    #cartTableBody td{font-size:20px;font-weight:700;padding:14px 8px}
    #cartTableBody td:first-child{font-size:22px;font-weight:800}
    #cartTableBody td:nth-child(2){font-size:20px}
    #cartTableBody td:nth-child(3),#cartTableBody td:nth-child(4){font-size:22px;font-weight:900}
    #cartTableBody td:nth-child(4){color:var(--primary)}
    .cart-thumb{width:58px;height:58px;border-radius:14px}
    .summary-row{font-size:22px;padding:12px 0}
    .summary-row strong{font-size:24px}
    #cartSubtotal,#promoDiscountLabel,#cartChange{font-size:26px;font-weight:900}
    .summary-row.total{font-size:34px;font-weight:900;padding-top:18px;align-items:center;background:#eefcf6;border-radius:18px;padding:18px 16px;margin-top:10px;border:2px solid #86efac}
    #cartTotal{font-size:46px;font-weight:900;color:var(--success);letter-spacing:.5px}
    .right-actions{position:sticky;bottom:0;background:#fff;padding-top:12px;z-index:5}
    .tag{font-size:15px;padding:8px 14px}
    .stat{padding:20px;border-radius:22px}
    .stat .label{font-size:16px}
    .stat .value{font-size:40px;font-weight:900}
    .stat .sub{font-size:15px}
    .pos-layout{height:calc(100vh - 118px);align-items:stretch}
    #view-pos .card{height:100%;display:flex;flex-direction:column;min-height:0}
    #view-pos .card .table-wrap{flex:1;min-height:0;overflow:auto}
    #view-pos .card .product-list{flex:1;min-height:0}
    .modal-card{border-radius:28px;padding:28px;max-width:760px}
    .modal-card.large{max-width:900px}
    .modal-title{font-size:40px}
    .modal-sub{font-size:18px}
    .modal-body-scroll{max-height:68vh;overflow:auto;padding-right:6px}
    .modal-card .btn{min-height:72px;font-size:24px}
    .modal-card .input,.modal-card .select{font-size:24px;min-height:68px}
    .mini-card{font-size:18px;padding:16px;border-radius:18px}
    .change-modal-value{font-size:110px!important;font-weight:900!important;text-align:center;color:#059669;padding:26px 0 12px;line-height:1;letter-spacing:1px;text-shadow:0 0 18px rgba(5,150,105,.22)}
    .blink-change{animation:blinkChange 1s steps(2,start) infinite}
    @keyframes blinkChange{50%{opacity:.35;transform:scale(1.03)}}
    .touch-btn{min-height:82px!important;font-size:28px!important;border-radius:18px!important;padding:20px 24px!important}
    .touch-pill-cash{background:#dcfce7!important;color:#166534!important;border:2px solid #86efac}
    .touch-pill-credit{background:#fee2e2!important;color:#991b1b!important;border:2px solid #fca5a5}
    @media (max-width:1200px){.topbar h1{font-size:28px}.product-row{grid-template-columns:96px 1.5fr .9fr .8fr .9fr auto}.change-modal-value{font-size:82px!important}}

  

    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 6 ===== */
body{font-family:${state.db.ui.fontFamily||'Arial, sans-serif'};padding:18px;color:#111}
        .center{text-align:center} h2,h3,p{margin:0} table{width:100%;border-collapse:collapse;margin-top:14px}
        td,th{font-size:12px;padding:6px 4px;border-bottom:1px dashed #aaa}
        .totals div{display:flex;justify-content:space-between;margin-top:6px;font-size:13px}
        .grand{font-weight:700;font-size:15px;margin-top:10px}
        .meta{font-size:12px;color:#444;margin-top:2px}
      

    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 7 ===== */
body{font-family:${state.db.ui.fontFamily||'Arial, sans-serif'};padding:18px;color:#111}
          .center{text-align:center} h2,h3,p{margin:0} table{width:100%;border-collapse:collapse;margin-top:14px}
          td,th{font-size:12px;padding:6px 4px;border-bottom:1px dashed #aaa}
          .totals div{display:flex;justify-content:space-between;margin-top:6px;font-size:13px}
          .grand{font-weight:700;font-size:15px;margin-top:10px}
          .meta{font-size:12px;color:#444;margin-top:2px}
        

    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 8 ===== */
body{font-family:${state.db.ui?.fontFamily||'Arial, sans-serif'};padding:18px;color:#111}.center{text-align:center}h2,h3,p{margin:0}table{width:100%;border-collapse:collapse;margin-top:14px}td,th{font-size:12px;padding:6px 4px;border-bottom:1px dashed #aaa}.totals div{display:flex;justify-content:space-between;margin-top:6px;font-size:13px}.grand{font-weight:700;font-size:15px;margin-top:10px}.meta{font-size:12px;color:#444;margin-top:2px}

    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 9 ===== */
@media (max-width: 1366px), (max-height: 820px){
  .app-shell{grid-template-columns:220px minmax(0,1fr)!important}
  .sidebar{padding:14px}
  .sidebar h2{font-size:20px}
  .store-text,.user-badge,.nav-btn,.nav-group-trigger{font-size:12px}
  .main{padding:10px!important;height:100vh;overflow:auto!important}
  .view-section{height:calc(100vh - 20px)!important;overflow:auto!important}
  .topbar{margin-bottom:10px}
  .topbar h1{font-size:22px!important}
  .topbar p,.footer-note,.small,.shortcut-note{font-size:12px!important}
  .card{padding:12px!important;border-radius:16px!important}
  .card-title{font-size:17px!important;margin-bottom:10px!important}
  .btn{font-size:14px!important;padding:10px 12px!important;min-height:42px!important}
  .input,.select,.textarea{font-size:14px!important;padding:10px 12px!important;min-height:42px!important}
  label,th,td{font-size:12px!important}
  th,td{padding:8px 6px!important}
  .toolbar{gap:8px!important}
  .toolbar>*{min-width:120px!important}
  .product-list{margin-top:8px!important;max-height:none!important;overflow:auto!important}
  .product-row{grid-template-columns:68px 1.6fr .8fr .7fr .8fr auto!important;gap:8px!important;padding:10px!important}
  .product-thumb.large{width:56px!important;height:56px!important}
  .product-row .name,.product-tile .name{font-size:14px!important}
  .product-row .meta,.product-tile .meta{font-size:11px!important}
  .product-row .price{font-size:15px!important}
  .table-wrap{max-height:none!important}
  .pos-layout{grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr)!important;height:calc(100vh - 90px)!important;gap:10px!important}
  .scroll-card,.fixed-two-col,.pos-layout>.card{height:100%!important;min-height:0!important}
  #view-pos .card .table-wrap,#view-pos .card .product-list{flex:1;min-height:0;overflow:auto}
  #cartTableBody td{font-size:13px!important;padding:8px 6px!important;font-weight:600!important}
  #cartTableBody td:first-child{font-size:13px!important}
  #cartTableBody td:nth-child(3),#cartTableBody td:nth-child(4){font-size:13px!important}
  .cart-thumb{width:34px!important;height:34px!important}
  .summary-row{font-size:13px!important;padding:6px 0!important}
  .summary-row strong{font-size:14px!important}
  #cartSubtotal,#promoDiscountLabel,#cartChange{font-size:16px!important}
  .summary-row.total{font-size:18px!important;padding:10px 12px!important;margin-top:8px!important}
  #cartTotal{font-size:26px!important}
  .right-actions{gap:8px!important}
  .modal-card{max-width:620px!important;padding:20px!important}
  .modal-title{font-size:24px!important}
  .modal-sub{font-size:14px!important}
  .modal-card .btn{font-size:15px!important;min-height:46px!important}
  .modal-card .input,.modal-card .select{font-size:15px!important;min-height:46px!important}
}
.pos-compact-full .sidebar{display:none!important}
.pos-compact-full .app-shell{grid-template-columns:1fr!important}
.pos-compact-full .main{padding:10px!important}
.pos-compact-full #view-pos .topbar{display:none!important}

.pos-fs-exit{
  position:fixed; top:12px; right:12px; z-index:5000;
  display:none; align-items:center; gap:8px;
  background:#111827; color:#fff; border:none; border-radius:14px;
  padding:12px 16px; font-weight:700; box-shadow:0 10px 24px rgba(0,0,0,.22);
}
.pos-fs-exit:hover{transform:translateY(-1px); background:#0f172a}
.pos-compact-full .pos-fs-exit{display:inline-flex}

.pos-cart-selected{outline:2px solid rgba(37,99,235,.45);background:#eff6ff!important}
#keyboardItemModal .search-result-item{display:grid;grid-template-columns:56px 1fr auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fff;cursor:pointer}
#keyboardItemModal .search-result-item.active{border-color:var(--primary2);background:#eff6ff;box-shadow:0 6px 18px rgba(37,99,235,.12)}
#keyboardItemModal .search-results{display:grid;gap:8px;max-height:52vh;overflow:auto}
#keyboardItemModal .result-name{font-weight:700}
#keyboardItemModal .result-meta{font-size:12px;color:var(--muted)}
.qty-modal-grid{display:grid;gap:12px}
.kbd-hint{font-size:12px;color:var(--muted);margin-top:10px}

/* TABLET APK FIT PATCH */
@media (max-width:1280px) and (min-width:761px){body.pos-compact-full{overflow:hidden!important;font-size:14px!important}.pos-compact-full #appScreen,.pos-compact-full .app-shell,.pos-compact-full .main,.pos-compact-full #view-pos{height:100dvh!important;min-height:100dvh!important;max-height:100dvh!important;overflow:hidden!important}.pos-compact-full .main{padding:6px!important}.pos-compact-full #view-pos .pos-layout{display:grid!important;grid-template-columns:minmax(0,1.42fr) minmax(330px,.92fr)!important;gap:8px!important;height:calc(100dvh - 12px)!important;min-height:0!important;align-items:stretch!important;overflow:hidden!important}.pos-compact-full #view-pos .card{height:100%!important;min-height:0!important;padding:8px!important;border-radius:14px!important;overflow:hidden!important}.pos-compact-full #view-pos .toolbar{grid-template-columns:minmax(0,1.35fr) minmax(105px,.55fr) minmax(105px,.55fr) 64px!important;gap:6px!important;padding:0 0 6px!important;margin-bottom:6px!important}.pos-compact-full #view-pos label{font-size:10px!important;margin-bottom:3px!important}.pos-compact-full #view-pos .input,.pos-compact-full #view-pos .select{min-height:34px!important;height:34px!important;font-size:12px!important;padding:6px 8px!important;border-radius:10px!important}.pos-compact-full #view-pos .compact .btn,.pos-compact-full #view-pos .btn{min-height:34px!important;font-size:12px!important;padding:6px 9px!important;border-radius:10px!important}.pos-compact-full #view-pos .product-list{gap:6px!important;margin-top:0!important;overflow:auto!important;min-height:0!important}.pos-compact-full #view-pos .product-row{grid-template-columns:46px minmax(0,1.5fr) .55fr .45fr .55fr 52px!important;gap:6px!important;padding:6px!important;border-radius:12px!important;min-height:58px!important}.pos-compact-full #view-pos .product-thumb.large{width:42px!important;height:42px!important;border-radius:10px!important}.pos-compact-full #view-pos .product-row .name{font-size:12px!important;line-height:1.1!important}.pos-compact-full #view-pos .product-row .meta{font-size:9px!important;line-height:1.15!important}.pos-compact-full #view-pos .product-row .price{font-size:12px!important}.pos-compact-full #view-pos .product-row .btn{min-height:30px!important;font-size:11px!important;padding:4px 6px!important;min-width:0!important}.pos-compact-full #view-pos .scroll-card{position:relative!important;top:auto!important;height:100%!important;min-height:0!important;padding-bottom:8px!important}.pos-compact-full #view-pos .card-title{font-size:15px!important;margin-bottom:6px!important;padding-bottom:6px!important}.pos-compact-full #view-pos .table-wrap{min-height:0!important;flex:1 1 auto!important;border-radius:10px!important}.pos-compact-full #view-pos table thead th{font-size:10px!important;padding:5px 4px!important}.pos-compact-full #view-pos th,.pos-compact-full #view-pos td,.pos-compact-full #view-pos #cartTableBody td{font-size:10px!important;padding:5px 4px!important;line-height:1.15!important}.pos-compact-full #view-pos .cart-thumb{width:28px!important;height:28px!important;border-radius:7px!important}.pos-compact-full #view-pos .summary-row{grid-template-columns:88px minmax(0,1fr)!important;gap:6px!important;padding:4px 0!important;font-size:11px!important}.pos-compact-full #view-pos .summary-row strong,.pos-compact-full #view-pos #cartSubtotal,.pos-compact-full #view-pos #promoDiscountLabel,.pos-compact-full #view-pos #cartChange{font-size:12px!important}.pos-compact-full #view-pos .summary-row.total{grid-template-columns:70px 1fr!important;padding:7px 9px!important;margin-top:5px!important;border-radius:12px!important;font-size:13px!important}.pos-compact-full #view-pos #cartTotal{font-size:21px!important}.pos-compact-full #view-pos .right-actions{gap:5px!important;margin-top:6px!important;padding-top:6px!important}.pos-compact-full #view-pos .right-actions .btn{min-height:34px!important;font-size:12px!important;padding:6px 8px!important}.pos-compact-full #view-pos .footer-note,.pos-compact-full #view-pos .shortcut-note{display:none!important}.pos-compact-full .pos-fs-exit{top:6px!important;right:6px!important;padding:8px 10px!important;font-size:12px!important;border-radius:10px!important;opacity:.88}}
@media (max-width:760px){body.pos-compact-full{overflow:auto!important}.pos-compact-full #appScreen,.pos-compact-full .app-shell,.pos-compact-full .main,.pos-compact-full #view-pos{height:auto!important;min-height:100dvh!important;max-height:none!important;overflow:auto!important}.pos-compact-full #view-pos .pos-layout{grid-template-columns:1fr!important;height:auto!important;min-height:0!important;overflow:visible!important}.pos-compact-full #view-pos .card{height:auto!important;min-height:0!important;padding:8px!important}.pos-compact-full #view-pos .scroll-card{height:auto!important}.pos-compact-full #view-pos .toolbar{grid-template-columns:1fr 1fr!important;gap:6px!important}.pos-compact-full #view-pos .product-row{grid-template-columns:48px 1fr 60px!important;gap:6px!important;padding:6px!important}.pos-compact-full #view-pos .product-row > :nth-child(3),.pos-compact-full #view-pos .product-row > :nth-child(4),.pos-compact-full #view-pos .product-row > :nth-child(5){display:none!important}}


    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 10 ===== */
:root{--touchPay:#16a34a;--touchWarn:#f59e0b;--touchDark:#0f172a;}
  html,body{min-height:100dvh;overscroll-behavior:none;-webkit-text-size-adjust:100%;}
  button,.btn,.nav-btn,.product-row,.product-tile{touch-action:manipulation;-webkit-tap-highlight-color:rgba(37,99,235,.18)}
  input,select,textarea{font-size:16px!important;}
  .android-mode .main{height:100dvh;overflow:auto;padding-bottom:92px;}
  .android-mode .view-section{height:auto;min-height:calc(100dvh - 40px);overflow:visible;}
  .android-mode .sidebar{max-height:100dvh;overflow:auto;}
  .android-mode .btn{min-height:54px;padding:14px 18px;border-radius:16px;}
  .android-mode .input,.android-mode .select,.android-mode .textarea{min-height:54px;border-radius:15px;}
  .android-mode .table-wrap{max-height:62dvh;overflow:auto;-webkit-overflow-scrolling:touch;}
  .android-mode #view-pos .pos-layout{height:auto;min-height:calc(100dvh - 104px);}
  .android-mode #view-pos .scroll-card{height:auto;max-height:none;position:relative;top:auto;}
  .android-mode #view-pos .right-actions{position:sticky;bottom:0;background:#fff;padding:12px;border-radius:18px;border:1px solid #e5edf8;box-shadow:0 -6px 20px rgba(15,23,42,.08);z-index:30;}
  .android-mode #view-pos #cartTotal{font-size:clamp(26px,4vw,42px)!important;}
  .android-mode #view-pos .summary-row.total{position:sticky;bottom:92px;z-index:20;}
  .android-mode #view-pos .product-list{max-height:calc(100dvh - 250px);overflow:auto;-webkit-overflow-scrolling:touch;}
  .android-mode #view-pos .product-row{min-height:90px;}
  .android-mode .modal-overlay{align-items:flex-start;padding:12px;padding-top:18px;overflow:auto;}
  .android-mode .modal-card{max-height:calc(100dvh - 28px);overflow:auto;width:100%;}
  .android-quickbar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:3500;background:rgba(255,255,255,.96);border-top:1px solid #dbe3ef;box-shadow:0 -8px 24px rgba(15,23,42,.12);padding:8px max(8px,env(safe-area-inset-left)) calc(8px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-right));gap:8px;grid-template-columns:1fr 1.4fr 1fr;backdrop-filter:blur(8px);}
  .android-mode #view-pos:not(.hidden) ~ .android-quickbar,.android-mode.pos-view-active .android-quickbar{display:grid;}
  .android-quickbar .btn{min-height:58px;font-size:16px;font-weight:900;border-radius:16px;padding:10px 12px;}
  .android-pay-btn{background:var(--touchPay)!important;color:#fff!important;}
  .android-cart-badge{position:fixed;right:12px;top:12px;z-index:3400;background:#0f172a;color:#fff;border-radius:999px;padding:8px 12px;font-weight:800;box-shadow:0 6px 18px rgba(15,23,42,.18);display:none;}
  .android-mode.pos-view-active .android-cart-badge{display:block;}
  .android-helper{display:none;margin-bottom:10px;border:1px solid #bfdbfe;background:#eff6ff;color:#1e3a8a;border-radius:16px;padding:12px;font-weight:700;line-height:1.35;}
  .android-mode #view-pos .android-helper{display:block;}
  .android-mode #cashAmount{font-size:26px!important;font-weight:900;text-align:right;}
  .android-mode #creditorName{font-size:20px!important;font-weight:800;}
  @media (orientation:portrait) and (max-width:900px){
    .android-mode #view-pos .topbar:after{content:'Tip: I-rotate sa landscape para mas maluwag ang POS at cart.';display:block;width:100%;margin-top:8px;background:#fff7ed;color:#9a3412;border:1px solid #fed7aa;border-radius:14px;padding:10px;font-weight:700;}
  }
  @media (max-width:900px){
    .android-mode .app-shell{display:block;}
    .android-mode .sidebar{position:relative;display:block;padding:10px;}
    .android-mode .sidebar h2,.android-mode .store-text,.android-mode .user-badge{display:none;}
    .android-mode .sidebar-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
    .android-mode .nav-group{margin:0;}
    .android-mode .nav-group-trigger{min-height:54px;padding:10px;font-size:14px;}
    .android-mode .nav-submenu{padding:6px;}
    .android-mode .nav-btn{min-height:48px;font-size:14px;padding:10px;}
    .android-mode #view-pos .toolbar{grid-template-columns:1fr 1fr!important;}
    .android-mode #view-pos .product-row{grid-template-columns:74px minmax(0,1fr) auto!important;}
    .android-mode #view-pos .product-row>*:nth-child(3),
    .android-mode #view-pos .product-row>*:nth-child(4),
    .android-mode #view-pos .product-row>*:nth-child(5){grid-column:2;}
    .android-mode #view-pos .product-row>*:last-child{grid-column:3;grid-row:1 / span 4;align-self:center;}
  }
  @media (min-width:901px) and (max-width:1366px){
    .android-mode .app-shell{grid-template-columns:220px 1fr;}
    .android-mode #view-pos .pos-layout{display:grid!important;grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr)!important;gap:12px!important;align-items:start!important;}
    .android-mode #view-pos .toolbar{grid-template-columns:1.15fr .8fr .8fr auto!important;gap:8px!important;}
    .android-mode #view-pos .product-row{grid-template-columns:74px minmax(0,1.4fr) .75fr .65fr .75fr auto!important;gap:8px!important;}
    .android-mode #view-pos .product-row .btn{min-width:78px!important;}
  }
  @media print{.android-quickbar,.android-cart-badge,.android-helper{display:none!important}.android-mode .main{padding-bottom:0!important}}


    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 11 ===== */
#androidQuickbar,.android-quickbar,.android-mode #view-pos:not(.hidden) ~ .android-quickbar,.android-mode.pos-view-active .android-quickbar{display:none!important;visibility:hidden!important;pointer-events:none!important;}
#view-pos .cashier-main-actions,#view-pos .right-actions.cashier-main-actions{display:grid!important;grid-template-columns:1fr 1.35fr 1fr!important;gap:8px!important;margin-top:10px!important;padding:10px 0 0!important;border-top:1px solid #e5e7eb!important;background:#fff!important;position:sticky!important;bottom:0!important;z-index:25!important;}
#view-pos .cashier-main-actions .btn{min-height:48px!important;font-size:15px!important;font-weight:900!important;border-radius:13px!important;padding:10px 12px!important;line-height:1.1!important;}
#view-pos .cashier-main-actions .cashier-pay-btn{background:#16a34a!important;color:#fff!important;}
#androidCartBadge,.android-cart-badge{display:none!important;}
@media (max-width:760px),(orientation:portrait){#view-pos .cashier-main-actions,#view-pos .right-actions.cashier-main-actions{grid-template-columns:1fr!important;position:relative!important;bottom:auto!important;}}


    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 12 ===== */
#view-pos .toolbar > div:has(#posCategoryFilter){display:none!important;}
#view-pos #posCategoryFilter{display:none!important;}
#view-pos .toolbar{grid-template-columns:minmax(0,1.4fr) minmax(150px,.7fr) auto!important;gap:8px!important;margin-bottom:6px!important;padding-bottom:6px!important;}
#view-pos .receipt-preview-wrap{margin-top:4px!important;gap:6px!important;min-height:0!important;}
#view-pos .receipt-preview-wrap .card-title{font-size:15px!important;margin-bottom:2px!important;padding-bottom:4px!important;}
#view-pos .receipt-preview-body{padding:8px!important;min-height:190px!important;max-height:calc(100dvh - 230px)!important;overflow:auto!important;}
#view-pos .receipt-head{padding-bottom:4px!important;margin-bottom:5px!important;}
#view-pos .receipt-head h3{font-size:15px!important;line-height:1.1!important;}
#view-pos .receipt-mini{font-size:10px!important;line-height:1.2!important;}
#view-pos .receipt-items th,#view-pos .receipt-items td{font-size:12px!important;padding:5px 3px!important;}
#view-pos .receipt-preview-wrap>.footer-note{display:none!important;}
@media (orientation:landscape) and (max-height:820px){#view-pos .receipt-preview-body{max-height:calc(100dvh - 185px)!important;min-height:150px!important;}#view-pos .receipt-head .receipt-mini:nth-of-type(n+2){display:none!important;}#view-pos .toolbar{grid-template-columns:minmax(0,1.5fr) minmax(130px,.65fr) auto!important;}}
@media (max-width:760px),(orientation:portrait){#view-pos .toolbar{grid-template-columns:1fr!important;}#view-pos .receipt-preview-body{max-height:50dvh!important;}}


    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 13 ===== */
body{font-family:Arial;padding:20px}table{width:100%;border-collapse:collapse}td,th{border:1px solid #ddd;padding:7px;text-align:left}

    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 14 ===== */
@page{size:${r.paperSize==='long'?'auto':r.paperSize};margin:8mm}body{font-family:Arial,sans-serif;padding:10px;color:#111}.center{text-align:center}h2,h3,p{margin:0 0 4px}table{width:100%;border-collapse:collapse;margin-top:10px}td,th{font-size:12px;padding:5px 3px;border-bottom:1px dashed #aaa}.totals div{display:flex;justify-content:space-between;margin-top:5px;font-size:13px}.grand{font-weight:700;font-size:15px;margin-top:8px}

    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 15 ===== */
html,
  body {
    width: 100% !important;
    height: 100% !important;
    min-height: 100dvh !important;
    overflow: auto !important;
  }

  #appScreen,
  .app-shell,
  .main,
  .view-section {
    min-height: 100dvh !important;
    height: auto !important;
    max-height: none !important;
    overflow: auto !important;
  }

  #view-pos {
    height: auto !important;
    min-height: 100dvh !important;
    max-height: none !important;
    overflow: auto !important;
    padding-bottom: 95px !important;
  }

  #view-pos .pos-layout,
  #view-pos .enhanced-pos-layout,
  body.pos-compact-full #view-pos .pos-layout,
  body.pos-compact-full #view-pos .enhanced-pos-layout {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    align-items: start !important;
  }

  #view-pos .card,
  #view-pos .scroll-card,
  #view-pos .enhanced-pos-layout > .card,
  body.pos-compact-full #view-pos .card,
  body.pos-compact-full #view-pos .scroll-card,
  body.pos-compact-full #view-pos .enhanced-pos-layout > .card {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  #view-pos .product-list {
    max-height: none !important;
    overflow: visible !important;
  }

  #view-pos .table-wrap,
  #view-pos .receipt-preview-body,
  #view-pos .receipt-preview,
  #view-pos .receipt-preview-wrap {
    max-height: 42dvh !important;
    overflow: auto !important;
    min-height: 0 !important;
  }

  #view-pos .right-actions {
    position: sticky !important;
    bottom: 0 !important;
    background: #ffffff !important;
    z-index: 30 !important;
    padding: 8px 0 10px !important;
    border-top: 1px solid #e5e7eb !important;
  }

  #posReceiptPrintArea {
    display: none;
  }

  .receipt-preview-box {
    max-height: 360px;
    overflow: auto;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    background: #ffffff;
    margin-bottom: 14px;
    padding: 8px;
  }

  .receipt-print-warning {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    color: #1e3a8a;
    border-radius: 12px;
    padding: 12px;
    margin-bottom: 14px;
    font-size: 14px;
    line-height: 1.4;
  }

  @media (orientation: landscape) and (min-width: 761px) and (max-width: 1366px) {
    #view-pos .pos-layout,
    #view-pos .enhanced-pos-layout,
    body.pos-compact-full #view-pos .pos-layout,
    body.pos-compact-full #view-pos .enhanced-pos-layout {
      display: grid !important;
      grid-template-columns: minmax(0, 1.05fr) minmax(330px, .95fr) !important;
      gap: 8px !important;
    }

    #view-pos .topbar {
      margin-bottom: 6px !important;
    }

    #view-pos .topbar h1 {
      font-size: 20px !important;
      line-height: 1.1 !important;
    }

    #view-pos .topbar p,
    #view-pos .footer-note,
    #view-pos .shortcut-note {
      display: none !important;
    }

    #view-pos .toolbar {
      grid-template-columns: 1fr 1fr !important;
      gap: 6px !important;
      margin-bottom: 6px !important;
      padding-bottom: 6px !important;
    }

    #view-pos label {
      font-size: 11px !important;
      margin-bottom: 3px !important;
    }

    #view-pos .input,
    #view-pos .select {
      min-height: 38px !important;
      font-size: 13px !important;
      padding: 8px 10px !important;
      border-radius: 10px !important;
    }

    #view-pos .card {
      padding: 8px !important;
      border-radius: 14px !important;
    }

    #view-pos .card-title {
      font-size: 16px !important;
      margin-bottom: 6px !important;
      padding-bottom: 6px !important;
    }

    #view-pos th,
    #view-pos td,
    #view-pos #cartTableBody td {
      font-size: 12px !important;
      padding: 6px 5px !important;
    }

    #view-pos .summary-row {
      grid-template-columns: 105px minmax(0, 1fr) !important;
      gap: 6px !important;
      padding: 5px 0 !important;
      font-size: 12px !important;
    }

    #view-pos .summary-row.total {
      grid-template-columns: 70px 1fr !important;
      padding: 8px 10px !important;
      margin-top: 5px !important;
    }

    #view-pos #cartTotal {
      font-size: 22px !important;
    }

    #view-pos .right-actions {
      gap: 6px !important;
      margin-top: 6px !important;
    }

    #view-pos .right-actions .btn {
      min-height: 36px !important;
      font-size: 12px !important;
      padding: 7px 8px !important;
      border-radius: 10px !important;
    }
  }

  @media (max-width: 760px), (orientation: portrait) {
    #view-pos .pos-layout,
    #view-pos .enhanced-pos-layout,
    body.pos-compact-full #view-pos .pos-layout,
    body.pos-compact-full #view-pos .enhanced-pos-layout {
      display: grid !important;
      grid-template-columns: 1fr !important;
      height: auto !important;
      overflow: visible !important;
    }

    #view-pos .table-wrap,
    #view-pos .receipt-preview-body,
    #view-pos .receipt-preview,
    #view-pos .receipt-preview-wrap {
      max-height: 55dvh !important;
    }

    #view-pos {
      padding-bottom: 120px !important;
    }
  }

  @media print {
    body * {
      visibility: hidden !important;
    }

    #posReceiptPrintArea,
    #posReceiptPrintArea * {
      visibility: visible !important;
    }

    #posReceiptPrintArea {
      display: block !important;
      position: absolute !important;
      left: 0 !important;
      top: 0 !important;
      width: 100% !important;
      background: #ffffff !important;
      padding: 0 !important;
      margin: 0 !important;
    }

    .modal-overlay,
    #appModalHost {
      display: none !important;
    }

    @page {
      size: 80mm auto;
      margin: 4mm;
    }

    html,
    body {
      background: #ffffff !important;
      overflow: visible !important;
    }
  }


    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 16 ===== */
#androidQuickbar,.android-quickbar,.android-mode #view-pos:not(.hidden) ~ .android-quickbar,.android-mode.pos-view-active .android-quickbar{display:none!important;visibility:hidden!important;pointer-events:none!important;}
#view-pos .cashier-main-actions,#view-pos .right-actions.cashier-main-actions{display:grid!important;grid-template-columns:1fr 1.35fr 1fr!important;gap:8px!important;margin-top:10px!important;padding:10px 0 0!important;border-top:1px solid #e5e7eb!important;background:#fff!important;position:sticky!important;bottom:0!important;z-index:25!important;}
#view-pos .cashier-main-actions .btn{min-height:48px!important;font-size:15px!important;font-weight:900!important;border-radius:13px!important;padding:10px 12px!important;line-height:1.1!important;}
#view-pos .cashier-main-actions .cashier-pay-btn{background:#16a34a!important;color:#fff!important;}
#androidCartBadge,.android-cart-badge{display:none!important;}
@media (max-width:760px),(orientation:portrait){#view-pos .cashier-main-actions,#view-pos .right-actions.cashier-main-actions{grid-template-columns:1fr!important;position:relative!important;bottom:auto!important;}}


    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 17 ===== */
#view-pos .toolbar > div:has(#posCategoryFilter){display:none!important;}
#view-pos #posCategoryFilter{display:none!important;}
#view-pos .toolbar{grid-template-columns:minmax(0,1.4fr) minmax(150px,.7fr) auto!important;gap:8px!important;margin-bottom:6px!important;padding-bottom:6px!important;}
#view-pos .receipt-preview-wrap{margin-top:4px!important;gap:6px!important;min-height:0!important;}
#view-pos .receipt-preview-wrap .card-title{font-size:15px!important;margin-bottom:2px!important;padding-bottom:4px!important;}
#view-pos .receipt-preview-body{padding:8px!important;min-height:190px!important;max-height:calc(100dvh - 230px)!important;overflow:auto!important;}
#view-pos .receipt-head{padding-bottom:4px!important;margin-bottom:5px!important;}
#view-pos .receipt-head h3{font-size:15px!important;line-height:1.1!important;}
#view-pos .receipt-mini{font-size:10px!important;line-height:1.2!important;}
#view-pos .receipt-items th,#view-pos .receipt-items td{font-size:12px!important;padding:5px 3px!important;}
#view-pos .receipt-preview-wrap>.footer-note{display:none!important;}
@media (orientation:landscape) and (max-height:820px){#view-pos .receipt-preview-body{max-height:calc(100dvh - 185px)!important;min-height:150px!important;}#view-pos .receipt-head .receipt-mini:nth-of-type(n+2){display:none!important;}#view-pos .toolbar{grid-template-columns:minmax(0,1.5fr) minmax(130px,.65fr) auto!important;}}
@media (max-width:760px),(orientation:portrait){#view-pos .toolbar{grid-template-columns:1fr!important;}#view-pos .receipt-preview-body{max-height:50dvh!important;}}


    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 18 ===== */
body.fullscreen-pos:not(.pos-view-active) .sidebar{display:block!important}body.fullscreen-pos:not(.pos-view-active) .app-shell{grid-template-columns:260px 1fr!important}body.fullscreen-pos:not(.pos-view-active) .main{padding:20px!important;width:auto!important}body.pos-view-active.fullscreen-pos .sidebar{display:none!important}body.pos-view-active.fullscreen-pos .app-shell{grid-template-columns:1fr!important}
body.pos-view-active #appScreen,body.pos-view-active .app-shell,body.pos-view-active .main,body.pos-view-active #view-pos{height:100dvh!important;max-height:100dvh!important;overflow:hidden!important}body.pos-view-active .main{padding:8px!important}body.pos-view-active #view-pos{padding-bottom:0!important}body.pos-view-active #view-pos .topbar{min-height:36px!important;margin-bottom:6px!important;flex:0 0 auto!important}body.pos-view-active #view-pos .topbar h1{font-size:20px!important;line-height:1.05!important}body.pos-view-active #view-pos .topbar p{display:none!important}
body.pos-view-active #view-pos .enhanced-pos-layout,body.pos-view-active #view-pos .pos-layout{display:grid!important;grid-template-columns:minmax(0,1.04fr) minmax(350px,.96fr)!important;gap:8px!important;height:calc(100dvh - 52px)!important;max-height:calc(100dvh - 52px)!important;min-height:0!important;overflow:hidden!important;align-items:stretch!important}body.pos-view-active #view-pos .enhanced-pos-layout>.card,body.pos-view-active #view-pos .pos-layout>.card,body.pos-view-active #view-pos .scroll-card{height:100%!important;min-height:0!important;max-height:100%!important;overflow:hidden!important;display:flex!important;flex-direction:column!important;padding:8px!important}
body.pos-view-active #view-pos .toolbar>div:has(#posCategoryFilter),body.pos-view-active #view-pos #posCategoryFilter{display:none!important}body.pos-view-active #view-pos .toolbar{flex:0 0 auto!important;display:grid!important;grid-template-columns:minmax(0,1.55fr) minmax(130px,.72fr) auto!important;gap:6px!important;margin:0 0 6px!important;padding:0 0 6px!important}body.pos-view-active #view-pos label{font-size:11px!important;margin-bottom:2px!important}body.pos-view-active #view-pos .input,body.pos-view-active #view-pos .select{min-height:36px!important;font-size:13px!important;padding:7px 9px!important;border-radius:10px!important}
body.pos-view-active #view-pos .receipt-preview-wrap{flex:1 1 auto!important;min-height:0!important;overflow:hidden!important;gap:4px!important;margin-top:0!important}body.pos-view-active #view-pos .receipt-preview-wrap .card-title{flex:0 0 auto!important;font-size:14px!important;padding-bottom:3px!important;margin:0!important}body.pos-view-active #view-pos .receipt-preview-body{flex:1 1 auto!important;min-height:0!important;max-height:none!important;overflow:auto!important;padding:7px!important}body.pos-view-active #view-pos .product-list,body.pos-view-active #view-pos .table-wrap,body.pos-view-active #view-pos .modal-body-scroll,body.pos-view-active #view-pos .report-panels{min-height:0!important;overflow:auto!important}body.pos-view-active #view-pos .scroll-card>.table-wrap{flex:1 1 auto!important;min-height:70px!important;max-height:none!important;overflow:auto!important}
body.pos-view-active #view-pos .card-title{flex:0 0 auto!important;font-size:15px!important;margin-bottom:5px!important;padding-bottom:5px!important}body.pos-view-active #view-pos #selectedCartItemBox{flex:0 0 auto!important;padding:7px 9px!important;margin-bottom:5px!important}body.pos-view-active #view-pos #selectedCartItemBox strong{font-size:13px!important;line-height:1.1!important}body.pos-view-active #view-pos #selectedCartItemBox .small{font-size:10px!important;line-height:1.1!important}body.pos-view-active #view-pos th,body.pos-view-active #view-pos td,body.pos-view-active #view-pos #cartTableBody td{font-size:11px!important;padding:5px 4px!important;line-height:1.15!important}body.pos-view-active #view-pos .summary-row{flex:0 0 auto!important;display:grid!important;grid-template-columns:92px minmax(0,1fr)!important;gap:5px!important;padding:4px 0!important;font-size:11px!important;line-height:1.15!important}body.pos-view-active #view-pos .summary-row.total{grid-template-columns:65px 1fr!important;padding:7px 9px!important;margin-top:4px!important;border-radius:12px!important}body.pos-view-active #view-pos #cartTotal{font-size:21px!important;line-height:1!important;justify-self:end!important}body.pos-view-active #view-pos #cartSubtotal,body.pos-view-active #view-pos #promoDiscountLabel,body.pos-view-active #view-pos #cartChange,body.pos-view-active #view-pos .summary-row strong{font-size:12px!important}
body.pos-view-active #view-pos .cashier-main-actions,body.pos-view-active #view-pos .right-actions.cashier-main-actions{flex:0 0 auto!important;position:sticky!important;bottom:0!important;z-index:60!important;display:grid!important;grid-template-columns:1fr 1.45fr 1fr!important;gap:8px!important;margin-top:5px!important;padding:8px 0 0!important;border-top:1px solid #dbe3ef!important;background:#fff!important;box-shadow:0 -6px 14px rgba(15,23,42,.06)!important}body.pos-view-active #view-pos .cashier-main-actions .btn{min-height:58px!important;height:58px!important;font-size:18px!important;font-weight:900!important;border-radius:14px!important;padding:8px 10px!important;line-height:1!important}body.pos-view-active #view-pos .cashier-main-actions .cashier-pay-btn{font-size:22px!important;background:#16a34a!important;color:#fff!important}body.pos-view-active #view-pos .footer-note,body.pos-view-active #view-pos .shortcut-note,body.pos-view-active #view-pos .receipt-preview-wrap>.footer-note{display:none!important}.gcash-history-scroll-wrap{max-height:48dvh!important;overflow:auto!important}
@media(max-width:760px),(orientation:portrait){body.pos-view-active #view-pos .enhanced-pos-layout,body.pos-view-active #view-pos .pos-layout{grid-template-columns:1fr!important;height:calc(100dvh - 46px)!important;max-height:calc(100dvh - 46px)!important;overflow:auto!important}body.pos-view-active #view-pos .enhanced-pos-layout>.card,body.pos-view-active #view-pos .pos-layout>.card,body.pos-view-active #view-pos .scroll-card{height:auto!important;min-height:360px!important}body.pos-view-active #view-pos .cashier-main-actions,body.pos-view-active #view-pos .right-actions.cashier-main-actions{grid-template-columns:1fr 1.3fr 1fr!important;position:sticky!important;bottom:0!important}}


    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 19 ===== */
/* Cashier POS only: hide category filter and category column */
  #view-pos #posCategoryFilter,
  #view-pos #posCategoryFilterLabel,
  #view-pos .pos-category-filter-wrap,
  #view-pos .toolbar > div:has(#posCategoryFilter) {
    display: none !important;
  }

  #view-pos .product-row > :nth-child(3) {
    display: none !important;
  }

  #view-pos .product-row {
    grid-template-columns: 70px minmax(0,1.8fr) .65fr .7fr auto !important;
  }

  body.pos-compact-full #view-pos .product-row,
  .pos-compact-full #view-pos .product-row {
    grid-template-columns: 46px minmax(0,1.7fr) .55fr .6fr 52px !important;
  }

  /* Fullscreen POS: page should not scroll; only fields/list/table scroll */
  body.pos-compact-full,
  body.pos-compact-full #appScreen,
  body.pos-compact-full .app-shell,
  body.pos-compact-full .main,
  body.pos-compact-full #view-pos {
    overflow: hidden !important;
  }

  body.pos-compact-full #view-pos .pos-layout {
    height: calc(100dvh - 12px) !important;
    max-height: calc(100dvh - 12px) !important;
    overflow: hidden !important;
    align-items: stretch !important;
  }

  body.pos-compact-full #view-pos .pos-layout > .card {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.pos-compact-full #view-pos .product-list,
  body.pos-compact-full #view-pos .table-wrap,
  body.pos-compact-full #view-pos .receipt-preview,
  body.pos-compact-full #view-pos .receipt-preview-body,
  body.pos-compact-full #view-pos .receipt-preview-wrap {
    overflow: auto !important;
    min-height: 0 !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* Cart area: fixed bottom action buttons */
  body.pos-compact-full #view-pos .scroll-card {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding-bottom: 8px !important;
  }

  body.pos-compact-full #view-pos .scroll-card > .table-wrap {
    flex: 1 1 auto !important;
    min-height: 90px !important;
    max-height: none !important;
  }

  body.pos-compact-full #view-pos .right-actions {
    flex: 0 0 auto !important;
    position: sticky !important;
    bottom: 0 !important;
    z-index: 40 !important;
    display: grid !important;
    grid-template-columns: 1fr 1.25fr 1fr !important;
    gap: 8px !important;
    background: #ffffff !important;
    padding: 8px 0 0 !important;
    border-top: 1px solid #e5e7eb !important;
    margin-top: 8px !important;
  }

  body.pos-compact-full #view-pos .right-actions .btn {
    min-height: 58px !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    border-radius: 14px !important;
    padding: 10px 12px !important;
    white-space: nowrap !important;
  }

  body.pos-compact-full #view-pos .right-actions .btn:nth-child(2) {
    background: #059669 !important;
    color: #ffffff !important;
    font-size: 22px !important;
  }

  @media (max-width: 900px) {
    body.pos-compact-full #view-pos .right-actions .btn {
      min-height: 52px !important;
      font-size: 15px !important;
    }
    body.pos-compact-full #view-pos .right-actions .btn:nth-child(2) {
      font-size: 18px !important;
    }
  }


    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 20 ===== */
/* Remove category chips/pills under receipt preview */
  #view-pos #posCategoryButtons,
  #view-pos .android-category-buttons,
  #view-pos .cat-btn,
  body.pos-compact-full #view-pos #posCategoryButtons,
  body.pos-compact-full #view-pos .android-category-buttons,
  body.pos-compact-full #view-pos .cat-btn {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
  }

  /* Remove dropdown category filter too */
  #view-pos #posCategoryFilter,
  #view-pos .toolbar > div:has(#posCategoryFilter) {
    display: none !important;
  }

  /* Keep receipt preview / added item area visible */
  body.pos-compact-full #view-pos .receipt-preview,
  body.pos-compact-full #view-pos .receipt-preview-wrap,
  body.pos-compact-full #view-pos .receipt-preview-body,
  body.pos-compact-full #view-pos .table-wrap {
    min-height: 120px !important;
  }

  /* Fixed bottom action buttons */
  body.pos-compact-full #view-pos .right-actions,
  #view-pos .right-actions.cashier-main-actions {
    display: grid !important;
    grid-template-columns: 1fr 1.3fr 1fr !important;
    gap: 10px !important;
    position: sticky !important;
    bottom: 0 !important;
    z-index: 80 !important;
    background: #ffffff !important;
    padding: 10px 0 0 !important;
    border-top: 1px solid #dbe3ef !important;
  }

  body.pos-compact-full #view-pos .right-actions .btn,
  #view-pos .right-actions.cashier-main-actions .btn {
    min-height: 64px !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    border-radius: 16px !important;
  }

  body.pos-compact-full #view-pos .right-actions .btn:nth-child(2),
  #view-pos .right-actions.cashier-main-actions .btn:nth-child(2) {
    font-size: 24px !important;
  }


    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 21 ===== */
/* Scroll/table fix without changing original design */
.table-wrap{overflow:auto!important;max-height:420px;position:relative;}
.table-wrap table{min-width:760px;}
.table-wrap thead th{position:sticky;top:0;z-index:2;background:#f8fafc;}
.table-wrap th:last-child,.table-wrap td:last-child{position:sticky;right:0;z-index:1;background:#fff;box-shadow:-8px 0 14px rgba(15,23,42,.04);}
.table-wrap thead th:last-child{z-index:3;background:#f8fafc;}
.product-list{overflow:auto!important;max-height:calc(100vh - 240px);}
#view-pos .product-list{min-height:0;}
#view-pos .scroll-card .table-wrap{flex:1 1 auto;min-height:120px;max-height:none;}
#view-sales .table-wrap,#view-products .table-wrap,#view-audit .table-wrap,#view-credit .table-wrap{max-height:calc(100vh - 210px)!important;}
.gcash-load-total-box{margin-bottom:12px;text-align:center;}


    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 22 ===== */
/* PATCH v3: top color strip only; no layout push and no blocking of menu/exit/payment controls */
  :root{--tc-banner-height:12px;}
  body.tc-banner-ready{padding-top:0!important;}
  body.tc-banner-ready #loginScreen{min-height:100vh!important;}
  body.tc-banner-ready #appScreen,
  body.tc-banner-ready .app-shell{min-height:100vh!important;}
  body.tc-banner-ready .main{height:100vh!important;}
  body.tc-banner-ready.fullscreen-pos .main,
  body.tc-banner-ready.pos-view-active .main,
  body.tc-banner-ready #view-pos{max-height:100dvh!important;}
  #threeColorFixedBanner{
    position:fixed!important;top:0!important;left:0!important;right:0!important;height:var(--tc-banner-height)!important;
    z-index:99999!important;display:block!important;pointer-events:none!important;
    overflow:hidden!important;border-bottom:1px solid rgba(15,23,42,.18)!important;box-shadow:0 2px 10px rgba(0,0,0,.10)!important;
    background:linear-gradient(90deg,rgba(220,38,38,.94),rgba(255,255,255,.96),rgba(22,163,74,.94))!important;
  }
  #threeColorFixedBanner::before{content:"";position:absolute;inset:-100% -30%;background:linear-gradient(90deg,rgba(220,38,38,.9),rgba(255,255,255,.95),rgba(22,163,74,.9),rgba(255,255,255,.95),rgba(220,38,38,.9));background-size:300% 100%;animation:tcBannerFade 2.4s linear infinite;filter:blur(5px);opacity:.90;}
  #threeColorFixedBanner::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(220,38,38,.50) 0 33.33%,rgba(255,255,255,.72) 33.33% 66.66%,rgba(22,163,74,.50) 66.66% 100%);animation:tcBannerBlink 1.15s ease-in-out infinite;}
  #threeColorFixedBanner .tc-banner-label{display:none!important;}
  @keyframes tcBannerFade{0%{background-position:0 0;}100%{background-position:300% 0;}}
  @keyframes tcBannerBlink{0%,100%{opacity:.48;}50%{opacity:1;}}
  /* Keep POS payment area stable after the top banner change */
  body.pos-view-active #view-pos .cashier-main-actions,
  body.pos-view-active #view-pos .right-actions.cashier-main-actions{
    position:sticky!important;bottom:0!important;z-index:60!important;margin-top:5px!important;
  }
  body.pos-view-active #view-pos .scroll-card{height:calc(100dvh - 56px)!important;}
  body.fullscreen-pos.pos-view-active #view-pos .scroll-card{height:calc(100dvh - 28px)!important;}
  #view-expenses .expense-summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:14px;}
  #view-expenses .expense-summary-card{background:#f8fafc;border:1px solid #dbe3ef;border-radius:16px;padding:14px;box-shadow:0 4px 14px rgba(15,23,42,.04);}
  #view-expenses .expense-summary-card .label{font-size:13px;color:#64748b;font-weight:800;margin-bottom:5px;}
  #view-expenses .expense-summary-card .value{font-size:24px;font-weight:900;color:#0f172a;overflow-wrap:anywhere;}
  #view-expenses .expense-actions{display:flex;gap:8px;flex-wrap:wrap;}
  #view-expenses .expense-actions .btn{min-height:42px!important;font-size:14px!important;padding:10px 12px!important;border-radius:12px!important;}
  @media(max-width:760px){#view-expenses .expense-summary-grid{grid-template-columns:1fr;}}


    /* OFFLINE TRANSACTION READY STATUS */
    .offline-status-bar{position:fixed;left:50%;top:10px;transform:translateX(-50%);z-index:5000;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;box-shadow:0 8px 24px rgba(15,23,42,.12);font-size:14px;font-weight:800;letter-spacing:.2px}
    .offline-status-bar.offline{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
    .offline-status-bar.pending{background:#fffbeb;color:#92400e;border-color:#fcd34d}
    .offline-status-dot{width:10px;height:10px;border-radius:999px;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
    .offline-safe-note{margin-top:10px;padding:10px 12px;border-radius:14px;background:#fffbeb;color:#92400e;border:1px solid #fcd34d;font-size:13px;font-weight:700}


/* ===== Extracted style block 23 ===== */
/* FINAL FIX: screenshot-like cashier layout, no broken JS */
body.pos-view-active, body.pos-compact-full{overflow:hidden!important;background:#eef2f7!important;}
body.pos-view-active #appScreen{display:block!important;min-height:100dvh!important;}
body.pos-view-active .app-shell{display:block!important;min-height:100dvh!important;}
body.pos-view-active .sidebar{display:none!important;}
body.pos-view-active .main{padding:6px 8px!important;height:100dvh!important;overflow:hidden!important;background:#f4f7fb!important;}
body.pos-view-active #view-pos{height:calc(100dvh - 0px)!important;overflow:hidden!important;display:block!important;}
body.pos-view-active #view-pos .topbar{display:none!important;}
body.pos-view-active #view-pos .pos-layout,
body.pos-view-active #view-pos .enhanced-pos-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1.05fr) minmax(480px,.95fr)!important;
  gap:8px!important;
  height:calc(100dvh - 8px)!important;
  max-height:calc(100dvh - 8px)!important;
  min-height:0!important;
  overflow:hidden!important;
  align-items:stretch!important;
}
body.pos-view-active #view-pos .pos-layout>.card,
body.pos-view-active #view-pos .enhanced-pos-layout>.card,
body.pos-view-active #view-pos .scroll-card{
  min-height:0!important;height:100%!important;max-height:100%!important;overflow:hidden!important;
  display:flex!important;flex-direction:column!important;padding:8px!important;border-radius:10px!important;background:#fff!important;
  box-shadow:0 1px 6px rgba(15,23,42,.08)!important;border:1px solid #dbe5f1!important;
}
body.pos-view-active #view-pos .toolbar{
  display:grid!important;grid-template-columns:minmax(0,1.35fr) minmax(180px,.55fr) auto!important;
  gap:6px!important;align-items:end!important;margin:0 0 6px!important;padding:0!important;border:0!important;flex:0 0 auto!important;
}
body.pos-view-active #view-pos #posCategoryFilter,
body.pos-view-active #view-pos label:has(+ #posCategoryFilter),
body.pos-view-active #view-pos #posCategoryFilter+*{display:none!important;}
body.pos-view-active #view-pos .toolbar>div:has(#posCategoryFilter){display:none!important;}
body.pos-view-active #view-pos label{font-size:12px!important;margin-bottom:3px!important;color:#0f172a!important;font-weight:700!important;}
body.pos-view-active #view-pos .input,
body.pos-view-active #view-pos .select{min-height:34px!important;height:34px!important;font-size:13px!important;border-radius:7px!important;padding:7px 10px!important;border:1px solid #cbd5e1!important;}
body.pos-view-active #view-pos .btn{min-height:40px!important;font-size:13px!important;border-radius:9px!important;padding:8px 12px!important;}
body.pos-view-active #view-pos .product-list{display:none!important;}
body.pos-view-active #view-pos .receipt-preview-wrap{display:flex!important;flex:1 1 auto!important;min-height:0!important;overflow:hidden!important;margin:0!important;gap:5px!important;}
body.pos-view-active #view-pos .receipt-preview-wrap .card-title{font-size:14px!important;font-weight:800!important;margin:0!important;padding:0!important;border:0!important;}
body.pos-view-active #view-pos .receipt-preview-body{flex:1 1 auto!important;min-height:0!important;max-height:none!important;overflow:auto!important;border:1px solid #dbe5f1!important;border-radius:12px!important;background:#fff!important;padding:8px!important;}
body.pos-view-active #view-pos .receipt-head h3{font-size:14px!important;margin:0!important;text-align:center!important;}
body.pos-view-active #view-pos .receipt-mini{font-size:10px!important;color:#64748b!important;}
body.pos-view-active #view-pos .receipt-items th,
body.pos-view-active #view-pos .receipt-items td{font-size:11px!important;padding:5px!important;border-bottom:1px dashed #e5e7eb!important;}
body.pos-view-active #view-pos .card-title{font-size:14px!important;margin:0 0 5px!important;padding:0 0 4px!important;}
body.pos-view-active #view-pos .table-wrap{flex:1 1 auto!important;min-height:0!important;max-height:none!important;overflow:auto!important;border-radius:9px!important;background:#f8fafc!important;}
body.pos-view-active #view-pos table thead th{position:sticky!important;top:0!important;background:#f3f6fb!important;z-index:1!important;}
body.pos-view-active #view-pos th,
body.pos-view-active #view-pos td{font-size:11px!important;padding:7px 6px!important;}
body.pos-view-active #view-pos .summary-row{display:grid!important;grid-template-columns:88px minmax(0,1fr)!important;gap:6px!important;align-items:center!important;padding:4px 0!important;font-size:11px!important;border-bottom:1px dashed #e5e7eb!important;}
body.pos-view-active #view-pos .summary-row strong{font-size:12px!important;}
body.pos-view-active #view-pos .summary-row.total{border:1px solid #bbf7d0!important;background:#ecfdf5!important;border-radius:10px!important;margin-top:5px!important;padding:8px 10px!important;}
body.pos-view-active #view-pos #cartTotal{font-size:22px!important;color:#059669!important;font-weight:900!important;justify-self:end!important;}
body.pos-view-active #view-pos .right-actions.cashier-main-actions{display:grid!important;grid-template-columns:1fr 1.45fr 1fr!important;gap:8px!important;flex:0 0 auto!important;position:sticky!important;bottom:0!important;margin-top:6px!important;padding-top:6px!important;background:#fff!important;border-top:1px solid #e2e8f0!important;z-index:30!important;}
body.pos-view-active #view-pos .right-actions.cashier-main-actions .btn{height:54px!important;min-height:54px!important;font-size:19px!important;font-weight:900!important;border-radius:12px!important;}
body.pos-view-active #view-pos .right-actions.cashier-main-actions .cashier-pay-btn{background:#059669!important;color:#fff!important;}
body.pos-view-active #view-pos .right-actions.cashier-main-actions .btn-danger{background:#fee2e2!important;color:#991b1b!important;}
body.pos-view-active #view-pos .right-actions.cashier-main-actions .btn-dark{background:#1f2937!important;color:#fff!important;}
body.pos-view-active #posExitBtn{display:block!important;position:fixed!important;right:8px!important;top:8px!important;z-index:9000!important;background:#111827!important;color:#fff!important;border:0!important;border-radius:12px!important;padding:10px 14px!important;font-size:14px!important;font-weight:900!important;box-shadow:0 4px 12px rgba(0,0,0,.25)!important;}
body.pos-view-active #offlineStatusBar{top:8px!important;z-index:8999!important;}
.tc-mid-action-bar{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin:7px 0 4px;flex:0 0 auto;}
.tc-mid-action-bar button{height:50px;background:#fff;color:#ef4444;border:2px solid #ef4444;border-radius:0;font-weight:800;letter-spacing:.02em;}
body:not(.pos-view-active) .tc-mid-action-bar{display:none!important;}
body.pos-view-active #view-pos .footer-note,body.pos-view-active #view-pos .shortcut-note{display:none!important;}
@media(max-width:900px), (orientation:portrait){
  body.pos-view-active #view-pos .pos-layout,body.pos-view-active #view-pos .enhanced-pos-layout{grid-template-columns:1fr!important;overflow:auto!important;height:100dvh!important;max-height:100dvh!important;}
  body.pos-view-active #view-pos .pos-layout>.card,body.pos-view-active #view-pos .enhanced-pos-layout>.card{height:auto!important;min-height:420px!important;}
}


/* ===== Extracted style block 24 ===== */
#view-pos .right-actions.cashier-main-actions,
  #view-pos .right-actions.cashier-main-actions .btn,
  #androidQuickbar,
  .android-quickbar,
  .android-cart-badge{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
    height:0!important;
    min-height:0!important;
    max-height:0!important;
    overflow:hidden!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
  }
  #view-pos .scroll-card{position:relative!important;padding-top:0!important;}
  #view-pos .card-title{
    background:linear-gradient(135deg,#0f172a,#1d4ed8)!important;
    color:#fff!important;
    padding:12px 16px!important;
    border-radius:16px!important;
    border-bottom:0!important;
    box-shadow:0 8px 20px rgba(15,23,42,.14)!important;
  }
  #view-pos .toolbar{
    background:linear-gradient(135deg,#fff7ed,#eff6ff)!important;
    border:1px solid #dbeafe!important;
    border-radius:18px!important;
    padding:12px!important;
    box-shadow:0 8px 22px rgba(15,23,42,.07)!important;
  }
  .tc-top-actions{
    display:grid;
    grid-template-columns:1fr 1.2fr 1fr;
    gap:10px;
    margin:12px 0 12px;
    padding:12px;
    border-radius:20px;
    background:linear-gradient(135deg,#f8fafc,#eef2ff);
    border:1px solid #dbeafe;
    box-shadow:0 10px 25px rgba(15,23,42,.08);
  }
  .tc-top-actions .btn{
    min-height:58px!important;
    border-radius:16px!important;
    font-size:18px!important;
    font-weight:900!important;
    letter-spacing:.4px!important;
    box-shadow:0 8px 18px rgba(15,23,42,.10)!important;
    transform:none!important;
  }
  .tc-top-actions .tc-clear{
    background:#fff1f2!important;
    color:#be123c!important;
    border:2px solid #fecdd3!important;
  }
  .tc-top-actions .tc-pay{
    background:linear-gradient(135deg,#059669,#10b981)!important;
    color:#fff!important;
    border:2px solid #34d399!important;
    font-size:22px!important;
  }
  .tc-top-actions .tc-print{
    background:linear-gradient(135deg,#111827,#334155)!important;
    color:#fff!important;
    border:2px solid #64748b!important;
  }
  .tc-top-actions .btn:hover{filter:brightness(1.04);}
  #view-pos .summary-row.total{
    background:linear-gradient(135deg,#ecfdf5,#f0fdf4)!important;
    border:1px solid #86efac!important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.55)!important;
  }
  @media (max-width:760px){
    .tc-top-actions{grid-template-columns:1fr;}
    .tc-top-actions .btn{width:100%;}
  }


/* ===== Extracted style block 25 ===== */
/* Hide the older red-outline duplicate action bar and bottom/Android quick bars */
  #tcMidActionBar,
  #view-pos .tc-mid-action-bar,
  #view-pos .right-actions,
  #androidQuickbar,
  .android-quickbar,
  .android-cart-badge{
    display:none !important;
    visibility:hidden !important;
    pointer-events:none !important;
    height:0 !important;
    min-height:0 !important;
    max-height:0 !important;
    overflow:hidden !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
  }
  /* Keep only this clean upper action bar */
  #view-pos .tc-top-actions{
    display:grid !important;
    grid-template-columns:1fr 1.15fr 1fr !important;
    gap:12px !important;
    margin:12px 0 12px !important;
    padding:12px !important;
    border-radius:20px !important;
    background:linear-gradient(135deg,#f8fafc,#eef2ff) !important;
    border:1px solid #dbeafe !important;
    box-shadow:0 10px 24px rgba(15,23,42,.08) !important;
  }
  #view-pos .tc-top-actions .btn{
    min-height:56px !important;
    border-radius:16px !important;
    font-size:18px !important;
    font-weight:900 !important;
    letter-spacing:.4px !important;
    box-shadow:0 8px 18px rgba(15,23,42,.10) !important;
  }
  @media (max-width:760px){
    #view-pos .tc-top-actions{grid-template-columns:1fr !important;}
  }


/* ===== Extracted style block 26 ===== */
/* Clean final patch: hide old backup UI remnants and improve stock preview */
  [data-view="backup"], #view-backup, .icon-backup { display:none !important; }
  #inventoryStockSummary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 12px 0}
  #inventoryStockSummary .stock-counter{border:1px solid #dbe3ef;border-radius:14px;background:#fff;padding:12px;text-align:center;box-shadow:0 4px 12px rgba(15,23,42,.05)}
  #inventoryStockSummary .stock-counter strong{display:block;font-size:24px;margin-bottom:4px}
  #inventoryStockSummary .stock-counter.neg strong{color:#dc2626}
  #inventoryStockSummary .stock-counter.nonzero strong{color:#2563eb}
  #inventoryStockSummary .stock-counter.zero strong{color:#059669}
  .decimal-product-note{font-size:12px;color:#059669;font-weight:700;margin-top:4px}
  .decimal-mode-chip{display:inline-block;padding:4px 8px;border-radius:999px;background:#ecfdf5;color:#047857;font-size:12px;font-weight:800;margin-left:6px}
  .cart-unit-sub{display:block;font-size:12px;color:#64748b;margin-top:3px;font-weight:600}

/* PRODUCT MODAL LAYOUT PATCH */
.product-topbar .inline-actions{align-items:center;justify-content:flex-end;}
.product-list-card{height:calc(100vh - 120px);display:flex;flex-direction:column;overflow:hidden;}
.product-table-wrap{flex:1;max-height:none;}
.product-modal-card{max-width:920px;width:min(920px,96vw);max-height:92vh;overflow:auto;}
.product-modal-actions{position:sticky;bottom:0;background:#fff;padding-top:14px;margin-top:8px;border-top:1px solid #e8eef6;}
body.product-modal-open{overflow:hidden;}
@media (max-width:760px){.product-list-card{height:auto;min-height:calc(100vh - 130px)}.product-modal-card{width:96vw;max-height:90vh}.product-topbar{align-items:stretch}.product-topbar .inline-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.product-topbar .btn{width:100%;}}

/* PRODUCT MODAL FIXED-SCREEN SCROLL FIX */
#productModal.modal-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 9000 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding: 18px 12px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  background: rgba(15, 23, 42, 0.55) !important;
}
#productModal.modal-overlay.hidden {
  display: none !important;
}
#productModal .product-modal-card {
  position: relative !important;
  width: min(920px, calc(100vw - 28px)) !important;
  max-width: 920px !important;
  max-height: none !important;
  height: auto !important;
  margin: 0 auto 18px auto !important;
  overflow: visible !important;
  border-radius: 22px !important;
  padding: 20px 22px !important;
}
#productModal .product-modal-actions {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 20 !important;
  background: #fff !important;
  padding: 12px 0 0 0 !important;
  margin-top: 14px !important;
  border-top: 1px solid #e8eef6 !important;
  box-shadow: 0 -10px 18px rgba(255,255,255,.92) !important;
}
body.product-modal-open {
  overflow: hidden !important;
}
@media (max-width: 760px) {
  #productModal.modal-overlay {
    padding: 8px !important;
  }
  #productModal .product-modal-card {
    width: calc(100vw - 16px) !important;
    padding: 14px !important;
    border-radius: 18px !important;
  }
  #productModal .grid-2,
  #productModal .grid-3 {
    grid-template-columns: 1fr !important;
  }
  #productModal .product-modal-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }
}

/* =========================================================
   LOGIN SPLIT IMAGE LAYOUT + SETTINGS PREVIEW
   Safe frontend-only update. Does not touch SQL/database.
   ========================================================= */
.login-split-shell{
  min-height:100vh;
  padding:28px;
  background:
    radial-gradient(circle at 15% 15%, rgba(15,76,129,.10), transparent 28%),
    radial-gradient(circle at 85% 90%, rgba(245,158,11,.14), transparent 30%),
    linear-gradient(135deg,#fffaf0 0%,#f1f8ff 100%);
}
.login-split-card{
  width:min(1120px,96vw);
  min-height:min(660px,88vh);
  margin:auto;
  display:grid;
  grid-template-columns:minmax(360px, .95fr) minmax(420px, 1.25fr);
  overflow:hidden;
  background:rgba(255,255,255,.96);
  border:7px solid #0b4f4d;
  border-radius:30px;
  box-shadow:0 24px 70px rgba(15,23,42,.18);
}
.login-form-side{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:58px 62px;
  background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
}
.login-mini-brand{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:58px;
  font-weight:900;
  color:#173b70;
  letter-spacing:.2px;
}
.login-logo-mark{
  width:36px;
  height:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  background:linear-gradient(135deg,#0f766e,#f59e0b);
  color:#fff;
  font-size:12px;
  font-weight:900;
  box-shadow:0 10px 22px rgba(15,118,110,.22);
}
.login-split-card .brand-title{
  font-size:38px;
  line-height:1.08;
  color:#23145f;
  margin-bottom:10px;
}
.login-split-card .brand-sub{
  margin-bottom:34px;
  color:#6b7280;
  font-weight:700;
}
.login-split-card .form-group{margin-bottom:18px}
.login-split-card .input{
  min-height:58px;
  border-radius:14px;
  border:2px solid #d9e2ec;
  background:#fff;
  font-size:16px;
}
.login-split-card .input:focus{
  border-color:#0f766e;
  box-shadow:0 0 0 4px rgba(15,118,110,.13);
}
.login-split-card .btn-primary{
  min-height:58px;
  border-radius:14px;
  background:linear-gradient(135deg,#0f766e,#0e7490);
  box-shadow:0 18px 30px rgba(15,118,110,.20);
}
.login-split-card .hint-box{
  margin-top:52px;
  background:transparent;
  border:none;
  padding:0;
  color:#8a94a6;
  font-size:12px;
  line-height:1.55;
}
.login-image-side{
  position:relative;
  min-height:100%;
  background:
    linear-gradient(135deg,rgba(5,150,105,.88),rgba(15,23,42,.9)),
    radial-gradient(circle at center,#34d399 0%,#064e3b 75%);
  overflow:hidden;
}
.login-image-side img{
  width:100%;
  height:100%;
  min-height:100%;
  object-fit:cover;
  display:block;
  filter:saturate(1.08) contrast(1.04);
}
.login-image-side::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.06),rgba(0,0,0,.30));
  pointer-events:none;
}
.login-image-side.login-no-image img{display:none}
.login-image-side.login-no-image{
  background:
    radial-gradient(circle at 25% 20%, rgba(255,255,255,.25), transparent 18%),
    radial-gradient(circle at 70% 75%, rgba(250,204,21,.30), transparent 24%),
    linear-gradient(135deg,#064e3b,#0f766e 52%,#0f172a);
}
.login-image-glass{
  position:absolute;
  border:1px solid rgba(255,255,255,.30);
  background:rgba(255,255,255,.15);
  backdrop-filter:blur(3px);
  z-index:2;
  transform:rotate(-16deg);
}
.login-glass-1{width:92px;height:210px;left:48px;top:120px;border-radius:18px}
.login-glass-2{width:78px;height:185px;right:52px;top:82px;border-radius:18px;transform:rotate(18deg)}
.login-image-caption{
  position:absolute;
  left:32px;
  right:32px;
  bottom:28px;
  z-index:3;
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:18px 20px;
  border-radius:22px;
  color:#fff;
  background:rgba(15,23,42,.30);
  border:1px solid rgba(255,255,255,.26);
  backdrop-filter:blur(6px);
}
.login-image-caption strong{font-size:22px}
.login-image-caption span{font-size:13px;color:rgba(255,255,255,.86)}
.login-image-thumb-list{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(74px,1fr));
  gap:8px;
  margin-top:10px;
}
.login-image-thumb-list img{
  width:100%;
  height:54px;
  object-fit:cover;
  border-radius:10px;
  border:1px solid #dbe3ef;
  background:#f8fafc;
}
@media (max-width:900px){
  .login-split-shell{padding:16px;align-items:center}
  .login-split-card{grid-template-columns:1fr;min-height:auto;border-width:4px;border-radius:24px}
  .login-form-side{padding:34px 24px}
  .login-mini-brand{margin-bottom:24px}
  .login-image-side{min-height:240px;order:-1}
  .login-split-card .brand-title{font-size:30px}
}


/* LOGIN IMAGE HOLDER / SETTINGS MANAGER */
.login-image-settings-card{overflow:visible;}
.login-image-manager-note{background:#eff6ff;color:#1e3a8a;border:1px solid #bfdbfe;border-radius:16px;padding:12px 14px;margin:8px 0 16px;font-size:14px;line-height:1.45;}
.login-image-slot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;}
.login-image-slot{border:1px solid #dbeafe;background:linear-gradient(180deg,#ffffff,#f8fbff);border-radius:18px;padding:12px;box-shadow:0 8px 20px rgba(15,23,42,.05);}
.login-image-slot-title{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:14px;font-weight:800;color:#1e3a8a;margin-bottom:10px;}
.login-image-slot-preview{height:140px;border-radius:16px;overflow:hidden;border:1px dashed #bfdbfe;background:#eef6ff;display:flex;align-items:center;justify-content:center;margin-bottom:10px;color:#64748b;font-size:13px;font-weight:700;text-align:center;}
.login-image-slot-preview img{width:100%;height:100%;object-fit:cover;display:block;}
.login-image-slot .input{min-height:42px;font-size:13px;padding:10px 12px;border-radius:12px;}
.login-image-slot-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px;}
.login-image-slot-actions .btn{min-height:42px!important;font-size:13px!important;padding:9px 10px!important;border-radius:12px!important;}
.login-image-thumb-list{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px;}
.login-image-thumb-list img{width:74px;height:54px;object-fit:cover;border-radius:12px;border:1px solid #dbe3ef;}
@media (max-width:760px){.login-image-slot-grid{grid-template-columns:1fr}.login-image-slot-preview{height:180px}}


/* === V3 tablet/dashboard hotfix === */
#dashboardTopItems .table-wrap,
#dashboardLowStock .table-wrap{
  overflow-x: visible !important;
  max-width: 100%;
}
#dashboardTopItems table,
#dashboardLowStock table{
  width: 100% !important;
  min-width: 0 !important;
  table-layout: fixed;
}
#dashboardTopItems th, #dashboardTopItems td,
#dashboardLowStock th, #dashboardLowStock td{
  white-space: normal !important;
  word-break: break-word;
  font-size: 15px;
  padding: 10px 8px;
}
@media (pointer: coarse), (max-width: 1100px){
  .nav-btn, .btn, button, .input, .select{ min-height: 48px; }
  .stat .value{ font-size: 22px; }
  .card-title{ font-size: 18px; }
}

/* =========================================================
   POS V4 COMPACT TABLET PATCH
   Purpose: reduce unused white space in Cashier POS landscape/tablet view.
   Upload this style.css only if the current system already works.
   ========================================================= */
body.pos-view-active .offline-status-bar,
body.pos-compact-full .offline-status-bar{
  top:6px!important;
  padding:6px 12px!important;
  font-size:13px!important;
  opacity:.92!important;
}

body.pos-view-active #view-pos,
body.pos-compact-full #view-pos{
  padding-bottom:0!important;
}

@media (orientation: landscape) and (min-width: 900px){
  body.pos-view-active .main,
  body.pos-compact-full .main{
    padding:5px!important;
  }

  body.pos-view-active #view-pos .topbar,
  body.pos-compact-full #view-pos .topbar{
    min-height:0!important;
    height:0!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
  }

  body.pos-view-active #view-pos .enhanced-pos-layout,
  body.pos-view-active #view-pos .pos-layout,
  body.pos-compact-full #view-pos .enhanced-pos-layout,
  body.pos-compact-full #view-pos .pos-layout{
    display:grid!important;
    grid-template-columns:minmax(0, 1.02fr) minmax(420px, .98fr)!important;
    gap:7px!important;
    height:calc(100dvh - 10px)!important;
    max-height:calc(100dvh - 10px)!important;
    min-height:0!important;
    overflow:hidden!important;
    align-items:stretch!important;
  }

  body.pos-view-active #view-pos .card,
  body.pos-view-active #view-pos .scroll-card,
  body.pos-compact-full #view-pos .card,
  body.pos-compact-full #view-pos .scroll-card{
    padding:6px!important;
    border-radius:12px!important;
  }

  body.pos-view-active #view-pos .toolbar,
  body.pos-compact-full #view-pos .toolbar{
    grid-template-columns:minmax(0,1.7fr) minmax(150px,.55fr) 66px!important;
    gap:5px!important;
    margin:0 0 4px!important;
    padding:0 0 4px!important;
  }

  body.pos-view-active #view-pos label,
  body.pos-compact-full #view-pos label{
    font-size:10px!important;
    margin-bottom:1px!important;
    line-height:1!important;
  }

  body.pos-view-active #view-pos .input,
  body.pos-view-active #view-pos .select,
  body.pos-compact-full #view-pos .input,
  body.pos-compact-full #view-pos .select{
    min-height:32px!important;
    height:32px!important;
    font-size:12px!important;
    padding:5px 8px!important;
    border-radius:8px!important;
  }

  body.pos-view-active #view-pos .receipt-preview-wrap,
  body.pos-compact-full #view-pos .receipt-preview-wrap{
    flex:0 0 auto!important;
    min-height:0!important;
    max-height:230px!important;
    overflow:hidden!important;
    margin:0 0 5px!important;
    gap:2px!important;
  }

  body.pos-view-active #view-pos .receipt-preview-wrap .card-title,
  body.pos-compact-full #view-pos .receipt-preview-wrap .card-title{
    font-size:13px!important;
    height:20px!important;
    line-height:18px!important;
    padding:0 0 2px!important;
    margin:0!important;
  }

  body.pos-view-active #view-pos .receipt-preview-body,
  body.pos-view-active #view-pos .receipt-preview,
  body.pos-compact-full #view-pos .receipt-preview-body,
  body.pos-compact-full #view-pos .receipt-preview{
    min-height:150px!important;
    max-height:190px!important;
    overflow:auto!important;
    padding:6px!important;
  }

  body.pos-view-active #view-pos .receipt-head,
  body.pos-compact-full #view-pos .receipt-head{
    padding-bottom:2px!important;
    margin-bottom:3px!important;
  }

  body.pos-view-active #view-pos .receipt-head h3,
  body.pos-compact-full #view-pos .receipt-head h3{
    font-size:13px!important;
    line-height:1!important;
    margin:0!important;
  }

  body.pos-view-active #view-pos .receipt-mini,
  body.pos-compact-full #view-pos .receipt-mini{
    font-size:9px!important;
    line-height:1.05!important;
  }

  body.pos-view-active #view-pos .receipt-items th,
  body.pos-view-active #view-pos .receipt-items td,
  body.pos-compact-full #view-pos .receipt-items th,
  body.pos-compact-full #view-pos .receipt-items td{
    font-size:10px!important;
    padding:3px 2px!important;
    line-height:1.05!important;
  }

  body.pos-view-active #view-pos .product-list,
  body.pos-compact-full #view-pos .product-list{
    flex:1 1 auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:auto!important;
    gap:5px!important;
    margin-top:0!important;
  }

  body.pos-view-active #view-pos .product-row,
  body.pos-compact-full #view-pos .product-row{
    grid-template-columns:40px minmax(0,1.7fr) .55fr .42fr .52fr 48px!important;
    min-height:48px!important;
    gap:5px!important;
    padding:5px!important;
    border-radius:10px!important;
  }

  body.pos-view-active #view-pos .product-thumb.large,
  body.pos-compact-full #view-pos .product-thumb.large{
    width:36px!important;
    height:36px!important;
    border-radius:8px!important;
  }

  body.pos-view-active #view-pos .product-row .name,
  body.pos-compact-full #view-pos .product-row .name{
    font-size:11px!important;
    line-height:1.05!important;
  }

  body.pos-view-active #view-pos .product-row .meta,
  body.pos-compact-full #view-pos .product-row .meta{
    font-size:9px!important;
    line-height:1.05!important;
  }

  body.pos-view-active #view-pos .product-row .price,
  body.pos-compact-full #view-pos .product-row .price{
    font-size:11px!important;
  }

  body.pos-view-active #view-pos .product-row .btn,
  body.pos-compact-full #view-pos .product-row .btn{
    min-height:28px!important;
    font-size:10px!important;
    padding:3px 5px!important;
  }

  body.pos-view-active #view-pos .card-title,
  body.pos-compact-full #view-pos .card-title{
    font-size:13px!important;
    margin:0 0 4px!important;
    padding-bottom:3px!important;
    line-height:1.05!important;
  }

  body.pos-view-active #view-pos #selectedCartItemBox,
  body.pos-compact-full #view-pos #selectedCartItemBox{
    padding:4px 7px!important;
    margin-bottom:4px!important;
    border-radius:9px!important;
  }

  body.pos-view-active #view-pos #selectedCartItemBox .small,
  body.pos-compact-full #view-pos #selectedCartItemBox .small{
    display:none!important;
  }

  body.pos-view-active #view-pos .scroll-card>.table-wrap,
  body.pos-compact-full #view-pos .scroll-card>.table-wrap{
    flex:1 1 auto!important;
    min-height:110px!important;
    max-height:none!important;
    overflow:auto!important;
    border-radius:9px!important;
  }

  body.pos-view-active #view-pos th,
  body.pos-view-active #view-pos td,
  body.pos-view-active #view-pos #cartTableBody td,
  body.pos-compact-full #view-pos th,
  body.pos-compact-full #view-pos td,
  body.pos-compact-full #view-pos #cartTableBody td{
    font-size:10px!important;
    padding:4px 4px!important;
    line-height:1.05!important;
  }

  body.pos-view-active #view-pos .cart-thumb,
  body.pos-compact-full #view-pos .cart-thumb{
    width:24px!important;
    height:24px!important;
    border-radius:6px!important;
  }

  body.pos-view-active #view-pos .inline-actions,
  body.pos-compact-full #view-pos .inline-actions{
    gap:3px!important;
  }

  body.pos-view-active #view-pos #cartTableBody .btn,
  body.pos-compact-full #view-pos #cartTableBody .btn{
    min-height:26px!important;
    padding:3px 6px!important;
    font-size:10px!important;
    border-radius:8px!important;
  }

  body.pos-view-active #view-pos .summary-row,
  body.pos-compact-full #view-pos .summary-row{
    grid-template-columns:92px minmax(0,1fr)!important;
    padding:3px 0!important;
    gap:5px!important;
    font-size:10px!important;
    line-height:1.05!important;
  }

  body.pos-view-active #view-pos .summary-row strong,
  body.pos-view-active #view-pos #cartSubtotal,
  body.pos-view-active #view-pos #promoDiscountLabel,
  body.pos-view-active #view-pos #cartChange,
  body.pos-compact-full #view-pos .summary-row strong,
  body.pos-compact-full #view-pos #cartSubtotal,
  body.pos-compact-full #view-pos #promoDiscountLabel,
  body.pos-compact-full #view-pos #cartChange{
    font-size:11px!important;
  }

  body.pos-view-active #view-pos .summary-row.total,
  body.pos-compact-full #view-pos .summary-row.total{
    grid-template-columns:60px 1fr!important;
    padding:5px 8px!important;
    margin-top:3px!important;
    border-radius:10px!important;
  }

  body.pos-view-active #view-pos #cartTotal,
  body.pos-compact-full #view-pos #cartTotal{
    font-size:22px!important;
    line-height:1!important;
  }

  body.pos-view-active #view-pos .cashier-main-actions,
  body.pos-view-active #view-pos .right-actions.cashier-main-actions,
  body.pos-compact-full #view-pos .cashier-main-actions,
  body.pos-compact-full #view-pos .right-actions.cashier-main-actions{
    grid-template-columns:1fr 1.4fr 1fr!important;
    gap:6px!important;
    padding:6px 0 0!important;
    margin-top:3px!important;
  }

  body.pos-view-active #view-pos .cashier-main-actions .btn,
  body.pos-compact-full #view-pos .cashier-main-actions .btn{
    min-height:44px!important;
    height:44px!important;
    font-size:14px!important;
    border-radius:11px!important;
    padding:6px 8px!important;
  }

  body.pos-view-active #view-pos .cashier-main-actions .cashier-pay-btn,
  body.pos-compact-full #view-pos .cashier-main-actions .cashier-pay-btn{
    font-size:18px!important;
  }
}

/* ===== POS V5 TOUCHSCREEN PAYMENT MODE DESIGN PATCH =====
   Visual only: keeps the original select/input IDs so SQL and app logic are unchanged. */
body.pos-view-active #view-pos .pos-mode-source-select,
#view-pos .pos-mode-source-select,
.modal-card .pos-mode-source-select{
  position:absolute!important;
  opacity:0!important;
  pointer-events:none!important;
  width:1px!important;
  height:1px!important;
  min-height:1px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  overflow:hidden!important;
}
#view-pos .pos-payment-mode-tabs,
.modal-card .pos-payment-mode-tabs{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
  width:100%!important;
  margin-top:2px!important;
}
#view-pos .pos-mode-btn,
.modal-card .pos-mode-btn{
  min-height:74px!important;
  border-radius:18px!important;
  border:2px solid #d9e3f0!important;
  background:linear-gradient(180deg,#ffffff,#f8fbff)!important;
  box-shadow:0 6px 14px rgba(15,23,42,.06)!important;
  padding:10px 12px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:center!important;
  gap:3px!important;
  cursor:pointer!important;
  touch-action:manipulation!important;
  user-select:none!important;
}
#view-pos .pos-mode-btn .mode-title,
.modal-card .pos-mode-btn .mode-title{
  font-size:20px!important;
  line-height:1.05!important;
  font-weight:950!important;
  letter-spacing:.2px!important;
}
#view-pos .pos-mode-btn .mode-sub,
.modal-card .pos-mode-btn .mode-sub{
  font-size:11px!important;
  line-height:1.05!important;
  font-weight:800!important;
  opacity:.78!important;
}
#view-pos .pos-mode-btn.mode-cash{color:#166534!important;background:linear-gradient(180deg,#ecfdf5,#dcfce7)!important;border-color:#86efac!important;}
#view-pos .pos-mode-btn.mode-gcash{color:#1d4ed8!important;background:linear-gradient(180deg,#eff6ff,#dbeafe)!important;border-color:#93c5fd!important;}
#view-pos .pos-mode-btn.mode-credit{color:#991b1b!important;background:linear-gradient(180deg,#fff1f2,#fee2e2)!important;border-color:#fca5a5!important;}
#view-pos .pos-mode-btn.mode-partial{color:#92400e!important;background:linear-gradient(180deg,#fffbeb,#fef3c7)!important;border-color:#fcd34d!important;}
.modal-card .pos-mode-btn.mode-cash{color:#166534!important;background:linear-gradient(180deg,#ecfdf5,#dcfce7)!important;border-color:#86efac!important;}
.modal-card .pos-mode-btn.mode-gcash{color:#1d4ed8!important;background:linear-gradient(180deg,#eff6ff,#dbeafe)!important;border-color:#93c5fd!important;}
.modal-card .pos-mode-btn.mode-credit{color:#991b1b!important;background:linear-gradient(180deg,#fff1f2,#fee2e2)!important;border-color:#fca5a5!important;}
.modal-card .pos-mode-btn.mode-partial{color:#92400e!important;background:linear-gradient(180deg,#fffbeb,#fef3c7)!important;border-color:#fcd34d!important;}
#view-pos .pos-mode-btn.active,
.modal-card .pos-mode-btn.active{
  transform:translateY(-1px)!important;
  box-shadow:0 0 0 4px rgba(37,99,235,.16),0 10px 22px rgba(15,23,42,.14)!important;
  border-color:#2563eb!important;
  outline:3px solid rgba(37,99,235,.18)!important;
}
#view-pos .summary-row:has(#saleType){
  display:block!important;
  padding:10px 0 12px!important;
}
#view-pos .summary-row:has(#saleType)>span:first-child{
  display:block!important;
  margin-bottom:8px!important;
  font-size:15px!important;
  font-weight:900!important;
  color:#0f172a!important;
}
body.pos-view-active #view-pos #cashFields .summary-row:has(#cashAmount),
#view-pos #cashFields .summary-row:has(#cashAmount){
  display:grid!important;
  grid-template-columns:88px minmax(0,1fr)!important;
  gap:8px!important;
  align-items:center!important;
  padding:8px 0!important;
}
body.pos-view-active #view-pos #cashAmount,
#view-pos #cashAmount{
  min-height:56px!important;
  font-size:24px!important;
  font-weight:900!important;
  border-radius:16px!important;
  border:2px solid #cbd5e1!important;
  background:#fff!important;
}
body.pos-view-active #view-pos .summary-row.total,
#view-pos .summary-row.total{
  padding:10px 14px!important;
  border-radius:18px!important;
}
body.pos-view-active #view-pos #cartTotal,
#view-pos #cartTotal{
  font-size:34px!important;
}
body.pos-view-active #view-pos .scroll-card>.table-wrap,
body.pos-compact-full #view-pos .scroll-card>.table-wrap{
  flex:0 0 230px!important;
  min-height:150px!important;
  max-height:250px!important;
}
body.pos-view-active #view-pos .receipt-preview-body,
body.pos-compact-full #view-pos .receipt-preview-body{
  max-height:260px!important;
}
body.pos-view-active #view-pos .cashier-main-actions .btn,
body.pos-view-active #view-pos .right-actions.cashier-main-actions .btn{
  min-height:68px!important;
  height:68px!important;
  font-size:20px!important;
  border-radius:18px!important;
}
body.pos-view-active #view-pos .cashier-main-actions .cashier-pay-btn,
body.pos-view-active #view-pos .right-actions.cashier-main-actions .cashier-pay-btn{
  font-size:26px!important;
  letter-spacing:.5px!important;
}
@media (orientation:landscape) and (max-height:860px){
  #view-pos .pos-payment-mode-tabs{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important;}
  #view-pos .pos-mode-btn{min-height:62px!important;border-radius:16px!important;padding:8px 6px!important;}
  #view-pos .pos-mode-btn .mode-title{font-size:17px!important;}
  #view-pos .pos-mode-btn .mode-sub{font-size:10px!important;}
  body.pos-view-active #view-pos .scroll-card>.table-wrap{flex-basis:210px!important;max-height:230px!important;}
}
@media (max-width:760px),(orientation:portrait){
  #view-pos .pos-payment-mode-tabs,.modal-card .pos-payment-mode-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  #view-pos .pos-mode-btn,.modal-card .pos-mode-btn{min-height:78px!important;}
}


/* =========================================================
   POS DISPLAY DESIGN PATCH V1 — 1 to 6 UI ONLY
   Scope: POS display only. No SQL / save / payment logic changes.
   Improvements:
   1 compact POS layout
   2 bigger payment/action buttons
   3 larger readable total
   4 simplified cart display
   5 professional receipt preview
   6 topbar/status cleanup
   ========================================================= */

body.pos-view-active #view-pos{
  --pos-blue:#0f3d75;
  --pos-blue2:#1d4ed8;
  --pos-green:#059669;
  --pos-red:#dc2626;
  --pos-amber:#d97706;
  --pos-bg:#eef4fb;
  --pos-card:#ffffff;
  --pos-line:#d8e4f2;
  background:linear-gradient(180deg,#eef4fb 0%,#f8fafc 100%)!important;
  min-height:100dvh!important;
  overflow:hidden!important;
}

/* 6. Topbar cleanup: compact, aligned, no overlap */
body.pos-view-active #view-pos .topbar{
  min-height:50px!important;
  height:auto!important;
  padding:8px 150px 8px 12px!important;
  margin:0 0 8px 0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  border:1px solid #dbeafe!important;
  border-radius:16px!important;
  background:linear-gradient(135deg,#0f3d75,#1e40af)!important;
  color:#fff!important;
  box-shadow:0 8px 22px rgba(15,61,117,.18)!important;
  overflow:visible!important;
}
body.pos-view-active #view-pos .topbar h1{
  color:#fff!important;
  font-size:22px!important;
  line-height:1.05!important;
  margin:0!important;
  font-weight:950!important;
  letter-spacing:.2px!important;
}
body.pos-view-active #view-pos .topbar p{
  color:#dbeafe!important;
  font-size:12px!important;
  line-height:1.15!important;
  margin:3px 0 0!important;
  max-width:760px!important;
}
body.pos-view-active #posExitBtn{
  top:10px!important;
  right:12px!important;
  height:42px!important;
  min-height:42px!important;
  padding:0 14px!important;
  border-radius:14px!important;
  background:#fff!important;
  color:#0f172a!important;
  border:1px solid rgba(255,255,255,.7)!important;
  box-shadow:0 8px 22px rgba(15,23,42,.20)!important;
  z-index:9500!important;
}
body.pos-view-active #offlineStatusBar{
  top:58px!important;
  right:12px!important;
  left:auto!important;
  max-width:190px!important;
  border-radius:999px!important;
  padding:7px 12px!important;
  font-size:12px!important;
  font-weight:900!important;
  text-align:center!important;
  z-index:9200!important;
}

/* 1. Compact POS layout */
body.pos-view-active #view-pos .pos-layout,
body.pos-view-active #view-pos .enhanced-pos-layout{
  height:calc(100dvh - 74px)!important;
  max-height:calc(100dvh - 74px)!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:minmax(390px,1.03fr) minmax(430px,.97fr)!important;
  gap:10px!important;
  align-items:stretch!important;
  overflow:hidden!important;
  padding:0!important;
  margin:0!important;
}
body.pos-view-active #view-pos .pos-layout>.card,
body.pos-view-active #view-pos .enhanced-pos-layout>.card,
body.pos-view-active #view-pos .left-pos-stack,
body.pos-view-active #view-pos .scroll-card{
  min-height:0!important;
  height:100%!important;
  max-height:100%!important;
  overflow:hidden!important;
  border:1px solid var(--pos-line)!important;
  border-radius:16px!important;
  background:var(--pos-card)!important;
  box-shadow:0 8px 24px rgba(15,23,42,.08)!important;
  padding:10px!important;
}

/* Search area compact but readable */
body.pos-view-active #view-pos .toolbar{
  display:grid!important;
  grid-template-columns:minmax(0,1.25fr) minmax(150px,.55fr) minmax(130px,.45fr) auto!important;
  gap:7px!important;
  align-items:end!important;
  padding:8px!important;
  margin:0 0 7px!important;
  border:1px solid #dbeafe!important;
  border-radius:15px!important;
  background:linear-gradient(135deg,#ffffff,#eff6ff)!important;
  box-shadow:none!important;
}
body.pos-view-active #view-pos .toolbar label{
  font-size:11px!important;
  font-weight:900!important;
  color:#334155!important;
  margin-bottom:3px!important;
  text-transform:uppercase!important;
}
body.pos-view-active #view-pos #posSearch{
  height:42px!important;
  min-height:42px!important;
  font-size:17px!important;
  font-weight:800!important;
  border:2px solid #bfdbfe!important;
  border-radius:13px!important;
  background:#fff!important;
}
body.pos-view-active #view-pos .toolbar .select,
body.pos-view-active #view-pos .toolbar .input{
  height:38px!important;
  min-height:38px!important;
  font-size:13px!important;
  border-radius:12px!important;
}

/* Product/result list uses remaining space */
body.pos-view-active #view-pos .product-list,
body.pos-view-active #view-pos #posProductGrid{
  display:grid!important;
  grid-template-columns:repeat(auto-fill,minmax(165px,1fr))!important;
  gap:8px!important;
  margin-top:0!important;
  flex:1 1 auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:auto!important;
  padding-right:3px!important;
}
body.pos-view-active #view-pos .product-row,
body.pos-view-active #view-pos .product-tile{
  border-radius:14px!important;
  padding:9px!important;
  border:1px solid #dbe4ef!important;
  box-shadow:0 3px 10px rgba(15,23,42,.05)!important;
  background:#fff!important;
}
body.pos-view-active #view-pos .product-row:hover,
body.pos-view-active #view-pos .product-tile:hover{
  border-color:#60a5fa!important;
  box-shadow:0 8px 18px rgba(37,99,235,.14)!important;
}
body.pos-view-active #view-pos .product-row img,
body.pos-view-active #view-pos .product-tile img{
  width:54px!important;
  height:54px!important;
  object-fit:cover!important;
  border-radius:12px!important;
}

/* 4. Cart simplification: compact, clean table */
body.pos-view-active #view-pos .scroll-card .card-title,
body.pos-view-active #view-pos .card-title{
  margin:0 0 7px!important;
  padding:9px 12px!important;
  border-radius:14px!important;
  border:0!important;
  background:linear-gradient(135deg,#0f3d75,#1d4ed8)!important;
  color:#fff!important;
  font-size:15px!important;
  line-height:1.1!important;
  font-weight:950!important;
  box-shadow:0 6px 14px rgba(15,61,117,.14)!important;
}
body.pos-view-active #view-pos .table-wrap{
  flex:1 1 auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:auto!important;
  border:1px solid #e2e8f0!important;
  border-radius:14px!important;
  background:#fff!important;
}
body.pos-view-active #view-pos table{
  width:100%!important;
  table-layout:fixed!important;
  border-collapse:separate!important;
  border-spacing:0!important;
}
body.pos-view-active #view-pos table thead th{
  position:sticky!important;
  top:0!important;
  z-index:5!important;
  background:#f1f5f9!important;
  color:#334155!important;
  font-size:11px!important;
  text-transform:uppercase!important;
  letter-spacing:.03em!important;
  font-weight:950!important;
  padding:8px 6px!important;
}
body.pos-view-active #view-pos #cartTableBody td{
  font-size:12px!important;
  padding:7px 6px!important;
  vertical-align:middle!important;
  border-bottom:1px solid #eef2f7!important;
}
body.pos-view-active #view-pos #cartTableBody td:nth-child(1){
  width:auto!important;
  font-weight:850!important;
  color:#0f172a!important;
  word-break:break-word!important;
}
body.pos-view-active #view-pos #cartTableBody td:nth-child(2){
  width:92px!important;
  text-align:center!important;
}
body.pos-view-active #view-pos #cartTableBody td:nth-child(3),
body.pos-view-active #view-pos #cartTableBody td:nth-child(4){
  width:86px!important;
  text-align:right!important;
  font-weight:850!important;
}
body.pos-view-active #view-pos #cartTableBody td:nth-child(5){
  width:70px!important;
  text-align:center!important;
}
body.pos-view-active #view-pos .cart-thumb{
  width:34px!important;
  height:34px!important;
  border-radius:9px!important;
  object-fit:cover!important;
}
body.pos-view-active #view-pos #cartTableBody .inline-actions{
  gap:3px!important;
  justify-content:center!important;
  flex-wrap:nowrap!important;
}
body.pos-view-active #view-pos #cartTableBody .btn{
  min-height:30px!important;
  height:30px!important;
  padding:4px 8px!important;
  border-radius:9px!important;
  font-size:12px!important;
}

/* Summary/payment panel */
body.pos-view-active #view-pos .summary-row{
  display:grid!important;
  grid-template-columns:112px minmax(0,1fr)!important;
  gap:8px!important;
  align-items:center!important;
  padding:5px 2px!important;
  font-size:12px!important;
  line-height:1.15!important;
  border-bottom:1px dashed #e2e8f0!important;
}
body.pos-view-active #view-pos .summary-row span:first-child{
  color:#475569!important;
  font-weight:900!important;
}
body.pos-view-active #view-pos .summary-row strong,
body.pos-view-active #view-pos .summary-row input,
body.pos-view-active #view-pos .summary-row select{
  justify-self:end!important;
  width:100%!important;
  max-width:210px!important;
}
body.pos-view-active #view-pos .summary-row .input,
body.pos-view-active #view-pos .summary-row .select,
body.pos-view-active #view-pos #cashFields .input,
body.pos-view-active #view-pos #creditFields .input{
  height:36px!important;
  min-height:36px!important;
  border-radius:12px!important;
  font-size:14px!important;
  font-weight:800!important;
}

/* 3. Larger readable total */
body.pos-view-active #view-pos .summary-row.total{
  grid-template-columns:1fr auto!important;
  margin:7px 0!important;
  padding:11px 12px!important;
  border-radius:18px!important;
  border:2px solid #86efac!important;
  background:linear-gradient(135deg,#dcfce7,#f0fdf4)!important;
  box-shadow:0 8px 18px rgba(5,150,105,.13)!important;
}
body.pos-view-active #view-pos .summary-row.total span:first-child{
  font-size:14px!important;
  color:#166534!important;
  font-weight:950!important;
  text-transform:uppercase!important;
  letter-spacing:.04em!important;
}
body.pos-view-active #view-pos #cartTotal{
  color:#047857!important;
  font-size:34px!important;
  line-height:1!important;
  font-weight:1000!important;
  letter-spacing:-.7px!important;
  text-shadow:0 1px 0 rgba(255,255,255,.7)!important;
}

/* 2. Bigger, cleaner payment/action buttons */
body.pos-view-active #view-pos .tc-top-actions,
body.pos-view-active #view-pos .right-actions.cashier-main-actions{
  display:grid!important;
  grid-template-columns:1fr 1.35fr 1fr!important;
  gap:8px!important;
  margin:8px 0 0!important;
  padding:8px!important;
  border-radius:18px!important;
  border:1px solid #dbeafe!important;
  background:linear-gradient(135deg,#f8fafc,#eff6ff)!important;
  box-shadow:0 8px 18px rgba(15,23,42,.08)!important;
  position:sticky!important;
  bottom:0!important;
  z-index:40!important;
}
body.pos-view-active #view-pos .tc-top-actions .btn,
body.pos-view-active #view-pos .right-actions.cashier-main-actions .btn{
  height:58px!important;
  min-height:58px!important;
  border-radius:16px!important;
  font-size:17px!important;
  font-weight:1000!important;
  letter-spacing:.3px!important;
  text-transform:uppercase!important;
  box-shadow:0 8px 18px rgba(15,23,42,.13)!important;
}
body.pos-view-active #view-pos .tc-top-actions .tc-pay,
body.pos-view-active #view-pos .right-actions.cashier-main-actions .cashier-pay-btn,
body.pos-view-active #view-pos .btn-success.cashier-pay-btn{
  background:linear-gradient(135deg,#059669,#10b981)!important;
  color:#fff!important;
  border:0!important;
  font-size:24px!important;
}
body.pos-view-active #view-pos .tc-top-actions .tc-clear,
body.pos-view-active #view-pos .right-actions.cashier-main-actions .btn-danger{
  background:#fff1f2!important;
  color:#be123c!important;
  border:2px solid #fecdd3!important;
}
body.pos-view-active #view-pos .tc-top-actions .tc-print,
body.pos-view-active #view-pos .right-actions.cashier-main-actions .btn-dark{
  background:linear-gradient(135deg,#111827,#334155)!important;
  color:#fff!important;
  border:0!important;
}

/* 5. Professional receipt preview */
body.pos-view-active #view-pos .receipt-preview-wrap{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  gap:6px!important;
  margin-top:0!important;
  background:#f8fafc!important;
  border:1px solid #e2e8f0!important;
  border-radius:16px!important;
  padding:8px!important;
}
body.pos-view-active #view-pos .receipt-preview-wrap .card-title{
  background:linear-gradient(135deg,#111827,#334155)!important;
  color:#fff!important;
  margin:0!important;
  text-align:center!important;
}
body.pos-view-active #view-pos .receipt-preview-body{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow:auto!important;
  max-width:390px!important;
  width:100%!important;
  margin:0 auto!important;
  padding:12px 14px!important;
  border:1px solid #cbd5e1!important;
  border-radius:10px!important;
  background:
    linear-gradient(#fff,#fff) padding-box,
    repeating-linear-gradient(90deg,#e2e8f0 0,#e2e8f0 6px,transparent 6px,transparent 12px) border-box!important;
  color:#111827!important;
  font-family:Consolas,"Courier New",monospace!important;
  box-shadow:0 10px 24px rgba(15,23,42,.10)!important;
}
body.pos-view-active #view-pos .receipt-head{
  text-align:center!important;
  padding-bottom:8px!important;
  margin-bottom:8px!important;
  border-bottom:1px dashed #94a3b8!important;
}
body.pos-view-active #view-pos .receipt-head h3{
  font-size:16px!important;
  font-weight:950!important;
  color:#0f172a!important;
  margin:0 0 4px!important;
}
body.pos-view-active #view-pos .receipt-mini{
  font-size:10.5px!important;
  color:#475569!important;
  line-height:1.35!important;
}
body.pos-view-active #view-pos .receipt-items{
  width:100%!important;
  table-layout:auto!important;
  border-collapse:collapse!important;
}
body.pos-view-active #view-pos .receipt-items th,
body.pos-view-active #view-pos .receipt-items td{
  font-family:Consolas,"Courier New",monospace!important;
  font-size:11px!important;
  padding:5px 3px!important;
  border-bottom:1px dashed #e2e8f0!important;
}
body.pos-view-active #view-pos .receipt-total,
body.pos-view-active #view-pos .receipt-grand,
body.pos-view-active #view-pos .rp-grand{
  font-size:15px!important;
  font-weight:950!important;
  color:#0f172a!important;
}

/* Avoid cramped notes in running screen */
body.pos-view-active #view-pos .footer-note,
body.pos-view-active #view-pos .shortcut-note{
  display:none!important;
}

/* Responsive fit */
@media (max-width:1180px){
  body.pos-view-active #view-pos .pos-layout,
  body.pos-view-active #view-pos .enhanced-pos-layout{
    grid-template-columns:minmax(350px,.95fr) minmax(390px,1.05fr)!important;
  }
  body.pos-view-active #view-pos #cartTotal{font-size:30px!important;}
  body.pos-view-active #view-pos .tc-top-actions .btn,
  body.pos-view-active #view-pos .right-actions.cashier-main-actions .btn{font-size:15px!important;}
}
@media (max-width:900px), (orientation:portrait){
  body.pos-view-active #view-pos{
    overflow:auto!important;
  }
  body.pos-view-active #view-pos .topbar{
    padding:10px 12px!important;
    margin-bottom:8px!important;
  }
  body.pos-view-active #posExitBtn{
    position:sticky!important;
    top:6px!important;
    right:auto!important;
    float:right!important;
    margin:4px!important;
  }
  body.pos-view-active #offlineStatusBar{
    top:auto!important;
    right:auto!important;
    left:10px!important;
    bottom:10px!important;
  }
  body.pos-view-active #view-pos .pos-layout,
  body.pos-view-active #view-pos .enhanced-pos-layout{
    grid-template-columns:1fr!important;
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }
  body.pos-view-active #view-pos .pos-layout>.card,
  body.pos-view-active #view-pos .enhanced-pos-layout>.card{
    min-height:420px!important;
    height:auto!important;
    max-height:none!important;
  }
  body.pos-view-active #view-pos .toolbar{
    grid-template-columns:1fr!important;
  }
  body.pos-view-active #view-pos .tc-top-actions,
  body.pos-view-active #view-pos .right-actions.cashier-main-actions{
    grid-template-columns:1fr!important;
  }
}


/* === POS V16 SEARCH DROPDOWN STYLE === */
.pos-search-dropdown-wrap{
  position:relative!important;
}
#posSearchDropdown{
  position:fixed!important;
  z-index:12000!important;
  max-height:360px!important;
  overflow:auto!important;
  overflow-x:hidden!important;
  background:#fff!important;
  border:1px solid #bfdbfe!important;
  border-radius:16px!important;
  box-shadow:0 18px 45px rgba(15,23,42,.22)!important;
  padding:7px!important;
}
#posSearchDropdown .pos-search-option{
  width:100%!important;
  display:grid!important;
  grid-template-columns:48px minmax(0,1fr) auto!important;
  gap:10px!important;
  align-items:center!important;
  border:1px solid transparent!important;
  background:#fff!important;
  border-radius:13px!important;
  padding:8px!important;
  cursor:pointer!important;
  text-align:left!important;
  color:#0f172a!important;
}
#posSearchDropdown .pos-search-option:hover,
#posSearchDropdown .pos-search-option.active{
  background:linear-gradient(135deg,#eff6ff,#ecfdf5)!important;
  border-color:#60a5fa!important;
  box-shadow:0 6px 16px rgba(37,99,235,.13)!important;
}
#posSearchDropdown .pos-search-img{
  width:44px!important;
  height:44px!important;
  border-radius:12px!important;
  overflow:hidden!important;
  background:#f1f5f9!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#94a3b8!important;
  font-size:9px!important;
  font-weight:900!important;
  text-align:center!important;
  line-height:1!important;
}
#posSearchDropdown .pos-search-img img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
}
#posSearchDropdown .pos-search-main{
  min-width:0!important;
}
#posSearchDropdown .pos-search-main strong{
  display:block!important;
  font-size:14px!important;
  font-weight:950!important;
  color:#0f172a!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
#posSearchDropdown .pos-search-main small{
  display:block!important;
  font-size:11px!important;
  color:#64748b!important;
  font-weight:750!important;
  margin-top:3px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
#posSearchDropdown .pos-search-price{
  color:#047857!important;
  font-size:14px!important;
  font-weight:950!important;
  white-space:nowrap!important;
}
#posSearchDropdown .pos-search-empty{
  padding:16px!important;
  text-align:center!important;
  color:#64748b!important;
  font-size:13px!important;
  font-weight:800!important;
}
body.pos-view-active #keyboardItemModal{
  display:none!important;
}
@media(max-width:760px){
  #posSearchDropdown{
    left:8px!important;
    right:8px!important;
    width:auto!important;
    max-height:55vh!important;
  }
  #posSearchDropdown .pos-search-option{
    grid-template-columns:42px minmax(0,1fr)!important;
  }
  #posSearchDropdown .pos-search-price{
    grid-column:2!important;
    justify-self:start!important;
  }
}


/* === POS V17 DUPLICATE CURRENT CART CLEANUP STYLE === */
body.pos-view-active #view-pos.v7-pos-layout .scroll-card > .card-title{
  display:none!important;
  visibility:hidden!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
}
body.pos-view-active #view-pos.v7-pos-layout .scroll-card > #selectedCartItemBox{
  display:none!important;
  visibility:hidden!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
}
body.pos-view-active #view-pos.v7-pos-layout #v7SummaryTitle{
  margin-bottom:4px!important;
}
body.pos-view-active #view-pos.v7-pos-layout .v7-summary-sub{
  margin-bottom:8px!important;
}


/* =========================================================
   Sales History UI Polish Patch
   ========================================================= */
#view-sales .topbar h1{
  font-size:2rem;
  margin-bottom:6px;
}
#view-sales .topbar p{
  color:#64748b;
}
#view-sales .card{
  border:1px solid #dbe7ff;
  border-radius:24px;
  box-shadow:0 18px 40px rgba(15,23,42,.08);
  overflow:hidden;
}
#view-sales .toolbar{
  padding:20px 22px 12px;
}
#view-sales .toolbar label{
  display:block;
  font-size:.92rem;
  font-weight:700;
  color:#334155;
  margin-bottom:8px;
}
#view-sales #salesSearch{
  border-radius:16px;
  border:1px solid #cbd5e1;
  box-shadow:inset 0 1px 2px rgba(15,23,42,.04);
  min-height:48px;
}
#view-sales .table-wrap{
  margin:0 18px 18px;
  border:1px solid #e2e8f0;
  border-radius:20px;
  overflow:auto;
  background:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85);
}
#view-sales table thead th{
  background:linear-gradient(180deg,#f8fbff 0%,#edf4ff 100%);
  color:#0f172a;
  font-size:.9rem;
  font-weight:800;
  letter-spacing:.02em;
  border-bottom:1px solid #dbeafe;
}
#view-sales table tbody tr{
  transition:background .18s ease, transform .18s ease;
}
#view-sales table tbody tr:hover{
  background:#f8fbff;
}
#view-sales table tbody td{
  vertical-align:middle;
  border-bottom:1px solid #edf2f7;
}
#view-sales .receipt-cell,
#view-sales .sales-date-cell,
#view-sales .sales-cashier-cell,
#view-sales .sales-amount-wrap{
  display:flex;
  flex-direction:column;
  gap:3px;
}
#view-sales .receipt-main,
#view-sales .sales-cashier-main,
#view-sales .sales-amount-main{
  font-weight:800;
  color:#0f172a;
}
#view-sales .receipt-sub,
#view-sales .sales-date-sub,
#view-sales .sales-cashier-sub,
#view-sales .sales-amount-sub{
  font-size:.77rem;
  color:#64748b;
}
#view-sales .sales-date-main{
  color:#1e293b;
  font-weight:700;
}
#view-sales .sales-type-badge,
#view-sales .sales-items-badge,
#view-sales .sales-status-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:6px 12px;
  border-radius:999px;
  font-size:.84rem;
  font-weight:800;
  white-space:nowrap;
}
#view-sales .sales-type-badge.cash{
  background:#dcfce7;
  color:#166534;
}
#view-sales .sales-type-badge.credit{
  background:#ffedd5;
  color:#9a3412;
}
#view-sales .sales-items-badge{
  background:#eef2ff;
  color:#3730a3;
}
#view-sales .sales-status-pill.completed{
  background:#dcfce7;
  color:#166534;
}
#view-sales .sales-status-pill.credit{
  background:#ffedd5;
  color:#9a3412;
}
#view-sales .sales-status-pill.returned{
  background:#fef3c7;
  color:#92400e;
}
#view-sales .sales-actions{
  gap:8px;
  flex-wrap:wrap;
}
#view-sales .sales-action-btn{
  min-width:78px;
  border-radius:12px;
  box-shadow:0 8px 16px rgba(15,23,42,.08);
}
#view-sales .sales-action-view{
  background:linear-gradient(135deg,#0f172a 0%,#1d4ed8 100%);
  border:none;
  color:#fff;
}

.sale-history-modal-open{
  overflow:hidden;
}
.sale-history-modal{
  position:fixed;
  inset:0;
  display:none;
  z-index:9999;
}
.sale-history-modal.open{
  display:block;
}
.sale-history-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.58);
  backdrop-filter:blur(6px);
}
.sale-history-modal__panel{
  position:relative;
  width:min(980px,calc(100vw - 32px));
  max-height:calc(100vh - 40px);
  margin:20px auto;
  background:#fff;
  border-radius:28px;
  box-shadow:0 28px 80px rgba(15,23,42,.30);
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.sale-history-modal__header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:24px 28px 18px;
  background:linear-gradient(135deg,#eff6ff 0%,#ffffff 58%,#f8fafc 100%);
  border-bottom:1px solid #e2e8f0;
}
.sale-history-modal__eyebrow{
  font-size:.82rem;
  font-weight:800;
  color:#1d4ed8;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:8px;
}
.sale-history-modal__title{
  margin:0;
  font-size:1.65rem;
  line-height:1.2;
  color:#0f172a;
}
.sale-history-modal__sub{
  margin:6px 0 0;
  color:#64748b;
  font-size:.95rem;
}
.sale-history-modal__header-actions{
  display:flex;
  align-items:center;
  gap:10px;
}
.sale-history-modal__close{
  width:42px;
  height:42px;
  border:none;
  border-radius:50%;
  background:#e2e8f0;
  color:#0f172a;
  font-size:1.7rem;
  line-height:1;
  cursor:pointer;
}
.sale-history-modal__content{
  padding:24px 28px;
  overflow:auto;
}
.sale-history-meta-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-bottom:22px;
}
.sale-history-meta-card,
.sale-history-summary-card{
  background:#f8fafc;
  border:1px solid #e2e8f0;
  border-radius:20px;
  padding:16px 18px;
}
.sale-history-meta-label,
.sale-history-summary-label{
  font-size:.8rem;
  font-weight:700;
  color:#64748b;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin-bottom:8px;
}
.sale-history-meta-value,
.sale-history-summary-value{
  font-size:1.05rem;
  font-weight:800;
  color:#0f172a;
}
.sale-history-modal__section-title{
  font-size:1rem;
  font-weight:800;
  color:#0f172a;
  margin-bottom:12px;
}
.sale-history-items-wrap{
  border:1px solid #e2e8f0;
  border-radius:20px;
  overflow:auto;
  background:#fff;
}
.sale-history-items-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
}
.sale-history-items-table thead th{
  background:#f8fafc;
  color:#334155;
  font-size:.84rem;
  text-align:left;
  padding:14px 16px;
  border-bottom:1px solid #e2e8f0;
}
.sale-history-items-table tbody td{
  padding:14px 16px;
  border-bottom:1px solid #eef2f7;
  color:#0f172a;
}
.sale-history-items-table tbody tr:last-child td{
  border-bottom:none;
}
.sale-history-item-name{
  font-weight:800;
  color:#0f172a;
}
.sale-history-item-sub{
  color:#64748b;
  font-size:.78rem;
  margin-top:4px;
}
.sale-history-item-total{
  font-weight:800;
}
.sale-history-summary-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-top:22px;
}
.sale-history-summary-card.warning{
  background:#fff7ed;
  border-color:#fed7aa;
}
.sale-history-summary-card.primary{
  background:linear-gradient(135deg,#1d4ed8 0%,#1e3a8a 100%);
  border-color:#1d4ed8;
}
.sale-history-summary-card.primary .sale-history-summary-label,
.sale-history-summary-card.primary .sale-history-summary-value{
  color:#fff;
}
.sale-history-modal__footer{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  padding:18px 28px 24px;
  border-top:1px solid #e2e8f0;
  background:#fff;
}
@media (max-width: 900px){
  .sale-history-meta-grid,
  .sale-history-summary-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width: 640px){
  #view-sales .card{
    border-radius:18px;
  }
  #view-sales .table-wrap{
    margin:0 10px 12px;
    border-radius:16px;
  }
  .sale-history-modal__panel{
    width:calc(100vw - 16px);
    margin:8px auto;
    max-height:calc(100vh - 16px);
    border-radius:18px;
  }
  .sale-history-modal__header,
  .sale-history-modal__content,
  .sale-history-modal__footer{
    padding-left:16px;
    padding-right:16px;
  }
  .sale-history-modal__header{
    flex-direction:column;
    align-items:stretch;
  }
  .sale-history-modal__header-actions{
    justify-content:space-between;
  }
  .sale-history-meta-grid,
  .sale-history-summary-grid{
    grid-template-columns:1fr;
  }
  .sale-history-items-table{
    min-width:640px;
  }
}