:root {
  color-scheme: light dark;
  --dark-mode-toggle-icon-size: 4rem;

  font-size: 10px;
  --container: 1170px;

  /*===== Colores =====*/
  --first-color: #0074d9;
  --first-color-hover: #0066bf;
  --first-color-active: #3390e1;
  --second-color: #ff647d;
  --bg-succes: #009e61;
  --input-color: #80868b;
  --border-color: #dadce0;
  --danger-color: #be5250;
  --iconos: "salud-digna";

  /* Light Css*/
  --background-color: #f7f7f7;
  --background-color2: #fff;
  --color-card:#FFFFFF;
  --color-titulo: #616161;
  --color-texto: #616161;
  --color-texto-input: #616161;
  --color-disabled: #E5E5E5;
  --border-input: var(--border-color);
  --option-input-select: #D4EBFF; 

   /* Alert Danger */
   --alert-danger-color: var(--danger-color);
   --alert-danger-background: #ffe0e3;
}
/* FIX BUG */
#header-bar.form__input-error {
  border: none;
}
/* .icon-info:hover :before {
    content: "\e906";
} */

@font-face {
  font-family: "Open Sans Regular";
  src: url("../fonts/OpenSans-Regular.ttf");
  src: url("../fonts/OpenSans-Regular.eot?#iefix") format("embedded-opentype"),
    url("../fonts/OpenSans-Regular.woff2") format("woff2"),
    url("../fonts/OpenSans-Regular.woff") format("woff"),
    url("../fonts/OpenSans-Regular.ttf") format("truetype"),
    url("../fonts/OpenSans-Regular.svg#OpenSans-Bold") format("svg");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Open Sans Bold";
  src: url("../fonts/OpenSans-Bold.ttf");
  src: url("../fonts/OpenSans-Bold.eot?#iefix") format("embedded-opentype"),
    url("../fonts/OpenSans-Bold.woff2") format("woff2"),
    url("../fonts/OpenSans-Bold.woff") format("woff"),
    url("../fonts/OpenSans-Bold.ttf") format("truetype"),
    url("../fonts/OpenSans-Bold.svg#OpenSans-Bold") format("svg");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

body {
  font-family: "Open Sans Regular", sans-serif;
  background-color: #ffffff;
  font-size: 1.4rem;
  color: #616161;
  line-height: 2.2rem;
  width: 100%;
  overflow-x: hidden;
  padding: 0;
}
h1,
h2,
h3,
h4,
h5 {
  font-family: "Open Sans Bold", sans-serif;
}
b, strong {
  font-family: "Open Sans Bold", sans-serif;
}


/* Eliminar estilos de autocompletado en Chrome*/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  box-shadow: none;
  -webkit-box-shadow: none;
  transition: background-color 5000s ease-in-out 0s;
}

a:hover {
  text-decoration: none;
}

.contenedor {
  /* width: 95%; */
}
/* .title {
    color: var(--color-titulo);
} */

.bg-success {
  background-color: var(--bg-succes);
}
.text-primary {
  color: var(--first-color);
}

.shadow {
  box-shadow: 0 3px 6px #00000029;
}
.hr {
  border: 0;
  border-top: 1px solid var(--color-disabled);
}
.card {
  background-color: var(--background-color2);
  width: 100%;
  /* box-shadow: 2px 3px 6px #00000029; */
  border-radius: 4px;
  /* padding: 1rem; */
  box-shadow: 0 3px 6px #00000029;
}
.card__size-lg {
  padding: 4rem;
}
.card__size-md {
  padding: 2rem;
}
.card__size-sm {
  padding: 1rem;
}

/** Botones **/
.btn {
  background: none;
  border: 0;
  border-radius: 0.4rem;
  padding: 1.1rem;
  cursor: pointer;
  font-weight: bold;
  font-size: 1.6rem;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 4rem;
  padding: 0px;
  box-sizing: border-box;
  text-decoration: none;
  outline: none;
}
.btn-one {
  background-color: var(--first-color);
  color: #fff;
  width: 100%;
  /* max-width: 445px; */
  border: solid 1px var(--first-color);
}
.btn-one:hover {
  background-color: var(--first-color-hover);
}
.btn-one:active {
  background-color: var(--first-color-active);
}
.btn-one-outline {
  background: none;
  border: solid 0.2rem var(--first-color);
  width: 100%;
  max-width: 445px;
  color: var(--first-color);
}
.btn-one-outline:hover {
  border-color: var(--first-color-hover);
  color: var(--first-color-hover);
}
.btn-one-outline:active {
  border-color: var(--first-color-active);
  color: var(--first-color-active);
}
.btn__disabled {
  color: #fff;
  background-color: var(--color-disabled);
  border: none;
  cursor: no-drop;
}
.btn__disabled:focus {
  outline: 0;
  background: var(--color-disabled);
  color: white;
}
.btn__disabled:hover,
.btn__disabled:active {
  color: #fff;
  background-color: var(--color-disabled);
}
/** End Botones **/

/** Loader BTN **/
.loader {
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 1s linear infinite;
  animation: spin 1s linear infinite;
}
.loader__btn {
  border: 4px solid #f3f3f3;
  border-top: 4px solid #3498db;
  width: 15px;
  height: 15px;
  margin-left: 10px;
  display: none;
}
.loader__show {
  display: block;
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/** End Loader BTN **/

/** Sweet Alert **/
.swal2-popup {
  font-size: 1.5rem; /* tamaños del texto */
}
.swal2-styled.swal2-confirm {
  background-color: var(--first-color);
}
.swal2-styled.swal2-confirm:hover {
  background-color: var(--first-color-hover);
}
.swal2-styled.swal2-confirm:active {
  background-color: var(--first-color-active);
}
.swal2-actions:not(.swal2-loading) .swal2-styled:active {
  background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
}
.swal2-styled.swal2-confirm:focus {
  box-shadow: 0 0 0 3px rgba(0, 116, 217, 0.18);
}
/** End Sweet Alert **/

@media (max-width: 991.98px) {
  .contenedor {
    max-width: 95%;
  }
  .menu {
    display: block;
  }
}

@media (max-width: 767.98px) {
  .btn {
    height: 5rem;
  }

  .btn-one {
    max-width: none;
  }

  .card__size-big {
    padding: 2rem;
  }
}
@media (max-width: 575.98px) {
  .contenedor {
    width: 100%;
    max-width: initial;
  }
  .card__size-md {
    padding: 1rem;
  }
  .card__size-lg {
    padding: 2rem;
  }
  dark-mode-toggle {
    position: fixed;
    top: 6.5%;
    right: 125px;
    z-index: 99;
    background: none;
    box-shadow: none;
    width: 30px;
    height: 40px;
    display: flex;
    align-items: center;
    padding-left: 0.5rem;
    margin: 0 auto;
  }
}