:root {
  --bg-input-two-factor: #d9d9d9;
  --accent-color: #1b80f2;
  --option-select-hover:  #1b80f2;
  --accent-text-color: #FFFFFF;
  --disabled-button-color: #d9d9d9;
  --border-input-color: #2d2d2d;
  --nav-links-color: #ffffff;
  --secondary-color: #22135e;
  --secondary-text-color: #FFFFFF;
  --settings-description-color: #a0a0a0;
  --tootltip-bg: #2d2d2d;
  --bg-main: linear-gradient(
    180deg,
    rgba(53, 35, 158, 1) 0%,
    rgba(34, 19, 94, 1) 100%
  );
  --bg-nav-link-active: linear-gradient(
    90deg,
    rgba(27, 128, 242, 1) 0%,
    rgba(18, 84, 158, 1) 100%
  );
  font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
  line-height: 1.5;
  font-weight: 400;

  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box !important;
  font-family: 'Mulish', sans-serif;
  font-optical-sizing: auto;
  color: #2d2d2d;
}

body {
  width: 100%;
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: var(--bg-main);
}

#root {
  width: 100%;
  min-height: 100vh;
  /*max-width: 1440px;*/
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

@media screen and (max-width: 750px) {
  .template_container {
    overflow-y: scroll !important;
  }
}

@media screen and (max-width: 1030px) {
  .dco-dashboard-filtros-container {
    flex-direction: column !important;
    gap: 10px;
  }

  .gestion_filter_form {
    justify-content: space-around !important;
  }
}

/*Scale*/
@media screen and (min-width: 1400px) {
  #root > div.main_template_container {
    scale: 1.05;
    width: 100dvw;
  }
  
  #root > div.template_completeRegister {
    scale: 1.05;
    width: 100dvw;
  }

  #root > div > div.login_card {
    scale: 1.05;
    width: 100dvw;
  }

  div > div > .modal_container {
    min-height: min-content !important;
    width: 120% !important;
    height: 120% !important;
    left: -10% !important;
    top: -10% !important;
  }

  .custom_alerts {
    scale: 1.05;
  }

  #root > .modal_container.dco-details-transaccions-modal-container {
    scale: 1.05;
  }
}

@media screen and (min-width: 1600px) {
  #root > div.main_template_container {
    scale: 1.1;
  }
  
  #root > div.template_completeRegister {
    scale: 1.1;
    width: 100dvw;
  }

  #root > div > div.login_card {
    scale: 1.1;
    width: 100dvw;
  }

  .custom_alerts {
    scale: 1.1;
  }

  #root > .modal_container.dco-details-transaccions-modal-container {
    scale: 1.1;
  }
}

@media screen and (min-width: 1920px) {
  #root > div.main_template_container {
    scale: 1.3;
  }

  #root > div.template_completeRegister {
    scale: 1.3;
    width: 100dvw;
  }

  #root > div > div.login_card {
    scale: 1.3;
  }

  .custom_alerts {
    scale: 1.3;
  }

  #root > .modal_container.dco-details-transaccions-modal-container {
    scale: 1.3;
  }
  .MuiPaper-root {
    scale: 1.3;
  }
}
@media screen and (min-width: 2560px) {
  #root > div.main_template_container {
    scale: 1.8;
  }
  #root > div.template_completeRegister {
    scale: 1.8;
    width: 100dvw;
  }

  #root > div > div.login_card {
    scale: 1.8;
  }

  .custom_alerts {
    scale: 1.8;
  }
  #root > .modal_container {
    scale: 1.5;
  }
  #root > .input_select_option_container_status {
    scale: 1.5;
  }
  #root > .modal_container.dco-details-transaccions-modal-container {
    scale: 1.8;
  }
  #chart_transactions_consorcio .c3-chart-arcs {
    scale: calc(1 / 1.5);
  }
  .MuiPaper-root {
    scale: 1.8;
  }
}
@media screen and (min-width: 3840px) {
  #root > div.main_template_container {
    scale: 2.5;
  }

  #root > div.template_completeRegister {
    scale: 2.5;
    width: 100dvw;
  }

  #root > div > div.login_card {
    scale: 2.5;
  }

  .custom_alerts {
    scale: 2.5;
  }
  #root > .modal_container {
    scale: 2;
  }
  #root > .input_select_option_container_status {
    scale: 2.5;
  }
  #root > .modal_container.dco-details-transaccions-modal-container {
    scale: 2.5;
  }
  #chart_transactions_consorcio .c3-chart-arcs {
    scale: calc(1 / 1.8);
  }
  .MuiPaper-root {
    scale: 2.5;
  }
}
.logo_d {
  display: none;
  width: 50%;
  height: auto;
}

@media screen and (max-width: 768px) {
  .main_template_container {
    flex-direction: row !important;
  }

  .desktop_nav {
    max-width: 75.11px !important;
    height: 100%;
    max-height: 95% !important;
  }

  .desktop_nav .dco_nav_link span {
    min-width: 23.11px !important;
    min-height: 16px !important;
  }

  .desktop_nav .dco_nav_link {
    font-size: 0px !important;
  }
  .dco_nav_logo_parent {
    display: none !important;
  }
  .logo_d {
   display: block !important;
   border-radius: 50%;
  }

  .desktop_nav .dco_nav_bar {
    width: 28.89px !important;
  }

  .dco-graficas-contenedor-scroll {
    flex-direction: column !important;
  }

  .dco_graficas-contenedorGrafica {
    width: 100% !important;
  }

  .dco_gracicasDashboard-filtros-busqueda {
    width: 100%;
    flex-direction: column-reverse !important;
    justify-content: flex-end !important;
    align-items: flex-start !important;
    margin-top: 10px;
  }

  .dco_gracicasDashboard-filtros-busqueda .fecha-filtros-dashboard {
    max-width: 100% !important;
  }

  .dco-dashboard-filtros-container {
    flex-wrap: wrap !important;
  }

  .dco_graficasDashboard-barraestadisticas > div > div {
    width: 45% !important;
    scale: 0.8;
  }

  .dco_nodos-filters .MuiAccordionDetails-root > div {
    max-width: 100% !important;
  }

  .MuiAccordionDetails-root .MuiStack-root {
    width: 100% !important;
  }
}

.mobile_nav {
  background: #2d2d2d;
  padding: 1rem 3rem;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Global styles */
.main_template_container {
  padding: 40px !important;
  max-width: 1280px;
  max-height: 768px;
}

@media screen and (min-width: 473px) {
  .mobile_nav {
    display: none !important;
  }
}

.responsive_nav_logo {
  width: 70%;
  max-width: 200px;
  height: auto;
  max-height: 45px;
}

.template_container {
  padding: 0 20px 50px 20px !important;
  overflow-x: auto;
}

@media screen and (max-width: 500px) {
  .main_template_container {
    padding: 16px !important;
  }
}

.dashboard-card-wide {
  flex: 149 0 149px;
  max-width: 149px;
}

.dashboard-card-narrow {
  flex: 1 0 149px;
}

@media screen and (max-width: 768px) {
  .template_container {
    max-width: 95%;
    max-height: 95%;
  }
}

.main_title {
  font-size: 16px;
  color: var(--secondary-color);
  font-weight: bold;
  margin: 0;
}

.main_title > span {
  font-size: 16px;
  color: #2d2d2d;
  font-weight: bold;
  margin: 0;
  opacity: 0.5;
}

.node_title {
  font-size: 16px;
  color: var(--secondary-color);
  font-weight: bold;
  margin: 0;
}

.node_title > span {
  font-size: 16px;
  color: #2d2d2d;
  font-weight: bold;
  margin: 0;
  opacity: 0.5;
}

.main_subtitle {
  font-size: 8px;
  color: var(--border-input-color);
  opacity: 0.5;
  margin: 0;
}

.card_title {
  font-size: 22px;
  font-weight: bold;
  color: var(--secondary-color);
}

.card_text {
  font-size: 16px;
}

.button {
  font-size: 12px;
  color: white;
  font-weight: bold;
  border: none;
  padding: 11px 20px;
  border-radius: 4px;
}

.cancel_button {
  font-size: 12px;
  font-weight: bold;
  border: none;
  padding: 11px 20px;
  border-radius: 4px;
  background: transparent;
  color: #d9d9d9;
}

.cabcel_button:hover {
  cursor: pointer;
}

.button_active {
  background: var(--accent-color);
  background-color: var(--accent-color);
  color: var(--accent-text-color);
}

.button_active:hover {
  cursor: pointer;
}

.button_disabled {
  background: var(--disabled-button-color);
}

.button_disabled:hover {
  cursor: not-allowed;
}

.button_pagination_active {
  padding: 0 5px;
  color: var(--accent-color);
  fill: var(--accent-color);
  border: 1px solid var(--accent-color);
  min-width: 30px;
  max-height: 30px;
  min-height: 30px;
  font-size: 12px;
  font-weight: bold;
}

.button_pagination_inactive {
  padding: 0 5px;
  color: var(--disabled-button-color);
  fill: var(--disabled-button-color);
  border: 1px solid var(--disabled-button-color);
  min-width: 30px;
  max-height: 30px;
  min-height: 30px;
  font-size: 12px;
  font-weight: bold;
  transition: all 0.2s ease-in-out;
}

.button_pagination_enabled {
  padding: 0 5px;
  color: var(--disabled-button-color);
  fill: var(--disabled-button-color);
  border: 1px solid var(--disabled-button-color);
  min-width: 30px;
  max-height: 30px;
  min-height: 30px;
  font-size: 12px;
  font-weight: bold;
  transition: all 0.2s ease-in-out;
}

.button_pagination_inactive:hover {
  color: var(--accent-color);
  border: 1px solid var(--accent-color);
  fill: var(--accent-color);
}

.user_export_data_container {
  width: 100%;
  max-width: 535px;
  height: 100%;
  max-height: 318px;
  padding: 55px 66px 20px 70px !important;
}

.export_button {
  height: fit-content;
  background: var(--accent-color);
  padding: 6px 9px 6px 11px;
  border-radius: 4px;
  color: var(--accent-text-color);
  border: none;
  font-size: 10px;
  font-weight: 700;
  height: fit-content;
  max-height: 30px;
}
.export_button svg {
  scale: .9;
}
.export_button_fill {
  fill: var(--accent-text-color);
}

.export_button_stroke {
  stroke: var(--accent-text-color);
}

.create_button {
  background: #609571;
  padding: 6px 10px;
  border-radius: 4px;
  color: white;
  border: none;
  font-size: 10px;
  font-weight: 700;
  height: fit-content;
  max-height: 30px;
  line-height: 16px;
}

.create_button path {
  fill: white;
}

/* Login styles */
.forgot_link {
  color: var(--accent-color);
  font-size: 12px;
  text-decoration: none;
}

.forgot_link:hover {
  cursor: pointer;
  color: var(--accent-color);

}

.button_steps {
  width: fit-content;
  font-size: 12px !important;
  padding: 10px 20px !important;
}

.login_card {
  width: 100dvw !important;
  max-width: 600px !important;
  height: fit-content;
  min-height: 480px !important;
  border-radius: 4px;
  padding-top: 69px !important;
}

.login_logo {
  max-width: 279px !important;
  width: 100%;
  height: auto;
}

/* Menu button styles */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type='number'] {
  -moz-appearance: textfield;
}

.hamburger {
  cursor: pointer;
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 99999;
  display: none;
}

.hamburger input {
  display: none;
}

.hamburger svg {
  height: 2em;
  transition: transform 600ms cubic-bezier(0.4, 0, 0.2, 1);
}

.hamburger.menu_mobile_show {
  left: 49%;
  background-color: #2d2d2d;
  display: flex;
  align-items: center;
}

.hamburger .open-nav-mobile {
  display: none;
}

.hamburger.menu_mobile_show .open-nav-mobile {
  display: block;
  width: 22px;
  height: 22px;
}

.hamburger.menu_mobile_show .close-nav-mobile {
  display: none;
}

.line {
  fill: none;
  stroke: white;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 3;
  transition: stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1),
    stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
}

.line-top-bottom {
  stroke-dasharray: 12 63;
}

.hamburger input:checked + svg {
  transform: rotate(-45deg);
}

.hamburger input:checked + svg .line-top-bottom {
  stroke-dasharray: 20 300;
  stroke-dashoffset: -32.42;
}

@media screen and (max-width: 768px) {
  .hamburger {
    display: block;
  }
}

/* Loader styles */
.loader_container {
  z-index: 99999 !important;
}

.alert_container {
  z-index: 99999 !important;
}

.loader {
  position: relative;
  width: 88px;
  height: 88px;
  border-radius: 10px;
  background: rgb(0, 0, 0, 0.8);
}

.loader div {
  width: 6px;
  height: 14px;
  background: rgb(255, 255, 255);
  position: absolute;
  left: 46%;
  top: 43%;
  opacity: 0;
  border-radius: 50px;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  animation: fade458 1s linear infinite;
}

@keyframes fade458 {
  from {
    opacity: 1;
  }

  to {
    opacity: 0.25;
  }
}

.loader .bar1 {
  transform: rotate(0deg) translate(0, -110%);
  animation-delay: 0s;
}

.loader .bar2 {
  transform: rotate(45deg) translate(0, -110%);
  animation-delay: -0.7s;
}

.loader .bar3 {
  transform: rotate(90deg) translate(0, -110%);
  animation-delay: -0.6s;
}

.loader .bar4 {
  transform: rotate(135deg) translate(0, -110%);
  animation-delay: -0.5s;
}

.loader .bar5 {
  transform: rotate(180deg) translate(0, -110%);
  animation-delay: -0.4s;
}

.loader .bar6 {
  transform: rotate(225deg) translate(0, -110%);
  animation-delay: -0.3s;
}

.loader .bar7 {
  transform: rotate(270deg) translate(0, -110%);
  animation-delay: -0.2s;
}

.loader .bar8 {
  transform: rotate(315deg) translate(0, -110%);
  animation-delay: -0.1s;
}

.base-Popper-root {
  z-index: 9999 !important;
}

.c3-legend-item {
  font-size: 8px !important;
  color: #2d2d2d80;
  display: flex;
  align-items: center;
}

.tick {
  font-size: 6.07px !important;
}

/* Avatar inputs */
.avatar_input:hover {
  cursor: pointer;
}

.input_file_profile {
  min-width: 37px;
  height: 37px;
}

.input_file_profile:hover {
  cursor: pointer !important;
}

input#file-upload-button:hover {
  cursor: pointer !important;
  display: none;
}

/* Input styles */

.input {
  width: 100%;
  padding: 0.45rem 0.75rem;
  font-size: 12px;
  font-weight: bold;
  line-height: 1.5;
  color: var(--bs-body-color);
  border: 1px solid var(--border-input-color);
  border-radius: 4px;
  transition: border-color 0.15s ease-in-out;
}

.input:focus-visible {
  outline: none;
}

.input_label {
  font-size: 12px;
  font-weight: bold;
  z-index: 1;
  transition: all 0.3s ease-in-out;
}

.input_label_inside_input {
  top: 50%;
  left: 0.75rem;
  transform: translateY(-50%);
}

.button_input_reset {
  top: 50%;
  right: 13px;
  transform: translateY(-50%);
}

.input_label_outside_input {
  white-space: nowrap;
  font-weight: 400 !important;
  top: 0%;
  left: 0.27rem;
  transform: translateY(-100%);
  font-size: 10px;
}

.input_label_inside_input_search {
  top: 50%;
  left: 2.6rem;
  transform: translateY(-50%);
}

.input_label_outside_input_search {
  font-weight: 400 !important;
  top: 0%;
  left: 0.27rem;
  transform: translateY(-100%);
  font-size: 10px;
}

.input_label_inside_input_phone {
  top: 50%;
  left: 3.6rem;
  transform: translateY(-50%);
}

.input_label_outside_input_phone {
  font-weight: 400 !important;
  top: 0%;
  left: 0.27rem;
  transform: translateY(-100%);
  font-size: 10px;
}

.input_label_error {
  color: var(--bs-form-invalid-border-color);
}

.input_label_valid {
  color: var(--bs-form-valid-border-color);
}

/* Phone input styles */

.input_phone_container {
  border-radius: 4px;
}

.input_phone {
  padding: 0.45rem 0.75rem !important;
  font-size: 12px !important;
  font-weight: bold !important;
  line-height: 1.5 !important;
  color: var(--bs-body-color);
  border: none !important;
  border-radius: 4px;
  transition: border-color 0.15s ease-in-out;
}

.input_phone:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

.input_phone:focus {
  outline: none !important;
  box-shadow: none !important;
}

.phone_input_label {
  font-size: 12px !important;
}

.phone_input_label::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  height: 50%;
  width: 1px;
}

.phone_input_label_error::after {
  background-color: var(--bs-danger);
}

.phone_input_label_neutral::after {
  background-color: black;
}

.phone_input_label_vallid::after {
  background-color: rgba(var(--bs-success-rgb));
}

/* Input date picker styles */

.input_date_picker {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--bs-body-color);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: var(--bs-body-bg);
  background-clip: padding-box;
  border-radius: 4px;
  transition: border-color 0.15s ease-in-out;
  box-shadow: none;
  border: 1px solid #000 !important;
}

.input_date_picker:focus-visible {
  outline: none;
}

.input_date_picker input::placeholder {
  opacity: 0 !important;
}

.input_date_picker input {
  font-size: 12px !important;
}

.input_date_picker fieldset {
  border: none !important;
}

.input_date_picker button > svg {
  fill: none !important;
  display: none !important;
}

.input_date_picker button {
  position: relative;
  margin-right: 0px;
  width: 12px;
  height: 12px;
}

.input_date_picker button::after {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  background: url(/images/icons/calendar.webp) no-repeat center/80% auto;
}

/* Input password validator styles */

.password_requirements_container {
  padding: 0 !important;
  gap: 2px;
}

.password_requirements_container span {
  min-height: 4px;
  background: #d9d9d9;
}

.password_requirements_strenght_label {
  font-size: 10px;
}

.password_requirements_tooltip_text {
  font-size: 8.59px;
  margin: 0;
  color: #ffffff;
}

.password_requirements_tooltip_text_error {
  font-size: 8.59px;
  margin: 0;
  color: #ff0000;
}

.password_requirements_tooltip_text_valid {
  font-size: 8.59px;
  margin: 0;
  color: #0da60a;
}

/* Tooltip password validator styles */
.tooltip_password_validator {
  border-radius: 3px;
  z-index: 9998;
  background-color: #2d2d2d;
  padding: 19px 27.5px !important;
}
.tooltip_password_validator::after {
  content: ' ';
  position: absolute;
  top: 15%;
  right: 100%; /* parte izquierda del tooltip */
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent #2d2d2d transparent transparent;
}

.tooltip_password_validator_button {
  border: none;
  width: fit-content;
  background: transparent;
}

/* Input styles */

.input_toggle_icon {
  position: absolute;
  min-width: 16px;
  min-height: 16px;
  max-width: 16px;
  max-height: 16px;
  background: transparent;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1px;
  border: 0.27px solid #d9d9d9;
  border-radius: 50%;
  top: 50%;
  right: 9px;
  transform: translateY(-50%);
  pointer-events: none;
}

.input_toggle_icon > span {
  min-width: 2.13px;
  min-height: 2.13px;
  max-width: 2.13px;
  max-height: 2.13px;
  border-radius: 50%;
  background: #2d2d2d;
}

/* Input search styles */

.input_search {
  width: 100%;
  padding: 6px 10px 6px 35px;
  font-size: 10px;
  font-weight: bold;
  color: var(--bs-body-color);
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  transition: border-color 0.15s ease-in-out;
}

.input_search_icon {
  position: absolute;
  width: 16px;
  height: 17.14px;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
}

.input_search:focus-visible {
  outline: none;
}

/* Input select styles */

.label_value_select {
  white-space: nowrap;
  /* position: absolute;
  top: 50%;
  transform: translateY(-50%); */
}

.input_select {
  width: 100%;
  min-height: 35.2px;
  padding: 0.475rem 2.3rem 0.475rem 0.75rem;
  font-size: 12px;
  font-weight: bold;
  line-height: 1.5;
  color: #000;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #fff;
  background-clip: padding-box;
  border-radius: 4px;
}

.input_select:hover {
  cursor: pointer;
}

.input_select_option_container {
  min-width: 100%;
  max-height: 120px;
  display: grid;
  position: absolute;
  bottom: 0;
  left: 0;
  transform: translateY(101%);
  border-radius: 0px 0px 4px 4px;
  background: #fff;
  overflow-x: hidden;
  overflow-y: auto;
  z-index: 10;
}

.input_select_option_container_status {
  width: fit-content;
  max-height: 120px;
  display: grid;
  position: fixed;
  border-radius: 0px 0px 4px 4px;
  background: #fff;
  overflow-x: hidden;
  overflow-y: auto;
  z-index: 9999;
}

.input_select_option {
  width: 100%;
  padding: 10px 0.75rem;
  font-size: 12px;
  font-weight: bold;
}

.input_select_option:hover {
  background: var(--option-select-hover);
  color: white;
  cursor: pointer;
}

.input_select_icon {
  width: 10px;
  height: auto;
  display: block;
  position: absolute;
  right: 0.9rem;
  top: 50%;
  transition: all 0.3s ease-in-out;
  transform: translateY(-50%) rotate(0deg);
}

.input_select_icon_open {
  transform: translateY(-50%) rotate(180deg);
}

/* Input watch password */

.input_watch_password_button {
  position: absolute;
  right: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  border: none;
}

.input_watch_password_button:hover {
  cursor: pointer;
}

/* Input two factor styles */

.input_two_factor {
  width: 36px;
  height: 36px;
  text-align: center;
  border-radius: 5px;
  background-color: var(--bg-input-two-factor);
}

.input_two_factor:focus-visible {
  outline: none;
}

/* Input checkbox styles */
.input_checkbox_button {
  position: relative;
  min-width: 10px;
  max-width: 10px;
  min-height: 10px;
  max-height: 10px;
  border-radius: 2px;
  transition: all 0.3s ease-in-out;
}

.input_checkbox_button:hover {
  cursor: pointer;
}

.input_checkbox_button_active {
  border: 1px solid #63ec6a;
  background: #0da60a;
}

.input_checkbox_button_inactive {
  border: 1px solid #d9d9d9;
  background: white;
}

.input_checkbox {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  top: 0;
  left: 0;
  z-index: 1;
}

.input_checkbox:hover {
  cursor: pointer;
}

.input_checkbox_label {
  margin: 0;
  font-size: 10px;
  font-weight: 400;
}

/* Modal styles */

.modal_container {
  background: rgb(0, 0, 0, 0.8);
  z-index: 9998;
}

.modal_card {
  padding: 30px 50px;
  background: #ffffff;
  border-radius: 4px;
}

.modal_card_notificacion_password.modal_card_notificacion_password {
  padding: 30px 50px;
  background: #ffffff;
  border-radius: 4px;
  max-width: 435px;
  margin-top: 20%;
}

/* Users styles */
@media screen and (max-width: 1030px) {
  .user_filter_form {
    flex-flow: wrap;
  }

  .user_filter_form > div {
    flex: 1 0 200px;
    max-width: none !important;
  }
}

.delete_user_card {
  min-width: 486px;
  min-height: 454px;
  max-width: 486px;
  max-height: 454px;
  padding: 52px 103px;
}

.delete_user_card_success {
  min-width: 451px;
  min-height: 370px;
  max-width: 467px;
  max-height: 370px;
  padding: 57px 86px;
}

.user_status_button {
  padding: 4px 5px;
  padding-inline: 5px;
  padding-block: 0;
  font-weight: bold;
  max-height: 19px;
  min-height: 19px;
  border-radius: 4px;
  border: none;
  color: white;
  line-height: 9px;
}

.delete_user_button {
  font-size: 9px;
  padding: 4px 5px;
  padding-inline: 5px;
  padding-block: 0;
  font-weight: bold;
  max-width: 61px;
  max-height: 19px;
  min-height: 19px;
  border-radius: 4px;
  border: none;
  background-color: #c43c42;
  color: white;
  line-height: 9px;
}

.edit_user_button {
  font-size: 9px;
  padding: 4px 5px;
  padding-inline: 5px;
  padding-block: 0;
  font-weight: bold;
  max-height: 19px;
  min-height: 19px;
  border-radius: 4px;
  border: none;
  background-color: var(--accent-color);
  color: var(--accent-text-color);
  line-height: 9px;
}

.edit_user_profile_button {
  font-size: 9px;
  padding: 4px 5px;
  padding-inline: 5px;
  padding-block: 0;
  font-weight: 400;
  max-height: 19px;
  min-height: 19px;
  border-radius: 4px;
  border: none;
  background-color: var(--accent-color);
  color: var(--accent-text-color);
  line-height: 9px;
}

.user_create_form_container {
  width: 90% !important;
  max-width: 600px !important;
  min-height: 715px;
  display: flex;
  align-items: stretch;
  padding: 60px 40px;
}

.user_create_form_container p.card_text {
  height: auto;
  margin-bottom: auto;
}

.user_create_form_container.create_user-form > form > .mt-3 {
  margin-bottom: 26px;
}

.user_create_form_container.create_user-form > form > .position-relative {
  margin-bottom: 26px;
}

.user_create_form_container.edit_user-form > form > .mt-3 {
  margin-bottom: 26px;
}

.user_create_form_container.edit_user-form > form > .position-relative {
  margin-bottom: 26px;
}

.user_create_form_succeed_container {
  width: 90% !important;
  max-width: 435px !important;
  min-height: 322px;
  display: flex;
  align-items: stretch;
  padding: 30px 10px;
  margin: auto;
}

.user_delete_modal {
  width: 90% !important;
  max-width: 486px !important;
  height: 80% !important;
  max-height: 454px !important;
  align-content: start !important;
  padding: 90px 40px !important;
}

.user_create_form {
  width: 100%;
  max-width: 270px;
  margin-left: auto;
  margin-right: auto;
}

.user_create_card_succes_container {
  width: 90% !important;
  max-width: 600px !important;
  height: 95% !important;
  max-height: 400px;
  display: flex;
  align-items: center !important;
}

.user_create_card_succes_container > div {
  display: flex;
  align-items: center !important;
}

.user_create_card_succes_container > div > div {
  display: flex;
  align-items: center !important;
}

.user_create_card_succes {
  width: 100%;
  max-width: 270px;
  margin-left: auto;
  margin-right: auto;
}

.marginTop-0-container > div > div {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.marginTop-0-container > div {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Bloqued account styles */

.blocked_account_card {
  max-width: 435px !important;
  min-height: 322px;
}

/* Complete register styles */

.complete_register_card {
  width: 100% !important;
  max-width: 600px !important;
  min-height: 710px !important;
  padding: 60px;
  display: flex;
  align-items: stretch;
  justify-content: center;
  height: fit-content;
  border-radius: 5px;
}

.complete_register_card > div {
  display: flex;
  align-items: stretch;
}

.complete_register_card > div > div {
  display: flex;
  align-items: stretch;
  justify-content: center;
}

.complete_register_card > div > div > div > div {
  height: 100% !important;
}

.complete_register_container_template {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto 1fr auto;
  row-gap: 20px;
}

/* Settings styles  */
.doble_factor_modal {
  width: 90vw !important;
  height: 90vh !important;
  max-width: 657px !important;
  margin-left: auto;
  margin-right: auto;
  margin-top: calc((100vh - 506px) / 2);
}

.doble_factor_modal > div {
  display: flex;
  align-items: stretch;
  height: 100% !important;
}

.doble_factor_modal > div > div {
  display: flex;
  align-items: stretch;
  justify-content: center;
}

.doble_factor_modal > div > div > div {
  display: flex;
  align-items: stretch;
  justify-content: center;
  flex-direction: column;
}

/* aqui */
.change_password_modal {
  width: 90vw !important;
  height: 90vh !important;
  max-width: 657px !important;
  margin-left: auto;
  margin-right: auto;
}

.change_password_modal > div {
  display: flex;
  align-items: stretch;
  height: 100% !important;
}

.change_password_modal > div > div {
  display: flex;
  align-items: stretch;
  justify-content: center;
}

.change_password_modal > div > div > div {
  display: flex;
  align-items: stretch;
  /* justify-content: center; */
  flex-direction: column;
}

.change_password_modal_finish {
  width: fit-content !important;
  height: 300px !important;
  max-width: 657px !important;
}

.change_password_modal_finish > div {
  display: flex;
  align-items: stretch;
  height: 100% !important;
}

.change_password_modal_finish > div > div {
  display: flex;
  align-items: stretch;
  justify-content: center;
}

.change_password_modal_finish > div > div > div {
  display: flex;
  align-items: stretch;
  justify-content: center;
  flex-direction: column;
}

.change_password_modal.modal_twofactor {
  max-width: 600px !important;
}

.user_delete_slider {
  width: 200% !important;
  transition: all 0.4s ease-in-out;
}

.user_delete_slider_first {
  transform: translateX(0%);
}

.user_delete_slider_second {
  transform: translateX(-50%);
}

.user_info_container {
  width: 100%;
  border-radius: 4px;
  font-size: 12px;
  border: solid 1px var(--border-input-color);
  padding: 0.475rem 0.75rem;
  font-weight: bold;
}

/* Two factor styles */

.checkbox-apple {
  position: relative;
  width: 25px;
  height: 14px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.checkbox-apple label {
  position: absolute;
  top: 0;
  left: 0;
  width: 25px;
  height: 14px;
  border-radius: 25px;
  background: linear-gradient(to bottom, #b3b3b3, #e6e6e6);
  cursor: pointer;
  transition: all 0.3s ease;
}

.checkbox-apple label:after {
  content: '';
  position: absolute;
  top: 1px;
  left: 1px;
  width: 11.7px;
  height: 11.7px;
  border-radius: 50%;
  background-color: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  transition: all 0.3s ease;
}

.checkbox-apple input[type='checkbox']:checked + label {
  background: #0da60a;
}

.checkbox-apple input[type='checkbox']:checked + label:after {
  transform: translateX(100%);
}

.checkbox-apple label:hover {
  background: linear-gradient(to bottom, #b3b3b3, #e6e6e6);
}

.checkbox-apple label:hover:after {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

.yep {
  position: absolute;
  top: 0;
  left: 0;
  width: 25px;
  height: 14px;
  z-index: 99;
  opacity: 0;
}

.yep:hover {
  cursor: pointer;
}

.two_factor_activate_card {
  width: 90vw !important;
  height: 90vh !important;
  max-width: 435px !important;
  max-height: 342px !important;
}

.two_factor_activate_card.code_two_factor {
  width: 90vw !important;
  height: 90vh !important;
  max-width: 600px !important;
  max-height: 560px !important;
}

.two_factor_activate_card > div {
  display: flex;
  align-items: stretch;
  height: 100% !important;
  padding: 20px;
}

.two_factor_activate_card > div > div {
  display: flex;
  align-items: stretch;
  justify-content: center;
}

.two_factor_activate_card > div > div > div > div {
  height: 100% !important;
}

@media screen and (max-width: 472px) {
  .two_factor_activate_card {
    width: 95vw !important;
    min-height: 342px !important;
    max-height: none !important;
    height: fit-content !important;
  }

  .two_factor_activate_card > div {
    padding: 0px !important;
  }
}

/* Rol styles */
.rol_modal_card {
  width: 90% !important;
  max-width: 795px !important;
  min-height: 564px !important;
  padding: 72px 16px !important;
}

/*Sobreescritura Boostrap*/
.fw-bold {
  opacity: 0.8;
}

.opacity-0 {
  opacity: 0;
}

.input_label_small {
  font-size: 10px;
  z-index: 1;
  transition: all 0.3s ease-in-out;
}

/*Alerts*/
.dco-alert-danger {
  background-color: #ff0000 !important;
  color: #ffffff !important;
}

.dco-alert-success {
  background-color: #63ec6a !important;
  color: #ffffff !important;
  border-style: solid;
  border-width: 1px;
  border-color: #0da60a;
}

.dco-alert {
  width: 100dvw !important;
  max-width: 600px;
  display: flex;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  align-items: center;
  height: 42px;
  top: 70px !important;
}

/*Barra de Navegacion*/
.dco_nav {
  width: 100%;
  max-height: 95%;
  min-height: 95%;
  max-width: 140px;
  padding: 3rem 0 !important;
  background: #2d2d2d;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  align-self: center !important;
  z-index: 8888;
  display: grid;
  grid-template-rows: 58px 1fr;
}

.dco_nav_logo_container {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.dco_nav_logo {
  width: 70%;
  max-width: 200px;
  height: auto;
}

.dco_nav_bar {
  width: 20px;
  min-height: 2px;
  background: rgb(255, 255, 255, 0.2);
}

.dco_nav_responsive_container {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: column;
  gap: 20px;
}

.dco_nav_links_container {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.dco_nav_link {
  margin: 5px 0;
  width: 100%;
  padding: 10px 20px;
  text-decoration: none;
  color: var(--nav-links-color);
  fill: var(--nav-links-color);
  position: relative;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  display: flex;
  align-items: center;
  font-size: 10px;
  gap: 10px;
  transition: width 0.3s ease-in-out, background 0.3s ease-in-out;
}

.dco_nav_link_close {
  margin: 5px 0;
  width: 100%;
  padding: 10px 20px;
  text-decoration: none;
  color: var(--nav-links-color);
  position: relative;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  display: flex;
  align-items: center;
  font-size: 10px;
  gap: 10px;
  transition: width 0.3s ease-in-out, background 0.3s ease-in-out;
  border: none;
  background: transparent;
}
.dco_nav_link_close:hover {
  width: 120%;
  background: var(--bg-nav-link-active);
  left: -10%;
  color: var(--secondary-text-color);
  cursor: pointer;

}
.dco_nav_link_close svg{
  overflow: visible;
  fill: var(--nav-links-color);
}

.dco_nav_link svg {
  overflow: visible;
}
.svg-container {
  color: inherit;
  fill: inherit;
  stroke: inherit;
}

.svg-container svg {
  width: auto;
  height: 14px;
  object-fit: contain; /* o 'cover' según el caso */
}

.dco_nav_link:hover {
  width: 120%;
  background: var(--bg-nav-link-active);
  left: -10%;
  color: var(--secondary-text-color);
  fill: var(--secondary-text-color);
  cursor: pointer;
}

.dco_nav_link_active {
  width: 120%;
  background: var(--bg-nav-link-active);
  left: -10%;
  color: var(--secondary-text-color);
  fill: var(--secondary-text-color);
}

.dco_nav_link_active #settings{
  stroke: var(--secondary-text-color);
}

.dco_nav_link #settings{
  stroke: var(--secondary-text-color);
}

.link_nav_paragraph{
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  align-self: center;
  margin: 0;
}

@media screen and (max-width: 768px) {
  .link_nav_paragraph{
    display: none;
  }
  .dco_nav_link:hover {
    width: 100%;
    background: var(--bg-nav-link-active);
    left: 0%;
    color: white;
  }

  .dco_nav_link_active {
    width: 100%;
    background: var(--bg-nav-link-active);
    left: 0%;
    color: white;
  }
}

.dco_nav_link span {
  content: '';
  display: block;
  min-width: 14px;
  min-height: 14px;
}

/*Two Factor*/
.dco_2f_container_code {
  width: 100%;
  display: flex;
  justify-content: center;
}


.dco_2f_input_code input {
  width: 35px;
  height: 36px;
  background-color: #c4c4c433;
  border-radius: 5px;
  border: none;
  text-align: center;
}

.dco_2f_input_code input:focus-visible {
  outline-color: transparent;
}

.dco_2f_input_code div {
  padding-right: 0px;
  padding-left: 0px;
  padding-inline: 5px;
}

/*Date Picker*/
.air-datepicker {
  --adp-cell-background-color-selected: var(--accent-color) !important;
  --adp-cell-background-color-selected-hover: var(--accent-color) !important;
  --adp-day-name-color-hover: var(--accent-color) !important;
  --adp-cell-border-radius: 50% !important;
  --adp-day-name-color: black !important;
  --adp-color-current-date: black !important;
}

/* Table */
.table_header {
  background-color: var(--secondary-color) !important;
  border-top-left-radius: 4px !important;
  border-top-right-radius: 4px !important;
  border-bottom-left-radius: 4px !important;
  border-bottom-right-radius: 4px !important;
}
.table_header_cell {
  max-height: 40px !important;
  padding: 10px 20px !important;
  color: var(--secondary-text-color);
  font-size: 10px;
  font-weight: 700;
  position: relative;
  white-space: nowrap !important;
}

.table_row_cell {
  padding: 5px 20px !important;
  font-size: 10px !important;
  /* white-space: nowrap !important; */
  overflow: hidden;
}

.table_row_cell_no_content {
  padding: 30px !important;
  font-size: 16px !important;
  overflow: hidden;
  opacity: .8;
}
@media screen and (max-width: 472px) {
  .user_personal_info_container {
    display: none !important;
  }
}

.main_header_container {
  margin: 0 !important;
}

.user_heading_name_info {
  font-size: 12px;
  font-weight: 700;
  text-wrap: nowrap;
  max-width: 130px;
  text-overflow: ellipsis;
  overflow: hidden;
}

.user_heading_email_info {
  font-size: 8px;
  font-weight: 400;
  color: #979797;
}

.gestion_filter_form .datePicker-input-container .input_label_small {
  font-size: 7px;
  color: #2d2d2d;
  opacity: 0.5;
  padding-left: 12px;
}

.gestion_filter_form .input_date_picker_small input {
  padding: 6px 6px !important;
}

.input_date_picker_small input {
  width: 70px !important;
}

.dco_icon-datePicker {
  position: absolute;
  top: 15%;
  right: 15px;
  border: none;
  background: transparent;
}

/* Modal styles */

.modal_container {
  /* display: block; */
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: scroll;
  outline: 0;
  /* background: rgba(0, 0, 0, 0.322); */
  z-index: 9998;
  padding: 80px 30px;
  justify-content: center;
  display: grid;
  place-items: center;
  background: rgb(0, 0, 0, 0.8);
}

.modal_card_container {
  width: 100%;
  background-color: white;
  border-radius: 4px;
}

.modal_card_notificacion_password.modal_card_notificacion_password {
  padding: 30px 50px;
  background: #ffffff;
  border-radius: 4px;
  max-width: 435px;
}

.change_password_modal.small-modal {
  width: 40dvw !important;
  height: 40dvh !important;
  max-width: max-content !important;
}

/* Input date picker styles */

.input_date_picker {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--bs-body-color);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: var(--bs-body-bg);
  background-clip: padding-box;
  border-radius: 4px;
  transition: border-color 0.15s ease-in-out;
  box-shadow: none;
  border: 1px solid #000 !important;
}

.input_date_picker:focus-visible {
  outline: none;
}

.input_date_picker input::placeholder {
  opacity: 0 !important;
}

.input_date_picker input {
  font-size: 12px !important;
}

.input_date_picker fieldset {
  border: none !important;
}

.input_date_picker button > svg {
  fill: none !important;
  display: none !important;
}

.input_date_picker button {
  position: relative;
  margin-right: 0px;
  width: 12px;
  height: 12px;
}

.input_date_picker_new::after {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  background: url(/images/icons/calendar.webp) no-repeat center/80% auto;
}

/* small verssion for filters */

.input_date_picker_small {
  display: block;
  width: 100%;
  padding: 6px 10px;
  font-size: 10px;
  font-weight: 400;
  color: var(--bs-body-color);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: var(--bs-body-bg);
  background-clip: padding-box;
  border-radius: 4px;
  transition: border-color 0.15s ease-in-out;
  box-shadow: none;
  border: var(--bs-border-width) solid #000;
  max-height: 29px !important;
  z-index: 1;
}

.input_small {
  width: 100%;
  padding: 6px 10px;
  font-size: 10px;
  font-weight: bold;
  color: var(--bs-body-color);
  border: 1px solid var(--border-input-color);
  border-radius: 4px;
  transition: border-color 0.15s ease-in-out;
}

/* small version */

.input_select_small {
  width: 100%;
  min-height: 29px;
  max-height: 29px;
  padding: 6px 22px 6px 10px;
  font-size: 10px;
  font-weight: bold;
  color: #000;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #fff;
  background-clip: padding-box;
  border-radius: 4px;
}

.input_select_small:hover {
  cursor: pointer;
}

.input_select_option_container_small {
  min-width: 100%;
  max-height: 120px;
  display: grid;
  position: absolute;
  bottom: 0;
  left: 0;
  transform: translateY(101%);
  border-radius: 0px 0px 4px 4px;
  background: #fff;
  overflow-x: hidden;
  overflow-y: auto;
  z-index: 10;
}

.input_select_option_small {
  width: 100%;
  padding: 6px 10px;
  font-size: 10px;
  font-weight: bold;
}

.input_select_score_option_small {
  width: 100%;
  padding: 6px 10px;
  font-size: 10px;
  font-weight: bold;
}

.input_select_score_option_small_blue {
  width: 100%;
  padding: 6px 10px;
  font-size: 10px;
  font-weight: bold;
  background: var(--option-select-hover);
  color: white;
}

.input_select_option_small:hover {
  background: var(--option-select-hover);
  color: white;
  cursor: pointer;
}

.input_select_icon_small {
  width: 5px;
  height: auto;
  display: block;
  position: absolute;
  right: 10px;
  top: 50%;
  transition: all 0.3s ease-in-out;
  transform: translateY(-50%) rotate(0deg);
}

.input_select_icon_clock_small {
  width: 8px;
  height: auto;
  display: block;
  position: absolute;
  right: 10px;
  top: 50%;
  transition: all 0.3s ease-in-out;
  transform: translateY(-50%) rotate(0deg);
}

.input_select_icon_open_small {
  transform: translateY(-50%) rotate(180deg);
}

.input_small:focus-visible {
  outline: none;
}

.label_form {
  font-size: 10px;
  color: var(--bs-body-color);
  margin-bottom: 5px;
}

.border_for_small_inputs {
  border: 1px solid #d9d9d9 !important;
}

.input_date_picker_small:focus-visible {
  outline: none;
}

.input_date_picker_small input::placeholder {
  opacity: 0 !important;
}

.input_date_picker_small input {
  font-size: 10px !important;
  max-height: 29px !important;
  min-height: 29px !important;
  padding: 6px 9px;
}

.input_date_picker_small fieldset {
  border: none !important;
}

.input_date_picker_small button > svg {
  fill: none !important;
  display: none !important;
}

.input_date_picker_small button {
  position: relative;
  margin-right: 0px;
  min-width: 8px;
  min-height: 8px;
  max-width: 8px;
  max-height: 8px;
  padding: 0px !important;
}

.input_date_picker_small button::after {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  background: url(/images/icons/calendar.webp) no-repeat center/80% auto;
}
.custom_calendar_contianer_button{
  padding-right: 22px;
}
.custom_calendar_contianer_button::after {
  content: '';
  display: block;
  width: 10px;
  height: 10px;
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  background: url(/images/icons/calendar.webp) no-repeat center/80% auto;
}

.custom_calendar_contianer{
  position: fixed;
  z-index: 2147483647;
}
/* Date picker */
.MuiFormControl-root * {
  z-index: 1 !important;
}
.MuiDateCalendar-root {
  box-shadow: 0 1rem 3rem rgba(0,0,0,.175)!important;
}
.MuiPickersCalendarHeader-root {
  position: relative !important;
  display: flex;
  justify-content: end;
  min-height: auto !important;
  padding-bottom: 10px;
}

.MuiPickersArrowSwitcher-root {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  justify-content: space-between;
}

.MuiIconButton-edgeEnd {
  z-index: 777;
  width: 16px !important;
  height: 16px !important;
}

.MuiIconButton-edgeEnd svg {
  width: 12px !important;
  height: auto;
}

.MuiIconButton-edgeStart svg {
  width: 12px !important;
  height: auto;
}

.MuiIconButton-edgeStart {
  z-index: 777;
  width: 16px !important;
  height: 16px !important;
}

.MuiPickersFadeTransitionGroup-root {
  font-size: 9.37px;
  text-transform: capitalize;
}

.MuiPickersCalendarHeader-labelContainer {
  position: relative;
  width: fit-content;
  /* margin-right: 20px; */
  margin: 0 10px 0 0 !important;
  z-index: 7777;
}

.MuiPickersYear-yearButton {
  font-size: 9.37px !important;
  padding: 8px 10px;
  width: fit-content !important;
  height: fit-content !important;
}

.MuiDayCalendar-monthContainer {
  padding: 10px 19px;
}

.MuiYearCalendar-root {
  width: 100% !important;
  max-height: 127px !important;
}

.MuiDayCalendar-header {
  padding: 0 19px;
  height: 20px !important;
}

.MuiPickersCalendarHeader-labelContainer button {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 0;
}

.MuiPickersCalendarHeader-root::after {
  content: '';
  position: absolute;
  width: 90%;
  height: 1px;
  background-color: #d9d9d9;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.MuiDayCalendar-weekContainer {
  width: 100%;
  display: grid !important;
  grid-template-columns: repeat(7, 1fr) !important;
}

.MuiPickersDay-root {
  font-size: 6px !important;
  width: 12px !important;
  height: 12px !important;
}

.MuiTypography-root {
  font-size: 6px !important;
}

.MuiButtonBase-root {
  font-size: 6px !important;
  width: 12px !important;
  height: 12px !important;
}

.MuiPickersDay-root {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.MuiAccordionSummary-root {
  width: 100% !important;
  font-size: 16px !important;
}

.MuiAccordionSummary-content {
  font-size: 16px !important;
}

.MuiDialog-root {
  z-index: 7777 !important;
}

.MuiPickersCalendarHeader-label {
  text-transform: capitalize;
  font-size: 9px;
}

/*EstilosGraficas*/
.dco_graficas-contenedorGrafica {
  margin-inline: 20px;
  padding-top: 10px;
}

.dco_graficas-contenedorRowEncabezado {
  display: flex;
  justify-content: space-between;
}

.dco_graficas-botonOpciones {
  width: 30px;
  height: 30px;
  border-width: 0.5px;
  border-style: solid;
  border-radius: 50%;
  border-color: #d9d9d9;
  background-color: white;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
}

.dco_graficas-botonOpciones > div {
  width: 4px;
  height: 4px;
  background-color: #2d2d2d;
  border-radius: 50%;
  margin-inline: 1px;
  opacity: 0.5;
}

.dco_graficas-contendorGraficaPorcent {
  margin-top: 10px;
  margin-inline: 20px;
  padding-bottom: 20px;
}

.dco_graficas-contendorGraficaPorcent .progress-bar {
  background-color: #6236ff;
  height: 6.18px;
}

.dco_graficas-contendorGraficaPorcent .progress {
  height: 6.18px;
}

.dco_graficas-contendorLabelsGrafica {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 101%;
}

.dco_graficas-contendorLabelsGrafica label {
  font-size: 5.1px;
  font-weight: 600;
  color: #000000;
  opacity: 40%;
}

.dco_graficas-contenedorIndicadorGrafica {
  width: 99%;
  font-size: 9px;
  font-weight: 800;
  margin-bottom: 1%;
}

.dco_graficas-contenedorIndicadorGrafica.label {
  color: #6236ff;
}

.footerText {
  font-size: 7px;
  font-weight: 400;
  display: flex;
  justify-content: flex-end;
  margin-top: 5px;
  color: var(--secondary-color);
}

.dashboard_cards {
  box-shadow: 0px 0.61px 3.68px 0px rgba(0, 0, 0, 0.1);
  background: white;
  border-radius: 4px;
}

.dashboard_chart_cards {
  padding: 19px 19px 19px 20px;
  height: fit-content;
}

@media screen and (max-width: 900px) and (min-width: 565px) {
  .dashboard_chart_container > div {
    flex: 1 0 400px !important;
  }
  .dashboard_chart_container {
    overflow: visible !important;
  }
}

@media screen and (max-width: 564px) and (min-width: 355px) {
  .dashboard_chart_container > div {
    flex: 1 0 300px !important;
  }
  .dashboard_cards {
    max-width: 100% !important;
  }
  .dashboard_chart_container {
    overflow: visible !important;
  }
}

@media screen and (max-width: 430px) {
  .dashboard_chart_container {
    overflow: visible !important;
  }

  .change_password_modal {
    width: 100vw !important;
    height: 100vh !important;
  }
}

@media screen and (max-width: 354px) {
  .dashboard_chart_container > div {
    flex: 1 0 200px !important;
  }
}

.dco_graficas-contendorGraficaHistorico {
  width: 95%;
  height: 70%;
  overflow: hidden;
}

.dco_graficas-contendorGraficaHistorico.barras {
  width: 95%;
  height: 80%;
}

.dco_graficas-contendorGraficaHistorico .c3-line-Respuestas {
  stroke-width: 0.8%;
}

.dco_graficas-contendorGraficaHistorico
  .c3-line-Petición-de-validación-de-identidad {
  stroke-width: 0.8%;
}

.dco_graficas-contendorGraficaHistorico .c3-legend-item text {
  font-size: 8px;
  color: #2d2d2d80;
  font-weight: 400;
  margin: 0;
}

.dco_graficas-title {
  font-size: 16px;
  color: var(--secondary-color);
  font-weight: 700;
  opacity: 0.8;
}

.dco_graficas-subtitle {
  font-size: 8px;
  color: #2d2d2d80;
  font-weight: 400;
  margin: 0;
}

.dco_graficas-contenedorHeader {
  margin: 20px;
  margin-top: 65px;
}

.dco_graficas-contenedorTitulos {
  display: flex;
  flex-direction: column;
}

.dco_graficas-containerInput input {
  padding: 6px 10px 6px 10px;
  margin: 10px;
  border-radius: 50px;
  border-color: #d9d9d9;
  border-style: solid;
  background-repeat: no-repeat;
  height: 29px;
  margin-inline: 5px;
}

.dco_graficas-containerInput input::placeholder {
  font-size: 10px;
  font-weight: 600px;
  color: black;
}

.dco_graficas-contenedorFiltros {
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: space-between;
}

.dco_graficas-botonExportar {
  width: 88px;
  height: 27.45px;
  padding: 8px 10px 7px 10px;
  gap: 10px;
  border-radius: 5px;
  background-color: var(--accent-color);
  color: white;
  font-size: 10px;
  font-weight: 700;
  font-family: 'Mulish', sans-serif;
  line-height: 12.55px;
  text-align: left;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  border: 0;
}

.dco_graficas-botonExportar img {
  position: relative;
  bottom: 2px;
}

.dco_graficas-circuloprogreso {
  display: flex;
  justify-content: center;
  align-items: center;

  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: radial-gradient(closest-side, white 79%, transparent 80% 100%),
    conic-gradient(#6236ff 30%, #d9d9d9 0);
}

.dco_graficas-circuloprogreso::before {
  content: attr(data-porcent);
  background: #6236ff;
  color: white;
  border-radius: 50%;
  width: 40%;
  height: 40%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.dco_graficas-contenedor-dashboard {
  display: flex;
  flex-direction: column;
}

.dco_graficas-info-solicitudes-text {
  font-size: 8px;
  font-weight: 500;
  line-height: 10.42px;
  text-align: left;
}

.dco_graficas-info-solicitudes-number {
  font-size: 10.77px;
  font-weight: 500;
  line-height: 14.02px;
  text-align: left;
}

.dco_graficas-estatus-tag {
  width: 76px;
  height: 21px;
  border-radius: 20px;
  background-color: #018559;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 9px;
}

.dco_graficas-estatus-tag-inactive {
  width: 76px;
  height: 21px;
  border-radius: 20px;
  background-color: #c43c42;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 9px;
}

.dco_switch_graficas .checkbox-apple label {
  width: 102px;
  height: 30px;
  background: white;
  border-style: solid;
  border-width: 0.5px;
  border-color: #d9d9d9;
  font-size: 8px;
  padding-top: 8px;
  padding-left: 57px;
}

.dco_switch_graficas .checkbox-apple label::before {
  content: '30 días';
}

.dco_switch_graficas .checkbox-apple label::after {
  margin-top: 3px;
  width: 44px;
  height: 20px;
  border-radius: 50px;
  margin-left: 3px;
  content: '15 días';
  font-size: 8px;
  padding-top: 5px;
  padding-left: 8px;
  background-color: var(--accent-color);
  color: white;
}

.dco_switch_graficas .yep {
  width: 102px;
  height: 30px;
}

.dco_switch_graficas .checkbox-apple {
  width: 102px;
  height: 30px;
}

.dco_switch_graficas .checkbox-apple input[type='checkbox']:checked + label {
  background-color: white;
  padding-left: 9px;
}

.dco_switch_graficas
  .checkbox-apple
  input[type='checkbox']:checked
  + label::before {
  content: '15 días';
}

.dco_switch_graficas
  .checkbox-apple
  input[type='checkbox']:checked
  + label::after {
  content: '30 días';
}

/*
  Coloca lineas sobre cada valor del eje "y" en las graficas a manera de guías
*/
.c3-grid line {
  stroke: #d9d9d9 !important;
  opacity: 0.34 !important;
  stroke-dasharray: none;
}

/* management styles */

.management_report_sheet {
  width: 100%;
  max-width: 582px;
  background-color: #ffffff;
  padding: 29px 30px 21px 30px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  margin-left: auto;
  margin-right: auto;
}

.management_logo {
  width: 45%;
  max-width: 225.34px;
  height: auto;
}

.management_title {
  font-weight: 700;
  font-size: 15px;
  line-height: 18.83px;
  color: rgba(34, 19, 94, 0.8);
  margin: 0;
}

.management_text {
  font-weight: 400;
  font-size: 8px;
  line-height: 10.04px;
  margin: 0;
}

.management_row_title {
  font-weight: 400;
  font-size: 8px;
  line-height: 10.04px;
  margin: 0;
}

.management_row_number {
  font-weight: 400;
  font-size: 10px;
  line-height: 12.55px;
  margin: 0;
}

.management_row_content {
  font-weight: 400;
  font-size: 6px;
  line-height: 7.53px;
  font-style: italic;
  margin: 0;
}

.management_row_info {
  padding: 6px 18px;
  border: 1px solid red;
  margin: 0;
}

.management_row_info_error {
  border: 1px solid red;
}

.management_row_info_success {
  border: 1px solid #018559;
}

.management_row_info_text {
  font-weight: 400;
  font-size: 9px;
  line-height: 11.3px;
  margin: 0;
}

.management_row_info_text_error {
  color: red;
}

.management_row_info_text_success {
  color: #018559;
}

.management_see_details_button {
  background-color: var(--accent-color);
  color: var(--accent-text-color);
  font-weight: 700;
  font-size: 6.31px;
  padding: 4px 7px;
  display: flex;
  gap: 7px;
  align-items: flex-end;
  border-radius: 4px;
  border: none;
  width: fit-content;
}

.sortable_column {
  position: relative;
}

.sortable_column_asc:hover {
  cursor: pointer;
}

.sortable_column_desc:hover {
  cursor: pointer;
}

.sortable_column_asc path {
  fill: var(--secondary-text-color);
}

.sortable_column_asc svg {
  top: 50%;
  right: 10px;
  transform: translateY(-50%) rotate(-180deg);
  position: absolute;
}

.sortable_column_asc {
  position: relative;
  padding: 10px 25px 10px 20px !important;
}

/* .sortable_column_asc::after {
  content: "";
  display: block;
  min-width: 7px;
  min-height: 5px;
  background: url(/images/icons/arrow_columns.png) no-repeat center/contain;
  top: 50%;
  right: 10px;
  transform: translateY(-50%) rotate(-180deg);
  position: absolute;
} */

.sortable_column_desc path {
  fill: var(--secondary-text-color);
}
.sortable_column_desc svg {
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  position: absolute;
}
.sortable_column_desc {
  position: relative;
  padding: 10px 25px 10px 20px !important;
}

/* .sortable_column_desc::after {
  content: "";
  display: block;
  min-width: 7px;
  min-height: 5px;
  background: url(/images/icons/arrow_columns.png) no-repeat center/contain;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  position: absolute;
  position: absolute;
} */

/* Transactions */
.details_transactions_header_container div:first-child {
  padding-top: 0 !important;
}

.transactions_modal_details {
  width: 100%;
  max-width: 637px;
  background-color: #ffffff;
  padding: 15px 15px 18px 15px;
  display: flex;
  border-radius: 4.33px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  margin-left: auto;
  margin-right: auto;
}

.transactions_modal_details p {
  overflow: hidden;
  text-overflow: ellipsis;
  text-wrap: nowrap;
}
.transactions_modal_text {
  font-size: 10px;
  margin: 0;
}

/* Alerts styles */

.custom_alerts {
  top: 28px;
  z-index: 999999;
  padding: 12px 11px 12px 11px;
  border-radius: 3px;
  color: white;
  font-weight: 700;
  font-size: 12px;
  min-width: fit-content;
  width: 600px;
}

.succes_custom_alert {
  background-color: #63ec6a;
  border: 1px solid #0da60a;
}

.error_custom_alert {
  background-color: #ee3737;
  border: 1px solid red;
}

/* DatePickerDouble styles  */

.MuiStack-root {
  padding-top: 0px !important;
  overflow: hidden !important;
}

.css-nby9nv-MuiStack-root > .MuiTextField-root,
.css-nby9nv-MuiStack-root > .MuiPickersTextField-root {
  min-width: auto !important;
}

.MuiPickersLayout-contentWrapper {
  width: 100%;
  max-width: 405px;
  height: 100%;
  max-height: 172px;
}

.MuiDateRangeCalendar-monthContainer {
  padding: 0 16px;
  border-right: none;
}

.MuiDateRangeCalendar-root > div:first-child {
  display: none;
}

.MuiDateRangeCalendar-monthContainer .MuiDayCalendar-header {
  padding: 0;
}

.MuiDateRangeCalendar-monthContainer .MuiDayCalendar-monthContainer {
  padding: 0;
}

.MuiDateRangePickerDay-root.MuiDateRangePickerDay-rangeIntervalDayHighlight.MuiDateRangePickerDay-rangeIntervalDayHighlightStart,
.MuiDateRangePickerDay-root.MuiDateRangePickerDay-rangeIntervalDayHighlight.MuiDateRangePickerDay-rangeIntervalDayHighlightEnd {
  background-color: transparent !important;
}

.MuiDateRangePickerDay-rangeIntervalDayHighlight {
  background-color: #d9d9d94d !important;
}

.MuiDateRangeCalendar-monthContainer
  .MuiDayCalendar-monthContainer
  .MuiDateRangePickerDay-rangeIntervalPreview {
  display: flex;
  justify-content: center;
}

.MuiDateRangeCalendar-monthContainer
  .MuiDayCalendar-monthContainer
  .MuiDateRangePickerDay-rangeIntervalPreview
  .Mui-selected {
  background-color: var(--accent-color);
}

.MuiDateRangeCalendar-root .MuiDateRangeCalendar-monthContainer {
  max-width: 50%;
  height: auto;
  max-height: 172px;
}

.MuiDateRangeCalendar-monthContainer .MuiTypography-subtitle1 {
  font-size: 10px !important;
  text-transform: capitalize;
}

.MuiDateRangeCalendar-monthContainer > .MuiPickersArrowSwitcher-root {
  position: initial;
  border-bottom: 1px solid #d9d9d9;
}

.MuiPaper-root.MuiPaper-elevation.MuiPaper-rounded.MuiPaper-elevation8.MuiPickersPopper-paper {
  min-height: 177px;
}

.MuiPickersSlideTransition-root.MuiDayCalendar-slideTransition {
  min-width: initial;
  max-height: 110px !important;
  min-height: 110px !important;
}

.MuiStack-root .MuiTextField-root {
  min-width: 0px !important;
}

/* DatePickerDouble styles  */
.input_d_flex_alingn_center {
  display: flex;
  align-items: center;
}

.icon_clock_input,
.icon_calendar_input {
  position: relative;
  right: 10%;
}

.input_clock_icon,
.input_calendar_icon {
  position: absolute;
  width: 8px;
  height: 8px;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
}

/*Nodos Page*/

.dco_nodos-modal-detalles {
  display: flex;
  align-items: center;
}

.dco_nodos-modal-detalles > div > div {
  display: block;
  margin: 20px !important;
  margin-top: 0px !important;
  margin-right: 20px !important;
  margin-bottom: 20px !important;
  margin-left: 20px !important;
}

.dco_nodos-modal-detalles > div > div > div {
  display: block;
}

.dco_nodos-modal-detalles .modal_card_container {
  min-height: 373px !important;
  width: 100% !important;
  max-width: 852px !important;
  height: auto !important;
  padding: 25px 20px 15px 20px;
}

.dco_nodos-detalles {
  width: 100% !important;
  max-width: 811px !important;
}

.dco_nodos-detalles div {
  font-size: 10px;
  font-weight: 400;
  line-height: 12.55px;
}

.dco_nodos-detalles div.bold {
  font-size: 10px;
  font-weight: 700;
  line-height: 12.55px;
}

.dco_nodos-detalles .datos {
  width: 65px;
}

.dco_nodos-detalles-boton-cerrar {
  width: 77px;
  height: 40px;
  background-color: var(--accent-color);
  color: white;
}

.dco_nodos-filters .MuiStack-root {
  overflow-y: hidden;
}

/* Nav hambuer */

.hamburger {
  cursor: pointer;
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2147483647;
  background-color: #2d2d2d;
  border-radius: 3.64px;
  width: 34px;
  height: 34px;
  display: flex;
  justify-content: center;
  transition: all 0.4s ease-in-out;
}

.hamburger input {
  display: none;
}

.hamburger svg {
  height: 2em;
  transition: transform 600ms cubic-bezier(0.4, 0, 0.2, 1);
}

.hamburger img {
  width: 14.57px;
}

.line {
  fill: none;
  stroke: white;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 3;
  transition: stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1),
    stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
}

.line-top-bottom {
  stroke-dasharray: 12 63;
}

.hamburger input:checked + svg {
  transform: rotate(-45deg);
}

.hamburger input:checked + svg .line-top-bottom {
  stroke-dasharray: 20 300;
  stroke-dashoffset: -32.42;
}

.menu_mobile_container {
  width: 100%;
  height: 100vh;
  max-width: 50%;
  padding: 3rem 0;
  position: fixed;
  top: 0;
  left: 0;
  background: #2d2d2d;
  transition: all 0.4s ease-in-out;
  z-index: 214748364;
}

.menu_mobile_container_hidde {
  transform: translateX(-100%);
}

.menu_mobile_container_show {
  transform: translateX(0%);
}

.link_mobile {
  max-width: 100%;
  left: 0;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
}

.link_mobile {
  background: var(--bg-nav-link-active);
  left: 0;
}

.link_mobile_active {
  background: var(--bg-nav-link-active);
}

@media screen and (max-width: 472px) {
  .link_nav_paragraph{
    display: block;
  }
  .desktop_nav {
    display: none !important;
  }

  .dco_graficasDashboard-barraestadisticas > div > div {
    scale: 0.6;
  }

  .dco_graficasDashboard-barraestadisticas > div {
    width: 45% !important;
  }

  .dco_graficasDashboard-barraestadisticas > div:nth-child(2) {
    justify-content: flex-start !important;
  }

  .dco_perfil_info_nav-container {
    display: none !important;
  }

  #root .main_template_container {
    padding: 40px 0px 0px 0 !important;
  }

  .template_container {
    max-width: 100%;
    max-height: 100%;
  }

  .dco_nodos-filters-buttons {
    flex-wrap: wrap;
    flex-direction: column-reverse;
    align-items: flex-start !important;
  }

  .modal_container {
    padding: 40px 0 0 0;
  }

  .modal_container > article {
    /* margin: 0 !important; */
    width: 100% !important;
    padding-top: 10px !important;
    padding-inline: 0;
  }

  .modal_container > article > form {
    max-width: 85% !important;
  }

  /* .modal_card_container {
    width: 100% !important;
  } */

  .modal_card_container.modal_twofactor_messages {
    top: 45% !important;
  }

  .login-container-card {
    padding: 0 !important;
  }

  .login_card {
    max-height: 100% !important;
  }

  .modal_container > article.user_export_data_container {
    width: 95%;
    padding-inline: 20px;
    height: 100%;
    position: relative !important;
  }

  .container-fluid h4.main_title {
    padding-left: 0px !important;
    display: flex;
  }

  .container-fluid p.main_subtitle {
    padding-left: 0px !important;
    font-size: 13px;
  }

  .change_password_modal > div > div > div {
    width: calc(100% - 40px) !important;
    padding-inline: 20px;
    padding-block: 45px !important;
  }

  .card_title {
    font-size: 16px;
  }

  .two_factor_modal_class > div > div {
    display: block;
    width: 100%;
  }

  .two_factor_modal_class > div > div > div > div {
    padding-inline: 0px !important;
  }

  .modal-activate-twofactor {
    max-width: 435px;
    min-height: 342px;
    padding: 60px 80px;
}
}

@media screen and (max-width: 695px) {
  .dco_perfil_info_nav-container {
    display: none !important;
  }
}

@media screen and (max-width: 768px) {
  #root {
    width: 100%;
    min-height: 100vh;
    max-width: 1440px;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    overflow-x: hidden;
    overflow-y: auto;
  }

  body {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: none;
  }

  .main_template_container {
    max-width: 100% !important;
    max-height: none !important;
    padding: 60px 10px 10px 10px !important;
  }
}

/* eresponsive transactions */

@media screen and (max-width: 1030px) {
  .transactrions_filter_form,
  .activity_filter_form {
    flex-flow: wrap;
  }

  .transactrions_filter_form > div,
  .activity_filter_form > div {
    flex: 1 0 200px;
    max-width: none !important;
  }
  .transactrions_filter_form div {
    max-width: none !important;
  }
  .MuiAccordionDetails-root > form {
    flex-flow: wrap;
  }
  .MuiAccordionDetails-root > form > div {
    max-width: 100% !important;
  }
  .flex-lg-nowrap {
    flex-wrap: wrap-reverse !important;
  }
}

.text-wrap {
  white-space: normal !important;
  word-break: break-word !important;
  word-wrap: break-word !important;
}

/* Clases para ajustar estilos del login */

.d-none {
  display: none !important;
}

.w-100 {
  width: 100% !important;
}

.padding-left-0 {
  padding-left: 0px !important;
}

.padding-right-0 {
  padding-right: 0px !important;
}

.margin-top-69 {
  margin-top: 69px !important;
}

.margin-bottom-60 {
  margin-bottom: 60px !important;
}

.margin-top-60 {
  margin-top: 60px !important;
}

.forgot_link_container {
  margin-top: 11px !important;
  margin-bottom: 34px !important;
}

.padding-top-69 {
  padding-top: 69px !important;
}

.padding-bottom-69 {
  padding-bottom: 69px !important;
}

.modal_content_twofactor {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

.modal_content_twofactor .card_title {
  margin-bottom: 63px;
}

.modal_content_twofactor .card_text {
  margin-bottom: 30px;
}

.modal_content_twofactor .dco_2f_container_code {
  margin-bottom: 27px;
}

.modal_content_twofactor .no_send_code {
  margin-bottom: 40px;
}

.modal_content_twofactor .no_send_code > p {
  margin-bottom: 0px;
}

.content_login_twofactor {
  max-width: 290px;
  margin-top: 63px;
}

.content_login_twofactor .card_text {
  margin-bottom: 30px;
}

.content_login_twofactor .login_two_factor_code {
  margin-bottom: 27px !important;
  margin-top: 0px !important;
  padding-left: 0px !important;
  padding-right: 0px !important;
}

.content_login_twofactor .no_send_code {
  margin-bottom: 40px;
  font-size: 12px !important;
}

.dco_2f_input_code {
  display: flex;
  justify-content: normal;
  width: 100%;
}

.modal-activate-twofactor {
  max-width: 435px;
  min-height: max-content;
  padding: 60px 80px;
}

.modal-activate-twofactor .container-mjs-twofactor {
  margin-bottom: 0px !important;
  /* width: 280px; */
}

.modal-activate-twofactor .container-mjs-twofactor .card_title {
  margin-bottom: 9px !important;
}

.modal-activate-twofactor .container-mjs-twofactor .card_text {
  margin-top: 0px !important;
  margin-bottom: 36px;
}

.modal_card_container.modal_twofactor_messages {
  height: fit-content !important;
  /* width: 90% !important; */
  max-width: 435px !important;
}

/* Estilos para la seccion de Ajustes */

.container-fluid .main_title,
.container-fluid .main_subtitle {
  display: flex;
}

.container_info_section.section_ajust {
  padding-top: 20px !important;
  padding-left: 30px !important;
  padding-right: 30px !important;
  padding-bottom: 20px !important;
  max-height: 143px;
}

.section_ajust .first-column {
  max-width: 320px !important;
  padding-right: 0px !important;
  margin-bottom: 20px !important;
}

.section_ajust .second-column {
  padding-left: 10px !important;
  margin-bottom: 20px !important;
}

.section_ajust .button.button_active,
.section_ajust .edit_user_profile_button {
  padding: 6px 8px 4px;
  height: 19px;
  display: flex;
  align-items: center;
}

/* Estilos para Perfil de usuario */

.profile_form.user_create_form_container .card_title {
  /* margin-bottom: 0px !important; */
  height: 28px !important;
}

.profile_form.user_create_form_container .card_text {
  margin-bottom: 38px !important;
  height: 20px !important;
}

.user_create_form_container .container-img-profile {
  width: 100%;
  max-width: 54px;
  height: 54px;
  margin-right: 27px;
  padding: 0px !important;
}

.user_create_form_container .container-info-img-profile {
  display: flex;
  /* align-items: center; */
  margin-bottom: 61px;
}

.user_create_form_container .container-form-profile > div {
  margin-bottom: 26px !important;
}

.user_create_form_container .container-form-profile > div:nth-child(3) {
  margin-bottom: 3px !important;
}

.user_create_form_container > form .container-form-profile > div:nth-child(3) {
  margin-bottom: 3px !important;
}

.user_create_form_container .container-form-profile > div:last-child {
  margin-bottom: 0px !important;
}

/* Estilos modal actualiza contraseña */

.padding_modal {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}

.change_password_modal .notification-90-dias .card_title {
  margin-bottom: 0px !important;
}

.change_password_modal .notification-90-dias .card_text {
  margin-bottom: 47px !important;
}

.change_password_modal .card_title {
  margin-bottom: 25px !important;
}

.change_password_modal .card_text {
  margin-bottom: 19px !important;
}

.change_password_modal .container-form-new-password > div:first-child {
  margin-bottom: 34px !important;
}

.change_password_modal .container-form-new-password > div:nth-child(2) {
  margin-bottom: 31px !important;
}

.change_password_modal .container-form-new-password > div:nth-child(2) > p {
  margin-bottom: 0px !important;
}

.change_password_modal .tooltip_password_validator {
  left: 14px !important;
}

.change_password_modal .tooltip_password_validator::before,
.complete_register_container_template
  .complete_register_input
  .tooltip_password_validator::before {
  content: '';
  width: 0px;
  height: 0px;
  border-bottom: 5px solid transparent;
  /* izquierda flecha */
  border-top: 5px solid transparent;
  /* derecha flecha */
  border-right: 9px solid #2d2d2d;
  /* base flecha y color*/
  font-size: 0px;
  line-height: 0px;
  position: absolute;
  left: -9px;
}

/* Estilos para seccion de completar el Registro  */

.complete_register_container_template > img {
  margin-bottom: 29px;
}

.complete_register_container_template .container_register_container_avatar {
  margin-bottom: 30.1px;
}

.complete_register_container_template .complete_register_date {
  margin-bottom: 23px !important;
}

.complete_register_container_template .complete_register_date > div {
  margin-top: 0px !important;
}

.complete_register_container_template .complete_register_input {
  width: 100% !important;
}

.complete_register_container_template
  .complete_register_input
  > div:first-child {
  margin-top: 0px !important;
  margin-bottom: 23px !important;
}

.complete_register_container_template
  .complete_register_input
  > div:nth-child(2) {
  margin-top: 0px !important;
  margin-bottom: 29px !important;
}

.complete_register_container_template
  .complete_register_input
  > div:last-child {
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}

.shadow {
  box-shadow: 0px 0.61px 3.68px 0px rgba(0, 0, 0, 0.1) !important;
}

/*Info perfil superior izquierda*/
.dco_perfil_info_nav-container {
  width: 100%;
  right: 20px;
  height: auto;
  display: flex;
  justify-content: flex-end;
  position: absolute;
  margin-right: 2px;
}

.dco_perfil_info_nav-container img {
  width: 30px;
  height: 30px;
  border-radius: 50%;
}

.dco_perfil_info_nav-container .container_info {
  height: 30px;
  width: max-content;
  overflow: hidden;
  padding-left: 5px;
  max-width: 200px;
}

/* Dashboard */

.dashboard_text {
  color: var(--dashboard-text-color);
}

.dashboard_status {
  min-width: 76px;
  max-height: 21px;
  min-height: 21px;
  background: #018559;
  padding: 7px 25px;
}

.dashboard_status_circle_active {
  min-width: 12px;
  max-width: 12px;
  max-height: 12px;
  min-height: 12px;
  border: 2px solid #04b400;
  background: #05ff00;
  border-radius: 50%;
}

.dashboard_cards {
  box-shadow: 0px 0.61px 3.68px 0px rgba(0, 0, 0, 0.1);
  background: white;
  border-radius: 4px;
}

.dashboard_chart_cards {
  padding: 19px 19px 19px 20px;
  height: fit-content;
}

.dashboard_transactions_green {
  font-size: 16px;
  line-height: 12px;
  color: #0da60a;
  font-weight: 700;
}

.dashboard_transactions_red {
  font-size: 16px;
  line-height: 12px;
  color: #ee3636;
  font-weight: 700;
}

@media screen and (max-width: 538px) {
  .dashboard_petitions_text_container {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 10px !important;
  }
}

@media screen and (max-width: 576px) {
  .dashboard_filter_container > button {
    width: 100%;
  }

  .dashboard_filter_form {
    flex-flow: wrap;
    width: 100%;
  }

  .dashboard_filter_form > div {
    flex: 1 0 200px;
    max-width: none !important;
  }
}

@media screen and (max-width: 443px) {
  .dashboard_status_container {
    flex-wrap: wrap !important;
    row-gap: 10px;
  }
}

.c3 > svg {
  width: 100% !important;
}

/* Roles */

.assign_rol_card {
  width: 95vw;
  max-width: 641px;
  padding: 52px 20px 84px 20px;
}

.rounded-pill {
  margin: auto;
}

.opacity-50 {
  opacity: 0.5 !important;
}

.perfil_info_modal.modal_transac_detalle .dco_perfil_info_nav-container {
  top: 20px;
  right: 19%;
  width: auto !important;
}

.perfil_info_modal.modal_nodos_detalle .dco_perfil_info_nav-container {
  right: 32%;
  width: auto !important;
  margin-top: 17px;
}

.perfil_info_modal.modal_transac_detalle
  .dco_perfil_info_nav-container
  .main_title,
.perfil_info_modal.modal_nodos_detalle
  .dco_perfil_info_nav-container
  .main_title {
  max-width: 130.42px;
}

.modal_create_rol {
  min-height: initial !important;
  width: 100% !important;
  max-width: 795px !important;
  padding: 72px 100px !important;
}

.modal_create_rol .container-fluid.p-0.d-flex.flex-column.align-items-start {
  max-width: 576px;
  gap: 25px;
}

.create_user-form,
.edit_user-form {
  width: 100% !important;
  padding: 51px 160px !important;
}

.modal_ajustes_pasword.change_password_modal {
  /* height: auto !important; */
  max-width: 600px !important;
  max-height: 634px !important;
}

.modal_export_dashboard .modal_container_title,
.modal_export_transactions .modal_container_title,
.modal_export_nodo .modal_container_title,
.modal_export_users .modal_container_title,
.modal_export_gestion .modal_container_title,
.modal_export_actividad .modal_container_title,
.modal_container_title {
  display: none !important;
}

.container_modal_perfil {
  padding-left: 10px !important;
  padding-right: 10px !important;
}


.margin-bottom-40 {
  margin-bottom: 40px !important;
}

.cont-input-confirm-pass {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 12px;
  height: 14px;
}

.border-error {
  border: 1px solid !important;
  border-color: #dc3545 !important;
}

.profile_form .input_label_outside_input {
  padding-left: 8px;
}

@media screen and (max-width: 430px) {
  .container-fluid .main_title,
  .container-fluid .main_subtitle {
    padding-left: 0px !important;
  }

  .main_subtitle {
    font-size: 13px !important;
  }

  .dco_perfil_info_nav-container .modal_container {
    padding: 40px 0 0 0 !important;
  }

  .modal_container > article {
    box-shadow: 0px 2.86px 17.14px 0px rgba(0, 0, 0, 0.1) !important;
    padding: 40px 8px 20px 8px !important;
  }

  .template_container {
    /* padding-top: 35px !important; */
  }

  .dco_nodos-detalles {
    padding: 0px !important;
  }

  .dco_nodos-modal-detalles > div > div {
    margin-top: 0px !important;
    margin-right: 0px !important;
    margin-bottom: 0px !important;
    margin-left: 0px !important;
  }

  .dco_nodos-detalles .d-flex.flex-column.col.pr-column > div > .bold {
    width: 100%;
    max-width: 195px;
  }

  .dco_nodos-detalles
    .d-flex.flex-column.col.pr-column
    > div
    > div:nth-child(2) {
    width: 65px;
  }

  .export_shadow_card {
    box-shadow: 0px 2.86px 17.14px 0px rgba(0, 0, 0, 0.1) !important;
    padding: 38px 20px !important;
  }

  .card_title {
    font-size: 16px;
  }

  .card_text {
    font-size: 14px;
  }

  .modal_container > article.user_export_data_container {
    top: 0% !important;
  }

  .user_export_data_container {
    /* max-height: initial; */
    top: 30% !important;
    padding: 25px 20px 20px 20px !important;
  }

  .module_users .container-fluid.p-0.false.position-relative {
    max-width: 67px;
  }

  .modal_create_rol {
    width: 90% !important;
    max-width: 795px !important;
    padding: 72px 16px !important;
  }

  .modal_container > .profile_form {
    padding: 40px 8px !important;
    min-height: initial !important;
    margin: 0 52px !important;
  }

  .modal_container > .edit_user-form > form {
    width: 100% !important;
    max-width: 100% !important;
  }
}

@media (max-width: 576px) {
  .modal_export_dashboard,
  .modal_export_transactions,
  .modal_export_nodo,
  .modal_export_users,
  .modal_export_gestion,
  .modal_export_actividad {
    padding: 40px 8px 20px 8px !important;
    min-height: calc(100vh - 40px) !important;
    top: 50% !important;
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px !important;
    width: 100%;
  }

  .modal_export_dashboard .modal_container_title,
  .modal_export_transactions .modal_container_title,
  .modal_export_nodo .modal_container_title,
  .modal_export_users .modal_container_title,
  .modal_export_gestion .modal_container_title,
  .modal_export_actividad .modal_container_title,
  .modal_container_title {
    display: flex !important;
  }

  .export_shadow_card {
    box-shadow: 0px 2.86px 17.14px 0px rgba(0, 0, 0, 0.1) !important;
    padding: 38px 20px !important;
  }
}

@media screen and (max-width: 768px) {

  .modal_ajustes_pasword.change_password_modal {
    height: fit-content !important;
    max-height: none !important;
  }
}

.email_tooltip_validator {
  width: fit-content;
  position: absolute;
  padding: 9px 17px 9px 26px;
  border-radius: 2.86px;
  right: -25px;
  top: 0;
  transform: translate(100%, 0%);
  background-color: var(--tootltip-bg);
}
.email_tooltip_validator::after {
  content: ' ';
  position: absolute;
  top: 33%;
  right: 100%; /* parte izquierda del tooltip */
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent var(--tootltip-bg) transparent transparent;
}
.email_tootlip_validator_text {
  font-size: 9px;
  margin: 0;
  color: #ffffff;
  position: relative;
}

.email_tootlip_validator_text_point::before {
  content: '';
  min-width: 3px;
  min-height: 3px;
  border-radius: 50%;
  left: -6px;
  top: 50%;
  transform: translateY(-50%);
  position: absolute;
}

.email_tootlip_validator_text_neutral::before {
  background: #ffffff;
}

.email_tootlip_validator_text_error::before {
  background: red;
}

/* Transacciones */

.copy_button {
  background: var(--accent-color);
  color: var(--accent-text-color);
  border-radius: 4px;
  padding: 5px;
  border: none;
  height: fit-content;
}

.copy_button path {
  fill: var(--accent-text-color);
}

.MuiSlider-thumb {
  background-color: var(--option-select-hover) !important;
  max-width: 16px;
  max-height: 16px;
}

.MuiSlider-track {
  background-color: transparent !important;
  border: none !important;
}

.MuiSlider-valueLabel {
  background-color: #2d2d2d !important;
  padding: 3px !important;
  line-height: 8px !important;
}

.MuiSlider-valueLabelLabel {
  color: #ffffff !important;
  font-size: 8px !important;
  line-height: 8px !important;
}

/* Search input tooltip */

.search_input_tooltip {
  position: fixed;
  background: #000000;
  color: #ffffff;
  width: fit-content;
  height: fit-content;
  padding: 5px 4px;
  z-index: 9999;
  font-size: 8.59px;
  border-radius: 2px;
}

.search_input_tooltip::before {
  --r: 0px;
  content: '';
  display: block;
  width: 3px;
  min-width: 3px;
  min-height: 3px;
  background: #000000;
  position: absolute;
  top: 0;
  left: 9px;
  transform: translateY(-100%) rotate(180deg);
  aspect-ratio: 1 / cos(30deg);
  --_g: calc(tan(60deg) * var(--r)) top var(--r), #000 98%, #0000 101%;
  -webkit-mask: conic-gradient(
        from 150deg at 50% calc(3 * var(--r) / 2 - 100%),
        #000 60deg,
        #0000 0
      )
      0 0/100% calc(100% - 3 * var(--r) / 2) no-repeat,
    radial-gradient(
      var(--r) at 50% calc(100% - 2 * var(--r)),
      #000 98%,
      #0000 101%
    ),
    radial-gradient(var(--r) at left var(--_g)),
    radial-gradient(var(--r) at right var(--_g));
  clip-path: polygon(50% 100%, 100% 0, 0 0);
}

.modal-standart-maxheight {
  max-height: 560px;
}

.modal-block-maxheight {
  max-height: 480px;
}

.modal-two-factor-container {
  min-width: 600px;
  min-height: 560px;
  align-items: center;
  justify-content: center;
  margin: auto;
}

.modal-standart-maxheight > div > div > div > div {
  margin: auto !important;
}

@media screen and (max-width: 430px) {
  .modal-standart-maxheight {
    max-height: initial;
  }

  .modal-two-factor-container {
    min-width: initial;
  }

  .modal-standart-maxheight > div > div > div {
    align-items: initial !important;
    justify-content: initial !important;
    width: calc(100% - 0px) !important;
  }

  .modal-standart-maxheight > div > div > div > div {
    width: 100% !important;
    margin: 0px !important;
  }

  .change_password_modal.modal_twofactor.modal-standart-maxheight {
    height: 95vh !important;
  }
}

/**************** Gráficas ****************/

/* 
  Oculta las líneas de ambos ejes
*/
.c3 .domain,
.c3-axis line {
  fill: none !important;
  stroke: none !important;
}

/* 
  Modifica el color de los números y el label en "x", y el color del label en "y"
*/
.c3 .c3-axis-x,
.c3-axis-y-label {
  color: '#D9D9D9' !important;
  opacity: 0.5 !important;
}

/*
  Modifica el ancho de la linea trazada en transacciones
*/
.c3-shapes-Transacciones path {
  stroke-width: 2px !important;
}

/*
  Rellena la gráfica del valID Score
*/
.c3-shapes .c3-area {
  stroke: none !important;
  fill: #6236ff;
  opacity: 0.75 !important;
}

/*
  Modifica el ancho de cada barra en la gráfica de barras
*/
.c3-bar {
  fill: #6236ff;
  stroke: #6236ff;
  width: 20px !important;
  stroke-width: 1 !important;
}
/* Nodos */
@media screen and (max-width: 400px) {
  .nodos_card_info {
    flex: 1 0 200px !important;
  }
}

/*
  Custom tooltip charts
*/
.tooltip_charts_dashboard {
  background-color: #000;
  color: white;
  border-radius: 2px;
  padding: 2px 8px;
  font-size: 9px;
  font-family: 'Mulish', sans-serif;
  font-weight: 400;
}

.header_page_container {
  padding-top: 35px !important;
}

/* Activity */

/* Estilos para modal de cerrar sesion */

.modal_container.moblie-z-index {
  z-index: 214748369;
}

.modal_card_container.modal_cerrar_session > div {
  justify-content: center;
}

.contenido-modal-cerrar-sesion .container-cerrar-sesion {
  width: 100%;
  max-width: 295px;
  margin: 0 !important;
  padding-top: 56px;
  padding-bottom: 59px;
}

.container-cerrar-sesion .card_title {
  margin-bottom: 23px !important;
}

.container-cerrar-sesion .card_text {
  margin-bottom: 36px !important;
}

@media screen and (max-width: 472px) {
  .contenido-modal-cerrar-sesion .container-cerrar-sesion {
    max-width: 100%;
  }
}

/* Texto de las estadísticas en dashboard */
.text_statistics_tags {
  font-size: 10px;
  font-weight: 700;
  line-height: 13px;
  opacity: 0.5;
  font-family: 'Mulish', sans-serif;
  color: #000;
}

.text_container_cards {
  flex: 1 0 180px;
  max-width: 243px;
  height: 75px;
  max-height: 75px;
  padding: 14px 17px 10px 19px;
  gap: 6px;
}
.change_password_modal .modal-two-factor-container .card_title {
  margin-bottom: 46px !important;
}

.change_password_modal .modal-two-factor-container .card_text {
  margin-bottom: 45px !important;
}

/* DIMENSIONAR LAS GRÁFICAS PARA EVITAR DESBORDE */
/*  
#chart_historico_numero svg:nth-child(1) g, #chart_result_validation_node svg:nth-child(1) g {
  transform: translate(60.5,4.5) scale(0.98) !important;
} */

.style_charts {
  transform: translate(60.5, 4.5) scale(0.98) !important;
}

/* Time picker */

ul.MuiList-root.MuiList-padding.MuiMultiSectionDigitalClockSection-root::after {
  display: none !important;
}
li.MuiButtonBase-root.MuiMenuItem-root.MuiMenuItem-gutters.MuiMenuItem-root.MuiMenuItem-gutters.MuiMultiSectionDigitalClockSection-item {
  min-height: fit-content;
  min-width: 100% !important;
  font-size: 12px !important;
}
.input_option_time {
  width: fit-content;
  position: absolute;
  border-radius: 0px 0px 4px 4px;
  background: #fff;
  z-index: 9999;
  top: 100%;
  left: 0;
}

.swiper {
  width: 100%;
  height: 100%;
}

.swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
}

.swiper-slide {
  width: fit-content !important;
}

.swiper_navigation_disabled {
  display: none !important;
}

.swiper_next_button {
  position: absolute;
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  width: 27px;
  height: 27px;
  background-color: #ffffff;
  top: var(--swiper-navigation-top-offset, 50%);
  margin-top: calc(0px - 11px / 2);
  z-index: 10;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  right: var(--swiper-navigation-sides-offset, 10px);
  left: auto;
}

.swiper_prev_button {
  position: absolute;
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  width: 27px;
  height: 27px;
  background-color: #ffffff;
  top: var(--swiper-navigation-top-offset, 50%);
  margin-top: calc(0px - 11px / 2);
  z-index: 10;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  left: var(--swiper-navigation-sides-offset, 10px);
  right: auto;
}

.swiper-button-next {
  align-items: flex-end !important;
}

.swiper-button-next::after {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  width: 27px;
  height: 27px;
  background-color: #ffffff;
  content: '' !important;
  background: url('/images/icons/right.svg') no-repeat center/30% auto #ffffff;
  -webkit-box-shadow: 15px 0px 41px 37px rgba(255, 255, 255, 1);
  -moz-box-shadow: 15px 0px 41px 37px rgba(255, 255, 255, 1);
  box-shadow: 15px 0px 41px 37px rgba(255, 255, 255, 1);
}

.swiper-button-prev {
  align-items: flex-end !important;
}

.swiper-button-prev::after {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  width: 27px;
  height: 27px;
  background-color: #ffffff;
  content: '' !important;
  background: url('/images/icons/left.svg') no-repeat center/30% auto #ffffff;
  -webkit-box-shadow: 15px 0px 41px 37px rgba(255, 255, 255, 1);
  -moz-box-shadow: 15px 0px 41px 37px rgba(255, 255, 255, 1);
  box-shadow: 15px 0px 41px 37px rgba(255, 255, 255, 1);
}

/* .swiper-slide:nth-child(2n) {
  width: 60%;
}

.swiper-slide:nth-child(3n) {
  width: 40%;
} */

.managenement_filter_contaianer {
  flex-wrap: nowrap !important;
}
@media screen and (max-width: 900px) {
.managenement_filter_contaianer {
  flex-wrap: wrap-reverse !important;
  justify-content: flex-end !important;
  align-items: flex-end;
}
}

.dco_column_sort_selected{
  font-weight: 900 !important;
  background-color: #FFFFFF26 !important;
}
.dco_button_limpiar{
  border-radius: 50px;
  background: var(--accent-color);
  display: inline-flex;
  padding: 8px 10px;
  align-items: center;
  gap: 8px;
  width: 87px;
  height: 29px;
  font-family: 'Mulish', sans-serif;
  font-size: 10px;
  font-weight: 700;
  line-height: 12.55px;
  text-align: left;
  text-underline-position: from-font;
  text-decoration-skip-ink: none;
  color: var(--accent-text-color);
  border: none;
}
.error_list_message {
  margin-top: 20px;
}
.error_list_message > li {
  color: #FFFFFF;
}

.border_black_for_forms_select div.input_select{
  border-color: #000 !important;
}

.tooltip_table_rol{
  color: white;
  font-family: 'Mulish', sans-serif;
  font-weight: 400 !important;
  font-size: 10px !important;
    
}

.modal_card_properties {
    width: 40dvw;
    height: 45dvh;
    position: static;
    top: 50%;
    left: 50%;
    /* transform: translate(-50%, -50%); */
    background-color: '#ffffff';
}

.text_container_cards p.main_title {
  padding-left: 0px !important;
}

.text_container_cards small.main_title {
  padding-left: 5px !important;
}

.management_see_details_button{
  white-space: nowrap;
}

.add_avatar_button {
  display: block;
  width: 37px;
  height: 37px;
  background: url(/images/complete_register/plus.webp) no-repeat center/contain;
  border: none;
  border-radius: 50%;
}