@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Outfit:wght@400;500;600;700;800&family=Roboto:wght@300;400;500;700&display=swap";body{color:#f8fafc;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#0f172a;margin:0;padding:0;font-family:Inter,sans-serif}#root{flex-direction:column;min-height:100vh;display:flex}:root{--app-bg:#0b0f19;--panel-bg:#131c2e;--panel-border:#1e293b;--control-bg:#1e293b;--control-border:#334155;--control-focus:#3b82f6;--control-text:#f8fafc;--control-label:#94a3b8;--control-hover:#273549;--invoice-bg:#0039a6;--invoice-card-bg:#fff;--invoice-accent:#0047d2;--invoice-text-primary:#111827;--invoice-text-secondary:#4b5563;--invoice-total-bg:#0047d21a;--invoice-approx-bg:#f3f4f6;--invoice-radius:16px;--invoice-font:"Outfit", sans-serif;--invoice-shadow:0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--app-bg);color:var(--control-text);-webkit-font-smoothing:antialiased;font-family:Inter,sans-serif;overflow-x:hidden}.app-container{flex-direction:column;height:100vh;min-height:100vh;display:flex}.topbar{background-color:var(--panel-bg);border-bottom:1px solid var(--panel-border);z-index:100;justify-content:space-between;align-items:center;padding:12px 24px;display:flex}.topbar-logo{color:#f8fafc;align-items:center;gap:10px;font-family:Outfit,sans-serif;font-size:1.25rem;font-weight:700;display:flex}.topbar-logo span{color:#3b82f6}.topbar-actions{flex-wrap:nowrap;align-items:center;gap:10px;display:flex}.dashboard-layout{flex:1;display:flex;overflow:hidden}.sidebar-nav{border-right:1px solid var(--panel-border);background-color:#0b0f19;flex-direction:column;align-items:center;gap:16px;width:72px;min-width:72px;padding:24px 0;display:flex}.sidebar-tab-btn{color:var(--control-label);cursor:pointer;background:0 0;border:none;flex-direction:column;align-items:center;gap:6px;width:100%;padding:12px 0;font-size:.65rem;font-weight:600;transition:all .2s;display:flex;position:relative}.sidebar-tab-btn:hover{color:#f8fafc}.sidebar-tab-btn.active{color:#3b82f6}.sidebar-tab-btn.active:before{content:"";background-color:#3b82f6;border-radius:0 4px 4px 0;width:3px;height:70%;position:absolute;top:15%;left:0}.editor-panel{background-color:var(--panel-bg);border-right:1px solid var(--panel-border);flex-direction:column;width:420px;min-width:420px;height:100%;display:flex;position:relative;overflow-y:auto}.preview-panel{background-color:#080b11;flex:1;justify-content:center;align-items:flex-start;padding:40px 20px;display:flex;overflow-y:auto}.step-indicator{border-bottom:1px solid var(--panel-border);background-color:#0f172a4d;justify-content:space-between;align-items:center;padding:18px 24px;display:flex}.step-node{flex-direction:column;flex:1;align-items:center;gap:4px;display:flex;position:relative}.step-node:not(:last-child):after{content:"";background-color:var(--panel-border);z-index:1;width:calc(100% - 28px);height:2px;transition:background-color .2s;position:absolute;top:10px;left:calc(50% + 14px)}.step-node.completed:not(:last-child):after,.step-node.active:not(:last-child):after{background-color:#2563eb}.step-circle{border:2px solid var(--panel-border);width:22px;height:22px;color:var(--control-label);z-index:2;background-color:#0f172a;border-radius:50%;justify-content:center;align-items:center;font-size:.65rem;font-weight:700;transition:all .2s;display:flex}.step-node.active .step-circle{color:#fff;background-color:#2563eb;border-color:#2563eb;box-shadow:0 0 0 4px #2563eb40}.step-node.completed .step-circle{color:#fff;background-color:#10b981;border-color:#10b981}.step-label{color:var(--control-label);font-size:.65rem;font-weight:600;transition:color .2s}.step-node.active .step-label{color:#3b82f6}.step-node.completed .step-label{color:#10b981}.wizard-form-container{flex-direction:column;flex:1;gap:20px;padding:24px;display:flex}.step-header{margin-bottom:4px}.step-header h2{color:#f8fafc;font-family:Outfit,sans-serif;font-size:1.1rem;font-weight:700}.step-header p{color:var(--control-label);margin-top:2px;font-size:.75rem}.form-group{flex-direction:column;gap:6px;display:flex}.form-group-row{gap:12px;display:flex}.form-group-row .form-group{flex:1}label{color:var(--control-label);font-size:.75rem;font-weight:500}input[type=text],input[type=email],input[type=date],input[type=number],input[type=url],select,textarea{border:1px solid var(--control-border);color:#f8fafc;background-color:#0b0f11;border-radius:6px;outline:none;padding:8px 12px;font-size:.85rem;transition:all .2s}input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{appearance:textfield}input:focus,select:focus,textarea:focus{border-color:var(--control-focus);box-shadow:0 0 0 2px #3b82f626}.editor-card{border:1px solid var(--panel-border);background-color:#1e293b40;border-radius:10px;flex-direction:column;gap:12px;padding:16px;display:flex}.btn{cursor:pointer;border:1px solid #0000;border-radius:6px;justify-content:center;align-items:center;gap:6px;padding:8px 14px;font-size:.8rem;font-weight:500;transition:all .2s;display:flex}.btn-primary{color:#fff;background-color:#2563eb}.btn-primary:hover{background-color:#1d4ed8}.btn-secondary{color:#f1f5f9;background-color:#1e293b;border-color:#334155}.btn-secondary:hover{background-color:#334155}.btn-danger{color:#fff;background-color:#ef4444}.btn-danger:hover{background-color:#dc2626}.btn-icon{color:#f8fafc;background-color:#1e293b;border-color:#334155;width:34px;height:34px;padding:8px}.btn-icon:hover{color:#fff;background-color:#334155;border-color:#475569}.service-items-wrapper{flex-direction:column;gap:8px;display:flex}.service-item-row{border:1px solid var(--panel-border);background-color:#0a0e17;border-radius:8px;flex-direction:column;gap:10px;padding:12px;display:flex;position:relative}.item-row-top{align-items:center;gap:8px;display:flex}.item-desc-input{flex:3}.item-amount-input{width:90px}.item-action-btns{gap:4px;display:flex}.icon-btn{cursor:pointer;color:var(--control-label);background:0 0;border:none;border-radius:4px;padding:6px;transition:all .2s}.icon-btn:hover{background-color:var(--control-hover);color:#f8fafc}.icon-btn.delete:hover{color:#ef4444;background-color:#ef44441a}.advanced-details-box{border-top:1px solid #1e293b;gap:10px;padding-top:8px;animation:.2s slideDown;display:flex}.wizard-nav-buttons{border-top:1px solid var(--panel-border);background-color:#0f172a33;justify-content:space-between;padding:16px 24px;display:flex}.collapsible-sections{border-top:1px solid var(--panel-border);flex-direction:column;display:flex}.accordion-section{border-bottom:1px solid var(--panel-border)}.accordion-header{cursor:pointer;-webkit-user-select:none;user-select:none;background-color:#0f172a1a;justify-content:space-between;align-items:center;padding:16px 24px;transition:background-color .2s;display:flex}.accordion-header:hover{background-color:#0f172a40}.accordion-header h3{color:#e2e8f0;align-items:center;gap:8px;font-size:.85rem;font-weight:600;display:flex}.accordion-content{border-top:1px solid var(--panel-border);background-color:#0c1220;padding:20px 24px}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:2000;background-color:#0b0f19cc;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.modal-card{background-color:var(--panel-bg);border:1px solid var(--panel-border);border-radius:12px;flex-direction:column;gap:16px;width:90%;max-width:420px;padding:24px;animation:.2s cubic-bezier(.16,1,.3,1) scaleIn;display:flex;box-shadow:0 20px 25px -5px #0000004d}.modal-header{justify-content:space-between;align-items:center;display:flex}.modal-header h3{color:#f8fafc;font-family:Outfit,sans-serif;font-size:1.1rem;font-weight:700}.modal-footer{justify-content:flex-end;gap:8px;margin-top:8px;display:flex}.invoice-preview-wrapper{background-color:var(--invoice-bg);width:100%;max-width:480px;height:auto;min-height:853px;font-family:var(--invoice-font);border-radius:var(--invoice-radius);color:var(--invoice-text-primary);box-shadow:var(--invoice-shadow);box-sizing:border-box;--zigzag-color:#080b11;flex-direction:column;gap:16px;padding:24px;display:flex;position:relative;overflow:hidden}.invoice-preview-wrapper.html2canvas-export,.invoice-preview-wrapper.html2canvas-export *{box-shadow:none!important;border-radius:0!important}.invoice-preview-wrapper.receipt-theme{padding-top:36px;padding-bottom:36px;border-radius:0!important}.invoice-preview-wrapper.receipt-theme:before{content:"";background-image:linear-gradient(135deg, var(--zigzag-color) 5px, transparent 0), linear-gradient(-135deg, var(--zigzag-color) 5px, transparent 0);z-index:10;background-repeat:repeat-x;background-size:10px 10px;width:100%;height:10px;position:absolute;top:0;left:0}.invoice-preview-wrapper.receipt-theme:after{content:"";background-image:linear-gradient(45deg, var(--zigzag-color) 5px, transparent 0), linear-gradient(-45deg, var(--zigzag-color) 5px, transparent 0);z-index:10;background-repeat:repeat-x;background-size:10px 10px;width:100%;height:10px;position:absolute;bottom:0;left:0}.invoice-preview-wrapper.html2canvas-export.receipt-theme{--zigzag-color:#fff}.invoice-brand-header{color:#fff;align-items:center;gap:16px;display:flex}.invoice-logo-circle{width:54px;height:54px;color:var(--invoice-accent);background-color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-family:Outfit,sans-serif;font-size:1.45rem;font-weight:800;display:flex;box-shadow:0 4px 6px -1px #0000001a}.invoice-logo-circle img{object-fit:cover;border-radius:50%;width:100%;height:100%}.invoice-brand-text{flex-direction:column;display:flex}.invoice-company-name{letter-spacing:.02em;text-transform:uppercase;font-size:1.25rem;font-weight:700}.invoice-company-slogan{opacity:.85;margin-top:2px;font-size:.75rem;font-weight:400}.invoice-card{background-color:var(--invoice-card-bg);border-radius:var(--invoice-radius);flex-direction:column;gap:16px;padding:20px;display:flex;box-shadow:0 2px 4px #00000005}.invoice-title-row{justify-content:space-between;align-items:flex-start;display:flex}.invoice-main-title{text-transform:uppercase;color:var(--invoice-text-secondary);letter-spacing:.05em;font-size:.75rem;font-weight:600}.invoice-amount-big{color:var(--invoice-text-primary);letter-spacing:-.02em;margin-top:4px;font-size:2.25rem;font-weight:800}.invoice-date-row{color:var(--invoice-text-secondary);margin-top:2px;font-size:.8rem}.invoice-date-row span{color:var(--invoice-accent);font-weight:600}.invoice-doc-icon{width:48px;color:var(--invoice-accent);opacity:.85}.invoice-divider{background-color:#e5e7eb;width:100%;height:1px}.invoice-meta-grid{grid-template-columns:.9fr 1fr 1.6fr;gap:6px;display:grid}.invoice-meta-grid .meta-col:not(:last-child){border-right:1px solid #9ca3af40;padding-right:6px}.meta-col{flex-direction:column;gap:4px;display:flex}.meta-label{color:var(--invoice-text-secondary);text-transform:uppercase;letter-spacing:.02em;font-size:.65rem;font-weight:600}.meta-value{color:var(--invoice-text-primary);font-size:.75rem;font-weight:700;line-height:1.2}.invoice-details-header{color:var(--invoice-text-primary);text-transform:uppercase;letter-spacing:.05em;align-items:center;gap:8px;font-size:.75rem;font-weight:700;display:flex}.details-blue-icon{background-color:var(--invoice-total-bg);width:24px;height:24px;color:var(--invoice-accent);border-radius:6px;justify-content:center;align-items:center;display:flex}.details-divider-blue{background-color:var(--invoice-accent);width:100%;height:2px;margin-top:-8px}.invoice-items-table{border-collapse:collapse;width:100%}.invoice-items-table th{text-align:left;color:var(--invoice-text-secondary);text-transform:uppercase;border-bottom:1px solid #f3f4f6;padding-bottom:8px;font-size:.65rem;font-weight:600}.invoice-items-table th:last-child{text-align:right}.invoice-items-table td{color:var(--invoice-text-primary);border-bottom:1px solid #9ca3af40;padding:10px 0;font-size:.75rem}.invoice-items-table td:last-child{text-align:right;font-weight:600}.item-desc-text{font-weight:500;line-height:1.4}.item-qty-rate{color:var(--invoice-text-secondary);margin-top:2px;font-size:.65rem}.total-due-box{background-color:var(--invoice-total-bg);color:var(--invoice-accent);letter-spacing:.02em;border-radius:8px;justify-content:space-between;align-items:center;padding:10px 14px;font-size:.85rem;font-weight:800;display:flex}.total-due-value{font-size:.95rem}.approx-equivalent-box{background-color:var(--invoice-approx-bg);color:var(--invoice-text-secondary);border-radius:8px;justify-content:space-between;align-items:center;padding:10px 14px;font-size:.75rem;font-weight:600;display:flex}.approx-equivalent-value{color:var(--invoice-text-primary);font-weight:700}.invoice-preview-footer{align-items:center;gap:12px;margin-top:auto;display:flex}.footer-icon-circle{background-color:var(--invoice-accent);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.payment-icon-circle{color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:22px;height:22px;display:flex}.footer-text-block{flex-direction:column;display:flex}.footer-thankyou{color:var(--invoice-text-secondary);font-size:.65rem}.footer-biz-link{color:var(--invoice-accent);font-size:.75rem;font-weight:700;text-decoration:none}.pay-now-bar{background-color:#1e293b;border:1px solid #334155;border-radius:12px;justify-content:space-between;align-items:center;width:100%;max-width:480px;padding:12px 20px;display:flex;position:sticky;bottom:20px;box-shadow:0 10px 15px -3px #0000004d}.pay-now-btn{color:#fff;background-color:#10b981;border-radius:8px;padding:10px 20px;font-weight:700;text-decoration:none;transition:all .2s;box-shadow:0 4px 6px -1px #10b98133}.pay-now-btn:hover{background-color:#059669}.ads-side-panel{flex-direction:column;display:flex}@media (width<=1150px){.ads-side-panel{display:none!important}}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.preset-grid{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.preset-card{border:1px solid var(--control-border);cursor:pointer;text-align:center;background-color:#0b0f11;border-radius:8px;padding:8px;transition:all .2s}.preset-card:hover{border-color:#64748b}.preset-card.active{background-color:#111e38;border-color:#3b82f6}.preset-color-preview{border-radius:4px;height:20px;margin-bottom:6px}.preset-title{font-size:.72rem;font-weight:600}.sticky-footer-actions{border-top:1px solid var(--panel-border);background-color:var(--panel-bg);z-index:10;gap:10px;padding:16px 24px;display:flex;position:sticky;bottom:0}@media (width<=900px){.topbar{flex-direction:column;align-items:flex-start;gap:12px;padding:12px 16px}.topbar-actions{scrollbar-width:none;-ms-overflow-style:none;width:100%;padding-bottom:4px;overflow-x:auto}.topbar-actions::-webkit-scrollbar{display:none}.dashboard-layout{flex-direction:column-reverse;overflow-y:auto}.sidebar-nav{border-right:none;border-bottom:1px solid var(--panel-border);flex-direction:row;justify-content:space-around;gap:0;width:100%;min-width:100%;height:60px;padding:0 16px}.sidebar-tab-btn{flex-direction:row;justify-content:center;gap:8px;width:auto;padding:12px;font-size:.8rem}.sidebar-tab-btn.active:before{border-radius:4px 4px 0 0;width:70%;height:3px;top:auto;bottom:0;left:15%}.editor-panel{border-right:none;width:100%;min-width:100%;height:auto}.preview-panel{flex:none;height:75vh;padding:16px}}
