/* === Bootstrap 5.3+ Dark Palette — DoLoyalty === */
:root,[data-bs-theme="dark"]{
  /* Core */
  --bs-body-bg: #0b0f14;
  --bs-body-color: #e6edf3;
  --bs-emphasis-color: #ffffff;
  --bs-secondary-color: #9aa4af;
  --bs-border-color: #1f2937;

  /* Brand (ajusta a tu gusto) */
  --bs-primary: #3b82f6;         /* azul */
  --bs-primary-rgb: 59,130,246;
  --bs-link-color: var(--bs-primary);
  --bs-link-hover-color: #60a5fa;

  /* Surfaces */
  --bs-tertiary-bg: #0f172a;     /* inputs / cards base */
  --bs-secondary-bg: #111827;    /* elevated */
  --bs-dark: #0b0f14;

  /* Components */
  --bs-btn-border-radius: .625rem;
  --bs-card-bg: var(--bs-secondary-bg);
  --bs-card-border-color: var(--bs-border-color);
  --bs-dropdown-bg: var(--bs-secondary-bg);
  --bs-dropdown-link-color: var(--bs-body-color);
  --bs-dropdown-link-hover-bg: #121c2f;
  --bs-popover-bg: var(--bs-secondary-bg);
  --bs-modal-bg: var(--bs-secondary-bg);
  --bs-list-group-bg: var(--bs-secondary-bg);
  --bs-list-group-border-color: var(--bs-border-color);
  --bs-tooltip-bg: rgba(0,0,0,.85);

  /* Forms */
  --bs-form-control-bg: var(--bs-tertiary-bg);
  --bs-form-control-color: var(--bs-body-color);
  --bs-form-control-border-color: var(--bs-border-color);
  --bs-input-bg: var(--bs-tertiary-bg);
  --bs-input-color: var(--bs-body-color);
  --bs-input-border-color: var(--bs-border-color);
}

/* Navbar */
.navbar, .offcanvas, .dropdown-menu{
  backdrop-filter: saturate(150%) blur(8px);
}

/* Buttons */
.btn-primary{
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.btn-primary:hover{ filter: brightness(1.08); }
.btn-outline-primary{
  color: var(--bs-primary);
  border-color: rgba(var(--bs-primary-rgb), .6);
}
.btn-outline-primary:hover{
  background-color: rgba(var(--bs-primary-rgb), .12);
  border-color: var(--bs-primary);
}

/* Cards, modals, popovers */
.card, .modal-content, .popover{
  background-color: var(--bs-card-bg);
  border-color: var(--bs-card-border-color);
}

/* Tables */
.table{
  --bs-table-color: var(--bs-body-color);
  --bs-table-bg: transparent;
  --bs-table-border-color: var(--bs-border-color);
}
.table-striped > tbody > tr:nth-of-type(odd){
  --bs-table-accent-bg: rgba(255,255,255,.03);
}
.table-hover > tbody > tr:hover{
  --bs-table-accent-bg: rgba(255,255,255,.05);
}

/* Forms */
.form-control, .form-select, .form-check-input{
  background-color: var(--bs-form-control-bg);
  color: var(--bs-form-control-color);
  border-color: var(--bs-form-control-border-color);
}
.form-control:focus, .form-select:focus{
  border-color: rgba(var(--bs-primary-rgb), .6);
  box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb), .25);
}
.form-check-input:checked{
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}

/* Alerts */
.alert{
  --bs-alert-bg: rgba(255,255,255,.04);
  --bs-alert-border-color: var(--bs-border-color);
  --bs-alert-color: var(--bs-body-color);
}

/* Breadcrumb / Pagination / Badges */
.breadcrumb-item + .breadcrumb-item::before{
  color: var(--bs-secondary-color);
}
.page-link{
  background-color: var(--bs-tertiary-bg);
  border-color: var(--bs-border-color);
  color: var(--bs-body-color);
}
.page-link:hover{ background-color: #121c2f; }
.badge.bg-primary{ background-color: var(--bs-primary) !important; }

/* Utilities */
.hr, hr{ border-top-color: var(--bs-border-color); }
.text-muted{ color: var(--bs-secondary-color) !important; }

/* Optional: smooth corners & subtle shadows */
.card, .modal-content, .dropdown-menu{
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}