/*Modificación Checkout (Marcos)*/
section#checkout-personal-information-step {
  border-radius: 10px;
  margin: 10px 0px;
}

.form-control {
  border-radius: 10px;
}

body#checkout section.checkout-step {
  border-radius: 10px !important;
  margin: 10px 0px;
  border-left: 5px solid #bdbdbd;
}

section#js-checkout-summary {
  border-radius: 10px;
}

@media (min-width: 768px){
    .col-md-8 {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: unset !important;
        align-items: unset !important;
    }
}

/*Agregamos Estilos Loguin PopUp*/

/*mi cuenta*/

.form-wraps h3 {
    color: #000000;
    font-size: 18px;
}

#customer-form-login .fa-5x {
    font-size: 3em;
    border: solid 1px black;
    padding: 10px 15px;
    border-radius: 50px;
}

.customer-container.showy {
  z-index: 9999999999999;
}

.customer-dropdown > .customer-dropdown-menu li,
.customer-dropdown > .customer-dropdown-menu li a,
.customer-dropdown > .customer-dropdown-menu li span {
  border-radius: 5px !important;
}

.customer-dropdown > .customer-dropdown-menu {
  border-radius: 10px !important;
  box-shadow: 4px 3px 5px 0px rgb(0 0 0 / 35%);
}

/*Mi cuenta popups*/
input#password {
  margin-bottom: 0px !important;
  margin-top: 10px !important;
}

button.btn.btn-outline-secondary {
  border-radius: 5px;
}

.btn:not(:disabled):not(.disabled) {
  cursor: pointer;
}

.input-group > .input-group-append > .btn,
.input-group > .input-group-append > .input-group-text,
.input-group > .input-group-prepend:first-child > .btn:not(:first-child),
.input-group
  > .input-group-prepend:first-child
  > .input-group-text:not(:first-child),
.input-group > .input-group-prepend:not(:first-child) > .btn,
.input-group > .input-group-prepend:not(:first-child) > .input-group-text {
  border-radius: 5px !important;
}

.form-wraps .input-group input.form-control {
  border: solid 1px black !important;
}

.form-wraps {
  background-color: #ffffff !important;

  color: #000000 !important;

  display: flex;

  justify-content: center;

  width: 500px;

  align-items: center;

  height: 300px;

  border-radius: 10px !important;
}

.input-group.js-parent-focus {
  border: none !important;
}

.input-group .input-group-btn > .btn {
  border-radius: 5px !important;
  font-size: 9px;
  margin-top: 10px;
}

button#form-control-submit-login {
  border-radius: 10px;
  height: unset !important;
  padding: 4px 10px 4px 10px;
}

.form-wraps label,
.form-wraps .form-control-comment {
  color: #000000 !important;
  font-size: 14px;
}

.btn-cust-submit {
  border-radius: 5px;
}

.form-wraps .form-control,
.form-wraps input[type="text"],
.form-wraps .input-group {
  border-radius: 5px;
}

form#customer-form-forgot {
  text-align: center;
}

button#form-control-submit-email {
  margin-left: -86px;
}

/*icono user mobile*/
i.fa.fa-user.fa-fw.icon:hover {
  color: #3c3c3b !important;
  transition: 57ms;
}

.input-group .input-group-btn > .btn {
  border: 0;

  box-shadow: none;

  font-weight: 400;

  margin-left: 0;

  padding: 5px;

  text-transform: uppercase;

  font-size: 10px;
}

input#password {
  border: solid 1px black !important;

  margin-bottom: 5px !important;
}

input#email {
  border: solid 1px black !important;

  margin-bottom: 5px !important;

  border-radius: 5px !important;
}

/*Editamos icon user*/
.col.col-auto.col-md.right-nav.text-right .customer-info {
  display: none;
}

i.fa.fa-user.fa-fw.icon {
  font-size: 1.6285714286rem !important;
  color: black !important;
}

//* -------------------- login edit 24/1 -------------------- */
#customer-form-login .input-group .input-group-btn > .btn {
  line-height: 0;
  font-weight: 400;
  margin-left: 0;
  margin-top: 0 !important;
  z-index: 999;
  background-color: transparent !important;
  color: #019ae9 !important;
}

#customer-form-login .form-group.row {
  align-items: center;
  justify-content: center;
}

#customer-form-login > section > div:nth-child(3) > div {
  padding: 0 !important;
}

#customer-form-login > section > div:nth-child(4) > div {
  padding: 0 !important;
}

#customer-form-login > section > div:nth-child(3) > label {
  padding: 0;
  height: 30px;
  background-color: #e2351c;
  max-width: 30px;
  border-radius: 11px 0px 0px 11px;
  margin: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

#customer-form-login > section > div:nth-child(4) > label {
  padding: 0;
  height: 30px;
  background-color: #e2351c;
  max-width: 30px;
  border-radius: 11px 0px 0px 11px;
  margin: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

i.fa.fa-lock {
    font-size: 14px;
    color: white;
}

#customer-form-login .fa-envelope:before {
  color: white;
}

#customer-form-login .fas.fa-lock {
  color: white;
}

#customer-form-login input#email {
  border: solid 1.3px #a3a3a3 !important;
  border-radius: 0px 11px 11px 0px !important;
  margin: 0 !important;
  height: 30px;
}

#customer-form-login input#password {
  margin: 0 !important;
  border: none !important;
}

#customer-form-login .user-icon {
  text-align: center;
  color: #000000;
  padding-bottom: 15px;
}

@media (max-width: 767px) {
  #customer-form-login .form-wraps {
    width: 70vw !important;
  }

  #customer-form-login .form-wraps .form-group.row {
    justify-content: center;
    flex-direction: row;
    flex-wrap: nowrap;
  }

  #customer-form-login .user-icon::before {
    display: none;
  }
}

@media (max-width: 768px) {
  form#customer-form-login .form-group {
    width: 200px !important;
    margin: 5px 0;
    flex-wrap: nowrap;
  }

  #customer-form-login input#password {
    border-radius: 0 !important;
  }

  #customer-form-login .input-group .input-group-btn > .btn {
    border-radius: 0 10px 10px 0 !important;
  }
}

@media (min-width: 768px) {
  #customer-form-login input#password {
    width: 250px !important;
  }
  #customer-form-login > section > div:nth-child(4) > div > div > span > button {
    margin-top: 0px !important;
}
}

#customer-form-login span.input-group-btn {
  margin-left: 0px !important;
}

#customer-form-login > section > div:nth-child(4) > div > div {
  border: solid 1.3px #a3a3a3 !important;
  border-radius: 0px 11px 11px 0px !important;
  height: 30px;
}

/* Se insertan estilos en "Recuperar contraseña"  */
input#email {
  border: solid 1.3px #a3a3a3 !important;
  border-radius: 0px 11px 11px 0px !important;
  height: 30px;
}

label.col-md-3.form-control-label.required.email-center {
  background-color: #e2351c;
  padding: 0;
  height: 30px;
  max-width: 30px;
  border-radius: 11px 0px 0px 11px;
  margin: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

.fa-envelope:before {
  content: "\f0e0";
  color: white;
}

button#form-control-submit-email {
  margin: auto;
}

/* Se edita el pop up de crear cuenta */

.form-wraps.create-form {
    height: 450px;
    width: 500px;
}

#customer-form-create > section > div:nth-child(3) {
    display: none;
}

#customer-form-create > section > div:nth-child(8) {
    display: none;
}

.form-wraps .form-control,
.form-wraps input[type="text"],
.form-wraps .input-group {
  border: 1px solid #a3a3a3 !important;
}

.form-wraps .input-group input.form-control {
  border: solid 1px transparent !important;
}

.form-wraps .custom-radio {
  border: 2px solid #a3a3a3 !important;
}

/* Se cambia boton de cierre de pop up aplicando medi query para escritorio y mobile */

.close-x {
  position: absolute;
  border: 2px solid white;
  right: -18px;
  top: -11px;
  height: unset;
  cursor: pointer;
  z-index: 999999;
  background: #e2351c;
  border-radius: 50%;
}

.close-x i {
  font-size: 14px !important;
  padding-left: 10px !important;
  padding-right: 10px !important;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

@media (max-width: 768px) {
  .form-wraps.forgot-pass-form .form-group.row {
    width: 200px !important;
    margin: 5px 0;
    flex-wrap: nowrap;
    margin: auto;
  }

  .close-x {
    position: absolute;
    border: 2px solid white;
    right: -11px;
    top: -11px;
  }
}

button#iqit-wishlist-product-btn,
button#iqit-compare-product-btn {
  color: white;
}

/*popups mobile de login*/
@media (min-width: 200px) and (max-width: 767px) {
  .form-wraps {
    width: 95% !important;
  }
}