/* Element defaults for the auth pages.
   Deliberately not the Style Center's reset.css or typography.css: those style
   bare elements against a design system that assumes its own layout, and this
   page reproduces a fixed existing layout. Tokens yes, element layer no. */

:root {
  /* The one property-level token this page needs.
     foundation/buttons.css uses --hc-parallax-easing three times inside its
     transition shorthand, but the Style Center defines it in
     foundation/layout.css — a layer auth does not vendor, because it carries a
     .container grid system this page has no use for.

     Left undefined, every var() referencing it invalidates its whole
     declaration at computed-value time and .con-button silently loses all
     transitions, with nothing logged. Value copied verbatim from
     foundation/layout.css in @hollaco/style-center@2.0.0.

     Remove this when the token moves to the semantic tier upstream, where it
     belongs. */
  --hc-parallax-easing: cubic-bezier(0.42, 0, 0, 1);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  height: 100%;
}

body {
  background-color: var(--hc-color-background-default);
  color: var(--hc-color-content-default);
  font-family: var(--hc-font-family-default);
  font-size: var(--hc-typography-font-size-body-md);
  font-weight: var(--hc-font-weight-body);
  line-height: var(--hc-typography-line-height-body-md);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img {
  display: block;
  max-width: 100%;
}

/* Underline stays. #136a6a against #333 body copy is 1.98:1, far below the 3:1
   WCAG 1.4.1 requires when colour is the only thing separating a link from the
   text around it — so the underline is the second cue and it has to stay. A
   component may drop it for a standalone link that is unambiguously interactive;
   a bare element rule is the wrong place to make that call. */
a {
  color: var(--hc-color-content-brand);
}

button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
}

button {
  cursor: pointer;
}

/* One visible focus treatment for everything, on the token the Style Center
   already themes for both grounds. */
:focus-visible {
  outline: var(--hc-border-width-md) solid var(--hc-color-focus-ring-default);
  outline-offset: var(--hc-border-width-md);
}

/* Webflow's form-state divs.
   There are four of each in the markup, holding "Thank you! Your submission has
   been received!" and "Oops! Something went wrong...". Nothing in this codebase
   uses them — the Webflow JS that would have is long gone — and they are hidden
   ONLY by web/css/components.css, which is Webflow's and which Plan 4 deletes.

   They cannot be removed from the markup: that changes the tree shape, and 60%
   of the geometry baseline is keyed by nth-child path.

   So this rule owns hiding them. Without it, stripping a card's classes or
   deleting Webflow's CSS puts "Thank you! Your submission has been received!"
   on the login page. */
.w-form-done,
.w-form-fail {
  display: none;
}
