@charset "UTF-8";

:root
{
  --metrify-primary:linear-gradient(87deg, #020024 0, #204497 100%);
  --metrify:linear-gradient(310deg, #141727 0, #3a416f 100%);
  --metrify-secondary:linear-gradient(87deg, #1f7b9e 0, #37c8e1 100%);
  --metrify-error: #fb6340;
  --metrify-warning: #fd7e14;
  --metrify-info: #323232;
  --metrify-default: #363b66;
}

.metrify-bg-gradient{
  background: var(--metrify) !important;
}

.metrify-bg-gradient-primary {
  background: var(--metrify-primary) !important;
}

.metrify-bg-gradient-secondary {
  background: var(--metrify-secondary) !important;
}

.metrify-btn-margin-left {
  margin-left: 7px !important;
}

.table td,
.table th {
  font-size: .80rem;
  white-space: nowrap;
}

table.table.dataTable>tbody>tr.selected>* {
  box-shadow: inset 0 0 0 9999px rgb(55 60 103 / 95%) !important;
  color: white !important;
}

.dt-length .form-select {
  background-position: right .6rem !important;
}

div.dt-container div.dt-length label {
  margin-right: .25rem !important;
}

.metrify-btn-default {
  color: #fff;
  background-color: var(--metrify-default) !important;
  box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);
  max-width: 120px !important;
  width: 30rem !important;
  margin-left: 5px !important;
  height: 2.6rem !important;
  padding-right: 5px !important;
  padding-left: 5px !important;
}

.typeahead__container.hint .typeahead__field input,
.typeahead__container.hint .typeahead__field textarea,
.typeahead__container.hint .typeahead__field [contenteditable] {
  background: white !important;
}

.metrify-typeahead-dashboard {
  border: 1px solid #d2d6da !important;
  font-size: .875rem !important;
  font-weight: 400 !important;
  color: #495057 !important;
  border-radius: .5rem !important;
  transition: box-shadow .15s ease, border-color .15s ease !important;
}

.typeahead__list{
  padding: .2rem !important;
  font-size: .875rem !important;
  border-radius: .8rem !important;
}

.typeahead__list .typeahead__item:not([disabled]) > a:hover,
.typeahead__list .typeahead__item:not([disabled]) > a:focus,
.typeahead__list .typeahead__item:not([disabled]).active > a,
.typeahead__dropdown .typeahead__dropdown-item:not([disabled]) > a:hover,
.typeahead__dropdown .typeahead__dropdown-item:not([disabled]) > a:focus,
.typeahead__dropdown .typeahead__dropdown-item:not([disabled]).active > a {
  background-color: rgb(131 146 171) !important;
  color: white;
  border-radius: .8rem !important;
}

div.dt-container div.dt-search {
  padding-right: 1rem !important;
}

div.dt-container div.dt-paging ul.pagination {
  margin: 0 !important;
  padding: 1rem !important;
  justify-content: flex-end !important;
}

.active>.page-link, .page-link.active {
  color: white !important;
  background-color: rgb(131 146 171) !important;
  border-color: rgb(131 146 171) !important;
}

div.dt-container div.dt-info {
  padding: 1rem !important;
  font-size: 80% !important;
  font-weight: 400 !important;
}

.table > thead {
  background-color: #f1f3f5 !important;
}

.table>:not(:first-child) {
  border-top: 0px solid currentColor !important;
}

.table-striped>tbody>tr:nth-of-type(odd)>* {
  box-shadow: inset 0 0 0 9999px rgb(249, 249, 249, 0.5) !important;
  color: #354767 !important;
}

.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
  font-size: .675rem !important;
  font-weight: bold !important;
  line-height: 1.5rem !important;
  display: inline-flex !important;
  color: #abb5c5 !important;
  border: none !important;
  border-radius: .25rem !important;
  background-color: #f1f3f5 !important;
  padding-left: .65em !important;
  padding-right: .65em !important;
  padding-top: unset !important; /* Mantén el padding-top original */
  padding-bottom: unset !important; /* Mantén el padding-bottom original */
  margin-bottom: unset !important; /* Mantén el margin-bottom original */
}

.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__rendered .select2-selection__choice .select2-selection__choice__remove {
  width: .25rem !important;
  height: .25rem !important;
}

.select2-container--bootstrap-5 .select2-selection--multiple .select2-search {
  box-sizing: border-box !important;
  width: 100% !important;
  padding: 0 .375rem !important;
  margin: 0 !important;
  list-style: none !important;
}

.select2-selection__rendered--bootstrap-5 {
  max-height: 3em !important;
  overflow-y: auto !important;
}

.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option.select2-results__option--selected, .select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option[aria-selected=true]:not(.select2-results__option--highlighted) {
  color: #fff !important;
  background-color:  rgb(131 146 171) !important;
}

div.dt-buttons div.dropdown-menu {
  width: 200px !important;
}

.bg-gradient-metrify-alert {
  background-image: linear-gradient(310deg, #7928ca, #ff0080) !important;
  transition: all .15s ease !important;
  letter-spacing: -.025em !important;
  color: #fff !important;
}

.bg-gradient-metrify-alert-info {
  background-image: linear-gradient(310deg, #59caf1, #214d87) !important;
  transition: all .15s ease !important;
  letter-spacing: -.025em !important;
  color: #fff !important;
}

.metrify-block {
  pointer-events: none !important;
}

.select2 {
  width:100% !important;
}

input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none !important;
  height: 1em !important;
  width: 1em !important;
  border-radius: 50em !important;
  background: url(https://pro.fontawesome.com/releases/v5.10.0/svgs/solid/times-circle.svg) no-repeat 50% 50% !important;
  background-size: contain !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

input[type="search"]:focus::-webkit-search-cancel-button {
  opacity: .3 !important;
  pointer-events: all !important;
}

input[type="search"].dark::-webkit-search-cancel-button {
  filter: invert(1) !important;
}

.input-group-append {
  cursor: pointer !important;
}

.typeahead__field input, .typeahead__field textarea, .typeahead__field [contenteditable], .typeahead__field .typeahead__hint {
  color: #495057 !important;
}

.typeahead_metrify {
  border-right: unset !important;
  padding-right: unset !important;
  border-top-right-radius: .5rem !important;
  transition: box-shadow .15s ease, border-color .15s ease;
  border-right: 1px solid #d2d6da !important;
  border-bottom-right-radius: .5rem !important;
  font-size: .875rem !important;
}

.form-switch .form-check-input:checked {
  border-color: var(--metrify-default) !important;
  background-color: var(--metrify-default) !important;
}

.typeahead_metrify_btn {
  font-size: .875rem !important;
  border-top-left-radius: .5rem !important;
  transition: box-shadow .15s ease, border-color .15s ease;
  border-bottom-left-radius: .5rem !important;
  border: 1px solid #d2d6da !important;
}

.metrify_border {
  border: 1px solid #d2d6da !important;
}

.form-switch .form-check-input:checked {
  border-color: var(--metrify-default) !important;
  background-color: var(--metrify-default) !important;
}

.typeahead__list {
  max-height: 350px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

.metrify-bg-menu {
  color: #f8f9fa !important;
  border-color: #f8f9fa !important;
  background-color: #f8f9fa !important;
}

.accordion .accordion-button {
  padding: 0.5rem 0.5rem !important;
  font-size: 15px !important;
}

.metrify-bg-row {
  color: #adb5bd !important;
  border-color: #e9ecef !important;
  background-color: #e9ecef !important;
}

.input-group-text {
  color: #d2d6da !important;
}

.dt-button {
  display: inline-block !important;
  margin-right: 5px !important;
}

.dt-button i {
  margin-right: 5px !important;
}

.dt-search input[type="search"] {
  width: 250px !important;
}

.btn-outline-secondary {
  --bs-btn-color: #d2d6da !important;
}

.btn-outline-primary {
  color: var(--metrify-default) !important;
}

.btn-outline-primary:hover {
  color: #fff !important;
  background-color: var(--metrify-default) !important;
  border-color: var(--metrify-default) !important;
}

.metrify-dropdown {
  display: none !important; /* Oculto por defecto */
}

.metrify-dropdown.show {
  display: block !important; /* Se muestra cuando Bootstrap añade la clase `show` */
  visibility: visible !important; /* Visible al abrir */
}

.modal {
  --bs-modal-zindex: 10000 !important;
}

[id^=NotiflixNotifyWrap] {
  z-index: 10005 !important;
}

.notiflix-report {
  z-index: 10001 !important;
}

.select2-dropdown {
  z-index: 10060 !important;
}