/*Variables de color*/
:root {
  --primary: rgb(172, 116, 153);
  --secondary: rgb(230, 195, 171);
  --complementary: rgb(194, 222, 246);
  --contrast: rgb(143, 144, 143);
}

/*Menu Lateral*/
#main-menu .menu .menu-item.active {
  background-color: white !important;
}

#main-menu .menu .menu-item.active:not(.expanded) .menu-icon,
#main-menu .menu .menu-item.active:not(.expanded) a {
  color: var(--primary);
}

.main-header #header-logo a {
  color: var(--primary);
}

span.logo-compact img {
  padding-right: 10px;
}

span.logo-custom img,
a.responsive-logo img {
  height: 60px;
}
.sidebar {
  background-color: rgb(217, 235, 250);
}

/* Content-Header*/

#navigation-toggler {
  color: black;
}
#navigation-toggler:hover,
#navigation-toggler:focus,
#navigation-toggler:active {
  color: var(--primary);
}

#contenido-header {
  max-width: 80dvw;
}
#selector-idioma {
  margin-right: 1.5rem;
}

a.user-details:hover,
a.user-details:focus,
a.user-details:active {
  background-color: var(--secondary);
  color: black !important;
}

.user-avatar-icon-background {
  color: var(--primary) !important;
}

.user-avatar-icon-foreground {
  color: white !important;
}

.content-header h1.title {
  color: var(--primary);
  max-width: 100vw;
}

@media (min-width: 992px) {
  .content-header {
    display: inline-block;
  }
  .content-header h1.title {
    margin-bottom: 1em;
  }
  .content-header .page-actions {
    justify-content: unset;
  }
}

/* Filtros*/
.action-filters-button:hover {
  background-color: var(--secondary);
}
.action-filters-button i {
  color: var(--contrast);
}
.filter-heading input[type="checkbox"].filter-checkbox:checked {
  accent-color: var(--primary);
}
.filter-heading a {
  color: var(--primary);
}

/*Tabla*/
span.badge.badge-boolean-true {
  background-color: var(--primary);
}
span.badge.badge-boolean-false {
  background-color: var(--secondary);
}

.datagrid thead .sorted i {
  color: var(--primary);
}

th.sorted::after {
  content: "";
  display: block;
  margin: auto;
  height: 2px;
  background-color: var(--primary);
}

/*Formularios*/
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
  border: 1px solid var(--primary);
  box-shadow: 0 0 0 0.15rem rgba(172, 116, 153, 0.4) !important;
}

input[type="checkbox"].form-check-input:checked {
  background-color: var(--primary);
  border-color: var(--secondary);
}

input[type="radio"]:checked {
  accent-color: var(--primary);
}

input[type="radio"].form-check-input:checked {
  background-color: var(--primary);
  border-color: var(--primary);
}

/*Botones*/
.btn-primary,
a.btn.active.idioma {
  background-color: var(--primary);
  border-color: var(--primary);
  color: white !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn.idioma:not(.active) {
  background-color: var(--secondary) !important;
  border-color: var(--secondary) !important;
  color: black !important;
}

a.btn.idioma:not(.active, .btn-labeled, .action-filters-button):hover,
a.btn.idioma:not(.active, .btn-labeled, .action-filters-button):focus,
a.btn.idioma:not(.active, .btn-labeled, .action-filters-button):active {
  background-color: var(--complementary) !important;
  border-color: var(--complementary) !important;
  color: black;
}

.action-saveAndAddAnother:hover,
.action-saveAndAddAnother:focus,
.action-saveAndAddAnother:active {
  background-color: var(--secondary) !important;
  border-color: var(--secondary) !important;
  color: black !important;
}

/*Footer*/
.page-item.active .page-link {
  background-color: var(--primary);
  border-color: var(--primary);
}

.page-item.active .page-link:hover,
.page-item.active .page-link:focus,
.page-item.active .page-link:active {
  background-color: var(--secondary);
  border-color: var(--secondary);
  color: black;
}