/* =========================================================
   WPML Language Switcher (NEW navigation block markup)
   Pill toggle with moving blob (uses :has)
   Includes override for theme rule:
   .wp-block-navigation .wp-block-navigation-item { background-color: inherit; }
   Works in editor + front-end by matching either:
   - aria-label="Available languages" (front-end)
   - data-is-drop-zone="true" (editor)

   NOTE (VS Code): uses :has(), but avoids the leading ">" inside :has()
   because VS Code's built-in CSS validator often errors on relative selectors.
   ========================================================= */

/* Optional: adjust where the switcher sits in your header */
.site-header-section-right{
  margin-top: -28px;
  line-height: 1;
}

/* ---------------------------------------------------------
   Base UL pill container
   --------------------------------------------------------- */
ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"],
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"]{
  --wpml-pill: 28px;

  /* WPML/nav may set spacing with this variable */
  --language-spacing: 0px !important;

  position: relative;
  display: inline-flex;
  align-items: center;

  gap: 0;
  column-gap: 0;

  height: var(--wpml-pill) !important;

  margin: 0 !important;
  padding: 0 !important;
  list-style: none;

  border-radius: 999px;
  background: #DCD6CD;

  line-height: 0;
  overflow: hidden;
}

/* ---------------------------------------------------------
   The "drop/blob" highlight
   --------------------------------------------------------- */
ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"]::before,
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"]::before{
  content: "" !important;
  display: block !important;

  position: absolute;
  top: 0;
  left: 0;

  width: var(--wpml-pill);
  height: var(--wpml-pill);
  border-radius: 999px;

  background: #53443D;
  box-shadow: 0 10px 22px rgba(17,24,39,.20);

  opacity: 1;
  transition: transform 520ms cubic-bezier(.22,1,.36,1);

  z-index: 0 !important;
  pointer-events: none;

  transform: translateX(0);
}

/* ---------------------------------------------------------
   IMPORTANT: prevent nav item backgrounds from covering blob
   (theme rule sets background-color: inherit on nav items)
   --------------------------------------------------------- */
ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"] > li.wp-block-navigation-item,
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"] > li.wp-block-navigation-item{
  background: transparent !important; /* key fix */
}

/* Extra-safe: keep inner wrappers transparent too */
ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"] > li > div,
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"] > li > div,
ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"] a.wp-block-navigation-item__content,
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"] a.wp-block-navigation-item__content,
ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"] li[data-wpml="current-language-item"] > div[aria-current="page"],
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"] li[data-wpml="current-language-item"] > div[aria-current="page"]{
  background: transparent !important;
}

/* ---------------------------------------------------------
   LI reset (above blob)
   --------------------------------------------------------- */
ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"] > li.wp-block-navigation-item,
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"] > li.wp-block-navigation-item{
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;

  display: flex;
  align-items: center;

  position: relative;
  z-index: 1;
}

/* Wrapper reset */
ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"] > li > div,
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"] > li > div{
  margin: 0 !important;
  padding: 0 !important;

  display: flex;
  align-items: center;
}

/* ---------------------------------------------------------
   Button boxes:
   - non-current item is <a.wp-block-navigation-item__content>
   - current item is <div aria-current="page"> (no link)
   --------------------------------------------------------- */
ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"] a.wp-block-navigation-item__content,
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"] a.wp-block-navigation-item__content,
ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"] li[data-wpml="current-language-item"] > div[aria-current="page"],
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"] li[data-wpml="current-language-item"] > div[aria-current="page"]{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  height: var(--wpml-pill);
  width: var(--wpml-pill);
  min-width: var(--wpml-pill);

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

  border-radius: 999px;
  text-decoration: none;
  line-height: 1;
}

/* ---------------------------------------------------------
   Label typography
   --------------------------------------------------------- */
ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"] .wp-block-navigation-item__label,
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"] .wp-block-navigation-item__label{
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .02em;

  color: #111827;
  transition: color 220ms ease;
}

/* Default: current language label (sits on blob) */
ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"] li[data-wpml="current-language-item"] .wp-block-navigation-item__label,
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"] li[data-wpml="current-language-item"] .wp-block-navigation-item__label{
  color: #fff !important;
}

/* ---------------------------------------------------------
   POSITIONING (requires :has)
   Default = current LI position
   Hover = hovered LI position
   --------------------------------------------------------- */

/* Default blob position based on where current language li is */
ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"]:has(li[data-wpml="current-language-item"]:nth-child(1))::before,
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"]:has(li[data-wpml="current-language-item"]:nth-child(1))::before{
  transform: translateX(0);
}

ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"]:has(li[data-wpml="current-language-item"]:nth-child(2))::before,
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"]:has(li[data-wpml="current-language-item"]:nth-child(2))::before{
  transform: translateX(var(--wpml-pill));
}

/* Hover overrides */
ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"]:has(li:nth-child(1):hover)::before,
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"]:has(li:nth-child(1):hover)::before{
  transform: translateX(0);
}

ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"]:has(li:nth-child(2):hover)::before,
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"]:has(li:nth-child(2):hover)::before{
  transform: translateX(var(--wpml-pill));
}

/* Text colors on hover:
   - when hovering any item, make all labels dark
   - then make hovered label white (on blob)
*/
ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"]:has(li:hover) .wp-block-navigation-item__label,
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"]:has(li:hover) .wp-block-navigation-item__label{
  color: #111827 !important;
}
ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"] > li:hover .wp-block-navigation-item__label,
ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"] > li:hover .wp-block-navigation-item__label{
  color: #fff !important;
}

/* ---------------------------------------------------------
   FALLBACK (no :has support)
   Blob removed; simple hover/active fill
   --------------------------------------------------------- */
@supports not selector(:has(*)) {
  ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"]::before,
  ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"]::before{
    display: none !important;
  }

  ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"] li[data-wpml="current-language-item"] > div[aria-current="page"],
  ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"] li[data-wpml="current-language-item"] > div[aria-current="page"]{
    background: #53443D !important;
  }

  ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"] li[data-wpml="current-language-item"] .wp-block-navigation-item__label,
  ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"] li[data-wpml="current-language-item"] .wp-block-navigation-item__label{
    color: #fff !important;
  }

  ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"] a.wp-block-navigation-item__content:hover,
  ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"] a.wp-block-navigation-item__content:hover{
    background: #53443D !important;
  }

  ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"] a.wp-block-navigation-item__content:hover .wp-block-navigation-item__label,
  ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"] a.wp-block-navigation-item__content:hover .wp-block-navigation-item__label{
    color: #fff !important;
  }
}

/* ---------------------------------------------------------
   Reduced motion
   --------------------------------------------------------- */
@media (prefers-reduced-motion: reduce){
  ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"]::before,
  ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"]::before{
    transition: none !important;
  }
  ul.horizontal-list.hasSpacing.isHorizontal[aria-label="Available languages"] .wp-block-navigation-item__label,
  ul.horizontal-list.hasSpacing.isHorizontal[data-is-drop-zone="true"] .wp-block-navigation-item__label{
    transition: none !important;
  }
}


/* Hard override WPML switcher spacing */
.site-header-section-right .wpml-language-switcher-block ul.horizontal-list.horizontal-list.hasSpacing.isHorizontal{
  gap: 0 !important;
  column-gap: 0 !important;
  row-gap: 0 !important;

  --language-spacing: 0px !important;
}

/* In case spacing is implemented as margins/padding instead of gap */
.site-header-section-right .wpml-language-switcher-block ul.horizontal-list.horizontal-list.hasSpacing.isHorizontal > li,
.site-header-section-right .wpml-language-switcher-block ul.horizontal-list.horizontal-list.hasSpacing.isHorizontal > li > div{
  margin: 0 !important;
  padding: 0 !important;
}

ul#mobile-menu .wpml-ls-menu-item a {

  justify-content: center;

}

/* Portalmar styles - Splide arrows (prev/next)
   Goal: 48x48 circular buttons, no hover "push down".
*/

/* Target both Splide + any Slick classes present */
button.splide__arrow,
button.splide__arrow.splide__arrow--prev,
button.splide__arrow.splide__arrow--next,
button.splide__arrow.slick-prev,
button.splide__arrow.slick-next,
.splide__arrow.slick-prev,
.splide__arrow.slick-next{
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  min-height: 48px !important;

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

  border: 0 !important;
  border-radius: 999px !important;
  background: #fff !important;

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

  overflow: hidden !important;
  box-sizing: border-box !important;

  /* Prevent any "pressed" movement on hover/active */
  top: 50% !important;
  transform: translateY(-50%) !important;
}

/* Keep the exact same positioning on hover/focus/active (no push down) */
button.splide__arrow:hover,
button.splide__arrow:focus,
button.splide__arrow:active,
.splide__arrow:hover,
.splide__arrow:focus,
.splide__arrow:active{
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin-top: 0 !important;
}

/* Remove Slick pseudo-element arrows so only your SVG displays */
button.splide__arrow.slick-prev::before,
button.splide__arrow.slick-next::before,
.splide__arrow.slick-prev::before,
.splide__arrow.slick-next::before{
  content: none !important;
  display: none !important;
}

/* SVG sizing + color */
button.splide__arrow svg,
.splide__arrow svg{
  width: 16px !important;
  height: 16px !important;
  fill: currentColor !important;
}

button.splide__arrow,
.splide__arrow{
  color: #1d1b19 !important;
}

/* Arrow direction:
   Your SVG path is a "right" chevron. Rotate ONLY the prev arrow to face left. */
button.splide__arrow.splide__arrow--next svg{
  transform: none !important;
}

button.splide__arrow.splide__arrow--prev svg{
  transform: rotate(180deg) !important;
}

/* Optional: subtle hover without movement */
button.splide__arrow:hover,
.splide__arrow:hover{
  filter: brightness(0.97);
}

/* Mobile only: smaller buttons (and optionally smaller SVG) */
@media (max-width: 768px){
  button.splide__arrow,
  button.splide__arrow.splide__arrow--prev,
  button.splide__arrow.splide__arrow--next,
  button.splide__arrow.slick-prev,
  button.splide__arrow.slick-next,
  .splide__arrow.slick-prev,
  .splide__arrow.slick-next{
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
  }

  button.splide__arrow svg,
  .splide__arrow svg{
    width: 14px !important;
    height: 14px !important;
  }
}

/****
  1. Global font sizes
****/

/*
|--------------------------------------------------------------------------
| Portalmar Typography System
| Single source of truth = CSS variables
|--------------------------------------------------------------------------
*/

/* =========================
   GLOBAL SCALE
========================= */

:root {

  --global-kb-font-size-sm: clamp(12px, 1.1vw, 14px);
  --global-kb-font-size-md: clamp(14px, 1.2vw, 16px);
  --global-kb-font-size-lg: clamp(18px, 1.8vw, 20px);
  --global-kb-font-size-xl: clamp(24px, 2.6vw, 28px);
  --global-kb-font-size-xxl: clamp(28px, 3.2vw, 40px);
  --global-kb-font-size-xxxl: clamp(36px, 4vw, 48px);

}


/* =========================
   FRONTEND CONTENT ONLY
========================= */

.entry-content h1 { font-size: var(--global-kb-font-size-xxxl); }
.entry-content h2 { font-size: var(--global-kb-font-size-xxl); }
.entry-content h3 { font-size: var(--global-kb-font-size-xl); }
.entry-content h4 { font-size: var(--global-kb-font-size-lg); }
.entry-content h5 { font-size: var(--global-kb-font-size-md); }
.entry-content h6 { font-size: var(--global-kb-font-size-sm); }


/* =========================
   EDITOR CONTENT ONLY
   (does NOT affect admin UI)
========================= */

.block-editor-page 
.editor-styles-wrapper 
.block-editor-writing-flow h1 { 
  font-size: var(--global-kb-font-size-xxxl); 
}

.block-editor-page 
.editor-styles-wrapper 
.block-editor-writing-flow h2 { 
  font-size: var(--global-kb-font-size-xxl); 
}

.block-editor-page 
.editor-styles-wrapper 
.block-editor-writing-flow h3 { 
  font-size: var(--global-kb-font-size-xl); 
}

.block-editor-page 
.editor-styles-wrapper 
.block-editor-writing-flow h4 { 
  font-size: var(--global-kb-font-size-lg); 
}

.block-editor-page 
.editor-styles-wrapper 
.block-editor-writing-flow h5 { 
  font-size: var(--global-kb-font-size-md); 
}

.block-editor-page 
.editor-styles-wrapper 
.block-editor-writing-flow h6 { 
  font-size: var(--global-kb-font-size-sm); 
}


/****
  2. Block: Request your Brochure
****/

.entry-content h1.gform_title {

  font-family: Idlewild, Helvetica, Arial;
  text-align: center;

}

/* Mobile */
@media (max-width: 768px){
  .entry-content h1.gform_title{
    font-size: var(--global-kb-font-size-lg); 
  }
}

.field-wrapper {

  background: var(--global-palette7) !important;
  color: #312019 !important;
  padding: 35px 15px 15px 15px !important;
  border-radius: 8px;

}


#field_1_6 > legend.gfield_label {
  padding: -0.5rem .5rem;
  transform: translate(0rem, 1.3rem);
  margin: 0;
  font-weight: normal !important;
  font-size: 16px !important;

}


/* spacing between fields */

#gform_1 .gform_fields {
  row-gap: 34px;
}

#gform_1 input[type="text"],
#gform_1 input[type="email"],
#gform_1 input[type="tel"],
#gform_1 select,
#gform_1 textarea {

  width: 100%;
  background: transparent;
  border: 0;
  border-bottom: 1px solid rgba(60, 50, 45, .55);
  border-radius: 0;
  box-shadow: none;
  font-size: 16px;
  color: rgba(60, 50, 45, .95);

}

/* focus state */

#gform_1 input[type="text"]:focus,
#gform_1 input[type="email"]:focus,
#gform_1 input[type="tel"]:focus,
#gform_1 select:focus,
#gform_1 textarea:focus {

  outline: none;
  border-bottom-color: rgba(60, 50, 45, .95);

}

/* remove fieldset border/padding so legend behaves like a label line above the underline */

#gform_1 fieldset.gfield {

  border: 0;
  padding: 0;
  margin: 0;
  min-inline-size: 0; /* helps some browsers with fieldset layout */

}

/* keep required asterisk tight, like “Email*” */

#gform_1 .gfield_required,
#gform_1 .gfield_required_asterisk {

  margin-left: 2px;
  font-weight: inherit;

}

/* Name field wrapper: make sure it spans full width and doesn’t add odd spacing */

#gform_1 .ginput_container--name,
#gform_1 .ginput_container_name,
#gform_1 .ginput_complex {

  display: block;

}

#gform_1 .ginput_container--name > span,
#gform_1 .ginput_container_name > span {

  display: block;

}

/* Select: remove native styling and add a simple chevron */
#gform_1 select {

  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding-right: 44px; /* space for chevron */
  background-repeat: no-repeat;
  background-position: right 8px center;
  background-size: 18px 18px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%233c322d' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");

}

.gform_button.button {

  border-radius: 8px !important;
  font-weight: normal !important;
  padding: 15px 24px !important;
  font-size: 16px !important;
  
}




.has-idlewild {

  /* letter-spacing: 3px; */
  line-height: 1;

}

/* Mobile only */
@media (max-width: 768px) {

  .has-idlewild {

    line-height: 1.2; 

  }

}


h1.entry-title {

  margin-top: 120px;

}


/* Brochure icon */

.brochure-card .wp-block-kadence-image figure {
  transform: translateY(-60px);
}

/* Kadence row wrapper sometimes clips */
.kb-row-layout-wrap.hero-test,
.kb-row-layout-wrap.hero-test > .kt-row-column-wrap {
  overflow: visible !important;
}

/* Optional: tighten the Gravity Forms title spacing */
.brochure-card #gform_wrapper_1 .gform_heading{
  margin-top: -30px; /* adjust or remove */
}
.brochure-card #gform_wrapper_1 .gform_title{
  margin-top: 0 !important;
  margin-bottom: 40px !important;
}

#gform_submit_button_1:hover {
  
  background-color: var(--global-palette5);
}

.gform_confirmation_message {

  text-align: center;
  font-size: var(--global-kb-font-size-xl); 

}