:root{--bg:#f4f6fb;--panel:#fff;--border:#e1e5ee;--text:#1c2333;--text-muted:#6b7280;--primary:#2f5bea;--primary-dark:#1e42bd;--danger:#d6483f;--success:#1c9d63;--radius:10px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-family:Segoe UI,system-ui,-apple-system,Arial,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);color:var(--text);margin:0}input,select,textarea,button{font-family:inherit;font-size:14px}table{border-collapse:collapse;width:100%}a{color:inherit}.no-print{display:initial}@media print{.no-print{display:none!important}}.app-shell{min-height:100vh;display:flex}.sidebar{color:#fff;background:#131a2b;flex-direction:column;flex-shrink:0;gap:24px;width:220px;padding:20px 14px;display:flex}.brand{align-items:center;gap:8px;font-size:18px;font-weight:700;display:flex}.brand-mark{background:var(--primary);color:#fff;border-radius:6px;padding:4px 8px;font-size:13px}.sidebar nav{flex-direction:column;gap:4px;display:flex}.sidebar nav a{color:#c6cbdc;border-radius:8px;padding:9px 12px;font-size:14px;text-decoration:none}.sidebar nav a:hover{color:#fff;background:#202942}.sidebar nav a.active{background:var(--primary);color:#fff}.content{flex:1;max-width:1200px;padding:28px 32px}.page-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;display:flex}.page-header h1{margin:0;font-size:22px}.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:20px;padding:20px}.btn{cursor:pointer;background:var(--primary);color:#fff;border:none;border-radius:8px;padding:9px 16px;font-weight:600}.btn:hover{background:var(--primary-dark)}.btn.secondary{color:var(--text);background:#eef1f8}.btn.secondary:hover{background:#dfe4f0}.btn.danger{color:var(--danger);background:#fdeceb}.btn.danger:hover{background:#f9d8d5}.btn.small{padding:6px 10px;font-size:13px}.field{flex-direction:column;gap:4px;margin-bottom:12px;display:flex}.field label{color:var(--text-muted);font-size:12.5px;font-weight:600}.field input,.field select,.field textarea{border:1px solid var(--border);background:#fbfcfe;border-radius:7px;padding:8px 10px}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--primary);outline:2px solid #c4d1fb}.grid{gap:14px;display:grid}.grid.cols-2{grid-template-columns:1fr 1fr}.grid.cols-3{grid-template-columns:1fr 1fr 1fr}.grid.cols-4{grid-template-columns:repeat(4,1fr)}table.data-table{font-size:14px}table.data-table th{text-align:left;text-transform:uppercase;color:var(--text-muted);letter-spacing:.03em;background:#f0f3fa;padding:10px;font-size:12.5px}table.data-table td{border-bottom:1px solid var(--border);padding:10px}table.data-table tr:hover td{background:#f8faff}.stat-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:20px;display:grid}.stat-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:18px}.stat-card .label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.03em;font-size:12.5px;font-weight:600}.stat-card .value{margin-top:6px;font-size:26px;font-weight:700}.badge{border-radius:20px;padding:3px 10px;font-size:12px;font-weight:600;display:inline-block}.badge.paid{color:var(--success);background:#e4f8ee}.badge.unpaid{color:var(--danger);background:#fdeceb}.badge.draft{color:var(--text-muted);background:#eef1f8}.badge.partial{color:#b8720a;background:#fff4e0}.empty-state{text-align:center;color:var(--text-muted);padding:50px 20px}.toolbar{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.items-table input,.items-table select{border:1px solid var(--border);border-radius:6px;width:100%;padding:6px 8px}.hsn-picker{position:relative}.hsn-picker input{width:100%}.hsn-dropdown{z-index:50;border:1px solid var(--border);background:#fff;border-radius:8px;max-height:260px;margin-top:4px;position:absolute;top:100%;left:0;right:0;overflow-y:auto;box-shadow:0 8px 24px #141e3c1f}.hsn-option{cursor:pointer;border-bottom:1px solid #f0f2f7;padding:8px 10px;font-size:12.5px}.hsn-option:hover{background:#f4f6fb}.hsn-option:last-child{border-bottom:none}.hsn-code{color:var(--primary);font-weight:700;display:block}.hsn-code em{color:var(--text-muted);margin-left:4px;font-size:11px;font-style:normal;font-weight:600}.hsn-desc{color:var(--text-muted);white-space:normal;display:block}.right{text-align:right}.login-page{box-sizing:border-box;background:var(--bg);justify-content:center;align-items:center;min-height:100vh;padding:16px;display:flex}.login-card .field input,.login-card .field select{box-sizing:border-box;width:100%;max-width:100%}.login-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);width:100%;max-width:380px;padding:32px;box-shadow:0 10px 30px #141e3c14}.invoice-sheet{border:1px solid var(--border);border-radius:var(--radius);color:#111;background:#fff;width:900px;min-width:900px;max-width:900px;padding:16px 18px;font-size:11.5px;line-height:1.35}.invoice-sheet h1,.invoice-sheet h2,.invoice-sheet h3{margin:0}.owner-line{color:#555;white-space:nowrap;flex-wrap:nowrap;justify-content:flex-end;gap:12px;margin-bottom:3px;font-size:9.5px;display:flex}.invoice-head{align-items:flex-start;gap:10px;padding-bottom:4px;display:flex}.logo-image{object-fit:contain;flex-shrink:0;max-width:110px;height:44px}.logo-circle{color:#333;background:radial-gradient(circle at 35% 30%,#fdfdfd,#cfd2d8 70%,#9a9ea5);border:2px solid #666;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;font-size:12px;font-weight:800;display:flex}.invoice-gstin-bar{border-top:2px solid #222;border-bottom:2px solid #222;grid-template-columns:1fr auto 1fr;align-items:center;margin-bottom:8px;padding:3px 0;font-size:10.5px;font-weight:700;display:grid}.invoice-tag-center{text-align:center;letter-spacing:.04em;color:#222;font-size:15px;font-weight:800}.invoice-tag-right{text-align:right;font-size:9.5px;font-weight:700}.invoice-head .company-name{font-size:15px;font-weight:800}.invoice-head .muted{color:#555;font-size:10.5px}.invoice-meta{text-align:right;font-size:12.5px}.invoice-tag{color:#fff;letter-spacing:.05em;background:#111;border-radius:4px;margin-bottom:6px;padding:3px 10px;font-size:11px;display:inline-block}.invoice-sheet .box{border:1px solid var(--border);border-radius:6px;padding:5px 8px;font-size:10.5px}.invoice-sheet .box .title{text-transform:uppercase;color:#777;margin-bottom:2px;font-size:9.5px;font-weight:700}.invoice-parties{grid-template-columns:1fr 1fr;align-items:stretch;gap:10px;margin-bottom:8px;display:grid}.invoice-parties .box{border:1px solid var(--border);border-radius:6px;flex-direction:column;height:100%;padding:6px 8px;display:flex}.invoice-parties .box .title{text-transform:uppercase;color:#777;margin-bottom:2px;font-size:9.5px;font-weight:700}.invoice-parties .box strong{color:#555;min-width:60px;font-weight:600;display:inline-block}.invoice-meta-box table{width:100%}.invoice-meta-box td{border:none;padding:1px 4px;font-size:10.5px}.invoice-meta-box td:nth-child(odd){color:#777;white-space:nowrap}.payment-status-row{border-top:1px solid var(--border);align-items:center;gap:8px;margin-top:auto;padding-top:3px;display:flex}.due-amount{color:var(--danger);font-size:10.5px;font-weight:700}.invoice-sheet table.line-items th,.invoice-sheet table.line-items td{border:1px solid var(--border);padding:3px 5px;font-size:10.5px}.invoice-sheet table.line-items th{background:#e7e9f0;font-weight:700}.invoice-sheet table.line-items tbody tr:not(.totals-row){background:#f3f4f8}.invoice-sheet table.line-items .totals-row{background:#e7e9f0;font-weight:700}.invoice-bottom-grid{grid-template-columns:1.3fr 1fr;align-items:start;gap:10px;margin-top:8px;display:grid}.bottom-col-left{flex-direction:column;gap:8px;display:flex}.bottom-col-right{flex-direction:column;display:flex}.words-box .title.center,.invoice-sheet .box .title.center{text-align:center}.tax-summary-table{width:100%}.tax-summary-table td{padding:1px 4px;font-size:10.5px}.tax-summary-table .grand td{border-top:2px solid #222;padding-top:3px;font-size:12px;font-weight:800}.eoe-note{text-align:right;color:#555;margin-top:4px;font-size:9px;font-style:italic}.certify-note{color:#555;margin-top:4px;margin-bottom:170px;font-size:9px}.for-company{margin-top:8px;font-size:10.5px;font-weight:700}.upi-qr{text-align:center;flex-shrink:0}.upi-qr canvas{border:1px solid var(--border);border-radius:6px;width:65px!important;height:65px!important}.upi-qr-label{color:#555;margin-top:2px;font-size:8.5px}.upi-qr-id{font-size:8.5px;font-weight:600}.signatory{text-align:right;margin-top:26px;font-size:10.5px;font-weight:600}.mobile-topbar,.sidebar-backdrop{display:none}@media screen and (width>=1025px){.app-shell{height:100vh;overflow:hidden}.sidebar,.content{height:100vh;overflow-y:auto}}.menu-toggle{cursor:pointer;background:#202942;border:none;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:40px;height:40px;display:flex}.menu-toggle span{background:#fff;border-radius:2px;width:20px;height:2px;display:block}.content{min-width:0}.invoice-fit{overflow:hidden}.invoice-fit-inner{transform-origin:0 0;width:900px}@media screen and (width<=1024px){.app-shell{flex-direction:column}.mobile-topbar{z-index:40;color:#fff;background:#131a2b;align-items:center;gap:12px;padding:10px 14px;display:flex;position:sticky;top:0}.sidebar{z-index:60;width:260px;transition:transform .2s;position:fixed;top:0;bottom:0;left:0;overflow-y:auto;transform:translate(-100%)}.sidebar.open{transform:translate(0);box-shadow:0 0 40px #00000073}.sidebar-backdrop{z-index:50;background:#0a0f1e80;display:block;position:fixed;inset:0}.content{width:100%;max-width:none;padding:18px 16px}.grid.cols-3,.grid.cols-4{grid-template-columns:repeat(2,1fr)}table.data-table:not(.items-table){white-space:nowrap;-webkit-overflow-scrolling:touch;display:block;overflow-x:auto}}@media screen and (width<=900px){table.items-table,table.items-table tbody{width:100%;display:block}table.items-table thead{display:none}table.items-table tr{border:1px solid var(--border);background:#fbfcfe;border-radius:10px;margin-bottom:12px;padding:8px 12px;display:block}table.items-table tr:hover td{background:0 0}table.items-table td{border-bottom:none;grid-template-columns:110px 1fr;align-items:center;gap:8px;padding:6px 0;display:grid}table.items-table td:before{content:attr(data-label);color:var(--text-muted);font-size:12px;font-weight:600}table.items-table td[data-label=""]{text-align:right;display:block}table.items-table td[data-label=""]:before{display:none}}@media screen and (width<=600px){.grid.cols-2,.grid.cols-3,.grid.cols-4{grid-template-columns:1fr}.grid>*{grid-column:1/-1!important}.stat-grid{grid-template-columns:repeat(2,1fr);gap:10px}.stat-card{padding:12px}.stat-card .value{font-size:20px}.panel{padding:14px}.content{padding:14px 12px}.page-header h1{font-size:19px}.field{flex-wrap:wrap}input,select,textarea{font-size:16px}.btn{padding:11px 14px}.btn.small{padding:8px 12px}.toolbar .btn{text-align:center;flex:auto}.login-card{padding:22px}}@media print{.mobile-topbar,.sidebar-backdrop{display:none!important}.invoice-fit{height:auto!important;overflow:visible!important}.invoice-fit-inner{transform:none!important}body{background:#fff}.app-shell{display:block}.content{max-width:none;padding:0}.invoice-sheet{box-shadow:none;border:none;padding:0}}.invoice-header-fulllength{border-bottom:1px solid #ddd;justify-content:space-between;align-items:flex-start;gap:24px;width:100%;padding-bottom:12px;display:flex}.invoice-header-left{flex:70%;min-width:0}.invoice-header-right{text-align:right;flex:none;max-width:30%}.owner-line{flex-direction:column;align-items:flex-start;gap:6px;display:flex}.owner-line>div{white-space:normal;margin:0;display:block}.nav-ico{display:none}@media screen and (width<=768px){.sidebar{width:100vw;padding:16px 14px 24px}.sidebar nav{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.sidebar nav a{text-align:center;background:#1b2440;border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:6px;min-height:84px;padding:10px 6px;font-size:12.5px;line-height:1.2;display:flex}.sidebar nav a .nav-ico{font-size:26px;line-height:1;display:block}.sidebar nav a.active{outline:2px solid var(--primary);background:#1f2a4d}}@media screen and (width<=360px){.sidebar nav{grid-template-columns:repeat(2,1fr)}}textarea{box-sizing:border-box;resize:vertical;border:1px solid var(--border);background:#fbfcfe;border-radius:7px;width:100%;padding:8px 10px}
