/* Single application theme. All palette values are declared here. */
:root {
  --app-background: #F2F5F4;
  --page-background: #E5E7E8;
  --surface: #FFFFFF;
  --surface-muted: #F7F9F7;
  --text: #171918;
  --muted: #626964;
  --border: #DDE3DF;
  --border-soft: #E7EAE8;
  --border-strong: #BCC6BE;
  --accent: #C8F34A;
  --accent-hover: #BCE83E;
  --accent-soft: #EDF6D8;
  --accent-text: #253C1E;
  --action: #346A50;
  --focus: #5D8838;
  --success: #317552;
  --success-soft: var(--accent-soft);
  --danger: #B42318;
  --danger-soft: var(--surface-muted);
  --danger-border: var(--border);
  --warning: #79642A;
  --warning-soft: var(--surface-muted);
  --info: #246A6D;
  --info-soft: var(--surface-muted);
  --chart-maincon: #346A50;
  --chart-subcon: #91AF65;
  --chart-margin: #66766B;
  --chart-paid: #C8F34A;
  --chart-area: #739C7B;
  --avatar: var(--accent-soft);
  --avatar-text: var(--accent-text);
  --scrim: #17231B55;
  --shadow: none;
}
a, a:visited { color: var(--action); }
/* styles.css: component appearance */
:root {
  font-family: Manrope, 'Segoe UI', sans-serif;
}
body {
  color: var(--text);
  background: var(--app-background);
}
button {
  background: transparent;
  color: inherit;
}
.topbar {
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}
.brand {
  border-right: 1px solid var(--border-soft);
}
.brand-mark {
  background: var(--accent);
  color: var(--action);
}
.brand span, .usertext span, .page-head p {
  color: var(--muted);
}
.topnav button {
  color: var(--action);
}
.topnav .active {
  color: var(--action);
  border-bottom-color: var(--action);
  background: var(--accent-soft);
}
.icon-btn {
  color: var(--muted);
}
.icon-btn:hover, .secondary:hover {
  border-color: var(--border);
  background: var(--surface);
}
.avatar {
  background: var(--surface-muted);
}
.primary {
  background: var(--accent);
  color: var(--accent-text);
}
.secondary {
  background: var(--surface);
  border: 1px solid var(--border);
}
.danger {
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--danger);
}
.tabs {
  background: var(--surface);
  border: 1px solid var(--border);
}
.tabs button {
  color: var(--action);
}
.tabs .active {
  color: var(--action);
  border-bottom-color: var(--action);
}
.metrics {
  background: var(--border);
  border: 1px solid var(--border);
}
.metric {
  background: var(--surface);
}
.metric span {
  color: var(--muted);
}
.filters, .table-area, .details {
  background: var(--surface);
  border: 1px solid var(--border);
}
.panel-title button, .label-row span:last-child {
  color: var(--action);
}
label {
  color: var(--text);
}
input, select {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
}
.status-box {
  border: 1px solid var(--border);
}
.table-tools, .table-foot {
  border-bottom: 1px solid var(--border-soft);
}
.table-foot {
  border-top: 1px solid var(--border-soft);
  color: var(--muted);
}
th, td {
  border-bottom: 1px solid var(--border-soft);
}
th {
  background: var(--surface);
  color: var(--action);
}
tbody tr:hover {
  background: var(--surface);
}
tbody tr.selected {
  background: var(--accent-soft);
  outline: 1px solid var(--border-strong);
}
.staff-subcon-pivot {
  border: 1px solid var(--border-soft);
  background: var(--surface);
}
.staff-pivot-monthly-total {
  border: 1px solid var(--accent-soft);
  background: var(--accent-soft);
}
.staff-pivot-monthly-total span {
  color: var(--muted);
}
.staff-pivot-monthly-total strong {
  color: var(--action);
}
.staff-subcon-pivot-head span,
.staff-subcon-pivot-head label {
  color: var(--muted);
}
.staff-subcon-pivot-head select,
.staff-subcon-pivot-head input {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
}
.staff-pivot-total {
  color: var(--action);
}
.claim-created-by {
  color: var(--action);
}
.staff-mode .register-table-panel .table-tools {
  border-bottom: 1px solid var(--border-soft);
}
.installer-dashboard-head span,
.installer-dashboard-head p {
  color: var(--muted);
}
.installer-kpi-order-types button {
  color: var(--muted);
  background: var(--surface-muted);
}
.installer-kpi-order-types button:hover {
  color: var(--text);
  background: var(--accent-soft);
}
.installer-kpi-order-types em {
  color: var(--muted);
}
.installer-month-card {
  border: 1px solid var(--border-soft);
  color: var(--muted);
  background: var(--surface);
}
.installer-month-card:hover {
  border-color: var(--border-strong);
  color: var(--action);
  background: var(--surface-muted);
}
.installer-month-card.active {
  border-color: var(--border-strong);
  color: var(--text);
  background: var(--accent-soft);
  box-shadow: none;
}
.installer-month-card.active:hover {
  color: var(--text);
  background: var(--accent-soft);
}
.installer-day-card {
  border: 1px solid var(--border-soft);
  background: var(--surface);
  color: inherit;
}
.installer-day-card:hover {
  border-color: var(--border-strong);
  box-shadow: none;
}
.installer-day-card:focus-visible {
  border-color: var(--focus);
  outline: 2px solid var(--focus);
}
.installer-day-card.is-confirmed {
  border-color: var(--border-soft);
  background: var(--success-soft);
}
.installer-day-card-head span,
.installer-day-total span {
  color: var(--muted);
}
.installer-confirm-button {
  color: var(--text);
  background: var(--accent-soft);
}
.installer-confirm-button:hover:not(:disabled) {
  background: var(--accent-soft);
}
.installer-confirm-button:disabled {
  color: var(--action);
  background: var(--surface-muted);
}
.installer-order-types span {
  color: var(--muted);
  background: var(--surface-muted);
}
.installer-day-total {
  border-top: 1px solid var(--border-soft);
}
.installer-day-total strong {
  color: var(--action);
}
.installer-day-confirm {
  border-top: 1px solid var(--border-soft);
}
.installer-day-confirm > span {
  color: var(--muted);
}
.installer-day-confirm button {
  color: var(--text);
  background: var(--accent-soft);
}
.installer-day-confirm button:hover:not(:disabled) {
  background: var(--accent-soft);
}
.installer-day-confirm button:disabled {
  color: var(--action);
  background: var(--surface-muted);
}
.installer-pivot-table th,
.installer-pivot-table td {
  border-bottom: 1px solid var(--border-soft);
}
.installer-pivot-table th {
  color: var(--muted);
  background: var(--surface-muted);
}
.installer-pivot-table .paid-value {
  color: var(--success);
}
.installer-empty {
  color: var(--muted);
}
.installer-order-detail-card {
  border: 1px solid var(--border-soft);
  background: var(--surface);
}
.installer-order-detail-card > div span,
.installer-order-detail-card dt {
  color: var(--muted);
}
.claim-pagination {
  border-top: 1px solid var(--border-soft);
  background: var(--surface);
}
.claim-pagination > span {
  color: var(--muted);
}
.claim-link {
  color: var(--action);
}
.scope {
  background: var(--surface-muted);
  color: var(--action);
}
.Draft {
  background: var(--surface-muted);
  color: var(--muted);
}
.Submitted {
  background: var(--warning-soft);
  color: var(--warning);
}
.UnderReview {
  background: var(--accent-soft);
  color: var(--action);
}
.Approved {
  background: var(--success-soft);
  color: var(--success);
}
.PartiallyPaid {
  background: var(--accent-soft);
  color: var(--action);
}
.Paid {
  background: var(--success-soft);
  color: var(--success);
}
.Rejected {
  background: var(--danger-soft);
  color: var(--danger);
}
.Cancelled {
  background: var(--surface-muted);
  color: var(--muted);
}
.pager button {
  border: 1px solid var(--border);
  color: var(--muted);
}
.pager .active {
  background: var(--accent-soft);
  color: var(--action);
  border-color: var(--border-strong);
}
.detail-head {
  border-bottom: 1px solid var(--border);
}
.detail-section {
  border-bottom: 1px solid var(--border-soft);
}
.kv span, .mini-row span, .timeline span {
  color: var(--muted);
}
.money-red {
  color: var(--danger);
}
.mini-row {
  border-bottom: 1px solid var(--border-soft);
}
.dot {
  background: var(--success);
}
.dot.pending {
  background: var(--warning-soft);
  border: 2px solid var(--border);
}
.detail-actions {
  background: var(--surface);
  border-top: 1px solid var(--border);
}
.approve {
  background: var(--success);
}
.reject {
  background: var(--danger);
}
.empty-detail {
  color: var(--muted);
}
dialog {
  box-shadow: none;
}
dialog::backdrop {
  background: var(--scrim);
}
.modal p {
  color: var(--muted);
}
.combined-form-section {
  border: 1px solid var(--border-soft);
  background: var(--surface);
}
@media (max-width: 600px) {
dialog.claim-dialog .add-modal {
  background: var(--surface);
}
dialog.claim-dialog .modal-head {
  border-bottom: 1px solid var(--border-soft);
  background: var(--surface);
}
dialog.claim-dialog .combined-form-section {
  background: var(--surface);
}
dialog.claim-dialog .modal-actions {
  border-top: 1px solid var(--border-soft);
  background: var(--surface);
  box-shadow: none;
}
}
.installer-search-detail-grid span,
.installer-claim-amount-panel > span {
  color: var(--muted);
}
.installer-claim-amount-panel > strong {
  color: var(--action);
}
html[data-theme="light"] .section-subcon-claim .field-subcon_name input[readonly]:not(:placeholder-shown) {
  border-color: var(--action);
  background: var(--accent-soft);
  color: var(--text);
  box-shadow: none;
}
html[data-theme="light"] body,
html[data-theme="light"] body * {
  font-family: Manrope, 'Segoe UI', sans-serif;
}
.pdf-action-btn {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
}
.pdf-action-btn.view {
  border-color: var(--action);
  background: var(--accent-soft);
  color: var(--text);
}
.pdf-action-btn:hover {
  border-color: var(--action);
  background: var(--accent-soft);
  color: var(--action);
}
.pdf-action-btn.view:hover {
  background: var(--accent-soft);
  color: var(--text);
}
html[data-theme="light"] .claimed-filter-toggle.active {
  border-color: var(--action);
  background: var(--accent-soft);
  color: var(--success);
  box-shadow: none;
}
html[data-theme="light"] .modal-eyebrow {
  color: var(--muted);
}
html[data-theme="light"] .record-modal-section {
  border: 1px solid var(--border-soft);
  background: var(--surface);
}
html[data-theme="light"] .daily-order-type-pivot .pivot-table thead th {
  background: var(--surface-muted) !important;
}
html[data-theme="light"] dialog.claim-dialog .popup-select-trigger.selected,
html[data-theme="light"] dialog.claim-dialog .section-subcon-claim .field-subcon_name input[readonly]:not(:placeholder-shown) {
  box-shadow: none;
}
.field-maincon_amount input[readonly],
.field-pricing_price input[readonly],
.field-pricing_fee_percent input[readonly],
.field-pricing_margin input[readonly],
.field-maincon_order_type input[readonly],
.field-subcon_name input[readonly],
.field-subcon_amount input[readonly],
.field-subcon_order_type input[readonly] {
  background: var(--surface-muted);
  color: var(--text);
}
.field-help {
  color: var(--muted);
}
.field-label {
  color: var(--muted);
}
.field-label small {
  color: var(--muted);
}
.popup-select-trigger {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
}
.popup-select-trigger:hover {
  border-color: var(--action);
  background: var(--surface);
}
.popup-select-trigger.selected {
  border-color: var(--action);
  background: var(--accent-soft);
  color: var(--text);
}
.popup-select-trigger.selected:hover {
  background: var(--accent-soft);
  color: var(--text);
}
.formatted-date-control {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
}
.formatted-date-control:focus-within,
.formatted-date-control:focus-visible,
.formatted-date-control:hover {
  border-color: var(--action);
}
.date-picker-popover {
  border: 1px solid var(--border);
  background: var(--surface);
  box-shadow: none;
}
.date-picker-header strong {
  color: var(--text);
}
.date-picker-header button,
.date-picker-days button {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
}
.date-picker-header button:hover,
.date-picker-days button:hover,
.date-picker-days button.selected {
  border-color: var(--accent-soft);
  background: var(--accent-soft);
  color: var(--action);
}
.date-picker-weekdays {
  color: var(--muted);
}
.popup-select-trigger small {
  color: var(--action);
}
.selection-option {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
}
.selection-option:hover {
  border-color: var(--action);
  background: var(--surface);
}
.selection-option.active {
  border-color: var(--action);
  background: var(--accent-soft);
  color: var(--text);
}
.partner-share-summary {
  background: var(--surface-muted);
  color: var(--muted);
}
.select-card {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
}
.select-card.active {
  border-color: var(--action);
  background: var(--accent-soft);
  color: var(--text);
}
.simple-metrics {
  border-top: 1px solid var(--border);
}
.helper-text {
  color: var(--muted);
}
.simple-table small {
  color: var(--muted);
}
.balance {
  color: var(--danger);
}
.simple-detail-head {
  border-bottom: 1px solid var(--border-soft);
}
.simple-detail-head p {
  color: var(--muted);
}
.simple-total {
  background: var(--surface-muted);
  border-bottom: 1px solid var(--border-soft);
}
.simple-total span {
  color: var(--muted);
}
.simple-total strong {
  color: var(--danger);
}
.simple-list div {
  border-bottom: 1px solid var(--border-soft);
}
.simple-list span {
  color: var(--muted);
}
.simple-actions {
  background: var(--surface);
  border-top: 1px solid var(--border);
}
.register {
  background: var(--app-background);
}
.login-screen {
  background: var(--surface);
}
.login-card {
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: none;
}
.login-error {
  color: var(--danger);
}
.login-hint {
  color: var(--muted);
}
.register-top {
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}
.qid-link {
  border: 1px solid var(--border);
  background: var(--accent-soft);
  color: var(--action);
}
.qid-link:hover,
.qid-link:focus-visible {
  border-color: var(--action);
}
.qid-slider-backdrop {
  background: var(--surface-muted);
}
.qid-slider-panel {
  border-left: 1px solid var(--border);
  background: var(--surface);
  box-shadow: none;
}
.qid-slider-head {
  border-bottom: 1px solid var(--border);
}
.qid-slider-head span,
.qid-profile span,
.qid-summary-grid span {
  color: var(--muted);
}
.qid-profile div,
.qid-summary-grid div,
.qid-status-list div,
.qid-order-card {
  border: 1px solid var(--border-soft);
  background: var(--surface);
}
.qid-order-card {
  color: inherit;
}
.qid-order-card:hover {
  border-color: var(--action);
  background: var(--accent-soft);
}
.qid-order-card span {
  color: var(--muted);
}
.qid-order-card em {
  color: var(--action);
}
.app-sidebar {
  border-right: 1px solid var(--border);
  background: var(--surface);
}
.app-sidebar button {
  color: var(--text);
}
.app-sidebar button:hover {
  background: var(--surface-muted);
}
.app-sidebar button.active {
  background: var(--accent-soft);
  color: var(--text);
}
.processing-pivot-panel {
  border: 1px solid var(--border-soft);
  background: var(--surface);
  box-shadow: none;
}
.processing-pivot-head {
  border-bottom: 1px solid var(--border-soft);
  background: var(--surface-muted);
}
.processing-pivot-kicker {
  color: var(--action);
}
.processing-pivot-head h2 {
  color: var(--text);
}
.processing-pivot-head p {
  color: var(--action);
}
.processing-pivot-table th,
.processing-pivot-table td {
  border-right: 1px solid var(--border-soft);
  border-bottom: 1px solid var(--border-soft);
}
.processing-pivot-table tr > :first-child {
  border-left: 1px solid var(--border-soft);
}
.processing-pivot-table thead th {
  border-top: 1px solid var(--border-soft);
  border-bottom-color: var(--border-soft);
  background: var(--surface-muted);
  color: var(--text);
}
.processing-pivot-table .processing-pivot-year > * {
  background: var(--surface-muted);
}
.processing-pivot-table .processing-pivot-quarter > * {
  background: var(--surface);
}
.processing-pivot-table .processing-pivot-month > * {
  background: var(--surface);
}
.processing-pivot-table .processing-pivot-month .processing-pivot-fulfilment,
.processing-pivot-table .processing-pivot-month .processing-pivot-assurance {
  background: var(--surface-muted);
  color: var(--action);
}
.processing-pivot-table .processing-pivot-total {
  background: var(--surface-muted);
  color: var(--action);
}
.processing-pivot-table .processing-pivot-month .processing-pivot-total {
  background: var(--accent-soft);
}
.processing-pivot-table tfoot > tr > * {
  border-top: 2px solid var(--border-soft);
  background: var(--surface-muted);
  color: var(--text);
}
.processing-pivot-toggle {
  color: inherit;
}
.processing-pivot-toggle span {
  border: 1px solid var(--border-soft);
  background: var(--surface);
}
.processing-pivot-empty {
  color: var(--action);
}
.settings-panel {
  border: 1px solid var(--border);
  background: var(--surface);
}
.settings-intro {
  color: var(--muted);
}
.settings-menu-card {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
}
.settings-menu-card:hover {
  border-color: var(--action);
  background: var(--accent-soft);
}
.settings-menu-card span {
  color: var(--action);
}
.settings-menu-card small {
  color: var(--muted);
}
.settings-danger-zone {
  border: 1px solid var(--danger-soft);
  background: var(--danger-soft);
}
.settings-backup-zone {
  border: 1px solid var(--border);
  background: var(--surface);
}
.settings-backup-zone strong {
  color: var(--text);
}
.settings-backup-zone span {
  color: var(--muted);
}
.settings-danger-zone strong {
  color: var(--danger);
}
.settings-danger-zone span {
  color: var(--muted);
}
.price-settings-panel {
  border: 1px solid var(--border);
  background: var(--surface);
}
.role-management-panel {
  border: 1px solid var(--border);
  background: var(--surface);
}
.user-management-panel {
  border: 1px solid var(--border);
  background: var(--surface);
}
.user-management-head p {
  color: var(--muted);
}
.user-management-section {
  border: 1px solid var(--border-soft);
  background: var(--surface);
}
.user-section-heading p {
  color: var(--muted);
}
.user-active-toggle {
  color: var(--muted);
}
.user-active-toggle input {
  accent-color: var(--action, var(--action));
}
.user-management-table-wrap {
  border-top: 1px solid var(--border-soft);
}
.role-management-head p {
  color: var(--muted);
}
.price-settings-head p {
  color: var(--muted);
}
.price-rule-note {
  border: 1px solid var(--border-soft);
  background: var(--surface-muted);
  color: var(--action);
}
.price-input span {
  color: var(--muted);
}
.calculated-input input[readonly] {
  color: var(--text);
  background: var(--surface-muted);
}
.settings-grid {
  border: 1px solid var(--border);
  background: var(--border);
}
.settings-grid div {
  background: var(--surface);
}
.settings-grid span {
  color: var(--muted);
}
.register-summary {
  border: 1px solid var(--border);
  background: var(--border);
}
.register-summary div {
  background: var(--surface);
}
.register-summary span {
  color: var(--muted);
}
.register-summary em {
  color: var(--muted);
}
.claimed-summary-card strong {
  color: var(--success);
}
.dashboard-kpi,
.viz-panel {
  border: 1px solid var(--border);
  background: var(--surface);
}
.dashboard-kpi span,
.dashboard-kpi em,
.panel-head span,
.bar-row span,
.recent-list span,
.recent-list em,
.mind-node span {
  color: var(--muted);
}
.dashboard-kpi.good strong {
  color: var(--success);
}
.dashboard-kpi.bad strong {
  color: var(--danger);
}
.claim-sheet-tabs {
  border-bottom: 1px solid var(--border-soft);
  background: var(--surface);
}
.claim-sheet-tabs button {
  background: transparent;
  color: var(--muted);
}
.claim-sheet-tabs button.active {
  border-bottom-color: var(--action);
  color: var(--text);
}
.dashboard-pivot-link {
  background: transparent;
  color: var(--text);
  text-decoration-color: transparent;
}
.dashboard-pivot-link:hover,
.dashboard-pivot-link:focus-visible {
  color: var(--action);
  text-decoration-color: currentColor;
}
.dashboard-subcon-order-card:hover,
.dashboard-subcon-order-card:focus-visible {
  border-color: var(--action);
  box-shadow: none;
}
.claim-select-column input {
  accent-color: var(--action);
}
html[data-theme="light"] #claimTable.combined-claim-table .status-action-header input,
html[data-theme="light"] #claimTable.combined-claim-table .claim-select-checkbox {
  accent-color: var(--action);
}
.bulk-delete-btn:disabled {
  box-shadow: none;
}
.bar-track,
.mini-track {
  background: var(--surface-muted);
}
.bar-track i,
.mini-track i {
  background: var(--action);
}
.trend-chart {
  color: var(--action);
}
.trend-chart svg {
  border: 1px solid var(--border-soft);
  background: var(--surface-muted);
}
.trend-axis {
  color: var(--muted);
}
.trend-axis strong {
  color: var(--text);
}
.dashboard-month-slider button {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
}
.dashboard-month-slider button:hover,
.dashboard-month-slider button.active {
  border-color: var(--action);
  background: var(--accent-soft);
  color: var(--text);
}
.monthly-total-table th,
.monthly-total-table td {
  border-bottom: 1px solid var(--border-soft);
}
.monthly-total-table th {
  color: var(--muted);
}
.monthly-total-table tfoot th {
  background: var(--surface);
  color: var(--text);
}
.dashboard-qid-card {
  border: 1px solid var(--border-soft);
  background: var(--surface);
  color: inherit;
}
.dashboard-qid-card:hover,
.dashboard-qid-card:focus-visible {
  border-color: var(--action);
  background: var(--accent-soft);
}
.dashboard-qid-card strong {
  color: var(--action);
}
.dashboard-qid-card span,
.dashboard-qid-card em {
  color: var(--muted);
}
.maincon-status-row span {
  color: var(--muted);
}
.maincon-status-track {
  background: var(--surface-muted);
}
.maincon-status-track i {
  background: var(--action);
}
.maincon-status-row.claimed .maincon-status-track i {
  background: var(--success);
}
.status-donut {
  background: conic-gradient(var(--chart-paid) 0 var(--paid), var(--chart-subcon) var(--paid) var(--submitted), var(--chart-maincon) var(--submitted) 100%);
}
.status-donut div {
  background: var(--surface);
}
.donut-legend span {
  color: var(--muted);
}
.paid-dot {
  background: var(--success);
}
.submitted-dot {
  background: var(--action);
}
.pending-dot {
  background: var(--warning);
}
.margin-buckets div,
.recent-list div {
  border: 1px solid var(--border-soft);
  background: var(--surface);
}
.pivot-table th,
.pivot-table td {
  border-bottom: 1px solid var(--border-soft);
}
.pivot-table th {
  color: var(--muted);
}
.daily-order-type-pivot th:first-child,
.daily-order-type-pivot td:first-child {
  background: var(--surface);
}
.mind-node {
  border: 1px solid var(--border-soft);
  background: var(--surface);
}
.mind-node.root {
  border-color: var(--border-soft);
  background: var(--surface-muted);
}
.order-lookup {
  border: 1px solid var(--border);
  background: var(--surface);
}
.order-lookup-search {
  border-bottom: 1px solid var(--border-soft);
}
.lookup-head {
  border-bottom: 1px solid var(--border-soft);
}
.lookup-head span,
.lookup-card span {
  color: var(--muted);
}
.lookup-panel {
  border: 1px solid var(--border-soft);
  background: var(--surface);
}
.lookup-card {
  border: 1px solid var(--border);
  background: var(--surface);
}
.lookup-detail-line {
  border-top: 1px dashed var(--border-soft);
}
.lookup-detail-line strong {
  color: var(--text);
}
.lookup-status.paid {
  background: var(--success-soft);
  color: var(--success);
}
.lookup-status.submitted {
  background: var(--warning-soft);
  color: var(--warning);
}
.lookup-status.pending {
  background: var(--accent-soft);
  color: var(--action);
}
.lookup-empty {
  color: var(--muted);
}
.register-tabs button {
  border: 1px solid var(--border);
  background: var(--surface);
}
.register-tabs button.active {
  border-color: var(--action);
  background: var(--accent-soft);
  color: var(--text);
}
.entry-panel,
.register-table-panel {
  background: var(--surface);
  border: 1px solid var(--border);
}
.clickable-row:hover td,
.clickable-row:focus td {
  background: var(--surface-muted);
}
.panel-subtitle {
  color: var(--muted);
}
.claim-update-panel {
  border: 1px solid var(--border);
  background: var(--surface);
}
.claim-match-head,
.claim-match-results-head {
  border-bottom: 1px solid var(--border-soft);
}
.claim-match-head p {
  color: var(--muted);
}
.claim-match-input {
  border-bottom: 1px solid var(--border-soft);
  background: var(--surface);
}
.claim-match-input label {
  color: var(--text);
}
.claim-match-input textarea {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
}
.claim-match-input textarea:focus {
  border-color: var(--action);
  outline: 2px solid var(--focus);
}
.claim-match-input-footer span {
  color: var(--muted);
}
.claim-match-apply-fields label {
  color: var(--muted);
}
#claimUpdateTable .claim-match-total-row td {
  border-top: 2px solid var(--border);
  background: var(--surface-muted);
}
#claimUpdateTable .claim-update-order-row:hover td,
#claimUpdateTable .claim-update-order-row:focus td {
  background: var(--surface-muted);
}
.claim-update-summary {
  border-bottom: 1px solid var(--border-soft);
  background: var(--border-soft);
}
.claim-update-summary div {
  background: var(--surface);
}
.claim-update-summary span {
  color: var(--muted);
}
.match-result.matched {
  background: var(--success-soft);
  color: var(--success);
}
.match-result.already {
  background: var(--surface-muted);
  color: var(--action);
}
.match-result.not-found {
  background: var(--danger-soft);
  color: var(--danger);
}
.match-result.duplicate {
  background: var(--warning-soft);
  color: var(--warning);
}
.match-result.closest {
  background: var(--surface-muted);
  color: var(--action);
}
.use-closest-id {
  border: 1px solid var(--border-soft);
  background: var(--surface-muted);
  color: var(--action);
}
.empty-table-cell {
  color: var(--muted);
}
.batch-subtitle {
  color: var(--muted);
}
#claimTable tbody tr:nth-child(even) {
  background: var(--surface);
}
.batch-insight {
  border-bottom: 1px solid var(--border);
  background: var(--border);
}
.batch-insight div {
  background: var(--surface);
}
.batch-insight span {
  color: var(--muted);
}
.claimed-ok,
.margin-ok {
  color: var(--success);
}
.unclaimed-warn {
  color: var(--warning);
}
.margin-bad {
  color: var(--danger);
}
.status-pill.claimed {
  background: var(--success-soft);
  color: var(--success);
}
.status-pill.unclaimed {
  background: var(--warning-soft);
  color: var(--warning);
}
@media (max-width: 850px) {
.app-sidebar {
  border-bottom: 1px solid var(--border);
}
}
@media (max-width: 760px) {
.topnav {
  border-top: 1px solid var(--border-soft);
}
}
.app-sidebar button:hover,
.secondary:hover,
.icon-btn:hover,
.role-management-table tbody tr:hover td,
.user-management-table tbody tr:hover td,
.price-settings-table tbody tr:hover td {
  background: var(--surface-muted);
  color: var(--text);
}
.dashboard-kpi:hover,
.viz-panel:hover,
.theme-card:hover,
.role-management-panel:hover,
.user-management-panel:hover,
.price-settings-panel:hover {
  color: var(--text);
}
html[data-theme="light"],
html[data-theme="light"] body,
html[data-theme="light"] body.register,
html[data-theme="light"] .app-shell,
html[data-theme="light"] .register-page,
html[data-theme="light"] .dashboard-board {
  background: var(--surface);
  background-image: none;
}
html[data-theme="light"] .register-top,
html[data-theme="light"] .register-body,
html[data-theme="light"] .app-sidebar,
html[data-theme="light"] .dashboard-kpi,
html[data-theme="light"] .viz-panel,
html[data-theme="light"] .register-table-panel,
html[data-theme="light"] .claim-update-panel,
html[data-theme="light"] .order-lookup,
html[data-theme="light"] .lookup-panel,
html[data-theme="light"] .settings-panel,
html[data-theme="light"] .price-settings-panel,
html[data-theme="light"] .role-management-panel,
html[data-theme="light"] .user-management-panel,
html[data-theme="light"] .combined-form-section,
html[data-theme="light"] dialog,
html[data-theme="light"] .modal {
  background: var(--surface);
  background-image: none;
  box-shadow: none;
  backdrop-filter: none;
}
html[data-theme="light"] {
  color-scheme: light;
  font-family: Manrope, 'Segoe UI', sans-serif;
}
html[data-theme="light"] body,
html[data-theme="light"] body.register,
html[data-theme="light"] .app-shell,
html[data-theme="light"] .register-page,
html[data-theme="light"] .dashboard-board {
  background-color: var(--app-background);
  background-image: none;
}
html[data-theme="light"] body {
  color: var(--text);
}
html[data-theme="light"] body::before {
  background-image: none;
}
html[data-theme="light"] .register-top {
  border: 1px solid var(--border-soft);
  background: var(--surface);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-theme="light"] .brand-mark {
  border: 1px solid var(--border-soft);
  background: var(--surface-muted);
  color: var(--action);
  box-shadow: none;
}
html[data-theme="light"] .brand strong {
  color: var(--text);
}
html[data-theme="light"] .brand span {
  color: var(--muted);
}
html[data-theme="light"] .register-search input[type="search"] {
  background: var(--surface);
}
html[data-theme="light"] .register-body {
  background: transparent;
}
html[data-theme="light"] .app-sidebar {
  border: 1px solid var(--border-soft);
  background: var(--surface);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-theme="light"] .app-sidebar button {
  color: var(--muted);
}
html[data-theme="light"] .app-sidebar button:hover {
  border-color: var(--border-strong);
  background: var(--surface-muted);
  color: var(--action);
}
html[data-theme="light"] .app-sidebar button.active {
  border-color: var(--border-strong);
  background: var(--surface-muted);
  color: var(--action);
  box-shadow: none;
}
html[data-theme="light"] .register-page {
  background: transparent;
}
html[data-theme="light"] .register-top,
html[data-theme="light"] .register-body,
html[data-theme="light"] .app-sidebar,
html[data-theme="light"] .dashboard-kpi,
html[data-theme="light"] .viz-panel,
html[data-theme="light"] .register-table-panel,
html[data-theme="light"] .claim-update-panel,
html[data-theme="light"] .order-lookup,
html[data-theme="light"] .lookup-panel,
html[data-theme="light"] .settings-panel,
html[data-theme="light"] .price-settings-panel,
html[data-theme="light"] .role-management-panel,
html[data-theme="light"] .user-management-panel,
html[data-theme="light"] .combined-form-section,
html[data-theme="light"] dialog,
html[data-theme="light"] .modal {
  background-image: none;
}
html[data-theme="light"] .dashboard-kpi,
html[data-theme="light"] .viz-panel,
html[data-theme="light"] .register-table-panel,
html[data-theme="light"] .claim-update-panel,
html[data-theme="light"] .order-lookup,
html[data-theme="light"] .lookup-panel,
html[data-theme="light"] .settings-panel,
html[data-theme="light"] .price-settings-panel,
html[data-theme="light"] .role-management-panel,
html[data-theme="light"] .user-management-panel,
html[data-theme="light"] .combined-form-section,
html[data-theme="light"] dialog,
html[data-theme="light"] .modal {
  border: 1px solid var(--border-soft);
  background: var(--surface);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-theme="light"] .dashboard-board {
  background: transparent;
}
html[data-theme="light"] .dashboard-kpi:hover,
html[data-theme="light"] .viz-panel:hover {
  border-color: var(--border-strong);
  background: var(--surface) !important;
  box-shadow: none;
}
html[data-theme="light"] .dashboard-kpi strong {
  color: var(--text);
}
html[data-theme="light"] .primary {
  border: 1px solid var(--action);
  background: var(--accent);
  color: var(--accent-text);
  box-shadow: none;
}
html[data-theme="light"] .primary:hover {
  border-color: var(--border-strong);
  background: var(--accent-hover);
}
html[data-theme="light"] .secondary,
html[data-theme="light"] .icon-btn {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--muted);
}
html[data-theme="light"] .secondary:hover,
html[data-theme="light"] .icon-btn:hover {
  border-color: var(--border-strong);
  background: var(--surface-muted);
  color: var(--action);
}
html[data-theme="light"] .danger {
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--danger);
}
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea {
  border: 1px solid var(--border-soft);
  background: var(--surface);
  color: var(--text);
  box-shadow: none;
}
html[data-theme="light"] input:focus,
html[data-theme="light"] select:focus,
html[data-theme="light"] textarea:focus,
html[data-theme="light"] .claim-match-input textarea:focus {
  border-color: var(--focus);
  background: var(--surface);
  box-shadow: none;
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder {
  color: var(--muted);
}
html[data-theme="light"] label {
  color: var(--muted);
}
html[data-theme="light"] .table-tools,
html[data-theme="light"] .claim-match-head,
html[data-theme="light"] .claim-match-results-head {
  border-color: var(--border-soft);
}
html[data-theme="light"] .table-wrap {
  scrollbar-color: var(--muted) transparent;
}
html[data-theme="light"] th {
  background: var(--surface-muted);
  color: var(--muted);
}
html[data-theme="light"] th,
html[data-theme="light"] td {
  border-bottom: 1px solid var(--border-soft);
}
html[data-theme="light"] tbody tr,
html[data-theme="light"] tbody tr td {
  background: transparent;
}
html[data-theme="light"] #claimTable tbody tr:nth-child(even) {
  background: var(--surface-muted);
}
html[data-theme="light"] tbody tr:hover,
html[data-theme="light"] tbody tr:hover td,
html[data-theme="light"] .clickable-row:hover td,
html[data-theme="light"] .role-management-table tbody tr:hover td,
html[data-theme="light"] .user-management-table tbody tr:hover td,
html[data-theme="light"] .price-settings-table tbody tr:hover td {
  background: var(--surface-muted) !important;
  color: var(--text);
}
html[data-theme="light"] .qid-link {
  border-color: var(--border-soft);
  background: var(--surface-muted);
  color: var(--action);
}
html[data-theme="light"] .claim-match-input,
html[data-theme="light"] .claim-update-summary div {
  background: var(--surface-muted);
}
html[data-theme="light"] .settings-menu-card {
  border-color: var(--border);
  background: var(--surface);
  box-shadow: none;
}
html[data-theme="light"] .settings-menu-card:hover {
  border-color: var(--border-strong);
  background: var(--surface-muted);
}
html[data-theme="light"] dialog::backdrop {
  background: var(--scrim);
  backdrop-filter: none;
}
html[data-theme="light"] .login-screen {
  background: var(--surface-muted);
}
html[data-theme="light"] .login-card {
  border: 1px solid var(--border-soft);
  background: var(--surface);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-theme="light"] .qid-slider-backdrop {
  background: var(--surface-muted);
  backdrop-filter: none;
}
html[data-theme="light"] .qid-slider-panel {
  border-color: var(--border-soft);
  background: var(--surface);
  box-shadow: none;
  backdrop-filter: none;
}
@media (prefers-reduced-transparency: reduce) {
html[data-theme="light"] .register-top,
  html[data-theme="light"] .app-sidebar,
  html[data-theme="light"] .dashboard-kpi,
  html[data-theme="light"] .viz-panel,
  html[data-theme="light"] .register-table-panel,
  html[data-theme="light"] .claim-update-panel,
  html[data-theme="light"] .settings-panel,
  html[data-theme="light"] dialog,
  html[data-theme="light"] .modal,
  html[data-theme="light"] .login-card {
  background: var(--surface);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
}
html[data-theme="light"] .processing-pivot-panel {
  border: 1px solid var(--border-soft);
  background: var(--surface);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-theme="light"] .processing-pivot-head {
  border-bottom: 1px solid var(--border-soft);
  background: var(--surface-muted);
}
html[data-theme="light"] .processing-pivot-head h2 {
  color: var(--text);
}
html[data-theme="light"] .processing-pivot-head p {
  color: var(--muted);
}
html[data-theme="light"] .processing-pivot-context span {
  border: 1px solid var(--border-soft);
  background: var(--surface);
  color: var(--muted);
}
html[data-theme="light"] .processing-pivot-actions .secondary {
  border-color: var(--border-soft);
  background: var(--surface);
}
html[data-theme="light"] .processing-pivot-table-wrap {
  scrollbar-color: var(--muted) transparent;
}
html[data-theme="light"] .processing-pivot-table {
  border: 1px solid var(--border);
  background: var(--surface);
}
html[data-theme="light"] .processing-pivot-table th,
html[data-theme="light"] .processing-pivot-table td {
  border-right: 1px solid var(--border-soft);
  border-bottom: 1px solid var(--border-soft);
}
html[data-theme="light"] .processing-pivot-table thead th {
  border-bottom: 1px solid var(--border);
  background: var(--surface-muted);
  color: var(--muted);
}
html[data-theme="light"] .processing-pivot-table tr > :nth-child(5) {
  border-left: 2px solid var(--border-soft);
}
html[data-theme="light"] .processing-pivot-table tbody th {
  color: var(--text);
}
html[data-theme="light"] .processing-pivot-table tbody tr:hover > * {
  background: var(--surface-muted) !important;
  color: var(--action);
}
html[data-theme="light"] .processing-pivot-table .processing-pivot-year > * {
  background: var(--surface-muted);
  color: var(--action);
}
html[data-theme="light"] .processing-pivot-table .processing-pivot-quarter > * {
  background: var(--surface-muted);
  color: var(--muted);
}
html[data-theme="light"] .processing-pivot-table .processing-pivot-month > * {
  background: var(--surface);
  color: var(--muted);
}
html[data-theme="light"] .processing-pivot-table .processing-pivot-month:nth-child(even) > * {
  background: var(--surface-muted);
}
html[data-theme="light"] .processing-pivot-table .processing-pivot-fulfilment {
  color: var(--action);
}
html[data-theme="light"] .processing-pivot-table .processing-pivot-assurance {
  color: var(--text);
}
html[data-theme="light"] .processing-pivot-table .processing-pivot-total {
  background: var(--surface-muted);
  color: var(--action);
}
html[data-theme="light"] .processing-pivot-table .processing-pivot-month .processing-pivot-fulfilment {
  background: inherit;
}
html[data-theme="light"] .processing-pivot-table .processing-pivot-month .processing-pivot-assurance {
  background: inherit;
}
html[data-theme="light"] .processing-pivot-table .processing-pivot-month .processing-pivot-total {
  background: inherit;
}
html[data-theme="light"] .processing-pivot-table tfoot > tr > * {
  border-top: 1px solid var(--border-soft);
  background: var(--surface-muted);
  color: var(--text);
}
html[data-theme="light"] .processing-pivot-toggle {
  color: inherit;
}
html[data-theme="light"] .processing-pivot-toggle span {
  border: 1px solid var(--border-soft);
  background: var(--surface);
  color: var(--action);
  box-shadow: none;
}
html[data-theme="light"] .processing-pivot-toggle:hover span {
  border-color: var(--border-strong);
  background: var(--surface);
}
html[data-theme="light"] .processing-pivot-month-label {
  color: var(--muted);
}
html[data-theme="light"] .processing-pivot-empty {
  color: var(--muted);
}
@media (prefers-reduced-transparency: reduce) {
html[data-theme="light"] .processing-pivot-panel {
  background: var(--surface);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
}
html[data-theme="light"] .processing-pivot-value {
  color: inherit;
}
html[data-theme="light"] .processing-pivot-value:hover,
html[data-theme="light"] .processing-pivot-value:focus-visible {
  border-color: var(--focus);
  background: var(--surface);
  color: var(--action);
  box-shadow: none;
}
html[data-theme="light"] .maincon-claimed-batch-row:hover > *,
html[data-theme="light"] .maincon-claimed-batch-row:focus-visible > * {
  background: var(--success-soft);
  color: var(--success);
}
html[data-theme="light"] .maincon-claimed-batch-row:focus-visible {
  outline: 2px solid var(--focus);
}
html[data-theme="light"] .processing-pivot-value:focus-visible {
  box-shadow: none;
}
html[data-theme="light"] dialog.processing-pivot-dialog {
  border: 1px solid var(--border-soft);
  background: var(--surface);
  box-shadow: none;
}
html[data-theme="light"] dialog.processing-pivot-dialog::backdrop {
  background: var(--scrim);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-theme="light"] .processing-pivot-detail-head {
  border-bottom: 1px solid var(--border-soft);
  background: var(--surface-muted);
}
html[data-theme="light"] .processing-pivot-detail-head > div > span {
  color: var(--action);
}
html[data-theme="light"] .processing-pivot-detail-head h2 {
  color: var(--text);
}
html[data-theme="light"] .processing-pivot-detail-head p {
  color: var(--muted);
}
html[data-theme="light"] .processing-pivot-detail-table-wrap {
  scrollbar-color: var(--muted) transparent;
}
html[data-theme="light"] .processing-pivot-qids {
  color: var(--action);
}
html[data-theme="light"] .processing-pivot-scope-fulfilment {
  background: var(--surface-muted);
  color: var(--action);
}
html[data-theme="light"] .processing-pivot-scope-assurance,
html[data-theme="light"] .processing-pivot-scope-tros {
  background: var(--accent-soft);
  color: var(--text);
}
html[data-theme="light"] .processing-pivot-detail-empty {
  color: var(--muted);
}
html[data-theme="light"] .installer-mode #orderDetailDialog .installer-search-detail {
  border-top: 1px solid var(--border-soft);
}
html[data-theme="light"] .installer-mode #orderDetailDialog .installer-search-detail .record-modal-section {
  border-bottom: 1px solid var(--border-soft);
  background: transparent;
  box-shadow: none;
}
html[data-theme="light"] .installer-mode #orderDetailDialog .installer-search-detail .record-modal-section h3 {
  color: var(--text);
}
html[data-theme="light"] .installer-mode #orderDetailDialog .installer-search-detail-grid.lookup-card {
  background: transparent;
  box-shadow: none;
}
html[data-theme="light"] .installer-mode #orderDetailDialog #closeOrderDetailBtn:focus-visible {
  border-color: var(--focus);
  outline: 2px solid var(--focus);
}
html[data-theme="light"] dialog.claim-dialog {
  border: 1px solid var(--border-soft);
  background: var(--surface);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-theme="light"] dialog.claim-dialog .add-modal {
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-theme="light"] dialog.claim-dialog .modal-head {
  border-bottom: 1px solid var(--border-soft);
}
html[data-theme="light"] dialog.claim-dialog .combined-form-section {
  border-bottom: 1px solid var(--border-soft);
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-theme="light"] dialog.claim-dialog .combined-form-section h3 {
  color: var(--text);
}
html[data-theme="light"] dialog.claim-dialog .combined-form-grid input,
html[data-theme="light"] dialog.claim-dialog .combined-form-grid select,
html[data-theme="light"] dialog.claim-dialog .combined-form-grid .popup-select-trigger,
html[data-theme="light"] dialog.claim-dialog .combined-form-grid .formatted-date-control {
  background: var(--surface);
  box-shadow: none;
}
html[data-theme="light"] dialog.claim-dialog .combined-form-grid .formatted-date-control {
  color: var(--text);
}
html[data-theme="light"] dialog.claim-dialog .combined-form-grid .formatted-date-control.selected,
html[data-theme="light"] dialog.claim-dialog .combined-form-grid .formatted-date-control.selected:hover,
html[data-theme="light"] dialog.claim-dialog .combined-form-grid .formatted-date-control.selected:focus-within {
  border-color: var(--action);
  background: var(--accent-soft);
  color: var(--text);
  box-shadow: none;
}
html[data-theme="light"] dialog.claim-dialog .combined-form-grid .popup-select-trigger.selected,
html[data-theme="light"] dialog.claim-dialog .combined-form-grid .popup-select-trigger.selected:hover,
html[data-theme="light"] dialog.claim-dialog .combined-form-grid .popup-select-trigger.selected:focus-visible {
  border-color: var(--action);
  background: var(--accent-soft);
  color: var(--text);
  box-shadow: none;
}
html[data-theme="light"] dialog.claim-dialog .combined-form-grid input:focus,
html[data-theme="light"] dialog.claim-dialog .combined-form-grid select:focus,
html[data-theme="light"] dialog.claim-dialog .combined-form-grid .popup-select-trigger:focus-visible {
  border-color: var(--focus);
  box-shadow: none;
}
html[data-theme="light"] body:not(.staff-mode):not(.installer-mode) .app-sidebar {
  border-bottom: 1px solid var(--border-soft);
}
html[data-theme="light"] .register-search > .app-sidebar {
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
@media (max-width: 600px) {
html[data-theme="light"] dialog.claim-dialog .combined-form-section {
  background: transparent;
}
html[data-theme="light"] dialog.claim-dialog .modal-actions {
  border-top: 1px solid var(--border-soft);
}
}
.role-mapping-hidden td {
  background: var(--surface-muted);
}
.role-mapping-hidden input,
.role-mapping-hidden select {
  border-color: var(--border-soft) !important;
  background: var(--surface-muted) !important;
  color: var(--text) !important;
  box-shadow: none !important;
}
.role-mapping-hidden .role-mapping-visibility {
  border-color: var(--border-soft);
  background: var(--surface-muted);
  color: var(--text);
}
.role-mapping-hidden:hover td {
  background: var(--surface-muted);
}
.role-mapping-hidden select {
  color: var(--muted);
}
body.staff-mode #claimTable .staff-order-row:hover > td,
body.staff-mode #claimTable .staff-order-row:focus-visible > td {
  background: var(--surface-muted);
}
body.staff-mode #claimTable .staff-order-row:focus-visible {
  outline: 2px solid var(--focus);
}
html[data-theme="light"] body.staff-mode dialog.claim-dialog .combined-form-grid .field-job_scope input[readonly]:not(:placeholder-shown) {
  border-color: var(--action);
  background: var(--accent-soft);
  color: var(--text);
  box-shadow: none;
}
.staff-warranty-notice {
  border: 1px solid var(--border-soft);
  background: var(--surface-muted);
  color: var(--action);
}
#changePasswordError {
  color: var(--danger);
}
.staff-search-result:hover, .staff-search-result:focus-visible {
  background: var(--surface-muted);
}
html[data-theme="light"] body.staff-mode #orderDetailDialog .staff-order-detail-grid {
  background: transparent;
  box-shadow: none;
}
html[data-theme="light"] #orderDetailDialog .staff-search-result strong {
  color: var(--action);
}
html[data-theme="light"] #orderDetailDialog .staff-search-result span {
  color: var(--text);
}
html[data-theme="light"] #orderDetailDialog .staff-search-pagination {
  border-top: 1px solid var(--border-soft);
}
.claim-import-dialog {
  border: 1px solid var(--border-soft);
  background: var(--surface);
  color: var(--text);
}
.claim-import-scroll thead {
  background: var(--surface-muted);
}
.claim-import-dialog::backdrop {
  background: var(--scrim);
}
#batchPivotSearch {
  border: 1px solid var(--border-soft);
}
#batchPivotTable thead th {
  color: var(--muted);
  background: var(--surface-muted);
}
#batchPivotTable .batch-summary-row > * {
  background: var(--surface);
  border-bottom: 1px solid var(--border-soft);
}
#batchPivotTable .batch-expand {
  background: transparent;
  box-shadow: none;
  color: inherit;
}
#batchPivotTable .batch-expand small {
  color: var(--muted);
}
#batchPivotTable .batch-chevron {
  color: var(--action);
}
#batchPivotTable .batch-type-row > * {
  background: var(--surface-muted);
  border-bottom: 1px solid var(--border-soft);
}
#batchPivotTable .batch-dates {
  color: var(--muted);
}
#batchPivotTable tfoot > tr > * {
  background: var(--surface-muted);
  border-top: 1px solid var(--border-soft);
}
#batchPivotTable button:focus-visible {
  outline: 2px solid var(--focus);
}
html[data-theme="light"] #processingPivotTable .processing-pivot-card {
  border: 1px solid var(--border-soft);
  background: var(--surface);
  box-shadow: none;
}
html[data-theme="light"] #processingPivotTable .processing-pivot-table {
  background: var(--surface);
  color: var(--text);
}
html[data-theme="light"] #processingPivotTable th,
html[data-theme="light"] #processingPivotTable td {
  border-bottom-color: var(--border-soft);
  color: var(--text);
}
html[data-theme="light"] #processingPivotTable thead th {
  background: var(--surface-muted);
  color: var(--muted);
  border-bottom: 1px solid var(--border-soft);
}
html[data-theme="light"] #processingPivotTable .processing-pivot-group-head th[colspan] {
  color: var(--text);
}
html[data-theme="light"] #processingPivotTable .processing-pivot-year > *,
html[data-theme="light"] #processingPivotTable .processing-pivot-quarter > * {
  background: var(--surface-muted);
  color: var(--text);
}
html[data-theme="light"] #processingPivotTable .processing-pivot-month > *,
html[data-theme="light"] #processingPivotTable .processing-pivot-month:nth-child(even) > * {
  background: var(--surface);
  color: var(--text);
}
html[data-theme="light"] #processingPivotTable .processing-pivot-total {
  color: var(--text);
}
html[data-theme="light"] #processingPivotTable tbody tr:hover > * {
  background: var(--surface-muted) !important;
  color: var(--text);
}
html[data-theme="light"] #processingPivotTable tfoot > tr > * {
  background: var(--surface-muted);
  color: var(--text);
  border-top: 1px solid var(--border-soft);
}
html[data-theme="light"] #processingPivotTable .processing-pivot-month-label {
  color: var(--muted);
}
html[data-theme="light"] #processingPivotTable .processing-pivot-value {
  color: inherit;
  background: transparent;
  box-shadow: none;
}
html[data-theme="light"] #processingPivotTable .processing-pivot-toggle span {
  background: var(--surface);
  border-color: var(--border-soft);
  color: var(--text);
  box-shadow: none;
}
html[data-theme="light"] #processingPivotTable .processing-pivot-toggle:hover span {
  border-color: var(--border-strong);
  background: var(--surface);
}
html[data-theme="light"] #processingPivotTable button:focus-visible {
  outline: 2px solid var(--focus);
}
.price-scope {
  color: var(--muted);
}
/* reserve.css: component appearance */
.reserve-panel {
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
}
.reserve-heading p,.reserve-ledger-head p {
  color: var(--muted);
}
.reserve-eyebrow {
  color: var(--success);
}
.reserve-summary article {
  border: 1px solid var(--border);
  background: var(--app-background);
}
.reserve-summary article:last-child {
  background: var(--success-soft);
}
.reserve-summary span {
  color: var(--muted);
}
.reserve-panel h3 small {
  color: var(--muted);
}
.reserve-table-wrap {
  border: 1px solid var(--border);
}
.reserve-table th {
  background: var(--surface-muted);
}
.reserve-table th,.reserve-table td {
  border-bottom: 1px solid var(--border-soft);
}
.reserve-table small {
  color: var(--muted);
}
.reserve-positive {
  color: var(--success);
}
.reserve-negative,.reserve-error {
  color: var(--danger);
}
.reserve-table .reserve-link {
  background: none;
  color: var(--action);
}
.reserve-table .reserve-selected {
  background: var(--accent-soft);
}
.reserve-pagination span {
  color: var(--muted);
}
.reserve-dialog {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
}
.reserve-dialog::backdrop {
  background: var(--scrim);
}
#reserveMessage {
  background: var(--accent-soft);
}
/* assets/workspace/desktop.css: component appearance */
@font-face{font-family:Manrope;src:url("./Manrope.ttf") format("truetype");font-weight:200 800;font-display:swap}
@media (min-width:1100px) {
html[data-theme="light"] body.register.desktop-workspace {
  background: var(--page-background) !important;
  background-image: none !important;
  color: var(--text) !important;
  font-family: Manrope, 'Segoe UI', sans-serif !important;
}
html[data-theme="light"] body.desktop-workspace :is(button,input,select,textarea,table) {
  font-family: Manrope, 'Segoe UI', sans-serif !important;
}
html[data-theme="light"] body.desktop-workspace * {
  font-family: Manrope, 'Segoe UI', sans-serif !important;
}
html[data-theme="light"] body.desktop-workspace :is(h1,h2,h3,h4,strong,b) {
  color: var(--text);
  font-family: Manrope, 'Segoe UI', sans-serif !important;
}
html[data-theme="light"] body.desktop-workspace :is(button,.primary,.secondary) {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  box-shadow: none !important;
  text-shadow: none;
}
html[data-theme="light"] body.desktop-workspace :is(button,.secondary):hover {
  background: var(--surface-muted);
  border-color: var(--border-strong);
}
html[data-theme="light"] body.desktop-workspace button.primary {
  background: var(--accent) !important;
  color: var(--text) !important;
  border: 1px solid var(--accent) !important;
  box-shadow: none !important;
}
html[data-theme="light"] body.desktop-workspace button.primary:hover {
  background: var(--accent-hover) !important;
  border-color: var(--accent-hover) !important;
}
html[data-theme="light"] body.desktop-workspace :is(button.danger,.delete-record-btn) {
  background: var(--surface) !important;
  border-color: var(--danger-border) !important;
  color: var(--danger) !important;
  box-shadow: none !important;
}
html[data-theme="light"] body.desktop-workspace :is(button.danger,.delete-record-btn):hover {
  background: var(--surface-muted) !important;
  border-color: var(--border-strong) !important;
}
html[data-theme="light"] body.desktop-workspace :is(button,input,select,textarea,a):focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
}
html[data-theme="light"] body.desktop-workspace :is(input,select,textarea) {
  color: var(--text) !important;
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  box-shadow: none !important;
}
html[data-theme="light"] body.desktop-workspace :is(input[type=checkbox],input[type=radio]) {
  accent-color: var(--action);
}
html[data-theme="light"] body.desktop-workspace :is(button,input,select,textarea,a,summary,[tabindex]):focus-visible {
  outline: 3px solid var(--focus) !important;
  box-shadow: none !important;
}
html[data-theme="light"] body.desktop-workspace :is(.app,.app-shell) {
  background: var(--app-background);
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace .ws-sidebar {
  background: var(--surface);
  border-right: 1px solid var(--border);
}
body.desktop-workspace .ws-brand {
  color: var(--text);
}
body.desktop-workspace .ws-brand small {
  color: var(--muted);
}
body.desktop-workspace .ws-mark {
  background: var(--accent);
  color: var(--text);
}
body.desktop-workspace .ws-nav-label {
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace #workspaceNav .app-sidebar {
  background: transparent;
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace #workspaceNav .app-sidebar button {
  background: transparent;
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace .app-sidebar button.active {
  background: var(--accent-soft) !important;
  color: var(--accent-text) !important;
  box-shadow: none !important;
}
body.desktop-workspace .ws-account {
  border-top: 1px solid var(--border);
}
body.desktop-workspace .ws-avatar {
  background: var(--avatar);
  color: var(--avatar-text);
}
body.desktop-workspace .ws-account small {
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace .header-account-actions button {
  background: transparent;
  color: var(--muted);
}
body.desktop-workspace .ws-header {
  border-bottom: 1px solid var(--border);
  background: var(--app-background);
}
body.desktop-workspace .ws-breadcrumb {
  color: var(--muted);
}
body.desktop-workspace .ws-header p {
  color: var(--muted);
}
body.desktop-workspace .ws-date {
  color: var(--muted);
  border: 1px solid var(--border-soft);
  background: var(--surface);
}
html[data-theme="light"] body.desktop-workspace :is(.register-body,.register-page) {
  box-shadow: none;
  background: transparent;
}
body.desktop-workspace .ws-skip {
  background: var(--surface);
}
html[data-theme="light"] body.desktop-workspace :is(.dashboard-board,.dashboard-grid) {
  background: transparent;
}
body.desktop-workspace .ws-overview-toolbar span {
  color: var(--muted);
}
body.desktop-workspace .ws-period-controls label {
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace .dashboard-month-slider {
  background: var(--surface-muted);
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace .dashboard-month-slider button {
  background: transparent;
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace .dashboard-month-slider button.active {
  background: var(--surface);
  color: var(--text);
  box-shadow: none !important;
}
body.desktop-workspace .ws-metric {
  background: var(--surface);
  border: 1px solid var(--border);
}
body.desktop-workspace .ws-metric>div {
  color: var(--muted);
}
body.desktop-workspace .ws-metric small {
  color: var(--muted);
}
body.desktop-workspace .ws-currency {
  color: var(--muted);
}
body.desktop-workspace .ws-metric-highlight {
  background: var(--surface-muted);
  border-color: var(--border-soft);
}
body.desktop-workspace .ws-metric-highlight>div .ws-icon {
  background: var(--surface-muted);
}
body.desktop-workspace .ws-card {
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: none;
}
body.desktop-workspace .ws-card-head p {
  color: var(--muted);
}
body.desktop-workspace .ws-badge {
  border: 1px solid var(--border);
  color: var(--muted);
}
body.desktop-workspace .ws-trend svg {
  fill: var(--surface-muted);
  font-family: Manrope, 'Segoe UI', sans-serif;
}
body.desktop-workspace .ws-trend figcaption {
  color: var(--muted);
}
body.desktop-workspace .ws-chart-legend {
  color: var(--muted);
}
body.desktop-workspace .ws-workflow dl>div {
  border-bottom: 1px solid var(--border-soft);
}
body.desktop-workspace .ws-workflow dt {
  color: var(--muted);
}
body.desktop-workspace .ws-dot {
  background: var(--chart-maincon);
}
body.desktop-workspace .ws-dot.submitted {
  background: var(--chart-subcon);
}
body.desktop-workspace .ws-dot.paid {
  background: var(--chart-paid);
}
html[data-theme="light"] body.desktop-workspace .bar-row span {
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace .bar-row b {
  color: var(--text);
}
html[data-theme="light"] body.desktop-workspace .bar-track {
  background: var(--surface-muted);
}
html[data-theme="light"] body.desktop-workspace .bar-track i {
  background: var(--chart-area);
}
html[data-theme="light"] body.desktop-workspace .dashboard-pivot-link {
  background: transparent;
  color: var(--action);
}
body.desktop-workspace .ws-report-tabs {
  border-bottom: 1px solid var(--border);
}
html[data-theme="light"] body.desktop-workspace .ws-report-tabs button {
  background: none;
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace .ws-report-tabs button[aria-selected=true] {
  border-bottom-color: var(--border-strong);
  color: var(--accent-text);
}
html[data-theme="light"] body.desktop-workspace :is(.viz-panel,.settings-panel,.processing-pivot-panel,.register-table-panel,.claim-update-panel,.role-management-panel,.user-management-panel,.price-settings-panel) {
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace :is(.register-layout,.claim-sheet-tabs,.table-tools) {
  background: transparent;
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace .claim-sheet-tabs {
  border-bottom: 1px solid var(--border);
}
html[data-theme="light"] body.desktop-workspace .claim-sheet-tabs button {
  background: transparent;
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace .claim-sheet-tabs button.active {
  border-bottom-color: var(--border-strong);
  background: none;
  color: var(--accent-text);
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace .register-search-control {
  background: none;
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace #searchBox {
  background: var(--surface-muted) url("./search.svg") no-repeat 12px center !important;
  background-size: 16px !important;
}
body.desktop-workspace .ws-column-choice {
  color: var(--muted);
}
body.desktop-workspace .ws-transfer summary {
  border: 1px solid var(--border);
  background: var(--surface);
}
body.desktop-workspace .ws-transfer summary::after {
  color: var(--muted);
}
body.desktop-workspace .ws-transfer[open]>div {
  border: 1px solid var(--border);
  box-shadow: none;
  background: var(--surface);
}
html[data-theme="light"] body.desktop-workspace .ws-transfer button {
  background: var(--surface);
}
html[data-theme="light"] body.desktop-workspace :is(.table-wrap,.price-settings-table-wrap,.role-management-table-wrap,.user-table-wrap) {
  background: var(--surface);
}
html[data-theme="light"] body.desktop-workspace table {
  background: var(--surface);
  color: var(--text);
}
html[data-theme="light"] body.desktop-workspace :is(table td,table th) {
  border-bottom: 1px solid var(--border-soft);
  color: var(--text);
  background: var(--surface);
}
html[data-theme="light"] body.desktop-workspace table thead th {
  color: var(--muted);
  background: var(--surface-muted) !important;
}
html[data-theme="light"] body.desktop-workspace table tbody tr:hover>td {
  background: var(--surface-muted) !important;
}
html[data-theme="light"] body.desktop-workspace table tfoot th {
  background: var(--surface-muted) !important;
  color: var(--text);
}
html[data-theme="light"] body.desktop-workspace #claimTable .claim-created-by {
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace #claimTable .status-pill {
  background: var(--surface-muted);
  color: var(--warning);
}
html[data-theme="light"] body.desktop-workspace #claimTable .status-pill.claimed {
  background: var(--success-soft);
  color: var(--success);
}
html[data-theme="light"] body.desktop-workspace :is(.claim-pagination,.reserve-pagination) {
  border-top: 1px solid var(--border);
}
html[data-theme="light"] body.desktop-workspace .reserve-panel {
  background: transparent;
}
body.desktop-workspace .reserve-heading p {
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace .reserve-summary article {
  background: var(--surface);
  border: 1px solid var(--border);
}
html[data-theme="light"] body.desktop-workspace .reserve-summary article:last-child {
  background: var(--surface-muted);
  border-color: var(--border-soft);
}
body.desktop-workspace .reserve-summary span {
  color: var(--muted);
}
body.desktop-workspace .ws-reserve-accounts {
  background: var(--surface);
  border: 1px solid var(--border);
}
body.desktop-workspace .ws-account-list-head {
  border-bottom: 1px solid var(--border);
}
body.desktop-workspace .ws-account-search {
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace .ws-account-item {
  background: var(--surface);
}
html[data-theme="light"] body.desktop-workspace .ws-account-item.selected {
  background: var(--accent-soft);
  color: var(--action);
}
body.desktop-workspace .ws-account-item small {
  color: var(--muted);
}
body.desktop-workspace .reserve-panel>.reserve-filters {
  background: var(--surface);
  border: 1px solid var(--border);
}
body.desktop-workspace .reserve-panel>.reserve-table-wrap {
  background: var(--surface);
  border: 1px solid var(--border);
}
body.desktop-workspace .reserve-ledger-head p {
  color: var(--muted);
}
body.desktop-workspace .ws-section-kicker {
  color: var(--action);
}
body.desktop-workspace .reserve-pagination {
  background: var(--surface);
  border: 1px solid var(--border);
}
html[data-theme="light"] body.desktop-workspace .reserve-table small {
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace .reserve-table button.reserve-link {
  color: var(--action);
  background: none;
}
html[data-theme="light"] body.desktop-workspace .reserve-positive {
  color: var(--success);
}
html[data-theme="light"] body.desktop-workspace .reserve-negative {
  color: var(--danger);
}
body.desktop-workspace .ws-empty {
  color: var(--muted);
}
body.desktop-workspace .ws-filter-notice {
  background: var(--warning-soft);
  border: 1px solid var(--border-soft);
}
body.desktop-workspace .ws-loading {
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--muted);
}
body.desktop-workspace .ws-loading-bars i {
  background: var(--surface-muted);
}
html[data-theme="light"] body.desktop-workspace ::-webkit-scrollbar-thumb {
  background: var(--surface-muted);
  border: 3px solid var(--border-soft);
}
html[data-theme="light"] body.desktop-workspace ::-webkit-scrollbar-track {
  background: var(--surface-muted);
}
html[data-theme="light"] body.desktop-workspace .settings-menu-card {
  background: var(--surface-muted);
  border: 1px solid var(--border);
}
html[data-theme="light"] body.desktop-workspace .settings-menu-card span {
  color: var(--action);
}
html[data-theme="light"] body.desktop-workspace .settings-menu-card small {
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace .settings-backup-zone {
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace .settings-danger-zone {
  background: var(--danger-soft);
  border: 1px solid var(--danger-border);
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace :is(.settings-backup-zone,.settings-danger-zone) span {
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace :is(.processing-pivot-head,.role-management-head,.user-management-head,.price-settings-head,.claim-match-head) p {
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace :is(.processing-pivot-card,.processing-batch-section,.claim-match-input,.claim-update-summary,.user-create-form) {
  background: var(--surface-muted);
  border-color: var(--border);
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace :is(.processing-pivot-head,.processing-batch-head,.role-management-head,.user-management-head,.price-settings-head,.claim-match-head) {
  background: var(--surface);
  background-image: none;
  border-bottom: 1px solid var(--border);
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace :is(.processing-pivot-context span,.price-settings-note) {
  background: var(--surface-muted);
  border: 1px solid var(--border);
  color: var(--muted);
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace :is(.processing-pivot-value,.processing-batch-value,.processing-pivot-toggle) {
  background: transparent;
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace :is(.processing-pivot-value,.processing-batch-value):hover {
  background: var(--surface-muted);
  color: var(--action);
}
html[data-theme="light"] body.desktop-workspace #processingPivotTable :is(.processing-pivot-year,.processing-pivot-quarter)>* {
  background: var(--surface-muted);
}
html[data-theme="light"] body.desktop-workspace :is(dialog,.modal) {
  background: var(--surface) !important;
  color: var(--text);
  box-shadow: none;
  border-color: var(--border);
}
html[data-theme="light"] body.desktop-workspace dialog::backdrop {
  background: var(--scrim);
  backdrop-filter: none;
}
html[data-theme="light"] body.desktop-workspace dialog :is(h2,h3) {
  color: var(--text);
}
html[data-theme="light"] body.desktop-workspace :is(.modal-head,.modal-actions) {
  background: var(--surface);
  border-color: var(--border);
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace #reserveDialog {
  border: 1px solid var(--border);
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace #reserveDialogHint {
  background: var(--surface-muted);
  color: var(--text);
}
html[data-theme="light"] body.desktop-workspace #reserveForm>.reserve-actions {
  background: var(--surface);
  border-top: 1px solid var(--border);
}
html[data-theme="light"] body.desktop-workspace #reserveCategoryDetails {
  border-top: 1px solid var(--border);
}
html[data-theme="light"] body.desktop-workspace #reserveReceiptStatus {
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace .reserve-receipt {
  background: var(--surface-muted);
  border: 1px dashed var(--border-soft);
}
html[data-theme="light"] body.desktop-workspace #claimFormFields {
  background: none;
}
html[data-theme="light"] body.desktop-workspace .combined-form-section {
  background: var(--surface-muted);
  border: 1px solid var(--border);
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace .combined-form-section h3 {
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace .combined-form-grid label {
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace :is(.popup-select-btn,.date-control) {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  box-shadow: none !important;
}
html[data-theme="light"] body.desktop-workspace .selection-option {
  background: var(--surface-muted);
  border: 1px solid var(--border);
  color: var(--text);
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace .selection-option.selected {
  background: var(--accent-soft);
  border-color: var(--border-strong);
}
html[data-theme="light"] body.desktop-workspace .login-screen {
  background: var(--app-background);
}
body.desktop-workspace .ws-login-story {
  background: var(--surface-muted);
  border-right: 1px solid var(--border-soft);
}
body.desktop-workspace .ws-login-story p {
  color: var(--muted);
}
body.desktop-workspace .ws-login-features span {
  color: var(--text);
}
body.desktop-workspace .ws-login-story>small {
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace .login-card {
  background: none;
  box-shadow: none;
}
html[data-theme="light"] body.desktop-workspace .login-brand span {
  color: var(--muted);
}
html[data-theme="light"] body.desktop-workspace .login-card label {
  color: var(--muted);
}
}
/* Browser autofill has its own paint layer; match the regular input surface.
   The inset fill masks browser blue without disabling saved-value suggestions. */
html[data-theme="light"] body:is(.register,.desktop-workspace) input:is(:autofill,:-webkit-autofill),
html[data-theme="light"] body:is(.register,.desktop-workspace) textarea:is(:autofill,:-webkit-autofill),
html[data-theme="light"] body:is(.register,.desktop-workspace) select:is(:autofill,:-webkit-autofill) {
  -webkit-box-shadow: 0 0 0 1000px var(--surface) inset !important;
  box-shadow: 0 0 0 1000px var(--surface) inset !important;
  -webkit-text-fill-color: var(--text) !important;
  caret-color: var(--text);
}
