.elementor-kit-5{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-7ff36df:#0067B8;--e-global-color-b5f9230:#054C83;--e-global-color-1030e64:#F25022;--e-global-color-406f17f:#01A4EF;--e-global-color-7f29489:#7FBA00;--e-global-color-f79e160:#EBBB41;--e-global-color-a494c23:#F7F9FE;--e-global-color-b89eff1:#FFFFFF;--e-global-color-f297741:#000000;--e-global-color-3c4fb84:#E6EBFD;--e-global-color-faa4433:#F3F8FF;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-5 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1440px;}.e-con{--container-max-width:1440px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* =========================================================
   Elementor Global CSS (Replacement) — v9.6
   File: Elementor_Global_CSS_v9.6_20260226.txt

   FIX: APF participant accordions should be GREY when collapsed,
        and BLUE only for the currently expanded accordion.

   What changed:
   - Earlier global versions applied the button blue to ALL .apf-accordion-header
     states, which overrides your widget-level APF styling.
   - v9.6 restores STATE-based styling for APF using aria-expanded:
       * Collapsed (default): grey
       * Collapsed hover: blue
       * Expanded: blue
       * Expanded hover: hover-blue

   Elementor Global Color tokens:
   - button_background (#0067B8)       -> --e-global-color-7ff36df
   - button_background_hover (#054C83) -> --e-global-color-b5f9230
   ========================================================= */

/* ---------------------------------------------------------
   1) GLOBAL TOKEN MAP — define on :root with fallbacks
   --------------------------------------------------------- */
:root {
  /* Elementor custom global colors */
  --pn-button-bg: var(--e-global-color-7ff36df, #0067B8);
  --pn-button-bg-hover: var(--e-global-color-b5f9230, #054C83);

  /* Global button system tokens */
  --oia-btn-bg: var(--pn-button-bg);
  --oia-btn-bg-hover: var(--pn-button-bg-hover);
  --oia-btn-text: #ffffff;

  /* Shape + elevation */
  --oia-btn-radius: 8px;
  --oia-btn-shadow: 0 2px 2px rgba(0,0,0,.12);
  --oia-btn-shadow-hover: 0 3px 2px rgba(0,0,0,.20);

  /* Focus ring uses hover color */
  --oia-btn-focus: var(--oia-btn-bg-hover);

  /* PN — Update Totals UI */
  --pn-attn-orange: #f59e0b;
  --pn-attn-orange-dark: #d97706;

  /* APF collapsed look (neutral) */
  --pn-apf-collapsed-bg: #f3f3f3;
  --pn-apf-collapsed-text: #111;
  --pn-apf-collapsed-border: #ddd;
}

/* ---------------------------------------------------------
   2) SAFETY: also define the mapping on BODY
   (because your Elementor globals were found on body)
   --------------------------------------------------------- */
body {
  --pn-button-bg: var(--e-global-color-7ff36df, #0067B8);
  --pn-button-bg-hover: var(--e-global-color-b5f9230, #054C83);

  --oia-btn-bg: var(--pn-button-bg);
  --oia-btn-bg-hover: var(--pn-button-bg-hover);
  --oia-btn-focus: var(--oia-btn-bg-hover);
}

/* =========================================================
   GLOBAL BUTTON STYLING (Woo + Elementor)
   ========================================================= */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce input#submit,
button,
input[type="submit"],
input[type="button"],
a.button,
a.elementor-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 16px;
  border-radius: var(--oia-btn-radius);
  border: 0 !important;
  background-color: var(--oia-btn-bg) !important;
  color: var(--oia-btn-text) !important;
  font-weight: 600;
  letter-spacing: .2px;
  text-decoration: none;
  box-shadow: var(--oia-btn-shadow);
  transition: background-color .18s ease, box-shadow .18s ease, transform .05s ease;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce input#submit:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
a.button:hover,
a.elementor-button:hover {
  background-color: var(--oia-btn-bg-hover) !important;
  color: var(--oia-btn-text) !important;
  box-shadow: var(--oia-btn-shadow-hover) !important;
}

.woocommerce a.button:active,
.woocommerce button.button:active,
button:active,
input[type="submit"]:active,
a.button:active,
a.elementor-button:active {
  transform: translateY(1px);
}

.woocommerce a.button:focus,
.woocommerce button.button:focus,
.woocommerce input.button:focus,
a.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="button"]:focus,
a.elementor-button:focus {
  outline: none !important;
  border-color: transparent !important;
}

.woocommerce a.button:focus-visible,
.woocommerce button.button:focus-visible,
.woocommerce input.button:focus-visible,
a.button:focus-visible,
button:focus-visible,
input[type="submit"]:focus-visible,
input[type="button"]:focus-visible,
a.elementor-button:focus-visible {
  outline: 2px solid var(--oia-btn-focus) !important;
  outline-offset: 2px !important;
}

button::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner {
  border: 0 !important;
}

/* =========================================================
   ACCORDIONS
   ========================================================= */

/* ---------- A) APF ACCORDION (Participant accordions)
   Requirements:
   - Expanded = blue
   - Collapsed = grey (until clicked)
*/

/* Baseline (treat as collapsed by default) */
.apf-accordion-header {
  background: var(--pn-apf-collapsed-bg) !important;
  color: var(--pn-apf-collapsed-text) !important;
  border: 1px solid var(--pn-apf-collapsed-border) !important;
  border-radius: var(--oia-btn-radius) !important;
  box-shadow: var(--oia-btn-shadow) !important;
  transition: background-color .18s ease, color .18s ease, box-shadow .18s ease, transform .05s ease;
}
.apf-accordion-header::before {
  color: var(--pn-apf-collapsed-text) !important;
}

/* Collapsed explicit */
.apf-accordion-header[aria-expanded="false"] {
  background: var(--pn-apf-collapsed-bg) !important;
  color: var(--pn-apf-collapsed-text) !important;
  border-color: var(--pn-apf-collapsed-border) !important;
}
.apf-accordion-header[aria-expanded="false"]::before {
  color: var(--pn-apf-collapsed-text) !important;
}

/* Collapsed hover -> blue */
.apf-accordion-header[aria-expanded="false"]:hover {
  background: var(--oia-btn-bg) !important;
  color: var(--oia-btn-text) !important;
  border-color: transparent !important;
  box-shadow: var(--oia-btn-shadow-hover) !important;
}
.apf-accordion-header[aria-expanded="false"]:hover::before {
  color: var(--oia-btn-text) !important;
}

/* Expanded -> blue */
.apf-accordion-header[aria-expanded="true"] {
  background: var(--oia-btn-bg) !important;
  color: var(--oia-btn-text) !important;
  border-color: transparent !important;
  box-shadow: var(--oia-btn-shadow) !important;
}
.apf-accordion-header[aria-expanded="true"]::before {
  color: var(--oia-btn-text) !important;
}

/* Expanded hover -> hover blue */
.apf-accordion-header[aria-expanded="true"]:hover {
  background: var(--oia-btn-bg-hover) !important;
  color: var(--oia-btn-text) !important;
  box-shadow: var(--oia-btn-shadow-hover) !important;
}
.apf-accordion-header[aria-expanded="true"]:hover::before {
  color: var(--oia-btn-text) !important;
}

/* Active / pressed feel */
.apf-accordion-header:active {
  transform: translateY(1px);
}

/* Keyboard focus ring */
.apf-accordion-header:focus-visible {
  outline: 2px solid var(--oia-btn-focus) !important;
  outline-offset: 2px !important;
}


/* ---------- B) TOPICS ACCORDION (This session includes...)
   Keep as blue button style (always blue, hover darker)
*/
.pn-topics-accordion-header {
  background: var(--oia-btn-bg) !important;
  color: var(--oia-btn-text) !important;
  border-color: transparent !important;
  border-radius: var(--oia-btn-radius) !important;
  box-shadow: var(--oia-btn-shadow) !important;
  transition: background-color .18s ease, color .18s ease, box-shadow .18s ease, transform .05s ease;
}
.pn-topics-accordion-header::before {
  color: var(--oia-btn-text) !important;
}
.pn-topics-accordion-header:hover {
  background: var(--oia-btn-bg-hover) !important;
  color: var(--oia-btn-text) !important;
  box-shadow: var(--oia-btn-shadow-hover) !important;
}
.pn-topics-accordion-header:hover::before {
  color: var(--oia-btn-text) !important;
}
.pn-topics-accordion-header:active {
  transform: translateY(1px);
}
.pn-topics-accordion-header:focus-visible {
  outline: 2px solid var(--oia-btn-focus) !important;
  outline-offset: 2px !important;
}


/* =========================================================
   PN — Update Totals Button Overrides (carried forward)
   ========================================================= */
#bkap-price-box #pn-selection-pending-row {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin: 6px 0 !important;
  padding: 0 !important;
  gap: 10px !important;
}

#bkap-price-box #pn-selection-pending-msg,
#bkap-price-box #pn-update-totals-btn {
  display: none !important;
}

#bkap-price-box #pn-selection-pending-row[data-pn-mode="msg"] #pn-selection-pending-msg,
#bkap-price-box #pn-selection-pending-row[data-pn-mode="busy"] #pn-selection-pending-msg {
  display: inline !important;
  opacity: .85;
  font-weight: 600;
}

#bkap-price-box #pn-selection-pending-row[data-pn-mode="button"] #pn-update-totals-btn {
  display: inline-flex !important;
}

#bkap-price-box #pn-update-totals-btn.pn-update-totals-btn {
  background: var(--pn-attn-orange-dark) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: var(--oia-btn-radius) !important;
  box-shadow: var(--oia-btn-shadow) !important;
  min-height: 48px;
  padding: 12px 18px;
  font-weight: 400 !important;
  letter-spacing: .2px;
  text-align: center;
}

#bkap-price-box #pn-update-totals-btn.pn-update-totals-btn:hover {
  background: var(--pn-attn-orange) !important;
  color: #fff !important;
  font-weight: 700 !important;
  box-shadow: var(--oia-btn-shadow-hover) !important;
}

#bkap-price-box #pn-update-totals-btn.pn-update-totals-btn:focus-visible {
  outline: 2px solid var(--pn-attn-orange) !important;
  outline-offset: 2px !important;
}
/* =========================================================
   GLOBAL FIX — LEFT ALIGN APF ACCORDION TITLES
   Applies to cart + booking sidebar + all APF accordions
   Does NOT affect icons or states
========================================================= */

.apf-accordion-header{
  justify-content: flex-start !important;
  text-align: left !important;
}
/* =========================================================
 PN MAIN PAGE — FIXED BOOKING SIDEBAR
 Added 2026-03-15
 SAFE: Does NOT affect cart edit sidebar
 ========================================================= */

:root {
    --pn-main-sidebar-width: min(480px, 100vw);
}

/* Overlay */
.pn-main-panel-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.35);
    opacity: 0;
    pointer-events: none;
    transition: opacity .25s ease;
    z-index: 9980;
}

/* Sidebar panel */
#pn-main-sidebar {
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    width: var(--pn-main-sidebar-width);
    max-width: 100vw;
    background: #fff;
    box-shadow: -12px 0 24px rgba(0,0,0,.18);
    transform: translateX(100%);
    transition: transform .3s cubic-bezier(.77,.2,.05,1);
    z-index: 9981;
    overflow-y: auto;
}

/* Open state */
body.pn-main-panel-open #pn-main-sidebar {
    transform: translateX(0);
}

body.pn-main-panel-open .pn-main-panel-overlay {
    opacity: 1;
    pointer-events: auto;
}

body.pn-main-panel-open {
    overflow: hidden;
}
/* =========================================================
   PN — Hide ORIGINAL Parent '×' Close Buttons
   v1.0.0 (2026-03-16)
   Purpose:
   - Removes the legacy parent close buttons from view (booking sidebar + cart edit sidebar)
   - Leaves the elements in the DOM so any existing logic that calls .click() still works
   Safe to rollback: remove this CSS.
   ========================================================= */

/* Booking sidebar (main page) */
#pn-main-sidebar .pn-main-panel-close{
  display:none !important;
}

/* Cart edit sidebar (cart page) */
body.woocommerce-cart #pn-cart-sidebar .pn-cart-panel-close{
  display:none !important;
}
/*
PN — Session Slot Icon Alignment (Elementor n-Accordion)
Version: v1.0.0
Date: 2026-04-18

Goal
- Vertically align the quarter-circle SVG icon with the category title text inside Elementor's N-Accordion title.
- Keep the icon size as-is; adjust alignment/line-height only.
- Keep the +/- expansion icon aligned on the same horizontal axis.

What this fixes
- Inline SVGs often sit on the text baseline, making the icon appear slightly higher than the text.
- This CSS forces the icon wrapper to behave like an inline-flex object aligned to the text center.

Where to add
- Global CSS (Elementor Site Settings > Custom CSS, or your theme/snippet CSS area).

Notes
- Targets the wrapper class emitted by your shortcode: .pn-session-slot-icon
- Includes Elementor N-Accordion title text wrapper .elementor-kit-5s (best-effort). If your site uses a different wrapper class,
  paste your title HTML and we’ll tighten the .elementor-kit-5.
*/

/* 1) Make the title text wrapper a flex row so icon + text align perfectly */
.elementor-widget-n-accordion .e-n-accordion-item-title :is(.e-n-accordion-item-title-text, .e-n-accordion-item-title__text, .e-n-accordion-title-text, .elementor-accordion-title){
  display: flex;
  align-items: center;
}

/* 2) Icon wrapper: align to middle, remove baseline effects, add right spacing */
.elementor-widget-n-accordion .e-n-accordion-item-title .pn-session-slot-icon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  vertical-align: middle;
  margin-right: 10px; /* space between icon and category text */
}

/* 3) SVG: treat as a block so its box is centered cleanly */
.elementor-widget-n-accordion .e-n-accordion-item-title .pn-session-slot-icon .pn-qsvg{
  display: block;
  vertical-align: middle;
}

/* Optional: if you still see the icon sit a touch high/low, uncomment ONE of these micro-tweaks */
/*
.elementor-widget-n-accordion .e-n-accordion-item-title .pn-session-slot-icon{ transform: translateY(1px); }
.elementor-widget-n-accordion .e-n-accordion-item-title .pn-session-slot-icon{ transform: translateY(-1px); }
*/
/*
PN — Session Slot Icon Brand Colours + Outline Stroke Rules
Version: v1.0.1
Date: 2026-04-18

Applies brand colours to the quarter wedges AND sets the circle outline stroke colour rules:
- Quarter products (q1/q2/q3/q4): outline stroke matches the wedge colour.
- Full day product (full_day): outline stroke is black.

Requires
- PHP snippet: pn-session-slot-icon-shortcode-v1.1.0.txt (adds .pn-q-outline and wrapper class .pn-bucket-q1..q4/full_day)

Brand palette (as provided)
- Q1: ilt_red   #F25022
- Q2: ilt_blue  #01A4EF
- Q3: ilt_green #7FBA00
- Q4: ilt_gold  #EBBB41

Where to add
- Elementor Global CSS (Site Settings → Custom CSS), or your global stylesheet.
*/

:root{
  --ilt_red:   #F25022;
  --ilt_blue:  #01A4EF;
  --ilt_green: #7FBA00;
  --ilt_gold:  #EBBB41;
  --ilt_black: #000000;
}

/* ------------------------------
   1) Wedge fills
   ------------------------------ */
.pn-session-slot-icon .pn-q-wedge.pn-q1{ fill: var(--ilt_red); }
.pn-session-slot-icon .pn-q-wedge.pn-q2{ fill: var(--ilt_blue); }
.pn-session-slot-icon .pn-q-wedge.pn-q3{ fill: var(--ilt_green); }
.pn-session-slot-icon .pn-q-wedge.pn-q4{ fill: var(--ilt_gold); }

/* ------------------------------
   2) Outline stroke rules
   ------------------------------
   The SVG circle has class .pn-q-outline.
   We override its stroke colour per bucket.
*/

/* Quarter products: stroke matches the wedge colour */
.pn-session-slot-icon.pn-bucket-q1 .pn-q-outline{ stroke: var(--ilt_red); }
.pn-session-slot-icon.pn-bucket-q2 .pn-q-outline{ stroke: var(--ilt_blue); }
.pn-session-slot-icon.pn-bucket-q3 .pn-q-outline{ stroke: var(--ilt_green); }
.pn-session-slot-icon.pn-bucket-q4 .pn-q-outline{ stroke: var(--ilt_gold); }

/* Full day: black outline */
.pn-session-slot-icon.pn-bucket-full_day .pn-q-outline{ stroke: var(--ilt_black); }

/* Optional: if you ever want ALL outlines black, uncomment */
/* .pn-session-slot-icon .pn-q-outline{ stroke: var(--ilt_black) !important; } */
/* =========================================================
 * PN — Slot Row Gap Fix (ULTRA-SCOPED, does NOT shrink accordion)
 * Version: v1.0.4
 * Date: 2026-04-25
 *
 * Goal
 * - Remove the large “fake gap” between the TWO shortcode widgets:
 *     1) Choose date (Woo add_to_cart_inline)
 *     2) Session slot tip block
 * - WITHOUT affecting the width/flow of the main accordion or right-hand ACF repeater column.
 *
 * Why previous v1.0.3 caused the accordion to go tiny
 * - It matched a container ancestor too high up (via :has()), so flex rules applied
 *   to a wider layout container, changing column sizing and causing wrap.
 *
 * This version is SAFE
 * - It ONLY targets a container you explicitly mark with a class.
 * - It ONLY changes the two shortcode widgets inside that container.
 * - No :has() .elementor-kit-5s, no broad container targeting.
 *
 * REQUIRED (Elementor setup)
 * 1) Select the CHILD container (items direction: right) that contains ONLY the
 *    two shortcode widgets (Choose date + Session slot tip).
 * 2) Advanced → CSS Classes:  pn-slot-row
 *
 * Where to paste
 * ✅ Elementor → Site Settings → Custom CSS (Global)
 *   (Safe because .elementor-kit-5 is limited to .elementor-2156 .pn-slot-row)
 * ========================================================= */

/* ---- tweak spacing here if you want 4px/8px etc ---- */
.elementor-2156 .pn-slot-row{ --pn-slot-gap: 6px; }

/* 1) Tight gap ONLY inside this row */
.elementor-2156 .pn-slot-row{
  /* Elementor gap variables */
  --column-gap: var(--pn-slot-gap) !important;
  --row-gap: 0px !important;
  --gap: 0px var(--pn-slot-gap) !important;

  /* Belt-and-braces */
  column-gap: var(--pn-slot-gap) !important;
  row-gap: 0px !important;
  gap: var(--pn-slot-gap) !important;

  /* Keep aligned to the top like your accordion column */
  align-items: flex-start !important;
  align-content: flex-start !important;
  justify-content: flex-start !important;
}

/* 2) CRITICAL: Override Elementor’s flex:1 rule on the shortcode widgets
      WITHOUT using elementor-element-XXXX IDs.
      We match the actual widget wrapper element which has BOTH classes:
      .elementor-element + .elementor-widget-shortcode
      and data-widget_type="shortcode.default" for extra specificity.
*/
.elementor-2156 .pn-slot-row .elementor-element.elementor-widget-shortcode[data-widget_type="shortcode.default"],
.elementor-2156 .pn-slot-row .elementor-element.elementor-widget-shortcode[data-widget_type="shortcode.default"] .elementor-widget-container{
  flex: 0 1 auto !important;     /* no grow, YES shrink */
  flex-grow: 0 !important;
  flex-shrink: 1 !important;
  flex-basis: auto !important;
  min-width: 0 !important;
  width: auto !important;
  margin: 0 !important;
}

/* 3) Shrink-wrap the actual Woo add_to_cart_inline output so it doesn’t behave like a full-width block */
.elementor-2156 .pn-slot-row .add_to_cart_inline{
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  margin: 0 !important;
}

/* Keep the Choose date label on one line */
.elementor-2156 .pn-slot-row a.add_to_cart_button{
  white-space: nowrap !important;
}

/* Allow the session slot text to wrap if space gets tight */
.elementor-2156 .pn-slot-row .elementor-shortcode{ white-space: normal !important; }
.elementor-2156 .pn-slot-row .elementor-shortcode p{ margin: 0 !important; }/* End custom CSS */