.invoice-detail-page { padding-bottom: 48px; }

.invoice-detail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.invoice-detail-head>div:first-child { min-width:0; }

.invoice-back { display:inline-flex; margin-bottom:8px; color:var(--cc-color-brand-600); font-size:10px; font-weight:700; }
.invoice-title-line { display:flex; align-items:center; gap:8px; }
.invoice-title-line h1 { margin:0; font-size:21px; letter-spacing:-.035em; white-space:nowrap; }
.invoice-detail-head p { margin:6px 0 0; color:var(--cc-text-secondary); font-size:10px; }
.invoice-head-actions { position:relative; flex:0 0 auto; display:flex; align-items:center; gap:7px; }
.invoice-head-actions .cc-button { white-space:nowrap; }
.invoice-action-menu { top:calc(100% + 7px); right:0; z-index:20; min-width:205px; }
.invoice-action-menu button { width:100%; display:flex; align-items:center; gap:8px; padding:9px 11px; border:0; background:transparent; text-align:left; cursor:pointer; }

.invoice-warning { display:flex; align-items:center; gap:11px; margin-top:12px; padding:10px 13px; border:1px solid var(--cc-color-warning-border); border-radius:var(--cc-radius-lg); background:var(--cc-color-warning-bg); }
.invoice-warning>.ico { flex:0 0 auto; width:18px; height:18px; color:var(--cc-color-warning); }
.invoice-warning>div { flex:1; }
.invoice-warning b { font-size:10px; }
.invoice-warning p { margin:2px 0 0; color:var(--cc-text-secondary); font-size:9px; }
.invoice-warning>button { border:0; background:transparent; color:var(--cc-text-secondary); font-size:20px; cursor:pointer; }

.invoice-detail-layout { display:grid; grid-template-columns:minmax(0,1.24fr) minmax(360px,.76fr); align-items:start; gap:12px; margin-top:12px; }
.invoice-editor { display:grid; gap:12px; }
.invoice-editor-card { padding:16px; }
.invoice-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:14px; }
.invoice-card-head>div:first-child { display:flex; align-items:flex-start; gap:10px; }
.invoice-card-head h2 { margin:0; font-size:15px; }
.invoice-card-head p { margin:3px 0 0; color:var(--cc-text-secondary); font-size:9px; }
.invoice-step { flex:0 0 auto; width:28px; height:28px; display:grid; place-items:center; border-radius:9px; background:var(--cc-color-brand-50); color:var(--cc-color-brand-600); font-size:9px; font-weight:800; }
.invoice-required { color:var(--cc-text-tertiary); font-size:8px; }

.invoice-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; }
.invoice-form-grid--4 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.invoice-form-full { grid-column:1/-1; }
.invoice-editor .cc-input,.invoice-editor .cc-select { min-height:38px; }
.invoice-editor .cc-textarea { min-height:82px; }
.invoice-toggle-row { display:flex; align-items:center; gap:16px; margin-top:12px; padding:9px 10px; border-radius:var(--cc-radius-md); background:var(--cc-bg-surface-subtle); font-size:9px; }
.invoice-toggle-row label { display:flex; align-items:center; gap:6px; }
.invoice-toggle-row code { color:var(--cc-color-brand-600); font-size:9px; }

.invoice-client-card { grid-column:1/-1; display:grid; grid-template-columns:34px 1fr auto; align-items:center; gap:10px; padding:10px; border:1px solid var(--cc-border-subtle); border-radius:var(--cc-radius-md); background:var(--cc-bg-surface-subtle); }
.invoice-client-avatar { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; background:var(--cc-color-brand-600); color:#fff; font-size:10px; font-weight:800; }
.invoice-client-card>div:nth-child(2) { display:grid; gap:2px; }
.invoice-client-card b { font-size:10px; }
.invoice-client-card span { color:var(--cc-text-secondary); font-size:8px; }
.invoice-client-card button { border:0; background:transparent; color:var(--cc-color-brand-600); font-size:9px; font-weight:700; cursor:pointer; }

.invoice-tax-toggle { display:flex!important; gap:0!important; padding:2px; border:1px solid var(--cc-border-subtle); border-radius:9px; background:var(--cc-bg-surface-subtle); }
.invoice-tax-toggle button { padding:6px 9px; border:0; border-radius:7px; background:transparent; color:var(--cc-text-secondary); font-size:8px; font-weight:700; cursor:pointer; }
.invoice-tax-toggle button.is-active { background:var(--cc-bg-surface); color:var(--cc-color-brand-600); box-shadow:var(--cc-shadow-1); }
.invoice-lines-wrap { overflow-x:auto; border:1px solid var(--cc-border-subtle); border-radius:var(--cc-radius-lg); }
.invoice-lines { width:100%; min-width:760px; border-collapse:collapse; font-size:8px; }
.invoice-lines th { padding:8px; background:var(--cc-bg-surface-subtle); color:var(--cc-text-tertiary); text-align:left; text-transform:uppercase; white-space:nowrap; }
.invoice-lines td { padding:7px; border-top:1px solid var(--cc-border-subtle); vertical-align:top; }
.invoice-lines textarea,.invoice-lines input,.invoice-lines select { width:100%; min-height:32px; padding:6px; border:1px solid var(--cc-border-subtle); border-radius:7px; background:#fff; color:var(--cc-text-primary); font:inherit; }
.invoice-lines textarea { min-width:250px; resize:vertical; }
.invoice-lines td:nth-last-child(2) { padding-top:14px; white-space:nowrap; }
.invoice-line-delete { width:28px; height:28px; border:1px solid var(--cc-color-danger-border); border-radius:8px; background:var(--cc-color-danger-bg); color:var(--cc-color-danger); cursor:pointer; }
.invoice-line-actions { display:flex; gap:7px; margin-top:9px; }
.invoice-totals { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:20px; align-items:end; margin-top:14px; padding-top:14px; border-top:1px solid var(--cc-border-subtle); }
.invoice-deposit { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.invoice-totals dl { margin:0; }
.invoice-totals dl div { display:flex; justify-content:space-between; gap:12px; padding:5px 0; font-size:9px; }
.invoice-totals dt { color:var(--cc-text-secondary); }
.invoice-totals dd { margin:0; font-weight:700; }
.invoice-totals .invoice-total-main { margin-top:3px; padding-top:9px; border-top:1px solid var(--cc-border-subtle); font-size:11px; }
.invoice-totals .invoice-balance { margin-top:5px; padding:9px 10px; border-radius:9px; background:var(--cc-color-brand-50); color:var(--cc-color-brand-700); font-size:12px; }

.invoice-send-grid { display:grid; gap:8px; }
.invoice-send-grid article { display:grid; grid-template-columns:34px minmax(0,1fr) auto auto; align-items:center; gap:9px; padding:9px; border:1px solid var(--cc-border-subtle); border-radius:var(--cc-radius-md); background:var(--cc-bg-surface-subtle); }
.invoice-send-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; background:var(--cc-color-brand-50); color:var(--cc-color-brand-600); }
.invoice-send-grid article>div:nth-child(2) { display:grid; gap:2px; }
.invoice-send-grid b { font-size:9px; }.invoice-send-grid small{color:var(--cc-text-secondary);font-size:8px}
.invoice-send-grid .cc-switch{position:relative;flex:0 0 38px;width:38px;height:22px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;overflow:visible;vertical-align:middle}.invoice-send-grid .cc-switch::after{display:none}.invoice-send-grid .cc-switch input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}.invoice-send-grid .cc-switch span{position:relative;width:38px;height:22px;display:block;border-radius:99px;background:var(--cc-color-neutral-300);transition:background .18s ease}.invoice-send-grid .cc-switch span::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(16,24,40,.22);transition:transform .18s ease}.invoice-send-grid .cc-switch input:checked+span{background:var(--cc-color-brand-500)}.invoice-send-grid .cc-switch input:checked+span::after{transform:translateX(16px)}
.invoice-send-actions { display:flex; justify-content:flex-end; gap:7px; margin-top:12px; }
.invoice-audit-list { display:grid; gap:0; }
.invoice-audit-list article { display:grid; grid-template-columns:12px 1fr; gap:8px; padding:7px 0; }
.invoice-audit-list i { width:8px; height:8px; margin-top:3px; border:2px solid var(--cc-color-brand-200); border-radius:50%; background:var(--cc-color-brand-600); }
.invoice-audit-list b { font-size:9px; }.invoice-audit-list p{margin:2px 0;color:var(--cc-text-secondary);font-size:8px}.invoice-audit-list time{color:var(--cc-text-tertiary);font-size:7px}

.invoice-preview-panel { position:sticky; top:10px; overflow:hidden; border:1px solid var(--cc-border-subtle); border-radius:var(--cc-radius-xl); background:rgba(255,255,255,.82); box-shadow:var(--cc-shadow-2); }
.invoice-preview-toolbar { min-height:56px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; border-bottom:1px solid var(--cc-border-subtle); background:rgba(255,255,255,.92); }
.invoice-preview-toolbar>div:first-child { display:grid; gap:2px; }.invoice-preview-toolbar b{font-size:10px}.invoice-preview-toolbar span{color:var(--cc-text-secondary);font-size:8px}.invoice-preview-toolbar>div:last-child{display:flex;gap:5px}
.invoice-preview-canvas { min-height:640px; padding:16px; overflow:hidden; background:#e8ecf2; }
.invoice-paper { width:100%; max-width:440px; min-height:620px; margin:auto; display:flex; flex-direction:column; padding:27px 28px 22px; background:#fff; color:#111827; box-shadow:0 12px 34px rgba(15,23,42,.12); font-family:Arial,sans-serif; }
.invoice-paper header { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding-bottom:20px; border-bottom:2px solid #155eef; }
.invoice-paper header img { width:112px; height:42px; object-fit:contain; object-position:left center; }
.invoice-paper header>div { display:grid; justify-items:end; gap:3px; }.invoice-paper header span{color:#155eef;font-size:17px;font-weight:800}.invoice-paper header b{font-size:10px}.invoice-paper header small{padding:3px 7px;border-radius:99px;background:#fff4d6;color:#966800;font-size:7px;font-weight:700}
.invoice-paper-parties { display:grid; grid-template-columns:1fr 1fr; gap:30px; padding:20px 0; }
.invoice-paper-parties>div { display:grid; align-content:start; gap:3px; }.invoice-paper-parties b{font-size:8px}.invoice-paper-parties span{font-size:7px;color:#556070}.invoice-paper-parties small{margin-bottom:4px;color:#8290a3;font-size:6px;font-weight:700;letter-spacing:.08em}
.invoice-paper-meta { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; padding:10px; border-radius:6px; background:#f4f7fb; }
.invoice-paper-meta div { display:grid; gap:3px; }.invoice-paper-meta span{font-size:6px;color:#8290a3}.invoice-paper-meta b{font-size:6px}
.invoice-paper-object { display:grid; gap:3px; padding:15px 0 10px; }.invoice-paper-object span{font-size:6px;color:#8290a3;font-weight:700;letter-spacing:.08em}.invoice-paper-object b{font-size:9px}.invoice-paper-object small{font-size:7px;color:#667085}
.invoice-paper table { width:100%; border-collapse:collapse; font-size:7px; }
.invoice-paper th { padding:7px 5px; background:#111827; color:#fff; font-size:5px; text-align:right; text-transform:uppercase; }.invoice-paper th:first-child{text-align:left}
.invoice-paper td { padding:9px 5px; border-bottom:1px solid #e7ebf0; text-align:right; vertical-align:top; }.invoice-paper td:first-child{text-align:left}.invoice-paper td b{display:block;font-size:7px}.invoice-paper td small{display:block;margin-top:3px;color:#667085;font-size:6px}
.invoice-paper-summary { display:grid; grid-template-columns:1fr 190px; gap:18px; padding-top:16px; }
.invoice-paper-note b { font-size:7px; }.invoice-paper-note p{margin:5px 0;color:#667085;font-size:6px;line-height:1.5}.invoice-paper-summary dl{margin:0}.invoice-paper-summary dl div{display:flex;justify-content:space-between;padding:3px 0;font-size:6px}.invoice-paper-summary dd{margin:0;font-weight:700}.invoice-paper-summary .is-total{margin-top:3px;padding-top:7px;border-top:1px solid #cdd5df;font-size:8px}.invoice-paper-summary .is-balance{margin-top:5px;padding:7px;background:#eef4ff;color:#155eef;font-size:8px;font-weight:800}
.invoice-paper-payment { display:grid; gap:3px; margin-top:18px; padding:10px; border-left:3px solid #155eef; background:#f4f7fb; }.invoice-paper-payment b{font-size:7px}.invoice-paper-payment span{font-size:6px;color:#556070}
.invoice-paper footer { margin-top:auto; display:flex; justify-content:space-between; padding-top:12px; border-top:1px solid #dfe4ea; color:#8290a3; font-size:6px; }
.invoice-preview-zoom { display:flex; align-items:center; justify-content:center; gap:8px; min-height:40px; border-top:1px solid var(--cc-border-subtle); }.invoice-preview-zoom button{width:24px;height:24px;border:1px solid var(--cc-border-subtle);border-radius:7px;background:#fff;cursor:pointer}.invoice-preview-zoom span{font-size:8px;font-weight:700}

.invoice-payment-modal { width:min(100%,620px); display:grid; gap:14px; }
.invoice-modal-head { display:flex; justify-content:space-between; gap:12px; }.invoice-modal-head h2{margin:4px 0 0;font-size:18px}.invoice-payment-balance{display:flex;align-items:center;justify-content:space-between;padding:12px;border-radius:var(--cc-radius-lg);background:var(--cc-color-brand-50)}.invoice-payment-balance span{font-size:9px}.invoice-payment-balance strong{color:var(--cc-color-brand-700);font-size:18px}.invoice-modal-actions{display:flex;justify-content:flex-end;gap:8px}