/*
Theme Name: Mike's Child Theme
Theme URI: https://olliewp.com
Description: This is Mike's custom child theme.
Author: Mike McAlister
Author URI: https://olliewp.com
Template:     ollie
Version: 1.0.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags:         blog, portfolio, entertainment, grid-layout, one-column, two-columns, three-columns, four-columns, block-patterns, block-styles, custom-logo, custom-menu, editor-style, featured-images, full-site-editing, full-width-template, rtl-language-support, style-variations, template-editing, theme-options, translation-ready, wide-blocks
Text Domain: ollie-child
*/
.u-italic-underline{
  font-style: italic;
  font-weight: 900;
}

.angled-cta{
  position: relative;
  background:#FFC821;
  color:#111;
  text-align:center;
  padding:18px 28px 28px; /* extra bottom for the notch */
  font-weight:700;
  display:block;
  width:100%;
  box-sizing:border-box;
  border-radius:5px;
}

.angled-cta::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-18px;
  transform:translateX(-50%);
  width:0;
  height:0;
  border-left:28px solid transparent;
  border-right:28px solid transparent;
  border-top:18px solid #FFC821;
}

/* =========================
   Service Cards (Home Grid)
   ========================= */

/* Card wrapper */
.wp-block-group.service-card.is-layout-flex{
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start !important; /* prevent space-between distributing gaps */
}

/* Image spacing normalisation */
.wp-block-group.service-card figure.wp-block-image{
  margin: 0 0 var(--wp--preset--spacing--small) 0;
}

/* Content wrapper (H3 + paragraph) */
.wp-block-group.service-card .service-card__content{
  display: flex;
  flex-direction: column;
  gap: var(--wp--preset--spacing--x-small);
  margin: 0; /* guard against theme defaults */
}

/* Heading: reserve height so paragraphs align */
.wp-block-group.service-card .service-card__content h3.wp-block-heading{
  margin: 0;
  line-height: 1.25;

  /* reserve 2 lines of heading height */
  min-height: calc(1.25em * 3);

  /* clamp to 2 lines to prevent longer headings pushing text down */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

/* Paragraph: remove default margins */
.wp-block-group.service-card .service-card__content p{
  margin: 0;
}

/* Remove any leading <br> Gutenberg inserted into the paragraph */
.wp-block-group.service-card .service-card__content p > br:first-child{
  display: none;
}

/* CTA wrapper: push to bottom of card */
.wp-block-group.service-card .service-card__cta{
  margin-top: auto;
  padding-top: var(--wp--preset--spacing--small);
}

/* If you want the button row to span full width consistently */
.wp-block-group.service-card .service-card__cta .wp-block-button,
.wp-block-group.service-card .service-card__cta .wp-block-button__link{
  width: 100%;
}

/* Ensure equal-height columns if these cards sit inside a Columns block */
.wp-block-columns{
  align-items: stretch;
}

/* =========================
   GF Form Styles
   ========================= */
/* Gravity Forms submit button typography (site-wide) */
.gform_wrapper input[type="submit"].gform_button,
.gform_wrapper input[type="button"].gform_button,
.gform_wrapper button.gform_button,
.gform_wrapper .gform_footer input[type="submit"],
.gform_wrapper .gform_page_footer input[type="submit"] {
  font-size: var(--wp--preset--font-size--base) !important;
  font-weight: 700 !important;
  line-height: inherit !important;
  padding: 0.6em 1em !important;
  font-family: inherit !important; /* add this */
}

/* =========================================
   Gravity Forms: Radios as rounded squares + green check
   (site-wide)
   ========================================= */

/* Ensure each choice is positioned correctly */
.gform_wrapper .gfield--type-radio .gfield_radio .gchoice,
.gform_wrapper .gfield--type-radio .gfield_radio li {
  position: relative;
}

/* Hide native radio (accessible) */
.gform_wrapper .gfield--type-radio input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  margin: 0;
}

/* Make the label the click target + create space for the custom box */
.gform_wrapper .gfield--type-radio input[type="radio"] + label {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding-left: 32px; /* room for the square */
  min-height: 24px;
  cursor: pointer;
  user-select: none;
}

/* Rounded square */
.gform_wrapper .gfield--type-radio input[type="radio"] + label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 22px;
  height: 22px;
  transform: translateY(-50%);
  border-radius: 6px;
  border: 2px solid rgba(255,255,255,0.75); /* looks good on dark backgrounds */
  background: rgba(255,255,255,0.06);
  box-sizing: border-box;
}

/* Checked: green border */
.gform_wrapper .gfield--type-radio input[type="radio"]:checked + label::before {
  border-color: #16a34a;
  background: rgba(22,163,74,0.10);
}

/* Checked: green check mark */
.gform_wrapper .gfield--type-radio input[type="radio"]:checked + label::after {
  content: "✓";
  position: absolute;
  left: 0;
  top: 50%;
  width: 22px;
  height: 22px;
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  font-size: 16px;
  font-weight: 900;
  color: #16a34a;
  line-height: 1;
}

/* Keyboard focus */
.gform_wrapper .gfield--type-radio input[type="radio"]:focus-visible + label::before {
  outline: 3px solid rgba(22,163,74,0.35);
  outline-offset: 2px;
}

/* Make each choice feel like a chip (optional) */
.gform_wrapper .gfield--type-radio .gfield_radio .gchoice,
.gform_wrapper .gfield--type-radio .gfield_radio li {
  display: inline-flex;
  align-items: center;
  padding: 10px 12px;
  border-radius: 8px;
}

.gform_wrapper .gfield--type-radio input[type="radio"]:checked + label {
  font-weight: 700;
}

/* Stack GF radio choices between 1088px and 782px (new div.gchoice markup) */
@media (max-width: 1088px) and (min-width: 782px) {

  /* The choices wrapper */
  .gform_wrapper .gfield--type-radio .gfield_radio {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px;
    width: 100%;
    max-width: 100%;
  }

  /* Each choice row */
  .gform_wrapper .gfield--type-radio .gfield_radio .gchoice {
    width: 100%;
    max-width: 100%;
    display: flex;           /* keeps your checkbox + label aligned */
    align-items: center;
    box-sizing: border-box;
  }

  /* Let the label take the row width */
  .gform_wrapper .gfield--type-radio .gfield_radio .gchoice label {
    width: 100%;
    min-width: 0;
    white-space: normal;
    word-break: normal;
    overflow-wrap: normal;
    hyphens: auto;
  }
}

/* Orbital: tighten vertical spacing */
.gform_wrapper.gform-theme--orbital {
  --gf-gap-y: 16px;
  --gf-gap-x: 24px;
  --gf-form-gap-y: 16px;
}

/* =========================================================
   MAIN NAV (core Navigation block)
   Mobile <= 804px, Desktop >= 805px
   ========================================================= */

/* MOBILE MODE: force responsive (hamburger + flyout) up to 804px */
@media (max-width: 804px) {

  /* Show hamburger button */
  .main-nav .wp-block-navigation__responsive-container-open:not(.always-shown){
    display: flex !important;
  }

  /* Hide the desktop inline nav wrapper */
  .main-nav .wp-block-navigation__responsive-container:not(.hidden-by-default){
    display: none !important;
  }

  /* Flyout overlay container: hidden until opened */
  .main-nav .wp-block-navigation__responsive-container{
    display: none !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 99999 !important;
  }

  /* When opened, show the flyout */
  .main-nav .wp-block-navigation__responsive-container.is-menu-open{
    display: flex !important;
  }
}

/* DESKTOP MODE: restore default inline nav from 805px */
@media (min-width: 805px) {

  /* Hide hamburger button */
  .main-nav .wp-block-navigation__responsive-container-open:not(.always-shown){
    display: none !important;
  }

  /* Show inline nav wrapper */
  .main-nav .wp-block-navigation__responsive-container:not(.hidden-by-default){
    display: flex !important;
  }

  /* Ensure no overlay behaviour leaks into desktop */
  .main-nav .wp-block-navigation__responsive-container{
    position: static !important;
    inset: auto !important;
    z-index: auto !important;
    display: block !important;
  }
}

/* =========================================================
   Mobile menu toggle button styling
   ========================================================= */

.main-nav .wp-block-navigation__responsive-container-open,
.main-nav .wp-block-navigation__responsive-container-close{
  background: var(--wp--preset--color--primary-accent);
  border-radius: .5rem;
  padding: .6rem;
  color: #fff; /* helps when SVG uses currentColor */
}

/* Make the hamburger/close icon white */
.main-nav .wp-block-navigation__responsive-container-open svg,
.main-nav .wp-block-navigation__responsive-container-close svg{
  fill: currentColor;
}