
:root{
  --navy:#07162d;
  --navy2:#101828;
  --red:#e1121a;
  --red2:#bf0e14;
  --green:#16c653;
  --green2:#0da541;
  --bg:#f3f6f9;
  --card:#ffffff;
  --line:#e4e7ec;
  --muted:#667085;
  --text:#101828;
  --softred:#fff1f1;
  --softgreen:#edfbea;
  --radius:18px;
  --shadow:0 12px 34px rgba(15,23,42,.08);
}
*{box-sizing:border-box}
html{margin-top:0!important}
body.hsbp-body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
body.hsbp-body #wpadminbar{display:none!important}
button,input,textarea,select{font:inherit}
button,a{ -webkit-tap-highlight-color:transparent }
a{text-decoration:none;color:inherit}
.hsbp-body input,.hsbp-body textarea,.hsbp-body select{
  outline:none;transition:border .18s,box-shadow .18s;background:#fff;color:var(--text)
}
.hsbp-body input:focus,.hsbp-body textarea:focus,.hsbp-body select:focus{
  border-color:#98a2b3!important;box-shadow:0 0 0 3px rgba(225,18,26,.08)
}
.hsbp-login-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at top right,#fff 0,#f3f6f9 42%,#e9eef4 100%)}
.hsbp-login-card{width:min(440px,100%);background:#fff;border:1px solid #e7eaf0;border-radius:28px;padding:32px;box-shadow:0 28px 80px rgba(15,23,42,.14)}
.hsbp-login-card>img{width:150px;display:block;margin:0 auto 14px}
.hsbp-login-card h1{text-align:center;font-size:28px;margin:10px 0 4px}.hsbp-login-card h1 em{color:var(--red);font-style:normal}
.hsbp-login-card>p{text-align:center;color:var(--muted);margin:0 0 22px}
.hsbp-pill{display:table;margin:0 auto;background:#fff0f0;color:var(--red);font-size:10px;font-weight:900;letter-spacing:.12em;padding:7px 10px;border-radius:99px}
.hsbp-login-card label{display:block;font-size:12px;font-weight:800;margin:10px 0 5px}
.hsbp-login-card input[type=text],.hsbp-login-card input[type=password]{width:100%;border:1px solid #d0d5dd;border-radius:12px;padding:13px}
.hsbp-login-card input[type=submit]{width:100%;border:0;border-radius:12px;padding:14px;background:var(--red);color:#fff;font-weight:900;margin-top:8px}
.hsbp-login-card .login-remember{font-size:12px}
.hsbp-app{min-height:100vh;display:grid;grid-template-columns:238px 1fr}
.hsbp-sidebar{background:linear-gradient(180deg,#06162e,#071a35 62%,#041326);color:#fff;padding:22px 16px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;z-index:50}
.hsbp-side-brand{display:flex;align-items:center;gap:10px;padding:3px 6px 20px;border-bottom:1px solid rgba(255,255,255,.08)}
.hsbp-side-brand img{width:62px;height:48px;object-fit:contain;background:#fff;border-radius:10px;padding:4px}
.hsbp-side-brand div{display:flex;flex-direction:column}.hsbp-side-brand b{font-size:13px;letter-spacing:.04em}.hsbp-side-brand span{font-size:10px;color:#94a3b8;margin-top:3px}
.hsbp-nav{display:grid;gap:6px;margin-top:18px}
.hsbp-nav a{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:11px;color:#d8e1ec;font-size:13px;font-weight:700}
.hsbp-nav a i{font-style:normal;width:20px;text-align:center;font-size:16px}
.hsbp-nav a:hover,.hsbp-nav a.active{background:rgba(255,255,255,.08);color:#fff}
.hsbp-nav a.newbill{background:linear-gradient(180deg,#ef151d,#ce0e15);color:#fff;margin-bottom:8px;box-shadow:0 7px 18px rgba(225,18,26,.25)}
.hsbp-side-foot{margin-top:auto;display:grid;gap:16px}
.hsbp-license{border:1px solid rgba(255,255,255,.18);border-radius:13px;padding:12px;display:grid;grid-template-columns:26px 1fr;column-gap:6px}
.hsbp-license>span{grid-row:1/3;color:#ffd34d;font-size:20px}.hsbp-license b{font-size:11px}.hsbp-license small{font-size:9px;color:#90f0aa}
.hsbp-company-mini{padding:12px 4px 0;border-top:1px solid rgba(255,255,255,.08);display:grid;gap:6px}.hsbp-company-mini b{font-size:12px}.hsbp-company-mini span{font-size:9px;color:#a8b5c6;line-height:1.4}
.hsbp-workspace{min-width:0;display:flex;flex-direction:column}
.hsbp-topbar{height:82px;background:#fff;border-bottom:1px solid #e7eaf0;display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;z-index:40}
.hsbp-top-title{display:flex;align-items:center;gap:15px}.hsbp-top-title img{width:64px;height:48px;object-fit:contain}.hsbp-top-title>div{display:flex;flex-direction:column}
.hsbp-top-title b{font-size:20px}.hsbp-top-title b em{font-style:normal;color:var(--red)}.hsbp-top-title span{font-size:11px;color:var(--muted);margin-top:3px}
.hsbp-user{display:flex;align-items:center;gap:9px}.hsbp-version{font-size:10px;font-weight:900;color:var(--red);background:#fff1f1;border-radius:8px;padding:6px 8px}
.hsbp-avatar{width:38px;height:38px;border-radius:50%;background:var(--navy2);color:#fff;display:grid;place-items:center;font-weight:900}
.hsbp-user-text{display:flex;flex-direction:column}.hsbp-user-text b{font-size:11px}.hsbp-user-text span{font-size:9px;color:var(--muted)}
.hsbp-logout{width:32px;height:32px;display:grid;place-items:center;border:1px solid #e4e7ec;border-radius:9px}.hsbp-menu-btn{display:none}
.hsbp-content{padding:26px 28px 34px;max-width:1540px;width:100%;margin:0 auto;flex:1}
.hsbp-page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:15px;margin-bottom:20px}
.hsbp-page-head h1{margin:3px 0 3px;font-size:28px;letter-spacing:-.03em}.hsbp-page-head p{margin:0;color:var(--muted);font-size:12px}.hsbp-eyebrow{font-size:9px;color:var(--red);font-weight:900;letter-spacing:.12em}
.hsbp-new-grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(360px,.88fr);gap:20px;align-items:start}
.hsbp-form-column{display:grid;gap:14px}
.hsbp-card{background:#fff;border:1px solid #e6e9ee;border-radius:var(--radius);padding:18px;box-shadow:0 4px 18px rgba(15,23,42,.035)}
.hsbp-card-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px}
.hsbp-card-head>div{display:flex;align-items:center;gap:8px}.hsbp-card-head h2{font-size:17px;margin:0}.hsbp-card-head small,.hsbp-card-head a{color:var(--muted);font-size:10px}
.hsbp-icon{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;font-size:14px}.hsbp-icon.red{background:#fff1f1;color:var(--red)}
.hsbp-field-grid{display:grid;gap:12px}.hsbp-field-grid.two{grid-template-columns:1fr 1fr}.hsbp-field-grid .full{grid-column:1/-1}
.hsbp-card label>span,.hsbp-settings-field>span{display:block;font-size:10px;font-weight:800;color:#344054;margin-bottom:5px}
.hsbp-card input,.hsbp-card textarea,.hsbp-card select,.hsbp-settings-field input,.hsbp-settings-field textarea{
  width:100%;border:1px solid #d5dae1;border-radius:10px;padding:11px 12px;font-size:13px
}
.hsbp-card textarea,.hsbp-settings-field textarea{min-height:74px;resize:vertical}
.hsbp-inline-field{display:grid;grid-template-columns:1fr 42px;gap:7px}.hsbp-wa-mini{border:0;border-radius:10px;background:#16c653;color:#fff;font-weight:900}
.hsbp-add-btn{border:0;border-radius:9px;background:#080f1a;color:#fff;font-size:11px;font-weight:900;padding:10px 13px}
.hsbp-items-wrap{overflow-x:auto}
.hsbp-item-row{display:grid;grid-template-columns:38px minmax(230px,1fr) 75px 100px 105px 34px;gap:7px;align-items:center;min-width:660px;padding:6px 0}
.hsbp-item-head{font-size:9px;color:#667085;font-weight:900;border-bottom:1px solid #edf0f4;padding-bottom:7px}
.hsbp-item-row input{padding:9px 10px;border-radius:8px;font-size:12px}.hsbp-item-no,.hsbp-line-total{text-align:center}
.hsbp-remove{border:0;border-radius:8px;background:#ffe7e7;color:#d3151d;width:32px;height:32px;font-weight:900;font-size:16px}
.hsbp-add-bottom{width:100%;border:1px dashed #d8dde5;background:#fff;border-radius:9px;padding:8px;margin-top:7px;font-size:10px;font-weight:800}
.hsbp-payment-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.hsbp-payment-left{display:grid;gap:12px}
.hsbp-total-box{border-left:1px solid #edf0f4;padding-left:16px;display:grid;gap:6px}.hsbp-total-box>div,.hsbp-total-box>label{display:grid;grid-template-columns:1fr 150px;align-items:center;gap:10px;min-height:38px;padding:3px 0}
.hsbp-total-box>div>span,.hsbp-total-box>label>span{font-size:11px;font-weight:800;margin:0}.hsbp-total-box>div>b{text-align:right;font-size:12px}
.hsbp-money-input{display:grid;grid-template-columns:34px 1fr;border:1px solid #d5dae1;border-radius:9px;overflow:hidden;background:#fff}.hsbp-money-input i{font-style:normal;display:grid;place-items:center;background:#f7f8fa;color:#667085;font-size:10px}.hsbp-money-input input{border:0!important;border-radius:0!important;text-align:right;padding:9px}
.hsbp-total-box label.advance{background:linear-gradient(90deg,#effbe9,#fff);margin:0 -8px;padding:6px 8px;border-radius:8px}.hsbp-total-box label.advance>span{color:#246b25}
.hsbp-total-box .balance{background:linear-gradient(90deg,#fff1f1,#fff6f6);margin:2px -8px -2px;padding:12px 8px;border-radius:9px}.hsbp-total-box .balance span,.hsbp-total-box .balance b{color:var(--red);font-size:16px;font-weight:900}.hsbp-total-box .balance b{text-align:right}
.hsbp-action-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.hsbp-btn{border:0;border-radius:10px;padding:12px 15px;font-weight:900;font-size:11px;display:inline-flex;align-items:center;justify-content:center;gap:7px;cursor:pointer}
.hsbp-btn.primary{background:linear-gradient(180deg,#ef151d,#ce0e15);color:#fff}.hsbp-btn.preview{background:var(--navy2);color:#fff}.hsbp-btn.whatsapp{background:linear-gradient(180deg,#25d366,#13b849);color:#052b13}.hsbp-btn.ghost{background:#fff;border:1px solid #d8dde5;color:var(--text)}
.hsbp-live-panel{position:sticky;top:103px}.hsbp-live-label{font-size:9px;font-weight:900;color:var(--muted);letter-spacing:.1em;margin:0 0 8px 4px}
.hsbp-mini-invoice{background:#fff;border:1px solid #e2e6eb;border-radius:18px;padding:18px;box-shadow:var(--shadow)}
.hsbp-mini-head{display:flex;justify-content:space-between;gap:15px}.hsbp-mini-head img{width:105px;height:70px;object-fit:contain}.hsbp-mini-head .inv{text-align:right}.hsbp-mini-head .inv b{font-size:20px}.hsbp-mini-head .inv span{display:block;color:var(--red);font-weight:900;font-size:10px;margin-top:4px}.hsbp-mini-head .inv small{display:block;font-size:8px;color:var(--muted);margin-top:4px}
.hsbp-mini-info{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}.hsbp-mini-info>div{border-left:2px solid #edf0f3;padding-left:9px}.hsbp-mini-info label{font-size:7px;color:var(--red);font-weight:900;letter-spacing:.07em}.hsbp-mini-info b{display:block;font-size:10px;margin:3px 0}.hsbp-mini-info span{font-size:8px;color:#667085;line-height:1.4}
.hsbp-mini-table{width:100%;border-collapse:collapse;font-size:8px}.hsbp-mini-table th{background:#0b172a;color:#fff;padding:6px;text-align:left}.hsbp-mini-table td{padding:6px;border-bottom:1px solid #edf0f3}.hsbp-mini-table .right{text-align:right}
.hsbp-mini-totals{width:70%;margin:12px 0 0 auto;font-size:8px}.hsbp-mini-totals div{display:flex;justify-content:space-between;padding:4px 6px}.hsbp-mini-totals .advance{background:#effbe9;color:#237b2d}.hsbp-mini-totals .grand{background:var(--red);color:#fff;border-radius:6px;padding:8px;font-size:10px;font-weight:900}
.hsbp-modal{position:fixed;inset:0;z-index:99999;display:none;align-items:center;justify-content:center;padding:14px}.hsbp-modal.open{display:flex}.hsbp-modal-bg{position:absolute;inset:0;background:rgba(4,19,38,.68);backdrop-filter:blur(6px)}
.hsbp-modal-card{position:relative;z-index:2;width:min(920px,100%);max-height:94vh;overflow:auto;background:#f4f6f8;border-radius:22px;padding:16px}.hsbp-modal-head{display:flex;justify-content:space-between;align-items:center;padding:2px 3px 12px}.hsbp-modal-head span{font-size:9px;color:var(--red);font-weight:900;letter-spacing:.1em}.hsbp-modal-head h2{font-size:26px;margin:2px 0}.hsbp-modal-head button{border:0;background:#e4e7ec;border-radius:50%;width:38px;height:38px;font-size:22px}.hsbp-modal-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px;position:sticky;bottom:0;background:#f4f6f8;padding:10px 0 0}
.hsbp-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}.hsbp-stat{background:#fff;border:1px solid #e6e9ee;border-radius:16px;padding:16px;box-shadow:0 4px 16px rgba(15,23,42,.03);display:flex;flex-direction:column;gap:4px}.hsbp-stat span{font-size:10px;color:var(--muted);font-weight:800}.hsbp-stat b{font-size:21px}.hsbp-stat b.small{font-size:13px;line-height:1.3}.hsbp-stat small{font-size:9px;color:#98a2b3}
.hsbp-search{width:100%;border:1px solid #d5dae1;border-radius:11px;padding:11px 12px;margin-bottom:12px}.hsbp-table-scroll{overflow-x:auto}
.hsbp-data-table{width:100%;border-collapse:collapse;min-width:760px;font-size:11px}.hsbp-data-table th{text-align:left;background:#f7f8fa;color:#667085;font-size:9px;padding:10px}.hsbp-data-table td{padding:11px 10px;border-bottom:1px solid #edf0f3}.hsbp-data-table td small{display:block;color:#98a2b3;margin-top:3px}.hsbp-mini-link{color:var(--red);font-weight:900}
.hsbp-product-chips{display:flex;flex-wrap:wrap;gap:8px}.hsbp-product-chips span{background:#f8fafc;border:1px solid #e4e7ec;border-radius:999px;padding:8px 11px;font-size:10px}
.hsbp-report-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.hsbp-report-row{display:flex;justify-content:space-between;gap:20px;padding:10px 0;border-bottom:1px solid #edf0f3;font-size:11px}.hsbp-report-row:last-child{border:0}
.hsbp-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.hsbp-settings-field.full,.hsbp-settings-grid .full{grid-column:1/-1}
.hsbp-app-footer{padding:12px 28px 20px;color:#98a2b3;font-size:9px;display:flex;justify-content:space-between;gap:15px}
.hsbp-bill-toolbar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.hsbp-saved-invoice-wrap{overflow:auto;padding:4px 0 20px}
.hsbp-invoice{width:210mm;min-height:297mm;margin:0 auto;background:#fff;box-shadow:0 15px 45px rgba(15,23,42,.14);color:#101828;padding:0 13mm 12mm;position:relative}
.hsbp-invoice-redline{height:7px;background:linear-gradient(90deg,var(--navy) 0 78%,var(--red) 78%);margin:0 -13mm}
.hsbp-invoice-head{display:flex;justify-content:space-between;align-items:flex-start;gap:25px;padding:12mm 0 5mm}
.hsbp-invoice-brand{display:flex;align-items:center;gap:14px}.hsbp-invoice-brand img{width:52mm;height:30mm;object-fit:contain}.hsbp-invoice-brand-text{display:flex;flex-direction:column;border-left:1px solid #e4e7ec;padding-left:13px}.hsbp-invoice-brand-text b{font-size:20px;letter-spacing:.02em}.hsbp-invoice-brand-text span{font-size:8px;color:#667085;margin-top:4px}
.hsbp-invoice-title{text-align:right;display:flex;flex-direction:column;align-items:flex-end}.hsbp-invoice-title>span{font-size:27px;font-weight:900;letter-spacing:.04em}.hsbp-invoice-title>b{background:var(--red);color:#fff;border-radius:7px;padding:5px 8px;font-size:11px;margin-top:4px}.hsbp-invoice-title small{font-size:8px;color:#667085;margin-top:6px}
.hsbp-invoice-contact{display:flex;flex-wrap:wrap;gap:5px 14px;border-top:1px solid #edf0f3;border-bottom:1px solid #edf0f3;padding:8px 0;font-size:8px;color:#667085}
.hsbp-invoice-info{display:grid;grid-template-columns:1fr 1fr;gap:14mm;padding:7mm 0}.hsbp-invoice-info section{border-left:3px solid #edf0f3;padding-left:12px}.hsbp-invoice-info label,.hsbp-bank label{font-size:8px;color:var(--red);font-weight:900;letter-spacing:.08em}.hsbp-invoice-info h3{font-size:15px;margin:5px 0}.hsbp-invoice-info p{font-size:9px;line-height:1.55;color:#475467;margin:0}.hsbp-paid-badge{display:inline-block;color:#067647;background:#dcfae6;padding:2px 6px;border-radius:999px;font-size:7px;font-weight:900;margin-top:4px}
.hsbp-invoice-table-wrap table{width:100%;border-collapse:collapse;font-size:9px}.hsbp-invoice-table-wrap th{background:#09172a;color:#fff;padding:9px 8px;text-align:left;font-size:8px}.hsbp-invoice-table-wrap th:first-child{border-radius:7px 0 0 7px}.hsbp-invoice-table-wrap th:last-child{border-radius:0 7px 7px 0}.hsbp-invoice-table-wrap td{padding:9px 8px;border-bottom:1px solid #edf0f3}.hsbp-invoice-table-wrap .right{text-align:right}
.hsbp-invoice-bottom{display:grid;grid-template-columns:1fr 85mm;gap:15mm;align-items:start;padding-top:8mm}.hsbp-invoice-left{display:grid;gap:9px}.hsbp-thanks{background:#fff0f0;border-radius:10px;padding:11px;display:grid;gap:4px}.hsbp-thanks b{color:var(--red);font-size:9px}.hsbp-thanks span{font-size:8px;color:#667085}.hsbp-bank{border-left:3px solid var(--red);padding-left:10px;display:flex;flex-direction:column;gap:3px;font-size:8px}.hsbp-bank>b{font-size:9px}.hsbp-bank strong{font-size:10px}
.hsbp-invoice-totals{display:grid}.hsbp-invoice-totals>div{display:flex;justify-content:space-between;gap:15px;padding:7px 9px;font-size:9px}.hsbp-invoice-totals .advance{background:#edfbea;color:#237b2d}.hsbp-invoice-totals .grand{background:linear-gradient(180deg,#ef151d,#c90d14);color:#fff;border-radius:8px;margin-top:4px;padding:12px 10px}.hsbp-invoice-totals .grand span{font-weight:900}.hsbp-invoice-totals .grand b{font-size:16px}
.hsbp-invoice-note{margin-top:6mm;border:1px solid #edf0f3;border-radius:8px;padding:8px;font-size:8px;color:#475467}.hsbp-invoice-footer{position:absolute;left:0;right:0;bottom:0;background:var(--red);color:#fff;display:flex;justify-content:space-around;padding:7px;font-size:7px;font-weight:800}
.hsbp-receipt{display:none;width:101.6mm;background:#fff;padding:5mm;margin:0 auto;font-family:Arial,sans-serif;color:#000}.hsbp-receipt .center{text-align:center;display:grid;gap:3px}.hsbp-receipt .big{font-size:20px}.hsbp-receipt span,.hsbp-receipt p{font-size:11px}.hsbp-receipt hr{border:0;border-top:1px dashed #000}.rline{display:flex;justify-content:space-between;gap:8px;font-size:11px;padding:4px 0}.rline span:first-child{display:flex;flex-direction:column}.rline small{font-size:9px}.rline.total{font-size:14px;font-weight:900}
.hsbp-public-page{padding:22px;background:#eef2f6;min-height:100vh}.hsbp-public-toolbar{max-width:210mm;margin:0 auto 12px;background:#fff;border:1px solid #e4e7ec;border-radius:14px;padding:12px;display:flex;justify-content:space-between;align-items:center;gap:10px}.hsbp-public-toolbar>div{display:flex;flex-direction:column}.hsbp-public-toolbar span{font-size:10px;color:#667085}
.hsbp-sidebar-backdrop{display:none}
@media(max-width:1180px){
  .hsbp-new-grid{grid-template-columns:1fr}.hsbp-live-panel{position:static}.hsbp-live-panel{display:none}
}
@media(max-width:900px){
  .hsbp-app{display:block}.hsbp-sidebar{position:fixed;left:-260px;top:0;width:238px;transition:left .22s ease;box-shadow:12px 0 36px rgba(0,0,0,.25)}.hsbp-sidebar.open{left:0}.hsbp-sidebar-backdrop{position:fixed;inset:0;background:rgba(2,12,27,.55);z-index:45}.hsbp-sidebar-backdrop.open{display:block}
  .hsbp-menu-btn{display:grid;place-items:center;border:0;background:#f2f4f7;border-radius:10px;width:38px;height:38px;font-size:19px}.hsbp-topbar{height:68px;padding:0 14px}.hsbp-top-title img{width:48px;height:38px}.hsbp-top-title b{font-size:15px}.hsbp-top-title span{display:none}.hsbp-user-text,.hsbp-version{display:none}.hsbp-avatar{width:34px;height:34px}.hsbp-content{padding:16px 12px 28px}.hsbp-page-head{align-items:center}.hsbp-page-head h1{font-size:23px}.hsbp-page-head p{font-size:10px}.hsbp-card{padding:14px;border-radius:15px}.hsbp-field-grid.two,.hsbp-payment-grid,.hsbp-settings-grid,.hsbp-report-grid{grid-template-columns:1fr}.hsbp-field-grid .full,.hsbp-settings-field.full,.hsbp-settings-grid .full{grid-column:auto}.hsbp-total-box{border-left:0;border-top:1px solid #edf0f4;padding-left:0;padding-top:12px}.hsbp-action-row{grid-template-columns:1fr}.hsbp-action-row .hsbp-btn{padding:14px}.hsbp-stat-grid{grid-template-columns:1fr 1fr}.hsbp-app-footer{padding:10px 12px 18px;flex-direction:column}.hsbp-modal-card{padding:10px;border-radius:16px}.hsbp-modal-actions{grid-template-columns:1fr}
  .hsbp-invoice{width:100%;min-height:auto;padding:0 14px 50px;box-shadow:none}.hsbp-invoice-redline{margin:0 -14px}.hsbp-invoice-head{padding:22px 0 12px;gap:8px}.hsbp-invoice-brand img{width:132px;height:78px}.hsbp-invoice-brand-text{display:none}.hsbp-invoice-title>span{font-size:20px}.hsbp-invoice-title>b{font-size:9px}.hsbp-invoice-contact{font-size:7px}.hsbp-invoice-info{grid-template-columns:1fr 1fr;gap:10px;padding:16px 0}.hsbp-invoice-info h3{font-size:11px}.hsbp-invoice-info p{font-size:7.5px}.hsbp-invoice-table-wrap{overflow-x:auto}.hsbp-invoice-table-wrap table{min-width:520px}.hsbp-invoice-bottom{grid-template-columns:1fr;gap:10px;padding-top:16px}.hsbp-invoice-totals{order:-1}.hsbp-invoice-footer{font-size:6px}.hsbp-public-page{padding:8px}.hsbp-public-toolbar{border-radius:10px}
}
@media(max-width:520px){
  .hsbp-top-title>div b{font-size:13px}.hsbp-user{gap:5px}.hsbp-page-head .hsbp-btn{font-size:9px;padding:9px}.hsbp-field-grid.two{grid-template-columns:1fr}.hsbp-card-head h2{font-size:15px}.hsbp-card-head small{display:none}.hsbp-stat-grid{grid-template-columns:1fr}.hsbp-total-box>div,.hsbp-total-box>label{grid-template-columns:1fr 135px}.hsbp-invoice-info{grid-template-columns:1fr}.hsbp-invoice-title small{font-size:7px}.hsbp-invoice-brand img{width:118px;height:68px}.hsbp-invoice-contact{display:grid}.hsbp-public-toolbar{align-items:flex-start}.hsbp-public-toolbar .hsbp-btn{padding:9px;font-size:9px}
}
@media print{
  @page{margin:0}
  body.hsbp-body{background:#fff!important}
  .no-print,.hsbp-app>.hsbp-sidebar,.hsbp-topbar,.hsbp-page-head,.hsbp-bill-toolbar,.hsbp-app-footer,.hsbp-sidebar-backdrop{display:none!important}
  .hsbp-workspace,.hsbp-content,.hsbp-saved-invoice-wrap{display:block!important;padding:0!important;margin:0!important;max-width:none!important}
  body.print-receipt .hsbp-invoice,body.print-receipt .hsbp-saved-invoice-wrap{display:none!important}
  body.print-receipt .receipt-print{display:block!important}
  body:not(.print-receipt) .receipt-print{display:none!important}
  .hsbp-invoice{width:210mm!important;min-height:297mm!important;box-shadow:none!important;margin:0!important}
  .hsbp-invoice-head,.hsbp-invoice-table-wrap th,.hsbp-invoice-totals .advance,.hsbp-invoice-totals .grand,.hsbp-invoice-footer,.hsbp-invoice-redline{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
  .hsbp-public-page{padding:0!important;background:#fff!important}
}


/* v2.1 customer invoice share page fix */
.hsbp-public-invoice-wrap{max-width:210mm;margin:0 auto}
.hsbp-public-error{background:#fff;border:1px solid #fecaca;border-radius:14px;padding:20px;color:#991b1b;display:grid;gap:6px}
.hsbp-public-error span{font-size:12px;color:#7f1d1d}
.hsbp-customer-invoice{width:210mm;min-height:297mm;margin:0 auto;background:#fff;color:#101828;box-shadow:0 15px 45px rgba(15,23,42,.14);padding:0 13mm 14mm;position:relative;overflow:hidden}
.hsbp-ci-topline{height:7px;background:linear-gradient(90deg,#07162d 0 78%,#e1121a 78%);margin:0 -13mm}
.hsbp-ci-header{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;padding:11mm 0 5mm}
.hsbp-ci-brand{display:flex;align-items:center;gap:15px;min-width:0}
.hsbp-ci-brand img{width:58mm;height:32mm;object-fit:contain;flex:0 0 auto}
.hsbp-ci-brand>div{border-left:1px solid #e4e7ec;padding-left:13px;display:flex;flex-direction:column;min-width:0}
.hsbp-ci-brand b{font-size:20px;line-height:1.05}.hsbp-ci-brand span{font-size:8px;color:#667085;margin-top:5px}
.hsbp-ci-title{text-align:right;display:flex;flex-direction:column;align-items:flex-end}
.hsbp-ci-title>span{font-size:27px;font-weight:900;letter-spacing:.04em}
.hsbp-ci-title>b{background:#e1121a;color:#fff;border-radius:7px;padding:5px 9px;font-size:11px;margin-top:4px}
.hsbp-ci-title small{font-size:8px;color:#667085;margin-top:6px}
.hsbp-ci-contact{display:flex;flex-wrap:wrap;gap:5px 14px;border-top:1px solid #edf0f3;border-bottom:1px solid #edf0f3;padding:8px 0;font-size:8px;color:#667085}
.hsbp-ci-info{display:grid;grid-template-columns:1fr 1fr;gap:14mm;padding:7mm 0}
.hsbp-ci-info>div{border-left:3px solid #edf0f3;padding-left:12px}
.hsbp-ci-info label,.hsbp-ci-bank label{font-size:8px;color:#e1121a;font-weight:900;letter-spacing:.08em}
.hsbp-ci-info h2{font-size:15px;margin:5px 0}.hsbp-ci-info p{font-size:9px;line-height:1.55;color:#475467;margin:0}
.hsbp-ci-badge{display:inline-block;color:#067647;background:#dcfae6;padding:2px 6px;border-radius:999px;font-size:7px;font-weight:900;margin-top:4px}
.hsbp-ci-table-wrap{overflow-x:auto}.hsbp-ci-table{width:100%;border-collapse:collapse;font-size:9px}
.hsbp-ci-table th{background:#09172a;color:#fff;padding:9px 8px;text-align:left;font-size:8px}
.hsbp-ci-table th:first-child{border-radius:7px 0 0 7px}.hsbp-ci-table th:last-child{border-radius:0 7px 7px 0}
.hsbp-ci-table td{padding:9px 8px;border-bottom:1px solid #edf0f3}.hsbp-ci-table .right{text-align:right}.hsbp-ci-table .empty{text-align:center;color:#98a2b3;padding:18px}
.hsbp-ci-bottom{display:grid;grid-template-columns:1fr 85mm;gap:15mm;align-items:start;padding-top:8mm}
.hsbp-ci-left{display:grid;gap:9px}.hsbp-ci-thanks{background:#fff0f0;border-radius:10px;padding:11px;display:grid;gap:4px}
.hsbp-ci-thanks b{color:#e1121a;font-size:9px}.hsbp-ci-thanks span{font-size:8px;color:#667085}
.hsbp-ci-bank{border-left:3px solid #e1121a;padding-left:10px;display:flex;flex-direction:column;gap:3px;font-size:8px}
.hsbp-ci-bank>b{font-size:9px}.hsbp-ci-bank strong{font-size:10px}.hsbp-ci-note{border:1px solid #edf0f3;border-radius:8px;padding:8px;font-size:8px;color:#475467}
.hsbp-ci-totals{display:grid}.hsbp-ci-totals>div{display:flex;justify-content:space-between;gap:15px;padding:7px 9px;font-size:9px}
.hsbp-ci-totals .advance{background:#edfbea;color:#237b2d}
.hsbp-ci-totals .grand{background:linear-gradient(180deg,#ef151d,#c90d14);color:#fff;border-radius:8px;margin-top:4px;padding:12px 10px}
.hsbp-ci-totals .grand span{font-weight:900}.hsbp-ci-totals .grand b{font-size:16px}
.hsbp-ci-footer{position:absolute;left:0;right:0;bottom:0;background:#e1121a;color:#fff;display:flex;justify-content:space-around;padding:7px;font-size:7px;font-weight:800}
@media(max-width:900px){
  .hsbp-public-invoice-wrap{max-width:none}.hsbp-customer-invoice{width:100%;min-height:auto;padding:0 14px 54px;box-shadow:none;border-radius:14px}
  .hsbp-ci-topline{margin:0 -14px}.hsbp-ci-header{padding:20px 0 12px;gap:9px}.hsbp-ci-brand img{width:145px;height:82px}.hsbp-ci-brand>div{display:none}
  .hsbp-ci-title>span{font-size:20px}.hsbp-ci-title>b{font-size:9px}.hsbp-ci-title small{font-size:7px}.hsbp-ci-contact{font-size:7px;display:grid;gap:3px}
  .hsbp-ci-info{grid-template-columns:1fr 1fr;gap:10px;padding:15px 0}.hsbp-ci-info h2{font-size:11px}.hsbp-ci-info p{font-size:7.5px}
  .hsbp-ci-table{min-width:520px}.hsbp-ci-bottom{grid-template-columns:1fr;gap:10px;padding-top:16px}.hsbp-ci-totals{order:-1}.hsbp-ci-footer{font-size:6px}
}
@media(max-width:520px){
  .hsbp-public-page{padding:8px}.hsbp-public-toolbar{align-items:center}.hsbp-public-toolbar .hsbp-btn{font-size:9px;padding:9px}
  .hsbp-ci-brand img{width:125px;height:72px}.hsbp-ci-info{grid-template-columns:1fr}.hsbp-ci-title>span{font-size:18px}
}
@media print{
  .hsbp-public-toolbar{display:none!important}.hsbp-public-page{padding:0!important;background:#fff!important}
  .hsbp-customer-invoice{width:210mm!important;min-height:297mm!important;box-shadow:none!important;border-radius:0!important}
  .hsbp-ci-topline,.hsbp-ci-table th,.hsbp-ci-totals .advance,.hsbp-ci-totals .grand,.hsbp-ci-footer{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
}


/* v2.2 custom Hiru Billing login — no WordPress login screen */
.hsbp-brand-login{
  position:relative;
  overflow:hidden;
}
.hsbp-brand-login:before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:7px;
  background:linear-gradient(90deg,#07162d 0 72%,#e1121a 72%);
}
.hsbp-custom-login{
  display:grid;
  gap:13px;
  margin-top:18px;
}
.hsbp-custom-login label{
  margin:0;
}
.hsbp-custom-login label>span{
  display:block;
  font-size:11px;
  font-weight:800;
  color:#344054;
  margin-bottom:6px;
}
.hsbp-custom-login input[type=text],
.hsbp-custom-login input[type=password]{
  width:100%;
  border:1px solid #d0d5dd;
  border-radius:12px;
  padding:13px 14px;
  background:#fff;
  font-size:14px;
}
.hsbp-password-wrap{
  display:grid;
  grid-template-columns:1fr 44px;
  border:1px solid #d0d5dd;
  border-radius:12px;
  overflow:hidden;
  background:#fff;
}
.hsbp-password-wrap input{
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
.hsbp-password-wrap button{
  border:0;
  border-left:1px solid #eaecf0;
  background:#f8fafc;
  cursor:pointer;
}
.hsbp-remember{
  display:flex!important;
  align-items:center;
  gap:8px;
  font-size:11px;
  color:#667085;
}
.hsbp-remember input{
  width:auto!important;
}
.hsbp-remember span{
  margin:0!important;
  font-weight:600!important;
  color:#667085!important;
}
.hsbp-login-button{
  width:100%;
  border:0;
  border-radius:12px;
  padding:14px;
  background:linear-gradient(180deg,#ef151d,#c90d14);
  color:#fff;
  font-weight:900;
  letter-spacing:.02em;
  cursor:pointer;
  box-shadow:0 10px 24px rgba(225,18,26,.22);
}
.hsbp-login-error,
.hsbp-login-success{
  border-radius:10px;
  padding:10px 12px;
  margin-top:13px;
  font-size:11px;
  font-weight:700;
}
.hsbp-login-error{
  background:#fff1f1;
  border:1px solid #fecaca;
  color:#b42318;
}
.hsbp-login-success{
  background:#ecfdf3;
  border:1px solid #abefc6;
  color:#067647;
}
.hsbp-login-note{
  margin-top:18px;
  padding-top:14px;
  border-top:1px solid #eaecf0;
  display:grid;
  gap:3px;
  text-align:center;
}
.hsbp-login-note b{
  font-size:10px;
  color:#344054;
}
.hsbp-login-note span{
  font-size:9px;
  color:#98a2b3;
  line-height:1.4;
}
@media(max-width:520px){
  .hsbp-login-page{padding:12px}
  .hsbp-login-card{padding:24px 18px;border-radius:20px}
  .hsbp-login-card>img{width:135px}
  .hsbp-login-card h1{font-size:23px}
}


/* ==========================================================
   v2.3 MOBILE-FIRST POLISH
   Desktop/laptop layout is intentionally unchanged.
   ========================================================== */
.hsbp-cell{min-width:0}
.hsbp-cell>label{display:none}
.hsbp-cell input{width:100%}
.hsbp-cell-remove{display:flex;align-items:center;justify-content:center}

/* Custom mobile product suggestion dropdown */
.hsbp-mobile-suggestions{
  position:fixed;
  z-index:100000;
  max-height:310px;
  overflow:auto;
  background:#fff;
  border:1px solid #d9dee7;
  border-radius:13px;
  box-shadow:0 18px 42px rgba(15,23,42,.18);
  padding:6px;
  -webkit-overflow-scrolling:touch;
}
.hsbp-mobile-suggestions button{
  display:block;
  width:100%;
  border:0;
  background:#fff;
  color:#172033;
  text-align:left;
  padding:11px 10px;
  border-radius:9px;
  font-size:12px;
  font-weight:650;
  line-height:1.25;
}
.hsbp-mobile-suggestions button+button{border-top:1px solid #f0f2f5}
.hsbp-mobile-suggestions button:active{background:#fff0f0;color:#c90d14}

@media(max-width:900px){
  /* Header: branded but compact */
  .hsbp-topbar{
    min-height:68px;
    height:auto;
    padding:9px 12px;
    gap:8px;
  }
  .hsbp-top-title{
    min-width:0;
    flex:1;
    justify-content:center;
  }
  .hsbp-top-title img{
    width:92px;
    height:54px;
    object-fit:contain;
  }
  .hsbp-top-title>div{display:none}
  .hsbp-user{margin-left:auto}
  .hsbp-menu-btn{flex:0 0 38px}

  /* Comfortable content width without desktop-style zooming */
  .hsbp-content{
    width:100%;
    max-width:100%;
    padding:12px 10px 26px;
    overflow-x:hidden;
  }
  .hsbp-page-head{
    margin-bottom:12px;
  }
  .hsbp-page-head h1{font-size:21px}
  .hsbp-page-head p{max-width:260px}

  /* Customer form */
  .hsbp-card{
    border-radius:15px;
    padding:13px;
    box-shadow:0 4px 14px rgba(15,23,42,.045);
  }
  .hsbp-field-grid.two{grid-template-columns:1fr}
  .hsbp-card input,.hsbp-card textarea,.hsbp-card select{
    min-height:44px;
    font-size:16px; /* prevents iPhone auto-zoom */
  }
  .hsbp-card textarea{min-height:76px}
  .hsbp-inline-field{grid-template-columns:1fr 46px}

  /* Item entry becomes mobile cards, not a wide desktop table */
  .hsbp-items-wrap{overflow:visible}
  .hsbp-item-head{display:none}
  .hsbp-line{
    position:relative;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:9px!important;
    padding:12px!important;
    margin-bottom:10px;
    border:1px solid #e4e7ec;
    border-radius:13px;
    background:#fbfcfd;
  }
  .hsbp-cell>label{
    display:block;
    font-size:9px;
    font-weight:850;
    color:#667085;
    margin:0 0 4px;
  }
  .hsbp-cell-no{
    position:absolute;
    top:10px;
    left:10px;
    width:34px;
    z-index:2;
  }
  .hsbp-cell-no label{display:none}
  .hsbp-cell-no input{
    height:30px!important;
    min-height:30px!important;
    padding:0!important;
    border:0!important;
    background:#101828!important;
    color:#fff!important;
    border-radius:8px!important;
    font-size:11px!important;
    font-weight:900;
    text-align:center;
  }
  .hsbp-cell-product{
    grid-column:1/-1;
    padding-left:42px;
    padding-right:36px;
  }
  .hsbp-cell-product input{
    font-size:15px!important;
    font-weight:700;
  }
  .hsbp-cell-qty{grid-column:1/2}
  .hsbp-cell-price{grid-column:2/3}
  .hsbp-cell-total{grid-column:1/-1}
  .hsbp-cell-total input{
    background:#f2f4f7;
    font-weight:900;
    text-align:right;
  }
  .hsbp-cell-remove{
    position:absolute;
    right:10px;
    top:10px;
  }
  .hsbp-cell-remove label{display:none}
  .hsbp-remove{
    width:32px;height:32px;
  }
  .hsbp-add-bottom{
    min-height:42px;
    font-size:11px;
  }

  /* Payment totals are thumb-friendly */
  .hsbp-payment-grid{grid-template-columns:1fr}
  .hsbp-total-box{
    border-left:0;
    border-top:1px solid #edf0f4;
    padding:11px 0 0;
  }
  .hsbp-total-box>div,.hsbp-total-box>label{
    grid-template-columns:1fr 142px;
    min-height:43px;
  }
  .hsbp-money-input input{font-size:15px!important}
  .hsbp-total-box .balance{
    padding:13px 9px;
  }
  .hsbp-total-box .balance span{font-size:12px}
  .hsbp-total-box .balance b{font-size:18px}

  /* Main actions remain visible while finishing a bill */
  .hsbp-action-row{
    position:sticky;
    bottom:8px;
    z-index:25;
    grid-template-columns:1fr;
    padding:8px;
    margin:0 -2px;
    border:1px solid rgba(228,231,236,.9);
    border-radius:14px;
    background:rgba(255,255,255,.94);
    box-shadow:0 12px 28px rgba(15,23,42,.12);
    backdrop-filter:blur(9px);
  }
  .hsbp-action-row .hsbp-btn{
    min-height:47px;
    font-size:12px;
  }

  /* Preview modal uses the full phone width */
  .hsbp-modal{padding:5px}
  .hsbp-modal-card{
    width:100%;
    max-height:97vh;
    border-radius:16px;
    padding:9px;
  }
  .hsbp-modal-head h2{font-size:22px}
  .hsbp-modal-actions{grid-template-columns:1fr}

  /* Saved staff invoice fits the phone */
  .hsbp-saved-invoice-wrap{
    overflow:visible;
  }
  .hsbp-invoice{
    width:100%!important;
    min-height:auto!important;
    margin:0!important;
    padding:0 12px 52px!important;
    border-radius:14px;
    overflow:hidden;
  }
  .hsbp-invoice-redline{margin:0 -12px}
  .hsbp-invoice-head{
    padding:16px 0 10px;
  }
  .hsbp-invoice-brand img{
    width:145px!important;
    height:88px!important;
    object-fit:contain!important;
  }
  .hsbp-invoice-contact{
    display:grid;
    gap:3px;
    font-size:7.5px;
  }
  .hsbp-invoice-info{
    grid-template-columns:1fr;
    gap:10px;
    padding:13px 0;
  }
  .hsbp-invoice-table-wrap{overflow:visible}
  .hsbp-invoice-table-wrap table{
    min-width:0!important;
    display:block;
  }
  .hsbp-invoice-table-wrap thead{display:none}
  .hsbp-invoice-table-wrap tbody{display:block}
  .hsbp-invoice-table-wrap tr{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:6px 8px;
    padding:10px 0;
    border-bottom:1px solid #edf0f3;
  }
  .hsbp-invoice-table-wrap td{
    border:0!important;
    padding:2px!important;
    text-align:left!important;
  }
  .hsbp-invoice-table-wrap td:nth-child(1){display:none}
  .hsbp-invoice-table-wrap td:nth-child(2){
    grid-column:1/-1;
    font-size:11px;
    padding-bottom:5px!important;
  }
  .hsbp-invoice-table-wrap td:nth-child(3)::before{content:"Qty"}
  .hsbp-invoice-table-wrap td:nth-child(4)::before{content:"Unit Price"}
  .hsbp-invoice-table-wrap td:nth-child(5)::before{content:"Total"}
  .hsbp-invoice-table-wrap td:nth-child(n+3)::before{
    display:block;
    font-size:7px;
    color:#98a2b3;
    text-transform:uppercase;
    font-weight:900;
    margin-bottom:2px;
  }
  .hsbp-invoice-table-wrap td:nth-child(5){text-align:right!important}
  .hsbp-invoice-bottom{
    grid-template-columns:1fr!important;
    gap:10px!important;
    padding-top:14px!important;
  }
  .hsbp-invoice-totals{order:-1}

  /* Customer WhatsApp invoice: genuine mobile layout, no zoom required */
  .hsbp-public-page{
    padding:7px!important;
    overflow-x:hidden;
  }
  .hsbp-public-toolbar{
    margin-bottom:7px;
    border-radius:11px;
    padding:9px 10px;
  }
  .hsbp-public-invoice-wrap{width:100%;max-width:none}
  .hsbp-customer-invoice{
    width:100%!important;
    min-height:auto!important;
    margin:0!important;
    padding:0 12px 56px!important;
    border-radius:14px;
    box-shadow:0 6px 20px rgba(15,23,42,.08);
    overflow:hidden;
  }
  .hsbp-ci-topline{margin:0 -12px!important}
  .hsbp-ci-header{
    padding:15px 0 10px!important;
    gap:8px!important;
    align-items:flex-start;
  }
  .hsbp-ci-brand img{
    width:150px!important;
    height:92px!important;
    object-fit:contain!important;
  }
  .hsbp-ci-brand>div{display:none!important}
  .hsbp-ci-title>span{font-size:19px!important}
  .hsbp-ci-title>b{font-size:9px!important}
  .hsbp-ci-title small{font-size:7px!important}
  .hsbp-ci-contact{
    display:grid!important;
    gap:3px!important;
    font-size:7.5px!important;
  }
  .hsbp-ci-info{
    grid-template-columns:1fr!important;
    gap:9px!important;
    padding:13px 0!important;
  }
  .hsbp-ci-info>div{
    border:1px solid #edf0f3!important;
    border-left:3px solid #e1121a!important;
    border-radius:9px;
    padding:9px!important;
  }
  .hsbp-ci-info h2{font-size:12px!important}
  .hsbp-ci-info p{font-size:8.5px!important}

  .hsbp-ci-table-wrap{overflow:visible!important}
  .hsbp-ci-table{
    min-width:0!important;
    width:100%!important;
    display:block!important;
  }
  .hsbp-ci-table thead{display:none!important}
  .hsbp-ci-table tbody{display:block!important}
  .hsbp-ci-table tr{
    display:grid!important;
    grid-template-columns:repeat(3,1fr)!important;
    gap:5px 8px!important;
    padding:10px 0!important;
    border-bottom:1px solid #edf0f3!important;
  }
  .hsbp-ci-table td{
    border:0!important;
    padding:2px!important;
    text-align:left!important;
    font-size:9px!important;
    min-width:0;
  }
  .hsbp-ci-table td:nth-child(1){display:none!important}
  .hsbp-ci-table td:nth-child(2){
    grid-column:1/-1!important;
    font-size:11px!important;
    padding-bottom:5px!important;
    overflow-wrap:anywhere;
  }
  .hsbp-ci-table td:nth-child(3)::before{content:"Qty"}
  .hsbp-ci-table td:nth-child(4)::before{content:"Unit Price"}
  .hsbp-ci-table td:nth-child(5)::before{content:"Total"}
  .hsbp-ci-table td:nth-child(n+3)::before{
    display:block;
    font-size:7px;
    color:#98a2b3;
    text-transform:uppercase;
    font-weight:900;
    margin-bottom:2px;
  }
  .hsbp-ci-table td:nth-child(5){text-align:right!important}
  .hsbp-ci-bottom{
    grid-template-columns:1fr!important;
    gap:10px!important;
    padding-top:13px!important;
  }
  .hsbp-ci-totals{order:-1!important}
  .hsbp-ci-totals>div{
    font-size:9px!important;
    padding:8px!important;
  }
  .hsbp-ci-totals .grand{
    padding:12px 9px!important;
  }
  .hsbp-ci-totals .grand b{font-size:17px!important}
  .hsbp-ci-footer{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    text-align:center;
    gap:2px;
    padding:6px 4px!important;
  }
  .hsbp-ci-footer span:last-child{grid-column:1/-1}
}

@media(max-width:480px){
  .hsbp-top-title img{width:84px;height:50px}
  .hsbp-cell-product input{font-size:14px!important}
  .hsbp-total-box>div,.hsbp-total-box>label{grid-template-columns:1fr 128px}
  .hsbp-ci-brand img{width:132px!important;height:82px!important}
  .hsbp-ci-title>span{font-size:17px!important}
  .hsbp-ci-title>b{max-width:120px;overflow-wrap:anywhere}
}

/* Print remains true A4 and is unaffected by mobile card styling */
@media print{
  .hsbp-customer-invoice,.hsbp-invoice{
    border-radius:0!important;
  }
  .hsbp-ci-table,.hsbp-ci-table tbody,.hsbp-ci-table tr,.hsbp-ci-table td,
  .hsbp-invoice-table-wrap table,.hsbp-invoice-table-wrap tbody,.hsbp-invoice-table-wrap tr,.hsbp-invoice-table-wrap td{
    display:table!important;
  }
  .hsbp-ci-table tbody,.hsbp-invoice-table-wrap tbody{display:table-row-group!important}
  .hsbp-ci-table tr,.hsbp-invoice-table-wrap tr{display:table-row!important}
  .hsbp-ci-table td,.hsbp-invoice-table-wrap td{display:table-cell!important}
  .hsbp-ci-table td:nth-child(1),.hsbp-invoice-table-wrap td:nth-child(1){display:table-cell!important}
  .hsbp-ci-table thead,.hsbp-invoice-table-wrap thead{display:table-header-group!important}
  .hsbp-ci-table td::before,.hsbp-invoice-table-wrap td::before{display:none!important;content:none!important}
}


/* ==========================================================
   v2.4 EXACT HIRU JPG LOGO + MOBILE PRODUCT TAP BEHAVIOUR
   Desktop/laptop dimensions remain unchanged from v2.3.
   ========================================================== */

/* The supplied JPG has a white background. Keep the artwork intact and
   use contain so HIRU + APPAREL is never cropped on desktop or mobile. */
.hsbp-invoice-brand img,
.hsbp-ci-brand img,
.hsbp-top-title img,
.hsbp-side-brand img,
.hsbp-login-card>img,
.hsbp-mini-head img{
  object-fit:contain!important;
  object-position:center!important;
}

/* Single tap / double tap field cue on phones only. */
@media(max-width:900px){
  .hsbp-product{
    touch-action:manipulation;
    cursor:pointer;
    -webkit-user-select:text;
    user-select:text;
  }
  .hsbp-cell-product{
    position:relative;
  }
  .hsbp-cell-product:after{
    content:"Tap once: product list  •  Double tap: type";
    display:block;
    margin-top:4px;
    font-size:8px;
    font-weight:700;
    color:#98a2b3;
    line-height:1.25;
  }
  .hsbp-product[readonly]{
    background:#fff!important;
    color:#101828!important;
    opacity:1!important;
    -webkit-text-fill-color:#101828!important;
  }
  .hsbp-mobile-suggestions{
    overscroll-behavior:contain;
  }
  .hsbp-mobile-suggestions button{
    min-height:43px;
    display:flex;
    align-items:center;
  }
}

/* True A4 printing continues to use the same logo display size. */
@media print{
  .hsbp-invoice-brand img{width:52mm!important;height:30mm!important}
  .hsbp-ci-brand img{width:58mm!important;height:32mm!important}
}


/* ==========================================================
   v2.5 INSTALLABLE PWA
   Mobile install controls only; desktop billing layout unchanged.
   ========================================================== */
.hsbp-pwa-install-wrap{display:none}
.hsbp-pwa-install{
  border:0;
  border-radius:9px;
  padding:8px 10px;
  background:#e1121a;
  color:#fff;
  font-size:9px;
  font-weight:900;
  cursor:pointer;
}
.hsbp-pwa-login-install{
  width:100%;
  margin-top:12px;
  border:1px solid #e1121a;
  border-radius:12px;
  padding:12px;
  background:#fff;
  color:#d10f16;
  font-size:10px;
  font-weight:900;
  cursor:pointer;
}
.hsbp-install-modal{
  position:fixed;
  inset:0;
  z-index:1000000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:14px;
}
.hsbp-install-modal.open{display:flex}
.hsbp-install-bg{
  position:absolute;
  inset:0;
  background:rgba(5,18,38,.67);
  backdrop-filter:blur(6px);
}
.hsbp-install-card{
  position:relative;
  z-index:2;
  width:min(390px,100%);
  background:#fff;
  border-radius:22px;
  padding:24px 20px 18px;
  box-shadow:0 28px 80px rgba(0,0,0,.28);
  text-align:center;
}
.hsbp-install-card>img{
  width:78px;
  height:78px;
  object-fit:contain;
  border-radius:18px;
  border:1px solid #edf0f3;
}
.hsbp-install-card>span{
  display:block;
  margin-top:10px;
  color:#e1121a;
  font-size:9px;
  font-weight:900;
  letter-spacing:.12em;
}
.hsbp-install-card h2{
  margin:4px 0 15px;
  font-size:22px;
}
.hsbp-install-close{
  position:absolute;
  right:11px;
  top:11px;
  width:34px;
  height:34px;
  border:0;
  border-radius:50%;
  background:#f2f4f7;
  font-size:20px;
}
#hsbpInstallInstructions{
  display:grid;
  gap:8px;
  text-align:left;
  margin-bottom:16px;
}
.hsbp-install-step{
  display:grid;
  grid-template-columns:28px 1fr;
  gap:9px;
  align-items:start;
  padding:9px;
  border-radius:10px;
  background:#f8fafc;
  color:#475467;
  font-size:11px;
  line-height:1.45;
}
.hsbp-install-step>b{
  width:26px;
  height:26px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#07162d;
  color:#fff;
  font-size:10px;
}

@media(max-width:900px){
  .hsbp-pwa-install-wrap{display:block;margin-left:auto}
  .hsbp-pwa-install{display:block}
  @media(display-mode:standalone){
    .hsbp-pwa-install-wrap,.hsbp-pwa-login-install{display:none!important}
  }
}

/* v2.6 install-flow fix */
.hsbp-install-card .hsbp-btn.primary{
  min-width:170px;
}
.hsbp-install-modal[aria-hidden="true"]{
  pointer-events:none;
}
.hsbp-install-modal.open{
  pointer-events:auto;
}

/* v2.8: critical JS repair + PWA icon cache-bust. UI intentionally unchanged. */


/* v2.9 Preview reliability */
body.hsbp-preview-open{overflow:hidden!important}
#hsbpPreviewModal{
  pointer-events:none;
}
#hsbpPreviewModal.open{
  pointer-events:auto;
  display:flex!important;
}
#hsbpPreviewModal .hsbp-modal-bg,
#hsbpPreviewModal .hsbp-modal-card,
#hsbpPreviewModal .hsbp-modal-actions,
#hsbpPreviewModal button{
  pointer-events:auto;
}

/* v3.0 calculation + preview stability fix; UI unchanged. */
