a {
  outline: 0px !important;
}

/* Modal Styling */
.custom-modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 999;
}

.custom-modal-content {
  background: #fff;
  margin: 5% auto;
  overflow-y: auto;
  position: relative;
  display: flex;
  max-width: 1273px;
  width: 90%;
  max-height: 83vh;
  padding: 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  border-radius: 8px;
}

div#custom-modal h2#modal-title {
  color: #2c2801;
  font-family: "Avenir", Sans-serif;
  font-size: 56px;
  font-style: normal;
  font-weight: 900;
  line-height: 60px;
  margin: 0;
}

.close-modal {
  color: #2c2801;
  font-family: "Avenir", Sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 800;
  line-height: 24px;
  display: flex;
  align-items: center;
  gap: 16px;
  cursor: pointer;
}

div#custom-modal .custom-options {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.color-selection,
.layout-options {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  flex: 1 0 0;
}

.color-box {
  width: 26px;
  height: 26px;
  stroke-width: 2px;
  stroke: var(--Primary-50, #f4f4ed);
  border-radius: 50%;
  cursor: pointer;
}

.layout-option img {
  width: 40px;
  height: 40px;
  cursor: pointer;
  border: 2px solid transparent;
  border-radius: 2px;
}

.color-box.selected,
.layout-option.selected img {
  border: 2px solid #fe5000;
}

.preview-container {
  position: relative;
  text-align: center;
  max-height: 636px;
  height: 100%;
  align-self: stretch;
  border-radius: 2px;
}

.hotspot-wrapper {
  position: relative;
  display: inline-block;
  /* height: 636px; */
  max-height: 636px;
  height: 100%;
}

img#preview-image {
  display: block;
  width: 100%;
  max-height: 636px;
  height: 100%;
  border-radius: 2px;
  object-fit: contain;
  transition: 0.3s ease-in-out;
  /* object-position: center center; */
  /* width: 100%; */
}

.hotspot-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.hotspot {
  background: red;
  cursor: pointer;
  position: absolute;
  z-index: 2;
  width: 40px;
  height: 40px;
  background-color: #fe5000;
  display: flex;
  border-radius: 50%;
  animation: fadeIn 0.5s forwards;
  transform: translate(-20px, -20px);
}

.hotspot::before {
  content: "";
  position: absolute;
  top: 20%;
  left: 20%;
  width: 60%;
  height: 60%;
  border: 1px solid #bd6c46f2;
  background-color: #fe5000;
  border-radius: 50%;
  transform: translate(0%, 30%);
  animation: ripple 2s infinite;
}

/*.tooltip {*/
/*  display: none;*/
/*  position: absolute;*/
/*  background: #ffffff;*/
/*  color: #3e3904;*/
/*  padding: 16px;*/
/*  border-radius: 16px;*/
/*  !* top: -30px; *!*/
/*  bottom: 74px;*/
/*  left: 50%;*/
/*  transform: translateX(-50%);*/
/*  margin: 0;*/
/*  width: 220px;*/
/*  box-shadow: 0px 0px 12px 0px rgba(62, 57, 4, 0.2);*/
/*}*/

/*.tooltip::after {*/
/*  content: "";*/
/*  position: absolute;*/
/*  bottom: -20px;*/
/*  left: 50%;*/
/*  transform: translateX(-50%) rotate(-45deg);*/
/*  width: 40px;*/
/*  height: 42px;*/
/*  background: white;*/
/*  border-left: 2px solid #fff;*/
/*  border-right: 2px solid #fff;*/
/*  border-bottom: 0px solid #fff;*/
/*  border-radius: 0px 100% 0px 8px;*/
/*}*/

/*.tooltip img {*/
/*  height: 137px;*/
/*  width: 100%;*/
/*  object-fit: cover;*/
/*  margin-bottom: 16px;*/
/*}*/

/*.tooltip ul a {*/
/*  color: #6e6809;*/
/*  font-family: "Avenir", Sans-serif;*/
/*  font-size: 16px;*/
/*  font-style: normal;*/
/*  font-weight: 900;*/
/*  line-height: normal;*/
/*}*/

span.modal-title-icon {
  display: flex;
  align-items: center;
  gap: 16px;
}

.modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

span.modal-title-icon img {
  width: 18px;
  height: 17px;
  padding: 8px;
}

a.modal-cuisine-detail {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  color: #2c2801;
  text-decoration: none;
  font-family: "Avenir", Sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
}

span.modal-cuisine-detail img {
  width: 24px;
  height: 24px;
}

/*.tooltip h4 {*/
/*  text-align: center;*/
/*  !* Heading 4 *!*/
/*  font-family: "Avenir", Sans-serif;*/
/*  font-size: 24px;*/
/*  font-style: normal;*/
/*  font-weight: 800;*/
/*  line-height: normal;*/
/*  margin: 0;*/
/*  margin-bottom: 16px;*/
/*}*/

/*.tooltip p {*/
/*  color: var(--Black, #2c2801);*/
/*  text-align: center;*/
/*  !* Text *!*/
/*  font-family: "Avenir", Sans-serif;*/
/*  font-size: 16px;*/
/*  font-style: normal;*/
/*  font-weight: 400;*/
/*  line-height: 24px;*/
/*  !* 150% *!*/
/*  margin: 0;*/
/*  margin-bottom: 16px;*/
/*}*/

/*.tooltip ul {*/
/*  margin: 0;*/
/*  list-style: none;*/
/*  padding: 0;*/
/*  border: 0px;*/
/*}*/

/* Full-Screen Loader (Spinning Circle) */
#modal-loader {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 60px;
  height: 60px;
  transform: translate(-50%, -50%);
  border: 6px solid rgba(255, 255, 255, 0.3);
  border-top: 6px solid #fe5000;
  border-radius: 50%;
  animation: spin 1s linear infinite;
  z-index: 10000;
  display: none;
}

/* Background Overlay */
#loading-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 9999;
  display: none;
}

/* Animation */
@keyframes spin {
  0% {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}

/* Disable interactions */
.body-loading {
  pointer-events: none;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.1);
}

@media (max-width: 767px) {
  .custom-modal-content {
    width: 84%;
    margin: 15% auto;
  }

  .modal-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }

  span.modal-title-icon {
    display: flex;
    align-items: center;
    gap: 5px;
  }

  div#custom-modal h2#modal-title {
    color: #2c2801;
    font-family: "Avenir", Sans-serif;
    font-size: 24px;
    font-style: normal;
    font-weight: 800;
    line-height: 26px;
    margin: 0;
  }

  a.modal-cuisine-detail {
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    color: #2c2801;
    text-decoration: none;
    font-family: "Avenir", Sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 900;
    line-height: normal;
  }

  a.modal-cuisine-detail img {
    width: 24px;
  }

  .preview-container .hotspot {
    display: none;
  }

  .preview-container {
    margin-right: -16px;
    margin-left: -16px;
    max-height: 469px;
  }

  .hotspot-wrapper {
    display: block;
    max-height: 469px;
  }

  img#preview-image {
    max-height: 469px;
    object-fit: cover;
  }

  div#custom-modal .custom-options {
    flex-direction: column;
    gap: 24px;
  }
}

/* detail-side-panel */

.detail-side-panel {
  position: fixed;
  top: 0;
  right: -150%;
  height: 100%;
  background: white;
  box-shadow: -2px 0 10px rgba(0, 0, 0, 0.2);
  transition: right 0.3s ease-in-out;
  overflow-y: auto;
  z-index: 1000;
  display: flex;
  max-width: 712px;
  width: 100%;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.detail-side-panel.open {
  right: 0;
  z-index: 9999;
  width: auto;
}

.detail-side-panel .side-pannel-inner-con {
  display: flex;
  padding: 0px 32px;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  align-self: stretch;
}

.detail-side-panel .close-btn-sidepanel {
  background: none;
  border: none;
  color: #2c2801;
  font-family: "Avenir", Sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 800;
  line-height: 24px;
  display: flex;
  align-items: center;
  gap: 16px;
  cursor: pointer;
  padding: 0;
}

.detail-side-panel .kitchen-title {
  width: 100%;
  color: #2c2801;
  text-align: center;
  font-family: Avenir, sans-serif;
  font-size: 40px;
  font-style: normal;
  font-weight: 900;
  line-height: 44px;
  margin: 0;
}

.detail-side-panel .featured-section {
  width: 100%;
}

.detail-side-panel .actions {
  margin-bottom: 8px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
}

.detail-side-panel .actions .save-btn span.save-icon {
  position: unset;
  background-color: transparent;
  padding: 0;
  align-items: center;
  justify-content: flex-start;
  display: contents;
}

.detail-side-panel .save-btn,
.detail-side-panel .share-btn {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  position: relative;
  gap: 8px;
  color: #fe5000;
  font-family: Avenir, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
}

.detail-side-panel button.share-btn {
  display: flex;
  padding: 12px 24px 12px 18px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  background: #6e6809;
  border-radius: 2px;
  color: #fff;
}

.detail-side-panel .image-section {
  width: 100%;
  height: 199px;
}

.detail-side-panel .featured-section .image-section img {
  width: 100%;
  height: 100%;
  border-radius: 2px;
  object-fit: cover;
  object-position: center;
}

.detail-side-panel .price-section {
  width: 100%;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.detail-side-panel .price-section p.label {
  color: #2c2801;
  font-family: Avenir, sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 800;
  line-height: normal;
  margin-bottom: 4px;
}

.detail-side-panel .price-switch-panel {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
}

/* Toggle Switch Container */
.detail-side-panel .tva-toggle-switch {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  position: relative;
  flex-direction: column;
}

.detail-side-panel .price-with-old {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.detail-side-panel .price-with-old .price {
  color: #fe5000;
}

p.price-display.price.normal-price {
  color: #2c2801;
}

/* Hide Default Checkbox */
.detail-side-panel .tva-checkbox {
  display: none;
}

/* Toggle Label */
.detail-side-panel .tva-label {
  display: flex;
  align-items: center;
  position: relative;
  background: #ffffff;
  border: 1px solid #6e6809;
  border-radius: 70px;
  cursor: pointer;
  transition: background 0.3sease-in-out;
}

/* Toggle Inner Text */
.detail-side-panel .tva-inner {
  text-align: center;
  padding: 8px 16px;
  font-family: Avenir, sans-serif;
  font-size: 16px;
  font-weight: 900;
  border-radius: 50px;
  transition: 0.3s ease-in-out;
}

/* Default State (TVA 6% Active) */
.detail-side-panel .tva-inner:first-child {
  background: #6e6809;
  color: white;
}

.detail-side-panel .tva-inner.right {
  color: black;
  background: transparent;
}

/* When Checkbox is Checked (TVA 21% Active) */
.detail-side-panel .tva-checkbox:checked + .tva-label .tva-inner:first-child {
  background: transparent;
  color: black;
}

.detail-side-panel .tva-checkbox:checked + .tva-label .tva-inner.right {
  background: #6e6809;
  color: white;
}

.detail-side-panel .price {
  color: #2c2801;
  font-family: Avenir, sans-serif;
  font-size: 48px;
  font-style: normal;
  font-weight: 900;
  line-height: 52px;
}

.detail-side-panel .price-with-old .strikethrough-price.price {
  text-decoration: line-through;
  color: #2c2801;
  font-family: "Avenir", Sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 800;
  line-height: normal;
}

p.price-details {
  color: #2c2801;
  font-family: Avenir, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 800;
  line-height: 24px; /* 150% */
}

.detail-side-panel .promotion-banner {
  background: #fe5000;
  color: #ffffff;
  border-radius: 2px;
  display: flex;
  padding: 24px;
  align-items: center;
  gap: 18px;
  align-self: stretch;
}

.detail-side-panel .promotion-texts {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  flex: 1 0 0;
}

p.promo-text {
  color: var(--White, #fff);
  font-family: Avenir, sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 900;
  line-height: 28px; /* 116.667% */
}

div.promo-subtext {
  color: var(--White, #fff);
  font-family: Avenir, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px; /* 150% */
}

.detail-side-panel .discount-percentage img {
  width: 125px;
  height: 85px;
  object-fit: contain;
}

.detail-side-panel .discount-percentage span {
  position: absolute;
  left: 10px;
  top: 24px;
  color: #fe4f02;

  /* Heading 4 */
  font-family: Avenir, sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 800;
  line-height: normal;
}

.detail-side-panel .discount-percentage {
  position: relative;
}

.detail-side-panel .included {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
}

p.included-title {
  color: #2c2801;
  font-family: Avenir, sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 800;
  line-height: normal;
}

.detail-side-panel .included-items {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
}

.detail-side-panel .included-item {
  border-radius: 2px;
  display: flex;
  padding: 8px 16px;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  background: #e4e3d2;
  color: #2c2801;
  font-family: Avenir, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 800;
  line-height: normal;
}

span.item-img-title {
  display: flex;
  align-items: center;
  gap: 8px;
}

span.item-img-title img.included-icon {
  width: 32px;
  height: 32px;
  object-fit: contain;
}

span.included-icon-span {
  background: #ffffff;
  border-radius: 50%;
  display: flex;
  padding: 4px;
  align-items: center;
  gap: 10px;
}

.detail-side-panel .included-item.no-icon {
  font-size: 16px;
  line-height: 24px;
  background: #6e6809;
  color: #ffffff;
  height: 49px;
}

.detail-side-panel .included-item span.amount {
  font-size: 24px;
  white-space: nowrap;
  font-weight: 800;
}

.detail-side-panel .included-item.no-icon span.amount.price {
  color: #ffffff;
  font-weight: 800;
}

body.no-scroll {
  overflow: hidden;
  pointer-events: none;
}

body.no-scroll .detail-side-panel {
  pointer-events: auto; /* Keep side panel interactive */
}

.side-panel-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5); /* Semi-transparent black */
  z-index: 9998; /* Below the side panel but above everything else */
  display: none;
}

body.no-scroll .side-panel-overlay {
  display: block; /* Show overlay when side panel opens */
}

@media (max-width: 767px) {
  .detail-side-panel .side-pannel-inner-con {
    padding: 0px;
  }

  .detail-side-panel .actions {
    flex-wrap: wrap;
    gap: 16px;
  }

  .detail-side-panel .price-switch-panel {
    flex-wrap: wrap;
    gap: 16px;
  }

  .detail-side-panel .promotion-banner {
    flex-wrap: wrap;
  }

  .detail-side-panel .promotion-texts {
    flex: auto;
  }

  .detail-side-panel .included-item.no-icon {
    height: auto;
    gap: 8px;
  }

  .detail-side-panel .included-item {
    height: auto;
    gap: 8px;
  }

  .detail-side-panel .price-with-old {
    align-items: flex-start;
  }

  .detail-side-panel button.share-btn {
    width: 100%;
  }
}

/* blog page */

.custom-blog-container {
  text-align: center;
}

.blog-filters {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
  padding: 0px 0px 40px;
  flex-wrap: wrap;
}

label.filter-label {
  display: flex;
  padding: 8px 24px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 2px;
  border: 1px solid #6e6809;
  background: #fff;
  cursor: pointer;
}

input.filter-checkbox {
  display: none;
}

label.filter-label:hover {
  background: #e4e3d2;
  border: none;
}

.filter-label:has(.filter-checkbox:checked) {
  background: #e4e3d2;
  border: none;
}

.blog-posts {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 16px;
  align-self: stretch;
}

.blog-row {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
  width: 100%;
}

.blog-row.blog-row-2 .blog-post {
  width: 50%;
}

.blog-post {
  background: #fff;
  border-radius: 2px;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
  text-align: left;
  transition: 0.3s ease-in-out;
  display: flex;
  padding: 16px;
  flex-direction: column;
  gap: 16px;
  align-self: stretch;
  justify-content: space-between;
  height: 593px;
  flex: 1 1 calc(25% - 16px);
}

.blog-post:hover {
  background: #e4e3d2;
}

.blog-post .post-image img {
  width: 100%;
  height: 358px;
  object-fit: cover;
  border-radius: 2px;
}

.post-category {
  color: #2c2801;
  font-family: Avenir, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

span.category-label {
  border-radius: 40px;
  background: var(--Primary-100, #e4e3d2);
  padding: 4px 12px;
}

.post-title {
  font-size: 24px;
  margin: 0px;
  min-height: 80px;
}

h3.post-title a {
  color: #2c2801;
  font-family: Avenir, sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 800;
  line-height: normal;
}

.blog-post a.read-more-btn {
  color: #6e6809;
  font-family: Avenir, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
  text-decoration: underline !important;
}

.load-more-wrapper {
  padding: 40px 0;
}

#load-more-btn {
  cursor: pointer;
  width: 280px;
  padding: 18px 24px;
  border-radius: 2px;
  background: #6e6809;
  color: #fff;
  font-family: Avenir, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
  display: none;
  border: none;
}

.blog-post.promotion {
  justify-content: center;
  gap: 8px;
  border-radius: 2px;
  background: #fe5000;
  text-align: left;
}

.blog-post.promotion .promo-title {
  margin: 0;
  color: #fff;
  font-family: Avenir, sans-serif;
  font-size: 40px;
  font-style: normal;
  font-weight: 900;
  line-height: 44px; /* 110% */
}

.blog-post.promotion .promo-desc {
  color: #fff;
  font-family: Avenir, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 800;
  line-height: 24px; /* 150% */
}

.blog-post.text_blocks_post {
  background: #cdcbaa;
  align-self: stretch;
  display: flex;
  padding: 24px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 32px;
  text-align: left;
}

.blog-post.text_blocks_post .text-block-title {
  color: #2c2801;
  font-family: Avenir, sans-serif;
  font-size: 40px;
  font-style: normal;
  font-weight: 900;
  line-height: 44px;
  margin: 0;
  align-self: stretch;
  padding: 1px;
}

.blog-post.text_blocks_post .text-block-desc {
  color: #2c2801;
  font-family: Avenir, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

#loader {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 60px;
  height: 60px;
  transform: translate(-50%, -50%);
  border: 6px solid rgba(255, 255, 255, 0.3);
  border-top: 6px solid #fe5000;
  border-radius: 50%;
  animation: spin 1s linear infinite;
  z-index: 10000;
  display: none;
}

/* Make the first card in odd rows a large-square */
.blog-row:nth-child(odd) .blog-post:nth-child(1) {
  flex: 1 1 calc(50% - 16px); /* Larger width */
}

/* Make the second card in even rows a large-square */
.blog-row:nth-child(even) .blog-post:nth-child(2) {
  flex: 1 1 calc(50% - 16px); /* Larger width */
}

.blog-row:has(.blog-post:only-child) .blog-post {
  flex: 0 1 calc(50% - 10px);
}

.text-block-button {
  display: flex;
  padding: 16px 24px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  border-radius: 2px;
  background: #6e6809;
  cursor: pointer;
}

.text-block-button a.btn {
  color: #fff;
  text-align: center;
  font-family: Avenir, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
}
@media (max-width: 1024px) {
  .blog-post {
    flex: 1 1 calc(30% - 16px);
  }
  .blog-row:nth-child(odd) .blog-post:nth-child(1) {
    flex: 1 1 calc(40% - 16px); /* Larger width */
  }

  /* Make the second card in even rows a large-square */
  .blog-row:nth-child(even) .blog-post:nth-child(2) {
    flex: 1 1 calc(40% - 16px); /* Larger width */
  }
}

@media (max-width: 768px) {
  .blog-filters {
    justify-content: center;
  }

  .blog-row {
    flex-wrap: wrap;
  }

  .blog-post {
    width: 100%;
    flex: auto;
  }

  .post-title {
    min-height: auto;
  }

  label.filter-label:hover {
    border: 1px solid #6e6809;
    background: #fff;
  }
}

/* 
* Exhibitions post
*/

.custom-exhibition-container {
  text-align: center;
  position: relative;
}
.posts-con {
  position: relative;
  min-height: 200px;
}
.exhibition-row {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
  width: 100%;
}

div.exhibition-posts {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 16px;
  align-self: stretch;
  padding-top: 40px;
}

.exhibition-filters {
  display: flex;
  align-items: center;
  gap: 16px;
  align-self: stretch;
  padding: 0px 0px 16px;
  flex-wrap: wrap;
  justify-content: center;
}

.exhibition-post {
  position: relative;
  border-radius: 2px;
  display: flex;
  flex-direction: column;
  height: 563px;
}

.exhibition-row.row-1 .exhibition-post:nth-of-type(1),
.exhibition-row.row-2 .exhibition-post:nth-of-type(2) {
  max-width: 625px;
  width: 100%;
}

.exhibition-row.row-1 .exhibition-post:nth-of-type(3) {
  max-width: 310px;
  width: 100%;
}

.exhibition-row.row-2 .exhibition-post:nth-of-type(1),
.exhibition-row.row-4 .exhibition-post:nth-of-type(2) {
  max-width: 310px;
  width: 100%;
}

.exhibition-row.row-3 .exhibition-post:nth-of-type(1) {
  max-width: 307px;
  width: 100%;
}

.exhibition-row.row-3 .exhibition-post:nth-of-type(3),
.exhibition-row.row-4 .exhibition-post:nth-of-type(3) {
  max-width: 625px;
  width: 100%;
}

.exhibition-post.text_blocks_post {
  display: flex;
  padding: 24px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 32px;
  flex: 1 0 0;
  max-width: 310px;
  width: 100%;
  text-align: left;
}

.exhibition-post.text_blocks_post h3.text-block-title {
  color: #2c2801;
  font-family: Avenir, sans-serif;
  font-size: 40px;
  font-style: normal;
  font-weight: 900;
  line-height: 44px;
  margin: 0;
}

.exhibition-post.promotion {
  border-radius: 2px;
  background: #fe5000;
  display: flex;
  padding: 16px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  text-align: left;
}

.exhibition-post.promotion .promo-title {
  margin: 0;
  color: #fff;
  font-family: Avenir, sans-serif;
  font-size: 40px;
  font-style: normal;
  font-weight: 900;
  line-height: 44px; /* 110% */
}

.exhibition-post.promotion .promo-desc {
  color: #fff;
  font-family: Avenir, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 800;
  line-height: 24px; /* 150% */
}

/* Clickable Image */
.exhibition-post .image-container {
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 2px;
}

.exhibition-post .image-container img {
  width: 100%;
  height: 100% !important;
  object-fit: cover;
  transition: transform 0.3sease;
}

/* Card Header */
.exhibition-post .location {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #f8f8f8;
  position: absolute;
  top: 20px;
  left: 20px;
  padding: 8px 16px;
  color: #2c2801;
  font-family: Avenir, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 350;
  line-height: normal;
}

.exhibition-post .location img {
  width: 24px;
  height: 24px !important;
}

/* Price Container */

.exhibition-post .price-container {
  font-size: 16px;
  position: absolute;
  bottom: 16px;
  left: 16px;
  display: flex;
  align-items: center;
  gap: 4px;
}

.exhibition-post span.strikethrough-price {
  color: #2c2801;
  font-family: Avenir, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px; /* 150% */
  text-decoration: line-through;
  border-radius: 2px;
  background: #fff;
  display: flex;
  height: 38px;
  padding: 8px 12px;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

.exhibition-post .price-with-detail {
  display: flex;
  height: 38px;
  padding: 8px 12px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 2px;
  background: #fe5000;
  color: var(--White, #fff);
  font-family: Avenir, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
}

.exhibition-post .price-with-detail img.eggo--questionmark-icon {
  width: 16px;
  height: 16px;
}

/* select2 */

div#showroom-filter {
  color: rgba(36, 40, 45, 0.4);
  font-family: Avenir, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

.showroom-select {
  visibility: hidden;
}

.checkbox-dropdown {
  max-width: 629px;
  width: 100%;
  border: 1px solid #edeff1;
  padding: 16px;
  position: relative;
  margin: 0 auto;
  user-select: none;
  border-radius: 4px;
  text-align: left;
}

.dropdown-input {
  width: 100%;
  border: none;
  outline: none;
}

.checkbox-dropdown:after {
  content: "";
  height: 24px;
  position: absolute;
  width: 24px;
  margin-top: -3px;
  background: url(../images/arrow-drop-down.svg) no-repeat;
  background-size: 24px;
  top: 20px;
  right: 16px;
  z-index: 1;
}

.checkbox-dropdown.is-active:after {
  border-top-color: transparent;
  border-bottom-color: #2c2801;
}

.checkbox-dropdown-list {
  list-style: none;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: #fff;
  border-top: none;
  display: none;
  z-index: 100;
}

.checkbox-dropdown-list li {
  padding: 10px;
  cursor: pointer;
}

.checkbox-dropdown-list li:hover,
.checkbox-dropdown-list li.highlighted {
  background-color: #6e6809;
  color: white;
}

@media (max-width: 1024px) {
  .exhibition-post {
    flex: 1 1 calc(30% - 16px);
  }
}

@media (max-width: 768px) {
  .exhibition-row {
    flex-wrap: wrap;
  }

  .exhibition-post {
    max-width: 100% !important;
    flex: auto;
  }
}

/* side panel exhibition */

.sidepanel-map-section {
  width: 100%;
  padding: 32px 0;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

h3.sidepanel-showroom-title {
  color: #2c2801;
  text-align: center;
  font-family: "Avenir", Sans-serif;
  font-size: 32px;
  font-style: normal;
  font-weight: 800;
  line-height: 36px; /* 112.5% */
  margin: 0;
}

h3.sidepanel-showroom-title span {
  color: #fe5000;
  text-decoration-line: underline;
}

p.advantage-price {
  width: 100%;
  color: #2c2801;
  text-align: right;
  font-family: "Avenir", Sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

p.advantage-price span {
  color: #fe5000;
  font-family: "Avenir", Sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
}

button.gm-ui-hover-effect {
  display: none !important;
}

.custom-map-tooltip {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 16px;
}

h3.map_pin_title {
  color: #3e3904;
  text-align: center;
  font-family: "Avenir", Sans-serif;
  font-size: 32px;
  font-style: normal;
  font-weight: 800;
  line-height: 36px;
  margin: 0;
}

p.map_pin_address {
  color: #2c2801;
  font-family: "Avenir", Sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  text-align: center;
}

a.map_pin_peramlink {
  color: #fff;
  font-family: "Avenir", Sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
  display: flex;
  padding: 16px 24px 16px 18px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  border-radius: 2px;
  border: 1px solid #fff;
  background: #fe5000;
}

a.map_pin_googleurl {
  color: #fe5000;
  font-family: "Avenir", Sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
  text-decoration: underline !important;
}

.gm-style-iw.gm-style-iw-c {
  padding: 24px !important;
  max-width: 375px !important;
  width: 100% !important;
  max-height: 323px !important;
  border-radius: 24px;
}

.gm-style-iw-d {
  overflow: visible !important;
  max-height: 100% !important;
}

.gm-style-iw-chr {
  display: none;
}

/* 
* Eggo Map
*/

.gm-style-moc {
  display: none !important;
}

.custom-map-tooltip.eggo-map-tooltip {
  gap: 8px;
}

/* Ensure the container fills the whole screen */
div#showroom-container {
  position: relative;
  padding-top: 40px;
}

/* Fullscreen map */
div#eggo-map {
  width: 100%;
  height: 100%;
  position: absolute !important;
  left: 0;
  top: 0;
}

/* Showroom list positioned on top */
.showroom-selection-modal {
  margin: 0px 8%;
  max-width: 628px;
  width: 100%;
  border-radius: 8px 8px 0 0;
  background: #fff;
  box-shadow: 0px -2px 16px 0px rgba(0, 0, 0, 0.2);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: relative;
  z-index: 1;
  height: 733px;
  /* overflow-y: scroll; */
}

.showroom-selection-modal {
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* Internet Explorer and Edge */
}

.showroom-selection-modal::-webkit-scrollbar {
  display: none; /* Chrome, Safari */
}

h3.showrooms-modal-title {
  color: #2c2801;
  font-family: "Avenir", Sans-serif;
  font-size: 32px;
  font-style: normal;
  font-weight: 800;
  line-height: 36px; /* 112.5% */
  margin: 0;
}

/* Search container */
.filter-div {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* Wrapper for search field */
.search-wrapper {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  flex: 1 0 0;
}

/* Search input */
#showroom-search {
  width: 100%;
  padding: 16px 40px 16px;
  font-size: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1 0 0;
  border-radius: 4px;
  border: 1px solid #edeff1;
  background: #fff;
  font-family: "Avenir", Sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

/* Search icon inside input */
.showroom-selection-modal .search-icon {
  position: absolute;
  left: 10px;
  font-size: 16px;
  color: #666;
}

.showroom-selection-modal .submit-icon {
  position: absolute;
  right: 15px;
  font-size: 16px;
  cursor: pointer;
}

/* My Location Button */
#my-location-btn {
  border: none;
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  height: 56px;
  padding: 18px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  color: #fff;
  font-family: "Avenir", Sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
  border-radius: 2px;
  background: #6e6809;
}

.showroom-item {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
  gap: 16px;
  border-radius: 2px;
  background: var(--White, #fff);
  box-shadow: 0px 0px 4px 0px rgba(44, 40, 1, 0.2);
  cursor: pointer;
}

div#showroom-list {
  display: flex;
  flex-direction: column;
  gap: 24px;
  overflow-y: scroll;
}

.showroom-item img.showroom-img {
  width: 120px;
  height: 100%;
  object-fit: cover;
  border-radius: 2px;
}

h3.showroom-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  margin: 0;
  color: #3e3904;
  font-family: "Avenir", Sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 800;
  line-height: normal;
  text-transform: capitalize;
}

.showroom-distance {
  display: flex;
  align-items: center;
  gap: 4px;
  color: #6e6809;
  font-family: "Avenir", Sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 800;
  line-height: 24px;
}

p.showroom-status {
  display: flex;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  color: #9d9959;
  font-family: "Avenir", Sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 800;
  line-height: 24px; /* 150% */
}

p.showroom-status.inactive {
  color: rgba(0, 0, 0, 0.2);
}

.showrooms-detail {
  display: flex;
  padding: 16px 16px 16px 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  flex: 1 0 0;
}

p.showroom-address {
  color: #2c2801;
  font-family: "Avenir", Sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px; /* 150% */
}

span.showroom-distance {
  color: #6e6809;
  font-family: "Avenir", Sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 800;
  line-height: 24px; /* 150% */
}

a.showroom-link-icon {
  display: none;
  padding: 8px;
  align-items: center;
  gap: 10px;
  border-radius: 2px 0px 0px 0px;
  background: #fe5000;
  position: absolute;
  bottom: 0;
  right: 0;
}

a.map_pin_peramlink.eggo_map_pin_peramlink {
  border: 1px solid #fe5000;
  background: #fff;
  color: #fe5000;
}

a.eggo_map_pin_booking_btn {
  display: flex;
  padding: 16px 24px 16px 18px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  border-radius: 2px;
  background: #fe5000;
  color: #fff;
  font-family: "Avenir", Sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
}

#eggo-map .gm-style-iw.gm-style-iw-c {
  max-height: 393px !important;
}

.showroom-item.active {
  border: 1px solid #fe5000;
  box-shadow: 0px 0px 4px 0px rgba(44, 40, 1, 0.2);
}

button#my-location-btn:hover,
button#my-location-btn.active {
  background: #4e4907;
}

.toggle-buttons {
  display: none;
}

/* Responsive: Adjust for smaller screens */
@media (max-width: 768px) {
  div#showroom-container {
    position: relative;
    padding-top: 16px;
  }

  .showroom-selection-modal {
    padding: 16px;
    margin: 0 auto;
    height: auto;
    overflow-y: auto;
    box-shadow: none;
  }

  div#eggo-map {
    position: relative !important;
    height: 450px !important;
  }

  a.showroom-link-icon {
    display: flex;
  }

  .showroom-item img.showroom-img {
    display: none;
  }

  button#my-location-btn span.svg-locator {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  span.location-btn-text {
    display: none;
  }

  h3.showrooms-modal-title {
    text-align: center;
  }

  .toggle-buttons {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 24px;
    align-self: stretch;
  }

  .toggle-buttons .toggle-btn {
    display: flex;
    padding: 8px 24px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex: 1 0 0;
    color: #2c2801;
    text-align: center;
    font-family: "Avenir", Sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 150% */
    border-radius: 2px;
    border: 1px solid #6e6809;
    background: #fff;
  }

  .toggle-buttons .toggle-btn.active {
    color: #fff;
    background: #6e6809;
  }

  div#showroom-list {
    display: flex;
    margin-right: -16px;
    margin-left: -16px;
    gap: 8px;
  }

  #eggo-map {
    display: none;
  }

  .showroom-item.active {
    border: 0;
  }

  .showroom-item {
    border-radius: 0;
    padding: 16px 0 0 16px;
  }

  .showrooms-detail {
    padding: 0 16px 0 0;
  }

  p.showroom-address {
    max-width: 90%;
    margin-bottom: 16px;
  }

  a.eggo_map_pin_booking_btn,
  a.map_pin_peramlink,
  a.map_pin_googleurl {
    display: none;
  }

  h3.map_pin_title {
    font-size: 24px;
    line-height: normal;
  }

  .gm-style-iw.gm-style-iw-c {
    padding: 24px !important;
    max-width: 290px !important;
    width: 100% !important;
  }
}

.single-showrooms .elementor-element-34dd0c19 .elementor-widget-container {
  opacity: 0;
}

.single-showrooms
  .elementor-element-34dd0c19
  .elementor-widget-container.address-cleaned {
  opacity: 1;
}

.showroom-select-wrapper {
  max-width: 629px;
  margin: auto;
  width: 100%;
}

.choices__list--dropdown .choices__list,
.choices__list[aria-expanded] .choices__list {
  max-height: 200px !important;
}

.choices__list--dropdown {
  max-height: 260px; /* Or whatever height you want */
  overflow-y: auto;
}

.choices__list--dropdown,
.choices__list--single,
.choices__item {
  text-align: left !important;
}

.choices__list--dropdown .choices__item--selectable.is-highlighted,
.choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
  background-color: #6e6809 !important;
  color: white !important;
}

.choices__list--dropdown .choices__item[data-value=""] {
  display: none !important;
}

.choices__inner {
  padding: 16px 16px 16px 16px !important;
  background-color: transparent !important;
}

.showroom-select-wrapper .choices[data-type*="select-one"]::after {
  content: "";
  height: 24px;
  position: absolute;
  width: 24px;
  margin-top: -3px !important;
  background: url(../images/arrow-drop-down.svg) no-repeat;
  background-size: 24px;
  top: 20px;
  right: 10px;
  z-index: 1;
  border: none;
}