/**
 * Bootstrap → SuperPrecio token bridge.
 * Must load AFTER bootstrap.min.css: it re-points Bootstrap's CSS
 * variables at the --sp-* design tokens so theme (data-theme +
 * data-bs-theme, set by platform-detect) and platform skins drive
 * Bootstrap components too.
 */

:root,
[data-bs-theme='light'],
[data-bs-theme='dark'] {
  --bs-body-bg: var(--sp-color-surface-1);
  --bs-body-color: var(--sp-color-text-primary);
  --bs-secondary-color: var(--sp-color-text-secondary);
  --bs-tertiary-color: var(--sp-color-text-tertiary);
  --bs-secondary-bg: var(--sp-color-surface-2);
  --bs-tertiary-bg: var(--sp-color-surface-1);
  --bs-border-color: var(--sp-color-border-light);
  --bs-link-color: var(--sp-color-link);
  --bs-link-hover-color: var(--sp-color-link-hover);
  --bs-emphasis-color: var(--sp-color-text-primary);
  --bs-body-font-family: var(--sp-font-system);
}

.modal-content,
.dropdown-menu,
.offcanvas,
.toast,
.list-group-item,
.accordion-item,
.card {
  --bs-modal-bg: var(--sp-color-surface-base);
  --bs-dropdown-bg: var(--sp-color-surface-base);
  --bs-offcanvas-bg: var(--sp-color-surface-base);
  --bs-toast-bg: var(--sp-color-surface-base);
  --bs-list-group-bg: var(--sp-color-surface-base);
  --bs-accordion-bg: var(--sp-color-surface-base);
  --bs-card-bg: var(--sp-color-surface-base);
}

.form-control,
.form-select {
  background-color: var(--sp-color-surface-base);
  color: var(--sp-color-text-primary);
  border-color: var(--sp-color-border-medium);
}

.form-control::placeholder {
  color: var(--sp-color-text-tertiary);
}

/* Navbar y .bg-success: verde de marca SÓLIDO (no el verde Bootstrap #198754,
   no vidrio). Decisión del dueño: sólido de marca. */
.navbar.bg-success,
.bg-success {
  background-color: var(--sp-color-brand-bg) !important;
}

/* btn-success: relleno verde OSCURO de marca (texto blanco legible en ambos
   temas). El primary brillante de dark es para texto/íconos, no para rellenos. */
.btn-success {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--sp-color-brand-bg);
  --bs-btn-border-color: var(--sp-color-brand-bg);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--sp-color-brand-bg-dark);
  --bs-btn-hover-border-color: var(--sp-color-brand-bg-dark);
  --bs-btn-active-bg: var(--sp-color-brand-bg-dark);
  --bs-btn-active-border-color: var(--sp-color-brand-bg-dark);
}
