/* =========================================================
   BOAT FINDER MALTA
   CLEAN PREMIUM EXPERIENCE PAGE
   ========================================================= */


/* =========================================================
   GENERAL PAGE
   ========================================================= */

.experience-advanced-page {
  background: #F7FAFC !important;
  padding: 0 16px 40px !important;
}

.experience-wrapper {
  width: 100%;
  max-width: 1380px;
  margin: 0 auto;
}


/* =========================================================
   IMAGE GALLERY — GENERAL
   ========================================================= */

.experience-image-container-desktop,
.experience-image-container-mobile {
  overflow: hidden;
  margin-bottom: 20px;

  border-radius: 18px;

  box-shadow:
    0 10px 30px rgba(15, 23, 42, 0.10);
}


/* =========================================================
   ORIGINAL TITLE — DESKTOP
   ========================================================= */

.experience-title {
  margin: 0 0 14px !important;

  color: #0F172A !important;

  font-size: 32px !important;
  line-height: 1.02 !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
}


/* =========================================================
   MAIN CONTENT CARD
   ========================================================= */

.experience-body-left {
  padding: 22px !important;

  background: #FFFFFF !important;

  border: 1px solid rgba(15, 23, 42, 0.08) !important;
  border-radius: 20px !important;

  box-shadow:
    0 8px 24px rgba(15, 23, 42, 0.06) !important;
}


/* =========================================================
   DESCRIPTION
   ========================================================= */

.experience-body-left > p:first-of-type {
  margin: 0 0 18px !important;

  color: #475569 !important;

  font-size: 16px !important;
  line-height: 1.65 !important;
  font-weight: 500 !important;
}

.experience-body-left p {
  color: #475569 !important;

  font-size: 16px !important;
  line-height: 1.65 !important;
  font-weight: 500 !important;
}


/* =========================================================
   IMPORTANT INFORMATION CARD
   ========================================================= */

.experience-main-info-container {
  margin: 18px 0 24px !important;
  padding: 10px 18px !important;

  background:
    linear-gradient(
      180deg,
      #FFFFFF 0%,
      #FAFCFF 100%
    ) !important;

  border: 1px solid rgba(15, 23, 42, 0.08) !important;
  border-radius: 18px !important;

  box-shadow:
    0 8px 20px rgba(15, 23, 42, 0.05) !important;
}

.experience-main-info-container .info {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;

  padding: 14px 0 !important;

  border-bottom:
    1px solid rgba(15, 23, 42, 0.08) !important;
}

.experience-main-info-container .info:last-child {
  border-bottom: 0 !important;
}

.experience-main-info-container .label {
  min-width: 92px;

  color: #0F172A !important;

  font-weight: 800 !important;
}

.experience-main-info-container .text,
.experience-main-info-container .sub-text {
  color: #334155 !important;

  line-height: 1.5 !important;
  font-weight: 500 !important;
}

.experience-main-info-container a {
  color: #0F172A !important;

  font-weight: 700 !important;
  text-decoration: none !important;
}


/* =========================================================
   CONTENT SECTION HEADINGS
   ========================================================= */

.experience-body-left h2,
.experience-body-left h3 {
  position: relative;

  display: flex !important;
  align-items: center !important;
  gap: 10px !important;

  margin: 0 !important;
  padding: 10px 0 !important;

  color: #0F172A !important;

  font-size: 21px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;

  border-top: 0 !important;
}

.experience-body-left h2::before,
.experience-body-left h3::before {
  content: "";

  width: 10px;
  height: 10px;

  flex: 0 0 auto;

  background: #38BDF8;

  border-radius: 50%;

  box-shadow:
    0 0 0 4px rgba(56, 189, 248, 0.14);
}

.experience-body-left h2 + *,
.experience-body-left h3 + * {
  margin-top: 0 !important;
}


/* =========================================================
   LISTS
   ========================================================= */

.experience-body-left ul,
.experience-body-left ol {
  margin: 0 0 18px !important;
  padding-left: 18px !important;
}

.experience-body-left li {
  margin: 0 0 10px !important;
  padding-left: 2px !important;

  color: #334155 !important;

  font-size: 15.5px !important;
  line-height: 1.6 !important;
  font-weight: 500 !important;
}


/* =========================================================
   LINKS
   ========================================================= */

.experience-body-left a {
  color: #2563EB !important;

  font-weight: 700 !important;
  text-decoration: none !important;
}


/* =========================================================
   BOOKING AREA
   ========================================================= */

.experience-body-right,
.experience-bokun-widget {
  overflow: hidden !important;

  background: #FFFFFF !important;

  border: 1px solid rgba(15, 23, 42, 0.08) !important;
  border-radius: 20px !important;

  box-shadow:
    0 12px 30px rgba(15, 23, 42, 0.10) !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

  /* ---------------------------------------------------------
     PAGE
     --------------------------------------------------------- */

  .experience-advanced-page {
    min-height: 100vh !important;

    padding:
      0
      16px
      110px !important;

    background: #F7FAFC !important;
  }

  .experience-body {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .experience-body-line,
  .experience-body-line.full-width.start,
  .experience-body-line.start.full-width.two-columns,
  .experience-body-left,
  .experience-main-info,
  .experience-main-info-container {
    width: 100% !important;
    max-width: 100% !important;

    box-sizing: border-box !important;

    margin-left: 0 !important;
    margin-right: 0 !important;
  }


  /* ---------------------------------------------------------
     HIDE INTERNAL TRIP / HIGHLIGHTS NAVIGATION
     --------------------------------------------------------- */

  .experience-wrapper.mobile-view .experience-header-wrapper,
  .experience-wrapper.mobile-view .experience-header-padding,
  .experience-wrapper.small-screen .experience-header-wrapper,
  .experience-wrapper.small-screen .experience-header-padding {
    display: none !important;
  }


/* ---------------------------------------------------------
   MOBILE GALLERY
   Main image only
   --------------------------------------------------------- */

.experience-image-container-mobile {
  position: relative !important;

  width: 100% !important;
  min-height: 0 !important;

  margin: 6px 0 0 !important;

  overflow: hidden !important;

  background: #EAF0F5 !important;

  border-radius: 18px !important;

  box-shadow:
    0 10px 28px rgba(15, 23, 42, 0.10) !important;
}


/* ---------------------------------------------------------
   MAIN SWIPER
   --------------------------------------------------------- */

.experience-image-container-mobile
.experience-main-swiper,
.experience-image-container-mobile
.experience-main-swiper .swiper-wrapper,
.experience-image-container-mobile
.experience-main-swiper .swiper-slide {
  width: 100% !important;
}


.experience-image-container-mobile
.experience-main-swiper {
  overflow: hidden !important;

  border-radius: 18px !important;
}


/* ---------------------------------------------------------
   MAIN IMAGE
   --------------------------------------------------------- */

.experience-image-container-mobile
.experience-main-swiper img,

.experience-image-container-mobile
> img:first-child,

.experience-image-container-mobile
.main-image,

.experience-image-container-mobile
.experience-main-image {
  display: block !important;

  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;

  aspect-ratio: 16 / 10 !important;

  object-fit: cover !important;
  object-position: center !important;

  border-radius: 18px !important;
}


/* ---------------------------------------------------------
   HIDE THUMBNAILS
   --------------------------------------------------------- */

.experience-image-container-mobile
.experience-thumb-swiper,

.experience-image-container-mobile
.gallery-thumbnails,

.experience-image-container-mobile
.thumbnails,

.experience-image-container-mobile
.experience-thumbnails,

.experience-image-container-mobile
[class*="thumbnail"] {
  display: none !important;
}


/* =========================================================
   MOBILE — IMAGE COUNT
   ========================================================= */

.bfm-experience-image-count {
  position: absolute !important;

  top: auto !important;
  right: 11px !important;
  bottom: 11px !important;

  z-index: 25 !important;

  min-width: 42px !important;
  height: 29px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 0 9px !important;

  color: #17324D !important;

  background:
    rgba(255, 255, 255, 0.86) !important;

  border:
    1px solid rgba(255, 255, 255, 0.70) !important;

  border-radius: 999px !important;

  box-shadow:
    0 3px 10px rgba(15, 23, 42, 0.10) !important;

  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;

  font-size: 11.5px !important;
  line-height: 1 !important;
  font-weight: 800 !important;

  pointer-events: none !important;
}


/* =========================================================
   MOBILE — GALLERY ARROWS
   ========================================================= */

.experience-image-container-mobile
.swiper-button-prev,

.experience-image-container-mobile
.swiper-button-next {
  position: absolute !important;

  top: 50% !important;
  transform: translateY(-50%) !important;

  width: 30px !important;
  height: 30px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  margin: 0 !important;
  padding: 0 !important;

  color: #17324D !important;

  background:
    rgba(255, 255, 255, 0.74) !important;

  border:
    1px solid rgba(255, 255, 255, 0.60) !important;

  border-radius: 50% !important;

  box-shadow:
    0 3px 10px rgba(15, 23, 42, 0.10) !important;

  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;

  z-index: 20 !important;

  opacity: 0.82 !important;
}


/* Previous */
.experience-image-container-mobile
.swiper-button-prev {
  left: 9px !important;
}


/* Next */
.experience-image-container-mobile
.swiper-button-next {
  right: 9px !important;
}


/* Remove original arrow icons */
.experience-image-container-mobile
.swiper-button-prev .icon,

.experience-image-container-mobile
.swiper-button-next .icon {
  display: none !important;
}


/* Remove Swiper default arrows */
.experience-image-container-mobile
.swiper-button-prev::after,

.experience-image-container-mobile
.swiper-button-next::after {
  display: none !important;
  content: none !important;
}


/* ---------------------------------------------------------
   CLEAN CHEVRONS
   --------------------------------------------------------- */

.experience-image-container-mobile
.swiper-button-prev::before,

.experience-image-container-mobile
.swiper-button-next::before {
  content: "" !important;

  width: 7px !important;
  height: 7px !important;

  display: block !important;

  border: solid currentColor !important;
  border-width:
    0
    1.7px
    1.7px
    0 !important;
}


/* Left */
.experience-image-container-mobile
.swiper-button-prev::before {
  transform: rotate(135deg) !important;

  margin-left: 3px !important;
}


/* Right */
.experience-image-container-mobile
.swiper-button-next::before {
  transform: rotate(-45deg) !important;

  margin-right: 3px !important;
}


/* Touch feedback */
.experience-image-container-mobile
.swiper-button-prev:hover,

.experience-image-container-mobile
.swiper-button-next:hover,

.experience-image-container-mobile
.swiper-button-prev:active,

.experience-image-container-mobile
.swiper-button-next:active {
  opacity: 0.96 !important;

  background:
    rgba(255, 255, 255, 0.90) !important;
}


/* Disabled edge */
.experience-image-container-mobile
.swiper-button-disabled {
  opacity: 0.20 !important;

  pointer-events: none !important;
}


/* =========================================================
   MOBILE — REMOVE GALLERY PROGRESS BAR
   Image counter is enough
   ========================================================= */

.bfm-experience-gallery-progress {
  display: none !important;
}

  /* ---------------------------------------------------------
     ORIGINAL TOP TITLE
     Hidden because JS creates the new summary title
     --------------------------------------------------------- */

  .bfm-original-title-hidden {
    display: none !important;
  }


  /* ---------------------------------------------------------
     NEW TITLE + RATING SUMMARY
     --------------------------------------------------------- */

  .bfm-experience-summary {
    position: relative !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 14px 56px 10px 0 !important;

    box-sizing: border-box !important;
  }

  .bfm-experience-kicker {
    margin: 0 0 6px !important;

    color: #B08A2E !important;

    font-size: 12px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
  }

  .bfm-experience-summary-title {
    margin: 0 0 10px !important;

    color: #0F172A !important;

    font-size: 20px !important;
    line-height: 1.04 !important;
    font-weight: 800 !important;
    letter-spacing: -0.04em !important;
  }

  .bfm-experience-rating {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 5px !important;

    margin: 0 !important;

    color: #334155 !important;

    font-size: 12.5px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
  }

  .bfm-experience-rating-star {
    color: #D4A017 !important;

    font-size: 16px !important;
    line-height: 1 !important;
  }

  .bfm-experience-rating-score {
    color: #0F172A !important;
    font-weight: 800 !important;
  }

  .bfm-experience-rating-label {
    color: #475569 !important;
    font-weight: 700 !important;
  }

  .bfm-experience-rating-reviews {
    color: #2563EB !important;
    font-weight: 700 !important;
  }


/* =========================================================
   MOBILE — INFO CARD CONTACT ACTIONS
   WhatsApp / Ask AI / Share
   ========================================================= */

.bfm-experience-top-actions {
  display: flex !important;
  align-items: center !important;

  width: 100% !important;

  gap: 8px !important;

  margin: 4px 0 10px !important;
  padding: 4px 0 12px !important;

  border-bottom:
    1px solid rgba(15, 23, 42, 0.07) !important;
}


/* =========================================================
   MOBILE — CONTACT ACTION BASE STYLE
   ========================================================= */

.bfm-top-action {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 5px !important;

  min-height: 34px !important;

  padding: 7px 12px !important;

  border-radius: 999px !important;

  box-shadow: none !important;

  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 700 !important;

  text-decoration: none !important;

  white-space: nowrap !important;

  cursor: pointer !important;
}


/* =========================================================
   MOBILE — WHATSAPP ACTION
   ========================================================= */

.bfm-top-action-wa {
  color: #16834B !important;

  background:
    #F3FBF5 !important;

  border:
    1px solid rgba(22, 131, 75, 0.20) !important;
}


/* =========================================================
   MOBILE — ASK AI ACTION
   ========================================================= */

.bfm-top-action-ai {
  color: #315D82 !important;

  background:
    #F3F7FB !important;

  border:
    1px solid rgba(49, 93, 130, 0.18) !important;
}


/* =========================================================
   MOBILE — CUSTOM SHARE ACTION
   Secondary / intentionally quieter
   ========================================================= */

.bfm-top-action-share {
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;

  margin-left: auto !important;
  padding: 0 !important;

  color: #64748B !important;

  background:
    #F8FAFC !important;

  border:
    1px solid rgba(15, 23, 42, 0.09) !important;

  opacity: 0.78 !important;
}

.bfm-top-action-share svg {
  width: 16px !important;
  height: 16px !important;
}


/* =========================================================
   MOBILE — HIDE ORIGINAL SHARE BUTTON
   Prevent duplicate share control
   ========================================================= */

.experience-share,
.experience-share-button,
.share-button {
  display: none !important;
}
  /* ---------------------------------------------------------
     ORIGINAL DESCRIPTION CARD
     Keep this visible
     --------------------------------------------------------- */

  .experience-body-left {
    padding: 18px !important;

    background: #FFFFFF !important;

    border-radius: 18px !important;
  }

  .experience-body-left > p:first-of-type {
    display: block !important;

    margin: 0 0 18px !important;

    color: #475569 !important;

    font-size: 15px !important;
    line-height: 1.58 !important;
    font-weight: 500 !important;
  }


  /* ---------------------------------------------------------
     TOUR INFORMATION WRAPPER
     --------------------------------------------------------- */

  .experience-main-info {
    width: 100% !important;

    margin: 16px 0 18px !important;
    padding: 0 !important;

    background: transparent !important;

    border: 0 !important;

    box-shadow: none !important;
  }

  .experience-main-info-container {
    position: relative !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 7px 16px 16px !important;

    background:
      linear-gradient(
        180deg,
        #FFFFFF 0%,
        #FAFCFF 100%
      ) !important;

    border: 1px solid rgba(15, 23, 42, 0.08) !important;
    border-radius: 18px !important;

    box-shadow:
      0 10px 28px rgba(15, 23, 42, 0.07) !important;
  }

  .experience-main-info-container .info {
    display: grid !important;

    grid-template-columns:
      22px
      76px
      minmax(0, 1fr) !important;

    align-items: start !important;
    gap: 10px !important;

    width: 100% !important;

    padding: 14px 0 !important;

    border-bottom:
      1px solid rgba(15, 23, 42, 0.07) !important;
  }

  .experience-main-info-container .info:last-of-type {
    border-bottom: 0 !important;
  }

  .experience-main-info-container .icon {
    width: 20px !important;
    min-width: 20px !important;

    color: #315D82 !important;
  }

  .experience-main-info-container .label {
    min-width: 0 !important;

    color: #64748B !important;

    font-size: 12px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
  }

  .experience-main-info-container .text,
  .experience-main-info-container .sub-text {
    min-width: 0 !important;

    color: #0F172A !important;

    font-size: 13px !important;
    line-height: 1.42 !important;
    font-weight: 700 !important;
  }

  .experience-main-info-container a {
    color: #17324D !important;

    font-weight: 700 !important;

    text-decoration: underline !important;
    text-decoration-color:
      rgba(23, 50, 77, 0.28) !important;
    text-underline-offset: 2px !important;
  }


  /* ---------------------------------------------------------
     CHECK AVAILABILITY
     --------------------------------------------------------- */

  .bfm-experience-check-button {
    width: 100% !important;
    min-height: 50px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;

    margin: 11px 0 0 !important;
    padding: 14px 18px !important;

    box-sizing: border-box !important;

    color: #3F300D !important;

    background:
      linear-gradient(
        180deg,
        #F8E39A 0%,
        #E6BA25 100%
      ) !important;

    border: 1px solid rgba(176, 138, 46, 0.32) !important;
    border-radius: 999px !important;

    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.48),
      0 7px 18px rgba(176, 138, 46, 0.18) !important;

    font-size: 14px !important;
    line-height: 1 !important;
    font-weight: 800 !important;

    text-decoration: none !important;

    -webkit-tap-highlight-color: transparent;
  }

  .bfm-experience-check-button svg {
    width: 18px !important;
    height: 18px !important;

    flex: 0 0 auto !important;
  }


  /* ---------------------------------------------------------
     BENEFITS
     --------------------------------------------------------- */

  .bfm-experience-benefits {
    display: grid !important;

    grid-template-columns:
      repeat(3, minmax(0, 1fr)) !important;

    gap: 0 !important;

    width: 100% !important;

    margin: 14px 0 0 !important;
    padding: 13px 8px !important;

    box-sizing: border-box !important;

    background: #F5F9FC !important;

    border: 1px solid rgba(15, 23, 42, 0.06) !important;
    border-radius: 14px !important;
  }

  .bfm-experience-benefit {
    min-width: 0 !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 5px !important;

    padding: 0 7px !important;

    text-align: center !important;
  }

  .bfm-experience-benefit +
  .bfm-experience-benefit {
    border-left:
      1px solid rgba(15, 23, 42, 0.07) !important;
  }

  .bfm-experience-benefit svg {
    width: 19px !important;
    height: 19px !important;

    color: #315D82 !important;
  }

  .bfm-experience-benefit:first-child svg {
    color: #16A34A !important;
  }

  .bfm-experience-benefit strong {
    color: #0F172A !important;

    font-size: 10.5px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
  }

  .bfm-experience-benefit span {
    color: #64748B !important;

    font-size: 9.5px !important;
    line-height: 1.25 !important;
    font-weight: 500 !important;
  }


/* ---------------------------------------------------------
   ORIGINAL BACK BUTTON
   Hide Bókun original button
   --------------------------------------------------------- */

.experience-wrapper
.call-to-action.back-button {
  display: none !important;
}

/* =========================================================
   EXPERIENCE CLOSE BUTTON
   Premium X + Close pill
   ========================================================= */

.bfm-experience-close {
  position: absolute !important;

  top: 18px !important;
  right: 0 !important;
  left: auto !important;

  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 32px !important;

  margin: 0 !important;
  padding: 0 11px 0 9px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 5px !important;

  box-sizing: border-box !important;

  color: #FFFFFF !important;

  background:
    linear-gradient(
      180deg,
      #234664 0%,
      #17324D 100%
    ) !important;

  border:
    1px solid rgba(15, 23, 42, 0.14) !important;

  border-radius: 999px !important;

  box-shadow:
    0 5px 14px rgba(15, 23, 42, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;

  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 700 !important;

  white-space: nowrap !important;

  z-index: 20 !important;

  cursor: pointer !important;
}



/* X icon */

.bfm-experience-close svg {
  display: block !important;

  width: 14px !important;
  height: 14px !important;

  flex: 0 0 14px !important;

  color: #FFFFFF !important;

  fill: none !important;
  stroke: currentColor !important;
}


/* Text */

.bfm-experience-close span {
  display: block !important;

  margin: 0 !important;
  padding: 0 !important;

  color: #FFFFFF !important;

  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 700 !important;

  white-space: nowrap !important;
}


/* Hover */

.bfm-experience-close:hover {
  color: #FFFFFF !important;

  background:
    linear-gradient(
      180deg,
      #294F70 0%,
      #1B3957 100%
    ) !important;

  transform: translateY(-1px) !important;
}


/* Touch */

.bfm-experience-close:active {
  transform: scale(0.96) !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

  .bfm-experience-close {
    top: 6px !important;
    right: 0 !important;

    height: 30px !important;

    padding: 0 10px 0 8px !important;

    gap: 4px !important;
  }

  .bfm-experience-close svg {
    width: 10px !important;
    height: 10px !important;

    flex-basis: 10px !important;
  }

  .bfm-experience-close span {
    font-size: 10.5px !important;
  }

}


/* ---------------------------------------------------------
   TITLE CONTENT
   Keep normal document flow
   --------------------------------------------------------- */

.bfm-experience-kicker,
.bfm-experience-summary-title,
.bfm-experience-rating {
  position: relative !important;
  z-index: 1 !important;
}
  /* ---------------------------------------------------------
     ACCORDION SPACING
     --------------------------------------------------------- */

  .experience-body-left
  .elementor-tab-content,
  .experience-body-left
  .elementor-toggle-content,
  .experience-body-left
  .elementor-accordion-content {
    min-height: 0 !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;
  }

  .experience-body-left h2,
  .experience-body-left h3 {
    margin: 0 !important;
    padding: 8px 0 !important;

    font-size: 20px !important;

    border-top: 0 !important;
  }

  .experience-body-left .section,
  .experience-body-left .section-body,
  .experience-body-left .section-body.text,
  .experience-body-left
  .section-body.text.content {
    margin-top: 0 !important;
    margin-bottom: 6px !important;

    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }


  /* ---------------------------------------------------------
     CUSTOM LIST BULLETS
     --------------------------------------------------------- */

  .experience-body-left ul,
  .experience-body-left ol {
    list-style: none !important;

    padding-left: 0 !important;
    margin-left: 0 !important;
  }

  .experience-body-left li {
    position: relative;

    padding-left: 18px !important;
    margin: 0 0 10px !important;
  }

  .experience-body-left li::marker {
    content: "" !important;
    font-size: 0 !important;
  }

.experience-body-left li::before {
  content: "";

  position: absolute;

  left: 0;
  top: 0.65em;

  width: 6px;
  height: 6px;

  background: #38BDF8;

  border-radius: 50%;

  transform: translateY(-50%);
}


  /* Included */
  .experience-included h2::before,
  .experience-included h3::before,
  .experience-included li::before {
    background: #22C55E !important;
  }

  .experience-included h2::before,
  .experience-included h3::before {
    box-shadow:
      0 0 0 4px rgba(34, 197, 94, 0.14) !important;
  }


  /* Excluded */
  .experience-excluded h2::before,
  .experience-excluded h3::before,
  .experience-excluded li::before {
    background: #EF4444 !important;
  }

  .experience-excluded h2::before,
  .experience-excluded h3::before {
    box-shadow:
      0 0 0 4px rgba(239, 68, 68, 0.14) !important;
  }


  /* Highlights */
  .experience-highlights h2::before,
  .experience-highlights h3::before,
  .experience-highlights li::before {
    background: #D4A017 !important;
  }

  .experience-highlights h2::before,
  .experience-highlights h3::before {
    box-shadow:
      0 0 0 4px rgba(212, 160, 23, 0.14) !important;
  }


  /* Cancellation */
  .experience-cancellation li:first-child,
  .experience-cancellation p:first-child {
    color: #0F172A !important;

    font-weight: 700 !important;
  }

  .experience-cancellation strong,
  .experience-cancellation b {
    color: #16A34A !important;

    font-weight: 800 !important;
  }

/* =========================================================
   MOBILE — ITINERARY
   Premium compact vertical timeline
   ========================================================= */


/* ---------------------------------------------------------
   MAIN ITINERARY CONTENT
   --------------------------------------------------------- */

.experience-itinerary .section-body.content,
.experience-itinerary .itinerary-list {
  position: relative !important;

  margin: 0 !important;
  padding-top: 4px !important;
  padding-bottom: 2px !important;
}


/* ---------------------------------------------------------
   ITINERARY ITEM
   Compact spacing
   --------------------------------------------------------- */

.experience-itinerary .itinerary-item {
  position: relative !important;

  display: flex !important;
  align-items: flex-start !important;

  gap: 16px !important;

  margin: 0 !important;
  padding: 0 0 12px !important;

  min-height: 0 !important;
}


/* ---------------------------------------------------------
   START + END MARKERS
   Premium stronger markers
   --------------------------------------------------------- */

.experience-itinerary .itinerary-starting-icon,
.experience-itinerary .itinerary-ending-icon {
  position: relative !important;
  z-index: 3 !important;

  width: 16px !important;
  min-width: 16px !important;
  height: 16px !important;

  flex: 0 0 16px !important;

  margin: 1px 0 0 !important;
  padding: 0 !important;

  background: #FFFFFF !important;
  background-image: none !important;

  border: 2px solid #17324D !important;
  border-radius: 50% !important;

  box-sizing: border-box !important;

  box-shadow:
    0 0 0 3px rgba(23, 50, 77, 0.07) !important;
}


/* Inner dot */
.experience-itinerary .itinerary-starting-icon::after,
.experience-itinerary .itinerary-ending-icon::after {
  content: "";

  position: absolute;

  top: 50%;
  left: 50%;

  width: 6px;
  height: 6px;

  transform: translate(-50%, -50%);

  background: #17324D;

  border-radius: 50%;
}


/* =========================================================
   MOBILE — NORMAL ITINERARY STOP ICONS
   Correct Bókun class
   ========================================================= */

.experience-itinerary .icon.itinerary-stop {
  position: relative !important;
  z-index: 3 !important;

  width: 14px !important;
  min-width: 14px !important;
  height: 14px !important;

  flex: 0 0 14px !important;

  margin: 2px 0 0 1px !important;
  padding: 0 !important;

  background: #FFFFFF !important;
  background-image: none !important;

  border: 2px solid #67C7EC !important;
  border-radius: 50% !important;

  box-sizing: border-box !important;

  box-shadow: none !important;
}


/* ---------------------------------------------------------
   ROUTE LINE
   Align through marker centres
   --------------------------------------------------------- */

.experience-itinerary .itinerary-list::before {
  content: "" !important;

  position: absolute !important;

  top: 9px !important;
  bottom: 9px !important;
  left: 7px !important;

  width: 3px !important;

  background: #B9DEED !important;

  border-radius: 999px !important;

  z-index: 0 !important;
}


/* Remove possible duplicate external route lines */
.experience-itinerary .itinerary-item::before {
  display: none !important;
}


/* ---------------------------------------------------------
   ITEM CONTENT
   --------------------------------------------------------- */

.experience-itinerary .item-content {
  flex: 1 1 auto !important;

  min-width: 0 !important;

  margin: 0 !important;
  padding: 0 !important;
}


/* ---------------------------------------------------------
   STOP TITLE
   --------------------------------------------------------- */

.experience-itinerary .title {
  margin: 0 0 2px !important;
  padding: 0 !important;

  color: #17324D !important;

  font-size: 13px !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;

  letter-spacing: -0.01em !important;
}


/* ---------------------------------------------------------
   SECONDARY DESCRIPTION
   --------------------------------------------------------- */

.experience-itinerary .description,
.experience-itinerary .short-description {
  margin: 0 0 2px !important;
  padding: 0 !important;

  color: #64748B !important;

  font-size: 12px !important;
  line-height: 1.4 !important;
  font-weight: 500 !important;
}


/* ---------------------------------------------------------
   SEE MORE
   Small secondary action
   --------------------------------------------------------- */

.experience-itinerary .see-more {
  display: inline-flex !important;
  align-items: center !important;

  margin: 1px 0 0 !important;
  padding: 0 !important;

  color: #315D82 !important;

  font-size: 11px !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;

  text-decoration: none !important;
}

.experience-itinerary .see-more::after {
  content: "›";

  margin-left: 3px;

  font-size: 13px;
  line-height: 1;
}


/* ---------------------------------------------------------
   LAST ITEM
   Remove unnecessary bottom gap
   --------------------------------------------------------- */

.experience-itinerary .itinerary-item:last-child {
  padding-bottom: 2px !important;
}


/* ---------------------------------------------------------
   HIDE ITINERARY MAP ON MOBILE
   --------------------------------------------------------- */

.experience-itinerary iframe,
.experience-itinerary .itinerary-map,
.experience-itinerary .experience-map,
.experience-itinerary [class*="google-map"] {
  display: none !important;
}


/* =========================================================
   MOBILE — TOUR DURATION
   Final layout: label first line, full value underneath
   ========================================================= */

.experience-main-info-container .experience-duration {
    display: grid !important;
    grid-template-columns: 22px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;

    column-gap: 10px !important;
    row-gap: 4px !important;

    align-items: start !important;
    width: 100% !important;
  }

  .experience-main-info-container
  .experience-duration
  .duration-icon {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;

    width: 22px !important;
    min-width: 22px !important;

    margin-top: 1px !important;
  }

  .experience-main-info-container
  .experience-duration
  .duration-label {
    grid-column: 2 !important;
    grid-row: 1 !important;

    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #64748B !important;

    font-size: 12px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;

    white-space: nowrap !important;
  }

  .experience-main-info-container
  .experience-duration
  .duration-text {
    grid-column: 2 !important;
    grid-row: 2 !important;

    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #0F172A !important;

    font-size: 13px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;

    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
  }

/* =========================================================
   MOBILE — OPERATOR
   Same layout as Tour Duration
   ========================================================= */

@media (max-width: 767px) {

  .experience-main-info-container
  .experience-operator {
    display: grid !important;

    grid-template-columns:
      22px
      minmax(0, 1fr) !important;

    grid-template-rows:
      auto
      auto !important;

    column-gap: 10px !important;
    row-gap: 4px !important;

    align-items: start !important;

    width: 100% !important;
  }


  /* Icon */
  .experience-main-info-container
  .experience-operator
  .operator-icon {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;

    width: 22px !important;
    min-width: 22px !important;

    margin-top: 1px !important;
  }


  /* Label */
  .experience-main-info-container
  .experience-operator
  .operator-label {
    grid-column: 2 !important;
    grid-row: 1 !important;

    width: auto !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #64748B !important;

    font-size: 12px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;

    white-space: nowrap !important;
  }


  /* Operator name */
  .experience-main-info-container
  .experience-operator
  .operator-text {
    grid-column: 2 !important;
    grid-row: 2 !important;

    width: auto !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #0F172A !important;

    font-size: 13px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;

    white-space: normal !important;
  }

}
/* =========================================================
   MOBILE — DEPARTURE POINT
   Label first line, address underneath, map icon right
   ========================================================= */

.experience-starting-from-container {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 30px !important;

    column-gap: 10px !important;

    align-items: center !important;
  }

  .experience-starting-from {
    display: grid !important;
    grid-template-columns: 22px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;

    column-gap: 10px !important;
    row-gap: 3px !important;

    align-items: start !important;
  }

  .experience-starting-from .start-from-icon {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;

    width: 22px !important;
    min-width: 22px !important;

    margin-top: 1px !important;
  }

  .experience-starting-from .start-from-label {
    grid-column: 2 !important;
    grid-row: 1 !important;

    margin: 0 !important;

    color: #64748B !important;

    font-size: 12px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
  }

  .experience-starting-from .text.start-from {
    grid-column: 2 !important;
    grid-row: 2 !important;

    margin: 0 !important;
  }

  .experience-starting-from .address,
  .experience-starting-from .city {
    margin: 0 !important;

    color: #0F172A !important;

    font-size: 13px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
  }

  .experience-show-map {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 30px !important;
    height: 30px !important;

    margin: 0 !important;
  }

  .experience-show-map .text {
    display: none !important;
  }

/* =========================================================
   MOBILE — HIDE OPERATOR ROW
   Language independent
   ========================================================= */

  .experience-main-info-container
  .info.experience-operator {
    display: none !important;
  }


/* =========================================================
   MOBILE — SELLING INTRO
   Stronger and clearer marketing description
   ========================================================= */

.experience-excerpt {
    margin: 0 0 16px !important;
  }

  .experience-excerpt > .text {
    color: #334155 !important;

    font-size: 15.5px !important;
    line-height: 1.62 !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
  }

  .experience-excerpt::before {
    content: "Why you'll love this tour";

    display: block;

    margin: 0 0 8px !important;

    color: #B08A2E !important;

    font-size: 11px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    letter-spacing: 0.10em !important;
    text-transform: uppercase !important;
  }

/* =========================================================
   MOBILE — LOWER CONTENT PREMIUM FINISH
   Highlights / Itinerary / Details / Included / Excluded /
   Requirements / Cancellation
   ========================================================= */


/* ---------------------------------------------------------
   SECTION SURFACES
   Consistent premium card treatment
   --------------------------------------------------------- */

.experience-highlights,
.experience-itinerary,
.experience-details,
.experience-included,
.experience-excluded,
.experience-requirements,
.experience-cancellation {
  margin: 10px 0 !important;
  padding: 14px 16px !important;

  background:
    linear-gradient(
      180deg,
      #FFFFFF 0%,
      #FBFCFE 100%
    ) !important;

  border:
    1px solid rgba(15, 23, 42, 0.06) !important;

  border-radius: 16px !important;

  box-shadow:
    0 6px 18px rgba(15, 23, 42, 0.045) !important;
}


/* ---------------------------------------------------------
   SECTION HEADINGS
   Same typography across all sections
   --------------------------------------------------------- */

.experience-highlights h2,
.experience-highlights h3,
.experience-itinerary h2,
.experience-itinerary h3,
.experience-details h2,
.experience-details h3,
.experience-included h2,
.experience-included h3,
.experience-excluded h2,
.experience-excluded h3,
.experience-requirements h2,
.experience-requirements h3,
.experience-cancellation h2,
.experience-cancellation h3 {
  margin: 0 !important;
  padding: 6px 0 !important;

  color: #0F172A !important;

  font-size: 20px !important;
  line-height: 1.15 !important;
  font-weight: 800 !important;

  border: 0 !important;
}


/* ---------------------------------------------------------
   SECTION HEADER WRAPPERS
   Normalize Bókun internal spacing
   --------------------------------------------------------- */

.experience-highlights .experience-list-header,
.experience-itinerary .experience-list-header,
.experience-details .experience-list-header,
.experience-included .experience-list-header,
.experience-excluded .experience-list-header,
.experience-requirements .experience-list-header,
.experience-cancellation .experience-list-header {
  margin: 0 !important;
  padding: 0 !important;
}


/* ---------------------------------------------------------
   SECTION BODY SPACING
   Keep content close to the heading
   --------------------------------------------------------- */

.experience-highlights .section-body,
.experience-itinerary .section-body,
.experience-details .section-body,
.experience-included .section-body,
.experience-excluded .section-body,
.experience-requirements .section-body,
.experience-cancellation .section-body {
  margin-top: 6px !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
}


/* ---------------------------------------------------------
   CONTENT LISTS
   More compact and consistent
   --------------------------------------------------------- */

.experience-highlights li,
.experience-details li,
.experience-included li,
.experience-excluded li,
.experience-requirements li,
.experience-cancellation li {
  margin-bottom: 8px !important;

  color: #334155 !important;

  font-size: 15px !important;
  line-height: 1.5 !important;
  font-weight: 500 !important;
}


/* ---------------------------------------------------------
   HIGHLIGHTS — SEE FULL DESCRIPTION
   Bring link closer to the list
   --------------------------------------------------------- */

.experience-highlights .see-more,
.experience-highlights a {
  margin-top: 6px !important;
}


/* ---------------------------------------------------------
   REMOVE OLD BÓKUN DIVIDER EFFECTS
   Avoid mixed visual styles
   --------------------------------------------------------- */

.experience-details,
.experience-requirements {
  border-bottom-color:
    rgba(15, 23, 42, 0.06) !important;
}

.experience-details::after,
.experience-requirements::after {
  display: none !important;
}

/* =========================================================
   MOBILE — EXPERIENCE SMOOTH LOADING
   Full loading surface below header
   ========================================================= */

html,
body {
  background: #F8FBFF !important;
}


/* ---------------------------------------------------------
   EXPERIENCE PAGE MINIMUM HEIGHT
   Prevent page collapsing while Bókun is loading
   --------------------------------------------------------- */

.experience-advanced-page {
  position: relative !important;

  min-height: calc(100svh - 72px) !important;

  background: #F8FBFF !important;
}


/* ---------------------------------------------------------
   HIDE EXPERIENCE CONTENT UNTIL READY
   --------------------------------------------------------- */

.experience-advanced-page
.experience-wrapper.mobile-view
.experience-body {
  opacity: 0 !important;
  visibility: hidden !important;

  transition:
    opacity 280ms ease !important;
}


/* ---------------------------------------------------------
   REVEAL FINAL EXPERIENCE
   --------------------------------------------------------- */

.experience-advanced-page.bfm-experience-ready
.experience-wrapper.mobile-view
.experience-body {
  opacity: 1 !important;
  visibility: visible !important;
}


/* ---------------------------------------------------------
   LOADING CURTAIN
   Covers EVERYTHING below the main header
   --------------------------------------------------------- */

.experience-advanced-page:not(.bfm-experience-ready)::before {
  content: "";

  position: fixed !important;

  top: 72px !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;

  z-index: 99980 !important;

  background:
    linear-gradient(
      180deg,
      #F8FBFF 0%,
      #FBFCFE 45%,
      #FFFFFF 100%
    ) !important;

  pointer-events: none !important;
}


/* ---------------------------------------------------------
   LOADING SPINNER
   --------------------------------------------------------- */

.experience-advanced-page:not(.bfm-experience-ready)::after {
  content: "";

  position: fixed !important;

  top: 48% !important;
  left: 50% !important;

  width: 28px !important;
  height: 28px !important;

  margin:
    -14px
    0
    0
    -14px !important;

  box-sizing: border-box !important;

  border:
    3px solid rgba(37, 99, 235, 0.14) !important;

  border-top-color:
    #2563EB !important;

  border-radius: 50% !important;

  z-index: 99990 !important;

  animation:
    bfmExperienceLoadingSpin
    0.75s
    linear
    infinite !important;
}


/* ---------------------------------------------------------
   REMOVE LOADING ELEMENTS WHEN READY
   --------------------------------------------------------- */

.experience-advanced-page.bfm-experience-ready::before,
.experience-advanced-page.bfm-experience-ready::after {
  display: none !important;
}

/* ---------------------------------------------------------
   SPINNER ANIMATION
   --------------------------------------------------------- */

@keyframes bfmExperienceLoadingSpin {

  to {
    transform: rotate(360deg);
  }

}





/* =====================================================
   BOAT FINDER MALTA – MOBILE FILTER REDESIGN
   ===================================================== */

@media (max-width: 767px){

/* Main drawer */
#filterSidebar{
    background:#F8FBFF !important;
    border-radius:24px 24px 0 0 !important;
    overflow:hidden !important;
}

/* =====================================================
   HEADER
   ===================================================== */

#filterSidebar .filter-header{
    position:relative !important;

    min-height:64px !important;
    padding:10px 62px 10px 18px !important;

    display:flex !important;
    align-items:center !important;
    gap:12px !important;

    background:#FFFFFF !important;
    border-bottom:1px solid #E5E7EB !important;
    box-shadow:0 4px 14px rgba(15,23,42,.07) !important;
}

/* Replace original title with Filters */
#filterSidebar .filter-header-text{
    flex:1 1 auto !important;

    font-size:0 !important;
    line-height:1 !important;

    color:#0F172A !important;
}

#filterSidebar .filter-header-text::after{
    content:"Filters";

    font-size:18px !important;
    line-height:1.2 !important;
    font-weight:800 !important;
    letter-spacing:-0.02em !important;

    color:#0F172A !important;
}

/* Clear all stays safely in header */
#filterSidebar #clearFilters,
#filterSidebar .clear-btn{
    position:static !important;

    width:auto !important;
    height:auto !important;

    margin:0 !important;
    padding:8px 4px !important;

    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    background:transparent !important;
    border:0 !important;

    color:#2563EB !important;

    font-size:15px !important;
    line-height:1 !important;
    font-weight:700 !important;

    text-decoration:none !important;
    white-space:nowrap !important;

    z-index:auto !important;
}

/* Close button */
#filterSidebar #closeFilter,
#filterSidebar .close-btn{
    position:absolute !important;
    top:50% !important;
    right:12px !important;
    transform:translateY(-50%) !important;

    width:42px !important;
    height:42px !important;
    min-width:42px !important;

    margin:0 !important;
    padding:0 !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    background:#F1F5F9 !important;
    border:0 !important;
    border-radius:50% !important;

    color:transparent !important;
    font-size:0 !important;

    z-index:20 !important;
}

/* Clean custom X */
#filterSidebar #closeFilter::before,
#filterSidebar #closeFilter::after,
#filterSidebar .close-btn::before,
#filterSidebar .close-btn::after{
    content:"" !important;
    position:absolute !important;

    width:18px !important;
    height:2px !important;

    background:#0F172A !important;
    border-radius:99px !important;
}

#filterSidebar #closeFilter::before,
#filterSidebar .close-btn::before{
    transform:rotate(45deg) !important;
}

#filterSidebar #closeFilter::after,
#filterSidebar .close-btn::after{
    transform:rotate(-45deg) !important;
}

/* =====================================================
   BODY
   ===================================================== */

#filterSidebar .filter-body{
    background:#F8FBFF !important;
}

#filterSidebar .filter-body-left{
    padding-bottom:110px !important;
}

/* Section heading */
#filterSidebar button.accordion{
    width:calc(100% - 24px) !important;

    margin:12px 12px 0 !important;
    padding:17px 18px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;

    background:#FFFFFF !important;
    color:#0F172A !important;

    border:0 !important;
    border-radius:18px !important;

    font-size:20px !important;
    line-height:1.2 !important;
    font-weight:800 !important;
    letter-spacing:-0.02em !important;

    box-shadow:0 8px 20px rgba(15,23,42,.07) !important;
}

/* Keep Bókun arrow, only improve its background */
#filterSidebar button.accordion .indicator{
    width:34px !important;
    height:34px !important;
    min-width:34px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    margin-left:12px !important;

    background:#EFF6FF !important;
    border-radius:50% !important;
}

/* Restore original arrow rendering */
#filterSidebar button.accordion .indicator .vector-icon{
    border:initial !important;
    transform:initial !important;
}

/* Section content */
#filterSidebar .filter-panel{
    width:calc(100% - 24px) !important;

    margin:10px 12px 14px !important;
    padding:10px 14px 12px !important;

    background:#FFFFFF !important;
    border-radius:0 0 18px 18px !important;
}

/* =====================================================
   FILTER OPTIONS
   ===================================================== */

#filterSidebar .panel-filter{
    width:100% !important;
    min-height:42px !important;

    display:flex !important;
    align-items:center !important;

    margin:1px 0 !important;
    padding:9px 8px !important;

    background:transparent !important;
    border:0 !important;
    border-radius:12px !important;

    box-shadow:none !important;
}

/* Checkbox */
#filterSidebar .panel-filter .checkbox{
    width:16px !important;
    height:16px !important;
    min-width:16px !important;

    margin-right:8px !important;

    background:#FFFFFF !important;
    border:1.5px solid #64748B !important;
    border-radius:4px !important;
}

/* Text */
#filterSidebar .panel-filter-text{
    flex:1 !important;

    color:#334155 !important;

    font-size:15px !important;
    line-height:1.25 !important;
    font-weight:500 !important;
}

/* Counter */
#filterSidebar .panel-filter-counter{
    margin-left:10px !important;

    color:#64748B !important;

    font-size:15px !important;
    font-weight:500 !important;

    opacity:.84 !important;
}

/* Selected row */
#filterSidebar .panel-filter.checked{
    background:#F5F9FF !important;
}

#filterSidebar .panel-filter.checked .checkbox{
    background:#2563EB !important;
    border-color:#2563EB !important;
}

/* Do not add a second CSS tick */
#filterSidebar .panel-filter.checked .checkbox::after{
    content:none !important;
    display:none !important;
}

#filterSidebar .panel-filter.checked .panel-filter-text{
    color:#2563EB !important;
    font-weight:600 !important;
}

#filterSidebar .panel-filter.checked .panel-filter-counter{
    color:#2563EB !important;
    font-weight:600 !important;
    opacity:.80 !important;
}

/* Disabled */
#filterSidebar .panel-filter.disabled{
    opacity:.42 !important;
}

/* =====================================================
   SHOW ALL
   ===================================================== */

#filterSidebar .filter-panel .show-all,
#filterSidebar .filter-panel .show-more{
    display:inline-flex !important;
    align-items:center !important;
    gap:7px !important;

    min-height:36px !important;

    margin-top:6px !important;
    padding:7px 11px !important;

    background:#EFF6FF !important;
    border:0 !important;
    border-radius:10px !important;

    color:#2563EB !important;

    font-size:14px !important;
    font-weight:700 !important;

    text-decoration:none !important;
}

/* =====================================================
   FOOTER
   ===================================================== */

#filterSidebar .filter-footer{
    z-index:80 !important;

    background:rgba(255,255,255,.97) !important;
    border-top:1px solid #E5E7EB !important;

    padding:
        10px
        14px
        calc(10px + env(safe-area-inset-bottom))
        14px !important;

    box-shadow:0 -8px 24px rgba(15,23,42,.08) !important;

    -webkit-backdrop-filter:blur(12px) !important;
    backdrop-filter:blur(12px) !important;
}

#filterSidebar .filter-footer-inner{
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
}

/* Results button */
#filterSidebar .filter-footer button,
#filterSidebar .filter-footer .button{
    width:100% !important;
    min-height:52px !important;

    margin:0 !important;
    padding:0 18px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    background:#2563EB !important;
    color:#FFFFFF !important;

    border:0 !important;
    border-radius:14px !important;

    font-size:16px !important;
    line-height:1.2 !important;
    font-weight:800 !important;

    box-shadow:0 8px 20px rgba(37,99,235,.24) !important;
}
/* Keep filter window above the chat button */
#filterSidebar{
    position:fixed !important;
    z-index:999999 !important;
}
}
