:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#213547;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;justify-content:center;background-color:#f9f9f9}#root{width:100%;padding:2rem;box-sizing:border-box}@media print{body{background-color:#fff}#root{padding:0}.no-print{display:none!important}}@page{size:auto;margin:0}.container{max-width:210mm;margin:0 auto;padding:40px;background:#fff;box-shadow:0 0 10px #0000001a;min-height:297mm;position:relative;box-sizing:border-box}@media print{.container{box-shadow:none;margin:0;padding:20px;width:210mm;min-height:297mm;max-width:none}}.header{display:flex;justify-content:space-between;align-items:flex-start;text-align:right;margin-bottom:40px;font-size:.9rem;color:#555}.logo{width:100px;height:100px;object-fit:cover;border-radius:50%;border:4px solid #fff;box-shadow:0 2px 5px #0003}.header p{margin:5px 0}.header div{max-width:100%}.header-url{font-size:.8rem;word-break:break-all;white-space:normal}.title-section{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:20px;border-bottom:4px solid #000;padding-bottom:10px;flex-wrap:wrap}.company-name{font-size:2.5rem;font-weight:700;color:#333;margin:0;line-height:1.2}.invoice-title{font-size:2rem;font-weight:600;color:#333;margin:0;opacity:.7}.bill-to-section{display:flex;justify-content:space-between;margin-top:20px;margin-bottom:40px;gap:20px}.bill-to-col{flex:1;min-width:0}.invoice-details-col{text-align:right;flex:0 0 250px}.invoice-detail-row{display:flex;justify-content:space-between;margin-bottom:5px;align-items:center}.label{font-weight:600;color:#555;white-space:nowrap;margin-right:10px}.items-table{width:100%;border-collapse:collapse;margin-bottom:40px}.items-table th{background-color:#56ccf2;color:#000;padding:10px;text-align:left;font-weight:600}.items-table th:last-child,.items-table td:last-child{text-align:right}.items-table td{padding:10px;border-bottom:1px solid #eee}.items-table input{width:100%;border:none;background:transparent;font-family:inherit;font-size:inherit}.items-table input:focus{outline:1px solid #ddd;background:#fff}.payment-section{margin-top:40px;margin-bottom:40px}.payment-title{font-weight:600;margin-bottom:10px;font-size:1.1rem}.payment-text{margin-bottom:20px;line-height:1.6}.totals-section{display:flex;justify-content:flex-end;margin-top:20px}.totals-table{width:300px;border-collapse:collapse}.totals-table td{padding:8px 10px;text-align:right}.totals-table tr.total-row{background-color:#000;color:#fff;font-weight:700;font-size:1.2rem}.totals-table tr.total-row td{padding:15px 10px}.totals-table tr.total-row td:first-child{white-space:nowrap}.footer-notes{margin-top:40px;font-size:.9rem;color:#555;border-top:1px solid #eee;padding-top:20px}input.editable{border:1px solid transparent;padding:2px 5px;border-radius:4px;transition:all .2s;background:transparent;width:100%;box-sizing:border-box}input.editable:hover,input.editable:focus{border-color:#ddd;background:#fff}textarea.editable{border:1px solid transparent;padding:2px 5px;border-radius:4px;transition:all .2s;background:transparent;width:100%;resize:none;font-family:inherit;box-sizing:border-box}textarea.editable:hover,textarea.editable:focus{border-color:#ddd;background:#fff}@media screen and (max-width:768px){.container{padding:20px;width:100%;height:auto;min-height:auto}.header{flex-direction:column;align-items:flex-start;text-align:left}.logo{margin-bottom:15px;max-width:100px}.title-section{flex-direction:column;align-items:flex-start}.invoice-title{margin-top:10px}.bill-to-section{flex-direction:column;gap:30px}.invoice-details-col{text-align:left;flex:1;width:100%}.invoice-detail-row{justify-content:flex-start;gap:20px}.invoice-detail-row input{text-align:left!important}.items-table{display:block;overflow-x:auto}.totals-section{justify-content:flex-start;width:100%}.totals-table{width:100%}}