*{box-sizing:border-box} :root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#172033;background:#f4f6f9;font-synthesis:none} body{margin:0} button,input,select,textarea{font:inherit} button{cursor:pointer} .hidden{display:none!important}.app{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:248px;background:#111827;color:#fff;padding:20px 14px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:11px;padding:4px 8px 22px}.brand-large{color:#172033;padding:0 0 24px}.brand-mark{width:42px;height:42px;border-radius:12px;background:#2563eb;display:grid;place-items:center;font-weight:900;color:#fff}.brand strong,.brand span{display:block}.brand span{font-size:12px;color:#9ca3af;margin-top:2px}.sidebar nav{display:grid;gap:5px}.sidebar nav button{border:0;background:transparent;color:#cbd5e1;text-align:left;padding:11px 13px;border-radius:9px;font-weight:650}.sidebar nav button:hover,.sidebar nav button.active{background:#253047;color:#fff}.sidebar-footer{margin-top:auto}.sidebar-footer button{margin-top:12px}.user-card{font-size:13px;padding:10px;border-top:1px solid #374151}.user-card strong,.user-card span{display:block}.user-card span{color:#9ca3af;margin-top:3px}.main{margin-left:248px;min-height:100vh}.topbar{height:72px;background:#fff;border-bottom:1px solid #e5e7eb;padding:12px 26px;display:flex;align-items:center;gap:18px;position:sticky;top:0;z-index:10}.global-search{position:relative;flex:1;max-width:720px}.global-search input,.toolbar input{width:100%}.search-results{position:absolute;top:46px;left:0;right:0;background:#fff;border:1px solid #dbe1ea;border-radius:12px;box-shadow:0 16px 40px #11182726;max-height:390px;overflow:auto}.search-result{padding:11px 14px;border-bottom:1px solid #eef1f5}.search-result:hover{background:#f8fafc}.search-result small{display:block;color:#667085;margin-top:3px}.page{display:none;padding:28px}.page.active{display:block}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.page-heading h1{margin:0;font-size:27px}.page-heading p{margin:5px 0 0;color:#667085}.primary,.secondary,.ghost,.danger,.link-btn,.quick-actions button,.file-button{border:0;border-radius:9px;padding:10px 15px;font-weight:700}.primary{background:#2563eb;color:white}.primary:hover{background:#1d4ed8}.secondary,.file-button{background:#e9eef6;color:#263449}.ghost{background:#ffffff14;color:#fff}.danger{background:#fee2e2;color:#b42318}.link-btn{background:transparent;color:#2563eb;padding:6px}.full{width:100%}.icon-btn{border:0;background:transparent;font-size:24px;padding:5px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:18px}.stats article,.panel{background:#fff;border:1px solid #e5e7eb;border-radius:14px;box-shadow:0 1px 2px #1118270a}.stats article{padding:19px}.stats span{display:block;color:#667085;font-size:13px}.stats strong{display:block;font-size:29px;margin-top:7px}.grid-2{display:grid;grid-template-columns:1.45fr 1fr;gap:18px}.panel{padding:18px}.panel-title{display:flex;justify-content:space-between;align-items:center}.panel-title h2{font-size:18px;margin:0 0 14px}.quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.quick-actions button{background:#f1f5f9;text-align:left;min-height:68px}.toolbar{display:flex;gap:12px;margin-bottom:15px}.toolbar select{min-width:205px}input,select,textarea{border:1px solid #d0d5dd;border-radius:8px;padding:10px 11px;background:#fff;color:#172033}input:focus,select:focus,textarea:focus{outline:2px solid #2563eb30;border-color:#2563eb}textarea{min-height:88px;resize:vertical}table{width:100%;border-collapse:collapse}th{text-align:left;color:#667085;font-size:12px;text-transform:uppercase;letter-spacing:.04em;padding:11px 9px;border-bottom:1px solid #e5e7eb}td{padding:13px 9px;border-bottom:1px solid #eef1f5;vertical-align:top}td small{display:block;color:#667085;margin-top:3px}.row-actions{display:flex;gap:6px;justify-content:flex-end}.row-actions button{padding:6px 9px;border:0;border-radius:7px;background:#eef2f7}.badge{display:inline-flex;border-radius:999px;padding:4px 9px;font-size:12px;font-weight:750;background:#eef2ff;color:#3730a3}.badge.green{background:#dcfce7;color:#166534}.badge.orange{background:#ffedd5;color:#9a3412}.badge.red{background:#fee2e2;color:#991b1b}.empty{padding:32px;text-align:center;color:#667085}.login-shell{min-height:100vh;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at top left,#dbeafe,#f8fafc 45%)}.login-card{width:min(430px,100%);background:#fff;padding:32px;border-radius:18px;box-shadow:0 25px 70px #1118271f}.login-card h1{margin:0}.login-card form{display:grid;gap:14px;margin-top:22px}.login-card label,.form-grid label,.modal-form label{display:grid;gap:6px;font-size:13px;font-weight:700}.muted{color:#667085}.demo-note{background:#f8fafc;border:1px solid #e5e7eb;border-radius:9px;padding:11px;margin-top:17px;font-size:12px;color:#475467}.form-grid,.modal-form{display:grid;grid-template-columns:1fr 1fr;gap:15px}.span-2{grid-column:1/-1}.actions{display:flex;gap:10px;align-items:center}.file-button input{display:none}.toast{position:fixed;right:22px;bottom:22px;background:#101828;color:#fff;padding:12px 16px;border-radius:9px;z-index:100;opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:none}dialog{border:0;padding:0;background:transparent}dialog::backdrop{background:#10182899}.modal-card{background:#fff;width:min(820px,94vw);max-height:90vh;overflow:auto;border-radius:15px;padding:0}.modal-header{position:sticky;top:0;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:17px 20px;border-bottom:1px solid #e5e7eb;z-index:2}.modal-header h2{margin:0}.modal-card #modalBody{padding:20px}.modal-footer{display:flex;justify-content:flex-end;gap:9px;margin-top:18px}.line-items{margin-top:14px}.line-item{display:grid;grid-template-columns:2fr .6fr .8fr .65fr .8fr auto;gap:7px;align-items:end;margin-bottom:8px}.line-item label{font-size:11px}.line-item input,.line-item select{width:100%}.totals{margin-left:auto;width:min(360px,100%);display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:16px}.totals strong{font-size:17px}.invoice-preview-shell{background:#e5e7eb;width:min(1050px,96vw);height:94vh;overflow:auto;padding:18px}.preview-actions{display:flex;gap:8px;margin-bottom:12px}.invoice-paper{background:#fff;width:8.5in;min-height:11in;margin:auto;padding:.55in;box-shadow:0 4px 20px #11182726}.invoice-head{display:flex;justify-content:space-between;border-bottom:2px solid #111827;padding-bottom:18px}.invoice-head h1{margin:0;font-size:31px}.invoice-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:24px 0}.invoice-table th,.invoice-table td{padding:9px 6px}.invoice-summary{margin:20px 0 0 auto;width:330px}.invoice-summary div{display:flex;justify-content:space-between;padding:5px}.invoice-summary .grand{font-size:19px;font-weight:800;border-top:2px solid #111827;margin-top:5px;padding-top:10px}.invoice-note{margin-top:28px;border-top:1px solid #ddd;padding-top:16px}.mobile-only,#mobileMenuBtn{display:none}.timeline{border-left:2px solid #dbeafe;margin-left:7px;padding-left:16px}.timeline div{margin:0 0 14px}.timeline small{color:#667085}.clickable{cursor:pointer}.clickable:hover{background:#f8fafc}@media(max-width:900px){.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:none}.main{margin-left:0}.topbar{padding:11px}.topbar>.primary{display:none}#mobileMenuBtn{display:block}.page{padding:18px}.stats{grid-template-columns:1fr 1fr}.grid-2{grid-template-columns:1fr}.form-grid,.modal-form{grid-template-columns:1fr}.span-2{grid-column:auto}.invoice-paper{width:100%;min-height:auto;padding:25px}.line-item{grid-template-columns:1fr 1fr}.line-item>*:first-child{grid-column:1/-1}}@media(max-width:600px){.stats{grid-template-columns:1fr}.toolbar{flex-direction:column}.toolbar select{min-width:0}.page-heading{align-items:flex-start}.table-wrap{overflow:auto}.quick-actions{grid-template-columns:1fr}.actions{flex-wrap:wrap}}@media print{body *{visibility:hidden}.invoice-paper,.invoice-paper *{visibility:visible}.invoice-paper{position:absolute;left:0;top:0;width:100%;box-shadow:none;padding:.35in}.preview-actions{display:none}}

.stat-click small{display:block;color:#98a2b3;margin-top:6px;font-size:11px}.stat-click:hover{border-color:#93c5fd;box-shadow:0 4px 14px #2563eb18}.customer-search-wrap{position:relative;flex:1}.customer-toolbar .customer-search-results{top:46px;z-index:40}.address-autocomplete-wrap{position:relative}.address-suggestions{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #d0d5dd;border-radius:9px;box-shadow:0 14px 35px #11182726;z-index:50;max-height:260px;overflow:auto}.address-option{padding:10px 12px;border-bottom:1px solid #eef1f5;cursor:pointer;font-size:13px;font-weight:500}.address-option:hover{background:#f8fafc}.address-option small{display:block;color:#667085;margin-top:3px}.address-loading{padding:10px 12px;color:#667085;font-size:12px}
.repair-heading{margin:20px 0 10px}.order-repairs{display:grid;gap:14px}.order-repair{border:1px solid #dbe1ea;border-radius:12px;padding:13px;background:#f8fafc}.order-repair-top{display:grid;grid-template-columns:1fr 150px auto;gap:9px;align-items:end}.order-repair>label{display:grid;gap:6px;font-size:12px;font-weight:700;margin-top:10px}.order-cost-grid{display:grid;grid-template-columns:1fr 1fr 160px;gap:10px;margin-top:10px}.cost-block{display:grid;grid-template-columns:1fr 1fr;gap:8px;background:#fff;border:1px solid #e5e7eb;border-radius:9px;padding:10px}.cost-block strong{grid-column:1/-1}.cost-block label{display:grid;gap:5px;font-size:11px;font-weight:700}.cost-block span{grid-column:1/-1;text-align:right;font-weight:800}.repair-total-box{display:flex;flex-direction:column;justify-content:center;align-items:center;background:#eef2ff;border-radius:9px;padding:10px}.repair-total-box span{font-size:12px;color:#667085}.repair-total-box strong{font-size:20px;margin-top:5px}.order-totals{border-top:1px solid #e5e7eb;padding-top:14px}@media(max-width:800px){.order-repair-top{grid-template-columns:1fr}.order-cost-grid{grid-template-columns:1fr}.repair-total-box{min-height:80px}}


/* v6: compact work-order workspace and durable record lists */
.record-count{font-size:12px;color:#667085;margin:0 0 9px;font-weight:700}
.modal-card.work-order-modal{
 width:min(1280px,96vw);
 height:min(820px,94vh);
 max-height:94vh;
 overflow:hidden;
 display:flex;
 flex-direction:column;
}
.work-order-modal .modal-header{
 flex:0 0 auto;
 padding:13px 18px;
 cursor:default;
}
.work-order-modal #modalBody{
 padding:0;
 display:flex;
 flex-direction:column;
 min-height:0;
 flex:1;
 overflow:hidden;
}
.work-order-workspace{
 min-height:0;
 flex:1;
 display:grid;
 grid-template-columns:minmax(320px,36%) minmax(0,64%);
 overflow:hidden;
}
.work-order-details{
 padding:14px;
 border-right:1px solid #e5e7eb;
 overflow:auto;
 background:#fbfcfe;
}
.compact-form{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:9px;
}
.compact-form label{
 display:grid;
 gap:4px;
 font-size:11px;
 font-weight:750;
}
.compact-form input,.compact-form select{
 padding:8px 9px;
 min-width:0;
}
.compact-notes textarea{
 min-height:76px;
 max-height:96px;
 padding:8px 9px;
}
.work-order-repair-side{
 min-width:0;
 display:flex;
 flex-direction:column;
 overflow:hidden;
}
.repair-side-header{
 flex:0 0 auto;
 display:flex;
 justify-content:space-between;
 align-items:center;
 gap:12px;
 padding:12px 14px;
 border-bottom:1px solid #e5e7eb;
 background:#fff;
}
.repair-side-header h3{margin:0;font-size:16px}
.repair-side-header small{color:#667085}
.compact-order-repairs{
 flex:1;
 min-height:0;
 overflow-y:auto;
 overflow-x:hidden;
 padding:10px 12px;
 display:grid;
 align-content:start;
 gap:9px;
}
.compact-order-repairs .order-repair{
 padding:9px;
 margin:0;
 border-radius:10px;
}
.compact-order-repairs .order-repair-top{
 grid-template-columns:minmax(180px,1fr) 105px 34px;
 gap:7px;
}
.compact-order-repairs .order-repair>label{
 margin-top:6px;
}
.compact-order-repairs .order-repair input,
.compact-order-repairs .order-repair select{
 padding:7px 8px;
}
.compact-order-repairs .order-cost-grid{
 grid-template-columns:1fr 1fr 125px;
 gap:7px;
 margin-top:7px;
}
.compact-order-repairs .cost-block{
 padding:7px;
 gap:6px;
}
.compact-order-repairs .repair-total-box{
 padding:7px;
}
.compact-order-repairs .repair-total-box strong{font-size:17px}
.work-order-bottom{
 flex:0 0 auto;
 display:grid;
 grid-template-columns:220px minmax(280px,360px);
 justify-content:end;
 align-items:end;
 gap:18px;
 padding:10px 14px;
 border-top:1px solid #e5e7eb;
 background:#fff;
}
.tax-rate-field{
 display:grid;
 gap:5px;
 font-size:11px;
 font-weight:750;
}
.tax-rate-field input{padding:8px}
.work-order-bottom .order-totals{
 margin:0;
 padding:0;
 width:100%;
 font-size:12px;
 gap:4px 16px;
 border:0;
}
.work-order-bottom .order-totals strong{font-size:14px}
.work-order-footer{
 flex:0 0 auto;
 margin:0;
 padding:10px 14px;
 border-top:1px solid #e5e7eb;
 background:#fff;
}
@media(max-width:950px){
 .modal-card.work-order-modal{width:97vw;height:95vh}
 .work-order-workspace{grid-template-columns:1fr}
 .work-order-details{border-right:0;border-bottom:1px solid #e5e7eb;max-height:42%}
 .work-order-repair-side{min-height:58%}
}
@media(max-width:650px){
 .compact-form{grid-template-columns:1fr}
 .compact-form .span-2{grid-column:auto}
 .work-order-bottom{grid-template-columns:1fr}
 .compact-order-repairs .order-cost-grid{grid-template-columns:1fr}
 .compact-order-repairs .order-repair-top{grid-template-columns:1fr}
}


/* v7: expose repair delete button and preserve current layout */
.modal-card.work-order-modal{
 width:min(1360px,98vw);
}
.compact-order-repairs{
 padding-right:18px;
}
.compact-order-repairs .order-repair{
 overflow:visible;
}
.compact-order-repairs .order-repair-top{
 grid-template-columns:minmax(220px,1fr) 92px 42px;
 align-items:end;
}
.compact-order-repairs .order-repair-top .danger,
.compact-order-repairs .order-remove{
 width:38px;
 min-width:38px;
 height:36px;
 padding:0;
 display:grid;
 place-items:center;
 overflow:visible;
 justify-self:end;
}
.work-order-repair-side{
 padding-right:2px;
}
@media(max-width:1100px){
 .modal-card.work-order-modal{width:98vw}
}


/* v9: bulk selection and deletion for work orders and invoices */
.bulk-toolbar{
 display:flex;
 align-items:center;
 gap:14px;
 margin:0 0 11px;
 min-height:38px;
}
.bulk-toolbar label{
 display:flex;
 align-items:center;
 gap:7px;
 font-size:13px;
 font-weight:750;
}
.bulk-toolbar span{
 color:#667085;
 font-size:12px;
 font-weight:700;
}
.bulk-toolbar .compact-danger{
 margin-left:auto;
 padding:7px 11px;
}
.bulk-toolbar .compact-danger:disabled{
 opacity:.45;
 cursor:not-allowed;
}
.select-cell{
 width:42px;
 text-align:center;
}
.row-check,
.bulk-toolbar input[type="checkbox"]{
 width:17px;
 height:17px;
 accent-color:#2563eb;
 cursor:pointer;
}


/* v10: Deleted page and reversible deletion */
.trash-permanent{
 background:#fee2e2!important;
 color:#b42318!important;
}
#page-deleted .badge{
 min-width:110px;
 justify-content:center;
}
#page-deleted td small{
 max-width:520px;
 overflow:hidden;
 text-overflow:ellipsis;
 white-space:nowrap;
}


/* v12: settings logo upload and invoice branding */
.logo-setting-row{
 display:flex;
 align-items:center;
 gap:16px;
 padding:12px;
 border:1px solid #e5e7eb;
 border-radius:10px;
 background:#f8fafc;
}
.logo-preview-box{
 width:150px;
 height:90px;
 border:1px dashed #cbd5e1;
 border-radius:9px;
 background:#fff;
 display:grid;
 place-items:center;
 overflow:hidden;
 color:#667085;
 font-size:12px;
 font-weight:600;
}
.logo-preview-box img{
 width:100%;
 height:100%;
 object-fit:contain;
 padding:8px;
}
.logo-actions{
 display:flex;
 align-items:flex-start;
 flex-wrap:wrap;
 gap:8px;
}
.logo-actions small{
 flex-basis:100%;
 color:#667085;
 font-weight:500;
}
.logo-actions .danger:disabled{
 opacity:.45;
 cursor:not-allowed;
}
.invoice-brand-block{
 display:flex;
 align-items:flex-start;
 gap:16px;
}
.invoice-logo{
 width:175px;
 height:100px;
 object-fit:contain;
 object-position:left top;
 flex:0 0 auto;
}
@media(max-width:600px){
 .logo-setting-row{align-items:flex-start;flex-direction:column}
 .invoice-brand-block{gap:10px}
 .invoice-logo{width:155px;height:88px;object-fit:contain;object-position:left top}
}

.invoice-footer-message{
text-align:center;
font-weight:700;
color:#1e3a8a;
line-height:1.8;
padding:14px 0;
}
.invoice-footer-message br+br{}


/* v14: working customizable invoice footer */
.invoice-footer-message{
 margin-top:24px;
 padding:18px 20px 6px;
 border-top:1px solid #dbe3ef;
 text-align:center;
 font-weight:800;
 font-size:13px;
 line-height:1.65;
 color:#1e3a8a;
 letter-spacing:.01em;
}
.invoice-footer-phone{
 margin-top:8px;
 color:#172033;
 font-size:12px;
 font-weight:750;
}
@media print{
 .invoice-footer-message{
  break-inside:avoid;
  page-break-inside:avoid;
 }
}


/* v15: fully settings-driven invoice branding */
.invoice-footer-phone{
 margin-top:10px;
 color:#1e3a8a;
 font-size:16px;
 font-weight:800;
 letter-spacing:.02em;
}
.invoice-note p{
 white-space:pre-line;
}
.invoice-footer-message{
 white-space:normal;
}


/* v16: automatic A4 invoice compression */
.invoice-paper{
 width:210mm;
 min-height:297mm;
 padding:13mm;
}
.invoice-paper.invoice-compact{
 padding:10mm 12mm;
 font-size:12px;
}
.invoice-paper.invoice-compact .invoice-head{
 padding-bottom:12px;
}
.invoice-paper.invoice-compact .invoice-head h1{
 font-size:27px;
}
.invoice-paper.invoice-compact .invoice-grid{
 margin:15px 0;
 gap:18px;
}
.invoice-paper.invoice-compact .invoice-table th,
.invoice-paper.invoice-compact .invoice-table td{
 padding:6px 5px;
}
.invoice-paper.invoice-compact .invoice-summary{
 margin-top:12px;
}
.invoice-paper.invoice-compact .invoice-note{
 margin-top:16px;
 padding-top:10px;
}
.invoice-paper.invoice-compact .invoice-footer-message{
 margin-top:14px;
 padding-top:12px;
}

.invoice-paper.invoice-dense{
 padding:8mm 10mm;
 font-size:11px;
}
.invoice-paper.invoice-dense .invoice-logo{
 width:125px;
 height:72px;
}
.invoice-paper.invoice-dense .invoice-head{
 padding-bottom:9px;
}
.invoice-paper.invoice-dense .invoice-head h1{
 font-size:24px;
}
.invoice-paper.invoice-dense .invoice-head h2{
 margin:0 0 4px;
}
.invoice-paper.invoice-dense .invoice-grid{
 margin:10px 0;
 gap:14px;
}
.invoice-paper.invoice-dense .invoice-grid p{
 margin:4px 0;
 line-height:1.35;
}
.invoice-paper.invoice-dense .invoice-table th,
.invoice-paper.invoice-dense .invoice-table td{
 padding:4px 4px;
 line-height:1.25;
}
.invoice-paper.invoice-dense .invoice-summary{
 margin-top:8px;
}
.invoice-paper.invoice-dense .invoice-summary div{
 padding:3px 5px;
}
.invoice-paper.invoice-dense .invoice-note{
 margin-top:10px;
 padding-top:8px;
}
.invoice-paper.invoice-dense .invoice-note p{
 margin:5px 0;
 line-height:1.35;
}
.invoice-paper.invoice-dense .invoice-footer-message{
 margin-top:9px;
 padding:9px 12px 2px;
 line-height:1.4;
}
.invoice-paper.invoice-dense .invoice-footer-phone{
 margin-top:4px;
 font-size:14px;
}

.invoice-paper.invoice-ultra-dense{
 padding:6mm 9mm;
 font-size:10px;
}
.invoice-paper.invoice-ultra-dense .invoice-logo{
 width:105px;
 height:62px;
}
.invoice-paper.invoice-ultra-dense .invoice-brand-block{
 gap:9px;
}
.invoice-paper.invoice-ultra-dense .invoice-head{
 padding-bottom:7px;
}
.invoice-paper.invoice-ultra-dense .invoice-head h1{
 font-size:21px;
 margin-bottom:2px;
}
.invoice-paper.invoice-ultra-dense .invoice-head h2{
 font-size:20px;
 margin:0 0 2px;
}
.invoice-paper.invoice-ultra-dense .invoice-grid{
 margin:7px 0;
 gap:10px;
}
.invoice-paper.invoice-ultra-dense .invoice-grid p{
 margin:2px 0;
 line-height:1.2;
}
.invoice-paper.invoice-ultra-dense .invoice-table th,
.invoice-paper.invoice-ultra-dense .invoice-table td{
 padding:3px 3px;
 line-height:1.15;
}
.invoice-paper.invoice-ultra-dense .invoice-summary{
 margin-top:5px;
 width:300px;
}
.invoice-paper.invoice-ultra-dense .invoice-summary div{
 padding:2px 4px;
}
.invoice-paper.invoice-ultra-dense .invoice-summary .grand{
 font-size:15px;
 padding-top:6px;
}
.invoice-paper.invoice-ultra-dense .invoice-note{
 margin-top:7px;
 padding-top:5px;
}
.invoice-paper.invoice-ultra-dense .invoice-note p{
 margin:3px 0;
 line-height:1.2;
}
.invoice-paper.invoice-ultra-dense .invoice-footer-message{
 margin-top:6px;
 padding:6px 10px 0;
 font-size:10px;
 line-height:1.25;
}
.invoice-paper.invoice-ultra-dense .invoice-footer-phone{
 margin-top:3px;
 font-size:13px;
}

@page{
 size:A4 portrait;
 margin:0;
}
@media print{
 html,body{
  width:210mm;
  height:297mm;
  margin:0;
  padding:0;
 }
 .invoice-paper{
  width:210mm;
  min-height:297mm;
  max-height:297mm;
  overflow:hidden;
  margin:0;
  box-shadow:none;
  page-break-after:avoid;
  break-after:avoid-page;
 }
 .invoice-table tr,
 .invoice-head,
 .invoice-grid,
 .invoice-summary,
 .invoice-note,
 .invoice-footer-message{
  break-inside:avoid;
  page-break-inside:avoid;
 }
}


/* v17: compact full-size invoice editor; print layout unchanged */
.modal-card.invoice-editor-modal{
 width:min(1360px,98vw);
 height:min(820px,94vh);
 max-height:94vh;
 overflow:hidden;
 display:flex;
 flex-direction:column;
}
.invoice-editor-modal .modal-header{
 flex:0 0 auto;
 padding:13px 18px;
}
.invoice-editor-modal #modalBody{
 padding:0;
 display:flex;
 flex-direction:column;
 min-height:0;
 flex:1;
 overflow:hidden;
}
.invoice-editor-workspace{
 min-height:0;
 flex:1;
 display:grid;
 grid-template-columns:minmax(320px,35%) minmax(0,65%);
 overflow:hidden;
}
.invoice-editor-details{
 padding:14px;
 border-right:1px solid #e5e7eb;
 overflow:auto;
 background:#fbfcfe;
}
.invoice-compact-form{
 gap:9px;
}
.invoice-compact-form textarea{
 min-height:100px;
 max-height:150px;
}
.invoice-editor-lines{
 min-width:0;
 display:flex;
 flex-direction:column;
 overflow:hidden;
}
.invoice-line-scroll{
 flex:1;
 min-height:0;
 overflow-y:auto;
 overflow-x:hidden;
 padding:10px 14px;
 margin:0;
}
.invoice-line-scroll .line-item{
 grid-template-columns:minmax(220px,1.7fr) 85px 88px 100px 90px 40px;
 gap:7px;
 padding:9px;
 margin:0 0 9px;
 border:1px solid #e5e7eb;
 border-radius:10px;
 background:#fff;
}
.invoice-line-scroll .line-item > label:last-child{
 grid-column:1/-1;
}
.invoice-line-scroll .line-item input,
.invoice-line-scroll .line-item select{
 padding:7px 8px;
}
.invoice-line-scroll .li-remove{
 width:38px;
 min-width:38px;
 height:36px;
 padding:0;
 display:grid;
 place-items:center;
}
.invoice-editor-bottom{
 flex:0 0 auto;
 display:flex;
 justify-content:flex-end;
 padding:10px 14px;
 border-top:1px solid #e5e7eb;
 background:#fff;
}
.invoice-editor-totals{
 margin:0;
 width:min(380px,100%);
 padding:0;
 gap:5px 18px;
}
.invoice-editor-footer{
 flex:0 0 auto;
 margin:0;
 padding:10px 14px;
 border-top:1px solid #e5e7eb;
 background:#fff;
}
@media(max-width:950px){
 .modal-card.invoice-editor-modal{
  width:97vw;
  height:95vh;
 }
 .invoice-editor-workspace{
  grid-template-columns:1fr;
 }
 .invoice-editor-details{
  border-right:0;
  border-bottom:1px solid #e5e7eb;
  max-height:42%;
 }
 .invoice-editor-lines{
  min-height:58%;
 }
}
@media(max-width:700px){
 .invoice-line-scroll .line-item{
  grid-template-columns:1fr 1fr;
 }
 .invoice-line-scroll .line-item > label:first-child,
 .invoice-line-scroll .line-item > label:last-child{
  grid-column:1/-1;
 }
}


/* v18: widen customer/vehicle columns in invoice and work-order editors */
.modal-card.invoice-editor-modal,
.modal-card.work-order-modal{
 width:min(1420px,99vw);
}

.invoice-editor-workspace{
 grid-template-columns:minmax(390px,40%) minmax(0,60%);
}

.work-order-workspace{
 grid-template-columns:minmax(390px,40%) minmax(0,60%);
}

.invoice-editor-details select,
.work-order-details select{
 min-width:0;
 width:100%;
}

.invoice-editor-details option,
.work-order-details option{
 font-size:13px;
}

@media(max-width:1100px){
 .invoice-editor-workspace,
 .work-order-workspace{
  grid-template-columns:minmax(360px,42%) minmax(0,58%);
 }
}

@media(max-width:950px){
 .invoice-editor-workspace,
 .work-order-workspace{
  grid-template-columns:1fr;
 }
}


/* v19: professional customer history and loyalty profile */
.modal-card.customer-history-modal{
 width:min(1180px,96vw);
 max-height:92vh;
}
.customer-history-modal #modalBody{
 padding:18px;
}
.customer-profile{
 display:grid;
 gap:18px;
}
.customer-profile-head{
 display:flex;
 justify-content:space-between;
 align-items:flex-start;
 gap:20px;
 padding-bottom:14px;
 border-bottom:1px solid #e5e7eb;
}
.customer-profile-head h3{
 margin:0 0 6px;
 font-size:22px;
}
.customer-profile-head p{
 margin:0;
 color:#475467;
 line-height:1.55;
}
.customer-history-stats{
 display:grid;
 grid-template-columns:repeat(6,1fr);
 gap:10px;
}
.customer-history-stats article{
 background:#f8fafc;
 border:1px solid #e5e7eb;
 border-radius:10px;
 padding:12px;
}
.customer-history-stats span{
 display:block;
 color:#667085;
 font-size:11px;
}
.customer-history-stats strong{
 display:block;
 margin-top:5px;
 font-size:16px;
}
.customer-history-section{
 border-top:1px solid #eef1f5;
 padding-top:14px;
}
.customer-history-section .panel-title h2{
 margin-bottom:10px;
}
.customer-vehicle-list{
 display:grid;
 grid-template-columns:repeat(3,1fr);
 gap:9px;
}
.customer-vehicle-list button{
 border:1px solid #e5e7eb;
 border-radius:9px;
 background:#fff;
 padding:11px;
 text-align:left;
}
.customer-vehicle-list button:hover{
 background:#f8fafc;
}
.customer-vehicle-list button strong,
.customer-vehicle-list button small{
 display:block;
}
.customer-vehicle-list button small{
 color:#667085;
 margin-top:4px;
}
.customer-history-modal table tr.clickable:hover{
 background:#f8fafc;
}
@media(max-width:1000px){
 .customer-history-stats{
  grid-template-columns:repeat(3,1fr);
 }
 .customer-vehicle-list{
  grid-template-columns:repeat(2,1fr);
 }
}
@media(max-width:650px){
 .customer-history-stats{
  grid-template-columns:1fr 1fr;
 }
 .customer-vehicle-list{
  grid-template-columns:1fr;
 }
 .customer-profile-head{
  flex-direction:column;
 }
}


/* v20 Phase 1: Firebase Authentication */
.compact-auth-grid{
 gap:12px;
 margin-bottom:14px;
}
.auth-security-note{
 margin-top:14px;
 padding:11px 12px;
 border:1px solid #dbe4f0;
 border-radius:9px;
 background:#f8fafc;
 color:#475467;
 font-size:12px;
 line-height:1.45;
}
.link-button{
 border:0;
 background:transparent;
 color:#2563eb;
 padding:12px;
 cursor:pointer;
 font-weight:700;
}
.link-button:hover{
 text-decoration:underline;
}
.auth-loading{
 min-height:180px;
 display:flex;
 flex-direction:column;
 align-items:center;
 justify-content:center;
 gap:12px;
 color:#667085;
 text-align:center;
}
.auth-spinner{
 width:30px;
 height:30px;
 border:3px solid #e5e7eb;
 border-top-color:#2563eb;
 border-radius:50%;
 animation:authSpin .8s linear infinite;
}
@keyframes authSpin{
 to{transform:rotate(360deg)}
}
.phase-notice{
 padding:20px;
 border:1px solid #dbe4f0;
 border-radius:10px;
 background:#f8fafc;
}
.phase-notice strong{
 display:block;
 margin-bottom:7px;
}
.phase-notice p{
 margin:0;
 color:#475467;
 line-height:1.5;
}


/* v21: customer Firestore synchronization */
.cloud-sync-banner{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:14px;
 margin-bottom:10px;
 padding:10px 12px;
 border:1px solid #cfe8d7;
 border-radius:9px;
 background:#f0fbf4;
}
.cloud-sync-banner strong{
 font-size:13px;
}
.cloud-sync-banner span{
 color:#52645a;
 font-size:12px;
}
@media(max-width:650px){
 .cloud-sync-banner{
  align-items:flex-start;
  flex-direction:column;
  gap:3px;
 }
}
.employee-avatar{width:42px;height:42px;border-radius:50%;object-fit:cover;vertical-align:middle}.table-avatar{width:38px;height:38px}.employee-avatar-placeholder{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#eef2f7}.employee-photo-preview{width:96px;height:96px;border-radius:50%;overflow:hidden;background:#eef2f7;display:grid;place-items:center;font-size:40px;margin:8px 0}.employee-photo-preview img{width:100%;height:100%;object-fit:cover}.form-note{font-size:.86rem;color:#64748b;margin:.5rem 0}.user-card .employee-avatar{display:block;margin-bottom:6px}

/* v48: mobile modal usability and work-order responsive layout */
#modal{
 max-width:none;
 max-height:none;
}
#modal .modal-header .icon-btn{
 width:44px;
 min-width:44px;
 height:44px;
 display:grid;
 place-items:center;
 line-height:1;
 touch-action:manipulation;
 position:relative;
 z-index:5;
}

@media(max-width:700px){
 html,body{max-width:100%;overflow-x:hidden}
 #modal{
  width:100vw;
  height:100dvh;
  margin:0;
  padding:max(10px,env(safe-area-inset-top)) 10px max(10px,env(safe-area-inset-bottom));
  overflow:hidden;
 }
 #modal[open]{
  display:flex;
  align-items:center;
  justify-content:center;
 }
 #modal .modal-card,
 #modal .modal-card.work-order-modal,
 #modal .modal-card.invoice-editor-modal,
 #modal .modal-card.customer-history-modal{
  width:100%;
  max-width:100%;
  height:auto;
  max-height:calc(100dvh - max(20px,env(safe-area-inset-top)) - max(20px,env(safe-area-inset-bottom)));
  margin:0;
  border-radius:16px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
 }
 #modal .modal-header{
  flex:0 0 auto;
  width:100%;
  padding:12px 14px;
  min-height:64px;
 }
 #modal .modal-header h2{
  min-width:0;
  margin:0;
  font-size:clamp(24px,7vw,34px);
  line-height:1.12;
  overflow-wrap:anywhere;
 }
 #modal .modal-card #modalBody{
  flex:1 1 auto;
  min-height:0;
  width:100%;
  padding:14px;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
 }
 #modal .modal-form,
 #modal .form-grid{
  width:100%;
  grid-template-columns:minmax(0,1fr);
 }
 #modal input,
 #modal select,
 #modal textarea,
 #modal label{
  min-width:0;
  max-width:100%;
  width:100%;
 }
 #modal input,
 #modal select,
 #modal textarea{
  font-size:16px;
 }
 #modal .modal-footer{
  position:sticky;
  bottom:0;
  z-index:4;
  width:100%;
  margin:16px -14px -14px;
  padding:12px 14px calc(12px + env(safe-area-inset-bottom));
  background:#fff;
  border-top:1px solid #e5e7eb;
 }
 #modal .modal-footer button{
  min-height:46px;
 }

 /* Use one natural vertical scroll area for the complete work-order form. */
 #modal .work-order-modal #modalBody{
  display:block;
  overflow-y:auto;
  overflow-x:hidden;
 }
 #modal .work-order-workspace{
  display:block;
  width:100%;
  min-height:0;
  overflow:visible;
 }
 #modal .work-order-details{
  width:100%;
  max-height:none;
  padding:0 0 14px;
  overflow:visible;
  border-right:0;
  border-bottom:1px solid #e5e7eb;
 }
 #modal .compact-form{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  width:100%;
 }
 #modal .work-order-repair-side{
  display:block;
  width:100%;
  min-height:0;
  padding:0;
  overflow:visible;
 }
 #modal .repair-side-header{
  position:static;
  width:100%;
  padding:14px 0 10px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:10px;
  border-bottom:1px solid #e5e7eb;
 }
 #modal .repair-side-header h3{
  font-size:18px;
 }
 #modal .repair-side-header small{
  display:block;
  line-height:1.35;
 }
 #modal .repair-side-header #addOrderRepairBtn{
  min-width:108px;
  min-height:46px;
  white-space:normal;
 }
 #modal .compact-order-repairs{
  display:grid;
  width:100%;
  min-height:0;
  padding:12px 0;
  overflow:visible;
 }
 #modal .compact-order-repairs .order-repair{
  width:100%;
  min-width:0;
  overflow:hidden;
 }
 #modal .compact-order-repairs .order-repair-top{
  grid-template-columns:minmax(0,1fr) 92px 44px;
  width:100%;
 }
 #modal .compact-order-repairs .order-cost-grid{
  grid-template-columns:minmax(0,1fr);
 }
 #modal .compact-order-repairs .cost-block{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
 }
 #modal .work-order-bottom{
  width:100%;
  padding:12px 0;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:14px;
 }
 #modal .work-order-footer{
  position:sticky;
  bottom:0;
  margin:0;
  padding:12px 14px calc(12px + env(safe-area-inset-bottom));
 }
}

@media(max-width:430px){
 #modal{
  padding-left:8px;
  padding-right:8px;
 }
 #modal .repair-side-header{
  grid-template-columns:1fr;
 }
 #modal .repair-side-header #addOrderRepairBtn{
  width:100%;
 }
 #modal .compact-order-repairs .order-repair-top{
  grid-template-columns:minmax(0,1fr) 82px 42px;
 }
 #modal .modal-footer{
  display:grid;
  grid-template-columns:1fr 1.45fr;
 }
 #modal .modal-footer button{
  width:100%;
  padding-left:10px;
  padding-right:10px;
 }
}

/* v49: mobile vehicle pickers and customer cards */
@media(max-width:700px){
 /* Native selects give iPhone/Android a full scrollable picker for make and model. */
 #modal #vYear,
 #modal #vMake,
 #modal #vModel{
  appearance:auto;
  -webkit-appearance:menulist;
  min-height:48px;
  width:100%;
 }

 /* Replace the wide desktop customer table with complete stacked cards. */
 #customerTable .table-wrap{
  overflow:visible;
 }
 #customerTable table,
 #customerTable tbody,
 #customerTable tr,
 #customerTable td{
  display:block;
  width:100%;
 }
 #customerTable thead{
  display:none;
 }
 #customerTable tbody{
  display:grid;
  gap:14px;
 }
 #customerTable tr.customer-mobile-card{
  position:relative;
  padding:14px;
  border:1px solid #dbe2ea;
  border-radius:14px;
  background:#fff;
  box-shadow:0 1px 2px #1118270a;
 }
 #customerTable tr.customer-mobile-card td{
  display:grid;
  grid-template-columns:minmax(104px,34%) minmax(0,1fr);
  gap:10px;
  align-items:start;
  padding:9px 0;
  border:0;
  overflow-wrap:anywhere;
 }
 #customerTable tr.customer-mobile-card td::before{
  content:attr(data-label);
  color:#667085;
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
 }
 #customerTable tr.customer-mobile-card td.select-cell{
  grid-template-columns:auto 1fr;
  padding-top:0;
 }
 #customerTable tr.customer-mobile-card td.select-cell::before{
  content:'Select record';
 }
 #customerTable tr.customer-mobile-card td small{
  min-width:0;
 }
 #customerTable tr.customer-mobile-card .row-actions{
  justify-content:stretch;
  width:100%;
  gap:10px;
 }
 #customerTable tr.customer-mobile-card .row-actions button{
  flex:1;
  min-height:44px;
  font-weight:750;
 }
}

@media(max-width:390px){
 #customerTable tr.customer-mobile-card td{
  grid-template-columns:1fr;
  gap:4px;
 }
}

/* v50: trim picker and complete mobile record cards */
.trim-custom-input{margin-top:8px}
@media(max-width:700px){
 #modal #vTrim{appearance:auto;-webkit-appearance:menulist;min-height:48px;width:100%}

 #vehicleTable .table-wrap,
 #workOrderTable .table-wrap,
 #invoiceTable .table-wrap,
 #employeeTable .table-wrap,
 #deletedTable .table-wrap{overflow:visible}

 #vehicleTable table,#vehicleTable tbody,#vehicleTable tr,#vehicleTable td,
 #workOrderTable table,#workOrderTable tbody,#workOrderTable tr,#workOrderTable td,
 #invoiceTable table,#invoiceTable tbody,#invoiceTable tr,#invoiceTable td,
 #employeeTable table,#employeeTable tbody,#employeeTable tr,#employeeTable td,
 #deletedTable table,#deletedTable tbody,#deletedTable tr,#deletedTable td{display:block;width:100%}

 #vehicleTable thead,#workOrderTable thead,#invoiceTable thead,#employeeTable thead,#deletedTable thead{display:none}
 #vehicleTable tbody,#workOrderTable tbody,#invoiceTable tbody,#employeeTable tbody,#deletedTable tbody{display:grid;gap:14px}

 tr.mobile-record-card{position:relative;padding:14px;border:1px solid #dbe2ea;border-radius:14px;background:#fff;box-shadow:0 1px 2px #1118270a}
 tr.mobile-record-card td{display:grid!important;grid-template-columns:minmax(104px,34%) minmax(0,1fr);gap:10px;align-items:start;padding:9px 0;border:0;overflow-wrap:anywhere;white-space:normal}
 tr.mobile-record-card td::before{content:attr(data-label);color:#667085;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
 tr.mobile-record-card td.select-cell{grid-template-columns:auto 1fr;padding-top:0}
 tr.mobile-record-card td.select-cell::before{content:'Select record'}
 tr.mobile-record-card td small{min-width:0;white-space:normal}
 tr.mobile-record-card .row-actions{justify-content:stretch;width:100%;gap:10px;flex-wrap:wrap}
 tr.mobile-record-card .row-actions button{flex:1 1 120px;min-height:44px;font-weight:750;white-space:normal}
 tr.mobile-record-card .table-avatar{width:44px;height:44px}
}
@media(max-width:390px){
 tr.mobile-record-card td{grid-template-columns:1fr!important;gap:4px}
}

/* Data-integrity phase: customer vehicle dropdown and invoice work-order picker */
.customer-vehicles-dropdown{position:relative;min-width:150px}
.customer-vehicles-dropdown summary{cursor:pointer;font-weight:700;color:#162033;list-style:none;display:inline-flex;align-items:center;gap:6px}
.customer-vehicles-dropdown summary::-webkit-details-marker{display:none}
.customer-vehicles-dropdown summary::after{content:'▾';font-size:12px}
.customer-vehicles-dropdown[open] summary::after{content:'▴'}
.customer-vehicles-menu{display:grid;gap:6px;margin-top:8px;min-width:230px;max-width:320px}
.customer-vehicles-menu button{display:flex;flex-direction:column;align-items:flex-start;text-align:left;width:100%;padding:9px 10px;border:1px solid #dce3ee;border-radius:9px;background:#f7f9fc;color:#162033}
.customer-vehicles-menu button:hover{background:#eef4ff;border-color:#b9cdf7}
.customer-vehicles-menu small{display:block;color:#68758b;margin-top:2px}
.invoice-order-list{display:grid;gap:10px;max-height:min(60vh,520px);overflow:auto;padding:2px}
.invoice-order-choice{display:flex;flex-direction:column;align-items:flex-start;text-align:left;width:100%;padding:14px;border:1px solid #dce3ee;border-radius:12px;background:#fff}
.invoice-order-choice:hover{border-color:#2d6cdf;background:#f4f8ff}
.invoice-order-choice span,.invoice-order-choice small{display:block;margin-top:4px;color:#68758b}
.helper-text{color:#68758b;margin:0 0 12px}
@media(max-width:760px){
 .customer-vehicles-menu{min-width:0;max-width:none;width:100%}
 .customer-vehicles-dropdown{width:100%}
 .customer-vehicles-dropdown summary{width:100%;justify-content:space-between;padding:8px 0}
}

/* Local Repair Photos module */
.local-storage-notice{display:flex;gap:12px;align-items:flex-start;margin-bottom:16px;padding:13px 15px;border:1px solid #f2d188;border-radius:12px;background:#fff8e6;color:#624a12}
.local-storage-notice span{color:#765f28}
.repair-photo-folders{display:grid;gap:12px}
.repair-photo-folder{border:1px solid #dce3ee;border-radius:13px;background:#fff;overflow:hidden}
.repair-photo-folder summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px;cursor:pointer;list-style:none;font-weight:800}
.repair-photo-folder summary::-webkit-details-marker{display:none}
.repair-photo-folder summary::before{content:'📁';margin-right:8px}
.repair-photo-folder summary .folder-title{display:flex;align-items:center;min-width:0;flex:1}
.repair-photo-folder summary .folder-count{font-size:12px;color:#68758b;font-weight:700}
.repair-photo-folder-body{border-top:1px solid #e7ebf1;padding:14px}
.repair-photo-actions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.repair-photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.repair-photo-card{border:1px solid #dce3ee;border-radius:11px;overflow:hidden;background:#f8fafc}
.repair-photo-card img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:#eef1f5}
.repair-photo-meta{padding:9px;font-size:12px;color:#68758b}
.repair-photo-meta strong{display:block;color:#162033;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.repair-photo-card .row-actions{padding:0 9px 9px}
.repair-photo-empty{padding:24px;text-align:center;color:#778399;background:#f8fafc;border-radius:10px}
@media(max-width:700px){
 .page-heading>.row-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}
 .repair-photo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .local-storage-notice{flex-direction:column}
}
@media(max-width:390px){.repair-photo-grid{grid-template-columns:1fr}}

/* Repair Photos action buttons: visible on light page backgrounds */
#repairPhotoTakeBtn,
#repairPhotoUploadBtn{
  opacity:1!important;
  min-width:132px;
  border:1px solid transparent;
  box-shadow:0 1px 2px rgba(16,24,40,.08);
}
#repairPhotoTakeBtn{
  background:#eaf2ff!important;
  color:#1d4ed8!important;
  border-color:#b9d1ff!important;
}
#repairPhotoTakeBtn:hover{background:#dbeafe!important}
#repairPhotoUploadBtn{
  background:#2563eb!important;
  color:#fff!important;
}
#repairPhotoUploadBtn:hover{background:#1d4ed8!important}
#quickRepairPhotoTake,
#quickRepairPhotoUpload{
  opacity:1!important;
  color:#172033!important;
}
.repair-photo-actions .ghost{
  background:#eaf2ff!important;
  color:#1d4ed8!important;
  border:1px solid #b9d1ff!important;
}
.repair-photo-actions .primary{
  background:#2563eb!important;
  color:#fff!important;
}
@media(max-width:700px){
 #repairPhotoTakeBtn,#repairPhotoUploadBtn{width:100%;min-height:44px}
}

/* Keep local photo inputs present in the rendered document. Some Safari
   versions ignore programmatic clicks on inputs using the hidden attribute. */
.local-photo-file-input{position:fixed!important;left:-10000px!important;top:0!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;}
#photoServerNotice{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
#photoServerNotice span{flex:1;min-width:220px}
#photoServerNotice button{margin-left:auto}

/* Repair Photos final UI polish */
.repair-photo-card .row-actions{
  justify-content:space-between;
  gap:7px;
}
.repair-photo-card .row-actions button{
  flex:1 1 0;
  min-width:0;
  padding:7px 8px;
  border-radius:7px;
  font-size:12px;
  line-height:1.1;
  font-weight:800;
  box-shadow:none;
}
.repair-photo-card .row-actions .ghost{
  background:#2563eb!important;
  color:#fff!important;
  border:1px solid #2563eb!important;
}
.repair-photo-card .row-actions .ghost:hover{
  background:#1d4ed8!important;
  border-color:#1d4ed8!important;
}
.repair-photo-card .row-actions .danger{
  background:#fff!important;
  color:#c81e1e!important;
  border:1px solid #ef9a9a!important;
}
.repair-photo-card .row-actions .danger:hover{
  background:#fff1f1!important;
  border-color:#dc2626!important;
}

@media(max-width:700px){
  #page-repairphotos{
    padding:18px 16px 24px;
  }
  #page-repairphotos .page-heading{
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
    margin-bottom:16px;
  }
  #page-repairphotos .page-heading>div:first-child{
    min-width:0;
  }
  #page-repairphotos .page-heading h1{
    font-size:27px;
    line-height:1.08;
    margin:0;
  }
  #page-repairphotos .page-heading p{
    max-width:34rem;
    margin:7px 0 0;
    font-size:15px;
    line-height:1.45;
  }
  #page-repairphotos .page-heading>.row-actions{
    width:100%;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:9px;
  }
  #photoServerChangeBtn,
  #repairPhotoTakeBtn,
  #repairPhotoUploadBtn{
    width:100%;
    min-width:0!important;
    min-height:40px!important;
    padding:9px 10px!important;
    border-radius:9px!important;
    font-size:14px!important;
    line-height:1.15;
    white-space:normal;
  }
  #photoServerChangeBtn{
    grid-column:2;
    grid-row:1;
    background:#f4f7fb!important;
    border:1px solid #cbd8ea!important;
    color:#263449!important;
  }
  #repairPhotoTakeBtn{
    grid-column:1;
    grid-row:1;
  }
  #repairPhotoUploadBtn{
    grid-column:1/-1;
    grid-row:2;
  }
  #photoServerNotice{
    padding:16px;
    gap:10px;
    align-items:flex-start;
  }
  #photoServerNotice strong{
    width:100%;
    font-size:16px;
  }
  #photoServerNotice span{
    min-width:0;
    width:100%;
    line-height:1.45;
  }
  #photoServerNotice button{
    margin-left:auto;
    padding:9px 12px;
    min-height:38px;
    font-size:14px;
  }
  #page-repairphotos .panel{
    padding:14px;
  }
  .repair-photo-folder summary{
    padding:14px;
  }
}

@media(max-width:420px){
  #page-repairphotos .page-heading h1{font-size:25px}
  #page-repairphotos .page-heading p{font-size:14px}
  #photoServerChangeBtn,
  #repairPhotoTakeBtn,
  #repairPhotoUploadBtn{font-size:13px!important}
  .repair-photo-card .row-actions button{font-size:11px;padding:7px 5px}
}


/* v19: installable app controls */
.install-app-btn,
.install-app-top{
 border:1px solid #3b82f6;
 border-radius:9px;
 background:#eff6ff;
 color:#1d4ed8;
 font-weight:800;
 padding:10px 14px;
 cursor:pointer;
}
.install-app-btn{margin-top:12px}
.install-app-btn:hover,.install-app-top:hover{background:#dbeafe}
.install-app-btn.hidden,.install-app-top.hidden{display:none!important}
.pwa-instructions{display:grid;gap:14px}
.pwa-instructions ol{margin:0;padding-left:22px;line-height:1.7}
.pwa-instructions .pwa-note{background:#eff6ff;border:1px solid #bfdbfe;border-radius:10px;padding:12px;color:#1e3a8a}
@media(max-width:900px){
 .install-app-top{display:inline-flex;align-items:center;white-space:nowrap;padding:9px 11px}
}
@media(max-width:600px){
 .install-app-top{font-size:0;padding:9px;width:40px;height:40px;justify-content:center}
 .install-app-top::before{content:'⬇';font-size:18px}
}


/* v20: dynamic shop branding, persistent install control, full-screen mobile navigation */
.brand-mark{overflow:hidden;flex:0 0 auto}
.brand-mark img{width:100%;height:100%;display:block;object-fit:contain;background:#fff;border-radius:10px;padding:2px}
.brand-copy{min-width:0}
.brand-copy strong{line-height:1.15}
.mobile-menu-close{display:none}
@media(min-width:901px){
 .install-app-top{display:inline-flex;align-items:center;white-space:nowrap}
}
@media(max-width:900px){
 .sidebar{width:100vw;max-width:none;padding:22px 24px;align-items:stretch;overflow-y:auto}
 .sidebar.open{transform:translateX(0)}
 .mobile-menu-close{display:grid;place-items:center;position:absolute;top:18px;right:20px;width:44px;height:44px;border:0;border-radius:12px;background:#253047;color:#fff;font-size:27px;font-weight:800;z-index:2}
 .sidebar .brand{justify-content:center;padding:54px 56px 30px 10px;gap:13px}
 .sidebar .brand-mark{width:54px;height:54px;border-radius:14px}
 .sidebar .brand-copy{display:flex;flex-direction:column;align-items:flex-start;max-width:calc(100vw - 150px)}
 .sidebar .brand-copy strong{font-size:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
 .sidebar .brand-copy span{font-size:13px}
 .sidebar nav{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:18px 0 26px}
 .sidebar nav button{width:min(360px,86vw);text-align:center;padding:13px 18px;font-size:17px;border-radius:12px}
 .sidebar-footer{width:min(360px,86vw);margin:0 auto}
 .sidebar-footer .user-card{text-align:center}
 .sidebar-footer .employee-avatar{margin-left:auto;margin-right:auto}
 .install-app-btn{display:flex!important;align-items:center;justify-content:center}
}

/* v21: sidebar-only install control and dynamic business initials */
.install-app-btn{gap:0}
.install-app-top{display:none!important}

/* Vehicle Health Score */
.vehicle-health-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;border:1px solid currentColor;white-space:nowrap;font-size:12px;font-weight:700}
.vehicle-health-badge strong{font-size:16px;line-height:1}
.vehicle-health-badge.compact{padding:4px 8px;gap:6px}.vehicle-health-badge.compact strong{font-size:14px}
.health-good{color:#087443;background:#ecfdf5}.health-watch{color:#9a5b00;background:#fff7e6}.health-danger{color:#b42318;background:#fff0ef}
.dashboard-health-panel{margin-top:18px}.health-summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:14px}
.health-summary{border:1px solid #e5e7eb;border-radius:14px;padding:16px;display:flex;align-items:baseline;gap:9px}.health-summary strong{font-size:28px}.health-summary span{font-weight:700}.health-summary.good{background:#ecfdf5;color:#087443}.health-summary.watch{background:#fff7e6;color:#9a5b00}.health-summary.danger{background:#fff0ef;color:#b42318}
.health-attention-list{display:grid;gap:8px}.health-attention-list button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid #e5e7eb;border-radius:12px;background:#fff;text-align:left}.health-attention-list button:hover{background:#f8fafc}
.vehicle-health-panel{display:grid;grid-template-columns:180px 1fr;gap:20px;border:1px solid currentColor;border-radius:16px;padding:18px;margin:16px 0}.vehicle-health-score{display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:1px solid currentColor}.vehicle-health-score span{font-weight:700}.vehicle-health-score strong{font-size:58px;line-height:1;margin:8px 0}.vehicle-health-score em{font-style:normal;font-weight:800}.vehicle-health-details h3{margin:0 0 10px}.vehicle-health-details ul{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:7px}.vehicle-health-details li{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid rgba(0,0,0,.08);padding-bottom:7px}.vehicle-health-details small{opacity:.8}
@media(max-width:700px){.health-summary-grid{grid-template-columns:1fr}.vehicle-health-panel{grid-template-columns:1fr}.vehicle-health-score{border-right:0;border-bottom:1px solid currentColor;padding-bottom:16px}.health-attention-list button{align-items:flex-start}.vehicle-health-badge span{display:none}}

/* Vehicle inspection and actionable health dashboard */
.health-summary{font:inherit;text-align:left;cursor:pointer;width:100%;transition:transform .12s ease,box-shadow .12s ease}.health-summary:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(15,23,42,.08)}
.vehicle-inspection{border:1px solid #dbe3ef;border-radius:12px;padding:14px;background:#f8fafc}.inspection-heading{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-bottom:10px}.inspection-heading small{color:#64748b}.inspection-row{display:grid!important;grid-template-columns:1fr 190px;gap:12px;align-items:center;margin:8px 0}.inspection-row span{font-weight:650}.inspection-row select{margin:0}.health-category-list{display:grid;gap:10px}.health-category-list>button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px;border:1px solid #e2e8f0;border-radius:12px;background:#fff;text-align:left;cursor:pointer}.health-category-list>button:hover{background:#f8fafc}.health-category-list strong,.health-category-list small,.health-category-list em{display:block}.health-category-list small{color:#64748b;margin-top:3px}.health-category-list em{font-style:normal;color:#475569;margin-top:6px;font-size:12px}
@media(max-width:700px){.inspection-row{grid-template-columns:1fr}.inspection-heading{display:block}.inspection-heading small{display:block;margin-top:4px}}
.vehicle-workflow{border:1px solid var(--border);border-radius:12px;padding:12px;background:#fff;display:grid;gap:10px}.workflow-current{padding:9px 11px;border-radius:9px;background:var(--surface-2,#f5f7fb)}.workflow-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.workflow-step-btn{text-align:left;min-height:40px}.workflow-history{display:grid;gap:7px;border-top:1px solid var(--border);padding-top:10px}.workflow-history div{display:flex;justify-content:space-between;gap:12px}.workflow-history small{color:var(--muted);text-align:right}@media(max-width:640px){.workflow-buttons{grid-template-columns:1fr}.workflow-history div{display:grid}.workflow-history small{text-align:left}}

/* Vehicle health reason colors */
.vehicle-health-details li.warning{background:#fff7e6;color:#9a5b00;border:1px solid #f4c46b;border-radius:9px;padding:8px 10px;}
.vehicle-health-details li.warning strong{color:#9a5b00;}
.vehicle-health-details li.danger{background:#fff0ef;color:#b42318;border:1px solid #f3a6a0;border-radius:9px;padding:8px 10px;}
.vehicle-health-details li.danger strong{color:#b42318;}
.vehicle-health-details li.good{background:#ecfdf5;color:#087443;border:1px solid #8fd6b3;border-radius:9px;padding:8px 10px;}
.vehicle-health-details li.good strong{color:#087443;}

/* v23: clearer numeric entry and whole-part quantities */
.order-repair input[type="number"]{font-size:15px;font-weight:750;letter-spacing:.035em;font-variant-numeric:tabular-nums;line-height:1.25;padding:10px 11px;min-height:40px}
.order-repair .or-part-qty,.order-repair .or-labor-qty{font-size:16px;font-weight:800}
.order-repair .or-part-price,.order-repair .or-labor-price{font-size:16px;font-weight:800}
.order-repair select,.order-modal select{font-variant-numeric:tabular-nums;letter-spacing:.015em}


/* v24: restore full repair row, clearer customer/number spacing, whole-number part pricing */
.modal-card.work-order-modal{width:min(1440px,99vw)}
.work-order-workspace{grid-template-columns:minmax(350px,34%) minmax(0,66%)}
.work-order-repair-side,.compact-order-repairs,.order-repair,.order-repair-top,.order-cost-grid,.cost-block,.cost-block label{min-width:0}
.compact-order-repairs{padding-left:10px;padding-right:10px;overflow-x:hidden}
.compact-order-repairs .order-repair-top{grid-template-columns:minmax(210px,1fr) 92px 40px}
.compact-order-repairs .order-cost-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 118px}
.compact-order-repairs .cost-block{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.compact-order-repairs .cost-block input,.compact-order-repairs .cost-block select{width:100%;min-width:0;padding:9px 10px}
.compact-order-repairs .repair-total-box{display:flex;min-width:112px;visibility:visible;opacity:1}
.compact-order-repairs .order-repair-top .or-tax,.compact-order-repairs .order-repair-top .or-remove{visibility:visible;opacity:1}
.work-order-details select{font-size:14px;font-weight:700;letter-spacing:.025em;padding-left:11px;padding-right:11px}
.work-order-details option{font-size:14px;letter-spacing:.02em}
@media(max-width:1180px){
 .modal-card.work-order-modal{width:99vw}
 .work-order-workspace{grid-template-columns:minmax(320px,35%) minmax(0,65%)}
 .compact-order-repairs .order-cost-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 108px}
}