/*
 * WordPress-only additions. Everything visual comes from styles.css (the design demo's stylesheet, verbatim).
 * Keep this file small: a rule here is a rule the design system does not know about.
 */

/* Windows High Contrast / forced colours: the design's focus ring uses a custom property colour that the
   browser replaces, so draw it again in the system colour (doc 02, 2.3). */
@media (forced-colors: active) {
  :focus-visible,
  :where(.card-service--compact) .card-service__title a:focus-visible,
  .megamenu__cta-link:focus-visible,
  .searchbar input:focus-visible { outline: 3px solid Highlight; outline-offset: 2px; }
}

/* Plain WordPress pages (privacy policy, terms) that are not designed pages: readable prose in the design's type. */
.cc-prose { max-width: 926px; }
.cc-prose > * + * { margin-top: 1em; }
.cc-prose h2 { font-size: var(--fs-title-xl); line-height: 1.3; margin-top: 1.6em; }
.cc-prose h3 { font-size: var(--fs-title); line-height: 1.3; margin-top: 1.4em; }
.cc-prose a { color: inherit; text-decoration: underline; }
.cc-prose ul, .cc-prose ol { padding-left: 1.4em; }

/* Forms (owned by the theme since 28 Oct 2026, js/pages/forms.js). */
/* Conditional notes that set their own display (the attendant care note is a flex row). */
.page-enquiry [data-show-when][hidden] { display: none; }
/* Wording that names the plan picked: <span data-plan-text="NDIS|TAC|WorkSafe|">, toggled by the form script. */
.page-enquiry [data-plan-text][hidden] { display: none; }
.page-enquiry .enq-subgroup > .enq-hint--info { margin-top: 16px; }
/* Funding note: the housing paragraphs sit in their own block inside the note (shown for CareChoice Homes only). */
.page-enquiry .enq-note__more { display: flex; flex-direction: column; gap: 12px; }

/* Gravity Forms (forms CareChoice build themselves, 5 Nov 2026): the look of the site's own forms, set through
   Gravity Forms' theme settings (its rules are id-scoped and !important, so the settings carry !important too). */
.cc-gform { max-width: 760px; margin: 0 auto; }
.gform-theme--framework {
  --gf-font-family-base: inherit !important;
  --gf-font-family-primary: inherit !important;
  --gf-color-primary: var(--magenta) !important;
  --gf-color-primary-contrast: var(--bg) !important;
  --gf-color-danger: var(--magenta-dark) !important;
  --gf-form-gap-y: 24px !important;
  --gf-field-gap-x: 24px !important;
  --gf-field-gap-y: 24px !important;
  --gf-ctrl-font-family: inherit !important;
  --gf-ctrl-font-size: var(--fs-body) !important;
  --gf-ctrl-font-weight: 400 !important;
  --gf-ctrl-line-height: 1.5 !important;
  --gf-ctrl-color: var(--navy) !important;
  --gf-ctrl-color-focus: var(--navy) !important;
  --gf-ctrl-bg-color: var(--white) !important;
  --gf-ctrl-bg-color-focus: var(--white) !important;
  --gf-ctrl-border-color: var(--navy) !important;
  --gf-ctrl-border-color-hover: var(--navy) !important;
  --gf-ctrl-border-color-focus: var(--navy) !important;
  --gf-ctrl-border-color-error: var(--magenta-dark) !important;
  --gf-ctrl-border-width: 1.5px !important;
  --gf-ctrl-radius: var(--radius-sm) !important;
  --gf-ctrl-textarea-radius: var(--radius-sm) !important;
  --gf-ctrl-size: 48px !important;
  --gf-ctrl-padding-x: 16px !important;
  --gf-ctrl-shadow: none !important;
  --gf-ctrl-outline-color-focus: var(--focus-ring) !important;
  --gf-ctrl-outline-width-focus: 3px !important;
  --gf-ctrl-accent-color: var(--magenta-dark) !important;
  --gf-ctrl-choice-check-color: var(--magenta-dark) !important;
  --gf-ctrl-choice-size: 18px !important;
  --gf-ctrl-label-font-family-primary: inherit !important;
  --gf-ctrl-label-color-primary: var(--navy) !important;
  --gf-ctrl-label-font-size-primary: var(--fs-body) !important;
  --gf-ctrl-label-font-weight-primary: 600 !important;
  --gf-ctrl-label-color-secondary: var(--navy) !important;
  --gf-ctrl-label-font-size-secondary: var(--fs-small) !important;
  --gf-ctrl-label-font-weight-secondary: 400 !important;
  --gf-ctrl-label-color-tertiary: var(--navy) !important;
  --gf-ctrl-label-font-size-tertiary: var(--fs-body) !important;
  --gf-ctrl-label-font-weight-tertiary: 400 !important;
  --gf-ctrl-label-color-req: var(--magenta-dark) !important;
  --gf-ctrl-label-font-size-req: var(--fs-body) !important;
  --gf-ctrl-desc-color: var(--navy) !important;
  --gf-ctrl-desc-font-size: var(--fs-small) !important;
  --gf-ctrl-desc-color-error: var(--magenta-dark) !important;
  --gf-ctrl-desc-font-size-error: var(--fs-small) !important;
  --gf-ctrl-desc-font-weight-error: 600 !important;
  --gf-ctrl-btn-font-family: inherit !important;
  --gf-ctrl-btn-font-size: var(--fs-body) !important;
  --gf-ctrl-btn-font-weight: 600 !important;
  --gf-ctrl-btn-radius: var(--radius-sm) !important;
  --gf-ctrl-btn-size: 48px !important;
  --gf-ctrl-btn-padding-x: 24px !important;
  --gf-ctrl-btn-bg-color-primary: var(--magenta) !important;
  --gf-ctrl-btn-bg-color-hover-primary: var(--magenta-hover) !important;
  --gf-ctrl-btn-bg-color-focus-primary: var(--magenta) !important;
  --gf-ctrl-btn-border-color-primary: var(--magenta) !important;
  --gf-ctrl-btn-border-color-hover-primary: var(--magenta-hover) !important;
  --gf-ctrl-btn-border-color-focus-primary: var(--magenta) !important;
  --gf-ctrl-btn-color-primary: var(--bg) !important;
  --gf-ctrl-btn-color-hover-primary: var(--bg) !important;
  --gf-ctrl-btn-color-focus-primary: var(--bg) !important;
  --gf-ctrl-btn-shadow-focus: none !important;
}
/* Controls keep a normal line height: Gravity Forms derives it from the full control height, which hides a select's
   chosen option once padding is added. */
.gform-theme--framework .gfield input:not([type="checkbox"]):not([type="radio"]),
.gform-theme--framework .gfield select,
.gform-theme--framework .gfield textarea { line-height: 1.5 !important; }
.gform-theme--framework .gfield select {
  padding-top: 11px !important; padding-bottom: 11px !important; padding-right: 52px !important;
  background: var(--white) url(../assets/Icon-arrow-down-2.svg) no-repeat right 16px center / 24px 24px !important;
}
/* A field with an error: the design's thicker magenta-dark edge. */
.gform-theme--framework .gfield_error :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) { box-shadow: 0 0 0 1px var(--magenta-dark) !important; }
/* The error summary at the top, as the site's: white box, magenta-dark edge, bold underlined links. */
.gform-theme--framework .gform_validation_errors { padding: 24px 32px !important; border: 2px solid var(--magenta-dark) !important; border-radius: var(--radius-sm) !important; background: var(--white) !important; box-shadow: none !important; }
.gform-theme--framework .gform_validation_errors .gform_submission_error { font-size: var(--fs-title-xl) !important; font-weight: 600 !important; color: var(--navy) !important; }
.gform-theme--framework .gform_validation_errors a { font-weight: 600; color: var(--magenta-dark) !important; text-underline-offset: 3px; }
.gform-theme--framework .gform_validation_errors .gform-icon { display: none !important; }
/* Submit: the design's arrow after the label. */
.gform-theme--framework .gform_footer .gform_button { display: inline-flex !important; align-items: center; gap: 8px; }
.gform-theme--framework .gform_footer .gform_button::after { content: "" !important; display: block !important; width: 24px; height: 24px; flex: 0 0 auto; background: currentColor !important; -webkit-mask: url(../assets/Icon-arrow-right.svg) center / contain no-repeat; mask: url(../assets/Icon-arrow-right.svg) center / contain no-repeat; }
/* The design's focus ring: magenta outline, 2px clear of the control. */
.gform-theme--framework .gfield :is(input, select, textarea):focus-visible,
.gform-theme--framework input[type="submit"]:focus-visible { outline: 3px solid var(--focus-ring) !important; outline-offset: 2px !important; box-shadow: none !important; }
/* Errors read like the site's: no boxed message per field, bold magenta-dark text. */
.gform-theme--framework .gfield_validation_message { padding: 0 !important; border: 0 !important; background: none !important; }
.gform-theme--framework .gform_required_legend { font-size: var(--fs-small); color: var(--navy); }
/* The thank-you message after sending: the design's note box (magenta-dark edge, white). */
.cc-gform .gform_confirmation_message { padding: 24px 32px; border-left: 4px solid var(--magenta-dark); border-radius: var(--radius-sm); background: var(--white); font-size: var(--fs-body); line-height: 1.5; color: var(--navy); }