:root{--bg: #f8fafc;--text: #1f2937;--card-bg: #ffffff;--border: #e5e7eb;--primary: #111827;--primary-light: #374151;--radius: .5rem;--shadow: 0 1px 4px rgba(0, 0, 0, .08);font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--bg);color:var(--text)}body{margin:0;padding:0}.app{min-height:100vh;display:flex;flex-direction:column}.app-header{background:var(--primary);color:#fff;padding:1rem 1.25rem;position:sticky;top:0;z-index:10}.app-header h1{margin:0;font-size:1.35rem;font-weight:600;display:flex;align-items:center;gap:.5rem}.title-button{background:none;border:none;color:inherit;font:inherit;padding:0;cursor:pointer}.title-button:focus-visible{outline:2px solid #bfdbfe;outline-offset:2px}.header-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.app-main{display:flex;flex-direction:column;gap:1rem;padding:1rem;flex:1}h2{margin-top:0;font-size:1.15rem;font-weight:600}.card{background:var(--card-bg);border-radius:var(--radius);padding:1rem;box-shadow:var(--shadow);border:1px solid var(--border)}label{display:flex;flex-direction:column;gap:.35rem;font-size:.85rem;margin-bottom:.75rem}input,textarea,select{padding:.55rem .65rem;border-radius:var(--radius);border:1px solid var(--border);font-size:.9rem;background:#fff}textarea{resize:vertical}button{margin-top:.5rem;padding:.6rem .9rem;border-radius:var(--radius);border:none;background:var(--primary);color:#fff;font-weight:600;cursor:pointer}button:disabled{opacity:.6;cursor:default}.row{display:flex;gap:.75rem}.row>label{flex:1}.header-menu{position:relative}.menu-toggle{margin-top:0;background:transparent;border:1px solid #ffffff40;color:#fff;padding:.35rem .6rem;border-radius:.4rem;font-size:1.1rem;line-height:1}.menu-panel{position:absolute;right:0;top:calc(100% + .5rem);background:#fff;border:1px solid var(--border);border-radius:.5rem;box-shadow:var(--shadow);min-width:200px;padding:.4rem;z-index:20;display:flex;flex-direction:column;gap:.25rem}.menu-item{margin-top:0;background:transparent;color:var(--primary);border:1px solid transparent;text-align:left;padding:.5rem .6rem;border-radius:.35rem;font-weight:600}.menu-item.is-active{background:#f3f4f6;border-color:var(--border)}.logout-item{color:#b91c1c}.main-panel{flex:1 1 auto;display:flex;flex-direction:column;gap:1rem}.section-tabs{display:flex;gap:.5rem;flex-wrap:wrap;padding:.25rem 0 0}.section-tabs.in-header{margin-top:.5rem}.section-tab{border:1px solid transparent;background:transparent;color:#e5e7eb;padding:.35rem .75rem;border-radius:.35rem;cursor:pointer;font-weight:600;margin-top:0}.section-tab.is-active{background:#fff;color:var(--primary);border-color:#fff}.section-divider{border-top:1px dashed var(--border);margin:.25rem 0;width:100%}.auth-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem}.auth-card{max-width:420px;width:100%}.auth-error{margin-top:.75rem;color:#b91c1c;font-weight:600}.order-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.75rem}.order-list-item{margin:0;padding:0}.order-display{border:1px solid var(--border);border-radius:var(--radius);background:#fff;padding:.9rem 1rem;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:.35rem}.order-display-clickable{outline:none}.order-inline-actions{display:flex;justify-content:flex-end;margin-top:.35rem}.order-inline-actions button{margin-top:0}.order-display-clickable:focus .order-display{box-shadow:0 0 0 2px #bfdbfe;border-color:#93c5fd}.order-display-clickable{cursor:pointer}.order-header{display:flex;align-items:flex-start;justify-content:space-between;gap:.5rem;flex-wrap:wrap}.order-title{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.order-name{font-weight:700;font-size:1rem}.order-badges{display:flex;gap:.35rem;flex-wrap:wrap;align-items:center}.order-chip{display:inline-flex;align-items:center;gap:.25rem;padding:.2rem .55rem;border-radius:.35rem;font-weight:700;font-size:.85rem}.order-product-chip{background:#e0f2fe;color:#075985}.order-paid-chip.is-paid{background:#d1fae5;color:#166534}.order-paid-chip.is-unpaid{background:#ef4444;color:#fff}.order-status-chip{background:#fef3c7;color:#92400e}.order-sync-chip{background:#e0f2fe;color:#075985;font-size:.8rem}.order-sync-chip.is-cached{background:#ede9fe;color:#5b21b6}.order-status-chip.is-delivered{background:#d1fae5;color:#166534}.order-date-chip{background:#f3f4f6;color:#111827;font-weight:600}.order-missing-chip{background:#f59e0b;color:#1f2937;font-weight:700}.order-actions{margin-top:.25rem}.modal-backdrop{position:fixed;inset:0;background:#0f172a59;display:flex;align-items:center;justify-content:center;padding:1.5rem;z-index:50}.modal-card{position:relative;background:#fff;border-radius:var(--radius);box-shadow:0 12px 40px #00000029;max-width:640px;width:100%;padding:1.25rem 1.5rem;border:1px solid var(--border);display:flex;flex-direction:column;gap:1rem}.modal-header,.modal-footer{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.modal-footer-left{display:inline-flex;align-items:center;gap:.4rem}.modal-danger{background:#ef4444;border:1px solid #dc2626;color:#fff;width:40px;height:40px;padding:0;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;margin-top:0}.modal-danger:hover{background:#dc2626}.modal-danger:focus-visible{outline:2px solid #fecdd3;outline-offset:2px}.modal-danger svg{width:22px;height:22px;stroke:currentColor;fill:none}.modal-danger-icon{width:22px;height:22px;stroke:currentColor;fill:none}.modal-header-actions{display:inline-flex;align-items:center;gap:.5rem}.modal-close{background:transparent;border:1px solid #e5e7eb;color:#0f172a;width:32px;height:32px;border-radius:9999px;display:inline-flex;align-items:center;justify-content:center;font-size:1.1rem;cursor:pointer;margin-top:0}.modal-close:hover{background:#f3f4f6}.modal-close:focus-visible{outline:2px solid #bfdbfe;outline-offset:2px}.modal-confirm{position:absolute;inset:0;background:#0f172a73;display:flex;align-items:center;justify-content:center;padding:1rem;border-radius:var(--radius)}.modal-confirm-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:1rem;box-shadow:0 10px 28px #0000002e;max-width:320px;width:100%}.modal-confirm-actions{display:flex;justify-content:flex-end;gap:.5rem;margin-top:.75rem}.danger-button{background:#dc2626;color:#fff}.modal-body{max-height:60vh;overflow:auto}.details-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.75rem 1rem;margin:0}.details-row{background:#f8fafc;border:1px solid var(--border);border-radius:var(--radius);padding:.75rem}.details-row dt{margin:0;font-weight:700;color:var(--primary)}.details-row dd{margin:.15rem 0 0;color:var(--text);font-weight:600}.details-row.is-missing,.details-row.is-missing input,.details-row.is-missing select{background:#f59e0b20;border-color:#f59e0b}.details-row.is-unpaid{background:#fee2e2;border-color:#ef4444}.option-list{display:flex;flex-wrap:wrap;gap:.35rem}.option-chip{margin-top:0;padding:.35rem .7rem;border-radius:9999px;border:1px solid var(--border);background:#f3f4f6;cursor:pointer;font-weight:600;color:var(--primary)}.option-chip.is-selected{border-color:#2563eb;background:#eff6ff;color:#1d4ed8}.toast{position:fixed;top:1rem;right:1rem;background:#f8fafc;color:var(--primary);padding:.75rem 1rem;border-radius:var(--radius);box-shadow:0 12px 30px #00000040;display:flex;align-items:center;gap:.5rem;z-index:60;border-left:4px solid #22c55e;min-width:260px;flex-direction:column;align-items:flex-start}.toast-icon{width:28px;height:28px;border-radius:50%;background:#22c55e;color:#0f172a;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:.95rem}.toast-close{background:transparent;border:none;color:var(--primary);font-size:.9rem;cursor:pointer;padding:.15rem .25rem;margin-left:auto}.toast-progress{position:relative;width:100%;height:4px;background:#e5e7eb;border-radius:9999px;overflow:hidden;margin-top:.35rem}.toast-progress-bar{height:100%;background:#22c55e;transition:width 50ms linear}.version-chip{display:inline-flex;align-items:center;padding:.2rem .45rem;border-radius:.35rem;background:#f3f4f6;color:#111827;font-size:.7rem;font-weight:700}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.75rem 1rem}.new-order-form{position:relative;display:flex;flex-direction:column;gap:.75rem;padding-bottom:1rem}.form-field{background:#f8fafc;border:1px solid var(--border);border-radius:var(--radius);padding:.75rem;display:flex;flex-direction:column;gap:.4rem}.input-with-action{display:flex;align-items:center;gap:.4rem}.form-label{font-weight:700;color:var(--primary)}.form-actions{position:-webkit-sticky;position:sticky;bottom:.5rem;display:flex;justify-content:flex-end;gap:.5rem;padding:.85rem .35rem .5rem;background:linear-gradient(180deg,transparent 0%,#fff 45%,#fff 100%);z-index:3;box-shadow:0 6px 20px #0000000f}.form-actions button[type=submit]{padding:.9rem 1.4rem;font-size:1rem;font-weight:800;background:linear-gradient(135deg,#22c55e,#16a34a);border:none;color:#0f172a;box-shadow:0 10px 25px #16a34a59}.form-actions button[type=submit]:hover:not(:disabled){background:linear-gradient(135deg,#16a34a,#15803d)}.form-actions button[type=submit]:disabled{opacity:.75;cursor:not-allowed}@media(max-width:640px){.new-order-form{padding-bottom:1.25rem}.form-actions{position:-webkit-sticky;position:sticky;bottom:.5rem;padding:.85rem .5rem .65rem;box-shadow:0 6px 20px #0000000f;background:linear-gradient(180deg,transparent 0%,#fff 45%,#fff 100%);margin-top:.25rem}}.input-missing-bg{background:#f59e0b20;border-color:#f59e0b}.ghost-button{background:transparent;border:1px solid var(--border);color:var(--primary);padding:.45rem .7rem;border-radius:var(--radius);cursor:pointer}.pagination{display:flex;justify-content:space-between;align-items:center;gap:.75rem;margin:.75rem 0;padding:.75rem .9rem;border:1px solid var(--border);border-radius:var(--radius);background:#f8fafc}.pagination-actions{display:flex;align-items:center;gap:.5rem}.pagination-actions button{margin-top:0;padding:.45rem .75rem}.pagination-page{font-weight:700;color:var(--primary)}.pagination-meta{font-weight:600;color:var(--primary-light)}.input-missing{border-color:#f59e0b}
