*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:#f5f7fb;color:#172033}.app{display:flex;min-height:100vh}.sidebar{width:250px;background:linear-gradient(180deg,#082f57,#063565 55%,#052b50);color:#fff;position:fixed;left:0;top:0;bottom:0;padding:18px 12px;overflow-y:auto}.brand{display:flex;align-items:center;gap:10px;padding:10px 8px 22px;border-bottom:1px solid rgba(255,255,255,.12);margin-bottom:10px}.logo-mark{font-size:34px}.brand h2{margin:0;font-size:22px}.brand span{color:#63b3ff;font-weight:700}.nav{width:100%;border:0;background:transparent;color:#eaf3ff;text-align:left;padding:12px;border-radius:8px;margin:3px 0;font-size:15px;cursor:pointer}.nav:hover,.nav.active{background:#0d6efd;color:#fff}.quick{margin-top:24px;padding:12px;border:1px solid rgba(255,255,255,.16);border-radius:10px}.quick h4{margin:0 0 10px}.quick button{display:block;width:100%;margin:8px 0;border:0;border-radius:7px;padding:10px;color:white;background:#0d6efd;cursor:pointer}.quick button:nth-of-type(2){background:#0aa65a}.quick button:nth-of-type(3){background:#6f42c1}.quick button:nth-of-type(4){background:#0f9b8e}main{margin-left:250px;width:calc(100% - 250px)}.topbar{height:68px;background:white;border-bottom:1px solid #e5e8ef;display:flex;align-items:center;justify-content:space-between;padding:0 22px;position:sticky;top:0;z-index:5}.top-left{display:flex;align-items:center;gap:14px}.top-left button{border:0;background:transparent;font-size:22px}.topbar h1{font-size:24px;margin:0}.top-right{display:flex;gap:16px;align-items:center}.admin-badge{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#0d6efd;color:#fff;font-weight:700}.page{display:none;padding:18px}.page.active{display:block}.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.kpi{background:#fff;border:1px solid #e4e8f0;border-radius:12px;padding:18px;box-shadow:0 2px 6px rgba(20,40,80,.05);min-height:115px}.kpi small{display:block;font-size:14px;margin-bottom:12px}.kpi strong{display:block;font-size:27px;margin-bottom:7px}.kpi span{color:#677084;font-size:13px}.blue{border-left:5px solid #0d6efd}.green{border-left:5px solid #18a957}.orange{border-left:5px solid #f39c12}.purple{border-left:5px solid #7a47d8}.softgreen{background:#edf9f2}.softred{background:#fff0f0}.softorange{background:#fff7e8}.softblue{background:#eef5ff}.dashboard-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:18px}.panel{background:#fff;border:1px solid #e3e7ef;border-radius:12px;padding:0;box-shadow:0 2px 6px rgba(20,40,80,.04);overflow:hidden}.panel.span2{grid-column:span 2}.panel-head{padding:14px 16px;border-bottom:1px solid #eceff4;display:flex;justify-content:space-between;align-items:center}.panel-head h3{margin:0;font-size:16px}.panel-head button{border:0;background:transparent;color:#0d6efd;cursor:pointer}.panel canvas{padding:16px;max-height:290px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:12px 13px;border-bottom:1px solid #edf0f4;text-align:left;font-size:13px}th{background:#fafbfd;font-weight:700}tr:hover td{background:#fbfdff}.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.section-head h2{margin:0 0 4px}.section-head p{margin:0;color:#70788a}.primary{background:#0d6efd!important;color:#fff!important;border-color:#0d6efd!important}.form-card{background:#fff;border:1px solid #e3e7ef;border-radius:12px;padding:16px;margin-bottom:16px}.hidden{display:none}.form-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.form-grid input,.form-grid select{width:100%;padding:11px 12px;border:1px solid #d8dee9;border-radius:8px;background:#fff}.form-actions{display:flex;gap:10px;margin-top:14px}.form-actions button,.section-head button{border:1px solid #d6dce6;background:#fff;padding:10px 14px;border-radius:8px;cursor:pointer}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px}.status-ok{color:#159447;font-weight:700}.status-low{color:#d97a00;font-weight:700}.status-out{color:#d93333;font-weight:700}.danger-btn{border:0;background:#fff1f1;color:#d33;padding:6px 8px;border-radius:6px;cursor:pointer}.report-box{padding:20px;line-height:1.9}.print-area{display:none}
@media(max-width:1100px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:repeat(2,1fr)}.form-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.sidebar{transform:translateX(-100%);z-index:20;transition:.2s}.sidebar.open{transform:translateX(0)}main{margin-left:0;width:100%}.kpi-grid,.dashboard-grid,.two-col,.form-grid{grid-template-columns:1fr}.panel.span2{grid-column:span 1}.top-right span{display:none}}
@media print{body{background:#fff}.app{display:none!important}.print-area{display:block!important}.print-sheet{width:210mm;min-height:297mm;margin:0 auto;padding:14mm 13mm 18mm;font-family:Arial,sans-serif;position:relative;color:#111}.print-brand{display:flex;justify-content:space-between;align-items:flex-start;border-top:0}.brand-word h1{font-size:28px;margin:0}.brand-word h2{font-size:20px;color:#1269d5;margin:0}.print-contact{text-align:right;font-size:11px;line-height:1.55;border-left:3px solid #1269d5;padding-left:12px}.doc-title{text-align:center;color:#1269d5;font-size:24px;margin:14px 0}.doc-meta{display:flex;justify-content:space-between;gap:24px;margin:14px 0}.doc-meta p{margin:6px 0}.print-table{width:100%;border-collapse:collapse;margin-top:10px}.print-table th{background:#1269d5;color:#fff}.print-table th,.print-table td{border:1px solid #777;padding:7px;font-size:11px}.summary{width:56%;margin-left:auto;margin-top:14px;border-collapse:collapse}.summary td{border:1px solid #aaa;padding:7px;text-align:right}.amount-words,.terms{margin-top:14px;border:1px solid #ccc}.box-title{background:#1269d5;color:#fff;padding:7px;font-weight:700}.box-body{padding:10px;font-size:11px;line-height:1.5}.signature{display:flex;justify-content:space-between;margin-top:60px}.sig-line{width:180px;border-top:1px solid #222;text-align:center;padding-top:6px;font-size:11px}.print-footer{position:absolute;left:13mm;right:13mm;bottom:14mm;border-bottom:14px solid #1269d5;padding-bottom:8px;font-size:10px;display:flex;justify-content:space-between;gap:15px}.challan-title{font-size:34px;color:#111;text-decoration:underline;text-align:center;margin:22px 0}.challan-meta{font-size:12px;line-height:1.6}.no-blue th{background:white!important;color:#111!important}.bill-title{font-size:28px;color:#111;text-decoration:underline;text-align:center;margin:18px 0}}


@media print{
  /* Bill & Challan are printed on Tecnic Engineering's pre-printed company pad. */
  .print-sheet.letterhead-sheet{
    padding:0 13mm;
    min-height:297mm;
    position:relative;
  }
  .letterhead-top-space{
    height:1.5in;
    min-height:1.5in;
  }
  .letterhead-bottom-space{
    height:1.5in;
    min-height:1.5in;
  }
  .letterhead-sheet .bill-title{
    margin-top:0;
  }
  .letterhead-sheet .challan-title{
    margin-top:0;
  }
  .letterhead-sheet .bill-signature{
    margin-top:55px;
    margin-bottom:12px;
  }
  .challan-letterhead-sheet{
    display:flex;
    flex-direction:column;
  }
  .challan-letterhead-sheet .challan-signature{
    margin-top:auto;
    margin-bottom:1.5in;
    display:flex;
    justify-content:space-between;
  }
  .challan-letterhead-sheet .letterhead-bottom-space{
    display:none;
  }
}

.brand{display:block;padding:10px 8px 18px}
.brand-logo{display:block;width:190px;max-width:100%;height:auto;object-fit:contain}
.terms-editor{grid-column:1/-1;width:100%;padding:11px 12px;border:1px solid #d8dee9;border-radius:8px;background:#fff;font:inherit;resize:vertical;line-height:1.45}

@media print{
  @page{
    size:A4 portrait;
    margin:0;
  }
  html,body{
    width:210mm;
    height:297mm;
    margin:0!important;
    padding:0!important;
    background:#fff!important;
  }
  .print-area{
    width:210mm!important;
    height:297mm!important;
    overflow:hidden!important;
  }
  .print-sheet{
    width:210mm!important;
    height:297mm!important;
    min-height:0!important;
    max-height:297mm!important;
    margin:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    page-break-after:avoid!important;
    break-after:avoid-page!important;
  }
  .print-sheet.quotation-sheet{
    padding:10mm 13mm 13mm!important;
    display:flex;
    flex-direction:column;
    position:relative;
  }
  .quotation-sheet .quote-brand{
    display:block;
    margin:0 0 3mm 0;
  }
  .quotation-sheet .print-logo{
    width:68mm;
    max-height:25mm;
    object-fit:contain;
    object-position:left center;
    display:block;
  }
  .quotation-sheet .doc-title{
    margin:1mm 0 4mm;
    font-size:23px;
  }
  .quotation-sheet .quote-meta{
    margin:2mm 0 4mm;
    font-size:10.5px;
  }
  .quotation-sheet .quote-meta p{
    margin:2px 0;
  }
  .quotation-sheet .quotation-table{
    margin-top:1mm;
  }
  .quotation-sheet .quotation-table th,
  .quotation-sheet .quotation-table td{
    padding:5px 5px;
    font-size:9.5px;
  }
  .quotation-sheet .quotation-summary{
    margin-top:3mm;
    font-size:10px;
  }
  .quotation-sheet .quotation-summary td{
    padding:5px;
  }
  .quotation-sheet .amount-words{
    margin-top:4mm;
  }
  .quotation-sheet .quotation-terms{
    margin-top:4mm;
  }
  .quotation-sheet .box-title{
    padding:5px 7px;
    font-size:10.5px;
  }
  .quotation-sheet .box-body{
    padding:7px;
    font-size:9.5px;
    line-height:1.35;
  }
  .quotation-sheet .quote-signature{
    margin-top:10mm;
    margin-bottom:16mm;
  }
  .quotation-sheet .print-footer{
    position:absolute;
    left:13mm;
    right:13mm;
    bottom:7mm;
    padding-bottom:6px;
    font-size:8.5px;
    line-height:1.25;
  }
}

.item-builder{margin-top:16px;padding:14px;border:1px solid #e3e7ef;border-radius:10px;background:#fbfcff}
.item-builder h4{margin:0 0 10px}
.item-row-controls{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:10px;align-items:center}
.item-row-controls input,.item-row-controls select{width:100%;padding:10px 11px;border:1px solid #d8dee9;border-radius:8px;background:#fff}
.item-row-controls button{border:0;padding:10px 14px;border-radius:8px;cursor:pointer}
.draft-table{margin-top:12px;background:#fff}
.action-btn{border:0;border-radius:6px;padding:6px 9px;margin:2px;cursor:pointer;background:#eef4ff;color:#095bbd}
.action-btn.print{background:#eefaf3;color:#168447}
.action-btn.delete{background:#fff0f0;color:#c93232}
.editing-note{font-size:12px;color:#7a5410;background:#fff6d8;padding:7px 10px;border-radius:7px}
@media(max-width:760px){.item-row-controls{grid-template-columns:1fr}.draft-table{min-width:650px}}
@media print{
  .letterhead-sheet .bill-customer-block{
    margin-bottom:.5in!important;
  }
  .letterhead-sheet .bill-inwords{
    margin-top:4mm;
  }
  .letterhead-sheet .bill-signature{
    margin-top:2in!important;
    margin-bottom:0!important;
  }
}

@media print{
  .aligned-meta{
    display:grid;
    grid-template-columns:155px 10px 1fr;
    column-gap:7px;
    row-gap:4px;
    align-items:start;
    font-size:12px;
    line-height:1.45;
  }
  .aligned-meta .meta-row{
    display:contents;
  }
  .aligned-meta .meta-label{
    font-weight:400;
    white-space:nowrap;
  }
  .aligned-meta .meta-colon{
    text-align:center;
    font-weight:400;
  }
  .aligned-meta .meta-value{
    font-weight:700;
    min-width:0;
    word-break:break-word;
  }
  .challan-meta{
    margin-top:2mm;
    margin-bottom:5mm;
  }
  .bill-reference-block{
    margin-top:0;
    margin-bottom:4mm;
  }
}

.stock-adjust{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:230px;
}
.stock-adjust input{
  width:62px;
  padding:7px 6px;
  border:1px solid #d8dee9;
  border-radius:6px;
  text-align:center;
}
.stock-btn{
  border:0;
  border-radius:6px;
  padding:7px 10px;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
}
.stock-btn.plus{
  background:#eaf8ef;
  color:#138a46;
}
.stock-btn.minus{
  background:#fff0f0;
  color:#c93232;
}

.stock-search-card{
  display:flex;
  gap:10px;
  align-items:center;
  background:#fff;
  border:1px solid #e3e7ef;
  border-radius:12px;
  padding:12px;
  margin-bottom:14px;
  box-shadow:0 2px 6px rgba(20,40,80,.04);
}
.stock-search-card input{
  flex:1;
  padding:11px 12px;
  border:1px solid #d8dee9;
  border-radius:8px;
  font-size:14px;
}
.stock-search-card button{
  border:1px solid #d6dce6;
  background:#fff;
  padding:10px 14px;
  border-radius:8px;
  cursor:pointer;
}
.stock-search-card button:hover{
  background:#f5f7fb;
}

.item-row-controls{grid-template-columns:1.35fr 2fr .8fr 1fr auto}
#challan .item-row-controls{grid-template-columns:1.35fr 2fr .8fr auto}
@media(max-width:1000px){
  .item-row-controls,#challan .item-row-controls{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .item-row-controls,#challan .item-row-controls{grid-template-columns:1fr}
}


/* Version 11: Product image upload / preview */
.product-image-cell{min-width:92px;display:flex;flex-direction:column;align-items:center;gap:6px}
.product-thumb{width:72px;height:72px;object-fit:contain;background:#fff;border:1px solid #dde3ec;border-radius:9px;cursor:zoom-in;display:block}
.product-image-placeholder{width:72px;height:72px;border:1px dashed #9aabc2;border-radius:9px;background:#f8fbff;color:#58708d;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:24px;line-height:1;cursor:pointer}
.product-image-placeholder span{font-size:11px;margin-top:5px;font-weight:700}
.product-image-actions{display:flex;gap:4px;flex-wrap:wrap;justify-content:center}
.image-btn{border:1px solid #cbd6e4;background:#fff;color:#24557d;padding:4px 7px;border-radius:6px;font-size:11px;cursor:pointer;white-space:nowrap}
.image-btn:hover{background:#f0f6ff}.image-btn.remove{color:#c93232;border-color:#f0c5c5}
.image-modal{position:fixed;inset:0;background:rgba(8,18,31,.78);display:none;align-items:center;justify-content:center;padding:24px;z-index:1000}
.image-modal.open{display:flex}.image-modal-card{position:relative;max-width:min(980px,96vw);max-height:92vh;background:#fff;border-radius:14px;padding:14px;box-shadow:0 24px 70px rgba(0,0,0,.35)}
.image-modal-card img{display:block;max-width:calc(96vw - 28px);max-height:calc(86vh - 65px);object-fit:contain;margin:auto}
.image-modal-close{position:absolute;right:10px;top:8px;width:36px;height:36px;border:0;border-radius:50%;background:rgba(20,31,45,.82);color:#fff;font-size:25px;line-height:1;cursor:pointer;z-index:2}
.image-modal-caption{text-align:center;font-size:13px;font-weight:600;margin-top:10px;color:#344056;max-width:850px}
@media(max-width:760px){.product-thumb,.product-image-placeholder{width:62px;height:62px}.image-modal{padding:10px}}
@media print{.image-modal{display:none!important}}

/* Version 12 product-image storage status */
.image-storage-notice{margin:10px 0 14px;padding:10px 12px;border-radius:9px;font-size:12px;font-weight:700;border:1px solid #dbe5f0;background:#f7f9fc;color:#42566f}
.image-storage-notice.local{background:#eef8ff;border-color:#b9ddf6;color:#1e5d87}
.image-storage-notice.server{background:#eefbf4;border-color:#bfe8cf;color:#176a3a}
.image-storage-notice.warning{background:#fff8e8;border-color:#f0d58d;color:#7b5b08}

/* Version 13: Service Invoice module */
/* Version 22: locked Service Invoice editor layout for local + hosting + mobile */
.service-invoice-form-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-template-areas:
    "customer number date reference"
    "invoice invoice ship ship"
    "vat vat . .";
  gap:12px;
  align-items:start;
}
#serviceInvoiceCustomer{grid-area:customer;min-width:0}
#serviceInvoiceNo{grid-area:number;min-width:0}
#serviceInvoiceDate{grid-area:date;min-width:0}
#serviceInvoiceReference{grid-area:reference;min-width:0}
#serviceInvoiceTo{grid-area:invoice;min-width:0}
#serviceShipTo{grid-area:ship;min-width:0}
#serviceInvoiceVat{grid-area:vat;min-width:0;min-height:44px}
.service-address-editor{width:100%;min-height:108px;padding:11px 12px;border:1px solid #d8dee9;border-radius:8px;background:#fff;font:inherit;resize:vertical;line-height:1.45}
.service-item-controls{display:grid;grid-template-columns:minmax(280px,2.4fr) minmax(100px,.65fr) minmax(150px,.9fr) auto;gap:10px;align-items:end}
.service-item-controls textarea,.service-item-controls input{width:100%;min-width:0;padding:10px 11px;border:1px solid #d8dee9;border-radius:8px;background:#fff;font:inherit}
.service-item-controls textarea{min-height:78px;resize:vertical;line-height:1.4}
.service-item-controls button{border:0;padding:10px 14px;border-radius:8px;cursor:pointer;min-height:44px;white-space:nowrap}
.service-description-cell{min-width:280px;white-space:normal;line-height:1.45}
@media(max-width:1000px){
  .service-invoice-form-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-areas:
      "customer number"
      "date reference"
      "invoice ship"
      "vat vat";
  }
  .service-item-controls{grid-template-columns:1fr 1fr}
  .service-item-controls textarea{grid-column:1/-1}
  .service-item-controls button{width:100%}
}
@media(max-width:760px){
  .service-invoice-form-grid{
    grid-template-columns:minmax(0,1fr);
    grid-template-areas:
      "customer"
      "number"
      "date"
      "reference"
      "invoice"
      "ship"
      "vat";
    gap:10px;
  }
  .service-item-controls{grid-template-columns:minmax(0,1fr);gap:10px}
  .service-item-controls textarea,.service-item-controls button{grid-column:auto}
  .service-address-editor{min-height:120px}
  .service-draft-table{min-width:760px}
}

@media print{
  .print-sheet.service-invoice-sheet{
    width:210mm!important;
    height:297mm!important;
    padding:10mm 12mm 10mm!important;
    font-family:Arial,Helvetica,sans-serif!important;
    color:#111!important;
    position:relative;
    overflow:hidden!important;
    background:#fff!important;
  }
  .service-invoice-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:2mm}
  .service-logo-wrap{width:74mm;padding-top:1mm}
  .service-invoice-logo{width:66mm;height:auto;display:block;object-fit:contain;object-position:left top}
  .service-company-details{width:70mm;margin-left:auto;text-align:left;font-size:10.8pt;line-height:1.42;padding-top:1mm;padding-left:3.5mm;box-sizing:border-box}
  .service-company-details b{font-size:13.5pt;letter-spacing:.1px}
  .service-doc-title{text-align:center;font-size:17pt;font-weight:700;margin:3mm 0 2.5mm}
  .service-doc-meta{display:flex;justify-content:space-between;font-size:10.7pt;margin:0 4mm 3.2mm}
  .service-address-grid{display:grid;grid-template-columns:1fr 1fr;border:1px solid #222;min-height:45mm;font-size:10.5pt}
  .service-address-grid>div{padding:3mm 4mm}
  .service-address-grid>div:first-child{border-right:1px solid #222}
  .service-address-grid b{font-size:10.8pt}
  .service-address-text{margin-top:2mm;line-height:1.43;white-space:normal}
  .service-reference{border:1px solid #222;border-top:0;min-height:7mm;padding:1.7mm 3mm;font-size:9.8pt}
  .service-bdt-note{border-left:1px solid #222;border-right:1px solid #222;text-align:right;padding:1mm 3mm .7mm;font-size:9.8pt;font-weight:700}
  .service-print-table{width:100%;border-collapse:collapse;margin:0;table-layout:fixed}
  .service-print-table th,.service-print-table td{border:1px solid #222!important;background:#fff!important;color:#111!important;padding:2.2mm 2.1mm;font-size:9.5pt;vertical-align:top}
  .service-print-table th{text-align:center;font-weight:700}
  .service-print-table th:nth-child(1),.service-print-table td:nth-child(1){width:13mm;text-align:center}
  .service-print-table th:nth-child(2),.service-print-table td:nth-child(2){width:auto}
  .service-print-table th:nth-child(3),.service-print-table td:nth-child(3){width:20mm;text-align:center}
  .service-print-table th:nth-child(4),.service-print-table td:nth-child(4){width:28mm;text-align:right}
  .service-print-table th:nth-child(5),.service-print-table td:nth-child(5){width:29mm;text-align:right}
  .service-print-table tbody tr:not(.service-empty-row):not(.service-empty-merged-row){height:22mm}
  .service-print-table .service-empty-row{height:12mm}
  .service-print-table .service-empty-merged-row{height:12mm}
  .service-print-table .service-last-item-before-blank td{border-bottom-color:transparent!important}
  .service-print-table .service-empty-merged-row td{border-top-color:transparent!important}
  .service-desc{line-height:1.45;white-space:normal}
  .service-total-table{width:100%;border-collapse:collapse;margin:0;font-size:9.7pt}
  .service-total-table td{border:1px solid #222;padding:2mm 2.4mm}
  .service-total-table td:first-child{text-align:right;font-weight:400}
  .service-total-table td:last-child{width:29mm;text-align:right;font-weight:700}
  .service-total-table .service-grand-total td{font-weight:700}
  .service-total-table .service-grand-total td:first-child{text-align:left}
  .service-total-table .service-grand-total span{font-size:8.7pt;line-height:1.3}
  .service-bottom-block{display:grid;grid-template-columns:1fr 67mm;gap:12mm;margin:5.5mm 3mm 0;font-size:9.8pt}
  .service-tax{line-height:2.0}
  .service-sign{text-align:center;line-height:1.35}
  .service-sign-space{height:13mm}
  .service-sign-line{border-top:1px solid #222;padding-top:1.5mm;font-weight:700;width:48mm;margin:0 auto}
  .service-terms-small{position:absolute;left:15mm;bottom:21mm;font-size:7.8pt;line-height:1.8}
  .service-corner{position:absolute;right:0;bottom:0;width:54mm;height:30mm;overflow:hidden}
  .service-corner:before{content:"";position:absolute;right:-9mm;bottom:-11mm;width:62mm;height:25mm;background:#082b4d;transform:skewX(-39deg)}
  .service-corner:after{content:"";position:absolute;right:4mm;bottom:4mm;width:46mm;height:5mm;background:#0874c9;transform:skewX(-39deg)}
  .service-corner span:before{content:"";position:absolute;right:14mm;bottom:9mm;width:38mm;height:4mm;background:#cfe0eb;transform:skewX(-39deg)}
}


/* Version 16: PDF sharing */
.share-pdf-btn{border-color:#9bd8c0!important;background:#effbf5!important;color:#087249!important;font-weight:700}
.share-pdf-btn:hover{background:#e1f7ec!important}
.action-btn.share{background:#edf8ff;color:#096c9f}
.pdf-share-busy{cursor:progress}
.pdf-share-busy button{pointer-events:none}


/* Version 22: mobile/tablet usability hardening */
html{-webkit-text-size-adjust:100%}
button,input,select,textarea{max-width:100%}
.form-actions{flex-wrap:wrap}
.table-wrap{max-width:100%;-webkit-overflow-scrolling:touch}
.panel{max-width:100%}
@media(max-width:760px){
  body{overflow-x:hidden}
  main{min-width:0}
  .topbar{height:60px;padding:0 12px}
  .top-left{gap:10px;min-width:0}
  .top-left button{font-size:24px;padding:6px;cursor:pointer}
  .topbar h1{font-size:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:62vw}
  .admin-badge{width:32px;height:32px;flex:0 0 32px}
  .page{padding:10px}
  .section-head{align-items:flex-start;gap:10px;flex-wrap:wrap}
  .section-head>div{min-width:0;flex:1 1 100%}
  .section-head h2{font-size:22px}
  .section-head p{font-size:13px;line-height:1.45}
  .section-head>button{width:100%;min-height:46px}
  .form-card{padding:12px;border-radius:10px}
  .form-grid{gap:10px}
  .form-grid input,.form-grid select,.form-grid textarea,
  .item-row-controls input,.item-row-controls select,
  .service-item-controls input,.service-item-controls textarea,
  .service-invoice-form-grid input,.service-invoice-form-grid select,.service-invoice-form-grid textarea,
  .stock-search-card input{font-size:16px;min-height:46px}
  textarea{font-size:16px}
  .form-actions{display:grid;grid-template-columns:1fr;gap:9px}
  .form-actions button{width:100%;min-height:48px;font-size:15px}
  .item-builder{padding:11px;margin-top:12px}
  .item-row-controls,#challan .item-row-controls{grid-template-columns:minmax(0,1fr);gap:9px}
  .item-row-controls button,#challan .item-row-controls button{width:100%;min-height:46px}
  .stock-search-card{flex-direction:column;align-items:stretch;padding:10px}
  .stock-search-card button{width:100%;min-height:44px}
  .two-col{gap:10px}
  .panel-head{padding:12px}
  .panel-head h3{font-size:16px}
  .panel{overflow-x:auto}
  .panel table{min-width:620px}
  .kpi-grid,.dashboard-grid{gap:10px}
  .kpi{padding:14px;min-height:100px}
  .kpi strong{font-size:24px}
  .quick{margin-bottom:18px}
  .sidebar{width:min(84vw,290px);box-shadow:8px 0 30px rgba(0,0,0,.2)}
  .brand-logo{width:170px}
  .nav{font-size:16px;min-height:46px}
  .service-item-builder{overflow:hidden}
  #serviceInvoice .table-wrap{overflow-x:auto}
  #serviceInvoice .service-draft-table{min-width:760px}
  #quotation .draft-table,#invoice .draft-table,#challan .draft-table{min-width:700px}
  .product-image-cell{min-width:76px}
}
@media(max-width:420px){
  .page{padding:8px}
  .form-card{padding:10px}
  .topbar h1{font-size:18px;max-width:58vw}
  .section-head h2{font-size:20px}
  .service-address-editor{min-height:110px}
}

/* Optional per-product text shown below Product Name in Bill, Quotation and Challan */
.product-description-inputs{display:flex;flex-direction:column;gap:6px;min-width:0}
.product-description-inputs input,.product-description-inputs textarea{width:100%;box-sizing:border-box}
.product-extra-note-input{padding:9px 11px;border:1px solid #d8dee9;border-radius:8px;background:#fff;font:inherit;line-height:1.35;resize:vertical;min-height:42px}
.item-extra-note{margin-top:3px;font-size:.9em;line-height:1.3;color:#3f4b5d;white-space:normal}
@media(max-width:760px){.product-extra-note-input{font-size:16px;min-height:46px}}
@media print{.item-extra-note{font-size:9px;line-height:1.25;color:#111;margin-top:2px}}


/* v23.9.2: precise Bill/Challan print readability update.
   Only first product tables are enlarged; Bill header/meta and Bill summary font sizes stay unchanged. */
@media print{
  .letterhead-sheet .bill-items-table,
  .letterhead-sheet .challan-items-table{
    table-layout:fixed;
  }

  /* +2px from the existing 11px print-table text, limited to the first product tables only. */
  .letterhead-sheet .bill-items-table th,
  .letterhead-sheet .bill-items-table td,
  .letterhead-sheet .challan-items-table th,
  .letterhead-sheet .challan-items-table td{
    font-size:13px;
  }

  /* The optional line under Product Name is part of Description, so enlarge it by the same two steps. */
  .letterhead-sheet .bill-items-table .item-extra-note,
  .letterhead-sheet .challan-items-table .item-extra-note{
    font-size:11px;
  }

  /* Stable Bill column geometry. The TOTAL column is 17% of the full item table. */
  .letterhead-sheet .bill-items-table th:nth-child(1),
  .letterhead-sheet .bill-items-table td:nth-child(1){width:7%;}
  .letterhead-sheet .bill-items-table th:nth-child(2),
  .letterhead-sheet .bill-items-table td:nth-child(2){width:30%;}
  .letterhead-sheet .bill-items-table th:nth-child(3),
  .letterhead-sheet .bill-items-table td:nth-child(3){width:12%;}
  .letterhead-sheet .bill-items-table th:nth-child(4),
  .letterhead-sheet .bill-items-table td:nth-child(4){width:8%;}
  .letterhead-sheet .bill-items-table th:nth-child(5),
  .letterhead-sheet .bill-items-table td:nth-child(5){width:10%;}
  .letterhead-sheet .bill-items-table th:nth-child(6),
  .letterhead-sheet .bill-items-table td:nth-child(6){width:16%;}
  .letterhead-sheet .bill-items-table th:nth-child(7),
  .letterhead-sheet .bill-items-table td:nth-child(7){width:17%;}

  /* Keep the Bill summary's existing font/padding. Only align its amount divider with TOTAL's left border.
     Summary width remains the original 56%; 17/56 = 30.357142857%. */
  .letterhead-sheet .bill-summary{
    width:56%;
    margin-left:auto;
  }
  .letterhead-sheet .bill-summary td:last-child{
    width:30.357142857%;
  }
}


/* v23.9.3: Bill header details + Challan print refinement. */
@media print{
  /* Bill customer NAME only: +3px. Customer address remains unchanged. */
  .letterhead-sheet .bill-customer-block p b{
    font-size:19px;
    line-height:1.25;
  }

  /* Bill PO / challan reference / delivery date labels and values: +2px from 12px to 14px. */
  .letterhead-sheet .bill-reference-block{
    font-size:14px;
  }

  /* Challan: +2px across the printed document content. */
  .challan-letterhead-sheet .challan-title{
    font-size:36px;
  }
  .challan-letterhead-sheet .challan-meta{
    font-size:14px;
  }
  .challan-letterhead-sheet .challan-items-table th,
  .challan-letterhead-sheet .challan-items-table td{
    font-size:15px;
  }
  .challan-letterhead-sheet .challan-items-table .item-extra-note{
    font-size:13px;
  }
  .challan-letterhead-sheet .challan-signature .sig-line{
    font-size:13px;
  }

  /* Challan column proportions: Description gets the largest useful area. */
  .challan-letterhead-sheet .challan-items-table th:nth-child(1),
  .challan-letterhead-sheet .challan-items-table td:nth-child(1){width:8%;}
  .challan-letterhead-sheet .challan-items-table th:nth-child(2),
  .challan-letterhead-sheet .challan-items-table td:nth-child(2){width:48%;}
  .challan-letterhead-sheet .challan-items-table th:nth-child(3),
  .challan-letterhead-sheet .challan-items-table td:nth-child(3){width:20%;}
  .challan-letterhead-sheet .challan-items-table th:nth-child(4),
  .challan-letterhead-sheet .challan-items-table td:nth-child(4){width:10%;}
  .challan-letterhead-sheet .challan-items-table th:nth-child(5),
  .challan-letterhead-sheet .challan-items-table td:nth-child(5){width:14%;}
}


/* Customer Work Order / PO — additive feature only */
.customer-name-link{background:none!important;border:0!important;padding:0!important;color:#175cd3!important;font:inherit;font-weight:700;cursor:pointer;text-align:left;text-decoration:underline;text-underline-offset:2px}
.customer-work-order-panel{margin-top:18px}
.work-order-panel-head{align-items:flex-start;gap:16px}
.work-order-panel-head p{margin:5px 0 0;color:#667085;max-width:900px}
.work-order-upload-form{display:grid;grid-template-columns:1.1fr .8fr 1.35fr 1.45fr auto;gap:10px;align-items:center;margin:14px 0 18px}
.work-order-upload-form input,.work-order-upload-form button{min-height:44px}
.work-order-table{min-width:1120px}
.work-order-table td{vertical-align:top}
.wo-file-name{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:6px;font-weight:600}
.wo-links{display:grid;gap:6px;min-width:310px}
.wo-linked-row{display:flex;gap:7px;align-items:center;flex-wrap:wrap;padding:6px 8px;border:1px solid #e4e7ec;border-radius:8px;background:#f9fafb}
.wo-linked-row span{color:#667085;font-size:12px}
.wo-no-match{font-size:12px;color:#98a2b3;padding:2px 0}
.muted-text{color:#98a2b3}
@media(max-width:1100px){.work-order-upload-form{grid-template-columns:1fr 1fr}.work-order-upload-form button{grid-column:1/-1}}
@media(max-width:640px){.work-order-upload-form{grid-template-columns:1fr}.work-order-upload-form button{grid-column:auto}.work-order-panel-head{flex-direction:column}}


/* v23.9.6 Supplier Receivable + Portable ERP_DATA */
.portable-data-panel{max-width:980px}.portable-status{padding:13px 15px;border:1px solid #d9e2ef;border-radius:10px;background:#f8fbff;margin-bottom:14px;font-weight:600}.portable-actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}.portable-help{line-height:1.65;background:#f7f9fc;border-radius:10px;padding:16px;border:1px solid #e3e8f0}.portable-summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 0 16px}.portable-summary-card{background:#fff;border:1px solid #e5eaf1;border-radius:12px;padding:16px;box-shadow:0 4px 14px rgba(23,43,77,.05)}.portable-summary-card small{display:block;color:#6c778a;margin-bottom:7px}.portable-summary-card strong{font-size:22px}.supplier-receivable-table{min-width:1050px}@media(max-width:760px){.portable-summary-grid{grid-template-columns:1fr}.portable-actions{display:grid;grid-template-columns:1fr}.portable-actions button{width:100%}}


/* v23.9.11 Supplier Work Order module */
.work-order-label{display:block;font-weight:700;margin:15px 0 7px;color:#263248}
.work-order-item-builder{margin-top:15px}
.work-order-item-controls{display:grid;grid-template-columns:minmax(230px,2fr) minmax(140px,1fr) 105px 110px 140px auto;gap:10px;align-items:end}
.work-order-item-controls input,.work-order-item-controls button{min-width:0}
.work-order-draft-table{min-width:900px}
@media(max-width:1000px){.work-order-item-controls{grid-template-columns:repeat(2,minmax(0,1fr))}.work-order-item-controls input:first-child{grid-column:1/-1}.work-order-item-controls button{width:100%}}
@media(max-width:760px){.work-order-item-controls{grid-template-columns:minmax(0,1fr)}.work-order-item-controls>*{grid-column:auto!important;width:100%;font-size:16px;min-height:46px}.work-order-draft-table{min-width:900px}}
@media print{
 .work-order-sheet .doc-title{margin:7mm 0 5mm}
 .work-order-sheet .work-order-print-meta{margin:4mm 0 5mm}
 .work-order-sheet .work-order-print-table{font-size:10px}
 .work-order-sheet .work-order-summary{margin-top:4mm}
 .work-order-sheet .work-order-terms{margin-top:4mm}
 .work-order-sheet .work-order-signature{margin-top:18mm}
}


/* v23.9.14 Work Order print/PDF readability refinement only */
@media print{
  .print-sheet.quotation-sheet.work-order-sheet{
    padding:10mm 7mm 13mm!important;
  }
  .work-order-sheet .work-order-print-meta{
    margin:3mm 0 4mm!important;
    font-size:12px!important;
    line-height:1.42!important;
  }
  .work-order-sheet .work-order-print-meta p{
    margin:3px 0!important;
  }
  .work-order-sheet .work-order-print-table{
    font-size:12px!important;
  }
  .work-order-sheet .work-order-print-table th,
  .work-order-sheet .work-order-print-table td{
    padding:6px 5px!important;
    font-size:11.5px!important;
  }
  .work-order-sheet .work-order-summary{
    font-size:11.5px!important;
  }
  .work-order-sheet .work-order-summary td{
    padding:6px!important;
    font-size:11.5px!important;
  }
  .work-order-sheet .box-title{
    padding:6px 8px!important;
    font-size:12px!important;
  }
  .work-order-sheet .box-body{
    padding:8px!important;
    font-size:11.5px!important;
    line-height:1.42!important;
  }
  .work-order-sheet .sig-line{
    font-size:12px!important;
  }
  .work-order-sheet .print-footer{
    left:7mm!important;
    right:7mm!important;
    font-size:9.5px!important;
  }
}