/**
* 2007-2023 PrestaShop
*
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License (AFL 3.0)
* that is bundled with this package in the file LICENSE.txt.
* It is also available through the world-wide-web at this URL:
* http://opensource.org/licenses/afl-3.0.php
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to http://www.prestashop.com for more information.
*
*  @author    PrestaShop SA <contact@prestashop.com>
*  @copyright 2007-2023 PrestaShop SA
*  @license   http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
*  International Registered Trademark & Property of PrestaShop SA
*
* Don't forget to prefix your containers with your own identifier
* to avoid any conflicts with others containers.
*/

.touchspin-down {
  color: #000000;
}
.touchspin-up {
  color: #000000;
}
.upp-cartth {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

.upp_row {
  width: 100%;
  border-color: red;
}
.upp_column {
  width: 19%;
  border-color: red;
  display: inline-block;
}
.upp_packimage {
}
.upp_image {
  width: 200px;
}
.upp_selected_packimage {
  width: 200px;
  height: 200px;
  background-color: #bf935c;
}

.aup-desc-box {
  background-color: white;
  padding: 2px;
  margin-top: 4px;
}

.aup-product-title {
}

.aup-product-title h1 {
  font-size: 1.375rem;
  font-family: inherit;
  font-weight: 700;
  line-height: 1.1;
  color: inherit;
}

.aup-pro-box ul,
.aup-pro-box-aftr-select ul {
  list-style: none;
  padding: 0;
  margin: 0;

  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.aup-pro-box-aftr-select ul li {
  display: inline-block;
  vertical-align: top;
  width: 48%;
  background: #bf935c;
  position: relative;
  height: 100%;
  overflow: hidden;
  line-height: 0;
  margin: 2px 0px;
  box-sizing: border-box;
}

.aup-pro-box-aftr-select ul li:before {
  content: "";
  display: block;
  position: relative;
  left: 0;
  top: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.3);
  z-index: 9;
  width: 100%;
  opacity: 0;
  -webkit-transition-property: opacity;
  -webkit-transition-duration: 1s;
  -webkit-transition-delay: 0s;
  transition-property: opacity;
  transition-duration: 1s;
  transition-delay: 0s;
  padding-top: 100%;
  display: block;
}

.upp_selected_packimage:hover:before {
  opacity: 1;
  cursor: pointer;
  z-index: 100;
  background-image: url(../img/minus-icon.png);
  background-position: center 45%;
  background-repeat: no-repeat;
}

.aup-pro-box ul li {
  display: inline-block;
  vertical-align: top;
  width: 48%;
  background: white;
  position: relative;
  overflow: hidden;
  line-height: 0;
  margin: 2px 0px;
  box-sizing: border-box;
  text-align: center;
}

/*---------- Added ---------*/
.aup-pro-box ul li {
  position: relative;
}

.aup-pro-box ul li:before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.3);
  z-index: 1;
  width: 100%;
  opacity: 0;
  transition-property: opacity;
  transition-duration: 1s;
  transition-delay: 0s;
  pointer-events: none;
}

.aup-pro-box ul li:hover:before {
  opacity: 1;
}

.aup-pro-info h3 a {
  position: relative;
  z-index: 2;
}

.aup-pro-box ul li:hover .aup-pro-info h3 a {
  color: brown;
}
/*----------------------------*/

/*.aup-pro-box ul li:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    background: rgba(0,0,0,0.3);
    z-index: 9;
    width: 100%;
    opacity: 0;
    -webkit-transition-property: opacity;
    -webkit-transition-duration: 1s;
    -webkit-transition-delay: 0s;
    transition-property: opacity;
    transition-duration: 1s;
    transition-delay: 0s;
}*/

.aup-pro-box ul li span.add_prod_box {
  opacity: 0;
  z-index: 100;
  width: 50px;
  height: 50px;
  position: absolute;
  left: 0;
  right: 0;
  top: 15%;
  bottom: 0;
  cursor: pointer;
  background-image: url(../img/plus-icon.png);
  background-position: center 30%;
  background-repeat: no-repeat;
  margin: 0 auto;
}

.aup-pro-box ul li:hover:before {
  opacity: 1;
  cursor: pointer;
  z-index: 100;
  background-image: url(../img/plus-icon.png);
  background-position: center 15%;
  background-repeat: no-repeat;
}

.aup-pro-qty {
  opacity: 0;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 90px;
  height: 30px;
  transform: translate(-50%, 0%);
  z-index: 9999;
}

.aup-pro-box ul li:hover .aup-pro-qty {
  opacity: 1;
}

.aup-pro-qty .btn-number {
  width: 25px;
  height: 30px;
  text-align: center;
  border: 0;
  background: black;
  color: white;
  font-size: 14px;
  line-height: 24px;
  font-weight: 600;
  cursor: pointer;
}

.aup-pro-qty .btn-number:hover,
.aup-pro-qty .btn-number:active,
.aup-pro-qty .btn-number:focus {
  background: #bf935c;
}

.aup-pro-qty .input-number {
  border: 0;
  text-align: center;
  height: 30px;
}

.aup-pro-info {
  background: white;
  text-align: center;
  width: 100%;
  box-sizing: border-box;
  padding: 5px 0px;
  height: 65px;
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.aup-pro-info h3 a {
  font-size: 14px;
  line-height: 24px;
  color: black;
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.aup-pro-info h3 a {
  color: #bf935c;
}

.aup-pro-price {
  font-size: 16px;
  line-height: 20px;
  color: black;
  font-weight: 600;
}

.aup-pro-box ul li:hover .aup-pro-info {
  color: white;
  z-index: 99999;
}

.aup-total-box,
.aup-cart-box {
  box-sizing: border-box;
  padding: 35px 20px;
  background-color: white;
  display: block;
  width: 97%;
  box-shadow: 2px 2px 8px 0 rgb(0 0 0 / 20%);
  margin: 15px 0px;
  border-radius: 0;
  border: 1px solid rgba(0, 0, 0, 0.125);
}

.aup-total-box span {
  font-size: 18px;
  line-height: 28px;
}

.aup-total-box span strong {
  font-size: 14px;
  line-height: 24px;
}

.aup-total-box button,
.aup-cart-box button {
  float: right;
  display: inline-block;
  width: 100%;
  max-width: 150px;
  text-align: center;
  border: 0;
  color: white;
  vertical-align: middle;
  border-radius: 0;
  font-size: 16px;
  line-height: 26px;
  font-weight: 600;
}

.aup-cart-box input {
  width: 100%;
}

.aup-pro-box-aftr-select ul li img {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  bottom: 0;
}

/* custom added for cart design issue */
.product-line-grid:has(> .upp_cart_pack) {
  flex-wrap: wrap;
}
.upp_cart_pack {
  position: static !important;
  float: none !important;
  flex: 0 0 100% !important;
  grid-column: 1 / -1;
  width: 100% !important;
  max-width: 100% !important;
  clear: both;
  order: 99;
  margin-top: 10px;
}

@media all and (min-width: 992px) {
  .upp_cart_pack {
    flex: 0 0 50% !important;
    width: 50% !important;
    max-width: 50% !important;
  }
}
.upp_cart_pack table {
  width: 100%;
}
.upp_cart_pack .upp-carttd {
  white-space: normal;
}

@media all and (max-width: 480px) {
  .aup-pro-box ul li,
  .aup-pro-box-aftr-select ul li {
    display: block;
    width: 100%;
    height: 100%;
    margin-bottom: 10px;
  }

  .aup-pro-fig img {
    width: 100%;
  }
}
