#flDebugTemplatePanel-content {
  overflow: scroll;
}
body {
  margin: 0;
  background-color: var(--backgroundColor);
}
/* *::first-letter {
  text-transform: uppercase;
} */
* {
  font-family: "Domine", serif;
  box-sizing: border-box;
  color: var(--text-color);
}
::-webkit-scrollbar {
  width: 10px;
}
/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px #242424;
  border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #242424;
  border-radius: 10px;
}
#flDebuggPanel-content {
  overflow: auto;
}
a {
  text-decoration: none !important;
  color: inherit;
}
a:hover {
  text-decoration: none !important;
  color: inherit !important;
}
.maxWidth {
  max-width: 1440px;
  margin: 0 auto;
}
.containerr {
  overflow: hidden;
}
/*------------------------------------- header -----------------------------------*/
header {
  position: sticky;
  top: 0;
  z-index: 99999;
}
/* lang style */
.lang-menu {
  text-align: right;
  font-weight: bold;
  position: relative;
  background-color: var(--background-IconHeader);
  display: flex;
  place-items: center;
}
#language {
  color: var(--color-Header);
  height: 48px;
  width: 48px;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
}
/* #language::-ms-expand {
  display: none;
} */
.lang-menu .selected-lang {
  display: flex;
  justify-content: left;
  line-height: 2;
  cursor: pointer;
  font-weight: 600;
  font-size: 14px;
}

.lang-menu ul {
  position: absolute;
  top: -11px;
  left: 70px;
  transform: translate3d(-50%, 40px, 0) !important;
  width: 140px;
  background: #fff;
  padding: 10px;
  z-index: 151;
  max-height: 250px;
  overflow-y: auto;
  display: none;
}

.lang-menu ul li {
  list-style: none;
  text-align: left;
  display: flex;
  justify-content: space-between;
}

.lang-menu ul li a {
  text-decoration: none;
  width: 125px;
  display: block;
  color: #777;
  font-weight: 500;
  cursor: pointer;
}

.lang-menu ul li:hover {
  background-color: #f2f2f2;
}

.lang-menu:hover ul {
  display: block;
}
.translate_direction {
  direction: rtl;
  text-align: right;
}
/* end lang style */
.topBanner {
  background-color: transparent;
  color: white;
  padding: 20px 50px;
  display: flex;
  justify-content: center;
}

.topBanner p {
  margin: 0;
  letter-spacing: 2px;
  color: var(--color-TopHeader);
  font-size: 15px;
  text-align: center;
  font-family: sagona;
  font-weight: 800;
}

.topBanner .mr-2 {
  margin-right: 5px;
}

.firstDiv {
  min-width: 180px;
}
.bannerPages {
  padding: 50px 0px;
  text-transform: capitalize;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 1620px;
}
.bannerPages h1 {
  letter-spacing: 1px;
  font-weight: 600;
  font-size: 35px;
  text-align: center;
  display: flex;
  font-family: sagona;
  padding: 0 10px;
}
.header {
  display: flex;
  padding: 15px 50px;
  align-items: center;
  background-color: transparent;
}
.headerNotIndex {
  position: unset;
}
/* ---------------------------preloader begining ---------------- */
.preloader.full::before {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 60px;
  height: 60px;
}

.preloader.default::before,
.preloader.full::before,
.preloader.ldbtn::before,
.preloader.bare::before {
  content: " ";
  display: block;
  border: 4px solid #d1d5db;
  border-top-color: #3b82f6;
  border-radius: 50%;
  animation: lds-dual-ring 800ms linear infinite;
}

.preloader.full {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
}

.preloader.running {
  visibility: visible;
  opacity: 1;
}

.preloader {
  visibility: hidden;
  opacity: 0;
  transition: all 0.3s ease-in-out;
}

@keyframes lds-dual-ring {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}
/*---------------------------- end preloader ----------------------*/
.logoContainer {
  width: 20%;
  min-width: 150px;
}
.logo {
  max-width: 250px;
  max-height: 55px;
  height: 55px;
  display: flex;
  justify-content: center;
  white-space: nowrap;
  overflow: hidden;
  align-items: center;
}
.logo a {
  width: 100%;
  display: contents;
}
.logo img {
  object-fit: contain;
  height: 100%;
  width: 100%;
}
.logo h1 {
  font-size: 24px;
  margin: 0;
  line-height: unset;
  color: var(--text-color);
}
.headerIcons {
  width: 40%;
}
.header ul {
  list-style-type: none;
  display: flex;
  margin: 0;
  padding: 0;
  justify-content: end;
}
.header ul li {
  list-style-type: none;
}
.mainMenu {
  width: 40%;
  display: flex;
  align-items: center;
}
.mainMenu ul {
  width: fit-content;
}
.mainMenu ul li {
  text-align: center;
  position: relative;
}

.mainMenu ul li a {
  font-size: 16px;
  letter-spacing: 1px;
  margin: 0 16px;
  color: var(--color-Header);
  position: relative;
  font-family: sagona;
  font-weight: 800;
}

.mainMenu ul li a::after {
  content: "";
  height: 1px;
  width: 0%;
  position: absolute;
  background-color: var(--color-Header);
  /* background-color: transparent; */
  left: 0;
  bottom: -7px;
  transition: 0.3s;
}

.mainMenu ul li a:hover::after {
  width: 100%;
  background-color: var(--color-Header);
}

.mainMenu ul li a:hover {
  color: var(--color-Header) !important;
}

.headerIcons ul li {
  margin: 0 7px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 5px;
}
.userIcon {
  position: relative;
}
.headerIcons ul li svg {
  fill: var(--color-Header);
  width: 28px;
}

.user_name {
  padding: 0 30px;
}
.userDivResp .user_name {
  padding: 0;
}
.headerIcons ul li #wish_num {
  margin-left: 4px;
}
.cartIcon {
  position: relative;
}
.heartIcon {
  position: relative;
}
#cart_num {
  position: absolute;
  bottom: -7px;
  right: -5px;
  height: 17px;
  width: 17px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--primiry-color);
  color: white;
  border-radius: 50px;
  font-size: 13px;
}
#wish_num {
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--primiry-color);
}
.headerIcons #wish_num {
  position: absolute;
  top: -7px;
  right: -5px;
  height: 17px;
  width: 17px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--primiry-color);
  color: white;
  border-radius: 50px;
  font-size: 13px;
}
.sideCartWrapper {
  position: fixed;
  inset: 0;
  z-index: 98;
  background-color: rgba(0, 0, 0, 0.7);
  visibility: hidden;
}
.sideCart {
  visibility: hidden;
  z-index: 99;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  overflow: hidden;
  /* bottom: 0; */
  width: 100%;
  max-width: 1060px;
  height: 90%;
  background-color: white;
  display: flex;
  flex-direction: column;
  z-index: 98;
  left: 50%;
  border-color: transparent;
  border-radius: 12px 12px 0 0;
}

.sideCartHeader {
  display: flex;
  justify-content: center;
  background-color: rgba(43, 34, 17, 1);
  position: relative;
  padding: 5px 0;
}
.cartContentWrapper {
  height: 100%;
}
.cart_items_container {
  padding: 20px 10px;
}
.cart_containerr {
  display: grid;
  grid-template-columns: 2.5fr 1.5fr;
  flex: 1;
  height: 100%;
}
.sideCartHeader span {
  padding: 15px;
}
.sideCartHeader h3 {
  margin: 15px;
  font-weight: 300;
  font-family: Ubuntu;
  color: white;
  font-weight: 600;
  font-size: 16px;
  letter-spacing: 0.4px;
  display: flex;
  align-items: center;
}

.checkoutBtn {
  display: flex;
  justify-content: space-between;
  padding: 30px;
  align-items: end;
}
.totalBtnsWrapper {
  background-color: var(--backgroundColor);
  padding: 0 10px;
  display: flex;
  flex-direction: column;
}
.noti {
  width: 100%;
}
.noti textarea {
  background-color: #f3ebde;
  border: none;
  width: 100%;
  resize: none;
  margin-top: 10px;
  outline: none;
  border-radius: 7px;
  height: 200px;
  padding: 12px;
  font-family: Ubuntu;
  font-size: 15px;
}
.emptystate svg g path {
  fill: var(--primiry-color);
}
.emptystate svg {
  width: 90px;
}
.emptystate {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.emptystate h1 {
  margin-top: -10px;
  font-size: 26px;
  font-family: Ubuntu;
  font-weight: 600;
  letter-spacing: 0.2px;
  display: flex;
}
.cartVariant {
  color: #8f8d8d;
}
.sideCartInfo .gty {
  margin: 5px 0;
}
.cartVariant {
  margin-top: 10px;
}
.cartVariant > span {
  font-family: Ubuntu;
  font-size: 13px;
  opacity: 0.5;
  font-weight: 600;
  background-color: #ffddbc;
  padding: 7px 15px;
  border-radius: 5px;
}
#closeSideCart {
  cursor: pointer;
  padding: 0;
  position: absolute;
  right: 17px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
}
#closeSideCart i {
  color: white;
  font-size: 24px;
}

#cartNumber {
  border-left: 1px solid #dbdbdb;
}
.cartItems {
  overflow-y: auto;
  padding: 30px;
}
.carItem {
  display: flex;
  padding: 10px 5px;
  margin: 15px 0;
  border-bottom: 1px solid gainsboro;
}
.sideCartImgContainer {
  width: 88px;
  height: 88px;
  margin-inline-end: 5px;
}
.sideCartImgContainer img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sideCartInfo {
  display: flex;
  justify-content: space-between;
  flex: 1;
}
.sideCartInfo .right {
  align-items: end;
}
.sideCartInfo > div {
  display: flex;
  flex-direction: column;
}
.sideCartInfo .title a {
  font-family: Ubuntu;
  font-weight: 500;
  font-size: 15px;
  letter-spacing: 0.4px;
  opacity: 0.7;
}
.totalSideCart,
.taxSideCart {
  display: flex;
  justify-content: space-between;
  padding: 10px 15px;
  margin: 10px 0;
  background-color: #f3ebde;
  border-radius: 7px;
}
.totalSideCart > span,
.taxSideCart span {
  display: inline-block;
  text-align: center;
  font-family: Ubuntu;
  opacity: 0.5;
}
.buttonsSideCart {
  width: 100%;
  min-width: 100px;
  margin: 0 auto;
  display: flex;
  padding-bottom: 10px;
  flex: 1;
  align-items: end;
}
.buttonsSideCart span {
  display: flex;
  width: 100%;
  display: block;
  text-align: center;
  padding: 15px 0;
  cursor: pointer;
  background-color: var(--primiry-color);
  border: none;
  outline: none;
  color: white;
  border-radius: 7px;
  font-family: Ubuntu;
  height: fit-content;
}

.searchDiv {
  position: fixed;
  top: 50% !important;
  left: 50% !important;
  right: -50% !important;
  transform: translate(-50%, -50%) scale(0);
  inset: 0;
  /* visibility: hidden; */
  width: 100%;
  height: 100vh;
  z-index: 99;
  background-color: var(--primiry-color);
  justify-content: center;
  align-items: center;
  overflow: hidden;
  padding: 0 40px;
  display: flex;
  transition: 200ms ease-in-out;
}
.searchDiv form {
  display: contents;
}
.searchDiv button {
  display: contents;
}
.searchDiv button svg {
  fill: transparent;
  width: 40px;
  height: 40px;
  stroke: white;
}
.searchDiv form {
  display: contents;
}
.searchContianer {
  border-bottom: 2px solid white;
  display: flex;
  align-items: center;
}
.searchDiv input[type="text"] {
  border: none;
  width: 100%;
  max-width: 440px;
  outline: none;
  height: 60px;
  color: white;
  background-color: transparent;
  font-size: 24px;
  font-weight: 300;
}

.closeSearch {
  position: absolute;
  top: 20px;
  right: 20px;
  cursor: pointer;
}
.closeSearch i {
  color: white;
  font-size: 24px;
}

.userIcon {
  position: relative;
  cursor: initial;
}
#userIcon {
  cursor: pointer;
}

.userDiv {
  display: flex;
  flex-direction: column;
}
#closeUser {
  position: absolute;
  top: 10px;
  right: 20px;
  cursor: pointer;
}
.userDivNR {
  position: absolute;
  background-color: white;
  width: 300px;
  display: none;
  flex-direction: column;
  top: 40px;
  right: 0;
  box-shadow: 0 0 20px 0.4px rgba(0, 0, 0, 0.1);
  cursor: initial;
  z-index: 90;
}
.userDivNR h1 {
  color: var(--text-color);
  font-weight: 500;
  font-size: 24px;
  padding: 10px 20px;
  margin: 0;
}
.userDivNR button {
  background-color: transparent;
  color: var(--text-color);
  border: none;
  outline: none;
  width: fit-content;
  font-size: 16px;
  line-height: 18px;
  padding: 10px 20px;
  cursor: pointer;
  display: flex;
}
.userDivNR button:hover {
  color: var(--primiry-color);
}
.userDiv a button {
  padding: 15px 0;
  margin: 10px 0;
  border: none;
  outline: none;
  background-color: black;
  color: white;
  cursor: pointer;
  font-size: 16px;
  letter-spacing: 1px;
}
.userDiv a:last-child button {
  background-color: var(--seconderyButton);
}

.responsiveMenu {
  position: fixed;
  top: 0;
  left: -340px;
  height: 100vh;
  overflow-y: auto;
  overflow-x: hidden;
  /* width: 320px; */
  width: 320px !important;
  /* max-width: 0; */
  overflow-x: hidden;
  background-color: white;
  display: flex;
  flex-direction: column;
  z-index: 99;
  box-shadow: none;
  box-shadow: 4px 0 11px 1px #a8a7a7;
  transition: all 0.4s ease-in-out;
}
.menuIcon {
  cursor: pointer;
  margin-right: 10px;
}
.menuIcon span {
  text-align: left;
  display: block;
  width: 23px;
  height: 2px;
  background: var(--color-Header);
  margin-bottom: 6px;
}
.menuIcon span:nth-child(2) {
  width: 12px;
}
.menuIcon span:nth-child(3) {
  margin-bottom: 0px;
}
.menuRespButton {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50%;
  background-color: black;
  padding: 15px 0;
  cursor: pointer;
}
.menuIconWhite span {
  background: white;
}
.menuRespButton * {
  color: white;
}
.menuRespButton .menuIcon span {
  color: white;
}
.userRespButton {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50%;
  background-color: white;
  padding: 15px 0;
  cursor: pointer;
}

.responsiveMenuContent {
  flex: 1;
  position: relative;
  padding: 0 20px;
}

.closeResponsiveMenu {
  background-color: var(--primiry-color);
  padding: 25px 10px;
  color: white;
  text-align: center;
  cursor: pointer;
}
.closeResponsiveMenu * {
  color: white;
}

.responsiveMenuContent a > span {
  font-size: 15px;
  text-transform: capitalize;
  line-height: 18px;
  position: relative;
  display: inline-block;
  padding: 20px 0;
  color: var(--text-color);
  border-bottom: 1px solid #e3e3e3;
  width: 100%;
  font-weight: 500;
}

.responsiveMenuContent a {
  width: 100%;
}

.menuItemResp {
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  position: relative;
  padding-bottom: 20px;
}

.responsiveMenu h1 {
  font-size: 20px;
  color: black;
  font-weight: 500;
}
.wishResp {
  display: flex !important;
  align-items: center;
}
.wishResp span:first-child {
  margin-right: 4px;
}
.wishResp span {
  display: flex;
  width: fit-content;
}
.responsoveIcons {
  display: none;
}

.menuIconHeader {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: fit-content;
}
/*----------------------------------- end header -----------------------------------*/

/*------------------------------------- carousel -----------------------------------*/
.carouselContainer {
  height: 100vh;
  overflow: hidden;
}
.carouselItems,
.carouselItems2 {
  width: 100%;
  height: 100%;
  position: relative;
  /* white-space: nowrap; */
}
.slick-list {
  height: 100%;
}
.slick-track {
  height: 100%;
}

.carouselContent {
  z-index: 3;
  display: flex;
  flex-direction: column;
  position: absolute;
  width: fit-content;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  max-width: 1200px;
  width: 100%;
  padding-left: 40px;
}
.carouselContent > * {
  margin: 25px 0;
}
.carouselContent p {
  margin-top: -14px;
  font-weight: 500;
  font-size: 24px;
  font-family: Montserrat;
  max-width: 500px;
  color: #2b1a1a;
  text-align: start;
}
.carouselContent button {
  background-color: var(--button-CollectionBackground);
  border: none;
  color: var(--button-CollectionColor);
  outline: none;
  padding: 25px 35px;
  font-size: 17px;
  cursor: pointer;
  border-radius: 7px;
  width: fit-content;
  text-transform: uppercase;
  font-weight: 600;
  font-family: Montserrat;
  letter-spacing: 1px;
}

.carouselContent button i {
  color: white;
}

.carouselContent span {
  font-family: sagona;
  font-size: var(--title-CollectionSize);
  color: var(--title-CollectionColor);
  max-width: 500px;
  font-weight: 600;
  text-align: start;
}

.carouselItem {
  width: 100%;
  position: relative;
  height: 100%;
  display: flex;
  justify-content: start;
  align-items: center;
}
.carouselItem img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.slick-arrow {
  position: absolute;
  z-index: 20;
  top: 50%;
  bottom: 20px;
  top: unset;
  height: 40px;
  width: 40px !important;
  background-color: white;
  /* opacity: 0.5; */
}

/* .slick-arrow:hover {
    background-color: black !important;
    background: black !important;
    opacity: 1;
  } */

.slick-prev {
  width: auto;
  right: 61px;
  left: unset;
}
.slick-prev::before {
  color: var(--primiry-color);
  font-size: 55px;
}
.slick-next::before {
  color: var(--primiry-color);
  font-size: 55px;
}
.slick-next {
  right: 20px;
  width: auto;
}

.slick-prev:before,
.slick-next:before {
  font-family: "slick";
  font-size: 40px !important;
  line-height: 0 !important;
  color: var(--primiry-color) !important;
  opacity: 0.75;
  -moz-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.slick-prev:before {
  content: "‹" !important;
}
[dir="rtl"] .slick-prev:before {
  content: "›" !important;
  padding: 10px !important;
}
[dir="rtl"] .slick-next {
  top: 70px !important;
  padding: 10px !important;
}
.slick-next:before {
  content: "›" !important;
}
[dir="rtl"] .slick-next:before {
  content: "‹" !important;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
  background: white;
}
/*----------------------------------- end carousel -----------------------------------*/
/*--------------------------------- store description --------------------------------*/
.storeDescription {
  text-align: center;
  margin-top: 70px;
  margin-bottom: 50px;
}
.storeDescription h1 {
  font-family: "Cormorant Garamond", serif;
  font-weight: 700;
  font-size: 45px;
  padding: 0 10px;
}
.storeDescription p {
  text-align: center;
  margin: 0 auto;
  padding: 0 10px;
}
/*------------------------------- end store description ------------------------------*/
/*------------------------------------- adventage ------------------------------------*/
.adventageWrapper {
  padding: 75px 0;
}
.adventageContainer {
  padding: 20px 0;
  display: flex;
  max-width: 1440px;
  margin: auto;
  margin-top: 30px;
  justify-content: center;
  gap: 75px;
}
.addventageHeader h1 {
  text-align: center;
  font-family: sagona;
  letter-spacing: 0.5px;
  margin: 0;
  color: var(--title-PromotionColor);
}
.adventageItem {
  position: relative;
  display: flex;
  flex-direction: column;
  border-radius: 8px;
  align-items: center;
  justify-content: center;
}
.adventageLogo span img {
  width: 100%;
  height: 100%;
}
.adventageLogo {
  display: flex;
  justify-content: center;
  border-radius: 50%;
  display: flex;
  margin-bottom: 15px;
}
.adventageLogo span {
  display: flex;
  width: 96px;
  height: 96px;
}
.adventageContent {
  text-align: center;
  max-width: 250px;
}
.adventageContent h3 {
  color: var(--text-PromotionColor);
  font-size: 22px;
  margin-top: 0;
  text-align: center;
  display: flex;
  margin-bottom: 0;
  justify-content: center;
  width: 100%;
  font-family: Montserrat;
  font-weight: 600;
}
/*----------------------------------- end adventage ------------------------------------*/

/*------------------------------------- categories -------------------------------------*/
.categorieIndex {
  margin-top: 120px;
}
.categorieWrapper {
  background-color: var(--color-CategorieBackground);
  padding: 100px 0;
  padding-top: 3px;
}
.categoriesContainer {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.categorieItem {
  width: 50%;
  max-width: 655px;
  padding: 30px 13px;
  margin-bottom: 20px;
  position: relative;
}

.seeAllCat {
  margin: 0 auto;
  display: flex;
  color: white;
  background-color: var(--primiry-color);
  padding: 10px 15px;
  margin-bottom: 30px;
  width: 245px;
  justify-content: center;
}
.seeAllCat:hover {
  color: white !important;
}
.catImg {
  width: 100%;
  height: 400px;
  position: relative;
}
.catImg img {
  width: 100%;
  height: 100%;
  transition: 0.5s;
  border-radius: 30px;
  object-fit: cover;
  object-position: center;
}

/* .catImg:hover img{
    transform: scale(1.05);
} */

.catContent {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: fit-content;
  border-radius: 0 12px 12px 0;
  padding: 25px 0px;
  padding-left: 30px;
  padding-right: 50px;
}
.catContentDiv {
  position: absolute;
  inset: 0;
  background-color: var(--contentCategorieColor);
  border-radius: 0 12px 12px 0;
  opacity: 0.9;
}
.catContent p {
  color: var(--title-CategorieColor);
  max-width: 280px;
  line-height: 40px;
  font-weight: 600;
  font-size: var(--title-CategorieSize);
  margin: 0;
  margin-bottom: 10px;
  padding-right: 10px;
  position: relative;
}
.catContent button {
  background-color: var(--button-CategorieBackground);
  font-size: 15px;
  border: none;
  border-radius: 3px;
  position: relative;
  color: var(--contentCategorieColor);
  cursor: pointer;
  display: flex;
  padding: 18px 30px;
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
  text-transform: uppercase;
}

/*----------------------------------- end categories -------------------------------------*/
/*------------------------------------- banner Box ---------------------------------------*/
.bannerBoxWrapper {
  position: relative;
}
.bannerBoxContainer {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  height: 100vh;
  display: flex;
  align-items: center;
  z-index: 5;
  position: relative;
  width: 100%;
}
.bannerBoxContainer::before {
  position: absolute;
  content: "";
  inset: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.3);
}

.backgroundDiv {
  background-color: var(--background-BannerColorTop);
  display: flex;
  justify-content: center;
}
.backgroundDiv span {
  padding: 15px 0;
  font-size: 23px;
  font-weight: 600;
  text-align: center;
  color: var(--text-color);
  font-family: sagona;
}
.bannerBoxInfo {
  padding: 60px 50px;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: start;
  z-index: 99999;
}

.bannerBoxInfo > * {
  text-align: center;
}

.bannerBoxInfo p {
  max-width: 100%;
  color: var(--button-BannerColor);
  font-size: var(--text-BannerSize);
  font-weight: 700;
  font-family: sagona;
  text-align: start;
}
.bannerBoxInfo button {
  border: 0;
  outline: none;
  color: var(--button-BannerColor);
  text-transform: uppercase;
  background-color: var(--button-BannerBackground);
  transition: all 0.3s ease;
  cursor: pointer;
  position: relative;
  display: flex;
  font-weight: 600;
  font-family: "Montserrat";
  padding: 17px 35px;
  border-radius: 7px;
  font-size: 20px;
  letter-spacing: 1px;
}

/*----------------------------------- end banner Box -------------------------------------*/

/*------------------------------------- products -----------------------------------------*/
.prodIndexWrapper {
  padding: 100px 0;
  background-color: white;
}
.productContainer {
  flex-direction: column;
  display: flex;
  padding: 0 15px;
}
.produtWrapper {
  display: flex;
  gap: 50px;
  margin-bottom: 15px;
}
.productItemsWrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.prodItemContainer {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.relatedProdWrapper {
  width: 100% !important;
}
.relatedProdHeader {
  width: 100%;
}
.relatedProdHeader h1 {
  font-family: sagona;
  font-size: 28px;
}
.prodCont {
  padding: 0 24px;
  max-width: 1260px;
  margin: 0 auto;
}
.prodHeader {
  width: 100%;
  margin: 20px 0;
}
.filterBUttonDiv {
  width: 100%;
  display: flex;
  justify-content: end;
  margin-bottom: 20px;
  display: none;
}
.filterBUttonDiv span {
  font-family: Ubuntu;
  margin-left: 10px;
  font-size: 15px;
}
.filterBUttonDiv button {
  background-color: transparent;
  border: 1px solid var(--text-color);
  display: flex;
  align-items: center;
  cursor: pointer;
  color: var(--text-color);
  padding: 5px 11px;
  border-radius: 7px;
}
.prodHeader h1 {
  width: fit-content;
  display: flex;
  margin: 0 auto;
  font-size: var(--title-ProduitSize);
  letter-spacing: 1px;
  color: var(--text-ProduitColor);
  font-weight: 700;
  font-family: sagona;
}

.productItem {
  margin-bottom: 20px;
  overflow: hidden;
  position: relative;
  box-shadow: 0 6px 12px rgba(2, 2, 2, 0.04);
  border: 1px solid rgba(43, 26, 26, 0.1);
  border-radius: 16px;
  background-color: white;
}

.productItem:hover {
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.11);
}

.prodReducePrecentage {
  position: absolute;
  top: 10px;
  left: 25px;
  background-color: var(--seconderyButton);
  color: white;
  padding: 2px 10px;
  font-size: 14px;
}
.productItemImage {
  width: 100%;
  height: 300px;
  overflow: hidden;
  border-radius: 16px 16px 0 0;
  border-bottom: 1px solid #ddd;
}

.productItemImage img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.productItemInfo {
  margin-top: 10px;
  text-align: start;
  padding: 0 10px;
}
.prodCatt {
  display: block;
  font-size: 14px;
  color: #555;
  margin: 10px 0;
  text-align: start;
}
.prodCatt span {
  font-family: "Montserrat", sans-serif;
}
.prodCattName {
  color: var(--primiry-color);
  margin-left: 4px;
  border-bottom: 0.4px solid;
}
.prodItemTitle {
  width: 100%;
  display: block;
  text-align: start;
}
.prodItemTitle:hover span {
  border-bottom: 1px solid;
}
.prodItemTitle span {
  font-size: clamp(1.3125rem, 0.7295rem + 1.2146vw, 1.4rem);
}
.prodDescription {
  padding-right: 10px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  -webkit-box-orient: vertical;
  font-family: "Ubuntu", sans-serif;
  font-size: 15px;
  line-height: 20px;
}
.productDetailsSocial {
  display: flex;
  align-items: center;
  margin: 20px;
  margin-inline-start: 30px;
  flex-wrap: wrap;
}
.productDetailsSocial h3 {
  margin: 0;
  margin-right: 10px;
  font-size: 14px;
  font-weight: 400;
  width: 100%;
  margin-bottom: 17px;
  font-family: Ubuntu;
}

.productDetailsSocial a {
  display: contents;
}

.socialMedia {
  display: flex;
}
.socialMedia span {
  border-radius: 50%;
  padding: 0 !important;
  height: 40px;
  width: 40px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  margin: 0;
}
.socialMedia span i {
  color: white;
}
.socialMedia .facebook {
  background-color: #4764a8;
  margin-right: 10px;
}
.socialMedia .twitter {
  background-color: #34a8d7;
}

.prodItemPriceContainer {
  margin-top: 10px;
  color: var(--primiry-color);
  padding-bottom: 15px;
}

.prodItemPriceContainer * {
  font-family: "Ubuntu", sans-serif;
}

.prodItemPrice > span,
.prodItemPrice {
  color: var(--primiry-color);
}

.prodItemDelPrice {
  color: #555;
  font-size: 12px;
}
.prodItemDelPrice del {
  color: #555;
}
.cartWish {
  display: flex;
  justify-content: center;
  transition: 0.5s;
  position: absolute;
  top: 18px;
  right: -60px;
  z-index: 99;
}
.productItem:hover .cartWish {
  right: 0px;
}

.cartWish div {
  width: 60px;
  height: 46px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: white;
  box-shadow: 0 15px 25px rgba(0, 0, 0, 0.08);
  border-bottom-left-radius: 25px;
  border-top-left-radius: 25px;
}
.cartWish div:hover {
  background-color: var(--primiry-color);
}
.cartWish div:hover span svg {
  fill: white;
}
.cartWish div:hover label svg {
  fill: white;
}
.cartWish div span {
  display: block;
  width: 24px;
  height: 24px;
}
.seeAllProd {
  width: 100%;
  margin: 30px auto;
  text-align: center;
}
.seeAllProd button {
  margin: 0 auto;
  margin-bottom: 0px;
  display: flex;
  color: white;
  background-color: var(--primiry-color);
  padding: 10px 15px;
  margin-bottom: 30px;
  width: 245px;
  justify-content: center;
  outline: none;
  border: none;
  font-size: 16px;
}
/*----------------------------------- end products ---------------------------------------*/
/*--------------------------------------- product ----------------------------------------*/
.filterProduct {
  display: flex;
  margin-right: 15px;
  width: 100%;
  max-width: 300px;
}
.productItems {
  display: flex;
  flex-wrap: wrap;
  flex: 1;
  justify-content: center;
}
.filterProduct button {
  background-color: transparent;
  outline: none;
  border: 1px solid #000;
  padding: 8px 20px;
  align-items: center;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.filterProduct button span {
  font-size: 16px;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 2px;
  margin-left: 8px;
}

.filterProductDiv {
  width: 100%;
  max-width: 275px;
  overflow-x: hidden;
  padding-right: 15px;
  margin: 0 auto;
  background-color: white;
  padding: 10px;
  border-radius: 7px;
  height: fit-content;
  border: 1px solid var(--primiry-color);
}
.closeFilterWrapper {
  display: none;
  justify-content: end;
  padding: 10px;
}
.closeFilter {
  width: fit-content;
  cursor: pointer;
}
.filterProductContent {
  height: fit-content;
}
.filterProductContent > div {
  margin-bottom: 40px;
}
.filterProductContent h3 {
  font-size: 18px;
  letter-spacing: 0.2px;
  position: relative;
  display: inline-block;
  margin: 0;
  font-weight: 600;
  font-family: sagona;
}

.titleContaiiner {
  margin: 15px 0;
}
.titleContaiiner:first-child {
  margin-top: 0;
}
.radio_label {
  margin-bottom: 15px;
  display: flex;
  align-items: center;
}
.radio_label * {
  color: rgba(19, 24, 40, 0.95);
  font-size: 14px;
  font-family: Montserrat;
  letter-spacing: 0.1px;
  display: flex;
  line-height: 19px;
  font-weight: 600;
}
.radio_label input {
  margin: 0;
  margin-inline-end: 10px;
  accent-color: var(--primiry-color);
}
.filterProductContent label {
  line-height: 34px;
  display: inline-block;
  font-size: 16px;
  font-weight: 400;
  width: 250px;
}

/*------------------------------------- filter prod --------------------------------------*/
.wrapper {
  width: 100%;
}
.containerrr {
  width: 100%;
  height: 20px;
  position: relative;
}
input[type="range"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 100%;
  outline: none;
  position: absolute;
  margin: auto;
  top: 0;
  bottom: 0;
  background-color: transparent;
  pointer-events: none;
}
.slider-track {
  width: 100%;
  height: 5px;
  position: absolute;
  margin: auto;
  top: 0;
  bottom: 0;
  border-radius: 5px;
}
input[type="range"]::-moz-range-thumb {
  -webkit-appearance: none;
  height: 1em;
  width: 1em;
  cursor: col-resize;
  border-radius: 50%;
  background-color: var(--primiry-color);
  pointer-events: auto;
  outline: none;
  border: none;
}
input[type="range"]::-webkit-range-thumb {
  -webkit-appearance: none;
  height: 1em;
  width: 1em;
  cursor: pointer;
  border-radius: 50%;
  background-color: var(--primiry-color);
  pointer-events: auto;
  outline: none;
  border: none;
}
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  height: 1em;
  width: 1em;
  cursor: col-resize;
  border-radius: 50%;
  background-color: var(--primiry-color);
  pointer-events: auto;
}
input[type="range"]:active::-webkit-slider-thumb {
  background-color: #ffffff;
  border: 3px solid var(--primiry-color);
}
.values {
  display: flex;
  justify-content: center;
  margin-top: 5px;
}
.values * {
  font-family: Montserrat;
  font-size: 15px;
  letter-spacing: 0.2px;
  font-weight: 500;
}
.values > * {
  margin: 0 5px;
  display: flex;
}
/*----------------------------------- end filter prod ------------------------------------*/
.filterButton {
  margin-top: 30px;
  display: flex;
  justify-content: end;
}
.hideit {
  visibility: hidden;
}
.filterButton button {
  padding: 10px 12px;
  letter-spacing: 1px;
  color: white !important;
  font-size: 16px;
  background-color: var(--primiry-color);
  color: var(--text-color);
  border: none;
  outline: none;
  cursor: pointer;
  border-radius: 3px;
}
.pagination {
  display: flex;
  flex-wrap: wrap;
  margin: 50px 0;
  width: 100%;
  justify-content: center;
}
.paginationItem {
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 5px;
  cursor: pointer;
  border-radius: 50%;
}
.paginationItem:hover {
  background-color: var(--primiry-color);
  color: white;
}
.active {
  background-color: var(--primiry-color);
  color: white;
  cursor: unset;
  border-radius: 50px;
}

.active:hover {
  background-color: black;
  color: white;
  cursor: unset;
  border: 1px solid black;
}
/*------------------------------------- end product --------------------------------------*/

/*------------------------------------ product detail ------------------------------------*/
.prodDetailContainer {
  display: flex;
  flex-wrap: wrap;
  margin: 40px auto;
  margin-top: 40px;
  padding: 0 50px;
}
.prodDetailContainer > * {
  width: 50%;
  padding: 0 20px;
}
.prodDetailDislay {
  margin-bottom: 30px;
  display: flex;
  flex-direction: row-reverse;
}
.prodDetailBigImage {
  width: 80%;
  height: 500px;
  padding: 0 5px;
  margin-bottom: 10px;
}
.prodDetailBigImage img {
  width: 100%;
  height: 100% !important;
  object-fit: cover;
}
.prodDetailSmallImages {
  display: flex;
  overflow-y: auto;
  justify-content: start;
  flex-direction: column;
  max-height: 500px;
}
.smallImg {
  height: 117px;
  min-width: 95px;
  margin-bottom: 10px;
  max-width: 120px;
}
.smallImg:last-child {
  margin-bottom: 0px;
}
.smallImg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.prodDetailInfoHeader {
  padding-bottom: 28px;
  margin-bottom: 20px;
  /* border-bottom: 2px solid #C1BEBE; */
}
.prodDetailTitle {
  font-size: 24px;
  font-weight: 400;
  text-transform: capitalize;
  margin-bottom: 15px;
}
.prodDetailPrice {
  font-size: 20px;
  font-weight: 400;
  margin-bottom: 15px;
  color: #8f8d8d;
}
.prodDetailPrice h3,
.prodDetailPrice span {
  color: var(--primiry-color);
  font-size: 20px;
}
/* .prodDetailPrice h3 div span:first-child {
  margin-right: 10px;
}
.prodDetailPrice h3 span:first-child {
  color: var(--primiry-color);
  font-family: Ubuntu;
  font-weight: 500;
  font-size: 21px;
} */
.prodDetailStatus {
  font-size: 14px;
  letter-spacing: 0.4px;
  position: relative;
  width: fit-content;
  display: block ruby;
}
.prodDetailStatus::after {
  content: "";
  position: absolute;
  background-color: black;
  width: 100%;
  height: 2px;
  left: 0;
  bottom: -5px;
}
.prodDetailSmallDesription {
  font-size: 14px;
  line-height: 28px;
  font-weight: 400;
  position: relative;
  max-height: 170px;
  overflow-y: auto;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 2px solid #c1bebe;
  border-top: 2px solid #c1bebe;
}
.prodDetailSmallDesription p {
  margin: 0;
  font-family: Ubuntu;
}
.prodDetailSmallDesription img {
  width: 200px;
  height: 200px;
}
.prodDetailSmallDesription * {
  color: #555;
}
.prodDetailSmallDesription::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  top: -7px;
  left: 0;
  background-color: #a8a8a8;
}
.prodDetailVariants {
  margin-top: 30px;
}
.prodDetailVariants h3 {
  font-weight: 400;
  font-size: 18px;
  letter-spacing: 1px;
}
.prodDetailVariant {
  margin-bottom: 15px;
}
.prodDetailVariant span {
  margin-inline-end: 50px;
  font-size: 16px;
  min-width: 200px;
  display: inline-block;
  margin-bottom: 13px;
}
.prodDetailVariant select {
  min-width: 200px;
  background-color: white;
  outline: none;
  border: 1px solid #d5d5d5;
  padding: 12px 10px;
  border-radius: 25px;
}
.prodDetailQty {
  display: flex;
  flex-wrap: wrap;
}
.noStock {
  padding: 10px;
  margin-top: 10px;
  border: 1px solid;
  display: none;
}

.prodDetailQty > * {
  margin-top: 20px;
}

.qty_detail {
  display: flex;
  width: fit-content;
  margin-inline-end: 15px;
  background-color: #ffb5ba;
  border: 1px solid #8e1018;
  border-radius: 3px;
}
.qty_detail input {
  background-color: transparent;
  border: none;
  margin: 0 3px;
  width: 50px;
  height: 50px;
  font-size: 20px;
  font-weight: 600;
  cursor: pointer;
  font-family: Ubuntu;
}
.qty_detail input[type="number"] {
  width: 50px;
  text-align: center;
  font-size: 20px;
  font-weight: 500;
  cursor: text;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}
.stockleft {
  margin-inline-end: 20px;
  font-size: 17px;
  color: var(--primiry-color);
  span {
    color: var(--primiry-color);
  }
}
.prodDetailAddCart button {
  height: 100%;
  width: 200px;
  border: none;
  background-color: var(--primiry-color);
  outline: none;
  color: white;
  letter-spacing: 1px;
  cursor: pointer;
  min-height: 52px;
  border-radius: 3px;
}
.btn_add_cart:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.prodCat {
  margin-bottom: 10px;
  font-size: 13px;
  color: #555;
  font-family: Ubuntu;
}
.prodTags {
  margin: 10px 0;
  font-size: 16px;
  color: #555;
}
.prodTags span {
  padding: 4px 7px;
  margin: 0 5px;
  color: #555;
}
/*---------------------------------- end product detail ----------------------------------*/
/*----------------------------------------- cart -----------------------------------------*/

.cardContainer .title {
  margin-bottom: 5vh;
}

.cardContainer {
  margin: 50px auto;
  max-width: 1200px;
  width: 90%;
  border-radius: 1rem;
  border: transparent;
  margin-top: 120px;
}

@media (max-width: 767px) {
  .sideCart {
    height: 100%;
    border-radius: 0;
  }
  .totalBtnsWrapper {
    padding: 30px;
  }
  .cart_containerr {
    grid-template-columns: 1fr;
  }
  .cartItems {
    overflow-y: unset;
    height: fit-content;
  }
  .cartContentWrapper {
    overflow-y: auto;
  }
  .cardContainer {
    margin: 3vh auto;
  }
  .checkoutBtn {
    flex-direction: column;
    justify-content: center;
    text-align: center;
    align-items: center;
  }
  .noti {
    margin-bottom: 20px;
  }
  .buttonsSideCart {
    margin-top: 10px;
  }
  .sideCartInfo .title {
    max-width: 350px;
  }
  .sideCartInfo .cartVariant {
    max-width: 350px;
  }
}

.cardContainer .summary .col-2 {
  padding: 0;
}

.cardContainer .summary .col-10 {
  padding: 0;
}

.cardContainer .row {
  margin: 0;
}

.cardContainer .title b {
  font-size: 1.5rem;
}

.cardContainer .main {
  margin: 0;
  padding: 2vh 0;
  width: 100%;
}

.col-2,
.col {
  padding: 0 1vh;
}

.cardContainer a {
  padding: 0 1vh;
}

.cardContainer .close {
  font-size: 20px;
  float: inherit;
  color: #555;
}
.cardContainer .close i {
  color: #555;
}
.cardContainer .close i:hover {
  color: var(--primiry-color);
}

.cardContainer img {
  width: 3.5rem;
}

.cardContainer .back-to-shop {
  margin-top: 4.5rem;
}

.cardContainer h5 {
  margin-top: 4vh;
}

.cardContainer hr {
  margin-top: 1.25rem;
}

.cardContainer form {
  padding: 2vh 0;
}

.cardContainer select {
  border: 1px solid rgba(0, 0, 0, 0.137);
  padding: 1.5vh 1vh;
  margin-bottom: 4vh;
  outline: none;
  width: 100%;
  background-color: rgb(247, 247, 247);
}

.cardContainer input {
  border: 1px solid rgba(0, 0, 0, 0.137);
  padding: 1vh;
  outline: none;
  width: 100%;
  background-color: rgb(247, 247, 247);
}
table {
  overflow-x: auto;
}

.cardContainer input:focus::-webkit-input-placeholder {
  color: transparent;
}

.cardContainer .btn {
  background-color: var(--primiry-color);
  border-color: var(--primiry-color);
  color: white;
  font-size: 0.7rem;
  margin-top: 2vh;
  padding: 11px 60px;
  border-radius: 0;
  display: block;
  border-radius: 3px;
}

.cardContainer .btn:focus {
  box-shadow: none;
  outline: none;
  box-shadow: none;
  color: white;
  -webkit-box-shadow: none;
  transition: none;
}

.cardContainer .btn:hover {
  color: white;
}

.cardContainer a {
  color: black;
}

.cardContainer a:hover {
  color: black;
  text-decoration: none;
}

.cardContainer #code {
  background-image: linear-gradient(
      to left,
      rgba(255, 255, 255, 0.253),
      rgba(255, 255, 255, 0.185)
    ),
    url("https://img.icons8.com/small/16/000000/long-arrow-right.png");
  background-repeat: no-repeat;
  background-position-x: 95%;
  background-position-y: center;
}
.table td,
.table th {
  vertical-align: inherit;
}
.table td {
  padding: 30px 0.75rem;
}
.qty_cart {
  display: flex;
  width: fit-content;
  margin: 15px 0;
}
.qty_cartResp {
  display: none;
}
.Oprice {
  color: var(--primiry-color);
}
.qty_cart input {
  width: 30px;
  display: flex;
  justify-content: center;
  background-color: transparent;
  border: none;
  text-align: center;
  font-family: Ubuntu;
  font-size: 18px;
  opacity: 0.4;
  border: 1px solid;
  border-radius: 4px;
  cursor: pointer;
}
.qty_cart input[type="number"] {
  width: 45px;
  opacity: 0.6;
  border: none;
  cursor: unset;
}
.sideCartInfo .price {
  font-family: Ubuntu;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.2px;
}
.close {
  padding-left: 30px;
}
.close i {
  color: #d0d0d0;
}
.msg-to {
  width: 100%;
  margin-top: 20px;
  outline: none;
  background-color: transparent;
  height: 120px;
  border: 1px solid var(--seconderyButton);
}
.taxTotal {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  padding-top: 10px;
}
.taxeCart {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 4px;
}

/*--------------------------------------- end cart ---------------------------------------*/

/*---------------------------------------- contact ---------------------------------------*/
.contact-us {
  margin-top: 60px;
  margin-bottom: 50px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}
.contacImage {
  height: 623px;
}

.contacImage img {
  height: 100%;
}
.contactTitle {
  font-size: 30px;
  text-align: center;
  margin-bottom: 30px;
}
.contactInputContainer {
  display: flex;
  flex-direction: column;
  max-width: 500px;
  width: 100%;
  min-width: 280px;
  padding: 0 10px;
}
.contactInputContainer form > * {
  margin: 10px 0;
  /* padding: 15px; */
  border: 1px solid rgb(196, 196, 196);
}
.contactInputContainer form .iti {
  padding: 0;
}
.contactInput {
  background-color: #f5f5f5;
  padding: 15px;
  outline: none;
  border: none;
}

.ContactTextArea {
  height: 200px;
  resize: none;
}
.contactSubmit {
  background-color: var(--primiry-color);
  color: white;
  border: none !important;
  cursor: pointer;
  letter-spacing: 0.2rem;
  text-transform: uppercase;
  font-weight: 600;
  border-radius: 3px;
  font-family: Montserrat;
  padding: 15px;
}

.contactIconWrapper {
  background-color: #fab944;
}
.contactIcons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 40px 0;
}

.contact2 span a {
  font-family: "Montserrat", sans-serif !important;
  color: var(--color-Footer);
}
.contact2 span a:hover {
  color: var(--color-Footer) !important;
}
.contactIcon {
  width: 33.33%;
  padding: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  min-width: 260px;
}
.contactIcon p {
  display: flex;
  margin-bottom: 0;
  font-family: Montserrat;
  color: var(--text-color);
  font-weight: 600;
  letter-spacing: 0.5px;
  font-size: 15px;
}
.iconImgContact {
  display: flex;
  justify-content: center;
  align-items: center;
}
.iconImgContact i {
  font-size: 44px;
  color: var(--primiry-color);
}
/*-------------------------------------- end contact -------------------------------------*/
/*---------------------------------------- faqs ------------------------------------------*/
.faqsContainer {
  padding-inline-start: 30px;
}
.sec-title h3 {
  position: relative;
  width: fit-content;
}
.card-title {
  font-size: 20px;
}
.sec-title h3::after {
  content: "";
  width: 100%;
  height: 1.5px;
  background-color: var(--primiry-color);
  position: absolute;
  left: 0;
  bottom: 0;
}
.btn-link {
  background-color: #f5f5f5;
  border: none;
  outline: none;
  font-weight: 600;
  font-size: 16px;
  padding: 7px 0;
  text-align: center;
}
/*-------------------------------------- endfaqs ----------------------------------------*/
/*-------------------------------------- wishlist ---------------------------------------*/
.wishContainer {
  margin-bottom: 50px;
}
.wishContainer .productItemInfo {
  padding-bottom: 20px;
}
.hide_item {
  display: none;
}
.show_item {
  display: flex !important;
}

.full_heart {
  display: none;
}
#wish_btn {
  display: none;
}

#wish_btn:checked ~ label .full_heart {
  display: block;
}
#wish_btn:checked ~ label .empty_heart {
  display: none;
}
.display_item {
  display: inline-block;
}
.big_delete_wish {
  display: flex;
  justify-content: center;
  position: absolute;
  top: 30px;
  right: 0;
  background-color: white;
  width: 60px;
  height: 46px;
  border-top-left-radius: 25px;
  border-bottom-left-radius: 25px;
  box-shadow: 0 15px 25px rgba(0, 0, 0, 0.08);
}
.big_delete_wish button {
  border: none;
  color: white;
  cursor: pointer;
  outline: none;
  display: flex;
  align-items: center;
  padding: 0;
  background-color: transparent;
}

.big_delete_wish button i {
  display: block;
  color: var(--primiry-color);
  font-size: 24px;
}
.emptyWishList {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 50px 20px;
}
.emptyWishList h1 {
  font-family: sagona;
  font-size: 28px;
  margin-top: 35px;
  display: flex;
}
/*------------------------------ end wishlist -----------------------------*/

/*-------------------------------- snackbar ------------------------*/
#snackbar {
  visibility: hidden;
  min-width: 250px;
  background-color: black;
  color: white;
  text-align: center;
  border-radius: 25px;
  padding: 16px;
  position: fixed;
  z-index: 99;
  left: 50%;
  transform: translateX(-50%);
  bottom: 30px;
}

/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
  visibility: visible;
  -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

.header_banner {
  background-color: black;
  padding: 1.2rem 0;
  font-size: 20px;
}
.header_banner p {
  color: white;
  text-align: center;
}
@-webkit-keyframes fadein {
  from {
    bottom: 0;
    opacity: 0;
  }
  to {
    bottom: 30px;
    opacity: 1;
  }
}

@keyframes fadein {
  from {
    bottom: 0;
    opacity: 0;
  }
  to {
    bottom: 30px;
    opacity: 1;
  }
}

@-webkit-keyframes fadeout {
  from {
    bottom: 30px;
    opacity: 1;
  }
  to {
    bottom: 0;
    opacity: 0;
  }
}

@keyframes fadeout {
  from {
    bottom: 30px;
    opacity: 1;
  }
  to {
    bottom: 0;
    opacity: 0;
  }
}

/*------------------------------ end snackbar ------------------------*/
/*----------------------------------- advertisement ------------------------------------*/
.advertisement {
  position: relative;
}
.advertismentCurve {
  margin-bottom: -5px;
}
.advertismentCurve path {
  background-color: var(--background-advColor);
}
.advertismentCurveCat path {
  background-color: var(--color-CategorieBackground);
}
.advertisementWrapper {
  background-color: var(--background-advColor);
}
.advertisementContent {
  width: 100%;
  display: flex;
  margin: 0 auto;
  gap: 72px;
  min-height: 560px;
}
.rightSide {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 106px 0;
}
.advertisementContent > div {
  width: 50%;
}
.advImage img {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  object-fit: cover;
}
.advImage {
  position: relative;
}
.advSvg {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 80px;
  z-index: 2;
}
.advSvg svg path {
  fill: var(--background-advColor);
}
.btnDiv {
  margin-left: 43px;
  margin-top: 45px;
  border: 1px solid var(--text-advColor);
  width: fit-content;
  color: var(--text-advColor);
  background-color: transparent;
  padding: 23px 55px;
  border-radius: 8px;
  cursor: pointer;
  transition: 0.5s;
}
.btnDiv:hover {
  background-color: var(--icon-advColor);
  border: 1px solid var(--icon-advColor);
  color: white;
}
.btnDiv a {
  font-family: Ubuntu;
  text-transform: uppercase;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.5px;
}

.iconContent h1 {
  color: var(--text-advColor);
  margin: 0;
  font-size: 20px;
  font-weight: 500;
  max-width: 550px;
}
.titleDiv h1 {
  font-size: 36px;
  color: var(--title-advColor);
  max-width: 550px;
  margin-top: 10px;
}
.iconImg svg {
  width: 30px;
  height: 31px;
}
.iconImg svg path {
  fill: var(--icon-advColor);
}
.iconItem {
  display: flex;
}
.iconImg {
  margin-inline-end: 13px;
  display: flex;
  align-items: center;
}
.iconDiv {
  display: flex;
  flex-direction: column;
  gap: 30px;
}
/*----------------------------------- end advertisement ----------------------------------*/
/*---------------------------------------- stores ----------------------------------------*/
.stroesWrapper {
  margin: 40px 0;
}
.storesContianer {
  padding: 15px;
}
.storesContianer h1 {
  font-size: 24px;
  display: flex;
  justify-content: center;
  color: var(--text-color);
  margin: 0;
  margin-bottom: 40px;
  text-align: center;
  font-family: sagona;
}
.storesItems {
  display: flex;
  align-items: center;
  justify-content: center;
}
.storeItem {
  display: flex;
  justify-content: center;
  padding: 0 50px;
}
.storeItem img {
  max-height: 125px;
  max-width: 267px;
  object-fit: cover;
  object-position: center;
}
/*-------------------------------------- end stores --------------------------------------*/
/*----------------------------------- secondary banner -----------------------------------*/
.secBannerWrapper {
  background-color: white;
  padding: 50px 0;
}
.secBannerContainer {
  display: flex;
  gap: 8%;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 15px;
}
.secBannerContainer .left img {
  max-width: 553px;
  width: 100%;
  height: auto;
  border-radius: 15px;
  max-height: 552px;
  object-fit: cover;
  object-position: center;
  min-width: 500px;
  min-height: 375px;
}
.secBannerContainer .right {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
  align-items: center;
}
.secBannerContainer .right > * {
  text-align: center;
}
.secBannerContainer .right .title {
  font-family: sagona;
  font-size: 30px;
  font-weight: 600;
  color: var(--text-color);
  margin: 0;
}
.secBannerContainer .right .subTitle {
  color: var(--text-color);
  font-family: sagona;
  font-weight: 500;
  font-size: 20px;
}
.secBannerContainer .right button {
  font-family: Montserrat;
  background-color: var(--primiry-color);
  color: white;
  border: none;
  outline: none;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.5px;
  padding: 22px 65px;
  border-radius: 5px;
  cursor: pointer;
}
.secBannerContainer .right p {
  margin: 0;
  color: var(--text-color);
  font-family: sagona;
  font-weight: 600;
}
/*--------------------------------- end secondary banner ---------------------------------*/
/*---------------------------------------- footer ----------------------------------------*/
.footer {
  background-color: transparent;
  display: flex;
  padding: 30px 15px;
  padding-bottom: 0;
  justify-content: space-between;
  max-width: 1350px;
  margin: auto;
}
.footer a span {
  color: var(--color-Footer);
}

.footer > div {
  display: flex;
  flex-direction: column;
  margin-top: 10px;
}
.support path {
  fill: var(--color-Footer) !important;
}
.support .youtubeMedia path {
  fill: unset !important;
}
.support .tiktokMedia path {
  fill: var(--background-Footer) !important;
}

.contactWrapper > div {
  display: flex;
  flex-direction: column;
  margin-top: 10px;
}

.contactWrapper {
  display: contents !important;
}

.navPageWrapper > div {
  display: flex;
  flex-direction: column;
  margin-top: 10px;
}

.navPageWrapper {
  display: contents !important;
}

.footer > div:not(.support) span {
  margin-bottom: 7px;
  font-size: 15px;
  line-height: 25px;
  font-family: Montserrat;
  font-weight: 600;
  width: fit-content;
  position: relative;
}
.footer > div:not(.support) span::after {
  content: "";
  position: absolute;
  bottom: 3px;
  left: 0;
  height: 1.2px;
  background-color: var(--color-Footer);
  width: 0%;
}
.footer > div:not(.support) span:hover::after {
  width: 100%;
}
.footer h1 {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 20px;
  color: var(--colorTitle-Footer);
}
.newsletterTitleSub h1 {
  font-size: 28px;
  color: var(--text-color);
  margin: 0;
  margin-bottom: 8px;
}
.support i {
  margin-right: 8px;
}
.sociamMedia {
  margin-top: 4px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.sociamMedia span {
  display: flex;
  margin: 0 12px;
  justify-content: center;
  align-items: center;
}
.sociamMedia span:first-child {
  margin-left: 0;
}
.youtubeMedia {
  width: 33px;
  height: 33px;
  border-radius: 50px;
  background-color: var(--color-Footer);
}
.youtubeMedia svg {
  fill: var(--background-Footer);
  width: 25px;
}
.tiktokMedia {
  width: 38px;
  fill: var(--color-Footer);
}
.sociamMedia span i {
  margin: 0;
  font-size: 16px;
}
.emailSubWrapper {
  padding: 25px 15px;
  background-color: var(--background-newsletter);
}
.newsletter {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  max-width: 1320px;
  margin: 0 auto;
}
.newsletter p {
  margin-top: 0px;
  color: var(--text-color);
  font-family: Montserrat;
  font-size: 18px;
  letter-spacing: 0.3px;
}
.inputSubmit {
  display: flex;
  align-items: center;
  gap: 10px;
}
.inputSubmit form > * {
  height: 56px;
  padding: 0;
}
.inputSubmit input {
  outline: none;
  border: none;
  padding-inline-start: 10px;
  background-color: white;
  width: 70%;
  border-radius: 10px;
  font-family: Montserrat;
  font-size: 16px;
}
.inputSubmit button {
  outline: none;
  cursor: pointer;
  font-size: 14px;
  background-color: var(--button-EmailSubBackground);
  border: none;
  color: var(--button-EmailSubColor);
  border-radius: 10px;
  width: 20%;
  font-size: 15px;
  font-family: Montserrat;
  font-weight: 700;
}
.inputSubmit button i {
  color: var(--button-EmailSubColor);
  font-size: 24px;
}

.bottomFooter {
  width: 100% !important;
  display: flex !important;
  flex-direction: row !important;
  position: relative;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 20px 15px !important;
  background-color: transparent;
  align-items: center !important;
  max-width: 1350px;

  padding-top: 15px !important;
}
.bottomFooterWrapper {
  border-top: 1px solid #d1911f;
  margin-top: 25px !important;
}
.bottomFooter * {
  font-family: "Montserrat", sans-serif;
  font-weight: 500;
  font-size: 14px;
  color: var(--color-Footer);
}
.bottomFooter > div {
  width: 33.33333333%;
  padding: 0 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 600;
}

.footerLogo {
  justify-content: flex-start !important;
}

.footerLogo {
  display: flex;
  padding-left: 0 !important;
  min-width: 135px !important;
  align-items: center;
}
.footerLogo h1 {
  margin: 0;
}
.footerLogo img {
  width: 115px;
  height: 46px;
  object-fit: contain;
  object-position: left;
}
.payment {
  display: flex !important;
  justify-content: center;
  flex-wrap: wrap;
  min-width: 200px;
}
.payment span {
  margin: 0 15px;
}
.payment span i {
  font-size: 30px;
  color: var(--text-color);
}

.copyRight {
  padding-inline-end: 0 !important;
  /* display: inline-block !important; */
  /* text-align: end; */
  display: flex;
  gap: 10px;
  height: fit-content;
}

.copyRight img {
  margin-left: 3px;
  vertical-align: text-bottom;
}

/*-------------------------------------- end footer --------------------------------------*/

/*---------------------------------------- medias ----------------------------------*/

@media only screen and (max-width: 1062px) {
  .closeFilterWrapper {
    display: flex;
  }
  .secBannerContainer .left img {
    min-width: unset;
  }
  .secBannerContainer {
    flex-direction: column;
  }
  .secBannerContainer .right {
    margin-top: 20px;
  }
  .secBannerContainer .left {
    text-align: center;
  }
  .productItemImage {
    height: 250px;
  }
  .storeItem {
    flex: 1 50%;
    margin-bottom: 50px;
  }
  .storesItems {
    flex-wrap: wrap;
  }
  .produtWrapper {
    gap: unset;
  }
  .smallImg {
    width: 117px;
    margin: 0 2px;
  }
  .smallImg:last-child {
    margin-right: 0;
  }

  .smallImg:first-child {
    margin-left: 0;
  }

  .prodDetailBigImage {
    padding: 0;
    flex: unset;
  }
  .prodDetailSmallImages {
    flex-direction: row;
    overflow-x: auto;
    overflow-y: hidden;
  }
  .prodDetailDislay {
    flex-direction: column;
  }
  .filterBUttonDiv {
    display: flex;
  }
  .filterProductDiv {
    position: fixed;
    z-index: 99999;
    background-color: white;
    left: 0;
    /* top: 0; */
    bottom: 0;
    padding: 10px;
    max-width: 0;
    padding: 0;
    box-shadow: 5px 0 5px 1px #a8a7a7;
    height: unset;
    border: unset;
    height: calc(100% - 85px);
  }
  .adventageContainer {
    flex-direction: column;
    align-items: center;
  }
  .responsoveIcons {
    display: flex;
    width: 20%;
  }
  .logoContainer {
    width: unset;
    display: flex;
    justify-content: start;
  }
  .headerIcons {
    width: unset;
  }
  .mainMenu {
    display: none;
  }

  .heartIcon {
    display: none !important;
  }
  .header {
    justify-content: space-between;
  }
}
@media only screen and (width <= 950px) {
  .productItemImage {
    height: 275px;
  }
  .prodItemContainer {
    grid-template-columns: repeat(3, 1fr);
  }
  .footer {
    flex-wrap: wrap;
  }
  .support {
    width: 100%;
  }

  .prodDetailBigImage {
    height: 435px;
  }
  .inputSubmit {
    flex-direction: column;
  }
  .inputSubmit input {
    width: 100%;
  }
  .inputSubmit button {
    width: 100%;
  }
}
@media only screen and (max-width: 891px) {
  .productItemImage {
    height: 250px;
  }

  .prodDetailContainer {
    padding: 0 10px;
  }
  .prodItemContainer {
    grid-template-columns: repeat(3, 1fr);
  }
  .catImg {
    height: 270px;
  }
  .prodDetailBigImage {
    height: 390px;
  }

  .carouselContainer {
    height: 60vh;
  }
  .iconDiv {
    min-width: 100%;
    max-width: 100%;
  }
}
@media only screen and (max-width: 801px) {
  .productItemImage {
    height: 220px;
  }
  .storesItems {
    flex-direction: column;
  }
  .storeItem {
    flex: unset;
    padding: 0;
  }
  .productItemsWrapper {
    grid-template-columns: repeat(2, 1fr);
  }
  .footer {
    flex-direction: column;
  }

  .contactWrapper {
    display: flex !important;
    flex-direction: row !important;
    gap: 80px;
  }
  .contactWrapper > div {
    width: 50%;
  }

  .navPageWrapper {
    display: flex !important;
    flex-direction: row !important;
    gap: 80px;
  }
  .navPageWrapper > div {
    width: 50%;
  }

  .bannerBoxContainer {
    border-radius: 0;
    width: 100%;
  }

  .backgroundDiv {
    border-radius: 0;
    width: 100%;
  }

  .carouselContent {
    left: 50%;
    transform: translate(-50%, -50%);
    margin-left: 0;
  }

  .carouselContent span {
    font-size: 42px;
  }
  .catImg {
    height: 230px;
  }

  .prodDetailBigImage {
    height: 335px;
  }
}
@media only screen and (max-width: 700px) {
  .productItemImage {
    height: 300px;
  }
  .advImage img {
    position: relative;
    height: auto;
  }
  .rightSide {
    padding-top: 0;
    max-width: 560px;
    margin: 0 auto;
    padding-left: 20px;
    padding-right: 20px;
  }
  .advSvg {
    display: none;
  }
  /* .advImage {
        height: 550px;
    } */
  .advertisementContent {
    flex-direction: column;
    gap: 40px;
  }
  .advertisementContent > div {
    width: 100%;
  }
  .copyRight {
    padding-left: 0 !important;
  }
  .version {
    padding: 0 !important;
  }
  .footerLogo {
    padding-right: 0 !important;
  }
  .footerLogo img {
    object-position: center;
  }
  .newsletter {
    grid-template-columns: 1fr;
  }
  .btnDiv {
    margin-left: 0;
    text-align: center;
  }
  .iconContent h1 {
    max-width: 100%;
    font-size: 18px;
    line-height: 25px;
  }

  .titleDiv h1 {
    font-size: 22px;
    max-width: 100%;
    text-align: center;
  }
  .prodItemContainer {
    grid-template-columns: repeat(2, 1fr);
  }

  .catImg {
    height: 190px;
  }

  .prodDetailBigImage {
    height: 450px;
  }
  .copyRight {
    text-align: center;
  }

  .bottomFooter {
    flex-direction: column !important;
  }

  .bottomFooter > * {
    margin: 12px 0;
  }

  .bottomFooter > * {
    width: 100% !important;
    display: flex;
    justify-content: center !important;
  }

  .copyRight span {
    width: 100%;
    direction: unset;
    text-align: center;
  }

  .categorieItem {
    min-width: unset;
  }

  .prodDetailContainer {
    flex-direction: column;
  }

  .prodDetailContainer > * {
    width: 100%;
  }

  .footer {
    justify-content: flex-start;
  }
}
@media only screen and (max-width: 600px) {
  .productItemImage {
    height: 260px;
  }

  .slick-arrow {
    bottom: -18px;
  }
  .slick-next {
    right: 5px;
  }
  .slick-prev {
    right: 47px;
  }
  .carouselContent span {
    font-size: 32px;
  }
  .carouselContent p {
    font-size: 16px;
  }
  .carouselContent button {
    font-size: 12px;
  }
  .categorieItem {
    width: 100%;
  }
  .catImg {
    height: 230px;
  }
  .prodDetailBigImage {
    height: 415px;
  }
  .header {
    padding: 15px 20px;
  }
  .topBanner {
    padding: 12px 20px;
  }

  .carouselContainer {
    height: 40vh;
  }

  .secondDiv,
  .firstDiv {
    display: contents;
  }
  .topBanner span {
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 500px) {
  .productItemImage {
    height: 245px;
  }
  .sideCartInfo .price {
    margin-top: 10px;
  }
  .qty_cartNoResp {
    display: none;
  }
  .qty_cartResp {
    display: flex;
  }
  .productItemsWrapper {
    grid-template-columns: 1fr;
  }
  .contactWrapper {
    flex-direction: column !important;
    gap: 0;
  }

  .navPageWrapper {
    flex-direction: column !important;
    gap: 0;
  }

  .contactWrapper > div {
    width: 100%;
  }

  .navPageWrapper > div {
    width: 100%;
  }

  .bannerBoxInfo button {
    font-size: 14px;
  }
  .bannerBoxInfo p {
    font-size: 24px;
  }
  .backgroundDiv span {
    font-size: 20px;
  }
  .catContent p {
    font-size: 18px;
    line-height: 24px;
  }
  .catImg {
    height: 200px;
  }
  .prodDetailContainer {
    margin-top: 0;
  }
  .prodDetailBigImage {
    height: 375px;
  }
}
@media only screen and (max-width: 418px) {
  .logoContainer {
    justify-content: center;
  }
  .bannerPages h1 {
    font-size: 24px;
  }
  .userDivNR {
    right: -120px;
  }
  .emailSubWrapper {
    padding: 25px 15px;
  }
  .carouselContent span {
    font-size: 24px;
  }
  .carouselContent p {
    font-size: 14px;
    font-weight: 500;
  }
  .carouselContent button {
    font-size: 11px;
    font-weight: 500;
    padding: 12px 22px;
  }
  .header {
    flex-direction: column;
  }

  .prodDetailSmallImages {
    justify-content: initial;
  }
  .headerIcons {
    margin-top: 10px;
  }
}
@media only screen and (max-width: 399px) {
  .productItemImage {
    height: 350px;
  }
  .prodItemContainer {
    grid-template-columns: repeat(1, 1fr);
  }
  .catImg {
    height: 350px;
  }
  .catContent {
    top: unset;
    transform: unset;
    bottom: 0;
    width: 100%;
    border-radius: 0 0 30px 30px;
  }
  .prodDetailContainer {
    padding: 0;
  }
  .prodDetailBigImage {
    height: 370px;
  }
  .topBanner {
    flex-direction: column;
  }
  .footer {
    justify-content: flex-start;
  }
}
@media only screen and (max-width: 350px) {
  .adventageContent {
    max-width: 100%;
    flex: 1;
  }

  .adventageLogo {
    margin-bottom: 0;
    margin-right: 5px;
  }

  .adventageContainer {
    padding: 0 20px;
  }

  .adventageLogo span {
    width: 32px;
    height: 32px;
  }

  .adventageItem {
    padding: 15px 20px;
    width: 100%;
    flex-direction: row;
  }

  .prodDetailBigImage {
    height: 335px;
  }

  .bannerBoxInfo button {
    padding: 13px 20px;
  }

  .bannerBoxInfo p {
    font-size: 20px;
  }

  .backgroundDiv span {
    font-size: 18px;
  }
}

select option {
  margin: 40px;
  background: #242424;
  color: #fff;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
}
.modali {
  font-family: "Lato", sans-serif;
  border: 2px solid var(--primiry-color);
  border-radius: 6px;
  padding: 30px;
  text-align: center;
  color: #717171;
  margin: 20px 0;
}
.input_container {
  display: flex;
  justify-content: space-between;
  margin-top: 25px;
  flex-direction: column;
}

.input_container input,
.input_container select {
  text-align: start;
  /* border: 2px solid var(--primiry-color); */
  height: 50px;
  width: 100%;
  border-radius: 3px;
  font-size: 14px;
  padding: 6px 12px;
  background-color: var(--background-secondaryColor);
  border: 1px solid rgb(196, 196, 196);
  outline: none;
  color: #717171;
}
.input_container > input {
  margin-bottom: 20px;
}
#tab-3 {
  display: none;
}

#tab-3 ~ label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 42px;
  cursor: pointer;
  border-bottom: 2px solid var(--primiry-color);
  padding: 0 10px;
  margin-top: 25px;
}

.label-span {
  font-size: 16px;
  position: relative;
  color: #0a0a0a;
  font-weight: 500;
}

#tab-3:checked ~ label ~ .radio-group {
  height: 0px;
  overflow: hidden;
}

#tab-3:checked ~ label .upperdown .upper {
  display: block;
}

#tab-3:checked ~ label .upperdown .down {
  display: none;
}

.upper {
  display: none;
}

.upper i,
.down i {
  font-size: inherit;
  color: var(--primiry-color);
}
#judecheckout_show_hide {
  background: var(--background-secondaryColor);
  padding: 10px;
  margin-top: 0;
  text-align: start;
}

#judecheckout_show_hide table {
  margin-bottom: 0;
  width: 100% !important;
}

#judecheckout_count_number {
  display: inline-block;
  font-size: 12px;
  height: 18px;
  line-height: 18px;
  padding: 0 3px;
  background-color: var(--primiry-color);
  border-radius: 3px;
  color: #fff;
  font-weight: bold;
}

#judecheckout_count_number:after {
  content: "x ";
}

#judecheckout_d_free span {
  display: inline-block;
  font-size: 15px;
  height: 20px;
  line-height: 20px;
  padding: 0 7px;
  background-color: #685f59;
  border-radius: 3px;
  color: #fff;
}

.summary-product-title {
  font-weight: bold !important;
  color: #0a0a0a;
}

.summary-select-state {
  font-size: 14px;
  opacity: 0.8;
}

.judecheckout_currency {
  display: none;
}

#shipping-methods {
  font-size: 14px;
  margin-left: 10px;
  opacity: 0.75;
}

#judecheckout_show_hide .variation-prices .crossed-price bdi {
  font-weight: normal;
  color: #aeaeae;
}

#judecheckout_show_hide td {
  border: none;
  border-bottom: 2px dotted #0a0a0a;
  text-align: start;
  padding: 10px 5px 10px;
  color: var(--text-color);
}

#judecheckout_show_hide .full-price td {
  font-weight: bold;
  border-bottom: 0;
}

#judecheckout_show_hide .full-price td:last-child {
  color: #685f59;
}

/* @media (max-width: 500px) {
  .input_container {
    margin-top: 0;
  }
  .input_container input,
  .input_container select {
    width: 100%;
    margin: 0 !important;
    margin-bottom: 20px !important;
  }
  .credit-card-info--form {
    margin-top: 20px;
  }
} */
.whatsapp-order-section #whatsapp-orders {
  /* position: relative; */
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 70%;
  /* margin: auto; */
  border: 2px solid transparent;
  padding: 9px 15px;
  color: #fff;
  text-transform: uppercase;
  font-weight: 700;
  border-radius: 40px;
  -webkit-transition: 0.2s all;
  transition: 0.2s all;
  margin-top: 20px;
  background: #25d466;
  cursor: pointer;
}
.whatsapp-order-section #whatsapp-orders span {
  font-size: 13px;
  font-weight: 500;
  color: #fff;
}
.whatsapp-order-section #whatsapp-orders:hover {
  background-color: #fff;
  color: #25d466;
  border-color: #25d466;
  /* padding: 9px 30px 9px 36px; */
}
.whatsapp-order-section #whatsapp-orders:hover span {
  color: #25d466;
}
.whatsapp-order-section #whatsapp-orders > i {
  /* position: absolute;
  left: 0;
  top: 0; */
  /* width: 40px;
  height: 40px; */
  /* line-height: 38px; */
  color: #25d466;
  opacity: 0;
  visibility: hidden;
}
.whatsapp-order-section #whatsapp-orders:hover > i {
  opacity: 1;
  visibility: visible;
}
.iti--allow-dropdown {
  width: 100%;
  margin-top: 20px;
  direction: ltr;
}
#check-input-pickup {
  margin: 10px 0;
}
.deliveryContainer span {
  margin-top: 10px;
}

/* Download pdf button  */
.telecharger {
  width: 100%;
  border-radius: 13px;
  background: #f5f5f5;
  /* display: flex;
  flex-direction: column; */
  align-items: baseline;
  padding: 12px 12px 16px 22px;
  margin-bottom: 25px;
}
.telecharger h1 {
  font-size: 24px;
  font-weight: 400;
}
.pdf_file_container {
  display: flex;
  gap: 10px;
  margin: 5px;
  width: 100%;
}
.noselect {
  width: 150px;
  height: 50px;
  cursor: pointer;
  display: flex;
  align-items: center;
  /* background: red; */
  border: none;
  border-radius: 5px;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.15);
  background: var(--primiry-color);
  overflow: hidden;
}

.noselect,
.noselect span {
  transition: 200ms;
}

.noselect .text {
  /* transform: translateX(35px); */
  font-size: 13px;
  font-weight: 500;
  color: #fff;
  padding-left: 5px;
  width: 110px;
  overflow: hidden;
}

.noselect .icon {
  position: absolute;
  border-left: 1px solid #c48961;
  transform: translateX(110px);
  height: 40px;
  width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.noselect img {
  height: 25px;
  width: 25px;
}

.noselect:hover {
  background: var(--primiry-color);
}

.noselect:hover .text {
  color: transparent;
}

.noselect:hover .icon {
  width: 150px;
  border-left: none;
  transform: translateX(0);
}

.noselect:focus {
  outline: none;
}

.noselect:active .icon img {
  transform: scale(0.8);
}
@media (min-width: 1024px) {
  .pdf_file_container {
    flex-wrap: wrap;
  }
}
@media (max-width: 1024px) {
  .noselect .icon {
    border: none;
    display: none;
  }
  .noselect .text {
    text-align: center;
    width: 100%;
  }
  .noselect:hover .text {
    color: white !important;
  }
  .prodDetailQty {
    flex-direction: column;
    /* align-items: center; */
  }
  .prodDetailAddCart {
    width: 100%;
  }
  .prodDetailAddCart button {
    width: 100%;
  }
}
@media (max-width: 500px) {
  .input_container {
    margin-top: 0;
  }
  .input_container input,
  .input_container select,
  .iti--allow-dropdown {
    width: 100%;
    margin: 0 !important;
    margin-bottom: 20px !important;
  }
  .credit-card-info--form {
    margin-top: 20px;
  }
  .whatsapp-order-section #whatsapp-orders > i {
    opacity: 1 !important;
    visibility: visible !important;
    color: #fff;
  }
  .whatsapp-order-section #whatsapp-orders {
    width: 90%;
  }
  .pdf_file_container {
    flex-wrap: wrap;
  }
}
html {
  visibility: visible;
  opacity: 1;
}

/*--------------------------------------- end medias ----------------------------------*/

/*--------------------------------------- end medias ----------------------------------*/