*{box-sizing:border-box}
:root{
 --bg:#f5f7fb;--card:#fff;--text:#162033;--muted:#6b7280;--line:#e6ebf1;
 --nav:#16233a;--primary:#2563eb;--success:#16a34a;--danger:#dc2626;
 --warning:#d97706;--violet:#7c3aed;--teal:#0f9f95;
}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Segoe UI,Arial,sans-serif}
a{text-decoration:none;color:inherit}
.app-header{height:72px;background:var(--nav);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 22px;box-shadow:0 3px 16px #0002;position:sticky;top:0;z-index:100}
.brand-area{display:flex;align-items:center;gap:12px}.brand-logo{width:42px;height:42px;border-radius:12px;background:#2563eb;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:17px}.brand-title{font-weight:800;font-size:19px}.brand-sub{font-size:11px;color:#cbd5e1;margin-top:2px}
.main-nav{display:flex;align-items:center;gap:4px}.main-nav a{padding:9px 10px;border-radius:8px;font-size:13px;font-weight:700;color:#e5edf8}.main-nav a:hover{background:#ffffff18;color:#fff}
.mobile-menu{display:none;background:#ffffff15;color:white;border:0;border-radius:8px;padding:8px 11px;font-size:21px}
.app-main{max-width:1500px;margin:auto;padding:22px}
.page-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px}.page-head h1{margin:0;font-size:26px}.page-head p{margin:4px 0 0;color:var(--muted);font-size:13px}
.btn,button{border:0;border-radius:9px;padding:10px 14px;font-weight:750;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;background:#1f2937;color:white}
.btn.primary,button.primary{background:var(--primary)}.btn.success,button.success{background:var(--success)}.btn.danger,button.danger{background:var(--danger)}.btn.warning,button.warning{background:var(--warning)}.btn.light{background:#edf2f7;color:#1f2937}
.panel{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:0 4px 16px #0f172a0a;margin-bottom:16px}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}
.stat{background:#fff;border:1px solid var(--line);border-radius:16px;padding:17px;box-shadow:0 5px 16px #0f172a0b;position:relative;overflow:hidden}
.stat:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--primary)}.stat.green:before{background:var(--success)}.stat.red:before{background:var(--danger)}.stat.orange:before{background:var(--warning)}.stat.violet:before{background:var(--violet)}.stat.teal:before{background:var(--teal)}
.stat-label{font-size:12px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}.stat-value{font-size:26px;font-weight:900;margin-top:5px}.stat-note{font-size:12px;color:#94a3b8;margin-top:4px}
.dashboard-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:16px}
.quick-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.quick{background:#fff;border:1px solid var(--line);border-radius:13px;padding:15px;font-weight:800;box-shadow:0 3px 12px #00000008}.quick:hover{border-color:#93c5fd;background:#f8fbff}
.table-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:13px}
.table-card{background:#fff;border:1px solid var(--line);border-top:5px solid var(--success);border-radius:14px;padding:15px;box-shadow:0 4px 14px #0000000c}.table-card.busy{border-top-color:var(--danger)}
.table-card h3{margin:0 0 6px;font-size:18px}.muted{color:var(--muted);font-size:13px}.status{display:inline-block;padding:5px 8px;border-radius:999px;font-size:11px;font-weight:900;background:#dcfce7;color:#166534}.status.busy{background:#fee2e2;color:#991b1b}
.form-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.form-grid label{display:block;font-size:12px;font-weight:800;color:#475569;margin-bottom:5px}
input,select,textarea{width:100%;padding:10px 11px;border:1px solid #cbd5e1;border-radius:9px;background:#fff;font-size:14px}input:focus,select:focus,textarea:focus{outline:none;border-color:#60a5fa;box-shadow:0 0 0 3px #dbeafe}
.form-actions{display:flex;align-items:end;gap:8px}.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.table-wrap{width:100%;overflow:auto;border-radius:12px;border:1px solid var(--line)}table{width:100%;border-collapse:collapse;min-width:700px}th,td{padding:10px;border-bottom:1px solid var(--line);text-align:left;font-size:13px}th{background:#f8fafc;font-weight:850;white-space:nowrap}tr:last-child td{border-bottom:0}.right{text-align:right}.actions{display:flex;gap:6px;flex-wrap:wrap}.small{padding:6px 9px;font-size:11px}
.badge{display:inline-block;padding:4px 8px;border-radius:999px;font-size:11px;font-weight:900}.food{background:#dcfce7;color:#166534}.bar{background:#fef3c7;color:#92400e}
.login{max-width:390px;margin:70px auto}
@media(max-width:1100px){.stats{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}.quick-actions{grid-template-columns:repeat(2,1fr)}.form-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.app-header{height:auto;min-height:66px;align-items:flex-start;padding:12px 14px;position:relative}.mobile-menu{display:block;position:absolute;right:14px;top:14px}.main-nav{display:none;width:100%;padding-top:12px;grid-template-columns:1fr 1fr}.main-nav.open{display:grid}.brand-title{font-size:17px}.app-main{padding:12px}.page-head{display:block}.page-head .toolbar{margin-top:10px}.table-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.stats,.quick-actions,.form-grid,.table-grid{grid-template-columns:1fr}.main-nav.open{grid-template-columns:1fr}.stat-value{font-size:23px}}

.billing-search-wrap{position:relative;margin-bottom:16px}
.billing-search-wrap label,.billing-entry-grid label{display:block;font-size:12px;font-weight:800;color:#475569;margin-bottom:5px}
.search-results{display:none;position:absolute;left:0;right:0;top:66px;background:#fff;border:1px solid #cbd5e1;border-radius:10px;box-shadow:0 12px 30px #0002;z-index:50;max-height:320px;overflow:auto}
.search-results div{padding:11px 13px;border-bottom:1px solid #eef2f7;cursor:pointer;display:flex;justify-content:space-between;gap:14px}
.search-results div:hover{background:#eff6ff}
.search-results b{font-size:14px}.search-results span{font-size:12px;color:#64748b;text-align:right}
.billing-entry-grid{display:grid;grid-template-columns:2fr 1fr .8fr 1fr .7fr 1fr auto;gap:10px;align-items:end}
.billing-entry-grid input,.billing-entry-grid select{min-width:0}
@media(max-width:1150px){.billing-entry-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:760px){.billing-entry-grid{grid-template-columns:repeat(2,1fr)}.search-results div{display:block}.search-results span{display:block;text-align:left;margin-top:3px}}
@media(max-width:480px){.billing-entry-grid{grid-template-columns:1fr}}

/* ===== V12 FULL PROJECT RESPONSIVE ===== */
*{box-sizing:border-box}
html,body{max-width:100%;overflow-x:hidden}
img,svg{max-width:100%;height:auto}
input,select,textarea,button{max-width:100%;font-size:14px}
.table-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.page-head{gap:12px;flex-wrap:wrap}
.toolbar{display:flex;gap:8px;flex-wrap:wrap}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}

/* Billing: compact on desktop */
.billing-search-wrap{margin-bottom:10px}
.billing-search-wrap #globalSearch{height:38px}
.billing-entry-grid{
 display:grid;
 grid-template-columns:minmax(180px,2.2fr) 90px 72px 105px 70px 105px 78px;
 gap:7px;align-items:end
}
.billing-entry-grid label{font-size:11px;margin-bottom:3px}
.billing-entry-grid input,.billing-entry-grid select{height:38px;padding:6px 8px}
.billing-entry-grid .form-actions{margin:0}
.billing-entry-grid .form-actions button{height:38px;width:100%;padding:6px 10px}
#product_name{background:#f8fafc}
#preview_total{font-weight:800}

/* Medium tablet */
@media(max-width:1000px){
 .billing-entry-grid{grid-template-columns:2fr 1fr .8fr 1fr}
 .billing-entry-grid .form-actions{grid-column:auto}
}

/* Mobile */
@media(max-width:700px){
 body{font-size:14px}
 .container,.content,main{width:100%!important;max-width:100%!important;padding-left:10px!important;padding-right:10px!important}
 .panel{padding:12px!important;border-radius:12px!important;margin-bottom:10px!important}
 .page-head{display:block}
 .page-head h1{font-size:22px;margin-bottom:4px}
 .page-head p{font-size:12px}
 .toolbar{margin-top:8px}
 .toolbar .btn,.toolbar button{flex:1;min-width:120px;text-align:center}
 .form-grid{grid-template-columns:1fr 1fr;gap:8px}
 .stats{grid-template-columns:1fr 1fr;gap:8px}
 .stat{padding:12px!important}
 .stat-value{font-size:20px!important}

 /* Billing becomes compact 2-column POS instead of one long field per line */
 .billing-entry-grid{
   grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);
   gap:7px;
 }
 .billing-entry-grid>div{min-width:0}
 .billing-entry-grid>div:first-child{grid-column:1 / -1}
 .billing-entry-grid .form-actions{grid-column:1 / -1}
 .billing-entry-grid .form-actions button{height:42px;font-size:15px}
 .billing-search-wrap #globalSearch{height:42px;font-size:16px}
 .search-results{top:64px;max-height:45vh}
 .search-results div{padding:10px}
 table{font-size:12px;white-space:nowrap}
 th,td{padding:8px 7px!important}
 .btn.small,button.small{padding:6px 8px!important}
}

/* Small phones */
@media(max-width:430px){
 .form-grid{grid-template-columns:1fr}
 .stats{grid-template-columns:1fr 1fr}
 .billing-entry-grid{grid-template-columns:1fr 1fr}
 .billing-entry-grid>div:first-child{grid-column:1/-1}
 .billing-entry-grid .form-actions{grid-column:1/-1}
 .page-head h1{font-size:20px}
}

/* Responsive navigation - wrap rather than overflow */
@media(max-width:850px){
 header nav,.nav,.topnav{display:flex!important;flex-wrap:wrap!important;gap:5px!important}
 header nav a,.nav a,.topnav a{font-size:12px!important;padding:7px 8px!important}
}

/* V13 compact POS entry */
.billing-panel{padding:10px 14px!important}
.billing-panel h2{font-size:18px;margin:0 0 8px}
.compact-pos-row{
  display:grid!important;
  grid-template-columns:165px 150px 75px 65px 85px 85px 58px 85px 64px!important;
  gap:7px!important;
  align-items:end!important;
}
.compact-pos-row>div{min-width:0!important}
.compact-pos-row label{
  display:block!important;
  font-size:11px!important;
  font-weight:700!important;
  margin:0 0 2px!important;
  white-space:nowrap!important;
}
.compact-pos-row input,.compact-pos-row select{
  width:100%!important;
  height:32px!important;
  min-height:32px!important;
  padding:3px 6px!important;
  font-size:12px!important;
  border-radius:3px!important;
}
.compact-pos-row button{
  width:100%!important;
  height:32px!important;
  padding:3px 6px!important;
  border-radius:3px!important;
  font-size:12px!important;
}
.search-box{position:relative}
.search-results{top:49px!important;min-width:260px!important}
#preview_total{font-weight:800;background:#f8fafc}

@media(min-width:1200px){
  .compact-pos-row{grid-template-columns:175px 155px 80px 70px 88px 88px 62px 90px 68px!important}
}

@media(max-width:900px){
  .compact-pos-row{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
  .search-box,.product-drop{grid-column:span 2}
}

@media(max-width:600px){
  .compact-pos-row{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .search-box,.product-drop,.add-btn-cell{grid-column:1/-1}
  .compact-pos-row input,.compact-pos-row select,.compact-pos-row button{
    height:40px!important;min-height:40px!important;font-size:14px!important
  }
}

@media(max-width:360px){
  .compact-pos-row{grid-template-columns:1fr!important}
  .search-box,.product-drop,.add-btn-cell{grid-column:auto}
}

/* V14 Billing UI — same visual language as Product Master */
.billing-panel{padding:18px!important}
.billing-panel h2{font-size:24px!important;margin:0 0 20px!important}
.billing-product-grid{
 display:grid!important;
 grid-template-columns:repeat(4,minmax(0,1fr))!important;
 gap:14px 12px!important;
 align-items:end!important;
}
.billing-product-grid>div{min-width:0!important}
.billing-product-grid label{
 display:block!important;font-size:12px!important;font-weight:800!important;
 color:#334155!important;margin:0 0 5px!important;
}
.billing-product-grid input,.billing-product-grid select{
 width:100%!important;height:38px!important;min-height:38px!important;
 padding:7px 10px!important;font-size:14px!important;
 border:1px solid #cbd5e1!important;border-radius:9px!important;background:#fff!important;
}
.billing-product-grid #preview_total{background:#f8fafc!important;font-weight:800!important}
.billing-search{position:relative!important}
.billing-search .search-results{top:64px!important;left:0!important;right:0!important;min-width:100%!important}
.billing-save-row{margin-top:10px!important}
.billing-save-row button{
 min-width:135px!important;height:38px!important;padding:7px 16px!important;
 border-radius:9px!important;font-size:13px!important;font-weight:800!important;
}
@media(max-width:900px){
 .billing-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:560px){
 .billing-panel{padding:12px!important}
 .billing-panel h2{font-size:20px!important;margin-bottom:12px!important}
 .billing-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px 7px!important}
 .billing-search{grid-column:1/-1!important}
 .billing-product-grid input,.billing-product-grid select{height:42px!important;font-size:14px!important}
 .billing-save-row button{width:100%!important;height:42px!important}
}

/* ===== V15 Reference Billing UI ===== */
.reference-billing-panel{padding:20px!important}
.reference-billing-panel h2{font-size:22px!important;margin:0 0 20px!important}
.ref-add-row{
  display:grid!important;
  grid-template-columns:minmax(180px,1.8fr) minmax(170px,1.7fr) 95px 85px 135px 105px 80px 100px 115px!important;
  gap:12px!important;
  align-items:end!important;
}
.ref-add-row>div{min-width:0}
.ref-add-row label,.ref-payment-row label{
  display:block!important;font-size:12px!important;font-weight:800!important;
  color:#334155!important;margin:0 0 6px!important;
}
.ref-add-row input,.ref-add-row select,.ref-payment-row input,.ref-payment-row select{
  width:100%!important;height:42px!important;padding:8px 10px!important;
  border:1px solid #cbd5e1!important;border-radius:9px!important;
  background:#fff!important;font-size:14px!important;
}
.ref-add-action button{
  height:42px!important;width:100%!important;border-radius:9px!important;
  font-size:13px!important;font-weight:800!important;
}
.ref-search{position:relative}
.ref-search .search-results{top:68px!important;left:0!important;right:0!important;min-width:260px!important}
.reference-payment-panel{padding:20px!important}
.ref-payment-row{
  display:grid!important;
  grid-template-columns:1fr 1fr 1fr auto!important;
  gap:18px!important;align-items:end!important;
}
.ref-payment-actions{display:flex!important;gap:12px!important;align-items:end!important}
.ref-payment-actions button{height:42px!important;min-width:120px!important}
.ref-bottom-row{
  display:flex!important;justify-content:space-between!important;align-items:center!important;
  gap:18px!important;margin-top:18px!important;
}
.ref-grand-total{font-size:28px!important;font-weight:900!important;color:#10213a!important}
.dark-btn{background:#17233a!important;color:#fff!important;border-radius:8px!important;padding:10px 14px!important}
.reference-payment-panel select,.reference-payment-panel input{height:42px!important}
.reference-billing-panel + .panel{padding:20px!important}
.reference-billing-panel + .panel h2{font-size:20px!important;margin-bottom:16px!important}
.reference-billing-panel + .panel table{min-width:980px!important}

@media(max-width:1200px){
  .ref-add-row{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
  .ref-search{grid-column:span 2}
}
@media(max-width:800px){
  .ref-add-row{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .ref-search{grid-column:1/-1!important}
  .ref-payment-row{grid-template-columns:1fr 1fr!important}
  .ref-payment-actions{grid-column:1/-1!important}
  .ref-bottom-row{display:block!important}
  .ref-bottom-row .dark-btn{width:100%!important}
  .ref-grand-total{text-align:right!important;margin-top:16px!important;font-size:24px!important}
}
@media(max-width:480px){
  .ref-add-row{grid-template-columns:1fr!important}
  .ref-search{grid-column:auto!important}
  .ref-payment-row{grid-template-columns:1fr!important}
  .ref-payment-actions{display:grid!important;grid-template-columns:1fr 1fr!important}
}

/* ===== V16 Screenshot-matched Billing UI ===== */
.billing-title-row{margin-bottom:18px!important}.billing-title-row h1{font-size:27px!important}.billing-title-row p{font-size:13px!important;color:#64748b!important}
.ui-add-card,.ui-items-card,.ui-summary-card,.ui-customer-card,.ui-note-card,.ui-payment-card{background:#fff!important;border:1px solid #e5eaf0!important;border-radius:16px!important;box-shadow:0 5px 18px #0f172a0b!important}
.ui-add-card{padding:20px!important;min-height:220px}.ui-add-card h2,.ui-items-card h2,.ui-summary-card h2{font-size:20px!important;margin:0 0 22px!important}
.ui-add-grid{display:grid!important;grid-template-columns:minmax(190px,1.9fr) minmax(170px,1.65fr) 95px 85px 140px 105px 80px 95px 115px!important;gap:14px!important;align-items:end!important}
.ui-add-grid>div{min-width:0}.ui-add-grid label{display:block!important;font-size:12px!important;font-weight:800!important;color:#334155!important;margin:0 0 6px!important}.ui-add-grid input,.ui-add-grid select{width:100%!important;height:42px!important;padding:8px 10px!important;border:1px solid #cbd5e1!important;border-radius:9px!important;background:#fff!important;font-size:14px!important}.ui-add-action button{height:42px!important;width:100%!important;border-radius:9px!important;font-size:13px!important;font-weight:800!important}.ui-search-cell{position:relative}.ui-search-cell .search-results{top:68px!important;left:0!important;right:0!important;min-width:270px!important;max-height:260px!important}.search-results>div{display:flex!important;justify-content:space-between!important;align-items:center!important}.result-badge{font-size:11px!important;padding:4px 8px!important;border-radius:7px!important;font-weight:800!important}.result-badge.food{background:#dcfce7!important;color:#166534!important}.result-badge.bar{background:#dbeafe!important;color:#1d4ed8!important}
.ui-bill-layout{display:grid!important;grid-template-columns:minmax(0,2.5fr) minmax(300px,.9fr)!important;gap:16px!important;align-items:stretch!important}.ui-items-card,.ui-summary-card{padding:20px!important;margin-bottom:16px!important}.ui-items-card{min-height:330px!important}.ui-items-table-wrap{border:1px solid #dbe2ea!important;border-radius:10px!important;min-height:250px!important}.ui-items-table{min-width:850px!important}.ui-items-table th{background:#f8fafc!important}.ui-empty-bill{text-align:center!important;height:190px!important;color:#64748b!important;font-size:14px!important}.ui-summary-card{display:flex!important;flex-direction:column!important}.summary-line,.summary-total{display:flex!important;justify-content:space-between!important;align-items:center!important;padding:11px 0!important;border-bottom:1px solid #edf2f7!important;font-size:14px!important}.summary-line input{width:110px!important;height:38px!important;text-align:right!important}.summary-total{margin-top:8px!important;padding-top:16px!important;color:#0759d5!important;font-size:18px!important;font-weight:900!important}.ui-save-bill{height:45px!important;width:100%!important;margin-top:18px!important;font-size:14px!important}.ui-clear-btn{height:43px!important;margin-top:12px!important;width:100%!important;background:#fff!important;color:#dc2626!important;border:1px solid #cbd5e1!important}
.ui-bottom-layout{display:grid!important;grid-template-columns:1fr 1.05fr .7fr!important;gap:16px!important}.ui-bottom-layout .panel{padding:18px!important;margin-bottom:0!important}.ui-bottom-layout h3{font-size:16px!important;margin:0 0 14px!important}.ui-bottom-layout h3 span{font-weight:400!important;color:#64748b!important}.ui-bottom-layout input,.ui-bottom-layout select,.ui-bottom-layout textarea{width:100%!important;border:1px solid #cbd5e1!important;border-radius:9px!important;padding:10px!important}.ui-bottom-layout textarea{height:75px!important;resize:vertical!important}.payment-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin-top:10px!important}.payment-actions button{width:100%!important}.error-panel{border-left:5px solid #dc2626!important;color:#991b1b!important}
@media(max-width:1200px){.ui-add-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}.ui-search-cell{grid-column:span 2!important}.ui-bill-layout{grid-template-columns:1fr!important}.ui-bottom-layout{grid-template-columns:1fr 1fr!important}.ui-payment-card{grid-column:1/-1!important}}
@media(max-width:760px){.ui-add-card{min-height:auto!important;padding:13px!important}.ui-add-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}.ui-search-cell{grid-column:1/-1!important}.ui-add-grid input,.ui-add-grid select,.ui-add-action button{height:42px!important}.ui-add-action{grid-column:1/-1!important}.ui-bill-layout{display:block!important}.ui-items-card,.ui-summary-card{padding:13px!important}.ui-bottom-layout{grid-template-columns:1fr!important}.ui-payment-card{grid-column:auto!important}.summary-total{font-size:19px!important}}
@media(max-width:420px){.ui-add-grid{grid-template-columns:1fr!important}.ui-search-cell,.ui-add-action{grid-column:auto!important}}

/* ===== V17 Customer + Due + clean billing ===== */
.v17-bottom-layout{
  display:grid!important;
  grid-template-columns:1.1fr .9fr!important;
  gap:16px!important;
  align-items:start!important;
}
.v17-customer-grid,.v17-summary-grid{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:12px!important;
}
.v17-customer-grid label,.v17-summary-grid label,.v17-note label{
  display:block;font-size:12px;font-weight:800;color:#475569;margin-bottom:5px;
}
.v17-customer-grid input,.v17-summary-grid input,.v17-summary-grid select,.v17-note textarea{
  width:100%;border:1px solid #cbd5e1;border-radius:9px;padding:9px 10px;font-size:14px;
}
.v17-note{margin-top:12px}.v17-note textarea{min-height:74px;resize:vertical}
.v17-money-lines{margin-top:16px;border-top:1px solid #e5e7eb;padding-top:8px}
.v17-money-lines>div{display:flex;justify-content:space-between;gap:15px;padding:7px 0;border-bottom:1px solid #eef2f7}
.v17-money-lines .grand{font-size:18px;color:#0f4dcc}
.v17-money-lines .due{font-size:18px;color:#b91c1c}
.v17-payment-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;margin-top:14px}
.v17-payment-actions button{width:100%;height:42px}
.v17-back-btn{width:100%;margin-top:9px}
@media(max-width:850px){
 .v17-bottom-layout{grid-template-columns:1fr!important}
}
@media(max-width:520px){
 .v17-customer-grid,.v17-summary-grid{grid-template-columns:1fr!important}
 .v17-payment-actions{grid-template-columns:1fr!important}
}

/* V18: Old Bill Summary removed; Payment & Bill Summary is the only summary card */
.v17-final-summary h2{margin:0 0 16px;font-size:20px}

/* V19 Masters dropdown + compact bill table */
.nav-dropdown{position:relative}
.nav-drop-btn{background:transparent!important;color:#e5edf8!important;padding:9px 10px!important;font-size:13px!important}
.nav-drop-menu{
 display:none;position:absolute;top:42px;left:0;min-width:190px;background:#fff;border:1px solid #dbe2ea;
 border-radius:10px;box-shadow:0 12px 28px #0002;padding:6px;z-index:500
}
.nav-drop-menu a{display:block!important;color:#1f2937!important;padding:9px 10px!important;border-radius:7px!important}
.nav-drop-menu a:hover{background:#eff6ff!important}
.nav-dropdown:hover .nav-drop-menu,.nav-dropdown:focus-within .nav-drop-menu{display:block}
.ui-items-card table th,.ui-items-card table td{padding:8px 9px!important;font-size:12px!important}
.ui-items-card table{min-width:760px!important}
@media(max-width:820px){
 .nav-dropdown{width:100%}
 .nav-drop-btn{width:100%;background:#ffffff12!important}
 .nav-drop-menu{position:static;box-shadow:none;margin-top:4px;width:100%}
}

/* ===== V20 billing side-by-side + product search ===== */
.v20-bill-summary-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(300px,.7fr);gap:16px;align-items:start}
.v20-side-summary{position:sticky;top:88px}
.v20-summary-fields{display:grid;gap:10px}
.v20-summary-fields label,.v20-customer-row label{display:block;font-size:12px;font-weight:800;color:#475569;margin-bottom:4px}
.v20-summary-fields input,.v20-summary-fields select,.v20-customer-row input{width:100%;height:38px;border:1px solid #cbd5e1;border-radius:8px;padding:7px 9px}
.v20-discount-row{display:grid;grid-template-columns:70px 1fr;gap:6px}
.v20-customer-row{display:grid;grid-template-columns:1fr 1fr 1.4fr auto;gap:12px;align-items:end}
.v20-add-grid{grid-template-columns:minmax(180px,1.8fr) 105px 80px 70px 105px 85px 65px 90px 105px!important}
.v20-room-add{grid-template-columns:minmax(200px,2fr) 110px 75px 105px 90px 65px 90px 105px!important}
.ui-items-card{min-height:280px}
.ui-items-card table{min-width:720px!important}
.ui-search-cell{position:relative}
.ui-search-cell .search-results{top:63px!important;max-height:330px!important;overflow:auto!important}
@media(max-width:1050px){.v20-bill-summary-layout{grid-template-columns:1fr}.v20-side-summary{position:static}.v20-customer-row{grid-template-columns:1fr 1fr}.v20-add-grid,.v20-room-add{grid-template-columns:repeat(4,1fr)!important}}
@media(max-width:650px){.v20-customer-row{grid-template-columns:1fr}.v20-add-grid,.v20-room-add{grid-template-columns:repeat(2,1fr)!important}.ui-search-cell{grid-column:1/-1}}

/* ===== V21 Search Dropdown + Customer/Total Top ===== */
.v21-topbar{
  display:grid!important;
  grid-template-columns:minmax(220px,1fr) minmax(360px,1.6fr) 150px auto!important;
  align-items:end!important;
  gap:18px!important;
}
.v21-top-customer{
  display:grid;
  grid-template-columns:1fr 150px;
  gap:10px;
}
.v21-top-customer label,.v21-top-total span{
  display:block;font-size:11px;font-weight:800;color:#64748b;margin-bottom:4px;
}
.v21-top-customer input{
  width:100%;height:38px;border:1px solid #cbd5e1;border-radius:8px;padding:7px 9px;background:#fff;
}
.v21-top-total{
  background:#fff;border:1px solid #dbe2ea;border-radius:10px;padding:8px 12px;min-height:58px;
}
.v21-top-total b{display:block;font-size:21px;color:#0f4dcc}
.v21-search-cell{min-width:180px}
.v21-product-dropdown{min-width:190px}
.v20-add-grid{
  grid-template-columns:minmax(160px,1.5fr) minmax(190px,1.7fr) 105px 80px 70px 105px 85px 65px 90px 105px!important;
}
.v21-bottom-note{
  grid-template-columns:minmax(250px,1fr) auto!important;
}
@media(max-width:1050px){
 .v21-topbar{grid-template-columns:1fr 1fr!important}
 .v21-top-customer{grid-template-columns:1fr 1fr}
 .v20-add-grid{grid-template-columns:repeat(4,1fr)!important}
}
@media(max-width:650px){
 .v21-topbar{grid-template-columns:1fr!important}
 .v21-top-customer{grid-template-columns:1fr 1fr}
 .v20-add-grid{grid-template-columns:repeat(2,1fr)!important}
 .v21-search-cell,.v21-product-dropdown{grid-column:1/-1}
 .v21-bottom-note{grid-template-columns:1fr!important}
}
@media(max-width:430px){
 .v21-top-customer{grid-template-columns:1fr}
}

/* ===== V22 dropdown-only products + customer master load ===== */
.v22-product-only{min-width:250px}
.v22-top-customer{grid-template-columns:minmax(180px,1.2fr) minmax(160px,1fr) 150px!important}
.v22-top-customer select,.v22-top-customer input{
  width:100%;height:38px;border:1px solid #cbd5e1;border-radius:8px;padding:7px 9px;background:#fff;
}
.v20-add-grid{
  grid-template-columns:minmax(250px,2fr) 105px 80px 70px 105px 85px 65px 90px 105px!important;
}
.v20-room-add{
  grid-template-columns:minmax(250px,2fr) 110px 75px 105px 90px 65px 90px 105px!important;
}
@media(max-width:1050px){
  .v22-top-customer{grid-template-columns:1fr 1fr!important}
  .v20-add-grid,.v20-room-add{grid-template-columns:repeat(4,1fr)!important}
}
@media(max-width:650px){
  .v22-top-customer{grid-template-columns:1fr!important}
  .v22-product-only{grid-column:1/-1}
  .v20-add-grid,.v20-room-add{grid-template-columns:repeat(2,1fr)!important}
}

/* V23 Customer Search + New Customer */
.v23-customer-box{
  display:grid!important;
  grid-template-columns:minmax(260px,1fr) auto!important;
  gap:10px!important;
  align-items:end!important;
}
.v23-customer-search-wrap input{
  width:100%;height:38px;border:1px solid #cbd5e1;border-radius:8px;padding:7px 9px;background:#fff;
}
.v23-new-customer-action button{height:38px;white-space:nowrap}
.v23-modal{
  position:fixed;inset:0;background:#0f172a66;z-index:9999;
  align-items:center;justify-content:center;padding:16px;
}
.v23-modal-card{
  width:min(520px,100%);background:#fff;border-radius:14px;padding:18px;
  box-shadow:0 24px 60px #0004;
}
.v23-modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.v23-modal-head h3{margin:0}
.v23-modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.v23-modal-grid label{display:block;font-size:12px;font-weight:800;color:#475569;margin-bottom:5px}
.v23-modal-grid input{width:100%;height:40px;border:1px solid #cbd5e1;border-radius:8px;padding:8px 10px}
@media(max-width:650px){
  .v23-customer-box{grid-template-columns:1fr!important}
  .v23-new-customer-action button{width:100%}
  .v23-modal-grid{grid-template-columns:1fr}
}

/* V26 Waiter + Kitchen */
.waiter-order-grid{display:grid;grid-template-columns:minmax(240px,2fr) 120px 90px auto;gap:12px;align-items:end}
.kitchen-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px}
.kitchen-card{border-top:5px solid #d97706}.kitchen-card.done{border-top-color:#16a34a}
.kitchen-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:12px}
.kitchen-head h2{margin:0}.kitchen-card table{width:100%}.kitchen-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
@media(max-width:650px){.waiter-order-grid{grid-template-columns:1fr 1fr}.waiter-order-grid>div:first-child{grid-column:1/-1}.kitchen-grid{grid-template-columns:1fr}}

/* ===== V28 Kitchen item-wise dashboard ===== */
.kitchen-list-panel{padding:14px!important}
.kitchen-order-table{width:100%;min-width:780px;border-collapse:collapse}
.kitchen-order-table th{
  background:#f8fafc;
  color:#334155;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
}
.kitchen-order-table th,
.kitchen-order-table td{
  padding:11px 10px!important;
  border-bottom:1px solid #e5e7eb;
  vertical-align:middle;
}
.kitchen-order-table td{font-size:14px}
.kitchen-item-actions{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
}
.kitchen-status-badge{
  display:inline-block;
  padding:5px 9px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
}
.kitchen-status-badge.process{
  background:#fff7ed;
  color:#c2410c;
}
.kitchen-status-badge.complete{
  background:#ecfdf5;
  color:#15803d;
}
.kitchen-row-complete{
  background:#f0fdf4;
}
@media(max-width:700px){
  .kitchen-order-table{min-width:720px}
  .kitchen-item-actions{flex-wrap:nowrap}
}

/* V29 Kitchen Food-only + Complete lock */
.kitchen-complete-lock{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:7px 11px;
  border-radius:8px;
  background:#dcfce7;
  color:#166534;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}

/* V32 Separate KRM Super Admin */
.sa-login-body{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#eef2f7;
}
.sa-login-card{width:min(420px,92vw);padding:28px!important}
.sa-login-card h2{text-align:center;margin-bottom:4px}
.sa-login-card .muted{text-align:center}