@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--primary-blue: #01015C;--accent-orange: #FFA200;--background-white: #FFFFFF;--text-gray: #374151;--text-light-gray: #6B7280;--border-gray: #D1D5DB;--background-gray: #F9FAFB;--hover-gray: #F3F4F6;--shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--success-green: #10B981;--error-red: #EF4444}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6;color:var(--text-gray);background-color:var(--background-white);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app-container{min-height:100vh;padding:1rem;background-color:var(--background-white)}@media (min-width: 640px){.app-container{padding:2rem}}.invoice-wrapper{max-width:1200px;margin:0 auto;background-color:var(--background-white);border-radius:12px;box-shadow:var(--shadow-lg);overflow:hidden}.header-section{background-color:var(--primary-blue);color:var(--background-white);padding:2rem}.header-content{display:flex;align-items:center;gap:1.5rem}@media (max-width: 640px){.header-content{flex-direction:column;text-align:center;gap:1rem}}.logo-placeholder{width:64px;height:64px;background-color:var(--accent-orange);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:2rem;font-weight:700;color:var(--background-white);flex-shrink:0;overflow:hidden}.header-text h1{font-size:2.5rem;font-weight:700;margin-bottom:.5rem}@media (max-width: 640px){.header-text h1{font-size:2rem}}.header-text p{font-size:1.125rem;opacity:.9}.main-content{display:grid;grid-template-columns:1fr;gap:2rem;padding:2rem}@media (min-width: 1024px){.main-content{grid-template-columns:1fr 1fr}}.section-title{font-size:1.5rem;font-weight:600;color:var(--text-gray);margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid var(--border-gray)}.form-group{margin-bottom:1rem}.form-group label{display:block;font-size:.875rem;font-weight:500;color:var(--text-gray);margin-bottom:.25rem}.form-input,.form-textarea{width:100%;padding:.75rem 1rem;border:1px solid var(--border-gray);border-radius:6px;font-size:1rem;transition:all .15s ease-in-out;background-color:var(--background-white)}.form-input:focus,.form-textarea:focus{outline:none;border-color:var(--accent-orange);box-shadow:0 0 0 3px #ffa2001a}.form-textarea{resize:vertical;min-height:80px}.form-grid{display:grid;grid-template-columns:1fr;gap:1rem;margin-bottom:2rem}@media (min-width: 768px){.form-grid{grid-template-columns:repeat(2,1fr)}}.logo-upload-container{display:flex;flex-direction:column;gap:1rem}.logo-input{display:none}.logo-upload-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background-color:var(--background-gray);border:2px dashed var(--border-gray);border-radius:6px;color:var(--text-gray);font-size:.875rem;font-weight:500;cursor:pointer;transition:all .15s ease-in-out;text-align:center;justify-content:center;max-width:200px}.logo-upload-btn:hover{background-color:var(--hover-gray);border-color:var(--accent-orange);color:var(--accent-orange)}.logo-preview-container{position:relative;display:inline-block;max-width:150px}.logo-preview{width:100%;max-width:150px;height:auto;max-height:150px;object-fit:contain;border:2px solid var(--border-gray);border-radius:8px;background-color:var(--background-white)}.remove-logo-btn{position:absolute;top:-8px;right:-8px;width:24px;height:24px;background-color:var(--error-red);color:var(--background-white);border:none;border-radius:50%;font-size:.75rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s ease-in-out;box-shadow:0 2px 4px #0000001a}.remove-logo-btn:hover{background-color:#dc2626;transform:scale(1.1)}.logo-help-text{font-size:.75rem;color:var(--text-light-gray);margin-top:.25rem}.no-items-message{text-align:center;color:var(--text-light-gray);padding:2rem;font-style:italic}.items-table-container{overflow-x:auto;margin-bottom:1.5rem;border-radius:8px;box-shadow:var(--shadow)}.items-table{width:100%;border-collapse:collapse;background-color:var(--background-white)}.items-table th{background-color:var(--background-gray);padding:.75rem 1rem;text-align:left;font-size:.75rem;font-weight:500;text-transform:uppercase;color:var(--text-light-gray);letter-spacing:.05em;border-bottom:1px solid var(--border-gray)}.items-table td{padding:1rem;border-bottom:1px solid var(--border-gray);vertical-align:middle}.items-table tbody tr:hover{background-color:var(--hover-gray)}.table-input{width:100%;border:none;background:transparent;padding:.25rem;font-size:.875rem;color:var(--text-gray)}.table-input.small{width:80px}.table-input:focus{outline:1px solid var(--accent-orange);border-radius:3px}.amount-cell{font-weight:500;text-align:right}.remove-btn{background:none;border:none;color:#dc2626;font-size:1.125rem;cursor:pointer;padding:.25rem;border-radius:3px;transition:all .15s ease-in-out}.remove-btn:hover{background-color:#fee2e2;color:#b91c1c}.add-item-form{background-color:var(--background-gray);padding:1.5rem;border-radius:8px;margin-bottom:2rem}.add-item-form h3{font-size:1.125rem;font-weight:500;color:var(--text-gray);margin-bottom:1rem}.add-item-grid{display:grid;grid-template-columns:1fr;gap:1rem;margin-bottom:1rem}@media (min-width: 768px){.add-item-grid{grid-template-columns:2fr 1fr 1fr}}.description-input{grid-column:span 1}@media (min-width: 768px){.description-input{grid-column:span 1}}.add-item-btn{width:100%;background-color:var(--accent-orange);color:var(--background-white);border:none;padding:.75rem 1.5rem;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 6px -1px #0000001a}.add-item-btn:hover{opacity:.9;transform:translateY(-1px);box-shadow:0 6px 8px -1px #00000026}.summary-section{background-color:var(--background-white);padding:1.5rem;border-radius:8px;box-shadow:var(--shadow)}.summary-section h3{font-size:1.25rem;font-weight:600;color:var(--text-gray);margin-bottom:1rem}.summary-row{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0;color:var(--text-gray)}.summary-row label{font-size:.875rem;font-weight:500}.summary-input{width:100px;padding:.25rem .5rem;border:1px solid var(--border-gray);border-radius:4px;text-align:right;font-size:.875rem}.summary-input:focus{outline:none;border-color:var(--accent-orange)}.amount{font-weight:500}.total-row{border-top:1px solid var(--border-gray);padding-top:1rem;margin-top:1rem;font-size:1.5rem;font-weight:700;color:var(--primary-blue)}.total-amount{color:var(--primary-blue)}.footer-section{padding:2rem;background-color:var(--background-gray);border-top:1px solid var(--border-gray);display:flex;justify-content:center}.print-btn{background-color:var(--accent-orange);color:var(--background-white);border:none;padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .3s ease;box-shadow:0 4px 6px -1px #0000001a}.print-btn:hover{opacity:.9;transform:translateY(-1px) scale(1.02);box-shadow:0 8px 12px -1px #00000026}.print-content{display:none}@media print{.app-container{padding:0}.invoice-wrapper{box-shadow:none;border-radius:0}.header-section,.main-content,.footer-section{display:none}.print-content{display:block!important}body,.print-logo img{-webkit-print-color-adjust:exact;print-color-adjust:exact}}.company-info{text-align:right}.company-info h2{font-size:1.5rem;color:var(--primary-blue);margin-bottom:.5rem}@media (max-width: 768px){.app-container{padding:.5rem}.header-section{padding:1.5rem}.main-content{padding:1.5rem;gap:1.5rem}.footer-section{padding:1.5rem}.items-table th,.items-table td{padding:.5rem;font-size:.875rem}.table-input.small{width:60px}.logo-upload-btn{max-width:none;width:100%}.logo-preview-container{max-width:120px}.logo-preview{max-width:120px;max-height:120px}}button:focus,input:focus,textarea:focus{outline:2px solid var(--accent-orange);outline-offset:2px}.form-input,.form-textarea,button{transition:all .15s ease-in-out}.items-table-container::-webkit-scrollbar{height:8px}.items-table-container::-webkit-scrollbar-track{background:var(--background-gray);border-radius:4px}.items-table-container::-webkit-scrollbar-thumb{background:var(--border-gray);border-radius:4px}.items-table-container::-webkit-scrollbar-thumb:hover{background:var(--text-light-gray)}.logo-placeholder img{width:100%;height:100%;object-fit:contain;border-radius:8px}.logo-upload-btn:hover{background-color:#ffa2001a;border-color:var(--accent-orange);color:var(--accent-orange)}.form-group:first-of-type{margin-top:0}.section-title:not(:first-child){margin-top:2rem}
