/**
 * Design corrections that have to land after the rebrand overlay.
 *
 * Hand-written, NOT generated - like css/mind-header.css and unlike
 * css/brand-override.css and css/font-override.css.
 *
 * WHY THIS FILE EXISTS RATHER THAN scss/
 * The rules being corrected here live in css/brand-override.css, which loads at
 * weight 100 - after the compiled css/style.css. Fixing them from SCSS would
 * mean either losing every specificity tie or inventing selectors like
 * `a.btn.btn-theme.btn-theme` to climb over them. This sheet is weight 103, so
 * it is last and ties resolve in its favour.
 *
 * And brand-override.css itself is off limits: it is GENERATED from
 * brand-override.mjs, yet the committed copy is already STALE because live
 * fixes were hand-edited onto the box and recovered in 6444f5c. Editing it
 * further deepens a file that regenerating would silently discard.
 *
 * To turn this off, remove `- mind/design-fixes` from mind.info.yml.
 */

/**
 * Brand-purple pill buttons: white label, 18px, no underline.
 *
 * The purple is #923aff, set on `.see-all, .btn-theme` in
 * brand-override.css:2560. Two shapes exist: `.see-all` is a wrapper whose
 * label is a child <a>, while `.btn-theme` is the button element itself
 * (an <a> in body copy, an <input> on the search, contact and service-finder
 * forms).
 *
 * The `.see-all` labels were unreadable: `a.link-theme` is given
 * `color: #3b2180 !important` and `text-decoration: underline !important`, so
 * dark purple sat on the purple pill at 2.49:1 - below WCAG AA's 4.5:1 for
 * normal text. brand-override.css:2584 already tried to fix this, but its
 * `color` is not !important so it lost, and it clears `border-bottom` when the
 * underline is actually `text-decoration`.
 *
 * White on #923aff measures 4.92:1, so 18px non-bold passes AA.
 *
 * Selectors mirror the ones being overridden rather than being minimal - each
 * has to match or exceed its counterpart's specificity:
 *   .field--name-body a.btn.btn-theme  - brand-override.css:2578, (0,4,1)
 *   input#edit-submit                  - brand-override.css:2509, (1,1,1),
 *                                        so an ID is required to reach it
 */
.see-all a.more-link,
.btn-theme,
.field--name-body a.btn.btn-theme,
.field--name-body a.btn.btn-theme.btn-lg,
input#edit-submit.btn-theme {
  color: #fff !important;
  font-size: 18px !important;
  text-decoration: none !important;
  border-bottom: none !important;
}

/**
 * Service finder legend/map toggles and the global back-to-top: adopt the
 * filled purple pill.
 *
 * These three were lavender #E4CEFF pills with dark text at 16px/700 and an
 * 8px radius - a style that exists nowhere in the new design. The new site's
 * filled button (the "View map" CTA on the home page, and Figma's
 * "Button-filled") is #923AFF with a light label, 15px radius, ~56px tall,
 * 0 44px padding, weight 400.
 *
 * That is already what `.see-all, .btn-theme` renders (brand-override.css:2560)
 * - the "Apply" button on this very page is one. The geometry has to be
 * restated rather than shared, because those declarations live in
 * brand-override.css and that file cannot be edited (see the header above).
 *
 * TWO DELIBERATE DEVIATIONS from a literal copy of the home page "View map":
 *   - 18px, not its 22px. 22px is a hero-CTA size; these are utility controls,
 *     and 18px is what the brief set for the purple pills above, so the whole
 *     family stays one size.
 *   - No 0.8px #FAF6F0 hairline. "View map" has one, but "Apply" sits directly
 *     beside these two and does not, and matching each other matters more here
 *     than matching the hero.
 *
 * The labels are Font Awesome inline SVGs which fill with currentColor, so the
 * map and arrow glyphs follow the white label without a separate rule.
 *
 * Each legacy colour class carries `background-color: … !important`, hence the
 * !important here; the class names are pre-rebrand and no longer describe the
 * colour they produce.
 */
a.btn.btn-periwinkle-25,
a.btn.btn-stronglime-50,
button.link-top.btn.btn-blue-25 {
  background: #923aff !important;
  color: #fff !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  border: none !important;
  border-radius: 15px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  /* min-height, not height: lets a wrapped label grow instead of clipping */
  min-height: 56px;
  padding: 0 44px !important;
  text-decoration: none !important;
}

/* Same hover as the rest of the family - brand-override.css:2574. */
a.btn.btn-periwinkle-25:hover,
a.btn.btn-stronglime-50:hover,
button.link-top.btn.btn-blue-25:hover {
  background: #7505ff !important;
  color: #fff !important;
}

/**
 * Back-to-top label.
 *
 * The label is not a text node on the button - it is a child
 * <span class="link-top__text">, and `.link-top__text` sits in the
 * colour-remap group at brand-override.css:2459 which forces
 * `color: #3b2180 !important`.
 *
 * So setting colour on the button above only reached the arrow, which is a
 * <path fill="currentColor"> and inherits. The span kept the dark purple,
 * giving a white arrow next to a dark label.
 */
button.link-top .link-top__text {
  color: #fff !important;
}