.invoice-template-settings{max-width:1440px;margin:auto;color:var(--ws-ink,#263842)}
.invoice-template-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:8px 0 26px}.invoice-template-heading h2{font-size:28px;letter-spacing:-.6px;margin:8px 0 12px}.invoice-template-heading p,.invoice-template-footer p{color:var(--ws-muted,#687881);font-size:14px;line-height:1.65;margin:0}.invoice-template-active{flex-shrink:0;background:var(--ws-success-bg,#e9f0eb);color:var(--ws-success,#365944);border:1px solid var(--ws-line,#ceded2);border-radius:24px;padding:10px 16px;font-size:12px;font-weight:650}
.invoice-template-modes{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:24px}.invoice-template-modes>button{display:flex;align-items:center;gap:16px;text-align:left;background:var(--ws-surface,#fff);border:1px solid var(--ws-line,#dce1e4);border-radius:12px;padding:19px 22px;color:inherit;cursor:pointer}.invoice-template-modes b,.invoice-template-modes small{display:block}.invoice-template-modes b{font-size:15px;margin-bottom:6px}.invoice-template-modes small{color:var(--ws-muted,#687881);font-size:12px}.invoice-template-modes [aria-pressed=true]{border-color:#b39964;box-shadow:inset 0 0 0 1px #b39964;background:color-mix(in srgb,var(--ws-surface,#fff) 95%,#c7b17f)}.invoice-template-modes .nav-icon{width:27px;height:27px}.invoice-template-modes svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.5}
.invoice-template-feedback:empty{display:none}.invoice-template-feedback{color:#a0403d;line-height:1.5}.invoice-brand-tools{display:flex;align-items:center;justify-content:space-between;gap:24px;border:1px solid var(--ws-line,#dce1e4);background:var(--ws-surface,#fff);border-radius:12px;padding:22px 26px;margin-bottom:28px}.invoice-logo{display:flex;align-items:center;gap:20px}.invoice-logo>img,.invoice-logo-placeholder{width:86px;height:66px;object-fit:contain;border:1px solid #e5e8eb;border-radius:6px;background:white;padding:8px}.invoice-logo-placeholder{display:grid;place-items:center;color:#aeb5ba;font-size:28px}.invoice-logo b{font-size:14px}.invoice-logo p{color:var(--ws-muted,#687881);font-size:12px;margin:6px 0 12px}.invoice-logo-upload{position:relative;cursor:pointer;font-size:12px!important;padding:8px 12px!important}.invoice-logo-upload input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}.invoice-logo-remove{background:none;border:0;color:var(--ws-muted,#687881);font-size:12px;margin-left:14px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}.invoice-color{display:grid!important;grid-template-columns:1fr 44px;align-items:center;gap:8px 14px;font-size:13px!important}.invoice-color input{width:44px!important;height:32px!important;padding:2px!important;min-height:0!important;border:1px solid var(--ws-line,#ccd5d9)!important}.invoice-color small{grid-column:1 / -1;color:var(--ws-muted,#687881);font-size:11px}
.invoice-design-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}.invoice-design-card{border:1px solid var(--ws-line,#dce1e4);border-radius:13px;overflow:hidden;background:var(--ws-surface,#fff);position:relative;transition:border-color .2s,box-shadow .2s}.invoice-design-card.selected{border-color:#b39964;box-shadow:0 0 0 1px #b39964}.invoice-design-image{border:0;width:100%;display:block;position:relative;padding:22px;background:#edf0f1;cursor:zoom-in;aspect-ratio:1 / 1.33;overflow:hidden}.invoice-design-image img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 5px 7px #18253222)}.invoice-image-state{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;font-size:12px;color:#53656e;padding:25px;background:#edf0f1;line-height:1.6}.invoice-image-state[hidden]{display:none}.invoice-image-spinner{width:22px;height:22px;border:2px solid #d0d8dc;border-top-color:#aa935f;border-radius:50%;animation:invoice-preview-spin 1s linear infinite}.invoice-preview-label{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);white-space:nowrap;padding:9px 15px;background:#1c303fe8;color:white;border-radius:18px;font-size:11px;opacity:0;transition:opacity .18s}.invoice-design-image:hover .invoice-preview-label,.invoice-design-image:focus-visible .invoice-preview-label{opacity:1}.invoice-design-caption{padding:19px 22px 22px;display:flex;flex-wrap:wrap;align-items:center;gap:15px}.invoice-design-caption>div{width:100%;min-height:72px}.invoice-design-caption h3{margin:0 0 7px;font-size:20px;font-weight:600;letter-spacing:-.3px}.invoice-design-caption p{font-size:12px;line-height:1.6;color:var(--ws-muted,#687881);margin:0}.invoice-design-radio{display:inline-flex!important;gap:8px!important;align-items:center!important;font-size:12px!important;cursor:pointer}.invoice-design-radio input{width:16px!important;height:16px!important;min-height:0!important;margin:0!important;padding:0!important;accent-color:#9c8453;appearance:auto!important}.invoice-design-current{font-size:10px;letter-spacing:.15px;color:var(--ws-success,#47634e);margin-left:auto}.invoice-template-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:25px 0}.invoice-template-footer .button{flex-shrink:0}.invoice-word-intro{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:10px 0 24px}.invoice-word-intro p{font-size:14px;color:var(--ws-muted,#687881);line-height:1.6}.invoice-word-host .word-templates{padding:0}.invoice-word-host .word-template-grid{margin-top:0}
.invoice-design-dialog{border:1px solid var(--ws-line,#d1d8dd);border-radius:16px;padding:0;width:min(1050px,95vw);max-width:95vw;height:min(1000px,94dvh);max-height:94dvh;background:var(--ws-surface,#fff);color:var(--ws-ink,#263842)}.invoice-design-dialog[open]{display:flex;flex-direction:column}.invoice-design-dialog::backdrop{background:#11212b99;backdrop-filter:blur(4px)}.invoice-design-dialog header{display:flex;align-items:center;justify-content:space-between;padding:18px 25px;flex-shrink:0}.invoice-design-dialog header span{font-size:10px;letter-spacing:1.5px;color:#9c8453}.invoice-design-dialog h2{margin:4px 0 0;font-size:23px}.invoice-design-dialog .preview-close{border:0;background:transparent;color:inherit;font-size:30px;width:40px;height:40px;cursor:pointer}.invoice-design-dialog iframe{width:100%;flex:1;min-height:0;border:0;background:#f0f1f3}.invoice-design-dialog footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 25px;flex-shrink:0}.invoice-design-dialog footer p{max-width:480px;font-size:12px;line-height:1.6;color:var(--ws-muted,#687881);margin:0}.invoice-design-dialog .button{flex-shrink:0}
.invoice-color-controls{flex:0 1 290px;min-width:230px;display:grid;gap:10px}.invoice-color-status{font-size:12px;line-height:1.55;margin:0;color:var(--ws-muted,#687881)}.invoice-color-update{justify-self:start;font-size:12px;padding:10px 15px;min-height:40px;border-color:#b39964!important;background:color-mix(in srgb,var(--ws-surface,#fff) 90%,#c7b17f)!important;color:var(--ws-ink,#263842)!important}.invoice-color-update[hidden]{display:none}.invoice-color-update:disabled{cursor:wait;opacity:.7}
@media(max-width:650px){.invoice-color-controls{width:100%;min-width:0;flex-basis:auto}.invoice-color-update{width:100%;justify-self:stretch}}
@keyframes invoice-preview-spin{to{transform:rotate(360deg)}}
@media(min-width:1650px){.invoice-design-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1100px){.invoice-design-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.invoice-template-heading{align-items:flex-start;flex-direction:column;gap:16px}}
@media(max-width:650px){.invoice-template-modes{grid-template-columns:1fr}.invoice-brand-tools{align-items:flex-start;flex-direction:column;padding:18px}.invoice-logo{gap:12px}.invoice-logo>img,.invoice-logo-placeholder{width:58px}.invoice-template-heading h2{font-size:24px}.invoice-design-grid{grid-template-columns:1fr;gap:22px}.invoice-template-footer,.invoice-design-dialog footer,.invoice-word-intro{align-items:stretch;flex-direction:column}.invoice-template-footer .button{width:100%}.invoice-color{width:100%}.invoice-preview-label{opacity:1}.invoice-design-dialog{height:94dvh}.invoice-design-dialog footer{padding:12px 18px;gap:8px}}
@media(prefers-reduced-motion:reduce){.invoice-image-spinner{animation:none}.invoice-design-card,.invoice-preview-label{transition:none}}
