/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

.thumbnail img {
  width: 100% !important;
  /* height: 300px !important; */
  object-fit: cover;
}

.thumbnail {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.post_type_slider .post_slide {
  /* padding: 10px; */
  /* margin: 10px 10px; */
  margin: 10px 20px 10px 0px !important;
  padding: 10px 20px 10px 0px !important;
  box-shadow: 0px 2px 6px 2px #d3d3d34d;
}

ul.slick-dots button {
  background: black !important;
}

.meta_category {
  display: flex;
  gap: 10px;
}

.post_meta p {
  color: black;
  font-weight: 600;
  margin: 0px;
  padding: 5px 0;
  border-radius: 10px;
}

.post_slide ul.slick-dots button:hover {
  border: none !important;
}

a.ajax_add_to_cart.p_disabled {
  pointer-events: none;
  background-color: #9e9e9e !important;
  /* color: black !important; */
}

.post_slide h2 {
  color: black;
  font-size: 24px;
  line-height: 27px;
  margin: 0 !important;
  padding: 2rem 0;
}

/* Common grid wrapper */
.post_type_grid {
  display: grid !important;
  gap: 20px;
  /* space between cards */
}

/* Layout styles */
.slider_layout1 {
  grid-template-columns: 1fr;
}

.slider_layout2 {
  grid-template-columns: 1fr 1fr;
}

.slider_layout3 {
  grid-template-columns: 1fr 2fr;
}

.slider_layout4 {
  grid-template-columns: 2fr 1fr;
}

.slider_layout5 {
  grid-template-columns: 1fr 1fr 1fr;
}

.slider_layout6 {
  grid-template-columns: 1fr 1fr 1fr 1fr;
}

.slider_layout7 {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}

.slider_layout8 {
  grid-template-columns: 1fr 2fr 1fr;
}

/* Slider layout css */

/* .slider_layout8 .slick-slide {
  transform: scale(0.7);
}

.slider_layout8  .slick-center {
  transform: scale(1.3);
} */

a.ajax_add_to_cart.p_enabled.variable_btn.disabled {
  background: #8080806e !important;
}

ul.slick-dots {
  list-style: none;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 15px;
  margin: 14px 0;
}

ul.slick-dots li {
  padding: 6px 10px;
  /* background: black; */
  border: none !important;
}

ul.slick-dots li button {
  border: none;
  padding: 0px 4px;
  color: white !important;
}
