@import"https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700;900&display=swap";*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}:root{--ink:#16233B;--paper:#FFFFFF;--teal:#0E4D44;--teal-dark:#093A33;--gold:#C89B3C;--accent:#1D3557;--accent-light:#EEF3F9;--sage:#EDF1EA;--rose:#B23A48;--green:#1E7B47;--line:#D8DEE6;--muted:#6B7684}.invoice-app{font-family:Tajawal,sans-serif;color:var(--ink);background:var(--sage);min-height:100vh;-webkit-print-color-adjust:exact;print-color-adjust:exact;color-adjust:exact}.loading-screen{padding:80px 20px;text-align:center;color:#0e4d44;font-weight:700;font-family:Tajawal,sans-serif}.login-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--sage);font-family:Tajawal,sans-serif;padding:20px}.login-card{background:#fff;border-radius:16px;padding:32px 28px;width:100%;max-width:380px;box-shadow:0 10px 40px #16233b1f}.login-brand{display:flex;align-items:center;gap:10px;font-weight:900;font-size:19px;color:var(--teal);margin-bottom:24px;justify-content:center}.login-error{background:#fbeaec;color:var(--rose);padding:10px 12px;border-radius:8px;font-size:13px;margin-bottom:14px;text-align:center}.template-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:6px}.template-option{display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-align:right;border:2px solid var(--line);border-radius:11px;padding:12px;background:#fff;cursor:pointer;font-family:inherit;transition:.15s}.template-option:hover{border-color:var(--gold)}.template-option.active{border-color:var(--teal);background:#f3f8f4}.template-option .tpl-name{font-size:14px;font-weight:800;color:var(--teal-dark)}.template-option .tpl-check{font-size:11.5px;font-weight:700;color:var(--teal)}.tpl-preview{width:100%;height:56px;border-radius:6px;border:1px solid var(--line);overflow:hidden;display:flex;flex-direction:column}.tpl-preview .tp-head{height:16px;display:flex;align-items:center;padding:0 5px;gap:3px}.tpl-preview .tp-dot{width:9px;height:9px;border-radius:2px;background:#b9c3d0}.tpl-preview .tp-bar{height:4px;border-radius:2px;background:#c9d2de;flex:1}.tpl-preview .tp-rows{flex:1;padding:4px 5px;display:flex;flex-direction:column;gap:3px}.tpl-preview .tp-row{height:4px;border-radius:2px;background:#e2e7ed}.tpl-preview.classic .tp-head{background:#eef3f9;border-bottom:2px solid var(--accent)}.tpl-preview.elegant .tp-head{background:#fff;border-bottom:1px solid var(--ink)}.tpl-preview.elegant .tp-rows{gap:5px}.tpl-preview.modern .tp-head{background:var(--accent)}.tpl-preview.modern .tp-dot{background:#f0c36d}.tpl-preview.modern .tp-bar{background:#7c8fac}.tpl-preview.modern .tp-row:nth-child(2n){background:#edf1f7}.tpl-preview.compact .tp-head{background:#eef3f9;height:12px}.tpl-preview.compact .tp-rows{gap:2px}.tpl-preview.compact .tp-row{height:3px}.topbar{display:flex;align-items:center;justify-content:space-between;background:var(--teal);color:#fff;padding:14px 22px;box-shadow:0 2px 0 var(--gold);flex-wrap:wrap;gap:10px}.brand{display:flex;align-items:center;gap:8px;font-weight:900;font-size:17px}.tabs{display:flex;gap:6px;flex-wrap:wrap}.tab{display:flex;align-items:center;gap:6px;background:transparent;border:1px solid rgba(255,255,255,.28);color:#fff;padding:9px 14px;border-radius:8px;font-family:inherit;font-size:13.5px;font-weight:500;cursor:pointer;transition:.15s;min-height:40px}.tab:hover{background:#ffffff1f}.tab.active{background:var(--gold);border-color:var(--gold);color:var(--teal-dark);font-weight:700}.user-menu{display:flex;align-items:center;gap:10px}.user-name{font-size:13px;font-weight:700}.page{padding:22px;max-width:1180px;margin:0 auto}.panel{background:#fff;border-radius:14px;padding:22px;box-shadow:0 1px 3px #16233b14,0 8px 24px #16233b0f}.panel.narrow{max-width:560px}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:12px;flex-wrap:wrap}.panel-head h2{margin:0;font-size:18px;font-weight:900;color:var(--teal-dark)}.head-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.divider-line{height:1px;background:var(--line);margin:24px 0}.field{margin-bottom:16px}.field label{display:block;font-size:13px;font-weight:700;color:var(--teal-dark);margin-bottom:6px}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}input[type=text],input[type=number],input[type=date],input[type=password],.invoice-app input,.login-card input{width:100%;border:1.5px solid #E2DCC9;border-radius:9px;padding:11px 12px;font-family:inherit;font-size:16px;color:var(--ink);background:#fcfbf7;outline:none;transition:.15s}.select-input{width:100%;border:1.5px solid #E2DCC9;border-radius:9px;padding:11px 12px;font-family:inherit;font-size:16px;background:#fcfbf7}.invoice-app input:focus,.login-card input:focus{border-color:var(--gold);box-shadow:0 0 0 3px #c89b3c26}.composer-box{background:var(--accent-light);border:1px solid #D9E3F0;border-radius:12px;padding:14px 14px 16px;margin-bottom:16px}.composer-box .field-row{margin-bottom:10px}.composer-box input{background:#fff!important}.preview-line{display:flex;justify-content:space-between;align-items:center;background:#fff;border-radius:8px;padding:9px 12px;margin-bottom:10px;font-size:13.5px;border:1px dashed #C7D5E8;flex-wrap:wrap;gap:6px}.preview-line b{color:var(--accent);font-size:15px}.btn.compose{background:#fff;color:var(--accent);border:1.5px solid var(--accent)}.btn.compose:hover{background:var(--accent);color:#fff}.btn.compose:disabled{opacity:.6;cursor:default}.compose-hint{text-align:center;margin-top:8px;margin-bottom:0}.note-input{width:100%;border:1.5px solid #E2DCC9;border-radius:9px;padding:11px 12px;font-family:inherit;font-size:16px;color:var(--ink);background:#fcfbf7;outline:none;transition:.15s;resize:vertical;line-height:1.6;direction:rtl;text-align:right}.note-input:focus{border-color:var(--gold);box-shadow:0 0 0 3px #c89b3c26}.char-count{font-size:11.5px;color:#9b937f;font-variant-numeric:tabular-nums}.version-row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13.5px;color:var(--muted);font-weight:700}.version-badge{background:var(--teal);color:#fff;padding:5px 14px;border-radius:20px;font-size:13px;font-weight:900;letter-spacing:.5px}.payment-box{background:var(--sage);border-radius:12px;padding:14px 14px 16px;margin-bottom:18px}.label-row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}.label-row label{margin-bottom:0}.payment-box input{background:#fff!important;margin-bottom:10px}.payment-due-line{display:flex;justify-content:space-between;align-items:center;background:var(--accent);color:#fff;border-radius:8px;padding:11px 14px;font-weight:900;font-size:15px}.payment-due-line.settled{background:var(--green)}.combobox-field,.combobox{position:relative}.combobox input{padding-left:36px;padding-right:36px}.combobox-icon{position:absolute;right:11px;top:50%;transform:translateY(-50%);color:#a79f8c}.clear-btn{position:absolute;left:6px;top:50%;transform:translateY(-50%);background:var(--sage);border:none;border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#6b6555}.suggestions{position:absolute;top:calc(100% + 6px);right:0;left:0;z-index:20;background:#fff;border:1px solid #E2DCC9;border-radius:10px;overflow:hidden;box-shadow:0 10px 26px #16233b26;max-height:230px;overflow-y:auto;-webkit-overflow-scrolling:touch}.suggestion{display:flex;justify-content:space-between;align-items:center;width:100%;padding:12px 14px;background:#fff;border:none;border-bottom:1px solid #F1EEE4;font-family:inherit;font-size:14px;cursor:pointer;text-align:right;min-height:44px}.suggestion:last-child{border-bottom:none}.suggestion:hover{background:var(--sage)}.suggestion.empty{cursor:default;color:#8a8272;justify-content:flex-start;gap:6px}.link-btn{background:none;border:none;color:var(--teal);font-weight:700;cursor:pointer;font-family:inherit;padding:0;text-decoration:underline;font-size:12.5px}.line-items-editor{margin-bottom:16px;display:flex;flex-direction:column;gap:8px}.empty-hint{background:var(--sage);border-radius:9px;padding:14px;font-size:13px;color:#7a7264;text-align:center}.line-item-row{background:var(--sage);border-radius:9px;padding:10px 12px}.li-top{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:8px;flex-wrap:wrap}.li-name{font-size:13.5px;font-weight:700;color:var(--teal-dark)}.li-base-note{font-size:11px;color:#9b937f;flex-shrink:0}.li-controls{display:grid;grid-template-columns:64px 1fr 1fr auto;gap:8px;align-items:center}.li-input{padding:8px 9px!important;font-size:16px!important}.li-sell{font-size:12.5px;text-align:center;color:#5b5648}.li-total{font-weight:800;font-size:13px;text-align:center}.calc-summary{background:var(--sage);border-radius:10px;padding:12px 14px;margin:6px 0 18px}.calc-row{display:flex;justify-content:space-between;padding:5px 0;font-size:14px}.calc-row.total{font-weight:900;font-size:16px;color:var(--teal-dark);border-top:1px dashed var(--line);margin-top:4px;padding-top:9px}.action-row{display:flex;gap:10px;margin-bottom:10px}.action-row .btn{flex:1}.share-btn{margin-bottom:10px}.share-ready{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;background:#e7f1ea;border:1.5px solid var(--green);border-radius:10px;padding:12px 14px;margin-bottom:10px}.share-ready-text{font-size:13.5px;font-weight:800;color:var(--green)}.share-ready-actions{display:flex;gap:8px;align-items:center}@media (max-width:420px){.action-row{flex-direction:column}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;border-radius:9px;padding:12px 18px;font-family:inherit;font-size:14.5px;font-weight:700;cursor:pointer;transition:.15s;white-space:nowrap;min-height:44px}.btn.full{width:100%}.btn.primary{background:var(--teal);color:#fff}.btn.primary:hover{background:var(--teal-dark)}.btn.primary:disabled{opacity:.6;cursor:default}.btn.print{background:var(--accent);color:#fff}.btn.print:hover{background:#16294a}.btn.secondary{background:var(--sage);color:var(--teal-dark)}.btn.secondary:hover{background:#e2ece3}.btn.ghost{background:transparent;color:var(--rose)}.hint{font-size:12px;color:#7a7264;margin-top:10px;line-height:1.6}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;border:1px solid #E2DCC9;background:#fff;color:var(--teal-dark);cursor:pointer;transition:.15s;flex-shrink:0}.icon-btn:hover{background:var(--sage)}.icon-btn.danger{color:var(--rose)}.icon-btn.danger:hover{background:#fbeaec}.topbar .icon-btn{background:#ffffff1f;border-color:#ffffff47;color:#fff}.topbar .icon-btn:hover{background:#ffffff38}.search-box{display:flex;align-items:center;gap:8px;background:var(--sage);border-radius:9px;padding:9px 12px;min-width:200px}.search-box input{border:none;background:transparent;flex:1;font-size:16px;padding:0!important}.search-box input:focus{outline:none;box-shadow:none}.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}.history-table,.products-table{width:100%;border-collapse:collapse;font-size:14px}.history-table th,.products-table th{text-align:right;font-size:12.5px;color:#8a8272;padding:9px 10px;border-bottom:2px solid var(--sage)}.history-table td,.products-table td{padding:10px;border-bottom:1px solid #F1EEE4}.history-table tr:hover td,.products-table tr:hover td{background:#fbfaf6}.row-actions{display:flex;gap:6px}.col-idx{width:36px}.col-num{text-align:left}.mono{font-variant-numeric:tabular-nums}.strong{font-weight:800;color:var(--teal-dark)}.muted-cell{color:#9b937f;font-size:13px}.empty-state{padding:40px 10px;text-align:center;color:#9b937f;font-size:14px;line-height:1.8}.cell-input{border:1.5px solid transparent!important;background:transparent!important;padding:7px 8px!important}.cell-input:hover{border-color:#e2dcc9!important}.cell-input:focus{background:#fff!important}.status-badge{display:inline-block;padding:4px 11px;border-radius:20px;font-size:11.5px;font-weight:700;white-space:nowrap}.status-badge.paid{background:#e3f3e9;color:var(--green)}.status-badge.due{background:#fbeaec;color:var(--rose)}.logo-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.logo-preview{width:64px;height:64px;border-radius:10px;border:1.5px dashed #D8CDB0;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#b3ab98;background:var(--sage)}.logo-preview img{width:100%;height:100%;object-fit:contain}.logo-actions{display:flex;gap:8px;flex-wrap:wrap}.new-employee-box{background:var(--sage);border-radius:12px;padding:16px;margin-bottom:20px}.inline-password-row{display:flex;gap:8px}.inline-password-row input{flex:1}.editor-grid{display:grid;grid-template-columns:400px 1fr;gap:22px;align-items:start}@media (max-width:920px){.editor-grid{grid-template-columns:1fr}}.preview-wrap{overflow-x:auto;padding:6px;-webkit-overflow-scrolling:touch}.pages-stack{display:flex;flex-direction:column;gap:24px;align-items:center}.invoice-page{position:relative;width:210mm;min-height:297mm;flex-shrink:0;background:var(--paper);padding:11mm 11mm 9mm;box-shadow:0 10px 34px #16233b24;border:1px solid #EDEFF2;overflow:visible;display:flex;flex-direction:column}.inv-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.company-block{display:flex;align-items:center;gap:10px}.company-block .logo{width:48px;height:48px;object-fit:contain;border-radius:5px}.company-text{display:flex;flex-direction:column;gap:1px}.company-name{font-weight:900;font-size:18px;color:var(--ink)}.company-detail{font-size:10px;color:var(--muted)}.meta-block{text-align:left}.inv-title{font-weight:900;font-size:19px;color:var(--accent);margin-bottom:5px}.meta-line{display:flex;gap:9px;justify-content:space-between;font-size:11px;color:var(--muted);min-width:150px}.meta-line b{color:var(--ink);font-size:11.5px}.header-rule{height:2px;background:var(--accent);border-radius:2px;margin:9px 0}.customer-row{display:flex;align-items:baseline;gap:8px;margin-bottom:9px;flex-wrap:wrap}.customer-label{font-size:11px;color:var(--muted);font-weight:700}.customer-value{font-size:14.5px;font-weight:800;color:var(--ink);border-bottom:1.5px dotted var(--line);padding-bottom:2px;flex:1}.customer-phone{font-size:13px;font-weight:800;color:var(--ink);border-bottom:1.5px dotted var(--line);padding-bottom:2px;min-width:105px;direction:ltr;text-align:right}.continued-tag{font-size:10.5px;color:var(--accent);font-weight:700}.line-items-table{width:100%;border-collapse:collapse;font-size:11.5px;margin-bottom:9px}.line-items-table thead th{text-align:right;font-size:10.5px;color:#3c4655;font-weight:800;padding:6px;background:var(--accent-light);border-bottom:2px solid var(--accent)}.line-items-table thead th:first-child{border-top-right-radius:6px}.line-items-table thead th:last-child{border-top-left-radius:6px}.line-items-table td{padding:4.5px 6px;border-bottom:1px solid var(--line)}.line-items-table .col-num{text-align:left}.line-items-table .empty-row{text-align:center;color:#9aa3af;padding:14px}.payment-block{border:1.5px solid var(--line);border-radius:8px;padding:9px 13px;margin-bottom:10px}.payment-row{display:flex;justify-content:space-between;padding:3px 0;font-size:11.5px;color:#3c4655}.payment-row.due{font-weight:900;font-size:14.5px;color:#fff;background:var(--accent);border-radius:6px;padding:8px 13px;margin-top:6px}.payment-row.due.settled{background:var(--green)}.note-block{border:1.5px solid #C7CED8;border-right:4px solid var(--accent);border-radius:7px;padding:8px 12px;margin-bottom:10px;background:#fafbfc}.note-label{display:block;font-size:10.5px;font-weight:800;color:var(--accent);margin-bottom:3px}.note-text{margin:0;font-size:11.5px;line-height:1.6;color:#2c3542;white-space:pre-wrap;word-wrap:break-word}.signature-block{margin-top:auto;padding-top:11px;border-top:1px solid #E3E7EC}.receipt-line{font-size:11.5px;color:#3c4655;margin:0 0 8px;font-weight:500;line-height:1.6}.signature-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}.sig-cell{display:flex;flex-direction:column;gap:32px}.sig-label{font-size:11.5px;font-weight:700;color:#3c4655}.sig-fill{border-bottom:1.5px dotted #A9B3C0;height:1px}.page-footer{margin-top:6px;text-align:center;font-size:10px;color:#8a93a0;font-weight:700}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%);background:var(--teal-dark);color:#fff;padding:12px 20px;border-radius:10px;display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700;box-shadow:0 8px 24px #00000040;z-index:50;max-width:92vw;text-align:center}.toast.error{background:var(--rose)}@media print{@page{size:A4;margin:0}body{margin:0}.no-print{display:none!important}.page{padding:0;max-width:none}.editor-grid{display:block}.preview-wrap{overflow:visible;padding:0}.pages-stack{gap:0}.invoice-page{width:210mm;min-height:297mm;margin:0;box-shadow:none;border:none;padding:11mm 11mm 9mm;page-break-after:always;break-after:page}.invoice-page:last-child{page-break-after:auto;break-after:auto}.invoice-app{background:#fff}}