/* =========================================================
   White Label — Componentes reutilizables (tema claro)
   Fuente de color: únicamente variables --tenant-* / Theme Engine.
   No incluye selectores [data-theme="dark"].
   ========================================================= */

/* ---------- Botones ---------- */
html:not([data-theme="dark"]) .btn-primary {
  --bs-btn-color: var(--tenant-on-primary);
  --bs-btn-bg: var(--tenant-primary);
  --bs-btn-border-color: var(--tenant-primary);
  --bs-btn-hover-color: var(--tenant-on-primary);
  --bs-btn-hover-bg: var(--tenant-primary-hover);
  --bs-btn-hover-border-color: var(--tenant-primary-hover);
  --bs-btn-focus-shadow-rgb: var(--tenant-primary-rgb);
  --bs-btn-active-color: var(--tenant-on-primary);
  --bs-btn-active-bg: var(--tenant-primary-active);
  --bs-btn-active-border-color: var(--tenant-primary-active);
  --bs-btn-disabled-color: var(--tenant-on-primary);
  --bs-btn-disabled-bg: var(--tenant-primary);
  --bs-btn-disabled-border-color: var(--tenant-primary);
  background-color: var(--tenant-primary) !important;
  border-color: var(--tenant-primary) !important;
  color: var(--tenant-on-primary) !important;
}

html:not([data-theme="dark"]) .btn-primary:hover,
html:not([data-theme="dark"]) .btn-primary:focus,
html:not([data-theme="dark"]) .btn-primary:focus-visible {
  background-color: var(--tenant-primary-hover) !important;
  border-color: var(--tenant-primary-hover) !important;
  color: var(--tenant-on-primary) !important;
}

html:not([data-theme="dark"]) .btn-primary:active,
html:not([data-theme="dark"]) .btn-primary.active,
html:not([data-theme="dark"]) .show > .btn-primary.dropdown-toggle {
  background-color: var(--tenant-primary-active) !important;
  border-color: var(--tenant-primary-active) !important;
  color: var(--tenant-on-primary) !important;
}

html:not([data-theme="dark"]) .btn-outline-primary {
  --bs-btn-color: var(--tenant-primary);
  --bs-btn-border-color: var(--tenant-primary);
  --bs-btn-hover-color: var(--tenant-on-primary);
  --bs-btn-hover-bg: var(--tenant-primary);
  --bs-btn-hover-border-color: var(--tenant-primary);
  --bs-btn-focus-shadow-rgb: var(--tenant-primary-rgb);
  --bs-btn-active-color: var(--tenant-on-primary);
  --bs-btn-active-bg: var(--tenant-primary-active);
  --bs-btn-active-border-color: var(--tenant-primary-active);
  --bs-btn-disabled-color: var(--tenant-primary);
  --bs-btn-disabled-border-color: var(--tenant-primary);
  color: var(--tenant-primary) !important;
  border-color: var(--tenant-primary) !important;
}

html:not([data-theme="dark"]) .btn-outline-primary:hover,
html:not([data-theme="dark"]) .btn-outline-primary:focus,
html:not([data-theme="dark"]) .btn-outline-primary:active,
html:not([data-theme="dark"]) .btn-outline-primary.active {
  background-color: var(--tenant-primary) !important;
  border-color: var(--tenant-primary) !important;
  color: var(--tenant-on-primary) !important;
}

html:not([data-theme="dark"]) .btn-link {
  color: var(--tenant-primary) !important;
}

html:not([data-theme="dark"]) .btn-link:hover,
html:not([data-theme="dark"]) .btn-link:focus {
  color: var(--tenant-primary-hover) !important;
}

/* ---------- Badges / etiquetas de marca ---------- */
html:not([data-theme="dark"]) .badge.bg-primary,
html:not([data-theme="dark"]) .badge.text-bg-primary,
html:not([data-theme="dark"]) .text-bg-primary {
  background-color: var(--tenant-primary) !important;
  color: var(--tenant-on-primary) !important;
}

html:not([data-theme="dark"]) .badge.bg-primary-soft,
html:not([data-theme="dark"]) .badge-primary-soft {
  background-color: var(--tenant-primary-soft) !important;
  color: var(--tenant-primary-active) !important;
}

/* ---------- Alert de marca (no semántica) ---------- */
html:not([data-theme="dark"]) .alert-primary {
  --bs-alert-color: var(--tenant-primary-active);
  --bs-alert-bg: var(--tenant-primary-soft);
  --bs-alert-border-color: rgba(var(--tenant-primary-rgb), 0.35);
  --bs-alert-link-color: var(--tenant-primary-active);
  color: var(--tenant-primary-active) !important;
  background-color: var(--tenant-primary-soft) !important;
  border-color: rgba(var(--tenant-primary-rgb), 0.35) !important;
}

/* ---------- Cards con identidad ---------- */
html:not([data-theme="dark"]) .card.border-primary,
html:not([data-theme="dark"]) .border-primary {
  border-color: var(--tenant-primary) !important;
}

html:not([data-theme="dark"]) .card-header.bg-primary,
html:not([data-theme="dark"]) .bg-primary {
  background-color: var(--tenant-primary) !important;
  color: var(--tenant-on-primary) !important;
}

html:not([data-theme="dark"]) .card-header.bg-primary-soft {
  background-color: var(--tenant-primary-soft) !important;
  color: var(--tenant-primary-active) !important;
}

/* ---------- Tabs / Nav pills ---------- */
html:not([data-theme="dark"]) .nav-tabs .nav-link:hover,
html:not([data-theme="dark"]) .nav-tabs .nav-link:focus {
  border-color: rgba(var(--tenant-primary-rgb), 0.35) rgba(var(--tenant-primary-rgb), 0.35) transparent;
  color: var(--tenant-primary-hover);
}

html:not([data-theme="dark"]) .nav-tabs .nav-link.active,
html:not([data-theme="dark"]) .nav-tabs .nav-item.show .nav-link {
  color: var(--tenant-primary-active) !important;
  border-color: var(--tenant-primary) var(--tenant-primary) var(--bs-body-bg, #fff) !important;
}

html:not([data-theme="dark"]) .nav-pills .nav-link.active,
html:not([data-theme="dark"]) .nav-pills .show > .nav-link {
  background-color: var(--tenant-primary) !important;
  color: var(--tenant-on-primary) !important;
}

html:not([data-theme="dark"]) .nav-pills .nav-link:not(.active):hover {
  color: var(--tenant-primary-hover);
}

/* ---------- Breadcrumbs ---------- */
html:not([data-theme="dark"]) .breadcrumb-item a {
  color: var(--tenant-primary);
}

html:not([data-theme="dark"]) .breadcrumb-item a:hover {
  color: var(--tenant-primary-hover);
}

html:not([data-theme="dark"]) .breadcrumb-item.active {
  color: var(--tenant-primary-active);
}

/* ---------- Pagination ---------- */
html:not([data-theme="dark"]) .page-link {
  color: var(--tenant-primary);
}

html:not([data-theme="dark"]) .page-link:hover {
  color: var(--tenant-primary-hover);
  background-color: var(--tenant-primary-soft);
  border-color: rgba(var(--tenant-primary-rgb), 0.35);
}

html:not([data-theme="dark"]) .page-link:focus {
  color: var(--tenant-primary-hover);
  box-shadow: 0 0 0 0.25rem rgba(var(--tenant-primary-rgb), 0.25);
}

html:not([data-theme="dark"]) .page-item.active .page-link {
  background-color: var(--tenant-primary) !important;
  border-color: var(--tenant-primary) !important;
  color: var(--tenant-on-primary) !important;
}

/* ---------- Dropdowns ---------- */
html:not([data-theme="dark"]) .dropdown-item.active,
html:not([data-theme="dark"]) .dropdown-item:active {
  background-color: var(--tenant-primary) !important;
  color: var(--tenant-on-primary) !important;
}

html:not([data-theme="dark"]) .dropdown-item:focus {
  background-color: var(--tenant-primary-soft);
  color: var(--tenant-primary-active);
}

/* ---------- Tooltips (acento de marca en flecha/borde si aplica primary) ---------- */
html:not([data-theme="dark"]) .tooltip.bs-tooltip-primary .tooltip-inner,
html:not([data-theme="dark"]) .tooltip-primary .tooltip-inner {
  background-color: var(--tenant-primary);
  color: var(--tenant-on-primary);
}

/* ---------- Progress ---------- */
html:not([data-theme="dark"]) .progress-bar:not(.bg-success):not(.bg-danger):not(.bg-warning):not(.bg-info):not(.bg-secondary):not(.bg-dark) {
  background-color: var(--tenant-primary) !important;
  color: var(--tenant-on-primary);
}

html:not([data-theme="dark"]) .progress-bar.bg-primary {
  background-color: var(--tenant-primary) !important;
}

/* ---------- Accordions ---------- */
html:not([data-theme="dark"]) .accordion-button:not(.collapsed) {
  background-color: var(--tenant-primary-soft) !important;
  color: var(--tenant-primary-active) !important;
  box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width, 1px)) 0 rgba(var(--tenant-primary-rgb), 0.35);
}

html:not([data-theme="dark"]) .accordion-button:focus {
  border-color: var(--tenant-primary);
  box-shadow: 0 0 0 0.25rem rgba(var(--tenant-primary-rgb), 0.25);
}

/* ---------- Spinners / loaders Bootstrap ---------- */
html:not([data-theme="dark"]) .spinner-border:not(.text-success):not(.text-danger):not(.text-warning):not(.text-info):not(.text-secondary):not(.text-light):not(.text-dark),
html:not([data-theme="dark"]) .spinner-grow:not(.text-success):not(.text-danger):not(.text-warning):not(.text-info):not(.text-secondary):not(.text-light):not(.text-dark) {
  color: var(--tenant-primary);
  border-color: currentColor;
}

html:not([data-theme="dark"]) .spinner-border.text-primary,
html:not([data-theme="dark"]) .spinner-grow.text-primary,
html:not([data-theme="dark"]) .text-primary {
  color: var(--tenant-primary) !important;
}

/* ---------- Placeholders / skeletons Bootstrap ---------- */
html:not([data-theme="dark"]) .placeholder.bg-primary,
html:not([data-theme="dark"]) .placeholder-glow .placeholder.bg-primary {
  background-color: var(--tenant-primary) !important;
}

/* ---------- List group primary ---------- */
html:not([data-theme="dark"]) .list-group-item.active {
  background-color: var(--tenant-primary) !important;
  border-color: var(--tenant-primary) !important;
  color: var(--tenant-on-primary) !important;
}

html:not([data-theme="dark"]) .list-group-item-primary {
  color: var(--tenant-primary-active) !important;
  background-color: var(--tenant-primary-soft) !important;
}

/* ---------- Avatares con borde de marca ---------- */
html:not([data-theme="dark"]) .avatar-brand,
html:not([data-theme="dark"]) .avatar--brand,
html:not([data-theme="dark"]) .rounded-circle.border-primary {
  border-color: var(--tenant-primary) !important;
}

/* ---------- Chips / etiquetas de marca genéricas ---------- */
html:not([data-theme="dark"]) .chip-brand,
html:not([data-theme="dark"]) .tag-brand,
html:not([data-theme="dark"]) .label-brand {
  background: var(--tenant-primary-soft);
  color: var(--tenant-primary-active);
  border: 1px solid rgba(var(--tenant-primary-rgb), 0.35);
}

html:not([data-theme="dark"]) .chip-brand--solid,
html:not([data-theme="dark"]) .tag-brand--solid {
  background: var(--tenant-gradient);
  color: var(--tenant-on-primary);
  border-color: transparent;
}

/* =========================================================
   Formularios base (reutilizables)
   ========================================================= */

html:not([data-theme="dark"]) .form-control:focus,
html:not([data-theme="dark"]) .form-select:focus,
html:not([data-theme="dark"]) textarea:focus,
html:not([data-theme="dark"]) input:focus:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]) {
  border-color: var(--tenant-primary) !important;
  box-shadow: 0 0 0 0.25rem rgba(var(--tenant-primary-rgb), 0.25) !important;
}

html:not([data-theme="dark"]) .form-control:focus-visible,
html:not([data-theme="dark"]) .form-select:focus-visible {
  outline: 0;
  border-color: var(--tenant-primary) !important;
  box-shadow: 0 0 0 0.25rem rgba(var(--tenant-primary-rgb), 0.25) !important;
}

html:not([data-theme="dark"]) .form-check-input:checked {
  background-color: var(--tenant-primary) !important;
  border-color: var(--tenant-primary) !important;
}

html:not([data-theme="dark"]) .form-check-input:focus {
  border-color: var(--tenant-primary-hover);
  box-shadow: 0 0 0 0.25rem rgba(var(--tenant-primary-rgb), 0.25);
}

html:not([data-theme="dark"]) .form-check-input[type="checkbox"]:indeterminate {
  background-color: var(--tenant-primary) !important;
  border-color: var(--tenant-primary) !important;
}

html:not([data-theme="dark"]) .form-switch .form-check-input:focus {
  --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='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e");
  border-color: var(--tenant-primary-hover);
  box-shadow: 0 0 0 0.25rem rgba(var(--tenant-primary-rgb), 0.25);
}

html:not([data-theme="dark"]) .form-switch .form-check-input:checked {
  background-color: var(--tenant-primary) !important;
  border-color: var(--tenant-primary) !important;
}

html:not([data-theme="dark"]) .form-range:focus {
  outline: 0;
}

html:not([data-theme="dark"]) .form-range:focus::-webkit-slider-thumb {
  box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(var(--tenant-primary-rgb), 0.25);
}

html:not([data-theme="dark"]) .form-range::-webkit-slider-thumb {
  background-color: var(--tenant-primary);
}

html:not([data-theme="dark"]) .form-range::-moz-range-thumb {
  background-color: var(--tenant-primary);
}

html:not([data-theme="dark"]) .form-range::-webkit-slider-thumb:active {
  background-color: var(--tenant-primary-active);
}

html:not([data-theme="dark"]) .form-range::-moz-range-thumb:active {
  background-color: var(--tenant-primary-active);
}

/* Select2 (plugin compartido en head) — foco de marca */
html:not([data-theme="dark"]) .select2-container--default .select2-results__option--highlighted[aria-selected],
html:not([data-theme="dark"]) .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background-color: var(--tenant-primary) !important;
  color: var(--tenant-on-primary) !important;
}

html:not([data-theme="dark"]) .select2-container--default.select2-container--focus .select2-selection--single,
html:not([data-theme="dark"]) .select2-container--default.select2-container--focus .select2-selection--multiple,
html:not([data-theme="dark"]) .select2-container--default.select2-container--open .select2-selection--single,
html:not([data-theme="dark"]) .select2-container--default.select2-container--open .select2-selection--multiple {
  border-color: var(--tenant-primary) !important;
  box-shadow: 0 0 0 0.25rem rgba(var(--tenant-primary-rgb), 0.25);
}
