.master-container {
    display: grid;
    grid-template-columns: auto;
    gap: 5px;

  }
  
  .card {
    background: #FFFFFF;
    box-shadow: 0px 187px 75px rgba(0, 0, 0, 0.01), 0px 105px 63px rgba(0, 0, 0, 0.05), 0px 47px 47px rgba(0, 0, 0, 0.09), 0px 12px 26px rgba(0, 0, 0, 0.1), 0px 0px 0px rgba(0, 0, 0, 0.1);
  }
  
  .title {
    width: 100%;
    height: 40px;
    position: relative;
    display: flex;
    align-items: center;
    padding-left: 20px;
    border-bottom: 1px solid #efeff3;
    font-weight: 700;
    font-size: 11px;
    color: #63656b;
  }
  
  /* cart */
  .cart {
    border-radius: 19px 19px 7px 7px;
  }
  
  .cart .products {
    display: flex;
    flex-direction: column;
    padding: 10px;
  }
  
  .cart .products .product {
    display: grid;
    grid-template-columns: 60px 1fr 80px 1fr;
    gap: 10px;
  }
  
  .cart .products .product span {
    font-size: 13px;
    font-weight: 600;
    color: #47484b;
    margin-bottom: 8px;
    display: block;
  }
  
  .cart .products .product p {
    font-size: 11px;
    font-weight: 600;
    color: #7a7c81;
  }
  
  .cart .quantity {
    height: 30px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    margin: auto;
    background-color: #ffffff;
    border: 1px solid #e5e5e5;
    border-radius: 7px;
    filter: drop-shadow(0px 1px 0px #efefef)
      drop-shadow(0px 1px 0.5px rgba(239, 239, 239, 0.5));
  }
  
  .cart .quantity label {
    width: 20px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 2px;
    font-size: 15px;
    font-weight: 700;
    color: #47484b;
  }
  
  .cart .quantity button {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    outline: none;
    background-color: transparent;
    padding-bottom: 2px;
  }
  
  .card .small {
    font-size: 15px;
    margin: 0 0 auto auto;
  }
  
  .card .small sup {
    font-size: px;
  }
  
  /* coupons */
  .coupons {
    border-radius: 7px;
  }
  
  .coupons form {
    display: grid;
    grid-template-columns: 1fr 80px;
    gap: 10px;
    padding: 10px;
  }
  
  .input_field {
    width: auto;
    height: 36px;
    padding: 0 0 0 12px;
    border-radius: 5px;
    outline: none;
    border: 1px solid #e5e5e5;
    filter: drop-shadow(0px 1px 0px #efefef)
      drop-shadow(0px 1px 0.5px rgba(239, 239, 239, 0.5));
    transition: all 0.3s cubic-bezier(0.15, 0.83, 0.66, 1);
  }
  
  .input_field:focus {
    border: 1px solid transparent;
    box-shadow: 0px 0px 0px 2px #242424;
    background-color: transparent;
  }
  
  .coupons form button {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 10px 18px;
    gap: 10px;
    width: 100%;
    height: 36px;
    background: linear-gradient(180deg, #e89c78 0%, #e8723b 50%, #DB5C23 100%);
    box-shadow: 0px 0.5px 0.5px #EFEFEF, 0px 1px 0.5px rgba(239, 239, 239, 0.5);
    border-radius: 5px;
    border: 0;
    font-style: normal;
    font-weight: 600;
    font-size: 12px;
    line-height: 15px;
    color: #ffffff;
  }
  
  /* Checkout */
  .cart_checkout {
    border-radius: 9px 9px 19px 19px;
  }
  
  .cart_checkout .details {
    display: grid;
    grid-template-columns: 3fr 1fr;
    padding: 10px;
    gap: 5px;
  }
  
  .cart_checkout .details span {
    font-size: 13px;
    font-weight: 600;
  }
  
  .cart_checkout .details span:nth-child(odd) {
    font-size: 11px;
    font-weight: 700;
    color: #707175;
    margin: auto auto auto 0;
  }
  
  .cart_checkout .details span:nth-child(even) {
    font-size: 13px;
    font-weight: 600;
    color: #47484b;
    margin: auto 0 auto auto;
  }
  
  .cart_checkout .cart_checkout--footer {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 10px 10px 20px;
    background-color: #efeff3;
  }
  
  .price {
    position: relative;
    font-size: 22px;
    color: #2B2B2F;
    font-weight: 900;
  }
  
  .price sup {
    font-size: 13px;
  }
  
  .price sub {
    width: fit-content;
    position: absolute;
    font-size: 11px;
    color: #5F5D6B;
    bottom: 5px;
    display: inline-block;
  }
  
  .cart_checkout .cart_checkout-btn {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    height: 36px;
    background: linear-gradient(180deg, #e89c78 0%, #e8723b 50%, #DB5C23 100%);
    box-shadow: 0px 0.5px 0.5px #EFEFEF, 0px 1px 0.5px rgba(239, 239, 239, 0.5);
    border-radius: 7px;
    border: 0;
    outline: none;
    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
    transition: all 0.3s cubic-bezier(0.15, 0.83, 0.66, 1);
  }

.button_type {
  --hover-shadows: 5px 5px 13px #121212cd,
                    -5px -5px 13px #303030cc;
  --accent: #ddab07;
  font-weight: bold;
  letter-spacing: 0.1em;
  border: none;
  border-radius: 1.1em;
  background:linear-gradient(180deg, #e89c78 0%, #e8723b 50%, #DB5C23 100%);
  color: white;
  padding: 1em 2em;
  transition: box-shadow ease-in-out 0.3s,
              background-color ease-in-out 0.1s,
              letter-spacing ease-in-out 0.1s,
              transform ease-in-out 0.1s;
 
 }
 
.button_type:hover {
  box-shadow: var(--hover-shadows);
  
 }
.button_type:active {
  box-shadow: var(--hover-shadows),
               var(--accent) 0px 0px 15px 2px;
  
  background-color: var(--accent);
  transform: scale(0.95);
 }
.button_type_active {
  background:linear-gradient(180deg, #efd98f 0%, #d7ae26 50%, #ddab07 100%);
  box-shadow:var(--hover-shadows),
               var(--accent) 0px 0px 15px 2px;
  background-color: var(--accent);
  transform: scale(0.95);
  color:black;
 }
 .input_search:not(:placeholder-shown) {
  background-color: #fff;
  border: 1px solid rgb(98, 0, 255);
  width: 208px;
  cursor: none;
  padding: 18px 16px 18px 40px;
}
 .input_search:hover + .icon_search {
  transform: rotate(360deg);
  transition: .2s ease-in-out;
}

.input_search:focus + .icon_search ,.input_search:not(:placeholder-shown) + .icon_search {
  z-index: 10;
  background-color: transparent;
  border: none;
}

.input_search:focus + .icon_search + .search,.input_search:not(:placeholder-shown) + .icon_search + .search{
  z-index: 10;
  background-color: transparent;
  border: none;
}

.custom-dropdown {
  display: inline-block;
  cursor: pointer;
  background: linear-gradient(180deg, #e89c78 0%, #e8723b 50%, #DB5C23 100%);
  color: white;

}

.dropdown-content {
  color: white;
  display: none;
  position: absolute;
  background: linear-gradient(180deg, #e89c78 0%, #e8723b 50%, #DB5C23 100%);
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 50;
  border-radius: 0.75rem
}

.custom-dropdown:hover .dropdown-content {
  display: block;

}
.custom-dropdown:hover {
  display: block;
  transition: opacity 0.3s ease-in-out; 

}

.custom-dropdown:hover::before {
  opacity: 1;
}

.dropdown-option {
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  cursor: pointer;
  border-radius: 0.75rem

}

.dropdown-option:hover {
  background-color:  rgb(249 115 22  / var(--tw-bg-opacity));
  color: #000000
}
