/* Bootstrap 5 adapter for the framework-independent Palver design tokens. */
/* Bootstrap composes rgba() from the *-rgb triplets, which CSS cannot derive
   from a hex token without a build step. Each triplet is the value of the
   token assigned to its sibling variable; refresh them with the snapshot. */
:root {
  --bs-font-sans-serif: var(--palver-font-family-primary);
  --bs-body-font-family: var(--palver-font-family-primary);
  --bs-body-color: var(--palver-color-text-default);
  --bs-body-color-rgb: 19, 18, 22;
  --bs-body-bg: var(--palver-color-background-body);
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-emphasis-color: var(--palver-color-text-title);
  --bs-emphasis-color-rgb: 0, 0, 0;
  --bs-secondary-color: var(--palver-color-text-dimmed);
  --bs-secondary-bg: var(--palver-color-background-default);
  --bs-secondary-bg-rgb: 233, 236, 239;
  --bs-tertiary-bg: var(--palver-color-background-screen-background);
  --bs-tertiary-bg-rgb: 247, 247, 248;
  --bs-border-color: var(--palver-color-border-default);
  --bs-heading-color: var(--palver-color-text-title);
  --bs-link-color: var(--palver-color-text-link);
  --bs-link-hover-color: var(--palver-color-background-primary-filled-hover);
  --bs-primary: var(--palver-color-background-primary-filled);
  --bs-primary-rgb: 112, 69, 234;
  --bs-success: var(--palver-color-background-success-filled);
  --bs-success-rgb: 64, 192, 87;
  --bs-danger: var(--palver-color-background-error-filled);
  --bs-danger-rgb: 250, 82, 82;
  --bs-warning: var(--palver-color-background-warning-filled);
  --bs-warning-rgb: 253, 126, 20;
  --bs-info: var(--palver-color-background-info-filled);
  --bs-info-rgb: 76, 110, 245;
  --bs-secondary: var(--palver-color-background-gray-filled);
  --bs-secondary-rgb: 134, 142, 150;
  /* Mantine's default radius (theme.defaultRadius = "sm"); the Palver theme
     does not override it. */
  --bs-border-radius: var(--palver-radius-sm);
  --bs-border-radius-sm: var(--palver-radius-sm);
  --bs-border-radius-lg: var(--palver-radius-lg);
  --bs-border-radius-xl: var(--palver-radius-xl);
  --bs-focus-ring-color: var(--palver-color-background-primary-light-hover);
  --bs-primary-text-emphasis: var(--palver-color-text-primary);
  --bs-primary-bg-subtle: var(--palver-color-background-primary-light);
  --bs-primary-border-subtle: var(--palver-color-border-primary);
  /* Text and icons on the filled primary. A light custom accent (Settings)
     switches it to black; see OgAccent in base.html. */
  --og-on-primary: var(--palver-color-neutral-white);
}

[data-bs-theme="dark"] {
  --bs-body-color: var(--palver-color-text-default);
  --bs-body-color-rgb: 255, 255, 255;
  --bs-body-bg: var(--palver-color-background-body);
  --bs-body-bg-rgb: 25, 23, 28;
  --bs-emphasis-color: var(--palver-color-text-title);
  --bs-emphasis-color-rgb: 202, 199, 209;
  --bs-secondary-color: var(--palver-color-text-dimmed);
  --bs-secondary-bg: var(--palver-color-background-default);
  --bs-secondary-bg-rgb: 38, 33, 43;
  --bs-tertiary-bg: var(--palver-color-background-screen-background);
  --bs-tertiary-bg-rgb: 12, 10, 15;
  --bs-border-color: var(--palver-color-border-default);
  --bs-heading-color: var(--palver-color-text-title);
  --bs-link-color: var(--palver-color-text-link);
  --bs-link-hover-color: var(--palver-color-border-primary);
  --bs-success-rgb: 47, 158, 68;
  --bs-danger-rgb: 224, 49, 49;
  --bs-warning-rgb: 232, 89, 12;
  --bs-info-rgb: 59, 91, 219;
  --bs-secondary-rgb: 58, 57, 61;
}

body {
  background-color: var(--palver-color-background-screen-background);
}

h1, h2, h3, h4, h5, h6 {
  color: var(--palver-color-text-title);
  font-family: var(--palver-font-family-primary);
}

/* Bootstrap bakes component colors into their classes. Repoint those local
   variables to semantic Palver tokens while preserving Bootstrap behavior.
   Filled buttons use white text in every color, as Mantine does without
   autoContrast. */
.btn-primary,
.btn-outline-primary,
.btn-tonal-primary,
.btn-subtle-primary {
  --og-btn-light: var(--palver-color-background-primary-light);
  --og-btn-filled: var(--palver-color-background-primary-filled);
  --og-btn-hover: var(--palver-color-background-primary-filled-hover);
  --og-btn-border: var(--palver-color-border-primary);
  --og-btn-outline-text: var(--palver-color-text-primary);
}
.btn-success,
.btn-outline-success,
.btn-tonal-success,
.btn-subtle-success {
  --og-btn-light: var(--palver-color-background-success-light);
  --og-btn-filled: var(--palver-color-background-success-filled);
  --og-btn-hover: var(--palver-color-background-success-filled-hover);
  --og-btn-border: var(--palver-color-border-success);
  --og-btn-outline-text: var(--palver-color-text-success-emphasis);
}
.btn-danger,
.btn-outline-danger,
.btn-tonal-danger,
.btn-subtle-danger {
  --og-btn-light: var(--palver-color-background-error-light);
  --og-btn-filled: var(--palver-color-background-error-filled);
  --og-btn-hover: var(--palver-color-background-error-filled-hover);
  --og-btn-border: var(--palver-color-border-error);
  --og-btn-outline-text: var(--palver-color-text-error-emphasis);
}
.btn-warning,
.btn-outline-warning,
.btn-tonal-warning,
.btn-subtle-warning {
  --og-btn-light: var(--palver-color-background-warning-light);
  --og-btn-filled: var(--palver-color-background-warning-filled);
  --og-btn-hover: var(--palver-color-background-warning-filled-hover);
  --og-btn-border: var(--palver-color-border-warning);
  --og-btn-outline-text: var(--palver-color-text-warning-emphasis);
}
.btn-info,
.btn-outline-info,
.btn-tonal-info,
.btn-subtle-info {
  --og-btn-light: var(--palver-color-background-info-light);
  --og-btn-filled: var(--palver-color-background-info-filled);
  --og-btn-hover: var(--palver-color-background-info-filled-hover);
  --og-btn-border: var(--palver-color-border-info);
  --og-btn-outline-text: var(--palver-color-text-info-emphasis);
}
.btn-secondary,
.btn-outline-secondary,
.btn-tonal-secondary,
.btn-subtle-secondary {
  --og-btn-light: var(--palver-color-background-gray-light);
  --og-btn-filled: var(--palver-color-background-gray-filled);
  --og-btn-hover: var(--palver-color-background-gray-filled-hover);
  --og-btn-border: var(--palver-color-border-default);
  --og-btn-outline-text: var(--palver-color-text-default);
}

.btn-primary,
.btn-success,
.btn-danger,
.btn-warning,
.btn-info,
.btn-secondary {
  --bs-btn-color: var(--palver-color-neutral-white);
  --bs-btn-bg: var(--og-btn-filled);
  --bs-btn-border-color: var(--og-btn-filled);
  --bs-btn-hover-color: var(--palver-color-neutral-white);
  --bs-btn-hover-bg: var(--og-btn-hover);
  --bs-btn-hover-border-color: var(--og-btn-hover);
  --bs-btn-active-color: var(--palver-color-neutral-white);
  --bs-btn-active-bg: var(--og-btn-hover);
  --bs-btn-active-border-color: var(--og-btn-hover);
  --bs-btn-disabled-color: var(--palver-color-neutral-white);
  --bs-btn-disabled-bg: var(--og-btn-filled);
  --bs-btn-disabled-border-color: var(--og-btn-filled);
}

.btn-outline-primary,
.btn-outline-success,
.btn-outline-danger,
.btn-outline-warning,
.btn-outline-info,
.btn-outline-secondary {
  --bs-btn-color: var(--og-btn-outline-text);
  --bs-btn-border-color: var(--og-btn-border);
  --bs-btn-hover-color: var(--palver-color-neutral-white);
  --bs-btn-hover-bg: var(--og-btn-filled);
  --bs-btn-hover-border-color: var(--og-btn-filled);
  --bs-btn-active-color: var(--palver-color-neutral-white);
  --bs-btn-active-bg: var(--og-btn-hover);
  --bs-btn-active-border-color: var(--og-btn-hover);
  --bs-btn-disabled-color: var(--og-btn-outline-text);
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: var(--og-btn-border);
}

/* Palver's lighter emphasis levels (Mantine "light" and "subtle"), for
   secondary and tertiary actions: tinted fill, and no fill until hover. */
.btn-tonal-primary,
.btn-tonal-success,
.btn-tonal-danger,
.btn-tonal-warning,
.btn-tonal-info,
.btn-tonal-secondary {
  --bs-btn-color: var(--og-btn-outline-text);
  --bs-btn-bg: var(--og-btn-light);
  --bs-btn-border-color: transparent;
  --bs-btn-hover-color: var(--og-btn-outline-text);
  --bs-btn-hover-bg: color-mix(in srgb, var(--og-btn-filled) 24%, transparent);
  --bs-btn-hover-border-color: transparent;
  --bs-btn-active-color: var(--og-btn-outline-text);
  --bs-btn-active-bg: color-mix(in srgb, var(--og-btn-filled) 32%, transparent);
  --bs-btn-active-border-color: transparent;
  --bs-btn-disabled-color: var(--og-btn-outline-text);
  --bs-btn-disabled-bg: var(--og-btn-light);
  --bs-btn-disabled-border-color: transparent;
}
.btn-subtle-primary,
.btn-subtle-success,
.btn-subtle-danger,
.btn-subtle-warning,
.btn-subtle-info,
.btn-subtle-secondary {
  --bs-btn-color: var(--og-btn-outline-text);
  --bs-btn-bg: transparent;
  --bs-btn-border-color: transparent;
  --bs-btn-hover-color: var(--og-btn-outline-text);
  --bs-btn-hover-bg: var(--og-btn-light);
  --bs-btn-hover-border-color: transparent;
  --bs-btn-active-color: var(--og-btn-outline-text);
  --bs-btn-active-bg: color-mix(in srgb, var(--og-btn-filled) 24%, transparent);
  --bs-btn-active-border-color: transparent;
  --bs-btn-disabled-color: var(--og-btn-outline-text);
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: transparent;
}

/* White on the orange warning fill is below WCAG AA (about 2.9:1); black
   reaches about 8:1 in light and 6:1 in dark, as Mantine's autoContrast would pick. */
.btn-warning {
  --bs-btn-color: var(--palver-color-neutral-black);
  --bs-btn-hover-color: var(--palver-color-neutral-black);
  --bs-btn-active-color: var(--palver-color-neutral-black);
  --bs-btn-disabled-color: var(--palver-color-neutral-black);
}
.btn-outline-warning {
  --bs-btn-hover-color: var(--palver-color-neutral-black);
  --bs-btn-active-color: var(--palver-color-neutral-black);
}
.btn-primary {
  --bs-btn-color: var(--og-on-primary);
  --bs-btn-hover-color: var(--og-on-primary);
  --bs-btn-active-color: var(--og-on-primary);
  --bs-btn-disabled-color: var(--og-on-primary);
}
.btn-outline-primary {
  --bs-btn-hover-color: var(--og-on-primary);
  --bs-btn-active-color: var(--og-on-primary);
}
.text-bg-primary { color: var(--og-on-primary) !important; }
.badge.bg-primary { --bs-badge-color: var(--og-on-primary); }

.alert-primary {
  --bs-alert-color: var(--palver-color-text-primary);
  --bs-alert-bg: var(--palver-color-background-primary-light);
  --bs-alert-border-color: var(--palver-color-border-primary);
}
.alert-success {
  --bs-alert-color: var(--palver-color-text-success-emphasis);
  --bs-alert-bg: var(--palver-color-background-success-light);
  --bs-alert-border-color: var(--palver-color-border-success);
}
.alert-danger {
  --bs-alert-color: var(--palver-color-text-error-emphasis);
  --bs-alert-bg: var(--palver-color-background-error-light);
  --bs-alert-border-color: var(--palver-color-border-error);
}
.alert-warning {
  --bs-alert-color: var(--palver-color-text-warning-emphasis);
  --bs-alert-bg: var(--palver-color-background-warning-light);
  --bs-alert-border-color: var(--palver-color-border-warning);
}
.alert-info {
  --bs-alert-color: var(--palver-color-text-info-emphasis);
  --bs-alert-bg: var(--palver-color-background-info-light);
  --bs-alert-border-color: var(--palver-color-border-info);
}
.alert-secondary {
  --bs-alert-color: var(--palver-color-text-default);
  --bs-alert-bg: var(--palver-color-background-gray-light);
  --bs-alert-border-color: var(--palver-color-border-default);
}

.text-primary { color: var(--palver-color-text-primary) !important; }
.text-success { color: var(--palver-color-text-success-emphasis) !important; }
.text-danger { color: var(--palver-color-text-error-emphasis) !important; }
.text-warning { color: var(--palver-color-text-warning-emphasis) !important; }
.text-info { color: var(--palver-color-text-info-emphasis) !important; }

/* Bootstrap stripes rows with 5% of the emphasis color, nearly invisible on
   the dark body, while the full Palver default surface is too strong. Odd rows
   sit halfway between body and default; the pointer's row takes default. */
[data-bs-theme="dark"] .table {
  --bs-table-striped-bg: color-mix(in srgb, var(--palver-color-background-default) 50%, var(--palver-color-background-body));
  --bs-table-hover-bg: var(--palver-color-background-default);
}

/* Components where Bootstrap bakes its default blue into local variables or
   literal colors; they are repointed to the Palver primary. */
.pagination {
  --bs-pagination-color: var(--palver-color-text-primary);
  --bs-pagination-hover-color: var(--palver-color-text-primary);
  --bs-pagination-focus-color: var(--palver-color-text-primary);
  --bs-pagination-focus-box-shadow: 0 0 0 .25rem var(--palver-color-background-primary-light-hover);
  --bs-pagination-active-bg: var(--palver-color-background-primary-filled);
  --bs-pagination-active-border-color: var(--palver-color-background-primary-filled);
  --bs-pagination-active-color: var(--og-on-primary);
}
.form-check-input:checked,
.form-check-input[type=checkbox]:indeterminate {
  background-color: var(--palver-color-background-primary-filled);
  border-color: var(--palver-color-background-primary-filled);
}
.form-check-input:focus {
  border-color: var(--palver-color-border-primary);
  box-shadow: 0 0 0 .25rem var(--palver-color-background-primary-light-hover);
}
/* The unchecked, focused switch knob is an SVG, so its color is literal. */
.form-switch .form-check-input:focus:not(:checked) {
  --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23af9ae5'/%3e%3c/svg%3e");
}
.form-range::-webkit-slider-thumb { background-color: var(--palver-color-background-primary-filled); }
.form-range::-moz-range-thumb { background-color: var(--palver-color-background-primary-filled); }
/* Vendor pseudo-elements stay in separate rules: one unknown selector in a
   list would drop the whole rule. */
.form-range::-webkit-slider-thumb:active { background-color: var(--palver-color-border-primary); }
.form-range::-moz-range-thumb:active { background-color: var(--palver-color-border-primary); }
.form-range:focus::-webkit-slider-thumb { box-shadow: 0 0 0 1px var(--bs-body-bg), 0 0 0 .25rem var(--palver-color-background-primary-light-hover); }
.form-range:focus::-moz-range-thumb { box-shadow: 0 0 0 1px var(--bs-body-bg), 0 0 0 .25rem var(--palver-color-background-primary-light-hover); }
.nav-pills {
  --bs-nav-pills-link-active-bg: var(--palver-color-background-primary-filled);
  --bs-nav-pills-link-active-color: var(--og-on-primary);
}
.list-group {
  --bs-list-group-active-bg: var(--palver-color-background-primary-filled);
  --bs-list-group-active-border-color: var(--palver-color-background-primary-filled);
  --bs-list-group-active-color: var(--og-on-primary);
}
.dropdown-menu {
  --bs-dropdown-link-active-bg: var(--palver-color-background-primary-filled);
  --bs-dropdown-link-active-color: var(--og-on-primary);
}
.progress,
.progress-stacked { --bs-progress-bar-bg: var(--palver-color-background-primary-filled); }
.accordion {
  --bs-accordion-btn-focus-border-color: var(--palver-color-border-primary);
  --bs-accordion-btn-focus-box-shadow: 0 0 0 .25rem var(--palver-color-background-primary-light-hover);
}
/* The open chevron is a blue SVG; it keeps the neutral closed-state icon. */
[data-bs-theme] .accordion-button::after { --bs-accordion-btn-active-icon: var(--bs-accordion-btn-icon); }

/* Trial: body rows are separated by stripes and hover only, without lines;
   the header keeps its bottom line so columns stay anchored. */
.table > tbody > tr > * { border-bottom-width: 0; }

.card,
.modal-content,
.dropdown-menu,
.og-table-frame {
  background-color: var(--palver-color-background-body);
}

.form-control,
.form-select {
  background-color: var(--palver-color-background-body);
  border-color: var(--palver-color-border-default);
  color: var(--palver-color-text-default);
}
.form-control:focus,
.form-select:focus {
  border-color: var(--palver-color-border-primary);
  box-shadow: 0 0 0 .25rem var(--palver-color-background-primary-light-hover);
}