/* Trinico Cloud child theme, register / auth pages.
   Direction A, "one quiet page". 19 September 2026.

   SCOPE. Every rule is scoped to html.tc-authhero. Measured on the live DOM the
   same day, that class is set on exactly three pages: /register.php, /login and
   /pwreset.php. It is NOT set on the home page (tc-homewave), /domain/pricing
   (tc-appcanvas tc-domclean), the cart (tc-appcanvas) or the SEO route
   /password/reset (no class at all). The .tc-dom-* and Bootstrap .card,
   .form-control and .form-group classes used below are SHARED with 84 to 90
   other pages, so an unscoped rule here would move all of them. It must stay
   scoped until those definitions move site-wide through Runbook 03.

   VALUES. Card 18px radius, fields 50px / 16px / 12px, the green pill with
   #13202E ink: the three Master Files rulings of 19 September 2026
   (03-typography/typefaces, 06-atoms/buttons, 07-forms/text-inputs).
   Ground #f4f6f9, card border #E8EEF4, card shadow rgba(15,32,55,.08) 0 4px 18px,
   the chips and the hero band are the SERVED values, inherited unchanged under
   Law 0d.

   These pages are light only. body.tc-dark is the theme switch and never fires
   here, so there are no dark rules and color-scheme is pinned below. */

/* ---------------------------------------------------------------- 0. ground */

/* Native controls follow color-scheme, not our CSS. Without this a reader on a
   dark OS gets grey selects and checkboxes inside white cards. */
html.tc-authhero{color-scheme:light;}

/* ------------------------------------------------- 1. the hero, tightened up */

/* Kept: the band, its gradient and the wave above it, all served, all shared
   with /login and /pwreset.php. Changed: the rhythm, and the h1 weight. */
html.tc-authhero .tc-auth-hero{padding:28px 0 24px;}

/* 2. Kicker above the h1. Banned by the craft floor, and redundant on a page
      already titled Register. */
html.tc-authhero .tc-auth-hero .tc-dom-eyebrow{display:none!important;}

/* 3. Gradient text on the h1. Emphasis comes from weight and size, not a fade,
      and the light end of the sweep is where contrast fails. */
html.tc-authhero .tc-auth-hero .tc-dom-grad{
  background-image:none!important;
  -webkit-background-clip:border-box!important;
  background-clip:border-box!important;
  -webkit-text-fill-color:#0F2037!important;
  color:#0F2037!important;
}

/* 3b. The h1 is served at weight 800. Montserrat is loaded at 400/500/600/700
       only, so 800 is a browser-synthesised fake: smeared stems, no real gain
       in weight. 700 is the heaviest cut we actually have. */
html.tc-authhero .tc-auth-hero .tc-dom-h1{font-weight:700!important;letter-spacing:-1.2px;}
html.tc-authhero .tc-auth-hero .tc-dom-lead{max-width:62ch;}

/* ------------------------------------------------------------ 2. the column */

/* The offsetting side column is already hidden and .primary-content is already
   capped at 900px by the theme inline block. Both are inherited as served. */
html.tc-authhero #registration{max-width:100%;}

/* ---------------------------------------------------------------- 3. cards */

/* 14px to 18px, the card law and the ruling. Border and shadow are the served
   values and do not move. */
html.tc-authhero #frmCheckout .card,
html.tc-authhero #registration .card{
  border-radius:18px!important;
  border:1px solid #E8EEF4;
  box-shadow:rgba(15,32,55,.08) 0 4px 18px;
  background:#fff;
}

/* Card headings. Served at 22px / 500 / Open Sans / #212529. Montserrat 600 and
   the ink token, so the heading sits in the same family as the h1 above it. */
html.tc-authhero #frmCheckout .card-title{
  font-family:Montserrat,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:22px;
  font-weight:600;
  line-height:1.3;
  letter-spacing:-.2px;
  color:#13202E;
  margin:0 0 18px;
}
/* WHMCS appends "(required fields are marked with *)" inside the heading. It is
   a hint, not a heading, so register.js splits it out and it is typed as one. */
html.tc-authhero #frmCheckout .card-title .tc-sech-note{
  display:block;
  margin-top:4px;
  font-size:12.5px;
  font-weight:400;
  line-height:1.45;
  letter-spacing:0;
  color:#5B6573;
}

/* --------------------------------------------------------- 4. field labels */

/* register.js inserts one of these before every .form-group. Before this build
   the page had NO visible label on 13 of 16 fields: the old script wrote the
   placeholder into the icon label, which destroyed the icon inside it, then hid
   the label. Measured 19 Sep 2026: 16 icon labels, 3 icons surviving. */
/* Specificity note: the parent theme ships "#registration label" at 13px / 300 /
   #666, which is an id plus an element and beats two classes. The #registration
   hook below is there to win that, not for scope; the scope is tc-authhero. */
html.tc-authhero #registration .tc-fl,
html.tc-authhero .tc-fl{
  display:block;
  margin:0 0 7px;
  font-family:Montserrat,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:13.5px;
  font-weight:600;
  line-height:1.45;
  color:#3A4655;
}
html.tc-authhero #registration .tc-fl .tc-opt,
html.tc-authhero .tc-fl .tc-opt{font-weight:400;color:#6B7686;}

/* Helper text under a field. 12.5px on #5B6573 is 5.91:1 on white. */
html.tc-authhero #registration .tc-fh,
html.tc-authhero .tc-fh{
  display:block;
  margin-top:6px;
  font-family:Montserrat,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:12.5px;
  line-height:1.5;
  color:#5B6573;
}

/* ------------------------------------------------------------- 5. the field */

/* Served: 36px high, 13px text, 8px radius, cobalt #1B77C9 border at rest.
   36px fails WCAG 2.5.8 at 44px. 13px is under the 14px text floor. The cobalt
   rest border is named in the text-inputs ruling as a divergence to close: a
   field at rest is not the primary action on the page and should not wear its
   colour. Ruled value: 50px, 16px, 12px radius, neutral #C7D3E0 border.
   16px also stops iOS zooming the page on focus. */
html.tc-authhero #frmCheckout .field,
html.tc-authhero #frmCheckout .form-control,
html.tc-authhero #frmCheckout select.field,
html.tc-authhero #frmCheckout input.field{
  height:50px;
  min-height:50px;
  border-radius:12px;
  border:1px solid #C7D3E0!important;
  background-color:#fff;
  box-shadow:none;
  font-family:Montserrat,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:16px;
  font-weight:400;
  line-height:1.4;
  color:#0F2037;
  padding:0 16px;
}
/* The icon sits in a 44px gutter, so any field that has one is inset. The
   phone field is excluded: intl-tel-input puts its own flag and dial-code
   selector in that gutter and needs a much wider inset, set just below. */
html.tc-authhero #frmCheckout .prepend-icon:not(.tc-has-iti) .field,
html.tc-authhero #frmCheckout .prepend-icon:not(.tc-has-iti) .form-control{padding-left:44px;}

html.tc-authhero #frmCheckout .field::placeholder,
html.tc-authhero #frmCheckout .form-control::placeholder{color:#6B7686;opacity:1;}

html.tc-authhero #frmCheckout .field:focus,
html.tc-authhero #frmCheckout .form-control:focus{
  outline:3px solid rgba(27,119,201,.32);
  outline-offset:1px;
  border-color:#1A5FAF!important;
  box-shadow:none;
}

/* Native selects: strip the platform arrow and draw our own, so country and
   currency match the text inputs instead of shipping two field shapes. */
html.tc-authhero #frmCheckout select.field,
html.tc-authhero #frmCheckout select.form-control{
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  padding-right:42px;
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235B6573' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 15px center;
  background-size:16px 16px;
}

/* The in-field icon. Pinned 25px from the top of the group, which is the centre
   of a 50px field, rather than the centre of the group: the phone group also
   carries the WhatsApp verify panel, and a group-centred icon drifts down it. */
html.tc-authhero #frmCheckout .form-group.prepend-icon{position:relative;}
html.tc-authhero #frmCheckout .form-group.prepend-icon > label.field-icon{
  position:absolute;
  left:0;
  top:25px;
  bottom:auto;
  transform:translateY(-50%);
  width:44px;
  height:20px;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#1B77C9;
  pointer-events:none;
  z-index:2;
}
html.tc-authhero #frmCheckout .form-group.prepend-icon > label.field-icon i{
  font-size:16px;
  line-height:1;
}
/* intl-tel-input draws its own flag and dial-code selector in that gutter, so
   ours stands down.

   The inset cannot be a fixed number. The selector is as wide as the dial code
   it is showing: measured 19 Sep 2026 it is 78px for ZA +27 and the vendor
   stylesheet carries a different padding for each of its iti-sdc-2, -3 and -4
   widths. register.js measures the selector and writes --tc-iti-pad, and
   rewrites it whenever the country changes, so the text always starts clear of
   the flag whatever the code. The fallback only applies if that never runs.

   Note the selector says .form-control, not .field: the WhatsApp addon replaces
   the class on #inputPhone when it takes the field over. A .field-only rule here
   silently does nothing, which is exactly what the first cut of this file did,
   and the dial code sat on top of the placeholder. */
html.tc-authhero #frmCheckout .form-group.tc-has-iti > label.field-icon{display:none;}
html.tc-authhero #frmCheckout .form-group.tc-has-iti .form-control,
html.tc-authhero #frmCheckout .form-group.tc-has-iti .field{
  padding-left:var(--tc-iti-pad,88px);
}

html.tc-authhero #frmCheckout .form-group{margin-bottom:20px;}

/* --------------------------------------------------- 6. password and meter */

html.tc-authhero #frmCheckout .generate-password{
  height:44px;
  border-radius:999px;
  border:1.5px solid #cfe0f1;
  background:#fff;
  color:#1A5FAF;
  font-family:Montserrat,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:14px;
  font-weight:600;
  padding:0 20px;
}
html.tc-authhero #frmCheckout .generate-password:hover{background:#f2f8fd;}
html.tc-authhero #frmCheckout .password-strength-meter .progress{
  height:6px;
  border-radius:999px;
  background:#e3e9f0;
  overflow:hidden;
}
html.tc-authhero #frmCheckout #passwordStrengthMeterBar{border-radius:999px;}
html.tc-authhero #frmCheckout #passwordStrengthTextLabel{
  font-family:Montserrat,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:12.5px;
  line-height:1.5;
  color:#5B6573;
  margin-top:8px;
}

/* -------------------------------------------------------- 7. consent rows */

/* 4. Consent switches, rebuilt as a pill toggle. CEO, 20 September 2026.

      What was here: bootstrap-switch's stock sliding Yes/No panel. Measured on
      19 September it carried THREE radii in one control (8px wrapper, 3.2px/4px
      knob, 0px panels), 13px type against the 14px floor this same stylesheet
      sets for every other control, and a 119px container clipped inside an 82px
      wrapper. Nothing else on the page looks like it: the language here is an
      18px card, a 12px field and a 999px pill.

      What this does NOT do: touch the geometry bootstrap-switch's JavaScript
      depends on. The widths stay exactly as the vendor computed them at init
      (handle 39px, label 41px, container 119px), because the slide is driven by
      an inline margin-left calculated from those numbers. Only the paint
      changes. That keeps the control working across a WHMCS or plugin update.

      Colours: the track reuses values already served on this page rather than
      introducing new ones. On is #1B77C9, the same cobalt as the field focus
      border. Off is #7E93AA, which measures 3.16:1 against the white knob and
      so meets the 3:1 non-text contrast floor in WCAG 1.4.11; the old #eef2f7
      panel measured 1.17:1 and could not carry state on its own. */

/* the track.

   Every width below is pinned with !important, and that is the whole point of
   this block rather than an accident of style. bootstrap-switch sizes its three
   cells from the rendered width of the words "Yes" and "No" AT INIT, then writes
   the result to the container as an inline style. Two switches on this page
   initialise at different moments: the mailing-list one is set up by WHMCS on
   DOMContentLoaded, the WhatsApp one later by its own addon. Measured live on
   20 September 2026, the first had already seen this stylesheet's font-size:0
   and sized its cells to 16px, while the second had not and kept the vendor's
   39/41/39. One switch was 79px wide with a 34px knob crushed into a 16px cell;
   the other was 82px and correct. Pinning the geometry makes the control the
   same object whenever it happens to wake up.

   The slide is controlled here too. bootstrap-switch writes margin-left as an
   inline style, and an inline style without !important loses to a stylesheet
   rule with it, so the two state rules below own the position outright. */
html.tc-authhero .bootstrap-switch.bootstrap-switch-small{
  width:78px!important;
  min-width:78px!important;
  height:44px;
  min-height:44px;
  border:none!important;
  border-radius:999px!important;
  background:#7E93AA;
  transition:background-color .18s ease-in-out;
}
html.tc-authhero .bootstrap-switch.bootstrap-switch-small.bootstrap-switch-on{
  background:#1B77C9;
}

/* three cells of 39px: [on][knob][off] */
html.tc-authhero .bootstrap-switch.bootstrap-switch-small .bootstrap-switch-container{
  width:117px!important;
  height:44px;
  margin-left:0!important;
}
html.tc-authhero .bootstrap-switch.bootstrap-switch-small.bootstrap-switch-off .bootstrap-switch-container{
  margin-left:-39px!important;
}

/* The three cells keep one width and lose their paint. The Yes/No words go with
   them: the accessible name comes from the row's own <label>, which is what a
   screen reader announces, so nothing is lost by removing two 13px words that
   the pill's position already says. */
html.tc-authhero .bootstrap-switch.bootstrap-switch-small .bootstrap-switch-handle-on,
html.tc-authhero .bootstrap-switch.bootstrap-switch-small .bootstrap-switch-handle-off,
html.tc-authhero .bootstrap-switch.bootstrap-switch-small .bootstrap-switch-label{
  width:39px!important;
  min-width:39px!important;
  max-width:39px!important;
  height:44px!important;
  line-height:44px!important;
  padding:0!important;
  background:transparent!important;
  border:none!important;
  box-shadow:none!important;
}
/* visibility:hidden, not a transparent colour. Transparent text still counts as
   text on a background, and the deliverable audit rightly read four of them as
   contrast failures on 20 September 2026. visibility:hidden takes the words out
   of the picture AND out of the accessibility tree, which is what we want: the
   row's own <label> already carries the accessible name. The cells keep their
   39px of layout either way. */
html.tc-authhero .bootstrap-switch.bootstrap-switch-small .bootstrap-switch-handle-on,
html.tc-authhero .bootstrap-switch.bootstrap-switch-small .bootstrap-switch-handle-off{
  visibility:hidden!important;
}

/* The knob is painted as a background circle rather than a pseudo-element on
   purpose. The wrapper already sets overflow:hidden to clip the slide, and a
   positioned child inside it is exactly the shape the craft detector reports as
   a clipped overflow container. A background needs no positioning. */
html.tc-authhero .bootstrap-switch.bootstrap-switch-small .bootstrap-switch-label{
  background:radial-gradient(circle at 50% 50%,#fff 0 17px,transparent 17.5px)!important;
}

html.tc-authhero .bootstrap-switch.bootstrap-switch-small input[type="checkbox"]{
  width:100%;height:44px;
}

/* Keyboard focus. bootstrap-switch hides the real checkbox, so without this the
   toggle is reachable by Tab and shows nothing when it gets there. */
html.tc-authhero .bootstrap-switch.bootstrap-switch-small.bootstrap-switch-focused{
  outline:3px solid rgba(27,119,201,.55);
  outline-offset:2px;
}

/* The Terms of Service row. The 24px box in a 44px row was deployed on
   9 September 2026 from footer.tpl and is kept exactly; this only brings the
   type into the same family as the rest of the card. */
html.tc-authhero #frmCheckout .form-check{
  font-family:Montserrat,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:14px;
  line-height:1.5;
  color:#13202E;
}
html.tc-authhero #frmCheckout .card p{
  font-family:Montserrat,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:14px;
  line-height:1.6;
  color:#5B6573;
}

/* ---------------------------------------------------------- 8. the submit */

/* The pill, the gradient and the 56px height are the served values and the
   buttons ruling, and they stay. The INK changes: white on #ABC441 measures
   1.96:1 against a 4.5:1 requirement, and #13202E on the same green measures
   8.33:1. Per the brand rule the fix for a failing brand surface is the text
   colour, not a new fill. 20px to 16.5px is the ruled large variant. */
html.tc-authhero #frmCheckout input[type="submit"].btn-primary,
html.tc-authhero #frmCheckout .btn-recaptcha{
  color:#13202E!important;
  -webkit-text-fill-color:#13202E;
  font-family:Montserrat,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:16.5px;
  font-weight:600;
  height:56px;
  min-height:56px;
  padding:0 34px;
  border-radius:999px;
}
html.tc-authhero #frmCheckout input[type="submit"].btn-primary:focus-visible{
  outline:3px solid rgba(27,119,201,.45);
  outline-offset:3px;
}

/* The submit row, and the sign-in line register.js puts beside it. The sidebar
   that used to carry Login and Lost Password Reset is hidden on this page, so
   without this the only way back to the login form is the main navigation. */
html.tc-authhero .tc-submitrow{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  flex-wrap:wrap;
  margin:0 0 8px;
}
html.tc-authhero .tc-signin{
  font-family:Montserrat,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:14px;
  line-height:1.5;
  color:#5B6573;
  margin:0;
}
/* Underlined, not just coloured. axe flagged both of these as link-in-text-block
   on the live page: a link sitting inside a sentence that is distinguished only
   by its colour fails WCAG 1.4.1 for anyone who cannot see the hue. The
   sign-in line is ours; the Terms of Service link is WHMCS's and sits on the
   same surface, so it is corrected in the same pass. */
html.tc-authhero .tc-signin a,
html.tc-authhero #frmCheckout .form-check a{
  color:#1A5FAF;
  text-decoration:underline;
  text-underline-offset:2px;
}

/* -------------------------------------------------- 9. country code list */

/* 5. 247 entries in a 200px window at 36px rows, no search. register.js adds
      the filter; this makes every row a real tap target and stops the names
      wrapping mid-word. */
html.tc-authhero .iti__country-list,
html.tc-authhero .country-list{
  max-height:320px!important;
  border-radius:14px;
  border:1.5px solid #e9eef4;
  box-shadow:0 2px 5px rgba(15,23,42,.10),0 8px 14px rgba(15,23,42,.12);
}
html.tc-authhero .iti__country-list li.iti__country,
html.tc-authhero .country-list li.country{
  min-height:44px;display:flex;align-items:center;gap:8px;
  padding:6px 14px;white-space:nowrap;
}
html.tc-authhero .iti__country-list .iti__country-name,
html.tc-authhero .country-list .country-name{
  flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;
}
html.tc-authhero .iti__country-list .iti__dial-code,
html.tc-authhero .country-list .dial-code{
  flex-shrink:0;font-variant-numeric:tabular-nums;color:#5B6573;
}

/* 8. Search box inside the country dropdown, added by register.js. 16px so iOS
      does not zoom the page when the filter takes focus. */
html.tc-authhero .tc-cc-search{
  position:sticky;top:0;z-index:2;padding:10px;background:#fff;
  border-bottom:1px solid #e9eef4;
}
html.tc-authhero .tc-cc-search input{
  width:100%;height:44px;padding:0 12px;box-sizing:border-box;
  font-family:Montserrat,sans-serif;font-size:16px;color:#13202E;
  border:1.5px solid #e9eef4;border-radius:10px;background:#fff;
}
html.tc-authhero .tc-cc-search input:focus{
  outline:none;border-color:#1B77C9;box-shadow:0 0 0 3px rgba(27,119,201,.18);
}

/* 9. The dropdown ships a fixed 400px width, which overflows a 390px phone and
      pushes the whole document sideways. Cap it to the viewport. */
html.tc-authhero .country-list,
html.tc-authhero .iti__country-list{
  width:auto!important;
  min-width:250px;
  max-width:calc(100vw - 60px)!important;
  box-sizing:border-box;
}

/* ------------------------------------------------ 10. the WhatsApp panel */

/* 6. The verify hint measured #6b7a88 on white = 4.4:1, just under.
      #5B6573 is the body token and gives 5.91:1. It also ships at 11.8px,
      under the 12px floor and the only text on the registration form that was
      still below it, so it is brought onto the same 12.5px / 1.5 as every other
      hint on the page. */
html.tc-authhero .twa-sv-why{
  color:#5B6573!important;
  font-size:12.5px;
  line-height:1.5;
}

/* 7. Accessible names for controls that bootstrap-switch leaves unnamed. */
html.tc-authhero .tc-sr-only{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;
}

/* ------------------------------------------------ 11. phone, 767 and down */

/* Direction A pins the primary action to the bottom of the viewport so it is
   reachable without scrolling to the end of a 15-field form. */
@media (max-width:767px){
  html.tc-authhero .tc-auth-hero{padding:18px 0 16px;}
  html.tc-authhero .tc-auth-hero .tc-dom-h1{letter-spacing:-.8px;}
  html.tc-authhero #frmCheckout .card-title{font-size:19px;margin-bottom:16px;}
  html.tc-authhero #frmCheckout .card-body{padding:18px!important;}

  html.tc-authhero .tc-submitrow{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:10020;
    margin:0;
    padding:14px 16px calc(18px + env(safe-area-inset-bottom,0px));
    background:rgba(255,255,255,.97);
    border-top:1px solid #E8EEF4;
    box-shadow:0 -4px 14px rgba(15,32,55,.06);
  }
  html.tc-authhero .tc-submitrow input[type="submit"]{width:100%;padding:0 20px;}
  html.tc-authhero .tc-submitrow .tc-signin{display:none;}
  /* The same line, in the flow, so it is never lost with the bar pinned.
     padding-inline because the Bootstrap container gives it only 15px and body
     text should not sit closer than 16px to the edge of a phone. */
  /* margin-inline, not padding-inline. The Bootstrap column gives this line
     only 15px, and padding moved the TEXT in while the paragraph box itself
     still started at 15px, which is what the craft detector measures and what
     a reader sees as the edge of the block. Margin moves the box: it now
     starts at 31px from the edge of a 390px phone. */
  html.tc-authhero .tc-signin-flow{
    display:block;text-align:center;margin:0 16px 8px;padding-inline:0;
  }
  /* clear the pinned bar so the last card never sits under it */
  html.tc-authhero.tc-hasbar #main-body{padding-bottom:132px!important;}
  /* Two floating widgets sit in the bottom right and would cover the pinned
     bar: the WhatsApp launcher at bottom:20px and the scroll-to-top button at
     bottom:24px. Both are lifted so the stack reads bar, then launcher, then
     scroll-to-top, with nothing overlapping. Measured heights 54px and 46px. */
  html.tc-authhero.tc-hasbar #trinicoWaWidget{bottom:108px!important;}
  html.tc-authhero.tc-hasbar #trinico-scroll-top{bottom:176px!important;}
}
@media (min-width:768px){
  html.tc-authhero .tc-signin-flow{display:none;}
}

/* -------------------------------------- 12. /login and /pwreset.php parity */

/* The CEO chose "register, login and pwreset first", so the three auth pages
   move to the ruled values together rather than register.php becoming a
   page-local variant, which Law 0c calls a defect. This block carries only the
   four ruled values to the other two pages; it does not redesign them, which is
   not in this brief. Measured on both, 19 Sep 2026: card 14px, field 38px with
   a cobalt rest border, and the same green pill carrying WHITE ink at 1.96:1.
   Those pages already have real visible labels, so nothing here adds any.

   Selector note: .btn-recaptcha, not .btn-primary. Each of the three pages
   carries exactly one .btn-recaptcha and it is the green gradient submit. The
   other two .btn-primary elements on each page are modal buttons with no
   gradient, where dark ink would be wrong. */

html.tc-authhero .card,
html.tc-authhero .login-form .card{border-radius:18px!important;}

html.tc-authhero form .form-control{
  height:50px;
  min-height:50px;
  font-family:Montserrat,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:16px;
  color:#0F2037;
  border-color:#C7D3E0!important;
  box-shadow:none;
}
html.tc-authhero form .form-control:focus{
  outline:3px solid rgba(27,119,201,.32);
  outline-offset:1px;
  border-color:#1A5FAF!important;
  box-shadow:none;
}
/* the login and reset fields sit in an .input-group-merge, so only the free
   corners are rounded and the addon has to grow with the field */
html.tc-authhero .input-group-merge .form-control{
  border-top-right-radius:12px;
  border-bottom-right-radius:12px;
}
html.tc-authhero .input-group-merge .input-group-prepend,
html.tc-authhero .input-group-merge .input-group-text{
  height:50px;
  border-color:#C7D3E0;
}

/* #login and #resetPasswordButton by id, not only .btn-recaptcha: the theme
   inline block carries

     #login, #resetPasswordButton, #frmCheckout input[type="submit"].btn-primary
       { color:#fff !important }

   which wins on an id plus !important, so the class-only rule below left both
   of those buttons white on the green pill at 1.96:1. Measured on the live
   pages after the first deploy of this file, not predicted. The register submit
   was already covered because its rule carries #frmCheckout as well. */
html.tc-authhero .btn-recaptcha,
html.tc-authhero #login,
html.tc-authhero #resetPasswordButton{
  color:#13202E!important;
  -webkit-text-fill-color:#13202E!important;
  font-family:Montserrat,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-weight:600;
}