/*
  Theme Name: 3PM - MG Template Child
  Theme URI: https://3phasemarketing.com.au/
  Template: auto-website-template
  Description: Child theme of Auto Template
  Author: 3 Phase Marketing
  Author URI: https://3phasemarketing.com.au/
  Version: 1.0.1
*/

/* ===========================
Mobile Nav
=========================== */

/* Colour for Ham Menu & X Button */
.wp-block-navigation__responsive-container-open svg,
.has-modal-open .wp-block-navigation__responsive-container-open:before {
  fill: #fff;
  color: #fff;
}

.has-modal-open .wp-block-navigation__responsive-container-open:before {
  content: "\2715";
  font-size: 18px;
}

/* -- Mobile Nav: Button Outline  -- */
.wp-block-navigation__responsive-container
  .wp-block-navigation__responsive-container-content
  .btn-outline
  .wp-block-navigation-item__content {
  border: 1px solid #fff;
  color: #ffffff;
}

/* -- Mobile Nav: Primary Button  -- */
.wp-block-navigation__responsive-container
  .wp-block-navigation__responsive-container-content
  .btn-solid
  .wp-block-navigation-item__content {
  border: 1px solid #ffffff;
  background-color: #ffffff;
  color: #292929;
}

@media (max-width: 1199px) {
  .wp-block-navigation__responsive-container {
    top: 82px; /* Adjust this value based on your header height */
    height: 100vh;
  }
}

/* ===========================
Model Pages
=========================== */

/* Max banner Full Height after 2000px*/
@media (min-width: 2000px) {
  .model-banner-full-height img {
    height: calc(100vh - 230px);
    object-fit: cover;
  }
}

/* ===========================
Embla Slider
=========================== */

@media (min-width: 2000px) {
  .banner-full-height .embla .embla__slide img {
    height: calc(100vh - 230px); /* Pixel value is minus the header height */
    object-fit: cover;
  }
}

@media (min-width: 1024px) {
  .embla .embla__button {
    background-color: rgb(245 245 244 / 40%);
    color: #000;
    border: none;
    width: 40px;
    height: 40px;
    border-radius: 50%;
  }

  .embla .embla__button:hover {
    background-color: #fff;
  }
}

/* -- Embla: Dots General -- */

.embla__dots_container {
  padding: 16px;
  text-align: center;
}

.wp-block-custom-block-section:not(.banner-dots) .embla__dots {
  background: #f5f5f4;
  border-radius: 30px;
  padding: 8px;
}

.embla .embla__dot {
  background-color: rgb(221 221 221 / 70%);
  width: 10px;
  height: 10px;
  border: none;
  border-radius: 20px;
}

.embla .embla__dot:hover:not(.embla__dot--selected) {
  background-color: rgb(221 221 221 / 100%);
}

.embla .embla__dot--selected {
  background-color: var(--wp--preset--color--primary);
  width: 36px;
}

/* ===========================
Accordion style
=========================== */

.is-style-accordion-style {
  background: #e5e5e5;
  border-radius: 8px;
  border: 1px solid #e5e5e5;
}

.is-style-accordion-style:hover,
.is-style-accordion-style.is-open {
  background-color: #ffffff;
}

/* ===========================
Offer Filter 
=========================== */
.wp-block-custom-block-filter-trigger {
  border-color: transparent;
}

.wp-block-custom-block-filter-trigger:hover {
  border-color: #d1d1d1 !important;
}

.wp-block-custom-block-filter-trigger.is-active {
  border-color: var(--wp--preset--color--primary) !important;
  background-color: var(--wp--preset--color--white);
}