@import"https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Sora:wght@500;600;700&display=swap";:root{--font-ui: "Manrope", "Segoe UI", sans-serif;--font-display: "Sora", "Trebuchet MS", sans-serif;--bg-canvas: #f2f4f8;--bg-surface: #ffffff;--bg-surface-soft: #f8fbff;--bg-brand: #072a40;--text-primary: #10232f;--text-secondary: #4f5f69;--text-contrast: #f3fbff;--brand-500: #0c8b8b;--brand-600: #0a7373;--brand-700: #075b5b;--accent-500: #ff9f1c;--danger-500: #de3c4b;--line-soft: #d7e1e8;--line-strong: #b8c8d4;--radius-sm: 10px;--radius-md: 16px;--radius-lg: 24px;--shadow-soft: 0 8px 24px rgba(3, 26, 43, .07);--shadow-elevated: 0 20px 50px rgba(6, 32, 49, .18);--space-1: .4rem;--space-2: .6rem;--space-3: .9rem;--space-4: 1.2rem;--space-5: 1.6rem;--space-6: 2.2rem;font-family:var(--font-ui);line-height:1.45;font-weight:500;color:var(--text-primary);background-color:var(--bg-canvas);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{margin:0;min-width:320px;min-height:100vh}body{background:radial-gradient(circle at 12% 18%,rgba(12,139,139,.13),transparent 42%),radial-gradient(circle at 90% 12%,rgba(255,159,28,.15),transparent 36%),linear-gradient(180deg,#f7fafc,#f2f4f8)}h1,h2,h3,h4,h5,h6{margin:0;font-family:var(--font-display);letter-spacing:-.02em}p{margin:0;color:var(--text-secondary)}a{color:inherit;text-decoration:none}input,select,button,textarea{font:inherit}.auth-page{min-height:100vh;display:grid;place-items:center;padding:1.2rem;position:relative;overflow:hidden}.auth-ambient{position:absolute;width:120vmax;height:120vmax;background:radial-gradient(circle at 30% 30%,rgba(12,139,139,.24),transparent 50%),radial-gradient(circle at 70% 70%,rgba(255,159,28,.2),transparent 48%);animation:ambient-float 12s ease-in-out infinite alternate}.auth-card{width:min(480px,95vw);background:#fffffff5;border:1px solid rgba(255,255,255,.78);box-shadow:var(--shadow-elevated);border-radius:var(--radius-lg);padding:clamp(1.2rem,3.8vw,2.2rem);position:relative;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1}.auth-brand{display:flex;gap:var(--space-3);align-items:center;margin-bottom:var(--space-5)}.auth-brand svg{width:36px;height:36px;color:var(--brand-500)}.auth-brand span{color:var(--text-secondary);font-size:.92rem}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2);margin-bottom:var(--space-4)}.auth-tab{border:1px solid var(--line-soft);background:#fff;padding:var(--space-3);border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;transition:all .2s ease}.auth-tab.active{border-color:var(--brand-500);color:var(--brand-700);background:#0c8b8b14}.auth-form{display:grid;gap:var(--space-3)}.app-shell{height:100vh;display:grid;grid-template-columns:280px minmax(0,1fr);overflow:hidden}.app-sidebar{background:var(--bg-brand);color:var(--text-contrast);padding:var(--space-6) var(--space-4);display:grid;grid-template-rows:auto 1fr auto;gap:var(--space-5);position:sticky;top:0;height:100vh;overflow:hidden}.brand-block{display:flex;gap:var(--space-3);align-items:center}.brand-block svg{width:34px;height:34px}.brand-block h1{font-size:1.18rem;color:var(--text-contrast)}.brand-block span{opacity:.8;font-size:.88rem}.nav-links{display:grid;gap:var(--space-2);align-content:start;overflow-y:auto;min-height:0}.nav-link{display:flex;align-items:center;gap:var(--space-2);color:#f1f9fddb;padding:.72rem .9rem;border-radius:var(--radius-sm);transition:all .2s ease}.nav-link svg{width:18px;height:18px}.nav-link:hover{background:#ffffff21}.nav-link-active{background:#fff3;color:#fff}.app-content{padding:var(--space-5);display:block;overflow-y:auto}.topbar{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1rem;border-radius:var(--radius-md);background:#ffffffc7;border:1px solid var(--line-soft);position:static;margin-bottom:var(--space-4)}.kpi-group{display:flex;gap:.65rem;flex-wrap:wrap}.monthly-kpi{display:flex;align-items:center;gap:.72rem;padding:.48rem .68rem;border-radius:14px;background:linear-gradient(135deg,#0c8b8b24,#ff9f1c24);border:1px solid rgba(12,139,139,.24)}.monthly-kpi p{font-size:.78rem;margin-bottom:.15rem}.monthly-kpi strong{font-size:1rem;color:var(--brand-700)}.daily-kpi{border-color:#ff9f1c54;background:linear-gradient(135deg,#ff9f1c29,#0c8b8b1f)}.monthly-kpi-icon{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:#0c8b8b33;color:var(--brand-700)}.monthly-kpi-icon svg{width:18px;height:18px}.daily-kpi-icon{background:#ff9f1c3d;color:#ad5f00}.topbar-user{color:var(--text-primary)}.content-panel{background:#ffffffa8;border:1px solid rgba(255,255,255,.8);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-soft);animation:panel-enter .45s ease;min-height:calc(100vh - 8.6rem)}.page-wrap{display:grid;gap:var(--space-4)}.page-header h2{font-size:clamp(1.4rem,2vw,2rem)}.page-header p{margin-top:.4rem}.module-grid{display:grid;grid-template-columns:minmax(280px,360px) minmax(0,1fr);gap:var(--space-4)}.card{background:var(--bg-surface);border:1px solid var(--line-soft);border-radius:var(--radius-md);padding:var(--space-4);box-shadow:var(--shadow-soft);min-width:0}.form-card h3,.list-card h3{margin-bottom:var(--space-3)}.grid-form{display:grid;gap:var(--space-3)}.field{display:grid;gap:.42rem}.field span{color:var(--text-secondary);font-size:.88rem}.field input,.field select,.sale-row input,.sale-row select{width:100%;border:1px solid var(--line-strong);background:var(--bg-surface-soft);border-radius:var(--radius-sm);padding:.72rem .78rem;color:var(--text-primary);transition:border-color .2s ease,box-shadow .2s ease}.field input:focus,.field select:focus,.sale-row input:focus,.sale-row select:focus{outline:none;border-color:var(--brand-500);box-shadow:0 0 0 3px #0c8b8b29}.with-icon{position:relative}.with-icon svg{position:absolute;left:.78rem;bottom:.74rem;color:var(--text-secondary)}.with-icon input{padding-left:2.2rem}.actions-row{display:flex;gap:var(--space-2);flex-wrap:wrap;align-items:center}.actions-inline{display:flex;gap:var(--space-2);align-items:center}.btn{border:0;border-radius:var(--radius-sm);padding:.68rem 1rem;background:linear-gradient(135deg,var(--brand-500),var(--brand-700));color:#fff;font-weight:700;cursor:pointer;transition:transform .2s ease,opacity .2s ease}.btn:hover{transform:translateY(-1px)}.btn:disabled{opacity:.7;cursor:not-allowed;transform:none}.btn-ghost{background:transparent;border:1px solid var(--line-strong);color:var(--text-primary)}.btn-danger{background:var(--danger-500);color:#fff}.btn-small{padding:.42rem .66rem;font-size:.82rem}.btn-icon{width:36px;height:36px;padding:0;display:inline-flex;align-items:center;justify-content:center}.btn-icon svg{width:17px;height:17px}.action-icon-btn{width:34px;height:34px;border-radius:999px}.inline-help-tight{display:inline-flex;align-items:center}.inline-help-tight .inline-help-content{width:max-content;max-width:min(240px,72vw)}.inline-help-flip-left .inline-help-content{left:auto;right:0}.logout-btn{width:100%;display:flex;gap:var(--space-2);align-items:center;justify-content:center;color:var(--text-contrast);border-color:#fff3;position:sticky;bottom:0;background:#072a40f2}.list-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-3)}.list-head-actions{display:flex;gap:var(--space-2);align-items:center;flex-wrap:wrap}.column-picker{margin-bottom:var(--space-3);padding:.75rem;border:1px solid var(--line-soft);border-radius:var(--radius-sm);display:flex;flex-wrap:wrap;gap:.65rem 1rem;background:#f8fbff}.column-picker-option{display:inline-flex;align-items:center;gap:.42rem;color:var(--text-primary);font-size:.88rem}.column-picker-option input{accent-color:var(--brand-600)}.pending-search-wrap{margin-bottom:var(--space-3)}.pending-search-input{width:100%;border:1px solid var(--line-strong);background:var(--bg-surface-soft);border-radius:var(--radius-sm);padding:.72rem .78rem;color:var(--text-primary);transition:border-color .2s ease,box-shadow .2s ease}.pending-search-input:focus{outline:none;border-color:var(--brand-500);box-shadow:0 0 0 3px #0c8b8b29}.field-label-inline{display:inline-flex;align-items:center;gap:.45rem}.field-error{color:#b42318;font-size:.78rem}.inline-help{position:relative}.inline-help-trigger{border:0;background:transparent;padding:0;cursor:pointer;color:var(--brand-600);display:inline-flex;align-items:center}.inline-help-trigger svg{width:17px;height:17px}.inline-help-content{position:absolute;top:calc(100% + .45rem);left:0;width:min(280px,75vw);z-index:7;border-radius:var(--radius-sm);border:1px solid var(--line-soft);background:#fff;color:var(--text-secondary);padding:.6rem .72rem;box-shadow:var(--shadow-soft);font-size:.8rem;line-height:1.4;opacity:0;visibility:hidden;transform:translateY(4px);transition:opacity .18s ease,transform .18s ease,visibility .18s ease}.inline-help.open .inline-help-content{opacity:1;visibility:visible;transform:translateY(0)}.inline-help-top .inline-help-content{top:auto;bottom:calc(100% + .45rem)}@media(hover:hover)and (pointer:fine){.inline-help:hover .inline-help-content{opacity:1;visibility:visible;transform:translateY(0)}}@media(hover:none)and (pointer:coarse){.inline-help-trigger{padding:.08rem}}.autocomplete-wrap{position:relative}.autocomplete-menu{position:absolute;top:calc(100% + .4rem);left:0;right:0;z-index:8;border:1px solid var(--line-soft);border-radius:var(--radius-sm);background:#fff;max-height:220px;overflow-y:auto;box-shadow:var(--shadow-soft);display:grid;gap:.2rem;padding:.28rem}.autocomplete-option{width:100%;border:0;border-radius:8px;background:transparent;text-align:left;padding:.55rem .62rem;display:grid;gap:.12rem;cursor:pointer}.autocomplete-option strong{color:var(--text-primary);font-size:.88rem}.autocomplete-option span{color:var(--text-secondary);font-size:.76rem}.autocomplete-option:hover{background:#0c8b8b14}.autocomplete-empty{margin:0;color:var(--text-secondary);padding:.75rem;font-size:.84rem}.table-wrap{overflow-x:auto;border:1px solid var(--line-soft);border-radius:var(--radius-sm);position:relative}.pending-table-wrap{width:100%;max-width:100%;min-width:0;overflow-x:auto;overflow-y:hidden}.pending-table-wrap table{width:max-content;min-width:100%}.pending-table-wrap th,.pending-table-wrap td{max-width:220px;overflow-wrap:anywhere}.mobile-record-list{display:none}.mobile-record-card{border:1px solid var(--line-soft);border-radius:var(--radius-sm);background:#fbfdff;padding:.85rem;display:grid;gap:.7rem}.mobile-record-rows{display:grid;gap:.55rem}.mobile-record-row{display:grid;gap:.2rem}.mobile-record-row span{color:var(--text-secondary);font-size:.78rem}.mobile-record-row strong{color:var(--text-primary);font-size:.92rem;word-break:break-word}.mobile-actions-inline{justify-content:flex-start}.mobile-actions-inline svg{width:18px;height:18px;color:var(--brand-700)}.mobile-empty{padding:.85rem;border:1px dashed var(--line-strong);border-radius:var(--radius-sm);color:var(--text-secondary);background:#f8fbff}.pagination-wrap{margin-top:var(--space-3);padding-top:var(--space-3);border-top:1px solid var(--line-soft);display:flex;align-items:center;justify-content:space-between;gap:.8rem;flex-wrap:wrap}.pagination-summary{margin:0;color:var(--text-secondary);font-size:.84rem}.pagination-actions{display:inline-flex;align-items:center;gap:.45rem;flex-wrap:wrap}.pagination-page-size{display:inline-flex;align-items:center;gap:.35rem;color:var(--text-secondary);font-size:.84rem}.pagination-page-size select{border:1px solid var(--line-strong);background:#fff;border-radius:var(--radius-sm);color:var(--text-primary);padding:.35rem .5rem}.status-pill{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:.22rem .56rem;font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.02em}.status-pill-pending{background:#ffe8c2;border:1px solid #ffca7b;color:#8a4b00}table{width:100%;border-collapse:collapse;min-width:640px}th,td{text-align:left;border-bottom:1px solid var(--line-soft);padding:.76rem;vertical-align:top}th{background:#f4f9fd;color:var(--text-secondary);font-size:.83rem;text-transform:uppercase;letter-spacing:.03em}.sticky-actions-header,.sticky-actions-cell{position:sticky;right:0;box-shadow:-8px 0 12px -12px #072a4073}.sticky-actions-header{background:#f4f9fd;z-index:5;min-width:116px}.sticky-actions-cell{background:#fff;z-index:6;min-width:116px}.sticky-actions-cell .inline-help,.sticky-actions-cell .inline-help-content{z-index:8}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--space-3)}.stat-card{display:grid;gap:.62rem;align-content:center;min-height:124px;background:linear-gradient(140deg,#0c8b8b14,#ff9f1c1a),#fff}.stat-card span{color:var(--text-secondary);font-size:.9rem}.stat-card strong{font-size:1.08rem}.sale-items{display:grid;gap:var(--space-2);max-height:420px;overflow-y:auto;padding-right:.2rem}.sale-row{display:grid;grid-template-columns:2fr .7fr .9fr auto;gap:var(--space-2);align-items:center}.sale-row-card{grid-template-columns:minmax(0,1fr);border:1px solid var(--line-soft);border-radius:var(--radius-sm);padding:.8rem;background:#fbfdff;overflow:hidden;gap:.6rem;min-height:172px}.sale-item-title{display:grid;gap:.15rem;min-width:0}.sale-item-title strong{font-size:.9rem;overflow-wrap:anywhere}.sale-item-title span{color:var(--text-secondary);font-size:.76rem}.sale-row-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.55rem}.sale-inline-field{display:grid;gap:.3rem}.sale-inline-field span{font-size:.78rem;color:var(--text-secondary)}.sale-inline-field input{min-height:44px}.sale-row-foot{display:flex;align-items:center;justify-content:space-between;gap:.55rem;flex-wrap:wrap}.sale-row-subtotal{margin:0;font-size:.88rem;color:var(--brand-700);font-weight:700}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:35;background:#06192673;display:grid;place-items:center;padding:1rem}.modal-card{width:min(680px,100%);max-height:min(78vh,720px);overflow:hidden;border-radius:var(--radius-md);border:1px solid rgba(255,255,255,.55);background:#fff;box-shadow:var(--shadow-elevated);padding:1rem;display:grid;gap:.8rem}.modal-head{display:flex;justify-content:space-between;align-items:center;gap:.6rem}.picker-search{margin:0}.picker-input-wrap{position:relative}.picker-input-wrap svg{position:absolute;left:.66rem;top:50%;transform:translateY(-50%);color:var(--text-secondary)}.picker-input-wrap input{padding-left:2rem}.picker-list{border:1px solid var(--line-soft);border-radius:var(--radius-sm);background:#f8fbff;max-height:min(54vh,420px);overflow-y:auto;padding:.3rem;display:grid;gap:.2rem}.picker-option{background:#fff;border:1px solid transparent}.picker-option:hover{border-color:#0c8b8b33}.picker-option-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.picker-option-copy{min-width:0}.picker-actions{display:inline-flex;align-items:center;gap:.45rem}.qty-toggle-btn,.qty-step-btn{border:1px solid var(--line-strong);background:#fff;color:var(--text-primary);width:30px;height:30px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.qty-toggle-btn:hover,.qty-step-btn:hover{border-color:var(--brand-500);color:var(--brand-700)}.qty-delete-btn{border-color:#de3c4b73;color:var(--danger-500)}.qty-delete-btn:hover{border-color:var(--danger-500);color:#a4212e}.qty-controls-inline{display:inline-flex;align-items:center;gap:.38rem;padding:.18rem .32rem;border:1px solid var(--line-soft);border-radius:999px;background:#f6fbfd}.qty-controls-inline strong{min-width:22px;text-align:center;font-size:.86rem}.sale-detail{margin-top:var(--space-3);border:1px solid var(--line-soft);border-radius:var(--radius-sm);padding:var(--space-3);background:#f8fbff}.sale-invoice-modal{width:min(860px,100%);max-height:min(88vh,760px)}.sale-invoice-head{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.6rem}.sale-invoice-block{border:1px solid var(--line-soft);border-radius:var(--radius-sm);background:#f8fbff;padding:.55rem .62rem;display:grid;gap:.2rem}.sale-invoice-block span{color:var(--text-secondary);font-size:.76rem}.sale-invoice-block strong{color:var(--text-primary);font-size:.9rem;overflow-wrap:anywhere}.sale-invoice-table-wrap table{min-width:520px}.sale-invoice-foot{margin-top:.2rem;border-top:1px solid var(--line-soft);padding-top:.65rem;display:flex;justify-content:flex-end}.sale-invoice-foot div{display:grid;text-align:right}.sale-invoice-foot span{color:var(--text-secondary);font-size:.8rem}.sale-invoice-foot strong{color:var(--brand-700);font-size:1.15rem}.sale-invoice-actions{margin-top:.8rem;border-top:1px solid var(--line-soft);padding-top:.75rem;display:flex;justify-content:flex-end}.sale-preview-modal{width:min(1100px,100%);max-height:min(92vh,860px);display:grid;grid-template-rows:auto 1fr auto}.sale-preview-frame-wrap{margin-top:.65rem;border:1px solid var(--line-soft);border-radius:var(--radius-sm);background:#f7fbff;overflow:hidden}.sale-preview-frame{width:100%;height:min(72vh,700px);border:0;background:#fff}.sale-preview-actions{margin-top:.8rem;padding-top:.8rem;border-top:1px solid var(--line-soft);display:flex;justify-content:flex-end;gap:.5rem}.sale-detail pre{margin:var(--space-2) 0 0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:.79rem;color:var(--text-primary)}.total-pill{background:#0c8b8b1a;border:1px solid rgba(12,139,139,.28);color:var(--brand-700);padding:.66rem .82rem;border-radius:var(--radius-sm);width:fit-content}.error-banner{background:#de3c4b1a;border:1px solid rgba(222,60,75,.36);color:#8f1826;border-radius:var(--radius-sm);padding:.82rem;display:grid;gap:.25rem}.floating-notice{position:sticky;top:.2rem;z-index:18;border-radius:var(--radius-sm);border:1px solid var(--line-soft);box-shadow:var(--shadow-soft);padding:.62rem .72rem;display:grid;grid-template-columns:auto 1fr auto;align-items:start;gap:.55rem}.floating-notice-icon{display:inline-flex;align-items:center;justify-content:center;margin-top:.05rem}.floating-notice-icon svg{width:18px;height:18px}.floating-notice-copy{display:grid;gap:.12rem}.floating-notice-copy strong{font-size:.88rem}.floating-notice-copy p{font-size:.8rem}.floating-notice-close{border:0;background:transparent;color:inherit;cursor:pointer;font-size:.78rem;text-decoration:underline;padding:0}.floating-notice-success{background:#d8f0f0;border-color:#78bebe;color:#0a5c5c}.floating-notice-error{background:#de3c4b;border-color:#b42a37;color:#fff}.floating-notice-error .floating-notice-copy p,.floating-notice-error .floating-notice-close{color:#fff}.loading-state{display:inline-flex;align-items:center;gap:.52rem;color:var(--text-secondary)}.loading-dot{width:12px;height:12px;border-radius:999px;background:var(--accent-500);box-shadow:0 0 #ff9f1c7a;animation:pulse 1.3s infinite}@keyframes ambient-float{0%{transform:translateY(-2%) scale(1)}to{transform:translateY(2%) scale(1.02)}}@keyframes panel-enter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%{box-shadow:0 0 #ff9f1c80}70%{box-shadow:0 0 0 10px #ff9f1c00}to{box-shadow:0 0 #ff9f1c00}}@media(max-width:1100px){.module-grid{grid-template-columns:1fr}.app-shell{grid-template-columns:1fr;height:auto;overflow:visible}.app-sidebar{grid-template-rows:auto auto auto;position:static;height:auto;overflow:visible}.nav-links{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));overflow:visible}.app-content{overflow:visible}.topbar{position:static;flex-direction:column;align-items:flex-start;gap:.75rem}.content-panel{min-height:0}.sale-row{grid-template-columns:1fr}}@media(max-width:860px){.app-content,.content-panel{padding:var(--space-4)}.kpi-group{width:100%;display:grid;grid-template-columns:1fr}.monthly-kpi{width:100%}.topbar{gap:.7rem}}@media(max-width:700px){.app-content,.content-panel{padding:var(--space-3)}.list-head{flex-direction:column;align-items:stretch;gap:.55rem}.list-head-actions{justify-content:stretch}.list-head-actions .btn{width:100%}.list-card .table-wrap{display:none}.mobile-record-list{display:grid;gap:.7rem}.actions-inline{flex-wrap:wrap}.sale-row-card{grid-template-columns:1fr}.floating-notice{grid-template-columns:auto 1fr}.floating-notice-close{grid-column:1 / -1;justify-self:end}.modal-card{max-height:86vh}.picker-option-row{flex-direction:column;align-items:stretch}.picker-actions{justify-content:flex-end}}
