/*
 * TSW Help Me Decide: the hero "Help Me Decide" glass pill on TSW's Squarespace site (D-16).
 *
 * THIS URL IS PERMANENT. Squarespace's header code injection links
 * https://app.thrivingspringswellness.com/loader.css (page-level on /hmd-spike during Phase 3,
 * the site-wide Header at Phase 5), so the file can never move or be renamed without editing
 * Squarespace. It is served unhashed with Cache-Control: public, max-age=300 (public/_headers),
 * so a fix reaches visitors within five minutes.
 *
 * It is loaded render-blocking from the Squarespace header, so the pill never flashes the
 * theme's default button style first. loader.js still does the exact-origin check before it
 * intercepts a click; this file only styles.
 *
 * Scope (EMBD-04, EMBD-07): every selector targets an anchor whose href starts with the app
 * origin, or that anchor's own .sqs-block-button-container. Nothing else on the page is
 * restyled, hidden or reset, and "Book Your 1:1 Consultation" (a www.vagaro.com link) can never
 * match. scripts/platform-config.test.ts pins this. Nothing is imported and no web font loads.
 *
 * Source: Paper "Thriving Springs Onboarding", desktop "Glass Button" 1KB-0 and mobile 2H-0
 * (03-PAPER-REFERENCE 3.6), as the Phase 1 spike pill (01-SPIKE-GATE Appendix) with the
 * UI-SPEC 6.5 changes: the site font, a hover fill and a focus ring.
 *
 * #siteWrapper matches Squarespace's own button selectors (ID specificity), and !important holds
 * the Paper values against the theme's primary-button rules and their hover states.
 * Squarespace draws its button hover animation on ::before, so ::before is switched off here
 * and the arrow badge is ::after.
 *
 * Font (D-17): the label uses the site's own button font, var(--primary-button-font-font-family)
 * (Typekit "interface" on the live site), not Paper's UI font, so nothing loads cross-origin.
 * If the site font has no 600 weight and the label renders faux-bold, switch font-weight to
 * var(--primary-button-font-font-weight) (UI-SPEC U-13, checked live in plan 03-07).
 *
 * Coral variant, for light page sections where the cream glass pill disappears: Paper
 * "Membership - How It Works - Coral HMD" (desktop and mobile), approved 2026-10-08. A link opts
 * in with an exact v=coral query parameter, for example
 * https://app.thrivingspringswellness.com/?src=membership&v=coral. The match is exact and
 * lowercase: v=coral preceded by ? or & and followed by the end of the link, & or #, so the
 * marker can sit anywhere in the query, while v=coralx, v=coral-dark and xv=coral stay glass.
 * Only paint changes (coral fill, no border, no blur, white label, darker hover, dark green focus
 * ring); geometry, font, badge, mobile and tablet rules are the glass pill's. Links without the
 * marker, including the hero ?src=hero pill, are unchanged.
 */

#siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"] {
  /* Paper desktop "Glass Button" */
  display: inline-flex !important;
  align-items: center !important;
  gap: 16px !important;
  box-sizing: border-box !important;
  height: 60px !important;
  padding: 0 10px 0 34px !important;
  border-radius: 999px !important;
  -webkit-backdrop-filter: blur(24px) saturate(125%);
  backdrop-filter: blur(24px) saturate(125%);
  background: #FBF8F31A !important;
  border: 1.5px solid #FBF8F3BF !important;
  /* Paper "Help Me Decide" text, in the site's button font (D-17) */
  color: #FBF8F3 !important;
  font-family: var(--primary-button-font-font-family), system-ui, sans-serif !important;
  font-size: 16px !important;
  font-style: normal !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  opacity: 1 !important;
}

#siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"]::before {
  content: none !important;
}

#siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"]::after {
  /* Paper desktop "Arrow Badge": 40px #FBF8F3 circle, 18px arrow stroked #10302E (lucide arrow-right) */
  content: "" !important;
  flex: none !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 999px !important;
  background: #FBF8F3 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2310302E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center / 18px 18px no-repeat !important;
}

/* Hover-capable pointers only, so a tap on a phone never leaves the hover fill stuck. Paper's
   14% glass fill (2T-0). No transition. */
@media (hover: hover) {
  #siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"]:hover {
    background: #FBF8F324 !important;
  }
}

#siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"]:focus-visible {
  outline: 2px solid #FBF8F3 !important;
  outline-offset: 3px !important;
}

/* Squarespace's mobile breakpoint. Paper's mobile artboard is 390px wide. */
@media (max-width: 767px) {
  .sqs-block-button-container:has(> a[data-sqsp-button][href^="https://app.thrivingspringswellness.com"]) {
    /* Paper mobile "Button Wrap": the button spans the block */
    width: 100% !important;
  }

  #siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"] {
    /* Paper mobile "Glass Button": full width, label centred */
    display: flex !important;
    justify-content: center !important;
    position: relative !important;
    width: 100% !important;
    height: 54px !important;
    padding: 0 54px !important;
  }

  #siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"]::after {
    /* Paper mobile "Arrow Badge": 38px, pinned 8px from the right, 16px arrow */
    position: absolute !important;
    right: 8px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 38px !important;
    height: 38px !important;
    background-size: 16px 16px !important;
  }
}

/* Tablet-width desktop layout (768-1199px): Fluid Engine shrinks the hero's button blocks below
   the pill's 210px nowrap width, so it overflowed its block into the consult button. Here the
   pill never exceeds its block: compact padding, type and badge, and the label wraps inside the
   pill instead of overflowing. docs/squarespace/consult-cta.css does the same for the consult
   button. */
@media (min-width: 768px) and (max-width: 1199px) {
  #siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"] {
    max-width: 100% !important;
    height: auto !important;
    min-height: 60px !important;
    gap: 10px !important;
    padding: 8px 8px 8px 20px !important;
    font-size: 15px !important;
    line-height: 18px !important;
    white-space: normal !important;
  }

  #siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"]::after {
    width: 36px !important;
    height: 36px !important;
    background-size: 16px 16px !important;
  }
}

/* Coral variant (v=coral; see the header). Paint only: geometry, font, ::before, the ::after
   badge and the mobile and tablet rules reach these links through the glass selectors above and
   are never repeated here. Specificity: the variant is (1,4,1) and its hover and focus (1,5,1).
   The glass :hover is also (1,4,1), so the paint rule must come after it in source order, which
   is why the variant sits at the end of the file. One full selector per marker (no :is() or
   :where()) keeps every alternative visibly scoped to the app origin. */
#siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href$="?v=coral"],
#siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href$="&v=coral"],
#siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href*="?v=coral&"],
#siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href*="&v=coral&"],
#siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href*="?v=coral#"],
#siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href*="&v=coral#"] {
  /* Paper "Coral HMD": #C48070 fill, no border, no blur, white label */
  background: #C48070 !important;
  border: 0 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  color: #FFFFFF !important;
}

@media (hover: hover) {
  #siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href$="?v=coral"]:hover,
  #siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href$="&v=coral"]:hover,
  #siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href*="?v=coral&"]:hover,
  #siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href*="&v=coral&"]:hover,
  #siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href*="?v=coral#"]:hover,
  #siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href*="&v=coral#"]:hover {
    background: #9E6355 !important;
  }
}

/* The glass pill's cream ring is invisible on light sections. */
#siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href$="?v=coral"]:focus-visible,
#siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href$="&v=coral"]:focus-visible,
#siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href*="?v=coral&"]:focus-visible,
#siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href*="&v=coral&"]:focus-visible,
#siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href*="?v=coral#"]:focus-visible,
#siteWrapper a.sqs-block-button-element[data-sqsp-button][href^="https://app.thrivingspringswellness.com"][href*="&v=coral#"]:focus-visible {
  outline: 2px solid #2E3D30 !important;
  outline-offset: 3px !important;
}