/* start-main-file */
@font-face {font-family: 'cocon-light';src: url('../fonts/cocon-next-arabic-light.eot');src: url('../fonts/cocon-next-arabic-light.eot?#iefix') format('embedded-opentype'),url('../fonts/cocon-next-arabic-light.woff') format('woff'),url('../fonts/cocon-next-arabic-light.ttf') format('truetype'),url('../fonts/cocon-next-arabic-light.svg#BTcondBold') format('svg');font-weight: normal;font-style: normal;}

:root {
  --transition: 0.3s ease;
  --red: #c41617;
  --white: #fefefe;
  --basic: #1d1b1b;
  --gray-middle: #808080;
  --gray-light: #a2a2a2;
  --gray-light-2: #c4c4c4;
  --gray-light-3: #ececec;
  --gray-high: #646363;
  --gray-4: #f5f4f4;
  --gray-300: #d4d4d8;
  --gray-900: #18181b;
  --main-btn-hover: #a90d0e;
  --green: #2d9631;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.eid-alert{
    background: linear-gradient(135deg, #fff7e8 0%, #fff1cc 100%);
    border: 1px solid #f5d48f;
    color: #8a5a00;
    padding: 16px 20px;
    border-radius: 16px;
    font-size: 15px;
    font-weight: 500;
    max-width: 720px;
    margin: 24px auto 0;
    line-height: 1.8;
    box-shadow: 0 6px 18px rgba(245,180,66,.12);
}


body {
  font-family: "cocon-light", sans-serif;
  overflow-x: hidden;
  color: var(--basic);direction: rtl;
}
.ltr{direction: ltr;text-align: right;}
@media (min-width: 1400px) {
  .container-xxl,
  .container-xl,
  .container-lg,
  .container-md,
  .container-sm,
  .container {
    max-width: 1600px;
  }
}

/* main components */
.sec-padding {
  padding-top: 60px;
  padding-bottom: 20px;
}
.title a i{margin-right: 10px;}
img {
  max-width: 100%;
  max-height: 100%;
}

a {
  text-decoration: none;
  color: var(--basic);
  transition: var(--transition);
}

i {
  transition: var(--transition);
}

ul {
  list-style: none;
}

button {
  transition: var(--transition);
}

a:focus {
  outline: none;
}

a:focus,
a:hover {
  text-decoration: none;
  color: inherit;
}

a:hover {
  text-decoration: none;
}

form input:focus {
  box-shadow: none !important;
}

.main-btn {
  background-color: var(--red);
  color: var(--white);
  border: 1px solid var(--red);
  border-radius: 5px;
  padding: 8px 25px;
  transition: var(--transition);
  font-size: 18px;
}

.main-btn:hover {
  background-color: var(--main-btn-hover);
  border: 1px solid var(--main-btn-hover);
  color: var(--white);
}
.product-card {
    position: relative;
}

.curved-tap {
    position: absolute;
    top: 0;
    left: 0;
    background-color: #c41617;
    color: #FFFFFF;
    padding: 16px 32px;
    font-size: 20px;
    height: 40px;
    width: 100px;
    text-align: center;
    font-weight: bold;
    border-radius: 0 0 40px 0;
    transform: translate(-10px, -10px);
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    z-index: 10;
}



.secondary-btn {
  border: 1px solid var(--red);
  color: var(--red);
  font-size: 16px;
  transition: var(--transition);
  padding: 8px 8px;
  border-radius: 5px;
  background-color: var(--white);
}

#verify-section {
    height: 600px;
}

#verify-card{
    text-align: center;
    font-size: 25px;
}

.secondary-btn:hover {
  border: 1px solid var(--basic);
  color: var(--basic);
}

.add-to-cart-btn, a.add-to-cart-btn {
  width: 100%;
  border: 1px solid var(--gray-light-2);
  border-radius: 5px;
  background-color: #ececec;
  padding: 8px 7px;
  font-size: 16px;
  font-weight: 500;
      display: block;
    text-align: center;
}

.add-to-cart-btn img {
  height: 19px;
  margin-bottom: 6px;
  margin-left: 4px;
}
.add-to-cart-btn i {
    color: var(--red) !important;
}

.top-sec-m {
  margin-top: 80px;
}

/*
.f-sec-padding-top {
  padding-top: 145px;
} */

/* colors */
.red {
  color: var(--red) !important;
}

.bg-red {
  background-color: var(--red);
}

.green {
  color: var(--green);
}

.gray-middle {
  color: var(--gray-middle);
}

.gray-high {
  color: var(--gray-high);
}

.basic {
  color: var(--basic);
}

.white {
  color: var(--white);
}

.white-bg {
  background-color: var(--white);
}

/* end-colors */

.title h3 {
  font-size: 36px;
  margin-bottom: 0;
}

@media (max-width: 992px) {
  .title h3 {
    font-size: 28px !important;
  }
}

/* font-weight */
.fw-500 {
  font-weight: 500;
}

.fw-600 {
  font-weight: 600;
}

.fw-700 {
  font-weight: 700;
}

.fs-16 {
  font-size: 16px;
}

.fs-14 {
  font-size: 14px;
}

/* .bread-crumb  */
.breadcrumb {
  color: var(--gray-high);
  font-weight: 500;
}

@media (max-width: 767px) {
  .breadcrumb {
    display: none;
  }
  nav.pt-5{padding-top: 0px!important;}
}

@media (max-width: 992px) {
  .main-btn,
  .secondary-btn {
    font-size: 16px;
    padding: 8px 20px;
  }

  .add-to-cart-btn {
    font-size: 16px;
    padding: 7px;
  }

  .top-sec-m {
    margin-top: 93px;
  }

  /* .sec-padding {
     padding-top: 20px;
    padding-bottom: 20px;
  } */
}

/* end main components */
/* ----------------------------------------- */

/* header */

/* top-header */

/* header lang-btn */
header nav .top-nav .lang-button-container {
  border-left: 1px solid #fefefe80;
  margin-left: 17px;
}

header nav .top-nav .lang-button-container a {
  color: var(--white);
}

header nav .top-nav .lang-button-container img {
  height: 20px;
}

header nav .top-nav .social a {
  padding: 2px 5px;
  border: 1px solid var(--white);
  border-radius: 5px;
  width: 30px;
  text-align: center;
  color: var(--white);
  background-color: #ececec4a;
}

header nav .top-nav .social a:hover {
  opacity: 0.7;
}

/* end-top-nav */

/* nav-bar */
header nav .top-nav .logo img {
  height: 60px;
  object-fit: contain;
}

header nav {
  box-shadow: rgb(153 153 153 / 13%) 1px 3px 4px 0px;
  z-index: 100;
  position: relative;
}

header nav .nav-links {
  display: flex;
  list-style: none;
  margin-bottom: 0;
  padding: 20px;
}

header nav .nav-links li {
  margin: 0 20px;
}

header nav .top-nav .nav-links li .nav-link {
  transition: var(--transition);
  font-size: 18px;
}

header nav .top-nav .nav-links li a:hover,
header nav .top-nav .nav-links li.active a {
  color: var(--basic);
  text-decoration: none;
}

header nav label {
  cursor: pointer;
}

header nav input[type="checkbox"] {
  display: none;
}

header nav .second-nav header nav .search-and-icons a {
  padding: 3px;
}

header nav .second-nav header nav .search-and-icons img {
  height: 25px;
  object-fit: contain;
}

header nav .second-nav .search-container form {
  position: relative;
}

header nav .second-nav .search-container form input[type="search"] {
  border: 1px solid var(--gray-middle);
  padding: 6px 10px;
  border-radius: 5px;
  width: 500px;
}

header
  nav
  .second-nav
  .search-container
  form
  input[type="search"]::placeholder {
  font-size: 14px;
}

header nav .second-nav .search-container form input[type="search"]:focus {
  outline: none;
}

header nav .second-nav .search-container form button {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 50px;
  background: transparent;
  border: transparent;
  font-size: 16px;
  color: var(--basic);
  cursor: pointer;
  outline: 0;
}

header nav .top-nav {
  color: var(--white);
}

header nav .second-nav {
  padding: 15px 0;
}

header nav .second-nav .cat-toggle-icon {
  color: var(--red);
}

header nav .second-nav .categories {
  font-size: 20px;
  border: none;
}

header nav .second-nav .side-icons img {
  height: 27px;
}

header nav .second-nav .side-icons .cart-icon {
  border-left: 2px solid var(--gray-light);
  padding-left: 20px;
}

/* end-desktop-nav-bar */
/* ----------------------------- */

/* categories-side-content */
header nav .second-nav .offcanvas .offcanvas-title {
  color: var(--red);
  font-size: 22px;
}

header nav .second-nav .offcanvas {
  padding: 20px;
}

header nav .second-nav .offcanvas .offcanvas-header {
  border-bottom: 1px solid var(--gray-light-2);
  width: 91%;
  margin: auto;
  padding: 10px 0 10px 0;
}

header nav .second-nav .offcanvas .offcanvas-body ul {
  padding: 0;
}

header nav .second-nav .offcanvas .offcanvas-body ul li {
  margin: 0;
  padding: 10px 0;
  border-bottom: 1px solid var(--gray-light-2);
}

header nav .second-nav .offcanvas .offcanvas-body ul li a {
  font-weight: 500;
  font-size: 18px;
}

header nav .second-nav .offcanvas .offcanvas-body ul li a:hover {
  color: var(--red);
}

/* ----------------------- */

/* cart-widget */
header nav .second-nav .btn {
  border: none;
  padding-right: 20px;
}

header nav .cart-container .item-container .img-container {
  height: 70px;
  min-width: 66px;
}

header nav .cart-container .item-container .img-container img {
  height: 100%;
  object-fit: contain;
}

header nav .cart-container .item-container .title .price {
  font-size: 16px;
}

header nav .cart-container .item-container .title .product-title {
  font-size: 16px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  margin-bottom: 0;
}

header nav .cart-container .item-container:not(:last-child) {
  border-bottom: 1px solid var(--gray-light-2);
  padding-bottom: 10px;
  margin-bottom: 7px;
}

header nav .cart-container .item-container i {
  font-size: 20px;
}

header nav .cart-container .item-container i:hover {
  color: var(--red);
}

header nav .cart-container .total h3 {
  font-size: 20px;
}

header nav .cart-container .total div {
  font-size: 18px;
}

header nav .cart-container .cart-items {
  max-height: 345px;
  overflow: auto;
}

/* scrollbar */
header nav ::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

header nav ::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  -webkit-border-radius: 10px;
  border-radius: 10px;
}

header nav ::-webkit-scrollbar-thumb {
  -webkit-border-radius: 10px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.3);
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}

header nav ::-webkit-scrollbar-thumb:window-inactive {
  background: rgba(255, 255, 255, 0.3);
}

header nav .cart-items-num {
  top: 28px !important;
  right: 25px;
  padding: 4px 6px;
}

/* account-menu */
header nav .icon-container {
  position: relative;
}

header nav .icon-container .menu {
  display: none;
  position: absolute;
  top: 135%;
  left: 0%;
  background-color: #f9f9f9;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  z-index: 1;
  width: 120px;
  text-align: center;
  border-radius: 5px;
  border: 1px solid var(--gray-high);
}

header nav .icon-container .menu ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

header nav .icon-container .menu li {
  padding: 10px;
  margin: 0;
}

header nav .icon-container .menu li:not(:last-child) {
  border-bottom: 1px solid var(--gray-light-2);
}

header nav .icon-container .menu a {
  text-decoration: none;
  color: #333;
  display: block;
}

header nav .icon-container .menu li:hover {
  background-color: #ddd;
}

header nav .second-nav .offcanvas-header .btn-close {
  box-shadow: none;
}

/* header-responsive */
@media (max-width: 992px) {
  header nav .menu-btn i {
    display: block;
    color: var(--white);
    font-size: 24px;
  }

  header nav .nav-links {
    position: fixed;
    width: 100%;
    text-align: center;
    display: block;
    transition: all 0.4s ease-in-out;
    z-index: 100;
    overflow: hidden;
    box-shadow: rgb(0 0 0 / 8%) 7px 7px 9px 0px;
    padding: 0;
    background-color: var(--white);
    left: 0;
    bottom: -50%;
    opacity: 0;
  }

  #click:checked ~ .nav-links {
    top: 60%;
    opacity: 1;
  }

  header nav .nav-links li {
    width: 96%;
    margin: 0;
    color: var(--red);
    border-bottom: 1px solid var(--Gray-light-2);
  }

  header nav .nav-links li .nav-link {
    width: 100%;
    display: block;
    padding: 10px 0;
    text-align: start;
    font-size: 18px;
    text-align: center;
  }

  header nav .nav-links li.active,
  header nav .nav-links li:hover {
    background-color: var(--red);
    width: 100%;
  }

  header nav .nav-links li.active .nav-link,
  header nav .nav-links li:hover .nav-link {
    color: var(--white) !important;
  }

  header nav .search-and-icons a {
    padding: 0;
    color: var(--red);
  }

  header .overlay {
    position: fixed;
    background-color: #00000094;
    height: 100vh;
    width: 100vw;
    opacity: 0;
    transition: var(--transition);
    z-index: -1;
  }

  header .overlay.display {
    opacity: 1;
    z-index: 1;
  }

  header nav .second-nav .search-container form input[type="search"] {
    width: auto;
  }

  header nav .second-nav .side-icons img {
    height: 22px;
  }

  header nav .second-nav .offcanvas .offcanvas-title {
    font-size: 20px;
  }

  header nav .second-nav .offcanvas-header .btn-close {
    font-size: 14px;
  }

  header nav .cart-container .item-container .img-container {
    height: 55px;
    min-width: 60px;
  }

  header nav .cart-container .item-container .title {
    font-size: 16px;
  }

  header nav .cart-container .item-container .title .price {
    font-size: 14px;
  }

  header nav .icon-container .menu a {
    font-size: 14px;
  }
}

/* end header */
/* ---------------------------------------------------------------------------------- */

/* start home */
/* hero-sec-slider */
.home .hero-sec-slider .slick-next,
.home .hero-sec-slider .slick-prev {
  z-index: 2;
  top: 45%;
}

.home .hero-sec-slider .slick-next {
  right: 80px;
}

.home .hero-sec-slider .slick-prev {
  left: 40px;
}

.home .hero-sec-slider .slick-prev:before,
.home .hero-sec-slider .slick-next:before {
  opacity: 0.5;
}

.home .hero-sec-slider .slick-prev:before {
  content: url("../images/prev-arrow-icon.png");
}

.home .hero-sec-slider .slick-next:before {
  content: url("../images/next-arrow-icon.png");
}

.home .hero-sec-slider .slick-prev:hover:before,
.home .hero-sec-slider .slick-next:hover:before {
  opacity: 1;
}

.home .hero-sec-slider .slick-dots {
  bottom: 25px;
}

.home .hero-sec-slider .slick-dots li button:before {
  color: var(--gray-light-2);
}

.home .hero-sec-slider .slick-dots li.slick-active button:before {
  color: var(--red);
}

.home .hero-sec-slider .slick-dots li button:before {
  font-size: 12px;
}

.home .hero-sec-slider .slider-item {
  cursor: pointer;
  position: relative;
}

.home .hero-sec-slider .slick-slide img {
  width: 100%;
  min-height: 80vh;
  object-fit: cover;
}

/* slide-content */
.home .hero-sec-slider .content {
  color: var(--white);
  position: absolute;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  transition: opacity var(--transition);
  opacity: 0;
  width: 100%;
}

.home .hero-sec-slider .content h2 {
  font-weight: bold;
  font-size: 72px;
  padding: 0 5px;
}

.home .hero-sec-slider .content p {
  font-weight: 100;
  font-size: 36px;
  padding: 0 9%;
}

.home .hero-sec-slider .slick-current + .slick-active .content {
  opacity: 1 !important;
  z-index: 5;
}

.slide-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 1);
  /* Adjust the last value for opacity (0 to 1) */
  z-index: 1;
  /* Lower z-index to place it behind the content */
  opacity: 0.4;
  transition: var(--transition);
}

.home
  .hero-sec-slider
  .slick-active:not(.slick-current + .slick-active):hover
  .slide-overlay {
  opacity: 0.6;
}

@media (max-width: 992px) {
  .home .hero-sec-slider .content {
    display: none;
    opacity: 0;
    z-index: 2;
  }

  .home .hero-sec-slider .slick-current .content {
    opacity: 1;
    top: 15%;
    left: 0;
    text-align: left;
    transform: translate(7%, 15%);
    display: block;
  }

  .home .hero-sec-slider .slick-slide img {
    min-height: 50vh;
  }

  .home .hero-sec-slider .content h2 {
    font-size: 40px;
  }

  .home .hero-sec-slider .content p {
    font-size: 20px;
    padding: 0;
    margin-bottom: 35px;
  }

  .home .hero-sec-slider .slick-dots li button:before {
    font-size: 10px;
  }

  .home .hero-sec-slider .slick-dots li {
    margin: 0 3px;
  }
}

/* main-title */
.main-title h2 {
  font-size: 56px;
  position: relative;
}

.main-title h2:before {
  content: "";
  position: absolute;
  bottom: 6px;
  width: 163px;
  height: 6px;
  background-color: var(--basic);
  z-index: -1;
}

.main-title p {
  color: var(--gray-high);
  font-size: 18px;
}

@media (max-width: 992px) {
  .main-title h2 {
    font-size: 32px;
  }

  .main-title h2:before {
    bottom: 1px;
    width: 96px;
    height: 5px;
  }

  .main-title p {
    color: var(--gray-high);
    font-size: 14px;
  }
}

/* main-card */
.main-card .title i::before {
  margin-left: 5px;
}

.main-card .title a {
  font-size: 18px;
}

.main-card .title a:hover {
  color: var(--red);
}

/* product-card */

.main-card .products .product-card {
  transition: var(--transition);
}

.main-card .products .product-card:hover {
  border: 1px solid var(--red);
}

.main-card .products .product-card {
  border: 1px solid var(--gray-light-3);
  padding: 15px;
  border-radius: 10px;
  margin-bottom: 20px;
}

.main-card .products .product-card figure {
  border: 1px solid var(--gray-light-3);
  border-radius: 10px;
  padding: 5px;
  height: 280px;
  position: relative;
}

.main-card .products .product-card figure img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 75%;
    max-height: 100%;
    height: auto;
}

.main-card .products .product-card h3 {
  font-size:18px;
  margin-bottom: 2px;
  min-height: 45px;
}

.main-card .products .product-card .brand-name {
  color: var(--gray-light);
  font-size: 14px;
}

.main-card .products .product-card .price {
  font-size: 18px;
}

.main-card .products .product-card .availability {
  font-size: 14px;
  margin-bottom: 15px;
}

.counter-holder {
  width: 100%;
  border: 1px solid var(--gray-light-2);
  border-radius: 5px;
  background-color: #ececec4a;
  padding: 8px 7px;
  font-size: 18px;
  font-weight: 500;
}

.counter-holder .num span {
  color: var(--basic);
}

.counter-holder #increment span,
.counter-holder #decrement span {
  font-size: 20px;
  display: flex;
  align-items: center;
  height: 20px;
}

.counter-holder .icon-btn button {
  background-color: transparent;
  border: none;
  font-size: 20px;
  font-weight: 500;
  color: var(--red);
}

@media (max-width: 992px) {
  .main-card .title a {
    font-size: 16px;
  }

  .main-card .products .product-card h3 {
    font-size: 16px;
  }

  .main-card .products .product-card .brand-name {
    font-size: 14px;
  }

  .main-card .products .product-card {
    margin-bottom: 20px;
  }

  .counter-holder #increment span,
  .counter-holder #decrement span {
    height: 15px;
  }

  .banners img {
    margin-bottom: 20px;
  }

  .banners {
    text-align: center;
  }
}

/* category-cards */
.home .categories .categories-slider {
  padding: 0 3%;
}

.categories .category-item {
  border: 1px solid var(--gray-light-2);
  padding: 20px 15px;
  border-radius: 10px;
  text-align: center;
  transition: var(--transition);
  overflow: hidden;
  margin: 10px 0;
}

.home .categories .categories-slider .category-item {
  margin: 0 10px;
}

.categories .category-item:hover {
  border: 1px solid var(--red);
  box-shadow: 0px 2px 8px 0px #acacaca8;
}

.categories .category-item h4 {
  font-size: 20px;
  height: 50px;
  margin-bottom: 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  transition: var(--transition);
}

.categories .category-item:hover h4 {
  color: var(--red);
}

.categories .category-item img {
  margin: auto;
}

.home .categories .categories-slider .slick-next:before,
.home .categories .categories-slider .slick-prev:before {
  font-family: "Font Awesome 5 Free";
  color: var(--gray-light-2);
  font-size: 36px;
  transition: var(--transition);
  z-index: 2;
}

.home .categories .categories-slider .slick-next:before {
  content: "\f35a";
  /* Unicode for Font Awesome plus icon */
}

.home .categories .categories-slider .slick-prev:before {
  content: "\f359";
}

.home .categories .categories-slider .slick-next:hover:before,
.home .categories .categories-slider .slick-prev:hover:before {
  color: var(--red) !important;
}

.home .categories .categories-slider .slick-prev {
  left: 0;
}

.home .categories .categories-slider .slick-next {
  right: 10px;
}

.categories .category-item .products-num {
  color: var(--gray-light);
  font-size: 18px;
  margin-top: -22px;
}

.sub-cat .category-item button:hover {
  color: var(--red);
  background-color: var(--white);
  border-color: var(--red);
}

.sub-cat .category-item .img-holder {
  height: 140px;
}

@media (max-width: 992px) {
  .home .categories .categories-slider {
    padding: 0;
  }

  .categories .category-item h4 {
    font-size: 18px;
    height: 40px;
  }

  .sub-cat .category-item .products-num {
    font-size: 16px;
    margin-top: 3px;
  }

  .sub-cat .category-item h4 {
    height: auto;
    font-size: 20px;
  }
}

@media (max-width: 767px) {
  .sub-cat .category-item {
    padding: 15px 10px;
  }
}

/* subscribe form */
.form-container {
  background-image: url(../images/subscribe-form-bg.png);
  background-size: cover;
  background-position: center;
  border-radius: 20px;
  padding: 60px 50px;
}

.form-container h5 {
  font-size: 34px;
}

.form-container form input {
  background-color: #9c3233;
  border: 1px solid var(--gray-300);
  border-radius: 5px;
  color: var(--white);
  padding: 9px 10px;
}

.form-container form input::placeholder {
  color: var(--white);
}

.form-container form input:focus {
  border-color: var(--gray-middle);
}

.form-container form .subscribe-btn {
  width: 100%;
  background-color: var(--basic);
  color: var(--white);
  font-size: 18px;
  padding: 8px;
}

.form-container form .subscribe-btn:hover {
  background-color: #6e0708;
}

@media (max-width: 992px) {
  .form-container h5 {
    font-size: 28px;
  }

  .form-container form .subscribe-btn {
    font-size: 16px;
    width: 60%;
  }

  .form-container {
    padding: 40px 65px;
  }
}

@media (max-width: 767px) {
  .form-container form input {
    padding: 7px 10px;
  }

  .form-container form .subscribe-btn {
    padding: 7px;
  }
}

/* counter */
.counter-holder {
  display: none;
}

.add-to-cart-btn.hide-prev {
  display: none;
}

.hide-prev {
  display: none;
}

.counter-holder.visible-counter {
  display: block;
}

.main-card .products .product-card .increment span,
.main-card .products .product-card .decrement span {
  color: var(--red);
  font-size: 18px;
  cursor: pointer;
}

/* end-home */
/* ------------------------------------------------------- */
/* footer */
footer {
  background-image: url(../images/footer-bg.png);
  background-position: center;
  background-size: cover;
  padding: 4rem 0;
}

/* ---------------------------------------- */
/* footer */
footer {
  background-color: var(--Gray-light-3);
  padding: 60px 0;
  margin-top: 30px;
  color: var(--white);
}

footer .logo {
  max-height: 70px;
  margin-bottom: 15px;
}

footer p {
  padding: 0 10% 10px 0;
  font-size: 16px;
}

footer .social .icon-holder {
  border: 1px solid var(--white);
  background-color: #ececec4a;
  padding: 2px 4px;
  width: 33px;
  text-align: center;
  transition: var(--transition);
  border-radius: 4px;
}

footer .social .icon-holder i {
  font-size: 14px;
  color: var(--white);
}

footer .social .icon-holder:hover i {
  color: var(--basic);
}

footer .title {
  color: var(--red);
  font-weight: 700;
  font-size: 18px;
  margin-bottom: 5px;
}

footer a {
  font-size: 16px;
  line-height: 27px;
  color: var(--white);
}

footer a:hover {
  color: var(--red);
}

footer .line {
  height: 1px;
  width: 50%;
  margin: auto;
  background-color: var(--white);
}

footer .copy-right {
  font-size: 14px;
}

footer .copy-right a {
  color: var(--red);
  transition: var(--transition);
  font-weight: 500;
}

footer .copy-right a:hover {
  color: var(--white);
}

@media (max-width: 767px) {
  footer p {
    padding: 0 30px;
    font-size: 14px;
  }

  footer .title {
    font-size: 16px;
    margin-top: 7px;
  }

  footer a {
    font-size: 14px;
  }

  footer .social .icon-holder {
    padding: 2px;
  }

  footer .copy-right {
    font-size: 12px;
  }
}

/* end-home */
/* ---------------------------------------------------- */
/* start product details */

/* product-slider */
.product-details .owl-carousel .owl-stage-outer {
  position: static;
}

.product-details .owl-theme .owl-nav {
  display: none;
}

.product-details .owl-theme .owl-nav .owl-prev,
.product-details .owl-theme .owl-nav .owl-next {
  position: absolute;
  top: 45%;
  z-index: 2;
}

.product-details .owl-theme .owl-nav .owl-prev {
  right: 95%;
}
.product-details .owl-theme .owl-nav .owl-next {
  left: 95%;
}

.product-details .owl-theme .owl-nav [class*="owl-"]:hover {
  background: var(--red);
}

.product-details .owl-carousel.owl-drag .owl-item .secondary-img {
  max-height: 100px;
  padding: 5px;
}

.product-details .flexslider {
  position: relative;
}

.product-details .owl-carousel .owl-item img {
  border: 1px solid var(--gray-middle);
  border-radius: 10px;
}

.zoomWindow {
  height: 250px !important;
  width: 250px !important;
  border: 2px solid var(--gray-high) !important;
}

.product-details .mainImage img {
  border: 1px solid var(--red);
  border-radius: 10px;
  object-fit: contain;
  min-height: 250px;
}

@media (max-width: 767px) {
  .zoomContainer {
    display: none !important;
  }
}

/* --------------------------------------------- */

/* product-details-price and info*/
.product-details .details h2 {
  font-size: 28px;
  color: var(--gray-900);
}

.product-details .details .total-reviews span {
  color: #b0aeae;
  font-size: 18px;
}

.product-details .details .total-reviews span.checked {
  color: #f8c51b;
}

.product-details .details .total-rev-num {
  color: var(--gray-middle);
  font-weight: 600;
}

.product-details .details .price .title {
  font-size: 20px;
}

.product-details .details .price .old-price {
  font-size: 20px;
}

.product-details .details .price .saving-num {
  font-size: 22px;
}

.product-details .details .description {
  font-size: 18px;
}

.product-details .details .description a {
  text-decoration: underline;
  transition: var(--transition);
}
#success{
    padding-top: 150px;
}

/* counter */
.product-details .details .counter-container {
  display: flex;
  align-items: center;
}

.product-details .details .counter-btn {
  display: flex;
}

.product-details .details .icon-btn {
  width: 25px;
  height: 25px;
  border-radius: 50%;
  border: 1px solid var(--red);
  color: var(--red);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 5px;
  cursor: pointer;
}

.product-details .details .icon-btn button {
  font-size: 20px;
  color: var(--red);
  border: none;
  background-color: transparent;
}

.product-details .details .counter-container .secondary-btn {
  background-color: #ececec4a;
  padding: 4px 8px;
}

.payment-instructions-icon {
    transition: all 0.3s ease;
}
.payment-instructions-icon:hover {
    color: #0056b3 !important;
    transform: scale(1.2);
}
#instructions-image-container img {
    max-height: 500px;
    object-fit: contain;
}
#instructions-video-container video {
    max-height: 500px;
}

.product-details .details .counter-container .secondary-btn:hover {
  border: 1px solid var(--gray-light-2);
}

.product-details .details .counter-container .num {
  color: var(--basic);
  padding: 7px 10px 3px;
  font-weight: 500;
}

.product-details .details .share-to h3 {
  font-size: 18px;
  margin-bottom: 0;
}

.product-details .details .share-to a {
  border-radius: 5px;
  border: 1px solid var(--gray-light-2);
  padding: 3px 9px;
  width: 33px;
  text-align: center;
}

.product-details .details .share-to a:hover i {
  color: var(--red);
}

@media (max-width: 992px) {
  .product-details .details img {
    max-height: 40px;
  }
  .product-details .details h2 {
    font-size: 26px;
    margin-bottom: 0;
  }
  .product-details .details .total-reviews span {
    font-size: 18px;
  }
  .product-details .details .total-rev-num {
    font-size: 14px;
  }
  .product-details .details .price .title {
    font-size: 18px;
  }
  .product-details .details .price .saving-num {
    font-size: 16px;
    margin-top: 5px;
  }
  .product-details .details .description {
    font-size: 14px;
  }
  .product-details .details .share-to h3 {
    font-size: 20px;
  }
  .product-details .details .share-to a {
    padding: 3px 7px;
    width: 32px;
  }
  .nav-tabs .nav-link {
    font-size: 16px;
  }
}

@media (max-width: 767px) {
  .product-details .details h2 {
    font-size: 24px;
  }

  .product-details .details .total-reviews span,
  .product-details .details .price .old-price {
    font-size: 18px;
  }

  .product-details .details .price .title,
  .product-details .details .price .saving-num {
    font-size: 20px;
  }

  .product-details .details .description {
    font-size: 16px;
  }

  .products .custom-select .select-header {
    padding: 7px 12px;
  }

  .products .custom-select {
    font-size: 14px;
  }

  .products .custom-select .options li {
    padding: 10px;
  }

  .products .filter-button {
    font-size: 16px;
  }
}
/* end-product-details-price and info */

/* nav */
.nav-tabs {
  border-bottom: none;
}

.nav-tabs li {
  border: none;
  outline: none;
  margin: 0 10px;
}

.nav-tabs .nav-link {
  border: none;
  padding-bottom: 4px;
  font-weight: 700;
}

.nav-tabs li button {
  font-size: 22px;
  font-weight: 500;
  border: none;
  color: var(--black);
  padding-bottom: 10px;
  border-bottom: 1px solid transparent !important;
  box-shadow: none;
  outline: none;
}

.nav-link:focus-visible {
  box-shadow: none;
}

.nav-tabs li button:hover,
.nav-tabs .nav-link:hover,
.nav-tabs .nav-link.active {
  border: none;
  color: var(--red);
  border-bottom: 3px solid var(--red) !important;
  box-shadow: none;
  outline: none;
}

@media (max-width: 767px) {
  .nav-tabs li button {
    font-size: 18px;
  }
}
/* end-nav */

/* product-details-info */
.product-details .nav-container .content-holder h2 {
  font-size: 20px;
  font-weight: 500;
}

.product-details .nav-container .content-holder ul {
  list-style: unset;
  padding: 0 20px;
  font-size: 18px;
}

.product-details .nav-container .content-holder p {
  font-size: 16px;
  padding-right: 5%;
}

.product-details .nav-container .content-holder .table td,
.product-details .nav-container .content-holder .table th {
  text-align: center;
  font-size: 16px;
}

.product-details .nav-container .content-holder .table td {
  font-weight: 500;
}
.fa-star {

    color: #ccc;
}

.checked {
    color: #ffca08;
}

.product-details
  .nav-container
  .content-holder
  .table-striped
  > tbody
  > tr:nth-of-type(odd)
  > * {
  background-color: #c4161733;
}

.product-details
  .nav-container
  .content-holder
  .table-striped
  > tbody
  > tr:nth-of-type(even)
  > * {
  background-color: var(--Gray-4);
}

.table > :not(caption) > * > * {
  color: inherit;
}

/* reviews */
.product-details .reviews .review-container {
  padding: 20px 0;
}

.product-details .reviews .review-container:not(:last-child) {
  border-bottom: 2px solid var(--gray-light-2);
}

.product-details .reviews h2 {
  font-size: 20px;
}

.product-details .reviews .badge {
  padding: 6px 7px;
  font-size: 12px;
  background-color: var(--gray-light);
}

.product-details .reviews .review-container .user {
  font-weight: 700;
  padding-bottom: 5px;
}

.product-details .reviews .review-container .date {
  color: var(--gray-high);
  font-size: 14px;
}

.product-details .reviews {
  border-left: 1px solid var(--gray-light-2);
  padding-left: 40px;
}

.product-details .reviews .col-lg-6:nth-child(odd) {
  padding-right: 30px;
}

.product-details .main-btn {
  padding: 7px 45px;
}

@media (max-width: 992px) {
  .product-details .slick-next:before,
  .product-details .slick-prev:before {
    background-size: 35% auto;
  }

  .product-details .nav-container .content-holder ul {
    font-size: 14px;
  }

  .product-details .nav-container .content-holder h2 {
    font-size: 18px;
  }

  .product-details .nav-container .content-holder p {
    font-size: 14px;
  }

  .product-details .nav-container .content-holder .table td,
  .product-details .nav-container .content-holder .table th {
    font-size: 14px;
  }
  .product-details .reviews {
    border: none;
    padding-left: 0;
  }

  .product-details .reviews h2 {
    font-size: 18px;
  }

  .product-details .reviews .badge {
    padding: 5px 7px;
    font-size: 11px;
  }

  .product-details .reviews .review-container p,
  .product-details .reviews .review-container .user {
    font-size: 14px;
  }

  .product-details .reviews .col-lg-6:nth-child(even) {
    border: none;
    padding-left: 15px;
  }

  .product-details .reviews .col-lg-6:nth-child(odd) {
    padding-right: 15px;
  }

  .product-details .reviews .col-lg-6:nth-last-child(2) .review-container {
    border-bottom: 2px solid var(--Gray-light-2);
  }
}

/* modal */
.product-details .modal-content {
  padding-right: 20px;
}

.product-details .reviews-container {
  background-color: #ececec99;
  padding: 5% 7%;
}

/* Rating Star Widgets Style */
.product-details .rating-stars ul {
  list-style-type: none;
  padding: 0;

  -moz-user-select: none;
  -webkit-user-select: none;
}

.product-details .rating-stars ul > li.star {
  display: inline-block;
  cursor: pointer;
}

/* Idle State of the stars */
.product-details .rating-stars ul > li.star > i.fa {
  font-size: 22px;
  /* Change the size of the stars */
  color: #b0aeae;
  /* Color on idle state */
}

/* Hover state of the stars */
.product-details .rating-stars ul > li.star.hover > i.fa {
  color: #f8c51b;
}

/* Selected state of the stars */
.product-details .rating-stars ul > li.star.selected > i.fa {
  color: #f8c51b;
}

.product-details .modal-content form textarea {
  resize: none;
  width: 100%;
  background-color: #fafafa;
  color: var(--basic);
  padding: 10px;
  border-radius: 5px;
}

.product-details .modal-content form textarea:focus {
  outline: none;
}

.product-details .modal-content h3 {
  font-weight: 700;
  font-size: 30px;
}

.product-details .modal-content h4 {
  font-weight: 500;
  font-size: 20px;
}

.product-details .modal-dialog .modal-content {
  padding: 20px;
}

.product-details .modal-dialog .modal-content input {
  background-color: var(--gray-light-3);
  border-color: var(--gray-light);
}
.product-details .modal-dialog .modal-header {
  border: none;
}

@media (max-width: 992px) {
  .product-details .modal-content {
    margin-bottom: 30px;
    border-bottom: 1px solid gray;
    padding-bottom: 35px;
  }
}

@media (max-width: 767px) {
  .product-details .modal-content h3 {
    font-size: 24px;
  }

  .product-details .modal-content h4 {
    font-weight: 500;
    font-size: 18px;
  }
}

/* end-moadal */
/* -------------------------------------------- */

/* contact-us */
.contact-us .contact-us-form-container {
  padding: 30px 60px;
  background-color: var(--gray-light-3);
  border-radius: 10px;
}

.contact-us .contact-us-form-container .head-title h3 {
  font-size: 32px;
}

.contact-us .contact-us-form-container .head-title p {
  font-size: 18px;
}

@media (max-width: 992px) {
  .contact-us .contact-us-form-container .head-title h3 {
    font-size: 24px;
  }

  .contact-us .contact-us-form-container .head-title p {
    font-size: 14px;
  }
}

/* main-form */
.main-form label {
  font-weight: 500;
  font-size: 18px;
}

.main-form input::placeholder {
  color: var(--gray-middle);
}

.main-form input,
.main-form textarea {
  border: 1px solid var(--gray-light-2);
  background-color: var(--gray-4);
  font-size: 14px;
  color: var(--gray-middle);
  padding: 10px;
}

.main-form input:focus,
.main-form textarea:focus {
  box-shadow: none;
  background-color: var(--gray-4);
  border-color: var(--gray-middle);
}

/* Hide arrows in Chrome, Safari, and Edge */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Hide arrows in Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}

.login-form {
  width: 50%;
}

.register-form {
  width: 80%;
}

.form-holder {
  border: 1px solid var(--gray-light);
  padding: 30px 60px;
  border-radius: 10px;
  margin: auto;
}

.form-holder .form-check-input[type="checkbox"] {
  padding: 7px;
  margin-top: 5px;
}

.form-holder .form-check-input:checked,
.form-holder .form-check-input:focus {
  background-color: var(--red);
  border-color: var(--red);
}

.form-holder .remember-me label {
  font-size: 14px;
}

.form-holder .forgot-password a {
  transition: var(--transition);
  font-weight: 500;
}

.form-holder .forgot-password a:hover {
  color: var(--red);
}

.form-holder .sign-up-link {
  color: var(--gray-high);
  font-size: 14px;
}

/* success-reset-pass  */
.success-reset h3 {
  font-size: 28px;
  margin-top: 0;
}

.success-reset h4 {
  padding: 0 15%;
  color: var(--gray-light);
  font-size: 20px;
}

@media (max-width: 992px) {
  .login-form {
    width: 100%;
  }

  .register-form {
    width: 100%;
  }
}

@media (max-width: 767px) {
  .main-form label {
    font-size: 16px;
  }

  .success-reset img {
    height: 90px;
  }

  .success-reset h3 {
    font-size: 22px;
  }

  .success-reset h4 {
    padding: 0 5%;
    font-size: 18px;
  }
}

/* end-main-form */
/* ---------------------------------------- */

/* side-contact-info */
.contact-us .side-contact-info {
  background-color: #9c2d2e;
  padding: 20px 50px;
  border-radius: 10px;
  right: 1%;
  width: 45%;
  top: 50%;
  transform: translate(0, -50%);
  z-index: -1;
}

.contact-us .side-contact-info .contact-holder {
  color: var(--white);
  font-size: 18px;
  font-weight: 500;
}

.contact-us .side-contact-info .contact-holder:not(:last-child) {
  margin-bottom: 15px;
}

.contact-us .side-contact-info .contact-holder i {
  font-size: 22px;
  padding-right: 10px;
}

.contact-us .side-contact-info .contact-holder .address {
  padding-left: 30%;
}

@media (max-width: 992px) {
  .contact-us .side-contact-info {
    border: 2px solid var(--red);
    background-color: transparent;
    top: 100%;
    left: 50%;
    transform: translate(-50%, -6%);
    padding: 20px 25px;
    width: 80%;
  }

  .contact-us .side-contact-info .contact-holder {
    color: var(--basic);
    font-size: 16px;
  }

  .contact-us .side-contact-info .contact-holder i {
    color: var(--red);
    font-size: 20px;
    padding-right: 5px;
  }

  .contact-us .side-contact-info .contact-holder .address {
    padding-right: 0;
  }
}

/* contact-map */

.map iframe {
  width: 100%;
  filter: grayscale(100%) invert(92%) contrast(83%);
  color: var(--white);
}

@media (max-width: 992px) {
  .map {
    margin-top: 200px;
  }
}
/* ----------------------------------------------------- */
/* shopping-cart */
.shopping-cart .cart-item:not(:last-child) {
  border-bottom: 1px solid var(--gray-middle);
  padding-bottom: 10px;
  margin-bottom: 23px;
}
.shopping-cart .cart-item figure {
  border: 1px solid var(--gray-high);
  padding: 5px;
  border-radius: 5px;
  width: 120px;
  max-height: 120px;
}
.shopping-cart .cart-item h3 {
  font-size: 24px;
  margin-bottom: 3px;
}
.shopping-cart .cart-item .brand-name {
  font-size: 18px;
}

.shopping-cart .cart-item .price {
  font-size: 22px;
}
.shopping-cart .cart-item .price span {
  font-size: 18px;
}
.shopping-cart .cart-item .counter-btn {
  width: 100%;
  border: 1px solid var(--gray-light-2);
  border-radius: 5px;
  background-color: #ececec4a;
  padding: 9px 20px;
  font-size: 18px;
  font-weight: 500;
}

.shopping-cart .cart-item .counter-btn button {
  color: var(--red);
  border: none;
  background: transparent;
}

.shopping-cart .cart-item .delete-btn:hover i {
  color: var(--red);
}

.shopping-cart .total-price {
  border: 1px solid var(--gray-light-3);
  padding: 25px 30px;
  border-radius: 10px;
  background-color: var(--white);
}

.shopping-cart .total-price .data-holder {
  font-size: 16px;
}

.shopping-cart .total-price .line {
  background-color: var(--Gray-light);
  height: 1.5px;
}

@media (max-width: 992px) {
  .shopping-cart .cart-item h3 {
    font-size: 16px;
  }
  .shopping-cart .cart-item .brand-name {
    font-size: 14px;
  }
  .shopping-cart .cart-item .price {
    font-size: 16px;
  }

  .shopping-cart .total-price .data-holder {
    font-size: 14px;
  }
}

@media (max-width: 1200px) {
  .shopping-cart .total-price {
    bottom: 0;
    box-shadow: 0px -2px 6px #b8b8b83d;
  }
}
/* ------------------------------------------ */
/* start checkout */
.check-out .login {
  background-color: #c416171a;
  padding: 5px 20px;
  margin-bottom: 10px;
}

.check-out .login div {
  font-size: 20px;
}

.check-out .login a {
  font-size: 16px;
  text-decoration: underline;
  margin-left: 10px;
  transition: var(--transition);
}

.check-out .login a:hover {
  color: var(--basic) !important;
}

.check-out .form-check-input:checked,
.check-out .form-check-input:focus {
  background-color: var(--red);
  border-color: var(--red);
}

.check-out .form-check input {
  box-shadow: none;
  cursor: pointer;
  border: 1px solid var(--red);
  font-size: 16px;
}

.check-out .form-check label {
  cursor: pointer;
  font-size: 18px;
  font-weight: 500;
}

.check-out .form-check-input:checked[type="radio"] {
  border: 1px solid var(--red);
}

.check-out .form-box {
  border: 1px solid var(--gray-light-3);
  padding: 30px 30px;
  border-radius: 10px;
}

.check-out .form-box h4 {
  font-size: 24px;
}

.check-out form label {
  font-size: 18px;
  font-weight: 500;
}

.check-out form input,
.check-out textarea {
  box-shadow: none;
  border: 1px solid var(--gray-light-2);
  background-color: var(--gray-4);
}

.check-out form textarea {
  resize: none;
}

.check-out form textarea:focus {
  background-color: var(--gray-4);
}
.check-out form input:focus,
.check-out form textarea:focus {
  border: 1px solid var(--gray-middle);
  box-shadow: none;
}

/* 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;
}

.check-out .form-box .payment-method .payment-container {
  border: 1px solid var(--gray-high);
  border-radius: 5px;
}

.check-out .form-box .payment-method .payment-container .options {
  padding: 6px 10px;
}

.check-out .form-box .payment-method a {
  text-decoration: underline;
}

.check-out .form-box .shopping-cart .item-container:not(:last-child) {
  border-bottom: 1px solid var(--gray-light);
  padding-bottom: 17px;
  margin-bottom: 15px;
}

.check-out .shopping-cart .item-container .title {
  font-size: 18px;
}

.check-out .shopping-cart .item-container .title .price {
  font-size: 16px;
}

.check-out .shopping-cart .item-container button i {
  transition: var(--transition);
  font-size: 16px;
}

.check-out .shopping-cart .item-container button i:hover {
  color: var(--red);
}

.check-out .shopping-cart .item-container .img-container {
  border: 1px solid var(--gray-high);
  padding: 10px;
  border-radius: 5px;
  width:100px;
}

.check-out .data-holder .title {
  font-size: 16px;
}

.check-out .data-holder .price {
  font-size: 18px;
}

.check-out .data-holder .total-label {
  font-size: 22px;
}

.check-out .data-holder .total-num {
  font-size: 20px;
}
.check-out .data-holder .line {
  height: 1px;
  width: 100%;
  background-color: var(--gray-light);
}

.hidden {
  display: none;
  opacity: 0;
  visibility: none;
  transition: opacity 1s ease-in-out;
}

.visible {
  display: block;
  opacity: 1;
  visibility: visible;
}
.check-out .shopping-cart {
  max-height: 300px;
  overflow-y: auto;
}

.check-out .fixed-side-cart.fixed {
  position: fixed;
  top: 20%;
  padding-right: 5%;
}

/* scrollbar */
.check-out .shopping-cart::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

.check-out .shopping-cart::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  -webkit-border-radius: 10px;
  border-radius: 10px;
}

.check-out .shopping-cart::-webkit-scrollbar-thumb {
  -webkit-border-radius: 10px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.3);
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}

.check-out .shopping-cart::-webkit-scrollbar-thumb:window-inactive {
  background: rgba(255, 255, 255, 0.3);
}

@media (max-width: 1200px) {
  .check-out .fixed-side-cart.fixed {
    position: static;
  }
}

@media (max-width: 767px) {
  .check-out .form-check label,
  .check-out form label,
  .check-out .data-holder .price {
    font-size: 16px;
  }
  .check-out h4 {
    font-size: 20px;
  }
  .check-out .data-holder .title,
  .check-out .login a {
    font-size: 14px;
  }
  .check-out .data-holder .total-label,
  .check-out .login div,
  .check-out .data-holder .total-num {
    font-size: 18px;
  }
}
/* end-checkout */
/* ----------------------------------------- */
/* brands */
.brands .brand-holder {
  text-align: center;
  padding: 5px 5px;
  border-radius: 5px;
  transition: var(--transition);
  filter: grayscale(1);
}

.brands .brand-holder:hover {
  filter: grayscale(0);
}
/* end-brands */
/* --------------------------------------------- */
/* tabs */

/* start account ==> orders  */
.account .content-holder {
  border: 1px solid var(--Gray-light-3);
  padding: 30px 40px;
  border-radius: 10px;
  margin-left: 15px;
}

.account .tabs ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.account .tabs ul li {
  display: block;
}

.tabs > ul li:not(:last-child) {
  border-bottom: 1px solid var(--Gray-light);
}

.account .tabs ul li a,
.tabs > ul li a:visited,
.account .log-out-btn {
  display: flex;
  border-bottom: none;
  text-decoration: none;
  color: var(--red);
  padding: 8px 15px;
  transition: all 0.2s ease-in-out;
  word-wrap: break-word;
}

.account .log-out-btn {
  border: none;
  background: none;
  font-weight: 500;
  width: 100%;
}

.account .tabs ul li a:hover,
.account .tabs ul li a:focus,
.account .tabs ul li a:active {
  border-bottom: none;
  outline: 0;
}

.account .tabs ul li a.active,
.account .log-out-btn:hover {
  background-color: var(--red);
  color: var(--white);
}

.account .tabs ul li a:hover:not(.active) {
  background-color: var(--red);
  color: var(--white);
}

.account .tabs ul li a span.tab-label {
  display: block;
  font-size: 18px;
  font-weight: 500;
}
/* end-tabs */
/* order-table */
.account .content-holder .order-table table thead th {
  font-size: 20px;
  text-wrap: nowrap;
  font-weight: 600;
}

.account .content-holder .order-table table tr {
  border-bottom: 2px solid #b9b2b275;
}

.account .content-holder .order-table table tbody tr:last-child {
  border-bottom: 1px solid transparent;
}

.account .content-holder .order-table .table > tbody > tr > td {
  padding: 10px 15px;
  font-size: 16px;
}

.account .content-holder .order-table table tbody tr,
.account .content-holder .order-table table tbody th {
  font-size: 18px;
  color: var(--gray-middle);
  font-weight: 500;
}

.account .content-holder .order-table a {
  transition: var(--transition);
}

.account .content-holder .order-table a:hover {
  color: var(--red);
}

.account .content-holder .order-table {
  overflow: auto;
}

.account .content-holder h2 {
  font-size: 34px;
}

@media (max-width: 992px) {
  .account .tab-head {
    margin-bottom: 20px;
  }
  .account .tabs ul li a > span.tab-label {
    font-size: 16px;
  }

  .account .content-holder h2 {
    font-size: 28px;
  }
  .account .content-holder {
    margin-left: 0;
  }
  .account .content-holder .order-table table thead th,
  .account .content-holder .order-table table tbody th {
    font-size: 18px;
  }
  .account .content-holder .order-table .table > tbody > tr > td {
    font-size: 14px;
  }
  .account-mb-padding {
    padding: 0;
  }
}

/* account ---> addresses */
.account .content-holder .addresses .address .top-holder {
  border-bottom: 1px solid var(--gray-light);
  padding-bottom: 10px;
}
.account .content-holder .addresses .address .top-holder h3 {
  font-size: 24px;
}

.account .content-holder .addresses .address .top-holder .address-num {
  font-size: 20px;
}

.account .content-holder .addresses .address .remove-btn {
  transition: var(--transition);
  border: none;
  background: transparent;
  border-left: 1px solid var(--gray-light);
  padding: 5px 10px;
  margin-left: 5px;
}

.account .content-holder .addresses .address .remove-btn:hover {
  color: rgb(230, 37, 37);
}
.account .content-holder .addresses .address a,
.account .content-holder .addresses .address .remove-btn {
  color: var(--gray-light);
  font-size: 18px;
}

.account .content-holder .addresses .address .top-holder {
  max-width: 70%;
}

@media (max-width: 767px) {
  .account .content-holder .addresses .address .top-holder {
    width: 30%;
  }
  .account .content-holder .addresses .address .top-holder h3 {
    font-size: 24px;
  }
  .account .content-holder .addresses .address .top-holder h3 {
    font-size: 18px;
  }
  .account .content-holder .addresses .address .top-holder .address-num,
  .account .content-holder .addresses .address a,
  .account .content-holder .addresses .address .remove-btn {
    font-size: 16px;
  }
}

/* account --> add-new-address */
.account .content-holder form label {
  font-weight: 500;
  font-size: 18px;
  text-wrap: nowrap;
}

.account .content-holder form input {
  background-color: var(--gray-4);
  border: 1px solid var(--gray-light-2);
  box-shadow: none;
  font-size: 16px;
  height: 40px;
}

.account .content-holder form input:focus {
  border: 1px solid var(--gray-middle);
}

@media (max-width: 767px) {
  .account .content-holder form label {
    font-size: 16px;
  }
  .account .content-holder form input {
    font-size: 14px;
    height: 35px;
  }
}
/* --------------------------------------------------------------- */
/* end-account */

/* submit-error */
form label.error {
  color: #ee1111;
  font-size: 16px !important;
}

/* page-not-found */
.page-not-found {
  background-image: url(../images/page-not-found-bg.png);
  background-position: center;
  background-size: cover;
  min-height: 85vh;
  position: relative;
}

.page-not-found .text h2 {
  font-size: 36px;
}

.page-not-found .text p {
  font-size: 22px;
  color: var(--gray-light);
  padding: 0 20px;
}

.page-not-found .text {
  position: absolute;
  left: 50%;
  top: 55%;
  transform: translate(-50%, 60%);
}

@media (max-width: 992px) {
  .page-not-found {
    min-height: 60vh;
  }

  .page-not-found .text h2 {
    font-size: 30px;
  }

  .page-not-found .text p {
    font-size: 18px;
    padding: 0;
  }
  .page-not-found .text {
    top: 55%;
    transform: translate(-50%, 55%);
    left: 50%;
    width: 78%;
  }
}

/* -------------------------------------------- */
/* styled-select */
.styled-select .select-hidden {
  display: none;
  visibility: hidden;
  padding-right: 10px;
}

.styled-select .select {
  cursor: pointer;
  display: inline-block;
  position: relative;
  font-size: 16px;
  color: #fff;
  width: 220px;
  height: 40px;
}

.styled-select .select-styled {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  color: var(--basic);
  border: 1px solid var(--gray-light-2);
  border-radius: 5px;
  padding: 8px 15px;
  -moz-transition: all 0.2s ease-in;
  -o-transition: all 0.2s ease-in;
  -webkit-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in;
  text-align: start;
}
.styled-select .select-styled:after {
  content: "";
  width: 0;
  height: 0;
  border: 7px solid transparent;
  border-color: var(--basic) transparent transparent transparent;
  position: absolute;
  top: 16px;
  left: 10px;
}

.styled-select .select-styled:active:after,
.select-styled.active:after {
  top: 9px;
  border-color: transparent transparent var(--basic) transparent;
}

.styled-select .select-options {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  z-index: 999;
  margin: 0;
  padding: 0;
  list-style: none;
  background-color: #fff;
  color: var(--gray-high);
  border: 1px solid var(--gray-high);
  text-align: start;
  border-radius: 0 0 5px 5px;
}
.styled-select .select-options li {
  margin: 0;
  padding: 12px 0;
  text-indent: 15px;
  -moz-transition: all 0.15s ease-in;
  -o-transition: all 0.15s ease-in;
  -webkit-transition: all 0.15s ease-in;
  transition: all 0.15s ease-in;
}
.styled-select .select-options li:hover,
.select-options li.is-selected {
  color: var(--gray-900);
  background: var(--gray-4);
}
.styled-select .select-options li[rel="hide"] {
  display: none;
}
/* -------------------------------------------- */
/* side-filter */
.search .side-filter .menu {
  padding: 0 20px;
}

.search .side-filter .form-check-input:checked {
  background-color: var(--red);
  border-color: var(--gray-300);
}

.search .side-filter .head-title {
  font-size: 20px;
  font-weight: 500;
  background-color: var(--gray-light-3);
  border-radius: 10px;
  padding: 3px 15px;
  border: 1px solid var(--gray-light);
  cursor: pointer;
}

.search .side-filter {
  font-size: 14px;
  background-color: #ececec80;
  padding: 25px 15px;
  min-height: 65vh;
}

.search .side-filter .form-check input {
  box-shadow: none;
  cursor: pointer;
  border: 1px solid var(--gray-300);
  margin-top: 6px;
  height: 16px;
  width: 16px;
}

.search .side-filter .form-check input::placeholder {
  color: var(--gray-high);
}

.search .side-filter .form-check-label {
  cursor: pointer;
  font-size: 18px;
}

.search .mobile-search button {
  border: 1px solid var(--gray-light-2);
  border-radius: 5px;
  padding: 8px 15px;
  height: 40px;
  background-color: transparent;
}
/* --------------------------------------- */
.search .side-filter .form-control {
  padding: 5px 10px;
}
.search .side-filter .form-control:focus {
  border-color: var(--gray-middle);
}

#toggleButton,
#cat-toggleButton {
  position: relative;
}

.search .side-filter .arrow,
.search .side-filter #cat-toggleButton.active .arrow {
  display: inline-block;
  width: 0;
  height: 0;
  border: 7px solid transparent;
  border-color: var(--basic) transparent transparent transparent;
  position: absolute;
  top: 16px;
  left: 10px;
}

.search .side-filter #toggleButton.active .arrow,
.search .side-filter #cat-toggleButton .arrow {
  top: 9px;
  border-color: transparent transparent var(--basic) transparent;
}

.search .side-filter #categories-content.visible {
  display: none;
  visibility: hidden;
}
.search .side-filter #brands-content {
  display: none;
  visibility: hidden;
}
.search .side-filter #brands-content.visible {
  display: block;
  visibility: visible;
  transition: visability 0.3s ease-in-out;
}

@media (max-width: 992px) {
  .search .mobile-search .scroll {
    white-space: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
  }

  .styled-select .select {
    width: 180px;
  }
}

@media (max-width: 767px) {
    .main-card .products .product-card figure {
        height: 155px;
      }
}
.error{color:red;}
#copyrights{position: absolute;top: 0;right: 0;border: none;width: 100%;height: 100%}

/* Corner ribbon */
.ribbon{
  position:absolute;
  top:12px;
  right:-12px;
  background:#dc3545;           /* Bootstrap danger */
  color:#fff;
  padding:6px 14px;
  font-size:.75rem;
  font-weight:600;
  text-transform:uppercase;
  transform:rotate(45deg);
  box-shadow:0 2px 6px rgba(0,0,0,.15);
  pointer-events:none;
  z-index: 10;
}

/* Optional ribbon tails */
.ribbon::before,
.ribbon::after{
  content:"";
  position:absolute;
  bottom:-6px;
  border-top:6px solid #a52834; /* darker tail */
  border-right:6px solid transparent;
  border-left:6px solid transparent;
  right:6px;
}
.ribbon::after{
  right:auto; left:6px;
}

.products-slider.slick-initialized .slick-slide {
  margin: 0 10px;
}
i n p u t [ t y p e = \  
 s e a r c h \ ] : : - w e b k i t - s e a r c h - d e c o r a t i o n ,   i n p u t [ t y p e = \ s e a r c h \ ] : : - w e b k i t - s e a r c h - c a n c e l - b u t t o n ,   i n p u t [ t y p e = \ s e a r c h \ ] : : - w e b k i t - s e a r c h - r e s u l t s - b u t t o n ,   i n p u t [ t y p e = \ s e a r c h \ ] : : - w e b k i t - s e a r c h - r e s u l t s - d e c o r a t i o n   {   - w e b k i t - a p p e a r a n c e :   n o n e ;   }  
 