/* TODO: HELPERS */* { font-family: 'DMSans-regular',sans-serif; }
.center-align { text-align: center; }
.uppercase { text-transform: uppercase !important; }

/* Margenes y Paddings */
.m-0{margin:0px !important} .m-5{margin:5px !important} .m-10{margin:10px !important} .m-15{margin:15px !important} .m-20{margin:20px !important} .m-25{margin:25px !important} .m-30{margin:30px !important} .m-35{margin:35px !important} .m-40{margin:40px !important} 
.mt-0{margin-top:0px !important} .mt-5{margin-top:5px !important} .mt-10{margin-top:10px !important} .mt-15{margin-top:15px !important} .mt-20{margin-top:20px !important} .mt-25{margin-top:25px !important} .mt-30{margin-top:30px !important} .mt-35{margin-top:35px !important} .mt-40{margin-top:40px !important}
.mb-0{margin-bottom:0px !important} .mb-5{margin-bottom:5px !important} .mb-10{margin-bottom:10px !important} .mb-15{margin-bottom:15px !important} .mb-20{margin-bottom:20px !important} .mb-25{margin-bottom:25px !important} .mb-30{margin-bottom:30px !important} .mb-35{margin-bottom:35px !important} .mb-40{margin-bottom:40px !important} .mb-80{margin-bottom: 80px !important;}
.mr-0{margin-right:0px !important} .mr-5{margin-right:5px !important} .mr-10{margin-right:10px !important} .mr-15{margin-right:15px !important} .mr-20{margin-right:20px !important} .mr-25{margin-right:25px !important} .mr-30{margin-right:30px !important} .mr-35{margin-right:35px !important} .mr-40{margin-right:40px !important}
.ml-0{margin-left:0px !important} .ml-5{margin-left:5px !important} .ml-10{margin-left:10px !important} .ml-15{margin-left:15px !important} .ml-20{margin-left:20px !important} .ml-25{margin-left:25px !important} .ml-30{margin-left:30px !important} .ml-35{margin-left:35px !important} .ml-40{margin-left:40px !important}
.p-0{padding:0px !important} .p-5{padding:5px !important} .p-10{padding:10px !important} .p-15{padding:15px !important} .p-20{padding:20px !important} .p-25{padding:25px !important} .p-30{padding:30px !important} .p-35{padding:35px !important} .p-40{padding:40px !important}
.pt-0{padding-top:0px !important} .pt-5{padding-top:5px !important} .pt-10{padding-top:10px !important} .pt-15{padding-top:15px !important} .pt-20{padding-top:20px !important} .pt-25{padding-top:25px !important} .pt-30{padding-top:30px !important} .pt-35{padding-top:35px !important} .pt-40{padding-top:40px !important}
.pb-0{padding-bottom:0px !important} .pb-5{padding-bottom:5px !important} .pb-10{padding-bottom:10px !important} .pb-15{padding-bottom:15px !important} .pb-20{padding-bottom:20px !important} .pb-25{padding-bottom:25px !important} .pb-30{padding-bottom:30px !important} .pb-35{padding-bottom:35px !important} .pb-40{padding-bottom:40px !important} .pb-80 {padding-bottom: 80px !important;}
.pr-0{padding-right:0px !important} .pr-5{padding-right:5px !important} .pr-10{padding-right:10px !important} .pr-15{padding-right:15px !important} .pr-20{padding-right:20px !important} .pr-25{padding-right:25px !important} .pr-30{padding-right:30px !important} .pr-35{padding-right:35px !important} .pr-40{padding-right:40px !important}
.pl-0{padding-left:0px !important} .pl-5{padding-left:5px !important} .pl-10{padding-left:10px !important} .pl-15{padding-left:15px !important} .pl-20{padding-left:20px !important} .pl-25{padding-left:25px !important} .pl-30{padding-left:30px !important} .pl-35{padding-left:35px !important} .pl-40{padding-left:40px !important}


/* TODO: habilidades en botones */
button[disabled], a[disabled]{
  pointer-events: none;
  background-color: #DFDFDF !important;
  -webkit-box-shadow: none;
    box-shadow: none;
  color: #9F9F9F !important;
  cursor: default;
}


/*ERROR DE VALIDACION*/
i.requerido{
  color: var(--secondary);
  font-size: 16px;
}

div.form-error{
  color:  var(--secondary);
  font-size: 14px;
  min-height: 10px;
  font-family: 'DMSans-regular',sans-serif;
}

.input-error{
  border-color: var(--secondary) !important;
}

.toastjs-container { font-family: 'DMSans-regular',sans-serif; }

/* TODO: LOADER */
.loader-overlay {
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  height: 100%;
  width: 100%;
  background: #000;
  opacity: 0.5;
  display: none;
  will-change: opacity;
}

.loader-container {
  width: 100%;
  min-height: 70vh;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.loader {
  width: 55px;
  height: 55px;
  border: 5px solid #FFF;
  border-bottom-color: var(--secondary);
  border-radius: 50%;
  display: inline-block;
  box-sizing: border-box;
  animation: rotation 1s linear infinite;
}

@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* TODO: Eliminar acciones de input number */
input[type=number].size__nmb::-webkit-inner-spin-button, 
input[type=number].size__nmb::-webkit-outer-spin-button,
input[type=number].sum__input::-webkit-inner-spin-button,
input[type=number].sum__input::-webkit-outer-spin-button { 
  -webkit-appearance: none !important;
  margin: 0 !important;
  pointer-events: none !important;
}

/* TODO: BOTON IDIOMAS */
a.language__link, a.profile__btn,
a.pro-table__link {
  cursor: pointer;
}

.buy .jp-card.jp-card-identified{box-shadow: 0 0 0px rgba(0,0,0,0.3)!important;}
.buy .jp-card-container{height: 80px !important;}
.buy .jp-card{width: 0px !important;min-width: 180px !important;margin: 0 auto !important;}
.buy .jp-card-container{width: 100% !important}
.buy .jp-card-logo.jp-card-jcb {width: 60px !important;}

.button--authorize{color: #ffffff;background-color:var(--on-secondary);}

.profile_head {
    -webkit-display: flex;
    -moz-display: flex;
    -ms-display: flex;
    -o-display: flex;
    display: flex;
    justify-content: space-between;
    align-items: center;
    column-gap: 24px;
    padding: 14px;
    border-bottom: solid 1px rgba(0,0,0,0.08);
}

.profile_link {
  background-color: var(--on-secondary);
  border: 1px solid var(--on-secondary);
  padding: 6px 10px;
  border-radius: 50%;
  color: #ffffff;
  font-weight: bold;
  font-size: 1rem;
  display: flex;
  justify-content: center;
}