/* ================================================================
   ODYSSEY VIRTUAL IOP INTAKE
   Focused intake router and HubSpot form shell.
   ================================================================ */

.obh-virtual-iop-intake {
  --obh-intake-text: #062f4a;
  --obh-intake-accent: #204e88;
  --obh-intake-accent-hover: #17365f;
  --obh-intake-track: #e4eaf0;
  --obh-intake-border: #cbd7e2;
  --obh-intake-surface: #ffffff;
  --obh-intake-selected: #eef6fc;
  --obh-intake-description: #517186;
  --obh-intake-focus: #2799de;

  width: 100%;
  max-width: 660px;
  margin: 0 auto;
  padding: 24px 0 48px;

  color: var(--obh-intake-text);
  font-family: "LT Superior", sans-serif;
  box-sizing: border-box;
}

.obh-virtual-iop-intake *,
.obh-virtual-iop-intake *::before,
.obh-virtual-iop-intake *::after {
  box-sizing: border-box;
}

.obh-virtual-iop-intake [hidden] {
  display: none !important;
}

/* Progress bar */

.obh-intake-progress {
  width: 100%;
  height: 10px;
  margin: 0 0 40px;
  overflow: hidden;

  background: var(--obh-intake-track);
  border-radius: 999px;
}

.obh-intake-progress__fill {
  display: block;
  width: 50%;
  height: 100%;

  background: linear-gradient(90deg, #258fe8 0%, #b05acb 100%);
  border-radius: inherit;
  transition: width 300ms ease;
}

/* Initial routing question */

.obh-virtual-iop-intake .obh-intake-question {
  margin: 0 0 32px;
  padding: 0;

  color: var(--obh-intake-text) !important;
  font-family: "Shippori Mincho", serif !important;
  font-size: 1.75rem !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
  letter-spacing: -1.45px !important;
  text-transform: none !important;
}

.obh-virtual-iop-intake .obh-intake-question:focus {
  outline: none;
}

/* Routing choices */

.obh-intake-routing-form,
.obh-intake-options {
  width: 100%;
  margin: 0;
  padding: 0;
}

.obh-intake-options {
  display: grid;
  gap: 14px;
  border: 0;
}

.obh-intake-option {
  position: relative;
  display: block;
  margin: 0;
  cursor: pointer;
}

.obh-intake-option input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.obh-intake-option span {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 64px;
  padding: 16px 20px;

  color: var(--obh-intake-text);
  background: var(--obh-intake-surface);
  border: 1px solid var(--obh-intake-border);
  border-radius: 3px;

  font-family: "LT Superior", sans-serif;
  font-size: 1.03rem;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -0.1px;

  transition:
    border-color 180ms ease,
    background-color 180ms ease,
    box-shadow 180ms ease;
}

.obh-intake-option:hover span {
  border-color: var(--obh-intake-accent);
}

.obh-intake-option input:checked + span {
  background: var(--obh-intake-selected);
  border-color: var(--obh-intake-accent);
  box-shadow: 0 0 0 1px var(--obh-intake-accent);
}

.obh-intake-option input:focus-visible + span {
  outline: 3px solid var(--obh-intake-focus);
  outline-offset: 3px;
}


/* HUBSPOT TREATMENT CHECKBOX CARDS */

/*
 * Converts only the Virtual IOP treatment-category and
 * condition checkboxes into the same visual card system
 * used by the initial routing choices.
 */

/* Space below optional disorder-list labels */
.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup:has(
  input[name="0-1/mental_health_disorders"]
) > .hsfc-FieldLabel,
.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup:has(
  input[name="0-1/sud_disorders"]
) > .hsfc-FieldLabel,
.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup:has(
  input[name="0-1/ed_disorders"]
) > .hsfc-FieldLabel {
  margin-bottom: 16px !important;
}

.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options:has(
  input[name="0-1/disorder_category"]
),
.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options:has(
  input[name="0-1/mental_health_disorders"]
),
.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options:has(
  input[name="0-1/sud_disorders"]
),
.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options:has(
  input[name="0-1/ed_disorders"]
) {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 14px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options:has(
  input[name="0-1/disorder_category"]
) > div,
.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options:has(
  input[name="0-1/mental_health_disorders"]
) > div,
.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options:has(
  input[name="0-1/sud_disorders"]
) > div,
.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options:has(
  input[name="0-1/ed_disorders"]
) > div {
  margin: 0 !important;
  padding: 0 !important;
}

.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options
label.hsfc-FieldLabel:has(
  input[name="0-1/disorder_category"]
),
.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options
label.hsfc-FieldLabel:has(
  input[name="0-1/mental_health_disorders"]
),
.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options
label.hsfc-FieldLabel:has(
  input[name="0-1/sud_disorders"]
),
.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options
label.hsfc-FieldLabel:has(
  input[name="0-1/ed_disorders"]
) {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 64px !important;
  margin: 0 !important;
  padding: 16px 20px !important;

  color: var(--obh-intake-text) !important;
  background: var(--obh-intake-surface) !important;
  border: 1px solid var(--obh-intake-border) !important;
  border-radius: 3px !important;

  font-family: "LT Superior", sans-serif !important;
  font-size: 1.03rem !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.1px !important;

  cursor: pointer !important;
  box-sizing: border-box !important;

  transition:
    border-color 180ms ease,
    background-color 180ms ease,
    box-shadow 180ms ease !important;
}

.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options
input.hsfc-CheckboxInput:is(
  [name="0-1/disorder_category"],
  [name="0-1/mental_health_disorders"],
  [name="0-1/sud_disorders"],
  [name="0-1/ed_disorders"]
) {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options
label.hsfc-FieldLabel:has(
  input:is(
    [name="0-1/disorder_category"],
    [name="0-1/mental_health_disorders"],
    [name="0-1/sud_disorders"],
    [name="0-1/ed_disorders"]
  )
) > span {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
}

.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options
label.hsfc-FieldLabel:has(
  input:is(
    [name="0-1/disorder_category"],
    [name="0-1/mental_health_disorders"],
    [name="0-1/sud_disorders"],
    [name="0-1/ed_disorders"]
  )
):hover {
  border-color: var(--obh-intake-accent) !important;
}

.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options
label.hsfc-FieldLabel:has(
  input:is(
    [name="0-1/disorder_category"],
    [name="0-1/mental_health_disorders"],
    [name="0-1/sud_disorders"],
    [name="0-1/ed_disorders"]
  ):checked
) {
  background: var(--obh-intake-selected) !important;
  border-color: var(--obh-intake-accent) !important;
  box-shadow: 0 0 0 1px var(--obh-intake-accent) !important;
}

.obh-virtual-iop-intake
.hsfc-CheckboxFieldGroup__Options
label.hsfc-FieldLabel:has(
  input:is(
    [name="0-1/disorder_category"],
    [name="0-1/mental_health_disorders"],
    [name="0-1/sud_disorders"],
    [name="0-1/ed_disorders"]
  ):focus-visible
) {
  outline: 3px solid var(--obh-intake-focus) !important;
  outline-offset: 3px !important;
}


/* HUBSPOT NAME STEP */

/*
 * Styles the HubSpot "What's your name?" step to match
 * the Virtual IOP intake design system.
 */

.obh-virtual-iop-intake
.hsfc-Step:has(input[name="0-1/firstname"]):has(
  input[name="0-1/lastname"]
)
.hsfc-RichText p:first-child {
  margin: 0 !important;
  padding: 0 !important;

  color: var(--obh-intake-text) !important;
  font-family: "Shippori Mincho", serif !important;
  font-size: 1.75rem !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
  letter-spacing: -1.45px !important;
  text-transform: none !important;
}

.obh-virtual-iop-intake
.hsfc-Step:has(input[name="0-1/firstname"]):has(
  input[name="0-1/lastname"]
)
.hsfc-RichText p:nth-child(2) {
  display: none !important;
}

.obh-virtual-iop-intake
.hsfc-Step:has(input[name="0-1/firstname"]):has(
  input[name="0-1/lastname"]
)
.hsfc-Row:has(.hsfc-RichText) {
  margin-bottom: 32px !important;
}

.obh-virtual-iop-intake
.hsfc-Step:has(input[name="0-1/firstname"]):has(
  input[name="0-1/lastname"]
)
.hsfc-TextField > .hsfc-FieldLabel {
  margin: 0 0 10px !important;
  padding: 0 !important;

  color: var(--obh-intake-text) !important;
  font-family: "LT Superior", sans-serif !important;
  font-size: 1.03rem !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.1px !important;
  text-transform: none !important;
}

@media (max-width: 767px) {
  .obh-virtual-iop-intake
  .hsfc-Step:has(input[name="0-1/firstname"]):has(
    input[name="0-1/lastname"]
  )
  .hsfc-RichText p:first-child {
    font-size: 1.45rem !important;
  }
}

/* Router controls */

.obh-intake-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 32px;
}

.obh-virtual-iop-intake .obh-intake-continue {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 0 2px !important;

  color: var(--obh-intake-accent) !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid transparent !important;
  border-radius: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;

  font-family: "LT Superior", sans-serif !important;
  text-decoration: none !important;
  cursor: pointer;

  transition:
    color 180ms ease,
    border-color 180ms ease,
    opacity 180ms ease;
}

.obh-virtual-iop-intake .obh-intake-continue {
  font-size: 1.03rem !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.1px !important;
}


.obh-virtual-iop-intake .obh-intake-continue:hover:not(:disabled),
.obh-virtual-iop-intake .obh-intake-continue:focus-visible:not(:disabled) {
  color: var(--obh-intake-accent-hover) !important;
  background: transparent !important;
  border-bottom-color: currentColor !important;
}

.obh-virtual-iop-intake .obh-intake-continue::after {
  display: inline-block;
  font: inherit;
  font-size: 0.95em;
  line-height: 1;
  transition: transform 180ms ease;
}


.obh-virtual-iop-intake .obh-intake-continue::after {
  content: "\2192";
  margin-left: 0.35em;
}


.obh-virtual-iop-intake .obh-intake-continue:hover:not(:disabled)::after {
  transform: translateX(2px);
}

.obh-virtual-iop-intake .obh-intake-continue:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

/* HubSpot form shell */

.obh-intake-form-mount {
  width: 100%;
  min-height: 160px;

  --hsf-global__font-family: "LT Superior", sans-serif;
  --hsf-global__color: var(--obh-intake-text);
  --hsf-field-label__font-family: "LT Superior", sans-serif;
  --hsf-field-label__color: #102a4d;
  --hsf-field-input__font-family: "LT Superior", sans-serif;
  --hsf-field-input__border-color: #aebfce;
  --hsf-field-input__border-radius: 8px;
  --hsf-progressbar-progressLine__background-color: var(--obh-intake-accent);
  --hsf-progressbar-trackLine__background-color: var(--obh-intake-track);
}

.obh-intake-form-mount .hs-form-html {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  --hsf-background__padding: 0;
}

/* HubSpot navigation buttons */

.obh-intake-form-mount [data-hsfc-id="Button"] {
  appearance: none !important;
  padding: 0 0 2px !important;

  color: var(--obh-intake-text) !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid transparent !important;
  border-radius: 0 !important;
  outline: 0;
  box-shadow: none !important;

  font-family: "LT Superior", sans-serif !important;
  font-size: 1.03rem !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.1px !important;
  text-decoration: none !important;
  cursor: pointer !important;
  opacity: 1 !important;

  transition:
    color 180ms ease,
    border-color 180ms ease,
    opacity 180ms ease;
}

.obh-intake-form-mount [data-hsfc-id="Button"]:disabled {
  color: var(--obh-intake-accent) !important;
  cursor: not-allowed !important;
  opacity: 0.45 !important;
}

.obh-intake-form-mount [data-hsfc-id="Button"]:hover:not(:disabled) {
  color: var(--obh-intake-accent-hover) !important;
  background: transparent !important;
  border-bottom-color: currentColor !important;
  border-radius: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

.obh-intake-form-mount [data-hsfc-id="Button"]:focus-visible:not(:disabled) {
  color: var(--obh-intake-accent-hover) !important;
  background: transparent !important;
  border-bottom-color: currentColor !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 2px solid var(--obh-intake-focus) !important;
  outline-offset: 4px !important;
}

/* HubSpot Previous and Next arrows */

.obh-intake-form-mount
.hsfc-NavigationRow__Buttons
> [data-hsfc-id="Button"]:first-child:not(:last-child)::before,
.obh-intake-form-mount
.hsfc-NavigationRow__Buttons
> [data-hsfc-id="Button"][type="button"]:last-child::after {
  display: inline-block;
  font: inherit;
  line-height: 1;
}

.obh-intake-form-mount
.hsfc-NavigationRow__Buttons
> [data-hsfc-id="Button"]:first-child:not(:last-child)::before {
  content: "\2190";
  margin-right: 0.35em;
}

.obh-intake-form-mount
.hsfc-NavigationRow__Buttons
> [data-hsfc-id="Button"][type="button"]:last-child::after {
  content: "\2192";
  margin-left: 0.35em;
}

/* Main HubSpot field labels/questions */

.obh-intake-form-mount
:is([data-hsfc-id$="Field"], [data-hsfc-id$="FieldGroup"])
> [data-hsfc-id="FieldLabel"] {
  display: block !important;
  margin: 0 0 12px !important;

  color: var(--obh-intake-text) !important;
  font-family: "Shippori Mincho", serif !important;
  font-size: 1.55rem !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: -1.35px !important;
}

/* HubSpot field descriptions */

.obh-intake-form-mount [data-hsfc-id="FieldDescription"] {
	margin-top: 12px !important;
  margin-bottom: 28px !important;

  color: var(--obh-intake-description) !important;
  font-family: "LT Superior", sans-serif !important;
  font-size: 0.92rem !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
}

/* HubSpot date inputs */

.obh-intake-form-mount [data-hsfc-id="DateInput"] {
  color: var(--obh-intake-text) !important;
  font-family: "LT Superior", sans-serif !important;
  font-size: 1.03rem !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.1px !important;
}

/* HubSpot dropdowns */

.obh-intake-form-mount [data-hsfc-id="TextInput"][role="combobox"] {
  width: 100% !important;
  min-height: 54px !important;
  padding: 14px 48px 14px 16px !important;

  color: var(--obh-intake-text) !important;
  background: var(--obh-intake-surface) !important;
  border: 1px solid var(--obh-intake-border) !important;
  border-radius: 3px !important;
  box-shadow: none !important;

  font-family: "LT Superior", sans-serif !important;
  font-size: 1.03rem !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.1px !important;
  cursor: pointer;
}

.obh-intake-form-mount [data-hsfc-id="TextInput"][role="combobox"]:hover {
  border-color: var(--obh-intake-accent) !important;
}

.obh-intake-form-mount
[data-hsfc-id="TextInput"][role="combobox"]:focus-visible {
  border-color: var(--obh-intake-focus) !important;
  outline: 2px solid var(--obh-intake-focus) !important;
  outline-offset: 2px !important;
}

.obh-intake-form-mount .hsfc-DropdownOptions__List {
  padding: 6px !important;
  background: var(--obh-intake-surface) !important;
  border: 1px solid var(--obh-intake-border) !important;
  border-radius: 3px !important;
  box-shadow: 0 8px 24px rgb(6 47 74 / 12%) !important;
}

.obh-intake-form-mount .hsfc-DropdownOptions__List__ListItem {
  padding: 10px 12px !important;

  color: var(--obh-intake-text) !important;
  background: transparent !important;
  font-family: "LT Superior", sans-serif !important;
  font-size: 1.17rem !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.1px !important;
  cursor: pointer;
}

.obh-intake-form-mount .hsfc-DropdownOptions__List__ListItem:hover,
.obh-intake-form-mount
.hsfc-DropdownOptions__List__ListItem[aria-selected="true"] {
  color: var(--obh-intake-text) !important;
  background: var(--obh-intake-selected) !important;
}

/* HubSpot file-upload inputs */

.obh-intake-form-mount [data-hsfc-id="FileInput"] {
  color: var(--obh-intake-text) !important;
  font-family: "LT Superior", sans-serif !important;
  font-size: 1.17rem !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.1px !important;
}

.obh-intake-form-mount [data-hsfc-id="FileInput"]::file-selector-button {
  margin-right: 16px;
  padding: 8px 14px;

  color: var(--obh-intake-text);
  background: var(--obh-intake-surface);
  border: 1px solid var(--obh-intake-border);
  border-radius: 3px;

  font-family: "LT Superior", sans-serif;
  font-size: 1.17rem;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -0.1px;
  cursor: pointer;
}

/* HubSpot checkbox groups */

.obh-intake-form-mount [data-hsfc-id="CheckboxFieldGroup"] {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.obh-intake-form-mount
[data-hsfc-id="CheckboxFieldGroup"]
.hsfc-CheckboxFieldGroup__Options {
  display: grid !important;
  row-gap: 16px !important;
  width: 100% !important;
}

.obh-intake-form-mount
[data-hsfc-id="CheckboxFieldGroup"]
.hsfc-CheckboxFieldGroup__Options
> div
> [data-hsfc-id="FieldLabel"] {
  display: flex !important;
  align-items: flex-start !important;
  column-gap: 6px !important;
  margin: 0 !important;

  font-size: 1.03rem !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.1px !important;
}

.obh-intake-form-mount
[data-hsfc-id="CheckboxFieldGroup"]
[data-hsfc-id="CheckboxInput"] {
  flex: 0 0 auto !important;
  margin: 0.12em 0 0 !important;
}

/* Accessibility utility */

.obh-virtual-iop-intake .screen-reader-text {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Mobile */

@media (max-width: 767px) {
  .obh-virtual-iop-intake {
    max-width: none;
    padding: 20px 0 36px;
  }

  .obh-intake-progress {
    margin-bottom: 32px;
  }

  .obh-virtual-iop-intake .obh-intake-question {
    margin-bottom: 28px;
    font-size: 1.45rem !important;
  }

  .obh-intake-option span {
    min-height: 60px;
    font-size: 1.15rem;
  }

  .obh-intake-actions {
    margin-top: 28px;
  }

  .obh-intake-form-mount .hsfc-NavigationRow__Buttons {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: 100% !important;
    gap: 24px !important;
  }

  .obh-intake-form-mount
  .hsfc-NavigationRow__Buttons
  [data-hsfc-id="Button"] {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: max-content !important;
    margin: 0 !important;

    font-size: 0.95rem !important;
    line-height: 1.2 !important;
    letter-spacing: 0.5px !important;
  }

  .obh-intake-form-mount
  .hsfc-NavigationRow__Buttons
  [data-hsfc-id="Button"]:first-child:not(:last-child) {
    margin-right: auto !important;
  }
}

/* END ODYSSEY VIRTUAL IOP INTAKE */