.portadaPedidos {
  width: 100%;
}
h2 {
  text-align: center;
  padding-top: 50px;
}
.optionDeliveryDiv,
.optionPickupDiv {
  display: flex;
  position: relative;
  max-width: 1100px;
  margin: 0 auto 30px;
  margin-top: 20px;
  background: #f8f8f8;
  border-radius: 15px;
  min-height: 440px;
  width: 90%;
}
#shippingMapInputStreet,
#shippingMapInputNumber,
#shippingMapInputCorner,
#shippingMapInputApto {
  padding: 16px 10px;
  width: calc(100% - 21px);
  margin-bottom: 5px;
  margin-top: 10px;
  font-weight: 100;
  border-radius: 10px;
  border: 1px solid #d6d6d6;
  background: transparent;
  color: var(--auxiliar-color-one) !important;
  font-size: var(--span-font-size);
  line-height: var(--span-line-height);
}
#shippingMapInputStreet:placeholder,
#shippingMapInputNumber:placeholder,
#shippingMapInputCorner:placeholder,
#shippingMapInputApto:placeholder {
  font-size: var(--span-font-size);
  line-height: var(--span-line-height);
  font-weight: 100;
  color: var(--primary-color-one);
}
.formDeliveryDiv {
  padding: 30px;
  width: calc(70% - 60px);
}
#confirmChangeShipping,
#confirmChangePickup {
  margin: 15px auto 0;
}
#shippingMapSubtitle {
  font-weight: 300;
  margin-top: 15px;
}
.changeAddressContent .optionsDiv {
  padding: 0;
  width: 500px;
  margin: 30px auto 30px;
  border: 0;
  text-align: center;
  display: flex;
  height: 60px;
}
#pickup,
#delivery {
  width: 260px;
  cursor: pointer;
  position: relative;
  padding: 20px 10px;
  text-transform: none;
  border: unset;
  text-align: center;
  border-radius: 10px;
  background-color: var(--primary-color-one);
  color: var(--primary-color-two);
  opacity: 0.6;
  transition: 0.5s all ease-in-out;
}
#pickup:hover,
#delivery:hover {
  opacity: 1;
}
.option.selectedOption {
  opacity: 1 !important;
  background-color: var(--primary-color-one) !important;
  color: var(--primary-color-two) !important;
}
#delivery {
  position: absolute;
  left: 0;
}
#pickup {
  position: absolute;
  right: 0;
}
#shippingMap,
#storeMap {
  width: 100%;
  border-radius: 10px;
}
.hidden {
  display: none;
}
.shippingSelectDiv {
  width: 100%;
  margin-top: 10px;
  margin-bottom: 20px;
  position: relative;
}
#storeData {
  margin-bottom: 20px;
}
.shippingSelect {
  width: 100%;
  padding: 15px 10px;
  color: var(--secondary-color-two);
  font-size: 12px;
  background: transparent;
  border-radius: 10px;
  font-weight: 300;
  border: 1px solid #d6d6d6;
}
.shippingSelectArrow {
  position: absolute;
  right: 10px;
  width: 12px;
  height: 15px;
  top: calc(50% - 2px);
}
img.shippingSelectImg {
  width: 100%;
}

/* Popup change local */

.popupChangeAddressBackground {
  position: fixed;
  z-index: 999;
  top: 0;
  width: 100%;
  height: 100vh;
  right: 0;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  display: none;
  align-items: center;
  justify-content: center;
}
.popupChangeAddressBackground .changeAddressContent {
  background: var(--secondary-color-one);
  max-width: 1200px;
  width: 70vw;
  border-radius: 10px;
  height: 80vh;
  overflow-y: scroll;
  position: relative;
  display: flex;
  flex-direction: column;
  max-height: 700px;
}
.popupChangeAddressBackground .changeAddressContent h2 {
  margin-top: 0;
  /* padding-top: 80px; */
  margin-bottom: 0 !important;
}
.popupChangeAddressBackground .optionsDiv {
  margin: 20px auto 54px auto;
  height: 56px;
}
.popupChangeAddressBackground .optionPickupDiv,
.popupChangeAddressBackground .optionDeliveryDiv {
  margin-top: 50px;
}
.popupChangeAddressBackground .closeChangeAdressContact {
  display: block;
}
.closeChangeAdressContact {
  position: absolute;
  right: 15px;
  top: 15px;
  cursor: pointer;
  display: none;
  color: var(--primary-color-one);
  width: 10px;
  height: 10px;
}

@media screen and (min-width: 768px) and (max-width: 1000px) {
  .popupChangeAddressBackground .changeAddressContent {
    width: 85vw;
  }
}

@media screen and (max-width: 768px) {
  /* Popup  change local */
  .popupChangeAddressBackground {
    height: 100dvh;
    transition: 0.5s all ease-in-out;
  }
  .popupChangeAddressBackground .changeAddressContent {
    width: 100vw;
    height: 100%;
    height: 100dvh;
    max-height: unset;
    border-radius: 0;
  }
  .popupChangeAddressBackground .optionsDiv {
    /* flex-direction: column; */
    margin: 0 auto 0 auto;
    height: auto;
  }
  .popupChangeAddressBackground .option {
    position: unset !important;
    padding: 10px 0px;
    height: auto;
    margin-bottom: 10px;
  }
  .popupChangeAddressBackground .changeAddressContent h2 {
    margin-bottom: 10px;
  }
  .popupChangeAddressBackground .button {
    margin-top: 20px;
  }
  #storeMap,
  #shippingMap {
    margin: 10px auto 5px;
  }
  /****/
  .changeAddressContent .optionsDiv {
    width: 90%;
    margin: 0 auto;
    height: 44px;
    justify-content: center;
  }
  #delivery,
  #pickup {
    width: fit-content;
    text-wrap: nowrap;
    padding: 15px 30px;
    margin: 0;
    position: unset !important;
    opacity: 1;
    background: transparent;
    color: var(--primary-color-one);
    transition: unset;
    font-size: calc(var(--button-font-size) - 1px);
  }
  .optionDeliveryDiv,
  .optionPickupDiv {
    flex-direction: column;
    width: 90%;
    background: transparent;
    align-items: center;
    margin-top: 0;
    /* display: flex; */
  }
  #shippingMap,
  #storeMap {
    height: 300px;
    width: 100%;
    margin: 0 auto 5px;
    aspect-ratio: 1/1;
  }
  #shippingMap {
    margin: 20px auto 5px;
  }
  .popupChangeAddressBackground .optionPickupDiv,
  .popupChangeAddressBackground .optionDeliveryDiv {
    min-height: unset;
    margin-top: 10px !important;
  }
  .formDeliveryDiv {
    padding: 0;
    width: 100%;
    margin: 20px auto 0;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: baseline;
  }
  .shippingSelectDiv,
  #storeData {
    margin-bottom: 0;
  }
  #storeAddress {
    margin-top: 10px;
    margin-bottom: 10px;
    font-weight: 400;
    font-size: 13px;
  }
}