.tth-account-access-group{display:inline-flex;align-items:center;gap:12px;flex-wrap:wrap}
.tth-site-signout-link{display:inline-flex;align-items:center;text-decoration:none!important;font-weight:800;color:var(--tth-berry)!important;white-space:nowrap}
.tth-site-signout-link:hover{text-decoration:underline!important}
/* TTH v1.12.0 — small dynamic header/footer helpers + scoped commerce cleanup. */
.tth-account-access-link{display:inline-flex;align-items:center;justify-content:center;gap:7px;text-decoration:none!important;font-weight:800;color:var(--tth-ink)!important;white-space:nowrap}
.tth-account-access-link:hover{color:var(--tth-berry)!important}
.tth-account-access-icon{display:grid;place-items:center;width:30px;height:30px;border-radius:999px;background:var(--tth-lilac);color:var(--tth-berry);font-size:17px;line-height:1}
.tth-footer-account-links{list-style:none!important;margin:0!important;padding:0!important;display:grid;gap:9px}
.tth-footer-account-links li{margin:0!important;padding:0!important}
.tth-footer-account-links a{color:inherit;text-decoration:none!important}
.tth-footer-account-links a:hover{color:var(--tth-berry)!important}

/* Woo remains the engine, but cart/checkout should feel like TTH instead of demo-shop UI. */
.tth-commerce-cart .woocommerce,
.tth-commerce-checkout .woocommerce{max-width:1180px;margin-left:auto;margin-right:auto;padding-left:22px;padding-right:22px}
.tth-commerce-cart .woocommerce-cart-form,
.tth-commerce-cart .cart_totals,
.tth-commerce-checkout form.checkout,
.tth-commerce-checkout .woocommerce-order,
.tth-commerce-thankyou .woocommerce-order{background:#fff;border:1px solid var(--tth-border);border-radius:20px;box-shadow:var(--tth-shadow-soft)}
.tth-commerce-cart .woocommerce-cart-form{padding:18px;overflow:hidden}
.tth-commerce-cart .cart_totals{padding:22px}
.tth-commerce-checkout form.checkout{padding:24px}
.tth-commerce-checkout #customer_details .col-1,
.tth-commerce-checkout #customer_details .col-2{background:var(--tth-cream);border:1px solid #f1e5dc;border-radius:16px;padding:20px}
.tth-commerce-checkout #order_review,
.tth-commerce-checkout #order_review_heading{background:#fff}
.tth-commerce-cart .button,
.tth-commerce-checkout .button,
.tth-commerce-checkout #place_order{border-radius:12px!important;font-weight:800!important}
.tth-commerce-checkout #place_order,
.tth-commerce-cart .checkout-button{background:var(--tth-berry)!important;color:#fff!important;border:0!important}
.tth-commerce-checkout #place_order:hover,
.tth-commerce-cart .checkout-button:hover{background:#74345f!important}
.tth-commerce-cart table.shop_table,
.tth-commerce-checkout table.shop_table{border-color:var(--tth-border)!important;border-radius:14px!important;overflow:hidden}
.tth-commerce-checkout .woocommerce-info,
.tth-commerce-cart .woocommerce-info{border-top-color:var(--tth-purple)!important;background:var(--tth-lilac)!important;border-radius:12px}
.tth-commerce-thankyou .woocommerce-order{max-width:980px;margin:28px auto;padding:28px}
@media(max-width:768px){
  .tth-account-access-link{font-size:14px}.tth-account-access-icon{width:28px;height:28px}
  .tth-commerce-cart .woocommerce,.tth-commerce-checkout .woocommerce{padding-left:14px;padding-right:14px}
  .tth-commerce-checkout form.checkout{padding:16px}
}


/* v1.12.2 — keep the dynamic account menu label on one line. */
.tth-dynamic-account-menu-item>a{white-space:nowrap!important;word-break:keep-all!important;min-width:max-content}

/* v1.12.3 — mobile shell cleanup for the remaining KidsCenter demo bar. */
@media (max-width: 900px){
  /* Hide the legacy KidsCenter fixed bottom navigation (Home / Classes / Phone / More).
     These selectors are intentionally limited to common BZOTech/KidsCenter mobile-bar wrappers. */
  body.tth-site-experience .bzotech-mobile-menu-fixed,
  body.tth-site-experience .bzotech-mobile-bottom-nav,
  body.tth-site-experience .mobile-bottom-nav,
  body.tth-site-experience .mobile-fixed-menu,
  body.tth-site-experience .fixed-bottom-menu,
  body.tth-site-experience .footer-mobile-menu,
  body.tth-site-experience .mobile-footer-nav,
  body.tth-site-experience .bottom-mobile-menu,
  body.tth-site-experience [class*="mobile-bottom-menu"],
  body.tth-site-experience [class*="mobile-fixed-menu"]{
    display:none!important;
  }
  body.tth-site-experience{padding-bottom:0!important}
}
/* v1.17.8 — Header geometry is intentionally not controlled here. Elementor/theme
   remain authoritative for logo size, menu spacing, typography, and breakpoints. */
@media(max-width:767px){.tth-account-access-group{gap:8px}.tth-site-signout-link{font-size:13px}}


/* v1.17.8 — persistent cart access without overriding Elementor header geometry.
   The menu item inherits the same typography/spacing as the rest of the active menu;
   only clickability and stacking are enforced here. */
.tth-dynamic-cart-menu-item{position:relative!important;z-index:50!important;pointer-events:auto!important}
.tth-dynamic-cart-menu-item>a{position:relative!important;z-index:51!important;pointer-events:auto!important;cursor:pointer!important}

/* Hide the imported KidsCenter/demo-shop title artwork only on TTH commerce pages. */
body.tth-commerce-cart .banner-page,
body.tth-commerce-checkout .banner-page,
body.tth-commerce-cart .page-title-wrapper,
body.tth-commerce-checkout .page-title-wrapper,
body.tth-commerce-cart .bzotech-breadcrumb,
body.tth-commerce-checkout .bzotech-breadcrumb,
body.tth-commerce-cart .breadcrumb-container,
body.tth-commerce-checkout .breadcrumb-container,
body.tth-commerce-cart .bread-crumb:not(.woocommerce-breadcrumb),
body.tth-commerce-checkout .bread-crumb:not(.woocommerce-breadcrumb),
body.tth-commerce-cart .title-page,
body.tth-commerce-checkout .title-page{
  display:none!important
}
body.tth-commerce-cart .woocommerce-breadcrumb,
body.tth-commerce-checkout .woocommerce-breadcrumb{display:none!important}

.tth-commerce-intro{
  max-width:1180px;margin:26px auto 20px;padding:24px 28px;
  display:flex;align-items:center;justify-content:space-between;gap:22px;
  background:linear-gradient(135deg,#fbf7ff 0%,#fffaf5 100%);
  border:1px solid var(--tth-border);border-radius:22px;box-shadow:var(--tth-shadow-soft)
}
.tth-commerce-eyebrow{display:block;margin-bottom:5px;color:var(--tth-berry);font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.tth-commerce-intro h1{margin:0 0 6px!important;color:var(--tth-ink)!important;font-size:clamp(30px,4vw,48px)!important;line-height:1.05!important}
.tth-commerce-intro p{margin:0!important;color:#5f5a68!important;font-size:16px;line-height:1.55}
.tth-commerce-credits-link{
  flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-height:44px;
  padding:10px 16px;border-radius:12px;background:var(--tth-berry);color:#fff!important;
  font-weight:800;text-decoration:none!important
}
.tth-commerce-credits-link:hover{background:#74345f;color:#fff!important}
body.tth-commerce-cart .site-main,
body.tth-commerce-checkout .site-main{padding-top:0!important}

@media(max-width:900px){
  .tth-dynamic-cart-menu-item>a{min-height:36px;padding:7px 11px!important;font-size:13px!important}
}
@media(max-width:700px){
  .tth-commerce-intro{margin:16px 14px;padding:20px;display:block}
  .tth-commerce-credits-link{margin-top:14px;width:100%}
}


/* v1.17.14 — desktop header typography is copied from a normal Elementor menu link at runtime.
   Do not force font size/color/padding here; Elementor remains authoritative for the header. */
@media (min-width:1025px){
  body.tth-site-experience li.tth-runtime-account-menu-item,
  body.tth-site-experience li.tth-dynamic-account-menu-item,
  body.tth-site-experience li.tth-dynamic-cart-menu-item{
    width:auto!important;min-width:0!important;flex:0 0 auto!important
  }
  body.tth-site-experience li.tth-runtime-account-menu-item>a,
  body.tth-site-experience li.tth-dynamic-account-menu-item>a,
  body.tth-site-experience li.tth-dynamic-cart-menu-item>a{
    white-space:nowrap!important;min-width:0!important
  }
}

/* v1.17.11 — the theme's mobile off-canvas menu lives inside the header.
   Keep the whole header stacking context above plugin-owned homepage cards so
   an open menu can never be covered by the promo/hero content underneath it. */
@media (max-width:1024px){
  body.tth-site-experience header,
  body.tth-site-experience .site-header,
  body.tth-site-experience .elementor-location-header,
  body.tth-site-experience [data-elementor-type="header"]{
    position:relative!important;z-index:2147482000!important
  }
  body.tth-site-experience .tth-home-promo-top,
  body.tth-site-experience main,
  body.tth-site-experience .site-content{position:relative;z-index:1!important}
  body.tth-site-experience [class*="offcanvas"],
  body.tth-site-experience [class*="off-canvas"],
  body.tth-site-experience [class*="mobile-menu"],
  body.tth-site-experience [class*="menu-mobile"]{z-index:2147483000!important}
}

/* v1.17.13 — runtime header typography is synchronized from a normal Elementor menu link in JS.
   Do not independently size/color My Account or Cart here. */
@media (min-width:1025px){
  body.tth-site-experience li.tth-runtime-account-menu-item > a,
  body.tth-site-experience li.tth-dynamic-account-menu-item > a,
  body.tth-site-experience li.tth-dynamic-cart-menu-item > a{
    font-size:inherit!important;font-family:inherit!important;font-weight:inherit!important;
    line-height:inherit!important;letter-spacing:inherit!important;text-transform:inherit!important;
  }
}

/* v1.17.15 — mobile navigation must always cover page content, and the
   homepage acquisition strip needs breathing room below the Elementor header. */
body.tth-site-experience .tth-home-promo-top{
  margin-top:28px!important;
}
@media (max-width:1024px){
  /* Keep normal page content in a deliberately low stacking context. */
  body.tth-site-experience .tth-home-promo-top,
  body.tth-site-experience main,
  body.tth-site-experience #content,
  body.tth-site-experience .site-content,
  body.tth-site-experience .elementor-location-single,
  body.tth-site-experience [data-elementor-type="wp-page"]{
    position:relative!important;
    z-index:0!important;
  }

  /* The imported theme uses different off-canvas class names at different
     breakpoints. Give every likely menu shell/panel/overlay its own top-level
     stacking context so cards, promo panels and resource images cannot paint
     above an open menu. */
  body.tth-site-experience :is(
    [class*="offcanvas"],[class*="off-canvas"],[class*="off_canvas"],
    [class*="canvas-menu"],[class*="menu-canvas"],
    [class*="mobile-menu"],[class*="menu-mobile"],
    [class*="mobile_nav"],[class*="mobile-nav"],
    [class*="menu-overlay"],[class*="menu_overlay"],
    [class*="offcanvas-overlay"],[class*="canvas-overlay"]
  ){
    z-index:2147483600!important;
  }
  body.tth-site-experience :is(
    [class*="offcanvas"],[class*="off-canvas"],[class*="off_canvas"],
    [class*="canvas-menu"],[class*="menu-canvas"],
    [class*="mobile-menu"],[class*="menu-mobile"]
  ) :is(nav,ul,.menu,.elementor-nav-menu){
    position:relative!important;
    z-index:2147483640!important;
  }
  body.tth-site-experience .elementor-location-header,
  body.tth-site-experience [data-elementor-type="header"],
  body.tth-site-experience header.site-header,
  body.tth-site-experience header{
    position:relative!important;
    z-index:2147483500!important;
    isolation:isolate;
  }
  body.tth-site-experience .tth-home-promo-top{margin-top:18px!important}
}

/* v1.17.16 — lift the *actual* live mobile drawer above all page content.
   JS identifies the theme's visible drawer and adds these classes only after
   a mobile navigation trigger is used, avoiding continuous DOM observers. */
@media (max-width:1024px){
  body.tth-site-experience.tth-mobile-menu-layer-active .tth-home-promo-top,
  body.tth-site-experience.tth-mobile-menu-layer-active main,
  body.tth-site-experience.tth-mobile-menu-layer-active #content,
  body.tth-site-experience.tth-mobile-menu-layer-active .site-content,
  body.tth-site-experience.tth-mobile-menu-layer-active [data-elementor-type="wp-page"]{
    position:relative!important;
    z-index:0!important;
  }
  body.tth-site-experience .tth-mobile-menu-elevated{
    z-index:2147483646!important;
    isolation:isolate!important;
  }
  body.tth-site-experience .tth-mobile-menu-elevated-panel{
    z-index:2147483647!important;
  }
}


/* v1.17.17 — when the imported theme mobile drawer is open, remove the page
   canvas from the paint stack entirely.  Previous z-index-only fixes were not
   sufficient because some Elementor/theme descendants establish their own
   stacking contexts.  The header/drawer remains visible; normal page content
   is temporarily hidden until the drawer closes. */
@media (max-width:1024px){
  body.tth-site-experience.tth-mobile-menu-layer-active > :not(.elementor-location-header):not([data-elementor-type="header"]):not(header):not(.tth-mobile-menu-elevated),
  body.tth-site-experience.tth-mobile-menu-layer-active main,
  body.tth-site-experience.tth-mobile-menu-layer-active #content,
  body.tth-site-experience.tth-mobile-menu-layer-active .site-content,
  body.tth-site-experience.tth-mobile-menu-layer-active .elementor-location-single,
  body.tth-site-experience.tth-mobile-menu-layer-active [data-elementor-type="wp-page"],
  body.tth-site-experience.tth-mobile-menu-layer-active .tth-home-promo-top{
    visibility:hidden!important;
    pointer-events:none!important;
  }
  body.tth-site-experience.tth-mobile-menu-layer-active .elementor-location-header,
  body.tth-site-experience.tth-mobile-menu-layer-active [data-elementor-type="header"],
  body.tth-site-experience.tth-mobile-menu-layer-active header,
  body.tth-site-experience.tth-mobile-menu-layer-active .tth-mobile-menu-elevated{
    visibility:visible!important;
    pointer-events:auto!important;
  }
}


/* v1.17.53 — logged-in top-bar account greeting dropdown.
   The trigger remains part of the Elementor/theme header; the floating menu is
   plugin-owned and deliberately small. */
.tth-account-greeting-trigger{
  cursor:pointer!important;
  user-select:none;
}
.tth-account-greeting-chevron{
  display:inline-block;
  margin-left:7px;
  font-size:.8em;
  line-height:1;
  transform:translateY(-1px);
  transition:transform .16s ease;
}
.tth-account-greeting-trigger[aria-expanded="true"] .tth-account-greeting-chevron{
  transform:translateY(1px) rotate(180deg);
}
.tth-account-greeting-menu{
  position:fixed;
  z-index:2147483600;
  box-sizing:border-box;
  padding:8px;
  border:1px solid #eadde8;
  border-radius:16px;
  background:#fff;
  box-shadow:0 14px 36px rgba(48,35,58,.18);
}
.tth-account-greeting-menu[hidden]{display:none!important}
.tth-account-greeting-menu a{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:44px;
  padding:9px 11px;
  border-radius:10px;
  color:#393140!important;
  text-decoration:none!important;
  font-size:14px;
  font-weight:750;
  line-height:1.25;
  outline:none;
}
.tth-account-greeting-menu a:hover,
.tth-account-greeting-menu a:focus{
  background:#f7f1fa;
  color:#94386f!important;
}
.tth-account-menu-icon{
  display:inline-flex;
  flex:0 0 28px;
  width:28px;
  height:28px;
  align-items:center;
  justify-content:center;
  border-radius:9px;
  background:#f2edf8;
  color:#96396f;
  font-size:14px;
  font-weight:900;
}
.tth-account-menu-separator{
  height:1px;
  margin:6px 8px;
  background:#eee5ed;
}
.tth-account-greeting-menu .tth-account-menu-signout{
  color:#783552!important;
}
.tth-account-greeting-menu .tth-account-menu-signout:hover,
.tth-account-greeting-menu .tth-account-menu-signout:focus{
  background:#fff2f5;
  color:#783552!important;
}
@media(max-width:600px){
  .tth-account-greeting-menu{
    max-width:calc(100vw - 24px);
    border-radius:14px;
    box-shadow:0 16px 38px rgba(48,35,58,.22);
  }
  .tth-account-greeting-menu a{
    min-height:48px;
    font-size:15px;
  }
}