.invoice-workspace{width:100%;min-width:0}
.invoice-workspace>h2{margin-bottom:8px}
.invoice-toolbar{display:flex;align-items:center;gap:12px;
 flex-wrap:wrap;padding:18px;background:#eef5ff;
 border:1px solid #d5e5fa;border-radius:12px;margin:22px 0}
.invoice-toolbar label{font-weight:600;font-size:14px}
.invoice-toolbar select,.invoice-toolbar input{
 padding:9px;border:1px solid #cbd5e1;border-radius:6px;
 background:#fff;color:#172c46}
.invoice-toolbar input{width:80px}
.invoice-toolbar button{margin-left:auto}
.invoice-paper{background:#fff;color:#243247;
 max-width:850px;min-height:1050px;margin:20px auto;
 padding:48px;box-shadow:0 8px 32px rgba(0,0,0,.12);
 border:1px solid #e2e8f0;font-size:14px}
.invoice-paper input,.invoice-paper textarea{
 display:block;width:100%;min-width:0;background:transparent;
 color:#243247;border:1px solid transparent;border-radius:4px;
 padding:7px;font:inherit;resize:vertical}
.invoice-paper input:hover,.invoice-paper textarea:hover,
.invoice-paper input:focus,.invoice-paper textarea:focus{
 border-color:#b7d6fb;background:#f8fbff;outline:none}
.invoice-paper input::placeholder,
.invoice-paper textarea::placeholder{color:#8996a6}
.invoice-header{display:flex;justify-content:space-between;
 align-items:flex-start;gap:35px}
.invoice-brand{flex:1;min-width:0}
.invoice-logo-upload{display:flex;align-items:center;
 justify-content:center;width:185px;min-height:80px;
 border:2px dashed #bed5f1;border-radius:9px;
 color:#3977b8;cursor:pointer;margin-bottom:20px;
 font-size:13px;text-align:center;padding:10px}
.invoice-logo-upload img{max-width:100%;max-height:100px;
 object-fit:contain}
.invoice-company-name{font-size:20px!important;
 font-weight:700!important}
.invoice-heading{width:235px}
.invoice-heading h3{font-size:36px;color:#172c46;
 margin:0 0 24px;letter-spacing:2px}
.invoice-heading label{display:block;font-size:12px;
 font-weight:600;color:#52677e;margin-bottom:10px}
.invoice-heading label input{margin-top:4px}
.invoice-billing{margin:42px 0}
.invoice-billing h4,.invoice-notes h4{
 color:#3789f8;text-transform:uppercase;
 font-size:12px;letter-spacing:1px;margin:0 0 8px}
.invoice-billing>div{max-width:360px}
.invoice-items-header,.invoice-item-row{
 display:grid;grid-template-columns:minmax(0,1fr) 75px 100px 105px;
 gap:10px;align-items:center}
.invoice-items-header{background:#172c46;color:#fff;
 padding:13px 12px;font-weight:600}
.invoice-item-row{position:relative;border-bottom:1px solid #e2e8f0;
 padding:12px}
.invoice-item-row output{text-align:right}
.invoice-remove-item{position:absolute;right:-28px;top:15px;
 background:transparent;border:0;color:#9a4250;
 font-size:22px;cursor:pointer}
.invoice-add-item{margin-top:15px;background:#e9f3ff;
 color:#1766af;border:1px solid #bed9f8;
 border-radius:7px;padding:10px 15px;cursor:pointer}
.invoice-bottom{display:grid;grid-template-columns:1fr 270px;
 gap:45px;margin-top:55px}
.invoice-notes h4:not(:first-child){margin-top:18px}
.invoice-totals>div{display:flex;justify-content:space-between;
 gap:12px;padding:12px 0;border-bottom:1px solid #e2e8f0}
.invoice-grand-total{font-size:20px;color:#172c46;
 font-weight:700;border-top:2px solid #172c46}
.invoice-privacy{margin-top:20px;color:var(--muted,#64748b)}
@media(max-width:700px){
 .invoice-paper{padding:22px;min-height:0}
 .invoice-header{flex-direction:column}
 .invoice-heading{width:100%}
 .invoice-items{overflow-x:auto;padding-right:28px}
 .invoice-items-header,.invoice-item-row{min-width:480px}
 .invoice-bottom{grid-template-columns:1fr;gap:20px}
 .invoice-toolbar button{margin-left:0}
}


/* Invoice Generator — dark-mode contrast correction */

/* Keep the editable invoice visually identical to a white PDF. */
html[data-theme="dark"] .invoice-paper {
  background: #ffffff;
  color: #243247;
  color-scheme: light;
  border-color: #e2e8f0;
}

/* Override global dark-mode heading colours inside the invoice. */
html[data-theme="dark"] .invoice-paper h2,
html[data-theme="dark"] .invoice-paper h3,
html[data-theme="dark"] .invoice-paper .invoice-heading h3 {
  color: #172c46;
}

html[data-theme="dark"] .invoice-paper h4,
html[data-theme="dark"] .invoice-paper .invoice-billing h4,
html[data-theme="dark"] .invoice-paper .invoice-notes h4 {
  color: #3789f8;
}

/* Editable fields must remain dark on white. */
html[data-theme="dark"] .invoice-paper input,
html[data-theme="dark"] .invoice-paper textarea {
  background: transparent;
  color: #243247;
  -webkit-text-fill-color: #243247;
  border-color: transparent;
}

html[data-theme="dark"] .invoice-paper input:focus,
html[data-theme="dark"] .invoice-paper textarea:focus,
html[data-theme="dark"] .invoice-paper input:hover,
html[data-theme="dark"] .invoice-paper textarea:hover {
  background: #f8fbff;
  border-color: #b7d6fb;
}

html[data-theme="dark"] .invoice-paper input::placeholder,
html[data-theme="dark"] .invoice-paper textarea::placeholder {
  color: #8996a6;
  -webkit-text-fill-color: #8996a6;
}

/* Labels, amounts and totals. */
html[data-theme="dark"] .invoice-paper label {
  color: #52677e;
}

html[data-theme="dark"] .invoice-paper output,
html[data-theme="dark"] .invoice-paper .invoice-grand-total {
  color: #172c46;
}

html[data-theme="dark"] .invoice-paper .invoice-items-header {
  background: #172c46;
  color: #ffffff;
}

/* Keep the editor toolbar dark and readable. */
html[data-theme="dark"] .invoice-toolbar {
  background: #192d43;
  border-color: #405b78;
  color: #e7eef7;
}

html[data-theme="dark"] .invoice-toolbar label {
  color: #e7eef7;
}

html[data-theme="dark"] .invoice-toolbar select,
html[data-theme="dark"] .invoice-toolbar input {
  background: #102238;
  border-color: #45617e;
  color: #f1f6fc;
  color-scheme: dark;
}