/* Sign in / sign up: clone tokens (flip with html[data-theme=dark]); legacy --color-* do not. */
.c-auth { background: var(--background); color: var(--text-primary); }
.c-auth__panel { padding-top: calc(var(--space-10, 40px) + 76px); }
.c-auth__title, .c-auth__heading, .c-auth__brand { color: var(--text-primary); }
.c-auth__section, .c-auth__tabs { background: var(--background-secondary); border-color: var(--border-light); }
.c-auth__tab { color: var(--text-secondary); }
.c-auth__tab[aria-selected="true"] { color: #fff; background: var(--primary); }
.c-auth label, .c-auth p, .c-auth li { color: var(--text-secondary); }
.c-auth__links a, .c-auth__home a, .c-auth a:not(.c-btn):not(.btn) { color: var(--primary); }
.c-auth input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]), .c-auth select, .c-auth textarea { color: var(--text-primary); background: var(--background); border-color: var(--border-medium); }

/* CLS: non-active panels start hidden (markup), tabs keep their height before JS shows them, icon font glyphs have a box. */
.c-auth__section[hidden] { display: none; }
.c-auth__tabs[hidden] { display: flex; visibility: hidden; }
.c-auth [class*="la-"] { display: inline-block; min-width: 1em; min-height: 1em; }
/* 24px targets */
.c-auth__links a, .c-auth__home a { display: inline-flex; align-items: center; min-height: 24px; }
.c-auth input[type="checkbox"], .c-auth input[type="radio"] { min-width: 24px; min-height: 24px; margin: 0; } /* UA margin put the box 4px right of the fields */

/* Scrim so the intro text and the header over the photo keep >= 4.5:1. */
.c-auth__aside { position: relative; isolation: isolate; }
.c-auth__aside::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgb(10 7 26 / .78), rgb(10 7 26 / .6) 40%, rgb(10 7 26 / .75)); }
.c-auth__intro { color: #fff; }

/* Round 4: button labels, hero text in both themes, header over the photo. */
.c-auth .c-auth__aside .c-auth__intro { color: #fff; text-shadow: 0 1px 3px rgb(0 0 0 / .6); }
.c-auth__aside::before { background: linear-gradient(180deg, rgb(10 7 26 / .82), rgb(10 7 26 / .7) 45%, rgb(10 7 26 / .82)); }
.c-auth :is(input[type="submit"], button[type="submit"], .btn, .button, .btn-main, .btn-primary) { color: #fff; -webkit-text-fill-color: #fff; background-color: #303af7; border-color: #303af7; }
[data-theme="dark"] .c-auth :is(input[type="submit"], button[type="submit"], .btn, .button, .btn-main, .btn-primary),
[data-theme="dark"] .c-auth__tab[aria-selected="true"] { color: #0a071a; -webkit-text-fill-color: #0a071a; background-color: #7091ff; border-color: #7091ff; }
.c-auth :is(input[type="submit"], button[type="submit"]):hover { filter: brightness(1.08); }
/* Solid pill over the photo so the nav stays legible in both themes. */
body.page-template-login-register .c-header__pill { background: var(--background-secondary); backdrop-filter: none; }
h2.c-auth__intro { font-weight: var(--fw-semibold, 600); letter-spacing: normal; }
/* Role titles were h6 (heading-order); now h4 after h3, same look. */
.c-auth .user-role h4 { margin: 0; font-size: 16px; line-height: 26px; font-weight: 600; letter-spacing: normal; text-transform: none; color: var(--text-primary); }

/* QA r8 (also loaded on the Elementor /sign-up/ page): terms checkbox follows the theme (native white square in dark mode); label sits beside it. */
.gdpr-wrapper input[type="checkbox"] { accent-color: var(--primary); }
.c-auth input[type="checkbox"] { accent-color: var(--primary); }
[data-theme="dark"] :is(.gdpr-wrapper, .c-auth) input[type="checkbox"] { color-scheme: dark; } /* r26: "Keep me signed in" was a white native box */
.gdpr-wrapper .checkbox { display: flex; align-items: flex-start; gap: 8px; }
.gdpr-wrapper .checkbox input[type="checkbox"] { flex: none; margin: 0; }
/* reCAPTCHA is a fixed 304px iframe: scale so it fits the form box (box = viewport - 142px at <=445px, dark card padding included). */
@media (max-width: 445px) { body .g-recaptcha { --rc: .9; } }
@media (max-width: 415px) { body .g-recaptcha { --rc: .84; } }
@media (max-width: 397px) { body .g-recaptcha { --rc: .76; } }
@media (max-width: 372px) { body .g-recaptcha { --rc: .7; } }
@media (max-width: 354px) { body .g-recaptcha { --rc: .64; } }
@media (max-width: 336px) { body .g-recaptcha { --rc: .58; } }

/* Conversion: two short benefits above the sign-up form (live claims only). */
.c-auth__perks { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 6px; }
.c-auth__perks li { position: relative; padding-left: 26px; font-size: 15px; line-height: 22px; }
.c-auth__perks li::before { content: ""; position: absolute; left: 2px; top: 5px; width: 12px; height: 7px; border-left: 2px solid var(--primary); border-bottom: 2px solid var(--primary); transform: rotate(-45deg); }

/* Links inside form labels (e.g. Privacy Policy on /sign-in/ Create account) are underlined: WCAG link-in-text-block. */
.c-auth label a, label[for="check-privacy"] a, .site-main form label a { text-decoration: underline; text-underline-offset: 2px; }
/* Round 26: form rows had no spacing (no theme rule for .form-group): 6px label -> input, 16px between rows. */
:is(.c-auth, .elementor-widget-login_register) .form-group { margin: 0 0 16px; }
:is(.c-auth, .elementor-widget-login_register) .form-group > label { display: block; margin-bottom: 6px; }
/* Show-password eye sits inside the field (it dropped onto its own line and added 26px under the password row). */
:is(.c-auth, .elementor-widget-login_register) .cariera-password { position: relative; }
/* Its Line Awesome glyph (la-eye) has no font/mask, so it painted nothing: 32px hit box (unmasked <i>) with a Lucide eye on ::before; .active (plugin toggle = text shown) = eye-off. */
:is(.c-auth, .elementor-widget-login_register) .cariera-password > i { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); cursor: pointer; display: grid; place-items: center; width: 32px; height: 32px; color: var(--text-secondary); background: none; -webkit-mask: none; mask: none; }
:is(.c-auth, .elementor-widget-login_register) .cariera-password > i:hover { color: var(--text-primary); }
:is(.c-auth, .elementor-widget-login_register) .cariera-password > i::before { content: ""; width: 20px; height: 20px; background-color: currentColor; -webkit-mask: var(--eye) center / contain no-repeat; mask: var(--eye) center / contain no-repeat; --eye: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.1 12.3a1 1 0 0 1 0-.6 10.8 10.8 0 0 1 19.8 0 1 1 0 0 1 0 .6 10.8 10.8 0 0 1-19.8 0'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); }
:is(.c-auth, .elementor-widget-login_register) .cariera-password > i.active::before { --eye: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.7 5.1A10.7 10.7 0 0 1 21.9 11.7a1 1 0 0 1 0 .6 10.8 10.8 0 0 1-1.4 2.4M14.1 14.2a3 3 0 0 1-4.2-4.2M17.5 17.5a10.8 10.8 0 0 1-15.4-5.2 1 1 0 0 1 0-.6 10.8 10.8 0 0 1 4.4-5.2M2 2l20 20'/%3E%3C/svg%3E"); }
:is(.c-auth, .elementor-widget-login_register) .cariera-password > input { padding-right: 44px; } /* typed text stops before the eye */
/* Keep me signed in: box and label on one centred row, 8px apart like the privacy checkbox. */
.c-auth .form-group:not(.gdpr-wrapper) > .checkbox { display: flex; align-items: center; gap: 8px; }
.c-auth .form-group:not(.gdpr-wrapper) > .checkbox > label { margin: 0; }