/* Compatibility copy of styles.css with legacy variables namespaced for the React design tokens. */
:root {
  color-scheme: light;
  --legacy-purple: #7461a8;
  --legacy-purple-dark: #5d4b91;
  --legacy-ink: #243047;
  --legacy-muted: #788398;
  --legacy-line: #dce1e9;
  --legacy-bg: #f7f8fa;
  --legacy-card: #fff;
  --legacy-ok: #16805b;
  --legacy-warning: #9b6800;
  --legacy-danger: #b13d4b;
  --legacy-auth-purple: #714b67;
  --legacy-auth-purple-dark: #5b3b54;
  --legacy-auth-purple-tint: #f1e9ee;
  --legacy-auth-page-bg: #f6f3f4;
  --legacy-auth-text: #2b2226;
  --legacy-auth-secondary: #766b72;
  --legacy-auth-border: #e7dfe4;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; color: var(--legacy-ink); background: var(--legacy-bg); font-size: 14px; }
button, input, select { font: inherit; }
button { cursor: pointer; }
.topbar { min-height: 54px; padding: 0 24px; display: flex; align-items: center; gap: 26px; color: #fff; background: var(--legacy-purple); }
.brand { display: flex; align-items: center; gap: 10px; font-weight: 700; white-space: nowrap; }
.brand-mark { font-size: 24px; line-height: 1; }
nav { display: flex; align-self: stretch; gap: 22px; align-items: center; }
.topbar-nav { min-width: 0; }
nav a { color: #f5f2ff; text-decoration: none; opacity: .9; padding: 18px 0 16px; border-bottom: 2px solid transparent; }
nav a:hover, nav a.active { opacity: 1; border-bottom-color: #fff; }
.topbar-user { display: flex; min-width: 0; align-items: center; gap: 9px; margin-left: auto; color: #f5f2ff; font-size: 12px; font-weight: 700; white-space: nowrap; }
.topbar-user > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.topbar-user[hidden] { display: none; }
.topbar-user-button { min-height: 28px; padding: 0 9px; border: 1px solid #d8d0ef; border-radius: 4px; color: #fff; background: transparent; font-size: 12px; font-weight: 700; }
.topbar-user-button:hover { background: #ffffff1c; }
.topbar-status { display: grid; width: 26px; height: 26px; margin-left: auto; place-items: center; }
.status-dot { display: block; width: 9px; height: 9px; border: 1px solid #fff; border-radius: 99px; background: #ffc107; transition: background .15s ease; }
.status-dot[data-state="connected"] { background: var(--legacy-ok); }
.status-dot[data-state="degraded"], .status-dot[data-state="checking"] { background: #ffc107; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.page-shell { max-width: 1480px; margin: 0 auto; padding: 30px 28px 70px; }
.page-heading { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; margin-bottom: 24px; }
.eyebrow { color: var(--legacy-purple); font-size: 11px; letter-spacing: .1em; font-weight: 800; margin: 0 0 7px; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 8px; font-size: clamp(24px, 3vw, 34px); letter-spacing: -.02em; }
h2 { margin-bottom: 4px; font-size: 18px; }
h3 { margin-bottom: 3px; font-size: 15px; }
.muted { color: var(--legacy-muted); }
.heading-actions, .modal-actions { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.auth-panel { margin-bottom: 18px; }
.auth-panel[hidden] { display: none; }
.auth-panel .eyebrow { margin-bottom: 7px; }
.auth-panel h2 { margin-bottom: 0; }
.auth-environment { display: inline-flex; margin: 10px 0 0; padding: 4px 8px; border: 1px solid #d8d0ef; border-radius: 4px; color: var(--legacy-purple-dark); background: #f3f0fb; font-size: 11px; font-weight: 800; letter-spacing: .06em; }
.auth-environment-live { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.auth-form { display: block; margin-top: 32px; }
.auth-form[hidden] { display: none !important; }
.auth-form > label { display: block; }
.auth-form [hidden] { display: none !important; }
.auth-form-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 24px; }
.auth-form .btn { flex: 0 0 auto; }
.auth-card > .notice { margin: 16px 0 0; }
body.auth-locked { overflow: hidden; background: var(--legacy-auth-page-bg); }
body.auth-locked > .topbar,
body.auth-locked > .app-layout > .mode-sidebar,
body.auth-locked > .app-layout > .page-shell > :not(#authPanel) { display: none !important; }
body.auth-locked > .app-layout { display: block; min-height: 100vh; }
body.auth-locked > .app-layout > .page-shell { width: 100%; max-width: none; min-height: 100vh; margin: 0; padding: 0; }
.auth-gate:not([hidden]) { position: fixed; z-index: 2000; inset: 0; display: grid !important; place-items: center; margin: 0; padding: clamp(8px, 3dvh, 24px); overflow: auto; border: 0; border-radius: 0; background: var(--legacy-auth-page-bg); box-shadow: none; }
.auth-card { width: min(400px, 100%); max-height: none; overflow: visible; padding: clamp(16px, 4dvh, 40px); border: 1px solid var(--legacy-auth-border); border-radius: 16px; background: #fff; box-shadow: 0 1px 2px #0000000a, 0 8px 24px #2b22260f; }
.auth-mark { display: flex; width: 44px; height: 44px; align-items: center; justify-content: center; margin-bottom: 24px; border-radius: 16px; background: var(--legacy-auth-purple); }
.auth-mark > span { width: 14px; height: 14px; transform: rotate(45deg); border-radius: 3px; background: #fff; }
.auth-card-heading { text-align: left; }
.auth-card-heading > .eyebrow { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.auth-card-heading h2 { color: var(--legacy-auth-text); font-size: 20px; font-weight: 700; letter-spacing: -.01em; }
.auth-card-heading .muted { margin: 6px 0 0; color: var(--legacy-auth-secondary); line-height: 1.55; }
.auth-profile-picker { position: relative; }
.auth-field-label { display: block; margin-bottom: 8px; color: var(--legacy-auth-secondary); font-size: 12px; font-weight: 500; line-height: 16px; }
.auth-profile-button { display: flex; width: 100%; min-height: 54px; align-items: center; justify-content: space-between; gap: 12px; padding: 0 16px; border: 1px solid var(--legacy-auth-border); border-radius: 12px; color: var(--legacy-auth-text); background: #fff; text-align: left; transition: border-color .15s, box-shadow .15s; }
.auth-profile-button:hover:not(:disabled) { border-color: var(--legacy-auth-purple); }
.auth-profile-button:focus-visible { outline: 2px solid color-mix(in srgb, var(--legacy-auth-purple) 30%, transparent); outline-offset: 2px; }
.auth-profile-button:disabled { cursor: wait; opacity: .65; }
.auth-profile-label { display: flex; min-width: 0; align-items: center; gap: 12px; }
.auth-profile-placeholder-icon { flex: 0 0 auto; width: 24px; height: 24px; color: var(--legacy-auth-secondary); }
.auth-profile-avatar, .auth-profile-option-avatar { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; border-radius: 999px; color: #fff; background: var(--legacy-auth-purple); font-weight: 500; }
.auth-profile-avatar { width: 28px; height: 28px; font-size: 11px; }
.auth-profile-text { min-width: 0; overflow: hidden; color: var(--legacy-auth-secondary); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.auth-profile-text.is-selected { color: var(--legacy-auth-text); font-weight: 500; }
.auth-profile-chevron { flex: 0 0 auto; width: 16px; height: 16px; color: var(--legacy-auth-secondary); transition: transform .2s; }
.auth-profile-chevron.is-open { transform: rotate(180deg); }
.auth-profile-menu { position: static; z-index: 20; width: 100%; max-height: none; overflow: visible; margin-top: 8px; padding: 6px; border: 1px solid var(--legacy-auth-border); border-radius: 12px; background: #fff; box-shadow: 0 8px 20px #2b22261a; }
.auth-profile-menu[hidden] { display: none !important; }
.auth-profile-option { display: flex; width: 100%; min-height: 44px; align-items: center; gap: 12px; padding: 7px 10px; border: 0; border-radius: 8px; color: var(--legacy-auth-text); background: transparent; text-align: left; }
.auth-profile-option:hover, .auth-profile-option:focus-visible, .auth-profile-option[aria-selected="true"] { background: var(--legacy-auth-purple-tint); }
.auth-profile-option:focus-visible { outline: 2px solid color-mix(in srgb, var(--legacy-auth-purple) 30%, transparent); outline-offset: -2px; }
.auth-profile-option-avatar { width: 36px; height: 36px; font-size: 13px; }
.auth-profile-option-name { min-width: 0; flex: 1; overflow: hidden; font-size: 14px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.auth-profile-option-check { flex: 0 0 auto; color: var(--legacy-auth-purple); font-size: 16px; font-weight: 700; opacity: 0; }
.auth-profile-option[aria-selected="true"] .auth-profile-option-check { opacity: 1; }
.auth-profile-native { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.auth-gate .auth-profile-continue { width: 100%; min-height: 44px; margin-top: 24px; border-radius: 12px; font-size: 14px; }
.auth-gate .auth-form input { min-height: 54px; border-color: var(--legacy-auth-border); border-radius: 12px; font-size: 16px; }
.auth-gate .auth-form input:focus { border-color: var(--legacy-auth-purple); box-shadow: 0 0 0 3px color-mix(in srgb, var(--legacy-auth-purple) 14%, transparent); }
.auth-gate .auth-form-actions .btn { min-height: 44px; border-radius: 10px; }
body.auth-initializing .auth-gate .auth-form,
body.auth-initializing .auth-gate .auth-environment-step,
body.auth-initializing .auth-gate > .auth-card > .notice { display: none !important; }
.auth-environment-step { width: 100%; margin-top: 24px; }
.auth-environment-step[hidden] { display: none !important; }
.auth-step-heading { margin-bottom: 16px; }
.auth-environment-heading { display: flex; align-items: flex-start; gap: 10px; }
.auth-step-heading-copy { min-width: 0; flex: 1; }
.auth-step-back { display: inline-grid; flex: 0 0 auto; width: 34px; height: 34px; place-items: center; margin: -2px 0 0 -4px; border: 1px solid var(--legacy-auth-border); border-radius: 10px; color: var(--legacy-auth-secondary); background: #fff; cursor: pointer; }
.auth-step-back:hover, .auth-step-back:focus-visible { border-color: var(--legacy-auth-purple); color: var(--legacy-auth-purple-dark); background: var(--legacy-auth-purple-tint); outline: none; }
.auth-step-back:focus-visible { box-shadow: 0 0 0 3px color-mix(in srgb, var(--legacy-auth-purple) 14%, transparent); }
.auth-step-back svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.auth-step-heading .muted { margin-bottom: 0; line-height: 1.5; }
.auth-environment-options { display: grid; grid-template-columns: 1fr; gap: 10px; }
.auth-environment-option { display: flex; align-items: flex-start; gap: 10px; min-height: 72px; padding: 12px; border: 1px solid var(--legacy-auth-border); border-radius: 10px; color: var(--legacy-auth-text); background: #fff; cursor: pointer; transition: border-color .15s, background .15s; }
.auth-environment-option:hover:not(.is-disabled), .auth-environment-option:focus-within:not(.is-disabled) { border-color: var(--legacy-auth-purple); background: var(--legacy-auth-purple-tint); }
.auth-environment-option.is-selected { border-color: var(--legacy-auth-purple); background: var(--legacy-auth-purple-tint); box-shadow: inset 3px 0 0 var(--legacy-auth-purple); }
.auth-environment-option.is-disabled { color: var(--legacy-muted); background: var(--legacy-bg); cursor: not-allowed; opacity: .7; }
.auth-environment-option > input { flex: 0 0 auto; width: 18px; height: 18px; min-height: 18px; margin: 2px 0 0; padding: 0; border: 0; accent-color: var(--legacy-auth-purple); }
.auth-environment-option-copy { display: block; min-width: 0; flex: 1; }
.auth-environment-option-copy strong, .auth-environment-option-copy small { display: block; }
.auth-environment-option-copy strong { color: var(--legacy-auth-text); font-size: 14px; }
.auth-environment-option-copy small { margin-top: 4px; color: var(--legacy-muted); font-size: 11px; line-height: 1.4; }
.auth-environment-option-state { flex: 0 0 auto; padding: 3px 7px; border: 1px solid #d8d0ef; border-radius: 999px; color: var(--legacy-auth-purple-dark); background: var(--legacy-auth-purple-tint); font-size: 11px; font-weight: 700; white-space: nowrap; }
.auth-environment-option.is-disabled .auth-environment-option-state { color: var(--legacy-muted); border-color: var(--legacy-line); background: #fff; }
.auth-environment-actions { display: grid; grid-template-columns: 1fr; gap: 8px; margin-top: 16px; }
.auth-environment-actions .btn { min-width: 0; min-height: 44px; border-radius: 10px; }
.auth-environment-actions .btn { width: 100%; }
.btn { min-height: 38px; border: 1px solid transparent; border-radius: 5px; padding: 0 15px; font-weight: 700; transition: background .15s, box-shadow .15s, transform .15s; }
.btn:active { transform: translateY(1px); }
.btn:disabled { cursor: not-allowed; opacity: .48; }
.btn-primary { color: #fff; background: var(--legacy-purple); box-shadow: 0 2px 5px #53477b2b; }
.btn-primary:hover:not(:disabled) { background: var(--legacy-purple-dark); }
.btn-secondary { color: var(--legacy-ink); border-color: #cfd5df; background: #fff; }
.btn-secondary:hover:not(:disabled) { background: #f0eff6; border-color: var(--legacy-purple); }
.notice { margin: 0 0 18px; padding: 11px 14px; border-radius: 5px; border: 1px solid; line-height: 1.45; }
.notice-info { color: #315a85; background: #eff6ff; border-color: #c6ddf7; }
.notice-error { color: #8e2937; background: #fff1f3; border-color: #f0c5cb; }
.notice-success { color: #126b4c; background: #ecfaf4; border-color: #bce8d5; }
.admin-sync-card { margin-bottom: 18px; }
.admin-sync-card[hidden] { display: none; }
.admin-settings { display: grid; gap: 18px; margin-bottom: 18px; }
.admin-settings[hidden] { display: none; }
.admin-sync-toolbar { align-items: flex-start; }
.admin-sync-toolbar h2 { margin-bottom: 5px; }
.admin-sync-toolbar .status-badge { flex: 0 0 auto; margin-top: 2px; }
.admin-sync-body { padding: 16px 20px 20px; }
.admin-sync-body > .notice { margin-bottom: 12px; }
.admin-sync-meta { margin: 0 0 13px; color: var(--legacy-muted); font-size: 12px; }
.admin-users-card, .admin-environment-card { overflow: hidden; }
.admin-users-toolbar, .admin-environment-toolbar { align-items: flex-start; }
.admin-users-toolbar .heading-actions { align-items: flex-end; justify-content: flex-end; }
.admin-users-search { min-width: min(250px, 100%); }
.admin-users-body { padding: 0 20px 20px; }
.admin-users-body > .notice { margin: 16px 0 0; }
.admin-users-table { min-width: 900px; }
.admin-users-table td { font-size: 13px; }
.admin-user-name { color: var(--legacy-ink); font-weight: 800; }
.admin-user-meta { display: block; margin-top: 3px; color: var(--legacy-muted); font-size: 11px; }
.admin-user-role-list, .admin-user-warehouse-list { display: flex; flex-wrap: wrap; gap: 5px; max-width: 330px; }
.admin-user-role, .admin-user-warehouse { display: inline-flex; align-items: center; min-height: 24px; padding: 2px 7px; border: 1px solid #d9dce4; border-radius: 99px; color: #526075; background: #f7f8fa; font-size: 11px; line-height: 1.25; }
.admin-user-warehouse.is-inactive { color: #9a2d3d; border-color: #f0c5ca; background: #ffeff1; }
.admin-user-card { max-width: min(920px, calc(100% - 24px)); }
.admin-user-form-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.admin-access-section { padding-top: 17px; margin-top: 17px; border-top: 1px solid var(--legacy-line); }
.admin-choice-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 8px; }
.admin-choice { display: flex; align-items: flex-start; gap: 9px; min-height: 56px; padding: 9px 10px; border: 1px solid var(--legacy-line); border-radius: 4px; color: var(--legacy-ink); background: #fff; cursor: pointer; }
.admin-choice:hover, .admin-choice:focus-within { border-color: var(--legacy-purple); background: #fbfaff; }
.admin-choice input { width: 16px; height: 16px; margin: 2px 0 0; accent-color: var(--legacy-purple); }
.admin-choice input:disabled { cursor: not-allowed; }
.admin-choice-copy { min-width: 0; }
.admin-choice-title, .admin-choice-meta { display: block; }
.admin-choice-title { color: var(--legacy-ink); font-size: 13px; font-weight: 800; }
.admin-choice-meta { margin-top: 2px; color: var(--legacy-muted); font-size: 11px; font-weight: 400; line-height: 1.35; }
.admin-choice-empty { grid-column: 1 / -1; padding: 10px 0; color: var(--legacy-muted); font-size: 12px; }
.admin-environment-body { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 16px 20px 20px; }
.admin-environment-item { min-width: 0; padding: 10px 12px; border: 1px solid var(--legacy-line); border-radius: 4px; background: #fff; }
.admin-environment-item strong, .admin-environment-item span { display: block; }
.admin-environment-item strong { color: var(--legacy-ink); font-size: 13px; }
.admin-environment-item span { margin-top: 4px; color: var(--legacy-muted); font-size: 11px; overflow-wrap: anywhere; }
.admin-environment-toolbar .status-badge { flex: 0 0 auto; }
.admin-audit-card { overflow: hidden; }
.admin-audit-toolbar { align-items: flex-start; }
.admin-audit-filters { display: grid; grid-template-columns: repeat(5, minmax(120px, 1fr)) auto; gap: 10px; align-items: end; padding: 14px 20px; border-bottom: 1px solid var(--legacy-line); background: var(--legacy-bg); }
.admin-audit-filters label { min-width: 0; }
.admin-audit-filter-actions { display: flex; align-items: end; gap: 8px; flex-wrap: wrap; }
.admin-audit-body { padding: 0 20px 20px; }
.admin-audit-body > .notice { margin: 16px 0 0; }
.admin-audit-summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 58px; color: var(--legacy-muted); font-size: 12px; }
.admin-audit-pagination { display: flex; gap: 8px; }
.admin-audit-table { min-width: 980px; }
.admin-audit-table td { font-size: 13px; }
.admin-audit-event-name { color: var(--legacy-ink); font-weight: 800; }
.admin-audit-detail-card { max-width: min(920px, calc(100% - 24px)); }
.admin-audit-detail { max-height: min(58vh, 520px); margin: 0; padding: 14px; overflow: auto; border: 1px solid var(--legacy-line); border-radius: 4px; color: var(--legacy-ink); background: var(--legacy-bg); font: 12px/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.summary-card, .card { background: var(--legacy-card); border: 1px solid var(--legacy-line); border-radius: 7px; box-shadow: 0 4px 18px #25324c0b; }
.summary-card { min-height: 110px; padding: 17px 18px; }
.summary-card span, .summary-card small { color: var(--legacy-muted); display: block; }
.summary-card strong { display: block; margin: 8px 0 3px; font-size: 25px; }
.summary-card strong.ok { color: var(--legacy-ok); font-size: 18px; margin-top: 14px; }
.table-card { overflow: hidden; }
.card-toolbar { padding: 18px 20px 15px; display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; border-bottom: 1px solid var(--legacy-line); }
.receipt-heading-copy { min-width: 0; }
.receipt-view-tabs { display: inline-flex; flex-wrap: wrap; gap: 4px; margin-top: 14px; padding: 3px; border: 1px solid var(--legacy-line); border-radius: 5px; background: var(--legacy-bg); }
.receipt-view-tab { min-height: 32px; padding: 0 11px; border: 1px solid transparent; border-radius: 4px; color: var(--legacy-muted); background: transparent; font-size: 12px; font-weight: 700; }
.receipt-view-tab:hover, .receipt-view-tab:focus-visible { color: var(--legacy-purple-dark); background: #fff; outline: none; }
.receipt-view-tab.active { color: var(--legacy-purple-dark); border-color: #cfc6e8; background: #fff; box-shadow: 0 1px 2px #25324c0b; }
.receipt-view-count { display: inline-grid; min-width: 18px; height: 18px; margin-left: 4px; padding: 0 4px; place-items: center; border-radius: 99px; color: inherit; background: #f0eff6; font-size: 11px; line-height: 1; }
.search-box { min-width: min(330px, 100%); color: var(--legacy-muted); display: flex; align-items: center; gap: 7px; padding: 0 10px; border: 1px solid var(--legacy-line); background: #fff; border-radius: 4px; }
.search-box input { min-height: 38px; width: 100%; border: 0; outline: 0; color: var(--legacy-ink); }
.table-scroll { overflow-x: clip; }
table { width: 100%; border-collapse: collapse; min-width: 930px; }
th, td { padding: 13px 14px; border-bottom: 1px solid #e8ebf0; text-align: left; vertical-align: middle; }
th { background: #fafbfc; color: #6b7587; font-size: 11px; text-transform: uppercase; letter-spacing: .055em; white-space: nowrap; }
tbody tr:hover { background: #fbfaff; }
.empty-state { padding: 50px; text-align: center; color: var(--legacy-muted); }
.receipts-table { min-width: 1690px; }
.receipts-table th:first-child, .receipts-table td:first-child { min-width: 154px; }
.receipts-table th:nth-child(2), .receipts-table td:nth-child(2) { min-width: 125px; }
.receipts-table th:nth-child(3), .receipts-table td:nth-child(3) { min-width: 150px; }
.receipts-table th:nth-child(4), .receipts-table td:nth-child(4) { min-width: 170px; }
.receipts-table th:nth-child(5), .receipts-table td:nth-child(5) { min-width: 250px; }
.receipts-table th:nth-child(6), .receipts-table td:nth-child(6) { min-width: 150px; }
.receipts-table th:nth-child(9), .receipts-table td:nth-child(9) { min-width: 145px; }
.receipts-table th:nth-child(11), .receipts-table td:nth-child(11), .receipts-table th:nth-child(12), .receipts-table td:nth-child(12) { min-width: 118px; text-align: center; }
.receipts-table th:last-child, .receipts-table td:last-child { min-width: 110px; }
.receipt-scan-date, .receipt-document-date, .receipt-odoo-name, .receipt-operator, .receipt-ttn { white-space: nowrap; }
.receipt-id { color: var(--legacy-purple-dark); font-weight: 800; }
.source-label { color: var(--legacy-muted); font-size: 12px; margin-top: 3px; }
.receipt-ttn-link { color: var(--legacy-purple-dark); font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.receipt-file-cell { text-align: center; }
.receipt-file-link { display: inline-grid; place-items: center; width: 29px; height: 29px; border: 1px solid #cfc6e8; border-radius: 4px; color: var(--legacy-purple-dark); background: #fff; text-decoration: none; }
.receipt-file-link:hover, .receipt-file-link:focus-visible { border-color: var(--legacy-purple); background: #f3f0fa; outline: none; }
.receipt-file-link svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.receipt-file-empty { color: var(--legacy-muted); }
.status-badge, .badge { display: inline-flex; align-items: center; border-radius: 99px; padding: 4px 9px; background: #edf0f4; color: #526075; font-size: 12px; white-space: nowrap; }
.status-badge.review { color: #866000; background: #fff3d6; }
.status-badge.ready { color: #315b8d; background: #e8f1ff; }
.status-badge.created { color: #126b4c; background: #e6f8f0; }
.status-badge.error { color: #9a2d3d; background: #ffebee; }
.row-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; white-space: nowrap; }
.receipt-row-actions { display: grid; gap: 10px; justify-items: end; }
.receipt-row-actions .row-action { min-height: 30px; padding: 4px 8px; border-radius: 4px; }
.row-action { color: var(--legacy-purple-dark); background: transparent; border: 1px solid transparent; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.row-action:focus-visible { outline: 2px solid #cfc6e8; outline-offset: 2px; }
.row-action-danger { min-width: 88px; color: var(--legacy-danger); border-color: var(--legacy-danger); background: #fff; text-decoration: none; }
.row-action-danger:hover, .row-action-danger:focus-visible { color: #8f2737; border-color: #8f2737; background: #ffebee; }
.row-file-action { display: inline-grid; place-items: center; width: 29px; height: 29px; border: 1px solid #cfc6e8; border-radius: 4px; color: var(--legacy-purple-dark); background: #fff; text-decoration: none; }
.row-file-action:hover, .row-file-action:focus-visible { border-color: var(--legacy-purple); background: #f3f0fa; outline: none; }
.row-file-action svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.modal { border: 0; padding: 0; background: transparent; max-width: min(660px, calc(100% - 24px)); width: 100%; }
.modal-wide { max-width: min(1180px, calc(100% - 24px)); }
.modal::backdrop { background: #18203680; backdrop-filter: blur(2px); }
.modal-card { max-height: min(90vh, 900px); overflow-y: auto; padding: 24px; border: 1px solid var(--legacy-line); border-radius: 8px; background: #fff; box-shadow: 0 16px 60px #1c27424d; }
.action-confirm { position: fixed; z-index: 3000; inset: 0; display: grid; width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; place-items: center; padding: 24px; border: 0; background: transparent; }
.action-confirm::backdrop { background: #18203680; backdrop-filter: blur(2px); }
.action-confirm[hidden] { display: none; }
.confirm-card { position: relative; width: min(520px, 100%); padding: 26px; border: 1px solid #cfc6e8; border-radius: 8px; background: #fff; box-shadow: 0 16px 60px #1c27424d; }
.confirm-card h2 { margin-bottom: 10px; padding-right: 35px; }
.confirm-close { position: absolute; top: 18px; right: 18px; }
.confirm-message { margin-bottom: 13px; line-height: 1.55; }
.confirm-warning { margin: 0 0 18px; padding: 11px 13px; border: 1px solid #ead49d; border-radius: 5px; color: #735100; background: #fff8e5; line-height: 1.45; }
.confirm-fields { display: grid; gap: 12px; margin: 0 0 18px; }
.confirm-exclusion-field { display: grid; gap: 5px; color: var(--legacy-ink); font-size: 12px; font-weight: 700; line-height: 1.35; }
.confirm-exclusion-field textarea { width: 100%; min-height: 70px; resize: vertical; padding: 8px 10px; border: 1px solid #ccd3de; border-radius: 4px; color: var(--legacy-ink); background: #fff; outline-color: var(--legacy-purple); font-weight: 400; }
.confirm-fields.has-error .confirm-exclusion-field textarea:placeholder-shown { border-color: var(--legacy-danger); }
.confirm-fields-error { margin: 0; color: var(--legacy-danger); font-size: 12px; font-weight: 700; }
.confirm-actions { justify-content: flex-end; padding-top: 5px; }
.export-progress { position: fixed; z-index: 3500; inset: 0; display: grid; width: 100%; height: 100%; max-width: none; max-height: none; margin: auto; padding: 24px; place-items: center; overflow: auto; border: 0; color: var(--legacy-ink); background: transparent; }
.export-progress:not([open]) { display: none; }
.export-progress::backdrop { background: #18203680; backdrop-filter: blur(2px); }
.export-progress-card { position: relative; width: min(430px, 100%); padding: 28px 30px 24px; border: 1px solid var(--legacy-line); border-radius: 8px; background: #fff; box-shadow: 0 16px 60px #1c27424d; text-align: center; }
.export-progress-close { position: absolute; top: 14px; right: 14px; }
.export-progress-icon { display: grid; width: 54px; height: 54px; margin: 0 auto 17px; place-items: center; }
.export-progress-spinner, .export-progress-check, .export-progress-error, .export-progress-info { grid-area: 1 / 1; }
.export-progress-spinner { width: 46px; height: 46px; border: 4px solid #e7e3f0; border-top-color: var(--legacy-purple); border-radius: 50%; animation: export-progress-spin .9s linear infinite; }
.export-progress-check, .export-progress-error, .export-progress-info { display: none; width: 46px; height: 46px; place-items: center; border-radius: 50%; color: #fff; font-size: 28px; font-weight: 800; line-height: 1; }
.export-progress-check { background: var(--legacy-ok); }
.export-progress-error { background: var(--legacy-danger); font-size: 25px; }
.export-progress-info { background: var(--legacy-purple); font-size: 25px; font-style: italic; }
.export-progress.is-success .export-progress-spinner, .export-progress.is-error .export-progress-spinner, .export-progress.is-info .export-progress-spinner { display: none; }
.export-progress.is-success .export-progress-check, .export-progress.is-error .export-progress-error, .export-progress.is-info .export-progress-info { display: grid; animation: export-progress-icon-in .18s ease-out; }
.export-progress-card h2 { margin: 0; padding-right: 24px; font-size: 19px; line-height: 1.35; }
.export-progress-detail { min-height: 42px; margin: 8px 0 0; color: var(--legacy-muted); line-height: 1.5; }
.export-progress-steps { display: grid; gap: 7px; margin: 17px 0 0; padding: 14px 16px; border-top: 1px solid var(--legacy-line); border-bottom: 1px solid var(--legacy-line); text-align: left; }
.export-progress-steps[hidden] { display: none; }
.export-progress-step { display: flex; align-items: center; gap: 8px; color: var(--legacy-muted); font-size: 12px; line-height: 18px; }
.export-progress-step > span { width: 8px; height: 8px; flex: 0 0 8px; border-radius: 50%; background: var(--legacy-line); }
.export-progress-step.is-active { color: var(--legacy-ink); font-weight: 700; }
.export-progress-step.is-active > span { background: var(--legacy-purple); }
.export-progress-step.is-done { color: var(--legacy-ok); }
.export-progress-step.is-done > span { background: var(--legacy-ok); }
.export-progress-note { margin: 15px 0 0; color: var(--legacy-muted); font-size: 11px; line-height: 1.45; }
.export-progress-note strong { color: var(--legacy-ink); font-weight: 700; }
.export-progress.is-success .export-progress-steps, .export-progress.is-error .export-progress-steps, .export-progress.is-info .export-progress-steps { display: none; }
.export-progress.is-success .export-progress-note { color: var(--legacy-ok); }
.export-progress.is-error .export-progress-note { color: var(--legacy-danger); }
.export-progress.is-info .export-progress-note { color: var(--legacy-purple-dark); }
@keyframes export-progress-spin { to { transform: rotate(360deg); } }
@keyframes export-progress-icon-in { from { opacity: .35; transform: scale(.72); } to { opacity: 1; transform: scale(1); } }
.modal-heading { display: flex; justify-content: space-between; gap: 18px; margin-bottom: 16px; }
.icon-button { width: 33px; height: 33px; border: 0; border-radius: 4px; color: #677387; background: #f0f2f5; font-size: 23px; line-height: 1; }
.icon-button:hover { color: var(--legacy-purple-dark); background: #e8e5f2; }
.drop-zone { position: relative; min-height: 190px; border: 1px dashed #aaa2c8; border-radius: 7px; color: var(--legacy-purple-dark); background: #fbfaff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; padding: 18px; text-align: center; cursor: pointer; }
.drop-zone:hover, .drop-zone.is-dragover { border-color: var(--legacy-purple); background: #f7f4ff; }
.drop-zone-label { display: flex; flex-direction: column; align-items: center; gap: 7px; color: var(--legacy-purple-dark); font-size: 14px; font-weight: 700; cursor: pointer; }
.drop-zone-label span { color: var(--legacy-muted); font-size: 12px; font-weight: 400; }
.drop-zone input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.drop-icon { font-size: 28px; }
.drop-zone-controls { display: flex; justify-content: center; margin-top: 3px; }
.btn-small { min-height: 30px; padding: 0 10px; font-size: 12px; }
.file-name { min-height: 18px; color: var(--legacy-muted); font-size: 12px; font-weight: 400; }
.file-name.has-file { color: var(--legacy-ok); font-weight: 700; }
.form-row, .detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 18px 0; }
label { display: block; color: #536075; font-size: 12px; font-weight: 700; }
label > input, label > select, .autocomplete-field > input { display: block; width: 100%; min-height: 39px; margin-top: 6px; padding: 0 10px; border: 1px solid #ccd3de; border-radius: 4px; color: var(--legacy-ink); background: #fff; outline-color: var(--legacy-purple); font-weight: 400; }
.field-help { display: block; margin-top: 5px; color: var(--legacy-muted); font-size: 11px; font-weight: 400; }
.detail-grid { margin-top: 0; }
.detail-field-wide { grid-column: 1 / -1; }
.field-status { min-height: 1.15rem; }
.field-status--success { color: color-mix(in srgb, var(--legacy-ok) 76%, var(--legacy-ink)); }
.field-status--error { color: var(--legacy-danger); }
.field-status--checking { color: var(--legacy-muted); }
.field-status-content { display: inline-flex; max-width: 100%; align-items: center; gap: .35rem; }
.status-check-icon { display: block; width: .95rem; height: .95rem; flex: 0 0 .95rem; }
.lines-section { border-top: 1px solid var(--legacy-line); padding-top: 17px; }
.section-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 10px; }
.lines-scroll table { min-width: 900px; }
.lines-scroll th, .lines-scroll td { padding: 8px 10px; }
.lines-scroll th:first-child, .lines-scroll td:first-child { width: 36px; }
.lines-scroll th:nth-child(2), .lines-scroll td:nth-child(2) { min-width: 180px; max-width: 260px; }
.lines-scroll th:nth-child(3), .lines-scroll td:nth-child(3) { min-width: 215px; }
.lines-scroll input { min-width: 0; width: 100%; padding: 6px 8px; border: 1px solid #ccd3de; border-radius: 4px; }
.lines-scroll .line-product { min-width: 0; }
.lines-scroll .line-qty { min-width: 105px; }
.product-cell { position: relative; }
.product-line-picker { display: grid; min-width: 0; gap: .28rem; }
.product-line-feedback:empty { display: none; }
.product-match-feedback { display: inline-flex; max-width: 100%; align-items: flex-start; gap: .32rem; color: var(--legacy-muted); font-size: .75rem; font-weight: 600; line-height: 1.3; white-space: normal; }
.product-match-feedback--success { color: color-mix(in srgb, var(--legacy-ok) 78%, var(--legacy-ink)); }
.product-match-feedback--success .status-check-icon { margin-top: .02rem; }
.product-match-feedback--pending { color: var(--legacy-warning); }
.autocomplete-field { position: relative; }
.suggestions { position: fixed; z-index: 2000; box-sizing: border-box; max-height: 280px; overflow: auto; background: #fff; border: 1px solid #c8c3da; border-radius: 4px; box-shadow: 0 8px 25px #2d24421f; }
.suggestions.is-upward { box-shadow: 0 -8px 25px #2d24421f; }
.suggestions button { display: block; width: 100%; padding: 9px 10px; border: 0; border-bottom: 1px solid #eef0f4; background: #fff; color: var(--legacy-ink); text-align: left; cursor: pointer; }
.suggestions button:hover, .suggestions button:focus-visible { background: #f3f0fa; outline: none; }
.suggestions button strong, .suggestions button small { display: block; }
.suggestions button strong { font-size: 13px; line-height: 1.35; }
.suggestions button .suggestion-meta { margin-top: 2px; color: var(--legacy-muted); font-size: 11px; }
.suggestions button .suggestion-stock { margin-top: 3px; color: var(--legacy-purple-dark); font-size: 12px; font-weight: 700; }
.suggestions .suggestion-create { color: var(--legacy-purple-dark); font-weight: 700; }
.suggestions .autocomplete-message { margin: 0; padding: 9px 10px; }
.match-ok { color: var(--legacy-ok); font-size: 12px; font-weight: 700; }
.match-pending { color: var(--legacy-warning); font-size: 12px; font-weight: 700; }
.match-excluded { color: var(--legacy-muted); font-size: 12px; font-weight: 700; }
.number { text-align: right; }
.quantity-cell { min-width: 130px; }
.quantity-breakdown { display: grid; gap: 2px; margin-top: 5px; color: var(--legacy-muted); font-size: 11px; line-height: 1.35; text-align: left; }
.quantity-breakdown span:last-child { color: var(--legacy-purple-dark); font-weight: 700; }
.quantity-warning { margin-top: 6px; padding: 5px 7px; border: 1px solid #ead49d; border-radius: 4px; color: #735100; background: #fff8e5; font-size: 11px; line-height: 1.35; text-align: left; }
.quantity-review-control { display: flex; align-items: flex-start; gap: 5px; margin-top: 7px; color: #735100; font-size: 11px; font-weight: 700; line-height: 1.3; text-align: left; }
.quantity-review-control input { min-width: 15px !important; width: 15px; margin: 1px 0 0; padding: 0 !important; }
.odoo-transfer-cell { min-width: 145px; }
.odoo-exclusion-control { display: flex; align-items: flex-start; gap: 6px; color: var(--legacy-ink); font-size: 12px; font-weight: 700; line-height: 1.35; }
.odoo-exclusion-control input { min-width: 15px !important; width: 15px; margin: 1px 0 0; padding: 0 !important; }
.exclusion-reason { margin-top: 5px; color: var(--legacy-muted); font-size: 11px; font-weight: 400; line-height: 1.35; }
.detail-footer { display: flex; justify-content: space-between; align-items: center; gap: 15px; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--legacy-line); }
.original-link { color: var(--legacy-purple-dark); font-size: 12px; font-weight: 700; margin-left: 9px; }
@media (max-width: 850px) { .topbar { padding: 0 14px; gap: 14px; overflow-x: clip; } nav { gap: 13px; flex-wrap: wrap; } nav a { font-size: 12px; } .topbar-status { flex: 0 0 auto; } .page-shell { padding: 22px 14px 50px; } .page-heading, .card-toolbar, .detail-footer { align-items: stretch; flex-direction: column; } .auth-panel { grid-template-columns: 1fr; gap: 13px; } .summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; } .summary-card { padding: 10px; } .search-box { min-width: 0; } .form-row, .detail-grid { grid-template-columns: 1fr; } .detail-field-wide { grid-column: auto; } .modal-card, .confirm-card { padding: 18px; } }
@media (max-width: 600px) { .auth-environment-options { grid-template-columns: 1fr; } .auth-environment-actions { align-items: stretch; flex-direction: column-reverse; } .auth-environment-actions .btn { width: 100%; } }
@media (max-width: 600px) { .auth-gate:not([hidden]) { padding: 16px; } .auth-card { max-height: none; padding: clamp(16px, 4dvh, 28px); } .auth-form-actions, .auth-environment-actions { grid-template-columns: 1fr; } }
@media (max-height: 680px) {
  .auth-gate:not([hidden]) { padding: clamp(8px, 1.5dvh, 12px); }
  .auth-card { padding: clamp(12px, 2dvh, 16px); }
  .auth-mark { margin-bottom: clamp(8px, 1.2dvh, 12px); }
  .auth-gate .auth-profile-continue { margin-top: clamp(8px, 1.5dvh, 12px); }
  .auth-environment-step { margin-top: clamp(12px, 2dvh, 20px); }
  .auth-step-heading { margin-bottom: clamp(8px, 1.5dvh, 12px); }
}
@media (max-width: 480px) { .summary-grid { grid-template-columns: minmax(0, 1fr); gap: 8px; } .summary-card { padding: 10px; min-height: auto; } .summary-card strong { font-size: 18px; } }
@media (max-width: 850px) { .admin-users-toolbar .heading-actions { align-items: stretch; justify-content: flex-start; } .admin-users-search { width: 100%; } .admin-user-form-grid, .admin-environment-body { grid-template-columns: 1fr; } }
@media (max-width: 850px) { .admin-audit-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-audit-filter-actions { grid-column: 1 / -1; } .admin-audit-summary { align-items: flex-start; flex-direction: column; justify-content: center; } }