:root{--navy:#0b1730;--navy2:#13264b;--gold:#c8a75d;--bg:#f3f4f6;--line:#e5e7eb;--text:#172033;--muted:#6b7280;--red:#b91c1c;--green:#15803d;--shadow:0 12px 28px rgba(11,23,48,.12)}
*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text)}button,input,select,textarea{font:inherit}.hidden{display:none!important}
.login{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(135deg,var(--navy),var(--navy2))}
.login-card{width:min(440px,100%);background:#fff;border-radius:22px;padding:30px;text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.32)}
.logo{max-width:190px;max-height:90px;object-fit:contain}.login-card h1{margin:8px 0 6px;color:var(--navy)}.muted{color:var(--muted)}
.field{display:flex;flex-direction:column;gap:7px;text-align:left}.field label{font-weight:700;font-size:13px;color:#374151}
.field input,.field select,.field textarea{width:100%;border:1px solid #d1d5db;border-radius:10px;padding:11px 12px;background:#fff;outline:none}
.field textarea{min-height:76px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(200,167,93,.18)}
.btn{border:0;border-radius:10px;padding:11px 14px;font-weight:700;cursor:pointer}.primary{background:var(--navy);color:#fff}.gold{background:var(--gold);color:#151515}.secondary{border:1px solid #ccd2db;background:#fff;color:var(--text)}.danger{background:#fff0f0;color:var(--red);border:1px solid #efb4b4}.success{background:#eaf8ef;color:var(--green);border:1px solid #b7e1c3}
.notice{margin-top:14px;background:#fff7df;border:1px solid #ead18b;color:#6b5413;padding:10px;border-radius:10px;font-size:13px;text-align:left}
.header{position:sticky;top:0;z-index:20;background:var(--navy);color:#fff;padding:10px 20px;display:flex;align-items:center;justify-content:space-between;gap:14px;box-shadow:0 4px 18px rgba(0,0,0,.18)}
.brand{display:flex;align-items:center;gap:11px}.brand img{width:55px;height:45px;object-fit:contain;background:#fff;border-radius:8px;padding:3px}.brand h2{font-size:18px;margin:0}.brand small{color:#cbd5e1}
.header-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.panel-head .actions .btn{white-space:nowrap}.header select{padding:9px;border:1px solid #506180;background:#14284e;color:#fff;border-radius:9px}
.page{max-width:1550px;margin:auto;padding:20px}.stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:17px}.stat{background:#fff;padding:16px;border-radius:14px;box-shadow:var(--shadow)}.stat span{font-size:12px;color:var(--muted)}.stat b{display:block;font-size:26px;color:var(--navy);margin-top:5px}
.layout{display:grid;grid-template-columns:minmax(350px,470px) 1fr;gap:17px;align-items:start}.panel{background:#fff;border-radius:16px;box-shadow:var(--shadow);overflow:hidden}.panel-head{padding:16px 18px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:10px}.panel-head h3{margin:0;color:var(--navy)}
.form{padding:17px;display:grid;gap:13px}.two{display:grid;grid-template-columns:1fr 1fr;gap:11px}.three{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.actions{display:flex;gap:9px;flex-wrap:wrap}.actions .btn{flex:1}
.toolbar{padding:12px 16px;border-bottom:1px solid var(--line);display:flex;gap:8px;flex-wrap:wrap}.toolbar input,.toolbar select{border:1px solid #d1d5db;border-radius:9px;padding:9px}
.table-wrap{overflow:auto;max-height:70vh}table{width:100%;border-collapse:collapse;min-width:1120px}th{position:sticky;top:0;background:#f8fafc;text-align:left;font-size:12px;color:#4b5563;padding:10px;border-bottom:1px solid var(--line);z-index:1}td{padding:10px;border-bottom:1px solid #eef0f3;font-size:13px;vertical-align:top}tr:hover td{background:#fbfcfe}.badge{display:inline-block;border-radius:999px;padding:4px 8px;background:#eef2ff;color:#27376d;font-size:12px}.admin-badge{background:#fff3ce;color:#6b5413}.row-actions{display:flex;gap:5px}.icon{border:1px solid #d5dae2;background:#fff;border-radius:7px;padding:5px 7px;cursor:pointer}.empty{padding:45px;text-align:center;color:var(--muted)}
.modal{position:fixed;inset:0;background:rgba(4,11,25,.65);z-index:50;display:grid;place-items:center;padding:18px}.modal-card{background:#fff;width:min(1100px,100%);max-height:92vh;overflow:auto;border-radius:18px;box-shadow:0 24px 70px rgba(0,0,0,.35)}.modal-head{position:sticky;top:0;background:#fff;padding:16px 18px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;z-index:2}.admin-grid{padding:18px;display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.admin-card{border:1px solid var(--line);border-radius:13px;padding:14px}.admin-card h4{margin:0 0 12px;color:var(--navy)}.add-line{display:flex;gap:8px;margin-bottom:11px}.add-line input,.add-line select{min-width:0;flex:1;border:1px solid #d1d5db;border-radius:8px;padding:9px}.list{display:grid;gap:7px;max-height:260px;overflow:auto}.list-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 9px;background:#f8fafc;border-radius:8px}.list-item small{color:var(--muted)}
.toast{position:fixed;right:18px;bottom:18px;background:#10203f;color:#fff;padding:12px 16px;border-radius:10px;z-index:70;box-shadow:var(--shadow)}
@media(max-width:1100px){.layout{grid-template-columns:1fr}.stats{grid-template-columns:repeat(3,1fr)}.table-wrap{max-height:none}}
@media(max-width:720px){.page{padding:11px}.header{padding:8px 11px}.brand small{display:none}.brand h2{font-size:15px}.brand img{width:44px;height:38px}.stats{grid-template-columns:1fr 1fr;gap:8px}.stat{padding:12px}.stat b{font-size:21px}.two,.three,.admin-grid{grid-template-columns:1fr}.header-actions label{display:none}.modal{padding:7px}}

.report-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.chart-box{height:330px;padding:14px}.chart-box canvas{width:100%;height:100%;display:block}
.last-entry-card{margin:0 17px 17px;padding:12px;border:1px solid #ead18b;background:#fffaf0;border-radius:11px}
.last-entry-card strong{color:var(--navy)}
@media(max-width:900px){.report-grid{grid-template-columns:1fr}}

.comparison-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:16px;margin-top:16px}.comparison-card{box-shadow:none;border:1px solid var(--line)}.comparison-table{min-width:700px}.comparison-table td,.comparison-table th{padding:13px 16px}.insights-box{padding:18px;line-height:1.55}.insights-box ul{margin:0;padding-left:22px}.insights-box li{margin-bottom:9px}.diff-positive{color:#15803d;font-weight:700}.diff-negative{color:#b91c1c;font-weight:700}.diff-neutral{color:#6b7280;font-weight:700}@media(max-width:900px){.comparison-grid{grid-template-columns:1fr}}

.day-end-card{padding:22px}
.day-end-brand{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;border-bottom:2px solid var(--gold);padding-bottom:14px;margin-bottom:16px}
.day-end-brand h2{margin:0 0 5px;color:var(--navy)}
.day-end-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;margin-bottom:18px}
.day-kpi{border:1px solid var(--line);border-radius:12px;padding:13px;background:#fafafa}
.day-kpi span{font-size:12px;color:var(--muted);display:block}
.day-kpi b{font-size:23px;color:var(--navy);display:block;margin-top:5px}
.day-end-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(280px,.65fr);gap:17px}
.day-end-table{min-width:850px}
.day-summary-box{border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:12px;background:#fafafa}
.day-summary-box h3{margin:0 0 10px;color:var(--navy);font-size:16px}
.summary-row{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid #eceff3}
.summary-row:last-child{border-bottom:0}
.day-insight{padding:7px 0;line-height:1.45}
@media(max-width:1050px){.day-end-grid{grid-template-columns:1fr}.day-end-kpis{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.day-end-card{padding:12px}.day-end-kpis{grid-template-columns:1fr 1fr}.day-kpi b{font-size:19px}}
@media print{
 body{background:#fff}
 .header,#entryView,#reportsView,#adminModal,#recycleModal,#toast,
 #dayEndView>.panel:first-child{display:none!important}
 #dayEndView{display:block!important}
 #dayEndReportCard{box-shadow:none;border:none;padding:0}
 .day-end-grid{grid-template-columns:1fr}
 .day-side{page-break-before:avoid}
 .table-wrap{overflow:visible!important}
 .day-end-table{min-width:0;font-size:10px}
 .day-end-table th,.day-end-table td{padding:6px}
}


.compact-report{padding:18px;background:#fff}
.compact-header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 16px;background:linear-gradient(135deg,#0b1730,#17345f);border-radius:14px;color:#fff;margin-bottom:14px}
.compact-header h2{margin:0 0 4px;font-size:22px}
.compact-date{font-size:13px;color:#dbe6f5}
.compact-branch{background:#c8a75d;color:#111827;font-weight:800;padding:9px 14px;border-radius:999px}
.compact-kpis{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;margin-bottom:14px}
.compact-kpi{border-radius:11px;padding:10px 8px;color:#fff;text-align:center;min-height:72px;display:flex;flex-direction:column;justify-content:center}
.compact-kpi span{font-size:11px;opacity:.9}
.compact-kpi b{font-size:21px;margin-top:4px}
.compact-kpi.navy{background:#172554}
.compact-kpi.blue{background:#1d4ed8}
.compact-kpi.green{background:#15803d}
.compact-kpi.amber{background:#b45309}
.compact-kpi.purple{background:#7e22ce}
.compact-kpi.teal{background:#0f766e}
.compact-kpi.rose{background:#be123c}
.compact-kpi.slate{background:#475569}
.compact-main{border:1px solid #dbe1ea;border-radius:13px;overflow:hidden}
.compact-table-wrap{overflow:auto}
.compact-table{width:100%;border-collapse:collapse;min-width:800px}
.compact-table th{background:#eaf0f8;color:#0b1730;font-size:11px;padding:8px;border-bottom:1px solid #cfd8e6}
.compact-table td{font-size:11px;padding:7px 8px;border-bottom:1px solid #edf1f5}
.compact-table tr:nth-child(even) td{background:#fafcff}
.compact-footer{display:flex;align-items:flex-start;gap:16px;padding:11px 13px;background:#f8fafc}
.compact-summary-title{font-weight:800;color:#0b1730;min-width:105px}
.compact-insights{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:#334155}
.compact-insights .day-insight{padding:0}
@media(max-width:1100px){
  .compact-kpis{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:650px){
  .compact-header{align-items:flex-start}
  .compact-header h2{font-size:18px}
  .compact-kpis{grid-template-columns:repeat(2,1fr)}
  .compact-footer{flex-direction:column;gap:7px}
}
@media print{
  @page{size:A4 landscape;margin:8mm}
  body{background:#fff}
  .header,#entryView,#reportsView,#adminModal,#recycleModal,#toast,
  #dayEndView>.panel:first-child{display:none!important}
  #dayEndView{display:block!important}
  #dayEndReportCard{box-shadow:none!important;border:none!important;padding:0!important}
  .compact-header{padding:10px 12px;margin-bottom:8px}
  .compact-header h2{font-size:18px}
  .compact-kpis{grid-template-columns:repeat(8,1fr);gap:5px;margin-bottom:8px}
  .compact-kpi{min-height:54px;padding:6px 4px}
  .compact-kpi span{font-size:8px}
  .compact-kpi b{font-size:15px}
  .compact-table{min-width:0}
  .compact-table th,.compact-table td{font-size:8px;padding:4px}
  .compact-footer{padding:7px 9px}
  .compact-insights{font-size:9px;gap:8px}
}


.simple-bottom-summary{display:grid;grid-template-columns:repeat(8,1fr);gap:1px;background:#dbe2ea;border-top:1px solid #dbe2ea}
.simple-bottom-summary>div{background:#f8fafc;padding:10px 6px;text-align:center}
.simple-bottom-summary span{display:block;font-size:10px;color:#64748b}
.simple-bottom-summary b{display:block;margin-top:3px;font-size:17px;color:#0b1730}
.compact-table th{background:#0b1730!important;color:#fff!important}
.compact-table td{font-size:11px!important}
.compact-header{margin-bottom:10px!important}
@media(max-width:900px){.simple-bottom-summary{grid-template-columns:repeat(4,1fr)}}
@media(max-width:520px){.simple-bottom-summary{grid-template-columns:repeat(2,1fr)}}
@media print{
  .simple-bottom-summary{grid-template-columns:repeat(8,1fr)}
  .simple-bottom-summary>div{padding:5px 2px}
  .simple-bottom-summary span{font-size:7px}
  .simple-bottom-summary b{font-size:11px}
}



.multi-select-wrap{position:relative}
.multi-select-button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:10px;border:1px solid #d1d5db;border-radius:10px;padding:11px 12px;background:#fff;color:#334155;text-align:left;cursor:pointer}
.multi-select-button:hover{border-color:#c8a75d}
.multi-select-arrow{font-size:11px;color:#64748b}
.multi-select-menu{position:absolute;top:calc(100% + 5px);left:0;right:0;z-index:40;background:#fff;border:1px solid #d1d5db;border-radius:10px;box-shadow:0 12px 28px rgba(11,23,48,.16);max-height:240px;overflow:auto;padding:6px}
.multi-select-option{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:8px;cursor:pointer;font-size:13px;color:#334155}
.multi-select-option:hover{background:#f3f6fa}
.multi-select-option input{width:auto;margin:0}
.multi-select-selected{color:#0b1730;font-weight:700}

.remember-login{display:flex;align-items:center;gap:9px;margin-top:14px;font-size:13px;color:#475569;text-align:left;cursor:pointer}.remember-login input{width:16px;height:16px}

.compact-entry-layout{display:grid!important;grid-template-columns:1fr!important;gap:16px!important}
#entryPanel .form{grid-template-columns:repeat(4,minmax(0,1fr));align-items:end}
#entryPanel .form>.field,
#entryPanel .form>.two,
#entryPanel .form>.actions,
#entryPanel .form>.multi-select-wrap{min-width:0}
#entryPanel .form>.two{display:contents}
#entryPanel .form>.field:has(textarea){grid-column:span 2}
#entryPanel .form>.actions{grid-column:span 2}
#entryPanel .form .field input,
#entryPanel .form .field select,
#entryPanel .form .field textarea,
#entryPanel .multi-select-button{min-width:0}
#entryPanel .form textarea{min-height:42px;height:42px}
.table-wrap{overflow-x:visible!important}
table{min-width:0!important;table-layout:fixed}
th,td{white-space:normal!important;overflow-wrap:anywhere}

@media(max-width:1100px){
  #entryPanel .form{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  #entryPanel .form{grid-template-columns:1fr}
  #entryPanel .form>.field:has(textarea),
  #entryPanel .form>.actions{grid-column:auto}
}


#entryPanel .panel-head{padding:11px 16px}
#entryPanel .panel-head h3{font-size:18px}
#entryPanel .form{
  grid-template-columns:120px 90px minmax(220px,1.5fr) minmax(180px,1fr) minmax(180px,1fr) minmax(260px,1.6fr) minmax(180px,1fr) 130px;
  gap:8px 10px;
  padding:12px 16px 14px;
}
#entryPanel .field{gap:4px}
#entryPanel .field label{font-size:11px}
#entryPanel .field input,
#entryPanel .field select,
#entryPanel .field textarea,
#entryPanel .multi-select-button{
  padding:7px 9px;
  min-height:34px;
  border-radius:8px;
  font-size:13px;
}
#entryPanel .field textarea{height:34px;min-height:34px;resize:none}
#entryPanel .field-notes{grid-column:span 4}
#entryPanel .compact-actions{grid-column:span 4;display:flex;gap:8px;align-items:end}
#entryPanel .compact-actions .btn{flex:0 0 auto;padding:8px 14px;font-size:13px}
#entryPanel .last-entry-card{
  margin:0 16px 8px;
  padding:7px 10px;
  min-height:34px;
  border-radius:8px;
}
#entryPanel .last-entry-card small{display:none}
#entryPanel #lastEntryText{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#entryPanel .multi-select-menu{max-height:220px}
#entryPanel .multi-select-option{padding:7px 9px}
@media(max-width:1250px){
  #entryPanel .form{grid-template-columns:110px 80px 1.4fr 1fr 1fr 1.4fr 1fr 120px}
}
@media(max-width:1000px){
  #entryPanel .form{grid-template-columns:repeat(4,minmax(0,1fr))}
  #entryPanel .field-notes,#entryPanel .compact-actions{grid-column:span 4}
}
@media(max-width:700px){
  #entryPanel .form{grid-template-columns:repeat(2,minmax(0,1fr))}
  #entryPanel .field-notes,#entryPanel .compact-actions{grid-column:span 2}
  #entryPanel .compact-actions{flex-wrap:wrap}
}


.entries-table{width:100%;table-layout:fixed;min-width:0!important}
.entries-table th,.entries-table td{padding:8px 7px;font-size:12px;white-space:normal;overflow-wrap:anywhere;vertical-align:middle}
.entries-table th:nth-child(1){width:11%}
.entries-table th:nth-child(2){width:16%}
.entries-table th:nth-child(3){width:6%}
.entries-table th:nth-child(4){width:12%}
.entries-table th:nth-child(5){width:14%}
.entries-table th:nth-child(6){width:17%}
.entries-table th:nth-child(7){width:10%}
.entries-table th:nth-child(8){width:7%}
.entries-table th:nth-child(9){width:7%}
.entries-table .row-actions{display:flex;gap:4px;flex-wrap:wrap}
.entries-table .icon{padding:5px 6px;font-size:11px}
#productDropdownMenu{max-height:290px!important;width:100%!important;left:0!important;right:auto!important}
#productDropdownText{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}


#productDropdownMenu .multi-select-option{
  min-height:34px;
  padding:7px 10px!important;
  font-size:12px!important;
}
#productDropdownMenu .multi-select-option input{
  width:14px!important;
  height:14px!important;
}
#entryPanel .last-entry-card{display:none!important}


/* Product multi-select dropdown: allow full menu to display */
#entryPanel,
#entryPanel .form,
#entryPanel .field,
#entryPanel .multi-select-wrap{
  overflow:visible!important;
}
#entryPanel.panel{
  overflow:visible!important;
}
#productDropdownMenu{
  position:absolute!important;
  top:calc(100% + 5px)!important;
  left:0!important;
  right:auto!important;
  width:100%!important;
  min-width:260px!important;
  max-height:260px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  z-index:9999!important;
  background:#fff!important;
  border:1px solid #d1d5db!important;
  border-radius:9px!important;
  box-shadow:0 14px 32px rgba(11,23,48,.22)!important;
}
#productDropdownMenu .multi-select-option{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  min-height:34px!important;
  padding:7px 10px!important;
  font-size:12px!important;
  background:#fff!important;
}
#productDropdownMenu .multi-select-option:hover{
  background:#f3f6fa!important;
}

/* ===== Mobile fixes (phones) ===== */
@media(max-width:600px){
  html{-webkit-text-size-adjust:100%}
  .page{padding:9px}
  .header{flex-wrap:wrap;gap:8px;padding:8px 10px}
  .header-actions{flex-wrap:wrap;gap:6px;width:100%;justify-content:flex-start}
  .header-actions .btn{padding:8px 10px;font-size:12px}
  .stats{grid-template-columns:1fr 1fr;gap:7px}
  .stat{padding:10px}
  .stat b{font-size:19px}
  #masterSnapshotStats{grid-template-columns:1fr 1fr}
  #outletComparisonPanel .report-grid{grid-template-columns:1fr}
  .panel-head{flex-wrap:wrap;gap:8px}
  .panel-head .actions,.panel-head .header-actions{width:100%}

  /* Data tables: don't crush many columns into 350px, let them scroll sideways instead */
  .table-wrap{overflow-x:auto!important;-webkit-overflow-scrolling:touch}
  .table-wrap table{table-layout:auto!important;min-width:640px!important}
  .table-wrap th,.table-wrap td{white-space:nowrap!important;font-size:12px;padding:8px 9px}
  .table-wrap th,.table-wrap td{width:auto!important}
  .day-end-grid .table-wrap table,.comparison-table{min-width:560px!important}
  .day-end-table th,.day-end-table td{white-space:nowrap}

  /* Entry form: single column, comfortable touch size */
  #entryPanel .form{grid-template-columns:1fr!important;padding:12px}
  #entryPanel .field-notes,#entryPanel .compact-actions{grid-column:auto!important}
  #entryPanel .field input,
  #entryPanel .field select,
  #entryPanel .field textarea,
  #entryPanel .multi-select-button{min-height:40px;font-size:14px}
  #entryPanel .compact-actions{flex-direction:column;align-items:stretch}
  #entryPanel .compact-actions .btn{width:100%;padding:11px 14px;font-size:14px}

  /* Modals and admin grid */
  .modal{padding:0}
  .modal-card{width:100%;max-height:100vh;border-radius:0}
  .admin-grid{grid-template-columns:1fr;padding:12px;gap:12px}
  .add-line{flex-wrap:wrap}
  .add-line input,.add-line select{flex:1 1 100%}

  /* Generic touch targets */
  .btn{min-height:40px}
  input,select,textarea{font-size:14px}
}
@media(max-width:380px){
  .stats{grid-template-columns:1fr 1fr}
  .brand h2{font-size:14px}
  .stat b{font-size:17px}
}

:root{
  --navy:#10273a;
  --navy2:#183e52;
  --gold:#c69b46;
  --gold2:#e3c77d;
  --cream:#f7f3eb;
  --paper:#f3f6f7;
  --panel:#ffffff;
  --line:#dbe3e6;
  --text:#173142;
  --muted:#667983;
  --green:#147a62;
  --red:#b63d43;
  --shadow:0 12px 34px rgba(16,39,58,.09);
}
html{scroll-behavior:smooth}
body{
  background:
    radial-gradient(circle at 0 0,rgba(198,155,70,.10),transparent 28rem),
    linear-gradient(180deg,#f9faf9 0,#eef3f4 100%);
  color:var(--text);
}
.page{max-width:1540px;margin:auto;padding:18px}
.header{
  background:linear-gradient(128deg,#0d2435 0%,#163f52 70%,#1c5360 100%);
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  box-shadow:0 18px 38px rgba(10,35,51,.18);
  padding:13px 18px;
}
.brand h2{letter-spacing:.2px}
.header .badge{border:1px solid rgba(255,255,255,.22)}
.nav{background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:15px;padding:5px;box-shadow:0 8px 22px rgba(16,39,58,.06)}
.nav button{border-radius:10px;font-weight:700}
.nav button.active{background:linear-gradient(135deg,var(--navy),var(--navy2));color:#fff;box-shadow:0 7px 16px rgba(16,39,58,.18)}
.panel,.stat,.admin-card,.comparison-card{
  border:1px solid rgba(205,217,221,.9);
  border-radius:17px;
  box-shadow:var(--shadow);
  background:rgba(255,255,255,.97);
}
.panel-head{background:linear-gradient(180deg,#fff,#fbfcfc);border-radius:17px 17px 0 0}
.stat{position:relative;overflow:hidden}
.stat:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(var(--gold),var(--gold2))}
.stat b{color:var(--navy)}
.btn.primary,.btn:not(.secondary):not(.danger):not(.success){
  background:linear-gradient(135deg,var(--navy),var(--navy2));
  box-shadow:0 7px 16px rgba(16,39,58,.15);
}
.btn.success{background:linear-gradient(135deg,#11715b,#1c9376)}
input,select,textarea,.multi-select-button{
  border-color:#cfdadd!important;
  background:#fff;
  transition:border-color .16s,box-shadow .16s,transform .16s;
}
input:focus,select:focus,textarea:focus,.multi-select-button:focus{
  border-color:var(--gold)!important;
  box-shadow:0 0 0 3px rgba(198,155,70,.17);
  outline:none;
}
table thead th{background:#edf3f4;color:#17384a;font-size:11px;letter-spacing:.35px}
tbody tr{transition:background .15s}
tbody tr:hover td{background:#fbf8f0}
.badge{background:#edf4f4;color:#174658}
.icon{border-radius:8px}
.kpi-help{display:block;font-size:9px;font-weight:500;color:var(--muted);margin-top:3px}
#toast{border:1px solid rgba(255,255,255,.14)}

/* Better report controls */
.report-filters,.filters{gap:9px}
#reportsView .panel:first-child{overflow:visible}
#reportsView select,#reportsView input{min-height:40px}

/* Mobile */
@media(max-width:760px){
  body{background:#f1f4f5}
  .page{padding:8px 8px 82px}
  .header{position:relative;display:grid;grid-template-columns:1fr;gap:9px;padding:11px 12px;border-radius:14px}
  .header-actions{display:flex;flex-wrap:wrap;gap:7px}
  .brand img{width:46px;height:40px}
  .brand h2{font-size:17px}
  .brand small{display:block;font-size:10px}
  .nav{
    position:fixed;
    bottom:0;left:0;right:0;z-index:55;
    border-radius:16px 16px 0 0;
    padding:7px 6px calc(7px + env(safe-area-inset-bottom));
    display:grid;grid-template-columns:repeat(3,1fr);
    box-shadow:0 -10px 30px rgba(16,39,58,.14)
  }
  .nav button{font-size:11px;padding:10px 4px;min-width:0}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .stat{padding:11px 12px;border-radius:13px}
  .stat span{font-size:10px}.stat b{font-size:20px}
  .panel{border-radius:14px}
  .panel-head{padding:12px;align-items:flex-start;gap:8px}
  .panel-head h3{font-size:16px}
  .filters,.report-filters,.toolbar{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    padding:10px!important;
  }
  .filters>*,
  .report-filters>*,
  .toolbar>*{width:100%!important;min-width:0!important}
  #runReportBtn,#applyFilters,.filters .btn{grid-column:1/-1}
  .admin-grid{padding:10px;gap:10px}
  .admin-card{padding:11px}
  .add-line{display:grid;grid-template-columns:1fr;gap:7px}
  .modal-card{height:100%;max-height:none;border-radius:0}
  .modal{padding:0}
  .list{max-height:36vh}
  #entryPanel .form{
    grid-template-columns:1fr 1fr!important;
    padding:10px!important;
    gap:8px!important
  }
  #entryPanel .field-notes,#entryPanel .compact-actions{grid-column:1/-1!important}
  #entryPanel .compact-actions{display:grid!important;grid-template-columns:1fr 1fr}
  #entryPanel .compact-actions .btn{width:100%}
  #entryPanel #lastEntryText{white-space:normal}
  .report-grid,.comparison-grid,.day-end-grid{grid-template-columns:1fr!important}
  .chart-box{height:260px;padding:8px}
  .comparison-table,.day-end-table,.compact-table{min-width:720px!important}
  .table-wrap{overflow-x:auto!important}

  /* Main entries become clean cards */
  #entryView .table-wrap{overflow:visible!important;padding:8px}
  #entryView table,#entryView tbody,#entryView tr,#entryView td{display:block;width:100%}
  #entryView thead{display:none}
  #entryView tbody tr{
    background:#fff;border:1px solid var(--line);border-radius:14px;
    margin-bottom:10px;padding:7px 11px;box-shadow:0 7px 18px rgba(16,39,58,.06)
  }
  #entryView tbody td{
    display:grid;grid-template-columns:96px minmax(0,1fr);gap:9px;
    padding:7px 0!important;border-bottom:1px dashed #e4eaec!important;
    text-align:left!important
  }
  #entryView tbody td:last-child{border-bottom:0!important}
  #entryView tbody td:before{
    content:attr(data-label);font-size:10px;text-transform:uppercase;
    letter-spacing:.35px;color:var(--muted);font-weight:800
  }
  #entryView .row-actions{justify-content:flex-start}
  #entryView .row-actions button{padding:7px 12px}
}
@media(max-width:430px){
  .stats{grid-template-columns:1fr 1fr}
  .filters,.report-filters,.toolbar{grid-template-columns:1fr!important}
  #entryPanel .form{grid-template-columns:1fr!important}
  #entryPanel .field-notes,#entryPanel .compact-actions{grid-column:auto!important}
  #entryPanel .compact-actions{grid-template-columns:1fr!important}
}

/* Heritage Blue Portal Theme — inspired by the supplied reference */
:root{
  --portal-blue:#0b75ad;
  --portal-blue-dark:#075a88;
  --portal-blue-deep:#08496d;
  --portal-blue-soft:#e8f5fb;
  --portal-orange:#f5a623;
  --portal-orange-dark:#d98500;
  --portal-green:#23a46f;
  --portal-red:#df4b53;
  --portal-yellow:#f7b731;
  --portal-bg:#eef3f6;
  --portal-card:#ffffff;
  --portal-line:#d7e0e5;
  --portal-text:#233642;
  --portal-muted:#71808a;
  --portal-shadow:0 5px 16px rgba(38,73,93,.09);
}
body{
  background:var(--portal-bg)!important;
  color:var(--portal-text)!important;
}
.page{
  max-width:1600px!important;
  padding:14px!important;
}
.header{
  background:linear-gradient(90deg,var(--portal-blue-dark),var(--portal-blue))!important;
  border-radius:0!important;
  box-shadow:0 3px 10px rgba(0,74,112,.20)!important;
  border-bottom:4px solid var(--portal-orange)!important;
  padding:10px 18px!important;
}
.brand img{
  width:56px!important;
  height:46px!important;
  border-radius:4px!important;
  border:1px solid rgba(255,255,255,.55)!important;
  box-shadow:none!important;
}
.brand h2{
  color:#fff!important;
  font-size:19px!important;
}
.brand small{
  color:#dff4ff!important;
}
.header-actions{
  gap:8px!important;
}
.header-actions .badge{
  background:#fff!important;
  color:var(--portal-blue-dark)!important;
  border:1px solid rgba(255,255,255,.65)!important;
}
#crmSyncBadge{
  background:#e9fff7!important;
  color:#117457!important;
  border:1px solid #b7ebd9!important;
}
.nav{
  background:#fff!important;
  border:1px solid var(--portal-line)!important;
  border-radius:0!important;
  box-shadow:none!important;
  padding:0!important;
  overflow:hidden;
}
.nav button{
  border-radius:0!important;
  color:#314957!important;
  background:#fff!important;
  border-right:1px solid var(--portal-line)!important;
  padding:12px 18px!important;
  font-weight:700!important;
}
.nav button:last-child{border-right:0!important}
.nav button:hover{
  background:var(--portal-blue-soft)!important;
  color:var(--portal-blue-dark)!important;
}
.nav button.active{
  background:var(--portal-blue)!important;
  color:#fff!important;
  box-shadow:inset 0 -4px 0 var(--portal-orange)!important;
}
.panel,
.stat,
.admin-card,
.comparison-card,
.login-card{
  background:#fff!important;
  border:1px solid var(--portal-line)!important;
  border-radius:4px!important;
  box-shadow:var(--portal-shadow)!important;
}
.panel-head{
  padding:13px 16px!important;
  border-bottom:1px solid var(--portal-line)!important;
  background:#fff!important;
  border-radius:0!important;
  position:relative;
}
.panel-head:before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;
  width:5px;
  background:var(--portal-blue);
}
.panel-head h3{
  color:var(--portal-blue-deep)!important;
  font-size:18px!important;
}
.panel-head small,.panel-head p{
  color:var(--portal-muted)!important;
}
.stats{
  gap:10px!important;
}
.stat{
  padding:14px 16px!important;
  position:relative;
  overflow:hidden;
}
.stat:before{
  content:""!important;
  position:absolute!important;
  left:0!important;
  top:0!important;
  bottom:0!important;
  width:5px!important;
  background:var(--portal-blue)!important;
}
.stat:nth-child(2):before{background:var(--portal-orange)!important}
.stat:nth-child(3):before{background:var(--portal-green)!important}
.stat:nth-child(4):before{background:#7557c7!important}
.stat:nth-child(5):before{background:var(--portal-red)!important}
.stat span{
  color:var(--portal-muted)!important;
  text-transform:uppercase;
  letter-spacing:.25px;
  font-size:10px!important;
  font-weight:700;
}
.stat b{
  color:var(--portal-blue-deep)!important;
  font-size:25px!important;
}
.btn{
  border-radius:4px!important;
  font-weight:700!important;
  box-shadow:none!important;
  min-height:39px;
}
.btn.primary,
.btn:not(.secondary):not(.danger):not(.success):not(.gold){
  background:var(--portal-blue)!important;
  color:#fff!important;
  border:1px solid var(--portal-blue-dark)!important;
}
.btn.primary:hover,
.btn:not(.secondary):not(.danger):not(.success):not(.gold):hover{
  background:var(--portal-blue-dark)!important;
}
.btn.secondary{
  background:#fff!important;
  color:var(--portal-blue-dark)!important;
  border:1px solid #a9c2d0!important;
}
.btn.secondary:hover{
  background:var(--portal-blue-soft)!important;
}
.btn.success{
  background:var(--portal-green)!important;
  color:#fff!important;
  border:1px solid #15845a!important;
}
.btn.danger{
  background:#fff!important;
  color:var(--portal-red)!important;
  border:1px solid #e8a9ae!important;
}
.btn.danger:hover{
  background:#fff1f2!important;
}
.btn.gold,
#loginBtn{
  background:var(--portal-orange)!important;
  color:#fff!important;
  border:1px solid var(--portal-orange-dark)!important;
}
.btn.gold:hover,#loginBtn:hover{
  background:var(--portal-orange-dark)!important;
}
.header-actions .btn,
.header-actions button{
  background:#fff!important;
  color:var(--portal-blue-deep)!important;
  border:1px solid #d7e2e8!important;
}
.header-actions .btn:hover,
.header-actions button:hover{
  background:var(--portal-orange)!important;
  color:#fff!important;
  border-color:var(--portal-orange-dark)!important;
}
.header-actions .active,
.header-actions button.active{
  background:var(--portal-orange)!important;
  color:#fff!important;
  border-color:var(--portal-orange-dark)!important;
}
input,select,textarea,.multi-select-button{
  background:#fff!important;
  border:1px solid #cbd8df!important;
  color:var(--portal-text)!important;
  border-radius:3px!important;
  min-height:39px;
}
input:focus,select:focus,textarea:focus,.multi-select-button:focus{
  outline:none!important;
  border-color:var(--portal-blue)!important;
  box-shadow:0 0 0 3px rgba(11,117,173,.13)!important;
}
label{
  color:#425965!important;
  font-weight:600!important;
}
.toolbar,.filters,.report-filters{
  background:#f8fbfc!important;
  border-bottom:1px solid var(--portal-line)!important;
}
.table-wrap{
  background:#fff!important;
}
table thead th,
th{
  background:var(--portal-blue-deep)!important;
  color:#fff!important;
  border-color:#0c5f8b!important;
  font-size:11px!important;
  text-transform:uppercase;
  letter-spacing:.25px;
}
td{
  border-bottom:1px solid #e5ecef!important;
  color:#344b58!important;
}
tbody tr:nth-child(even) td{
  background:#f9fbfc!important;
}
tbody tr:hover td{
  background:#eaf6fb!important;
}
.badge{
  background:var(--portal-blue-soft)!important;
  color:var(--portal-blue-dark)!important;
  border:1px solid #b9ddec!important;
  border-radius:3px!important;
  font-weight:700!important;
}
.badge.conversion-badge{
  background:#dcfce7!important;
  color:#166534!important;
  border-color:#86d5a2!important;
  box-shadow:0 1px 2px rgba(22,101,52,.12)!important;
}
.admin-badge{
  background:#fff5dd!important;
  color:#906000!important;
  border-color:#f3cf80!important;
}
.list-item{
  border:1px solid #e1e8ec!important;
  background:#fbfcfd!important;
  border-radius:3px!important;
}
.list-item:hover{
  background:var(--portal-blue-soft)!important;
}
.icon{
  border-radius:3px!important;
}
.admin-card h4{
  color:var(--portal-blue-deep)!important;
  border-bottom:2px solid var(--portal-blue-soft);
  padding-bottom:8px;
}
.login{
  background:
    linear-gradient(rgba(7,90,136,.92),rgba(7,90,136,.92)),
    linear-gradient(135deg,#0b75ad,#08496d)!important;
}
.login-card{
  border-top:5px solid var(--portal-orange)!important;
  max-width:410px!important;
}
.login-card h1{
  color:var(--portal-blue-deep)!important;
}
#toast{
  background:var(--portal-blue-deep)!important;
  color:#fff!important;
  border-left:5px solid var(--portal-orange)!important;
  border-radius:3px!important;
}
.compact-report{
  border:1px solid var(--portal-line)!important;
  background:#fff!important;
}
.compact-header{
  background:linear-gradient(90deg,var(--portal-blue-deep),var(--portal-blue))!important;
  border-radius:3px!important;
  border-left:7px solid var(--portal-orange)!important;
}
.compact-branch{
  background:var(--portal-orange)!important;
  color:#fff!important;
  border-radius:3px!important;
}
.compact-kpi{
  border-radius:3px!important;
}
.compact-kpi.navy{background:var(--portal-blue-deep)!important}
.compact-kpi.gold{background:var(--portal-orange)!important}
.compact-kpi.green{background:var(--portal-green)!important}
.compact-kpi.red{background:var(--portal-red)!important}
.day-end-table th{
  background:var(--portal-blue-deep)!important;
}
.day-side .panel-head,
.comparison-card .panel-head{
  background:var(--portal-blue-soft)!important;
}
.kpi-help{
  color:#8aa0ad!important;
}
.modal-card{
  border-radius:4px!important;
}
.modal-head{
  background:var(--portal-blue)!important;
  color:#fff!important;
  border-bottom:4px solid var(--portal-orange)!important;
}
.modal-head h3,.modal-head small{
  color:#fff!important;
}

/* Make every action readable */
button:disabled,
.btn:disabled{
  opacity:.55!important;
  color:#5e6e77!important;
}
#dayEndView button,
#reportsView button,
#entryView button,
#adminModal button{
  color:inherit;
}
#dayEndView .btn.primary,
#reportsView .btn.primary,
#entryView .btn.primary,
#adminModal .btn.primary{
  color:#fff!important;
}
#dayEndView .btn.secondary,
#reportsView .btn.secondary,
#entryView .btn.secondary,
#adminModal .btn.secondary{
  color:var(--portal-blue-dark)!important;
}

/* Desktop portal proportions */
@media(min-width:1101px){
  .layout{
    grid-template-columns:390px minmax(0,1fr)!important;
  }
  .form{
    padding:14px!important;
  }
  .panel-head{
    min-height:58px;
  }
}

/* Mobile */
@media(max-width:760px){
  .page{padding:7px 7px 78px!important}
  .header{
    border-radius:0!important;
    padding:8px 10px!important;
    border-bottom-width:3px!important;
  }
  .brand h2{font-size:16px!important}
  .header-actions{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    width:100%;
  }
  .header-actions>*{
    width:100%!important;
    text-align:center!important;
    justify-content:center!important;
  }
  .nav{
    position:fixed!important;
    bottom:0!important;
    left:0!important;
    right:0!important;
    z-index:60!important;
    display:grid!important;
    grid-template-columns:repeat(3,1fr)!important;
    border-top:3px solid var(--portal-orange)!important;
    box-shadow:0 -4px 14px rgba(35,70,90,.14)!important;
  }
  .nav button{
    padding:10px 4px!important;
    font-size:11px!important;
    border-right:1px solid var(--portal-line)!important;
  }
  .stats{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .panel,.stat,.admin-card,.comparison-card{
    border-radius:3px!important;
  }
  .filters,.report-filters,.toolbar{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:7px!important;
  }
  .filters>*,.report-filters>*,.toolbar>*{
    width:100%!important;
  }
  #entryPanel .form{
    grid-template-columns:1fr!important;
  }
  #entryPanel .compact-actions{
    grid-template-columns:1fr!important;
  }
  .modal-card{
    border-radius:0!important;
  }
  #entryView tbody tr{
    border-radius:3px!important;
    border-top:4px solid var(--portal-blue)!important;
  }
  #entryView tbody td:before{
    color:var(--portal-blue-dark)!important;
  }
}

/* Alignment and spacing refinement */
.page{
  max-width:1580px!important;
  margin:0 auto!important;
  padding:14px 16px 22px!important;
}
.header{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
}
.brand{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  min-width:250px!important;
}
.header-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  flex-wrap:wrap!important;
  gap:8px!important;
}
.nav{
  display:flex!important;
  align-items:stretch!important;
  justify-content:flex-end!important;
  width:auto!important;
  margin:0!important;
}
.nav button{
  min-width:92px!important;
  white-space:nowrap!important;
}
.stats{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:12px!important;
  margin:14px 0 18px!important;
}
.layout{
  display:grid!important;
  grid-template-columns:minmax(390px,420px) minmax(0,1fr)!important;
  gap:16px!important;
  align-items:start!important;
}
.layout > *{
  min-width:0!important;
}
#entryPanel{
  position:sticky!important;
  top:12px!important;
}
#entryPanel .form{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px 12px!important;
  padding:14px!important;
  align-items:start!important;
}
#entryPanel .field{
  min-width:0!important;
}
#entryPanel .field input,
#entryPanel .field select,
#entryPanel .field textarea,
#entryPanel .multi-select-button{
  width:100%!important;
}
#entryPanel .field-notes,
#entryPanel .compact-actions{
  grid-column:1/-1!important;
}
#entryPanel .compact-actions{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,.8fr)!important;
  gap:8px!important;
  align-items:center!important;
}
#entryPanel .compact-actions .btn{
  width:100%!important;
}
#entryView{
  min-width:0!important;
}
#entryView .panel-head{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:12px!important;
}
#entryView .toolbar{
  display:grid!important;
  grid-template-columns:150px minmax(210px,1fr) 170px 160px 180px!important;
  gap:8px!important;
  align-items:center!important;
  padding:10px 14px!important;
}
#entryView .toolbar > *{
  width:100%!important;
  min-width:0!important;
}
#entryView .multi-select{
  position:relative!important;
}
#entryView .multi-select-dropdown{
  left:0!important;
  right:auto!important;
  width:100%!important;
  min-width:240px!important;
  max-width:320px!important;
  z-index:80!important;
}
#entryView .table-wrap{
  overflow:auto!important;
  max-height:560px!important;
}
#entryView table{
  width:100%!important;
  min-width:1040px!important;
  table-layout:fixed!important;
}
#entryView th,
#entryView td{
  vertical-align:middle!important;
}
#entryView th:nth-child(1),#entryView td:nth-child(1){width:125px!important}
#entryView th:nth-child(2),#entryView td:nth-child(2){width:180px!important}
#entryView th:nth-child(3),#entryView td:nth-child(3){width:70px!important;text-align:center!important}
#entryView th:nth-child(4),#entryView td:nth-child(4){width:130px!important}
#entryView th:nth-child(5),#entryView td:nth-child(5){width:150px!important}
#entryView th:nth-child(6),#entryView td:nth-child(6){width:160px!important}
#entryView th:nth-child(7),#entryView td:nth-child(7){width:120px!important}
#entryView th:nth-child(8),#entryView td:nth-child(8){width:90px!important}
#entryView th:nth-child(9),#entryView td:nth-child(9){width:90px!important;text-align:center!important}
#entryView td{
  white-space:normal!important;
  word-break:break-word!important;
}
#entryView .row-actions{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:5px!important;
}
#entryView .row-actions button{
  width:100%!important;
  min-width:0!important;
}
.panel-head .right-actions,
.panel-head .actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  flex-wrap:wrap!important;
}
.report-filters,.filters{
  align-items:end!important;
}
.admin-grid{
  align-items:start!important;
}
.admin-card{
  min-width:0!important;
}
.list-item{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
}
.list-item > span:first-child{
  min-width:0!important;
  overflow-wrap:anywhere!important;
}
.list-item > span:last-child{
  display:flex!important;
  gap:5px!important;
  flex-shrink:0!important;
}

/* Medium desktop */
@media(max-width:1280px){
  .layout{
    grid-template-columns:360px minmax(0,1fr)!important;
  }
  #entryView .toolbar{
    grid-template-columns:140px minmax(180px,1fr) 150px 145px 160px!important;
  }
  .header{
    align-items:flex-start!important;
  }
  .header-actions{
    max-width:760px!important;
  }
}

/* Tablet */
@media(max-width:1050px){
  .header{
    flex-direction:column!important;
    align-items:stretch!important;
  }
  .header-actions{
    justify-content:flex-start!important;
    max-width:none!important;
  }
  .nav{
    justify-content:flex-start!important;
    overflow-x:auto!important;
  }
  .layout{
    grid-template-columns:1fr!important;
  }
  #entryPanel{
    position:static!important;
  }
  #entryView .toolbar{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #entryView .toolbar > :last-child{
    grid-column:1/-1!important;
  }
  .stats{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}

/* Mobile */
@media(max-width:760px){
  .page{
    padding:7px 7px 82px!important;
  }
  .header{
    gap:10px!important;
  }
  .brand{
    min-width:0!important;
  }
  .header-actions{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .nav{
    display:grid!important;
    grid-template-columns:repeat(3,1fr)!important;
    width:100%!important;
  }
  .nav button{
    min-width:0!important;
  }
  .stats{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  #entryPanel .form{
    grid-template-columns:1fr!important;
  }
  #entryPanel .field-notes,
  #entryPanel .compact-actions{
    grid-column:auto!important;
  }
  #entryPanel .compact-actions{
    grid-template-columns:1fr!important;
  }
  #entryView .toolbar{
    grid-template-columns:1fr!important;
  }
  #entryView .toolbar > :last-child{
    grid-column:auto!important;
  }
  #entryView .multi-select-dropdown{
    min-width:100%!important;
    max-width:none!important;
  }
  #entryView .table-wrap{
    max-height:none!important;
    overflow:visible!important;
  }
  #entryView table{
    min-width:0!important;
    table-layout:auto!important;
  }
  #entryView .row-actions{
    flex-direction:row!important;
  }
  #entryView .row-actions button{
    width:auto!important;
  }
}

/* Clean, compact product multi-selection */
#productDropdownMenu{
  min-width:100%!important;
  width:100%!important;
  max-width:340px!important;
  padding:6px!important;
  border:1px solid #b8ccd7!important;
  border-top:3px solid var(--portal-blue)!important;
  border-radius:4px!important;
  background:#fff!important;
}
#productDropdownMenu .multi-select-option{
  display:grid!important;
  grid-template-columns:18px minmax(0,1fr)!important;
  align-items:center!important;
  justify-content:start!important;
  gap:9px!important;
  width:100%!important;
  min-height:34px!important;
  margin:0!important;
  padding:7px 9px!important;
  border-bottom:1px solid #edf1f3!important;
  border-radius:2px!important;
  color:#294451!important;
  text-align:left!important;
  cursor:pointer!important;
  line-height:1.25!important;
}
#productDropdownMenu .multi-select-option:last-child{
  border-bottom:0!important;
}
#productDropdownMenu .multi-select-option:hover{
  background:#eaf6fb!important;
  color:var(--portal-blue-dark)!important;
}
#productDropdownMenu .multi-select-option input[type="checkbox"]{
  appearance:auto!important;
  -webkit-appearance:checkbox!important;
  width:16px!important;
  height:16px!important;
  min-width:16px!important;
  min-height:16px!important;
  max-width:16px!important;
  max-height:16px!important;
  margin:0!important;
  padding:0!important;
  border-radius:2px!important;
  box-shadow:none!important;
  accent-color:var(--portal-blue)!important;
  cursor:pointer!important;
}
#productDropdownMenu .multi-select-option span{
  display:block!important;
  min-width:0!important;
  width:auto!important;
  margin:0!important;
  padding:0!important;
  color:inherit!important;
  font-size:13px!important;
  font-weight:600!important;
  line-height:1.3!important;
  text-align:left!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}
#productDropdownBtn{
  min-height:39px!important;
  padding:8px 10px!important;
}
#productDropdownText{
  text-align:left!important;
  font-weight:500!important;
}
@media(max-width:760px){
  #productDropdownMenu{
    max-width:none!important;
    max-height:300px!important;
  }
  #productDropdownMenu .multi-select-option{
    min-height:40px!important;
    padding:9px 10px!important;
  }
  #productDropdownMenu .multi-select-option input[type="checkbox"]{
    width:18px!important;
    height:18px!important;
    min-width:18px!important;
    min-height:18px!important;
    max-width:18px!important;
    max-height:18px!important;
  }
}

#productDropdownMenu{
  padding:0!important;
  overflow:hidden!important;
}
#productDropdownMenu .product-search-wrap{
  position:sticky!important;
  top:0!important;
  z-index:5!important;
  padding:8px!important;
  background:#f6fafc!important;
  border-bottom:1px solid #d8e3e8!important;
}
#productSearchInput{
  width:100%!important;
  min-height:36px!important;
  padding:7px 10px 7px 33px!important;
  border:1px solid #abc7d5!important;
  border-radius:3px!important;
  background:
    linear-gradient(#fff,#fff) padding-box!important;
  color:#263f4d!important;
  font-size:13px!important;
}
#productSearchInput:focus{
  border-color:var(--portal-blue)!important;
  box-shadow:0 0 0 3px rgba(11,117,173,.12)!important;
}
#productDropdownMenu .product-search-wrap:before{
  content:"⌕";
  position:absolute;
  left:18px;
  top:15px;
  z-index:6;
  color:#6d8795;
  font-size:18px;
  line-height:1;
  pointer-events:none;
}
#productOptionsList{
  max-height:250px!important;
  overflow-y:auto!important;
  padding:5px!important;
}
.product-no-results{
  padding:18px 12px!important;
  text-align:center!important;
  color:#71808a!important;
  font-size:12px!important;
}
@media(max-width:760px){
  #productOptionsList{
    max-height:270px!important;
  }
  #productSearchInput{
    min-height:42px!important;
    font-size:14px!important;
  }
}

#productDropdownMenu .multi-select-option.product-filter-hidden{
  display:none!important;
}

#entryView tbody tr:first-child{animation:newEntryFlash .75s ease-out}
@keyframes newEntryFlash{
  0%{background:#fff2bd;transform:translateY(-2px)}
  100%{background:transparent;transform:none}
}

/* Performance */
.panel,.stat,.admin-card,.comparison-card{contain:layout paint}
.table-wrap{content-visibility:auto;contain-intrinsic-size:600px}
button,input,select,textarea{touch-action:manipulation}

/* Master dashboard */
.master-live-dashboard{margin:14px 0 17px}
.master-live-panel{overflow:hidden}
.master-live-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important}
.master-live-controls{display:grid;grid-template-columns:145px 145px 165px minmax(210px,1fr) 80px 90px;gap:7px;align-items:center;flex:1;max-width:1040px}
.master-live-controls>*{width:100%;min-width:0}
.master-live-stats{padding:12px;grid-template-columns:repeat(4,minmax(0,1fr))!important}
.master-live-stats small{display:block;margin-top:4px;line-height:1.35}
.master-live-table-title{border-top:1px solid var(--line);display:flex!important;align-items:center!important;justify-content:space-between!important}
.master-live-table-wrap{max-height:520px;overflow:auto}
.master-live-table{width:100%;min-width:1180px;table-layout:fixed}
.master-live-table th:nth-child(1){width:120px}.master-live-table th:nth-child(2){width:80px}
.master-live-table th:nth-child(3){width:175px}.master-live-table th:nth-child(4){width:65px}
.master-live-table th:nth-child(5){width:130px}.master-live-table th:nth-child(6){width:145px}
.master-live-table th:nth-child(7){width:170px}.master-live-table th:nth-child(8){width:110px}
.master-live-table th:nth-child(9){width:90px}.master-live-table th:nth-child(10){width:90px}
.master-live-table .row-actions{display:flex;flex-direction:column;gap:4px}
.master-live-table .row-actions button{width:100%}

@media(max-width:1050px){
 .header{display:grid!important;grid-template-columns:1fr!important;gap:9px!important}
 .header-actions{display:flex!important;flex-wrap:wrap!important;justify-content:flex-start!important}
 .layout{grid-template-columns:1fr!important}
 #entryPanel{position:static!important}
 .master-live-head{align-items:stretch!important;flex-direction:column!important}
 .master-live-controls{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none}
 .master-live-controls #masterLiveSearch{grid-column:1/-1}
 .stats{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

@media(max-width:760px){
 body{overflow-x:hidden}
 .page{padding:7px 7px 84px!important}
 .header{padding:9px 10px!important}
 .brand{min-width:0!important}
 .brand h2{font-size:16px!important}
 .header-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important;gap:6px!important}
 .header-actions>*{width:100%!important;min-width:0!important;text-align:center!important;justify-content:center!important}
 #crmSyncBadge{grid-column:1/-1}
 .nav{position:fixed!important;left:0!important;right:0!important;bottom:0!important;z-index:100!important;display:grid!important;grid-template-columns:repeat(3,1fr)!important;width:100%!important;border-top:3px solid var(--portal-orange,#f5a623)!important}
 .nav button{min-width:0!important;padding:10px 4px!important;font-size:11px!important}
 .stats,.master-live-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important}
 #entryPanel .form,#entryPanel .two{grid-template-columns:1fr!important}
 #entryPanel .compact-actions{grid-template-columns:1fr!important}
 .toolbar,.filters,.report-filters{display:grid!important;grid-template-columns:1fr!important;gap:7px!important}
 .toolbar>*,.filters>*,.report-filters>*{width:100%!important;min-width:0!important}
 .master-live-controls{grid-template-columns:1fr 1fr!important}
 .master-live-controls #masterLiveSearch{grid-column:1/-1}
 .master-live-table-wrap{max-height:none;overflow:visible!important;padding:8px}
 .master-live-table,.master-live-table tbody,.master-live-table tr,.master-live-table td{display:block!important;width:100%!important;min-width:0!important}
 .master-live-table thead{display:none!important}
 .master-live-table tr{background:#fff;border:1px solid #d7e0e5;border-top:4px solid var(--portal-blue,#0b75ad);margin-bottom:10px;padding:7px 10px}
 .master-live-table td{display:grid!important;grid-template-columns:96px minmax(0,1fr)!important;gap:8px;padding:7px 0!important;border-bottom:1px dashed #e1e8ec!important}
 .master-live-table td:last-child{border-bottom:0!important}
 .master-live-table td:before{content:attr(data-label);font-size:10px;text-transform:uppercase;font-weight:800;color:var(--portal-blue-dark,#075a88)}
 .master-live-table .row-actions{flex-direction:row!important}
 .master-live-table .row-actions button{width:auto!important;flex:1}
 .modal{padding:0!important}
 .modal-card{width:100%!important;height:100%!important;max-height:none!important;border-radius:0!important}
}

@media(max-width:430px){
 .stats,.master-live-stats{grid-template-columns:1fr 1fr!important}
 .master-live-controls{grid-template-columns:1fr!important}
 .master-live-controls #masterLiveSearch{grid-column:auto}
 .header-actions{grid-template-columns:1fr 1fr!important}
}

.salesman-load-status{display:block;margin-top:4px;font-size:10px;line-height:1.25;color:#4d7183}
.salesman-load-status.warning{color:#c0392b;font-weight:700}

body:not(.crm-logged-in){overflow:hidden!important}
#loginScreen:not(.hidden){position:fixed!important;inset:0!important;z-index:99999!important;min-height:100vh!important;height:100vh!important;overflow:auto!important}
#loginScreen:not(.hidden) + #app{display:none!important}
.day-end-grid{display:none!important}
/* Feature update: multi-status, material selector, login credit */
.login-version-credit{margin-top:16px;text-align:center;font-size:12px;color:#91a0a8;font-weight:500}
.status-multi-wrap{position:relative}.status-multi-button{width:100%;min-height:38px;border:1px solid #cbd8df;background:#fff;border-radius:4px;padding:8px 10px;display:flex;justify-content:space-between;align-items:center;text-align:left;color:#314b5c}.status-multi-button.selected{border-color:#0b75ad}.status-multi-menu{position:absolute;left:0;top:calc(100% + 4px);z-index:1600;background:#fff;border:1px solid #cbd8df;border-radius:6px;box-shadow:0 12px 24px rgba(0,0,0,.12);padding:6px;max-height:280px;overflow:auto;width:max-content;min-width:100%;max-width:320px}.status-multi-option{display:flex;gap:10px;align-items:center;padding:9px 10px;border-radius:5px;cursor:pointer;white-space:nowrap;min-width:205px}.status-multi-option input[type="checkbox"]{width:17px;height:17px;min-width:17px;margin:0;flex:0 0 17px}.status-multi-option span{display:block;line-height:1.2}.status-multi-option:hover{background:#eef7fb}.status-multi-option.conversion-status{background:#e8f7ed;border:1px solid #b9e4c6;color:#176b37;font-weight:700}.status-multi-option.conversion-status:hover{background:#dcf2e4}.status-limit-note{display:block;margin-top:4px;font-size:10px;color:#6b7280}.material-select{font-weight:700}.material-badge{display:inline-block;padding:3px 7px;border:1px solid #cbd8df;border-radius:999px;background:#f7fafb;font-size:11px;white-space:nowrap}
/* Compact latest-entries table: preserve the original CRM row density with Material added */
@media(min-width:761px){
  #entryView .table-wrap{max-height:560px!important;overflow:auto!important}
  #entryView .entries-table{width:100%!important;min-width:1100px!important;table-layout:fixed!important;height:auto!important}
  #entryView .entries-table thead,#entryView .entries-table tbody{height:auto!important}
  #entryView .entries-table tr{height:auto!important;min-height:0!important}
  #entryView .entries-table th{padding:7px 7px!important;height:30px!important;line-height:16px!important;vertical-align:middle!important;white-space:nowrap!important}
  #entryView .entries-table td{padding:7px 7px!important;height:auto!important;min-height:0!important;line-height:16px!important;vertical-align:middle!important;white-space:normal!important;word-break:normal!important;overflow-wrap:normal!important}
  #entryView .entries-table th:nth-child(1),#entryView .entries-table td:nth-child(1){width:120px!important}
  #entryView .entries-table th:nth-child(2),#entryView .entries-table td:nth-child(2){width:165px!important}
  #entryView .entries-table th:nth-child(3),#entryView .entries-table td:nth-child(3){width:65px!important}
  #entryView .entries-table th:nth-child(4),#entryView .entries-table td:nth-child(4){width:125px!important}
  #entryView .entries-table th:nth-child(5),#entryView .entries-table td:nth-child(5){width:150px!important}
  #entryView .entries-table th:nth-child(6),#entryView .entries-table td:nth-child(6){width:160px!important}
  #entryView .entries-table th:nth-child(7),#entryView .entries-table td:nth-child(7){width:90px!important}
  #entryView .entries-table th:nth-child(8),#entryView .entries-table td:nth-child(8){width:125px!important}
  #entryView .entries-table th:nth-child(9),#entryView .entries-table td:nth-child(9){width:75px!important}
  #entryView .entries-table th:nth-child(10),#entryView .entries-table td:nth-child(10){width:82px!important}
  #entryView .entries-table td:nth-child(7),#entryView .entries-table td:nth-child(9){white-space:nowrap!important}
  #entryView .entries-table .badge,#entryView .entries-table .material-badge{padding:3px 7px!important;line-height:15px!important}
  #entryView .entries-table .row-actions{display:flex!important;flex-direction:column!important;gap:4px!important}
  #entryView .entries-table .row-actions button{padding:4px 6px!important;line-height:15px!important}
}

.master-branch-reports-head{padding:14px 12px 8px;border-top:1px solid var(--line)}.master-branch-reports-head h3{margin:0;color:var(--navy)}
.master-branch-daily-reports{display:grid;grid-template-columns:1fr;gap:18px;padding:8px 12px 18px}
.master-branch-report-card{background:#fff;border:1px solid #cbd8df;border-radius:7px;overflow:hidden}
.master-branch-report-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:linear-gradient(90deg,#075b83,#0c78ad);border-left:5px solid #f5a623;color:#fff}
.master-branch-report-header h4{margin:0 0 4px;font-size:18px}.master-branch-report-header small{color:#fff}.master-branch-badge{background:#f5a623;color:#fff;padding:10px 17px;font-weight:800;border-radius:3px}
.master-branch-report-table{width:100%;min-width:1000px}.master-branch-report-table thead{background:#071633;color:#fff}.master-branch-report-table th,.master-branch-report-table td{padding:8px 9px;border-bottom:1px solid #d9e2e7;font-size:12px}.master-branch-report-table tbody tr:nth-child(even){background:#f7f9fb}
.master-branch-summary{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));background:#f5f7f9;border-top:1px solid #d5dfe5}.master-branch-summary>div{text-align:center;padding:10px 5px;border-right:1px solid #d5dfe5}.master-branch-summary span{display:block;color:#70818b;font-size:10px}.master-branch-summary b{display:block;color:#071633;font-size:17px;margin-top:3px}
.master-month-comparison{margin:6px 12px 18px;border:1px solid var(--line);border-radius:7px;background:#fff;overflow:hidden}.master-month-head{display:flex!important;align-items:center!important;justify-content:space-between!important}.master-month-controls{display:flex;gap:7px;align-items:end}.master-range-field{display:grid;gap:3px}.master-range-field span{font-size:11px;font-weight:700;color:var(--muted)}.master-month-cards{padding:12px;grid-template-columns:repeat(4,minmax(0,1fr))!important}
.master-month-table{width:100%;min-width:920px}.master-month-table th,.master-month-table td{padding:10px;border-bottom:1px solid var(--line);text-align:left}.master-month-table thead{background:#075b83;color:#fff}.positive{color:#087a45;font-weight:700}.negative{color:#c0392b;font-weight:700}
.master-month-insights{padding:14px 16px;background:#f7fafb;border-top:1px solid var(--line)}.master-month-insights h4{margin:0 0 10px;color:var(--navy)}.master-insight-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.master-insight-grid>div{background:#fff;border:1px solid #dce5ea;border-left:4px solid #0b75ad;padding:10px;border-radius:4px}
.product-comparison-table{min-width:1280px!important}.product-comparison-table th,.product-comparison-table td{text-align:center!important}.product-comparison-table .product-name-head,.product-comparison-table tbody td:first-child,.product-comparison-table tfoot td:first-child{text-align:left!important}.product-outlet-head{font-size:14px!important;border-left:3px solid rgba(255,255,255,.65)!important}.product-outlet-head.ocean{background:#0877a9}.product-outlet-head.dml{background:#d98c00}.product-outlet-head.dmc{background:#118456}.product-outlet-head.lucky{background:#6448b8}.product-outlet-head.combined{background:#071633}.product-comparison-table .sold-head{background:#167a51!important}.product-comparison-table .booked-head{background:#a96d00!important}.product-comparison-table tbody td:nth-child(even){background:#edf8f3}.product-comparison-table tbody td:nth-child(odd):not(:first-child){background:#fff7e8}.product-comparison-table tbody td:nth-child(10),.product-comparison-table tbody td:nth-child(11){font-weight:800;background:#edf3f7!important}.product-comparison-table tfoot td,.product-comparison-table tfoot tr:hover td{background:#071633!important;color:#fff!important;font-weight:800;border-top:3px solid #f5a623}
.master-menu-wrap{position:relative}.master-menu-button{display:flex;align-items:center;gap:7px}.master-menu-button span:first-child{font-size:20px;line-height:1}.master-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:120;background:#fff;border:1px solid #d6e0e6;border-radius:8px;box-shadow:0 16px 34px rgba(16,39,58,.22);padding:6px;min-width:245px}.master-menu button{display:block;width:100%;border:0;background:#fff;color:var(--navy);padding:11px 12px;text-align:left;border-radius:5px;font-weight:700;cursor:pointer}.master-menu button:hover,.master-menu button:focus{background:#eef7fb}.deleted-audit-item>span:first-child{display:grid;gap:4px}.deleted-audit-item small{display:block;line-height:1.4}
@media(max-width:900px){.master-branch-summary{grid-template-columns:repeat(4,minmax(0,1fr))}.master-month-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}.master-insight-grid{grid-template-columns:1fr}.master-month-head{align-items:stretch!important;flex-direction:column!important}.master-month-controls{display:grid;grid-template-columns:1fr 1fr}}
@media(max-width:520px){.master-branch-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.master-month-cards{grid-template-columns:1fr 1fr!important}.master-month-controls{grid-template-columns:1fr}}

/* Keep selected products at the top and visibly selected. */
#productDropdownMenu .multi-select-option:has(input:checked){
  background:#eaf5fb!important;
  border-left:3px solid #0b75ad!important;
  font-weight:700!important;
}
#productDropdownMenu .multi-select-option{cursor:pointer!important}
#productDropdownMenu .multi-select-option span{flex:1;min-width:0}

/* Keep Edit/Delete visible on the right without widening the whole table. */
@media(min-width:761px){
  #entryView .entries-table{min-width:1040px!important}
  #entryView .entries-table th:nth-child(1),#entryView .entries-table td:nth-child(1){width:112px!important}
  #entryView .entries-table th:nth-child(2),#entryView .entries-table td:nth-child(2){width:145px!important}
  #entryView .entries-table th:nth-child(3),#entryView .entries-table td:nth-child(3){width:55px!important}
  #entryView .entries-table th:nth-child(4),#entryView .entries-table td:nth-child(4){width:110px!important}
  #entryView .entries-table th:nth-child(5),#entryView .entries-table td:nth-child(5){width:135px!important}
  #entryView .entries-table th:nth-child(6),#entryView .entries-table td:nth-child(6){width:145px!important}
  #entryView .entries-table th:nth-child(7),#entryView .entries-table td:nth-child(7){width:82px!important}
  #entryView .entries-table th:nth-child(8),#entryView .entries-table td:nth-child(8){width:118px!important}
  #entryView .entries-table th:nth-child(9),#entryView .entries-table td:nth-child(9){width:70px!important}
  #entryView .entries-table th:nth-child(10),#entryView .entries-table td:nth-child(10){
    width:78px!important;min-width:78px!important;max-width:78px!important;
    position:sticky!important;right:0!important;z-index:4!important;
    background:#fff!important;box-shadow:-5px 0 8px rgba(15,54,78,.06)!important;
  }
  #entryView .entries-table th:nth-child(10){background:#07577f!important;color:#fff!important;z-index:8!important}
  #entryView .entries-table tbody tr:nth-child(even) td:nth-child(10){background:#f8fafb!important}
  #entryView .entries-table .row-actions{display:grid!important;grid-template-columns:1fr!important;gap:3px!important}
  #entryView .entries-table .row-actions button{width:100%!important;padding:3px 4px!important;font-size:10px!important}
}