:root{--color-primary-50:#eff6ff;--color-primary-100:#dbeafe;--color-primary-200:#bfdbfe;--color-primary-300:#93c5fd;--color-primary-400:#60a5fa;--color-primary-500:#3b82f6;--color-primary-600:#2563eb;--color-primary-700:#1d4ed8;--color-primary-800:#1e40af;--color-primary-900:#1e3a8a;--color-dark-50:#f8fafc;--color-dark-100:#f1f5f9;--color-dark-200:#e2e8f0;--color-dark-300:#cbd5e1;--color-dark-400:#94a3b8;--color-dark-500:#64748b;--color-dark-600:#475569;--color-dark-700:#334155;--color-dark-800:#1e293b;--color-dark-900:#0f172a;--color-gray-50:#f9fafb;--color-gray-100:#f3f4f6;--color-gray-200:#e5e7eb;--color-gray-300:#d1d5db;--color-gray-400:#9ca3af;--color-gray-500:#6b7280;--color-gray-600:#4b5563;--color-gray-700:#374151;--color-gray-800:#1f2937;--color-gray-900:#111827;--color-accent-50:#fff7ed;--color-accent-100:#ffedd5;--color-accent-200:#fed7aa;--color-accent:#f97316;--color-accent-dark:#ea6c09;--color-success-bg:#f0fdf4;--color-success-border:#bbf7d0;--color-success-text:#166534;--color-success:#22c55e;--color-danger-bg:#fef2f2;--color-danger-border:#fecaca;--color-danger-text:#b91c1c;--color-danger:#ef4444;--color-warning-bg:#fef9c3;--color-warning-border:#fde68a;--color-warning-text:#92400e;--color-warning:#f59e0b;--color-info-bg:#eff6ff;--color-info-border:#bfdbfe;--color-info-text:#1d4ed8;--color-info:#3b82f6;--text-xs:12px;--text-sm:13px;--text-base:14px;--text-md:15px;--text-lg:17px;--text-xl:20px;--text-2xl:22px;--text-3xl:26px;--text-4xl:30px;--font-normal:400;--font-medium:500;--font-semibold:600;--font-bold:700;--line-tight:1.25;--line-snug:1.375;--line-normal:1.5;--line-relaxed:1.625;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:18px;--radius-2xl:24px;--radius-full:999px;--shadow-xs:0 1px 3px #0f172a0f;--shadow-sm:0 2px 8px #0f172a14,0 0 0 1px #e2e8f0cc;--shadow-md:0 8px 20px #0f172a1a,0 0 0 1px #e2e8f0e6;--shadow-lg:0 16px 35px #0f172a21,0 0 0 1px #e2e8f0e6;--shadow-xl:0 30px 60px #0f172a38,0 0 0 1px #e2e8f0b3;--shadow-sidebar:0 18px 40px #0f172aa6,0 0 0 1px #94a3b840;--shadow-header:0 8px 20px #0f172a66;--shadow-glow-primary:0 8px 24px #2563eb52;--shadow-glow-danger:0 8px 20px #ef444447;--shadow-glow-warning:0 8px 20px #f59e0b47;--shadow-glow-accent:0 10px 24px #f9731666;--transition-fast:all .12s ease;--transition-normal:all .2s ease;--transition-slow:all .3s ease;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:var(--line-normal);font-weight:var(--font-normal);color:var(--color-gray-900);background-color:var(--color-gray-100);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,:before,:after{box-sizing:border-box}body{background:radial-gradient(80% 60% at 10% 0,#dbeafe 0%,#f9fafb 50%,#e5e7eb 100%);min-height:100vh;margin:0}#root{min-height:100vh}.app-shell{flex-direction:column;min-height:100vh;display:flex}.app-header{background:linear-gradient(110deg,var(--color-dark-900)0%,var(--color-dark-800)60%,#1a2f50 100%);color:#f9fafb;padding:var(--space-3)var(--space-6);box-shadow:var(--shadow-header);z-index:20;position:relative}.app-header:after{content:"";background:linear-gradient(90deg,#0000,#60a5fa80 40% 60%,#0000);height:1px;position:absolute;bottom:0;left:0;right:0}.app-header-top{justify-content:space-between;align-items:center;display:flex}.app-header-brand{align-items:center;gap:var(--space-3);display:flex}.app-header-logo{border-radius:var(--radius-sm);object-fit:contain;background:0 0;border:none;width:auto;height:60px}.app-header-logo-placeholder{font-size:var(--text-base);font-weight:var(--font-bold);color:var(--color-dark-700);justify-content:center;align-items:center;display:flex}.app-header-title{font-size:var(--text-2xl);font-weight:var(--font-bold);letter-spacing:.02em;margin:0}.app-header-subtitle{font-size:var(--text-sm);opacity:.8;letter-spacing:.01em;margin:3px 0 0}.app-header-badge{font-size:var(--text-xs);font-weight:var(--font-semibold);border-radius:var(--radius-full);letter-spacing:.02em;background:#3b82f62e;border:1px solid #60a5facc;padding:4px 10px}.app-layout{width:100%;padding:var(--space-4);align-items:stretch;gap:var(--space-4);flex:1;height:calc(100vh - 64px);margin:0;display:flex}.app-sidebar{width:250px;color:var(--color-dark-200);border-radius:var(--radius-xl);padding:var(--space-3)var(--space-3)var(--space-4);box-shadow:var(--shadow-sidebar);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#0c1426f7;border:1px solid #94a3b81f;flex-direction:column;flex-shrink:0;transition:width .25s cubic-bezier(.4,0,.2,1),flex-basis .25s cubic-bezier(.4,0,.2,1);display:flex;overflow:hidden}.app-sidebar.collapsed{flex:0 0 72px;width:72px}.sidebar-top{justify-content:space-between;align-items:center;gap:var(--space-2);margin-bottom:var(--space-3);padding-bottom:var(--space-3);border-bottom:1px solid #94a3b81a;display:flex}.sidebar-brand{align-items:center;gap:var(--space-2);display:flex}.sidebar-brand-logo{border-radius:var(--radius-full);width:30px;height:30px;font-size:var(--text-base);font-weight:var(--font-bold);background:linear-gradient(135deg,#93c5fd 0%,#1d4ed8 100%);flex-shrink:0;justify-content:center;align-items:center;display:flex;box-shadow:0 4px 12px #2563eb66}.sidebar-brand-text{flex-direction:column;display:flex}.sidebar-app-name{font-size:var(--text-base);font-weight:var(--font-semibold);color:#f1f5f9;margin:0}.sidebar-app-desc{font-size:var(--text-xs);opacity:.65;color:var(--color-dark-300);margin:0}.sidebar-toggle{color:var(--color-dark-300);border-radius:var(--radius-full);cursor:pointer;width:28px;height:28px;transition:var(--transition-fast);background:#ffffff0f;border:none;flex-shrink:0;justify-content:center;align-items:center;display:flex;box-shadow:0 0 0 1px #94a3b84d}.sidebar-toggle:hover{color:#fff;background:#1e40afd9;box-shadow:0 0 0 1px #bfdbfeb3,0 8px 20px #1e40af8c}.app-sidebar.collapsed .sidebar-brand-text,.app-sidebar.collapsed .sidebar-app-desc{display:none}.app-sidebar.collapsed .sidebar-section-title,.app-sidebar.collapsed .sidebar-item-label{opacity:0;pointer-events:none;width:0;overflow:hidden}.sidebar-scroll{flex:1;padding-right:2px;overflow-y:auto}.sidebar-scroll::-webkit-scrollbar{width:3px}.sidebar-scroll::-webkit-scrollbar-track{background:0 0}.sidebar-scroll::-webkit-scrollbar-thumb{border-radius:var(--radius-full);background:#94a3b840}.sidebar-section-title{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.1em;color:var(--color-dark-400);margin:var(--space-3)var(--space-2)var(--space-1);font-weight:var(--font-semibold)}.sidebar-menu-list{margin:0;padding:0;list-style:none}.sidebar-item{padding:7px var(--space-2);border-radius:var(--radius-lg);font-size:var(--text-base);color:var(--color-dark-300);cursor:pointer;transition:var(--transition-fast);align-items:center;gap:var(--space-2);border:1px solid #0000;margin:2px 0;display:flex}.sidebar-item-left{align-items:center;gap:var(--space-2);display:inline-flex}.sidebar-item-icon{opacity:.75;flex-shrink:0;justify-content:center;align-items:center;width:20px;transition:opacity .12s;display:inline-flex}.sidebar-item-label{white-space:nowrap;font-weight:var(--font-medium)}.sidebar-item:hover{color:#e5e7eb;background:#ffffff12;border-color:#94a3b833}.sidebar-item:hover .sidebar-item-icon{opacity:1}.sidebar-item.active{color:#fff;font-weight:var(--font-semibold);background:linear-gradient(135deg,#f97316 0%,#fb923c 100%);border-color:#fdba7499;box-shadow:0 6px 18px #f9731661}.sidebar-item.active .sidebar-item-icon{opacity:1}.app-main{flex:1;min-width:0;height:100%;overflow-y:auto}.app-main::-webkit-scrollbar{width:5px}.app-main::-webkit-scrollbar-track{background:0 0}.app-main::-webkit-scrollbar-thumb{border-radius:var(--radius-full);background:#94a3b866}.card{border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--space-5)var(--space-5)var(--space-6);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fffffff7}.card-header{justify-content:space-between;align-items:flex-start;gap:var(--space-3);margin-bottom:var(--space-5);display:flex}.card-header-main{gap:var(--space-1);flex-direction:column;display:flex}.card-title{font-size:var(--text-xl);font-weight:var(--font-bold);color:var(--color-dark-900);line-height:var(--line-tight);margin:0}.card-subtitle{font-size:var(--text-base);color:var(--color-gray-500);margin:0}.card-meta{align-items:flex-end;gap:var(--space-1);flex-direction:column;display:flex}.card-meta-chip{font-size:var(--text-xs);font-weight:var(--font-medium);padding:4px var(--space-3);border-radius:var(--radius-full);border:1px solid var(--color-gray-200);background:var(--color-gray-50);color:var(--color-gray-600);letter-spacing:.02em}.data-table-wrapper{border-radius:var(--radius-lg);overflow-x:auto}.data-table{border-collapse:collapse;width:100%;font-size:var(--text-md)}.data-table thead tr{background:linear-gradient(to right,var(--color-dark-900)0%,var(--color-dark-800)100%);color:#e5e7eb}.data-table th,.data-table td{padding:10px var(--space-3);border-bottom:1px solid var(--color-gray-200);text-align:left;white-space:nowrap}.data-table th{font-size:var(--text-sm);font-weight:var(--font-semibold);letter-spacing:.04em;text-transform:uppercase;color:var(--color-dark-200)}.data-table tbody tr:nth-child(2n){background:var(--color-gray-50)}.data-table tbody tr:hover{background:var(--color-primary-50);transition:background .12s}.status-text{font-size:var(--text-md);color:var(--color-gray-600)}.status-text.error{color:var(--color-danger-text)}.status-spinner{border-radius:var(--radius-full);border:2px solid var(--color-primary-300);width:14px;height:14px;margin-right:var(--space-2);vertical-align:middle;border-top-color:#0000;animation:.75s linear infinite spin;display:inline-block}.placeholder-box{padding:var(--space-5)var(--space-4);border-radius:var(--radius-lg);background:var(--color-gray-50);border:1px dashed var(--color-gray-300);font-size:var(--text-md);color:var(--color-gray-600)}.placeholder-title{font-weight:var(--font-semibold);margin-bottom:var(--space-1)}@keyframes spin{to{transform:rotate(360deg)}}.grid-cards{gap:var(--space-3);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.feature-card{border-radius:var(--radius-lg);padding:var(--space-4)var(--space-4)var(--space-3);border:1px solid var(--color-gray-200);cursor:pointer;background:#fff;transition:transform .15s,box-shadow .15s,border-color .15s}.feature-card:hover{border-color:var(--color-primary-300);transform:translateY(-2px);box-shadow:0 10px 28px #0f172a1f}.feature-title{font-weight:var(--font-semibold);color:var(--color-dark-900);margin-bottom:var(--space-2);font-size:var(--text-md)}.feature-desc{font-size:var(--text-base);color:var(--color-gray-500);line-height:var(--line-relaxed)}.btn{border-radius:var(--radius-md);padding:9px var(--space-3);font-size:var(--text-base);font-weight:var(--font-semibold);cursor:pointer;align-items:center;gap:var(--space-2);letter-spacing:.01em;border:none;transition:transform .12s,box-shadow .12s,opacity .12s;display:inline-flex}.btn:disabled{opacity:.48;cursor:not-allowed;box-shadow:none;transform:none}.btn-primary{background:linear-gradient(135deg,var(--color-primary-500)0%,var(--color-primary-700)100%);color:#fff;box-shadow:var(--shadow-glow-primary)}.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 12px 28px #2563eb61}.btn-secondary{background:var(--color-gray-100);color:var(--color-gray-800);border:1px solid var(--color-gray-200)}.btn-secondary:hover:not(:disabled){background:var(--color-gray-200);border-color:var(--color-gray-300)}.btn-warning{background:linear-gradient(135deg,var(--color-warning)0%,#d97706 100%);color:#fff;box-shadow:var(--shadow-glow-warning)}.btn-warning:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 12px 28px #f59e0b61}.btn-danger{background:linear-gradient(135deg,var(--color-danger)0%,#dc2626 100%);color:#fff;box-shadow:var(--shadow-glow-danger)}.btn-danger:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 12px 28px #ef444461}.btn-row{gap:var(--space-2);justify-content:flex-end;display:flex}.btn-icon{border-radius:var(--radius-md);border:1px solid var(--color-gray-200);background:var(--color-gray-50);cursor:pointer;width:42px;transition:var(--transition-fast);justify-content:center;align-items:center;display:inline-flex}.btn-icon:hover{background:var(--color-primary-50);border-color:var(--color-primary-200)}.btn-small{padding:7px var(--space-3);border-radius:var(--radius-md);font-size:var(--text-sm)}.form-grid{gap:var(--space-3);grid-template-columns:1fr 1fr;display:grid}@media (max-width:640px){.form-grid{grid-template-columns:1fr}.form-field.full{grid-column:span 1}}.form-field{gap:var(--space-2);flex-direction:column;display:flex}.form-field.full{grid-column:span 2}.form-group{gap:var(--space-2);flex-direction:column;display:flex}.form-group.full{grid-column:span 2}.label{font-size:var(--text-sm);color:var(--color-gray-700);font-weight:var(--font-semibold);letter-spacing:.02em}.req{color:var(--color-danger);font-weight:var(--font-bold)}.input,.textarea{border-radius:var(--radius-md);border:1.5px solid var(--color-gray-200);padding:9px var(--space-3);font-size:var(--text-base);color:var(--color-gray-900);background:#fff;outline:none;font-family:inherit;transition:border-color .15s,box-shadow .15s,background .15s}.input:hover,.textarea:hover{border-color:var(--color-gray-300)}.input:focus,.textarea:focus{border-color:var(--color-primary-400);background:#fff;box-shadow:0 0 0 3px #3b82f62e}.textarea{resize:vertical;min-height:90px;line-height:var(--line-relaxed)}.inline-field{gap:var(--space-2);align-items:stretch;display:flex}.inline-field .input{flex:1}.toolbar{justify-content:space-between;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3);display:flex}.toolbar-left{align-items:center;gap:var(--space-2);display:flex}.modal-backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:9999;padding:var(--space-4);background:#0a112299;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{border-radius:var(--radius-xl);width:100%;max-height:calc(100vh - 32px);box-shadow:var(--shadow-xl);background:#fff;border:1px solid #e2e8f0cc;flex-direction:column;display:flex;overflow:hidden}.modal-header{padding:var(--space-3)var(--space-4);background:linear-gradient(110deg,var(--color-dark-900)0%,var(--color-dark-800)100%);color:#e5e7eb;border-bottom:1px solid #94a3b81f;flex:none;justify-content:space-between;align-items:center;display:flex}.modal-title{font-size:var(--text-md);font-weight:var(--font-semibold);letter-spacing:.02em;margin:0}.modal-body{padding:var(--space-4)var(--space-4)var(--space-4);flex:auto;overflow:auto}.table-actions{gap:var(--space-2);justify-content:flex-end;display:flex}.badge{align-items:center;gap:var(--space-2);padding:3px var(--space-3);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:var(--font-medium);border:1px solid var(--color-gray-200);background:var(--color-gray-50);letter-spacing:.02em;line-height:var(--line-tight);display:inline-flex}.badge-ok{border-color:var(--color-success-border);background:var(--color-success-bg);color:var(--color-success-text)}.badge-off{border-color:var(--color-danger-border);background:var(--color-danger-bg);color:var(--color-danger-text)}.badge-debt{border-color:var(--color-info-border);background:var(--color-info-bg);color:var(--color-info-text)}.badge-debt-red{border-color:var(--color-danger-border);background:var(--color-danger-bg);color:#dc2626}.badge-pay{border-color:var(--color-danger-border);background:var(--color-danger-bg);color:var(--color-danger-text)}.badge-pay-green{border-color:var(--color-success-border);background:var(--color-success-bg);color:var(--color-success-text)}.badge-return{border-color:var(--color-danger-border);background:var(--color-danger-bg);color:var(--color-danger-text)}.badge-advance{border-color:var(--color-warning-border);background:var(--color-warning-bg);color:var(--color-warning-text)}.badge-supplier-debt{border-color:var(--color-danger-border);background:var(--color-danger-bg);color:var(--color-danger-text)}.badge-supplier-pay{border-color:var(--color-success-border);background:var(--color-success-bg);color:var(--color-success-text)}.badge-supplier-paid{border-color:var(--color-info-border);background:var(--color-info-bg);color:var(--color-primary-600)}.badge-legacy-warning{background:var(--color-accent-50);color:#9a3412;border-color:#fdba74}.text-error{color:var(--color-danger-text);font-size:var(--text-md);margin-bottom:var(--space-2)}.page{border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--space-5);background:#fffffff7}.page-header{justify-content:space-between;align-items:flex-start;gap:var(--space-4);margin-bottom:var(--space-5);display:flex}.page-header.compact{align-items:center;gap:var(--space-3);margin-bottom:var(--space-2)}.page-header.compact h2{font-size:var(--text-lg);line-height:var(--line-tight);margin:0}.page-header.compact .page-subtitle{display:none}.page-header.compact .btn{height:30px;padding:5px var(--space-3);font-size:var(--text-sm);border-radius:var(--radius-md)}.page-header.compact .input{height:30px;padding:4px var(--space-3);font-size:var(--text-sm)}.page-header h1{margin:0 0 var(--space-1);font-size:26px;font-weight:var(--font-bold);color:var(--color-dark-900);line-height:var(--line-tight)}.page-header p{color:var(--color-gray-500);font-size:var(--text-md);margin:0}.page-actions{align-items:center;gap:var(--space-3);display:flex}.page-metric{font-size:var(--text-base);color:var(--color-dark-500)}.page-metric strong{color:var(--color-dark-900)}.search-row{align-items:center;gap:var(--space-3);margin-bottom:var(--space-3);flex-wrap:wrap;display:flex}.search-row .input{min-width:240px}.debt-search-metrics{align-items:center;gap:var(--space-3);display:inline-flex}.summary{gap:var(--space-3);font-size:var(--text-base);color:var(--color-dark-500);display:flex}.search-suggest{margin-bottom:var(--space-3);border:1px solid var(--color-gray-200);border-radius:var(--radius-lg);padding:var(--space-2);background:var(--color-gray-50);gap:var(--space-2);flex-direction:column;display:flex}.suggest-item{text-align:left;padding:var(--space-2)var(--space-3);border-radius:var(--radius-md);cursor:pointer;font-size:var(--text-base);transition:var(--transition-fast);background:#fff;border:1px solid #0000}.suggest-item:hover{border-color:var(--color-primary-300);background:var(--color-primary-50)}.quick-suggest{position:relative}.quick-suggest .input{width:100%}.quick-suggest-panel{z-index:3200;border-radius:var(--radius-lg);background:var(--color-dark-900);border:1px solid #ffffff14;max-height:220px;padding:0;position:absolute;top:calc(100% + 6px);left:0;right:0;overflow:hidden auto;box-shadow:0 16px 32px #0f172a66}.quick-suggest-item{text-align:left;width:100%;padding:var(--space-3);color:var(--color-dark-200);cursor:pointer;font-size:var(--text-base);border:1px solid #0000;border-bottom-color:#94a3b826;border-radius:0;transition:background .1s;display:block;background:0 0!important}.quick-suggest-item:last-child{border-bottom:0}.quick-suggest-item:hover,.quick-suggest-item:focus,.quick-suggest-item:focus-visible{border-color:var(--color-dark-900);border-radius:var(--radius-sm);color:#fff;outline:none;box-shadow:0 0 0 1px #0f172a80,0 4px 12px #2563eb59;background:var(--color-primary-600)!important}.quick-suggest-item.muted{cursor:default;color:#e2e8f099}.quick-suggest .suggest-title{font-size:var(--text-sm);font-weight:var(--font-bold)}.quick-suggest .suggest-meta{font-size:var(--text-xs);opacity:.75}.stockin-search-input{height:36px}.two-pane{gap:var(--space-4);flex-direction:column;display:flex}.pane .table-card{margin-top:0}.table-card{margin-top:var(--space-4);border:1px solid var(--color-gray-200);border-radius:var(--radius-lg);padding:var(--space-3)var(--space-4);background:#fff}.table-title{font-weight:var(--font-semibold);font-size:var(--text-md);margin-bottom:var(--space-3);color:var(--color-dark-900);justify-content:space-between;align-items:center;display:flex}.table{border-collapse:collapse;width:100%;font-size:var(--text-md)}.table thead tr{background:linear-gradient(to right,var(--color-dark-900)0%,var(--color-dark-800)100%);color:#e5e7eb}.table th{font-size:var(--text-sm);font-weight:var(--font-semibold);letter-spacing:.04em;text-transform:uppercase;color:var(--color-dark-200)}.table th,.table td{padding:10px var(--space-3);border-bottom:1px solid var(--color-gray-200);text-align:left;white-space:nowrap}.table tbody tr:nth-child(2n){background:var(--color-gray-50)}.table tbody tr:hover{background:var(--color-primary-50);transition:background .12s}.selected-row{background:var(--color-primary-100)!important}.table-fixed{table-layout:fixed;width:100%}.table-fixed th,.table-fixed td{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.customer-debt-table th:first-child,.customer-debt-table td:first-child{width:22%}.customer-debt-table th:nth-child(2),.customer-debt-table td:nth-child(2){width:12%}.customer-debt-table th:nth-child(3),.customer-debt-table td:nth-child(3){width:16%}.customer-debt-table th:nth-child(4),.customer-debt-table td:nth-child(4),.customer-debt-table th:nth-child(5),.customer-debt-table td:nth-child(5){width:15%}.customer-debt-table th:nth-child(6),.customer-debt-table td:nth-child(6){width:12%}.customer-debt-table th:nth-child(7),.customer-debt-table td:nth-child(7){width:10%}.debt-list-table th:first-child,.debt-list-table td:first-child{width:16%}.debt-list-table th:nth-child(2),.debt-list-table td:nth-child(2){width:14%}.debt-list-table th:nth-child(3),.debt-list-table td:nth-child(3){width:18%}.debt-list-table th:nth-child(4),.debt-list-table td:nth-child(4),.debt-list-table th:nth-child(5),.debt-list-table td:nth-child(5){width:16%}.debt-list-table th:nth-child(6),.debt-list-table td:nth-child(6){width:20%}.debt-payment-table th:first-child,.debt-payment-table td:first-child{width:8%}.debt-payment-table th:nth-child(2),.debt-payment-table td:nth-child(2){width:24%}.debt-payment-table th:nth-child(3),.debt-payment-table td:nth-child(3){width:20%}.debt-payment-table th:nth-child(4),.debt-payment-table td:nth-child(4){width:22%}.debt-payment-table th:nth-child(5),.debt-payment-table td:nth-child(5){width:26%}.debt-summary{gap:var(--space-4);margin-bottom:var(--space-3);font-size:var(--text-md);padding:var(--space-3);border:1px solid var(--color-info-border);border-radius:var(--radius-lg);background:var(--color-primary-50);flex-wrap:wrap;align-items:center;display:flex}.debt-summary .summary-label{font-weight:var(--font-semibold);color:var(--color-dark-900)}.debt-summary .summary-value{font-weight:var(--font-normal);color:var(--color-gray-900)}.legacy-warning-box{margin:0 0 var(--space-3);padding:var(--space-2)var(--space-3);border-radius:var(--radius-sm);background:var(--color-accent-50);color:#9a3412;font-size:var(--text-sm);font-weight:var(--font-semibold);border:1px dashed #fdba74}.supplier-list{gap:var(--space-2);max-height:220px;padding-right:var(--space-2);flex-direction:column;display:flex;overflow-y:auto}.supplier-item{justify-content:space-between;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-lg);border:1px solid var(--color-gray-200);cursor:pointer;transition:var(--transition-fast);background:#fff;display:flex}.supplier-item:hover{border-color:var(--color-primary-300);background:var(--color-primary-50)}.supplier-item.active{border-color:var(--color-primary-600);background:var(--color-primary-100)}.supplier-name{font-weight:var(--font-semibold);color:var(--color-dark-900)}.supplier-debt{font-weight:var(--font-bold);color:var(--color-dark-900)}.supplier-top-row{align-items:center;gap:var(--space-3);margin-bottom:var(--space-3);display:flex}.supplier-top-row .search-row{flex:1;margin:0}.supplier-total-box{border:1px solid var(--color-gray-200);border-radius:var(--radius-md);padding:var(--space-2)var(--space-3);font-size:var(--text-base);color:var(--color-dark-900);white-space:nowrap;background:#fff}.supplier-filter-row{justify-content:flex-start;align-items:center;gap:var(--space-3);margin:0;display:inline-flex}.supplier-filter-label{font-size:var(--text-base);font-weight:var(--font-semibold);color:var(--color-dark-900);text-align:right;min-width:72px}.ios-switch{width:46px;height:26px;display:inline-flex;position:relative}.ios-switch input{opacity:0;width:0;height:0}.ios-slider{background:var(--color-gray-200);border-radius:var(--radius-full);transition:var(--transition-normal);cursor:pointer;border:1px solid var(--color-gray-300);position:absolute;inset:0}.ios-slider:before{content:"";width:20px;height:20px;transition:var(--transition-normal);background:#fff;border-radius:50%;position:absolute;top:2px;left:2px;box-shadow:0 2px 6px #0f172a38}.ios-switch input:checked+.ios-slider{background:var(--color-primary-600);border-color:var(--color-primary-700)}.ios-switch input:checked+.ios-slider:before{transform:translate(20px)}.debt-search-row{align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.debt-filter-row{align-items:center;gap:0;display:flex}.debt-filter-label{text-align:left;min-width:90px;font-weight:var(--font-semibold);color:var(--color-dark-900)}.supplier-table-wrap{border:1px solid var(--color-gray-200);border-radius:var(--radius-lg);background:#fff;max-height:260px;overflow:auto}.supplier-list-table{table-layout:fixed;width:100%}.supplier-list-table th,.supplier-list-table td{text-overflow:ellipsis;vertical-align:middle;overflow:hidden}.supplier-list-table .col-id{width:48px}.supplier-list-table .col-ma{width:88px}.supplier-list-table .col-ten{width:190px}.supplier-list-table .col-mst{width:120px}.supplier-list-table .col-sdt{width:110px}.supplier-list-table .col-email{width:155px}.supplier-list-table .col-diachi{width:230px}.supplier-list-table .col-congno{text-align:right;width:110px}.supplier-list-table .col-gioihan{text-align:right;width:90px}.supplier-list-table .col-trangthai{text-align:center;width:96px}.supplier-list-table .col-action{text-align:center;width:76px}.supplier-status-badge{padding:3px var(--space-2);justify-content:center;gap:0;min-width:0}.supplier-action-btn{min-width:52px;padding:5px var(--space-2);border-radius:var(--radius-sm);font-size:var(--text-xs);box-shadow:none;line-height:1.1}.supplier-action-btn:hover{box-shadow:none;transform:none}.debt-table-wrap{border:1px solid var(--color-gray-200);border-radius:var(--radius-lg);background:#fff;overflow:auto}.debt-table-wrap-padded{padding:var(--space-3)}.debt-table-wrap .table thead tr{z-index:1;position:sticky;top:0}.supplier-table{border-collapse:collapse;table-layout:fixed;width:100%}.supplier-table thead th{background:linear-gradient(to right,var(--color-dark-900),var(--color-dark-800));color:var(--color-dark-200);font-size:var(--text-sm);font-weight:var(--font-semibold);padding:var(--space-3);z-index:1;letter-spacing:.04em;text-transform:uppercase;border-bottom:1px solid #0b1220;position:sticky;top:0}.supplier-th-debt{text-align:right;width:120px}.supplier-row{cursor:pointer;transition:background .12s}.supplier-row td{padding:var(--space-3);border-bottom:1px solid var(--color-dark-100);font-size:var(--text-base)}.supplier-row:hover{background:var(--color-primary-50)}.supplier-row.active{background:var(--color-primary-100)}.supplier-cell-name{font-weight:var(--font-semibold);color:var(--color-dark-900);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.supplier-cell-debt{text-align:right;font-weight:var(--font-bold);color:var(--color-dark-900)}.supplier-empty{padding:var(--space-4)var(--space-3);text-align:center;color:var(--color-gray-500);font-size:var(--text-base)}.modal-table-wrap{border:1px solid var(--color-gray-200);border-radius:var(--radius-lg);background:#fff;max-height:220px;overflow:auto}.switch-row{gap:var(--space-2);display:inline-flex}.switch-btn{border-radius:var(--radius-full);border:1px solid var(--color-gray-200);padding:7px var(--space-4);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-gray-50);cursor:pointer;transition:var(--transition-fast)}.switch-btn.active{background:var(--color-primary-600);color:#fff;border-color:var(--color-primary-700);box-shadow:var(--shadow-glow-primary)}.debt-select-list{border:1px dashed var(--color-gray-200);border-radius:var(--radius-lg);padding:var(--space-2)var(--space-3);gap:var(--space-2);flex-direction:column;max-height:200px;display:flex;overflow-y:auto}.debt-select-item{align-items:center;gap:var(--space-3);font-size:var(--text-base);padding:var(--space-2)var(--space-2);border-radius:var(--radius-md);background:var(--color-gray-50);border:1px solid var(--color-gray-200);display:flex}.debt-select-item input{accent-color:var(--color-primary-600)}.debt-red{border-color:var(--color-danger-border);background:var(--color-danger-bg)}.debt-yellow{border-color:var(--color-warning-border);background:var(--color-warning-bg)}.payroll-extra-badge{margin-top:var(--space-4);padding:var(--space-4);border:1px dashed var(--color-gray-300);border-radius:var(--radius-lg);background:var(--color-gray-50)}.payroll-extra-header{justify-content:space-between;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3);display:flex}.payroll-extra-title{font-weight:var(--font-bold);font-size:var(--text-md);color:var(--color-dark-900)}.payroll-extra-grid{gap:var(--space-3);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.payroll-extra-grid .span-2{grid-column:span 2}.payroll-extra-table{margin-top:var(--space-3)}@media (max-width:1200px){.payroll-extra-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.payroll-extra-grid .span-2{grid-column:span 2}}@media (max-width:768px){.payroll-extra-header{flex-direction:column;align-items:flex-start}.payroll-extra-grid{grid-template-columns:1fr}.payroll-extra-grid .span-2{grid-column:span 1}}.quick-fab-root{z-index:1200;align-items:flex-end;gap:var(--space-3);pointer-events:none;flex-direction:column;width:58px;display:flex;position:fixed;bottom:18px;right:18px}.quick-fab-trigger{border-radius:var(--radius-full);background:linear-gradient(135deg,var(--color-primary-500)0%,var(--color-primary-700)55%,var(--color-dark-900)130%);color:#fff;cursor:grab;pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;border:1px solid #fff6;justify-content:center;align-items:center;width:58px;height:58px;transition:transform .2s,box-shadow .2s;display:inline-flex;position:relative;box-shadow:0 14px 36px #2563eb61}.quick-fab-trigger:hover{transform:translateY(-2px)scale(1.04);box-shadow:0 20px 48px #2563eb7a}.quick-fab-root.dragging .quick-fab-trigger{cursor:grabbing}.quick-fab-trigger-glow{border-radius:var(--radius-full);pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #ffffff4d}.quick-fab-panel{border-radius:var(--radius-xl);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);min-width:230px;max-width:280px;padding:var(--space-3);transform-origin:100% 100%;opacity:0;pointer-events:none;background:#fffffff5;border:1px solid #94a3b838;transition:transform .2s,opacity .2s;position:absolute;bottom:calc(100% + 10px);right:0;transform:translateY(8px)scale(.95);box-shadow:0 24px 64px #0f172a38}.quick-fab-root.open .quick-fab-panel{opacity:1;pointer-events:auto;transform:translateY(0)scale(1)}.quick-fab-panel-header{font-size:var(--text-sm);font-weight:var(--font-bold);color:var(--color-dark-800);margin:0 0 var(--space-2);padding:2px var(--space-2);letter-spacing:.04em;text-transform:uppercase}.quick-fab-list{gap:var(--space-2);flex-direction:column;display:flex}.quick-fab-item{border:1px solid var(--color-dark-200);width:100%;color:var(--color-dark-900);border-radius:var(--radius-lg);padding:9px var(--space-3);cursor:pointer;transition:var(--transition-fast);font-size:var(--text-base);background:#fff;align-items:center;gap:9px;display:flex}.quick-fab-item:hover{border-color:var(--color-primary-300);background:var(--color-primary-50);transform:translate(-2px)}.quick-fab-item.active{border-color:var(--color-primary-400);background:var(--color-primary-50);color:var(--color-primary-700)}.quick-fab-item-icon{border-radius:var(--radius-sm);background:var(--color-dark-100);flex-shrink:0;justify-content:center;align-items:center;width:26px;height:26px;display:inline-flex}.quick-fab-item.active .quick-fab-item-icon{background:var(--color-primary-100)}.quick-fab-item-label{font-size:var(--text-base);font-weight:var(--font-semibold)}.quick-fab-item-badge{min-width:18px;height:18px;padding:0 var(--space-2);border-radius:var(--radius-full);border:1px solid var(--color-danger-border);background:var(--color-danger);color:#fff;font-size:var(--text-xs);font-weight:var(--font-bold);justify-content:center;align-items:center;margin-left:auto;line-height:1;display:inline-flex}@media (max-width:768px){.quick-fab-root{width:54px;bottom:12px;right:12px}.quick-fab-trigger{width:54px;height:54px}.quick-fab-panel{min-width:210px}}.header-user-area{align-items:center;gap:var(--space-2);display:flex}.header-user-chip{align-items:center;gap:var(--space-2);border-radius:var(--radius-full);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffff1a;border:1px solid #ffffff2e;padding:5px 12px 5px 6px;display:flex}.header-user-avatar{border-radius:var(--radius-full);background:linear-gradient(135deg,var(--color-primary-400),var(--color-primary-700));color:#fff;width:28px;height:28px;font-size:var(--text-sm);font-weight:var(--font-bold);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex;box-shadow:0 2px 8px #2563eb59}.header-user-name{font-size:var(--text-base);font-weight:var(--font-semibold);color:#f1f5f9;white-space:nowrap;text-overflow:ellipsis;max-width:160px;overflow:hidden}.header-role-badge{font-size:var(--text-xs);font-weight:var(--font-semibold);border-radius:var(--radius-full);color:#c7d2fe;letter-spacing:.03em;background:#6366f12e;border:1px solid #a5b4fc80;padding:4px 10px}.btn-header-logout{border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:var(--font-semibold);cursor:pointer;align-items:center;gap:var(--space-1);color:#fca5a5;transition:var(--transition-fast);letter-spacing:.02em;background:#ef444426;border:1px solid #ef44444d;padding:7px 14px;display:inline-flex}.btn-header-logout:hover{color:#fecaca;background:#ef444447;border-color:#ef444480;transform:translateY(-1px)}.sidebar-item-icon-wrap{border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:26px;height:26px;transition:background .15s;display:inline-flex}.sidebar-item.active .sidebar-item-icon-wrap{background:#ffffff38!important}.sidebar-item-label{white-space:nowrap;font-weight:var(--font-medium);transition:opacity .15s}.app-sidebar.collapsed .sidebar-item-label{opacity:0;pointer-events:none}.sidebar-section-title{transition:opacity .15s}.app-sidebar.collapsed .sidebar-section-title{opacity:0;pointer-events:none}.sidebar-submenu{border-left:1px solid #94a3b82e;padding-left:10px;position:relative;margin-left:13px!important;margin-top:var(--space-1)!important}.sidebar-submenu .sidebar-item{border-radius:var(--radius-md);font-size:var(--text-sm);padding:6px var(--space-2);color:var(--color-dark-400)}.sidebar-submenu .sidebar-item:hover{color:var(--color-dark-200);background:#ffffff0f;border-color:#0000}.sidebar-submenu .sidebar-item.active{color:#fff;background:linear-gradient(135deg,#f97316 0%,#fb923c 100%);border-color:#fdba7499;box-shadow:0 4px 12px #f973164d}.card-breadcrumb{align-items:center;gap:var(--space-1);font-size:var(--text-xs);color:var(--color-gray-400);margin-bottom:var(--space-2);flex-wrap:wrap;display:flex}.card-breadcrumb-sep{color:var(--color-gray-300);font-size:var(--text-xs)}.card-breadcrumb-current{color:var(--color-primary-600);font-weight:var(--font-semibold)}.card{position:relative}.card:before{content:"";background:linear-gradient(to bottom,var(--color-primary-500),var(--color-primary-300));border-radius:0 var(--radius-sm)var(--radius-sm)0;width:3px;height:36px;position:absolute;top:20px;left:0}.data-table-wrapper,.table-card,.debt-table-wrap,.supplier-table-wrap,.modal-table-wrap{border-radius:var(--radius-lg);overflow:hidden}.table-card{border:1px solid var(--color-gray-200);box-shadow:var(--shadow-sm)}.data-table thead tr,.table thead tr,.supplier-table thead tr{z-index:2;position:sticky;top:0}.data-table thead tr,.table thead tr{background:linear-gradient(to right,var(--color-dark-900)0%,#1a2840 100%)}.data-table th,.table th{font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:.06em;text-transform:uppercase;color:#94a3b8;padding:11px var(--space-3);white-space:nowrap;border-bottom:1px solid #ffffff0d}.data-table td,.table td{padding:10px var(--space-3);font-size:var(--text-base);color:var(--color-gray-800);border-bottom:1px solid var(--color-gray-100);vertical-align:middle}.data-table tbody tr:nth-child(odd),.table tbody tr:nth-child(odd){background:#fff}.data-table tbody tr:nth-child(2n),.table tbody tr:nth-child(2n){background:#fafbfc}.data-table tbody tr:hover,.table tbody tr:hover{transition:background .1s;background:var(--color-primary-50)!important}.data-table tbody tr[style*="cursor: pointer"],.table tbody tr[style*="cursor: pointer"]{cursor:pointer}.data-table tbody tr:last-child td,.table tbody tr:last-child td{border-bottom:none}.selected-row,.supplier-row.active{background:var(--color-primary-100)!important}.th-sortable{cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .12s,background .12s;position:relative}.th-sortable:hover{color:#e2e8f0!important;background:#ffffff14!important}.th-sortable:after{content:" ⇅";opacity:.4;letter-spacing:0;margin-left:3px;font-size:9px;font-style:normal}.th-asc:after{content:" ↑";opacity:.9;color:#60a5fa}.th-desc:after{content:" ↓";opacity:.9;color:#60a5fa}.data-table tbody tr:only-child td[colspan],.table tbody tr:only-child td[colspan],.supplier-table tbody tr:only-child td[colspan]{text-align:center;color:var(--color-gray-400);font-size:var(--text-base);background:#fafbfc;padding:48px 24px;font-style:italic}.data-table tbody tr:only-child td[colspan]:before,.table tbody tr:only-child td[colspan]:before{content:"⊘";color:var(--color-gray-300);margin-bottom:var(--space-3);font-size:32px;font-style:normal;line-height:1;display:block}.table-empty{color:var(--color-gray-400);font-size:var(--text-base);text-align:center;justify-content:center;align-items:center;gap:var(--space-3);flex-direction:column;padding:48px 24px;display:flex}.table-empty-icon{color:var(--color-gray-300);font-size:40px;line-height:1}.table-empty-title{font-weight:var(--font-semibold);color:var(--color-gray-500);font-size:var(--text-md);font-style:normal}.table-empty-desc{font-size:var(--text-base);color:var(--color-gray-400)}@keyframes skeleton-shimmer{0%{background-position:-400px 0}to{background-position:400px 0}}.skeleton-cell{border-radius:var(--radius-sm);background:linear-gradient(90deg,#f1f5f9 25%,#e2e8f0 50%,#f1f5f9 75%) 0 0/800px 100%;height:14px;animation:1.4s infinite skeleton-shimmer}.skeleton-cell-sm{width:60%;height:10px}.skeleton-cell-md{width:80%;height:14px}.skeleton-cell-lg{width:95%;height:14px}.skeleton-cell-xs{border-radius:50%;width:20px;height:20px}.table-skeleton tbody tr td{padding:14px var(--space-3)}.status-text{align-items:center;gap:var(--space-2);font-size:var(--text-md);color:var(--color-gray-500);padding:var(--space-4)0;display:flex}.status-spinner{border-radius:var(--radius-full);border:2px solid var(--color-primary-200);border-top-color:var(--color-primary-500);flex-shrink:0;width:16px;height:16px;animation:.75s linear infinite spin;display:inline-block}.pagination{justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-3)0;display:flex}.pagination-btn{border-radius:var(--radius-md);border:1px solid var(--color-gray-200);min-width:34px;height:34px;color:var(--color-gray-700);font-size:var(--text-base);font-weight:var(--font-semibold);cursor:pointer;transition:var(--transition-fast);padding:0 var(--space-2);background:#fff;justify-content:center;align-items:center;display:inline-flex}.pagination-btn:hover:not(:disabled){border-color:var(--color-primary-400);color:var(--color-primary-600);background:var(--color-primary-50)}.pagination-btn.active{background:var(--color-primary-600);color:#fff;border-color:var(--color-primary-700);box-shadow:var(--shadow-glow-primary)}.pagination-btn:disabled{opacity:.4;cursor:not-allowed}.pagination-info{font-size:var(--text-base);color:var(--color-gray-500);font-variant-numeric:tabular-nums;padding:0 var(--space-2)}.pagination-info b{color:var(--color-dark-900);font-weight:var(--font-bold)}.table-actions{align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.table-actions .btn-secondary.btn-small{border-radius:var(--radius-md);border:1px solid var(--color-gray-200);font-weight:var(--font-semibold);font-size:var(--text-sm);color:var(--color-gray-700);transition:var(--transition-fast);background:#fff;padding:6px 14px}.table-actions .btn-secondary.btn-small:not(:disabled):hover{border-color:var(--color-primary-400);color:var(--color-primary-700);background:var(--color-primary-50);transform:none}.table-actions .btn-secondary.btn-small:disabled{opacity:.4}.table-actions .status-text{font-size:var(--text-base);font-variant-numeric:tabular-nums;color:var(--color-gray-600);padding:0}.pagination-row{padding:var(--space-3)0 var(--space-1);border-top:1px solid var(--color-gray-100);margin-top:var(--space-2);justify-content:space-between;align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.btn-ghost{border:1.5px solid var(--color-gray-300);color:var(--color-gray-700);background:0 0}.btn-ghost:hover:not(:disabled){background:var(--color-gray-100);border-color:var(--color-gray-400);color:var(--color-gray-900)}.btn-success{color:#fff;background:linear-gradient(135deg,#10b981 0%,#059669 100%);box-shadow:0 4px 14px #10b98152}.btn-success:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 24px #10b9816b}.btn-loading{pointer-events:none;position:relative;color:#0000!important}.btn-loading:after{content:"";border-radius:var(--radius-full);border:2px solid #ffffff59;border-top-color:#fff;width:16px;height:16px;margin:auto;animation:.7s linear infinite spin;position:absolute;inset:0}.btn-secondary.btn-loading:after{border-color:#2563eb40;border-top-color:var(--color-primary-600)}.btn-xs{font-size:var(--text-xs);border-radius:var(--radius-sm);gap:4px;padding:4px 10px}select.input{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-position:right 10px center;background-repeat:no-repeat;padding-right:36px}select.input:focus{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E")}.input::placeholder,.textarea::placeholder{color:var(--color-gray-400);font-weight:var(--font-normal)}.input.input-error,.textarea.input-error{border-color:var(--color-danger);background:#fff5f5}.input.input-error:focus,.textarea.input-error:focus{border-color:var(--color-danger);box-shadow:0 0 0 3px #ef444429}.input.input-success,.textarea.input-success{background:#f0fdf8;border-color:#10b981}.input.input-success:focus,.textarea.input-success:focus{border-color:#10b981;box-shadow:0 0 0 3px #10b98129}input[type=date].input,input[type=time].input,input[type=datetime-local].input{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}.form-row{align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.form-row .label{flex-shrink:0;min-width:120px}.input-group{align-items:center;display:flex;position:relative}.input-group .input{width:100%}.input-group-prefix,.input-group-suffix{color:var(--color-gray-400);pointer-events:none;font-size:var(--text-base);align-items:center;display:flex;position:absolute}.input-group-prefix{left:10px}.input-group .input:not(:first-child){padding-left:32px}.input-group-suffix{right:10px}.input-group .input:not(:last-child){padding-right:32px}.form-hint{font-size:var(--text-xs);color:var(--color-gray-400);line-height:var(--line-relaxed);margin-top:2px}.form-error{font-size:var(--text-xs);color:var(--color-danger);align-items:center;gap:4px;margin-top:2px;display:flex}.form-field:focus-within>.label,.form-group:focus-within>.label{color:var(--color-primary-600);transition:color .15s}input[type=checkbox]:not(.ios-switch input){appearance:none;border:1.5px solid var(--color-gray-300);cursor:pointer;vertical-align:middle;background:#fff;border-radius:4px;flex-shrink:0;width:16px;min-width:16px;height:16px;transition:border-color .15s,background .15s,box-shadow .15s;position:relative}input[type=checkbox]:not(.ios-switch input):hover{border-color:var(--color-primary-400)}input[type=checkbox]:not(.ios-switch input):checked{background:var(--color-primary-600);border-color:var(--color-primary-600)}input[type=checkbox]:not(.ios-switch input):checked:after{content:"";border:2px solid #fff;border-top:none;border-left:none;width:5px;height:9px;position:absolute;top:1px;left:4px;transform:rotate(45deg)}input[type=checkbox]:not(.ios-switch input):focus-visible{outline:none;box-shadow:0 0 0 3px #2563eb38}input[type=checkbox]:not(.ios-switch input):disabled{opacity:.45;cursor:not-allowed}.ios-switch input[type=checkbox]{all:unset;opacity:0;pointer-events:none;width:0;height:0;position:absolute}input[type=radio]{appearance:none;border:1.5px solid var(--color-gray-300);border-radius:var(--radius-full);cursor:pointer;vertical-align:middle;background:#fff;flex-shrink:0;width:16px;min-width:16px;height:16px;transition:border-color .15s,background .15s;position:relative}input[type=radio]:hover{border-color:var(--color-primary-400)}input[type=radio]:checked{border-color:var(--color-primary-600);background:#fff}input[type=radio]:checked:after{content:"";border-radius:var(--radius-full);background:var(--color-primary-600);position:absolute;inset:3px}input[type=radio]:focus-visible{outline:none;box-shadow:0 0 0 3px #2563eb38}input[type=radio]:disabled{opacity:.45;cursor:not-allowed}