/* Presentation only: native inputs, validation, CSRF and provider links stay intact. */
:root { --sp-form-error: #b4233b; }
.dark { --sp-form-error: #ffacba; color-scheme: dark; }
@media (prefers-color-scheme: dark) {
    .auto { --sp-form-error: #ffacba; color-scheme: dark; }
}
.light { color-scheme: light; }
/* The public hero is deliberately light even when the member UI is dark.
   Scope its tokens locally; do not force the separate login modal to light. */
.body-landing-page .landing-page-signup-form {
    color-scheme: light;
    --sp-ui-surface: #fff;
    --sp-ui-soft: #f5f1ff;
    --sp-ui-border: #e3e5ee;
    --sp-ui-ink: #252b3b;
    --sp-ui-muted: #626d80;
    --sp-ui-brand: #6842d7;
    --sp-ui-brand-hover: #5030ad;
    --sp-form-error: #b4233b;
}
.body-landing-page .landing-page-signup-form .selectize-control.single .selectize-input,
.body-landing-page .landing-page-signup-form .selectize-control .selectize-input > input,
.body-landing-page .landing-page-signup-form .selectize-control .selectize-dropdown {
    /* The legacy dark bundle uses !important on Selectize widgets. */
    background: var(--sp-ui-surface) !important;
    color: var(--sp-ui-ink) !important;
}
.body-landing-page .landing-page-signup-form .selectize-input .item,
.body-landing-page .landing-page-signup-form .selectize-dropdown .option { color: var(--sp-ui-ink) !important; }
.body-landing-page .landing-page-signup-form .selectize-control.single .selectize-input::after { background-color: transparent !important; border-top-color: var(--sp-ui-muted); border-bottom-color: var(--sp-ui-muted); }
.body-landing-page .landing-page-signup-form .selectize-input.dropdown-active::before { background: var(--sp-ui-border) !important; }
.body-landing-page .landing-page-signup-form .selectize-input > input::placeholder { color: var(--sp-ui-muted); opacity: 1; }
.page form, .modal form, .page fieldset, .modal fieldset { min-width: 0; }
.page form .form-group, .modal form .form-group { margin-bottom: 1.25rem; }
.page form .form-label, .modal form .form-label {
    margin-bottom: .5rem;
    color: var(--sp-ui-ink);
    font-weight: 600;
    line-height: 1.5;
    overflow-wrap: anywhere;
}
.page form .form-control:not(.message-input), .modal form .form-control {
    min-height: 48px;
    padding: .7rem .85rem;
    font-size: 1rem;
}
.page form .form-control::placeholder, .modal form .form-control::placeholder { color: var(--sp-ui-muted); opacity: 1; }
.page form .form-control:disabled, .page form .form-control[readonly],
.modal form .form-control:disabled, .modal form .form-control[readonly] { background: var(--sp-ui-soft); color: var(--sp-ui-muted); opacity: 1; }
.page form textarea.form-control:not(.message-input) { min-height: 128px; resize: vertical; }
.page form .help-block, .page form .hint-block, .modal form .help-block, .modal form .hint-block {
    font-size: .875rem;
    line-height: 1.55;
    overflow-wrap: anywhere;
}
.page form .hint-block, .modal form .hint-block { color: var(--sp-ui-muted); }
.page form .has-error .help-block, .modal form .has-error .help-block,
.page form .invalid-feedback, .modal form .invalid-feedback { color: var(--sp-form-error); }
.page form .has-error .form-control, .modal form .has-error .form-control,
.page form .form-control[aria-invalid="true"], .modal form .form-control[aria-invalid="true"],
.page form .has-error .selectize-input { border-color: var(--sp-form-error); }
.page form .error-summary, .modal form .error-summary { line-height: 1.6; overflow-wrap: anywhere; }
.page form .error-summary ul, .modal form .error-summary ul { margin-bottom: 0; padding-left: 1.25rem; }
.page form .input-group > .form-control { flex: 1 1 10rem; width: 1%; }
.page form .input-group > .input-group-append, .page form .input-group > .input-group-prepend { min-width: 0; max-width: 100%; }
.page form .input-group-text { white-space: normal; overflow-wrap: anywhere; background: var(--sp-ui-soft); color: var(--sp-ui-ink); border-color: var(--sp-ui-border); }
.page form .selectize-input {
    min-height: 48px;
    padding: .7rem .85rem;
    background: var(--sp-ui-surface);
    color: var(--sp-ui-ink);
    font-size: 1rem;
    line-height: 1.5;
}
.page form .selectize-input > input { font-size: 1rem !important; color: var(--sp-ui-ink); }
.page form .selectize-input .item { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
.page form .selectize-dropdown { background: var(--sp-ui-surface); color: var(--sp-ui-ink); border-color: var(--sp-ui-border); border-radius: 10px; }
.page form .selectize-dropdown .option { min-height: 44px; padding: .7rem .85rem; overflow-wrap: anywhere; }
.page form .selectize-dropdown .active { background: var(--sp-ui-soft); color: var(--sp-ui-ink); }
.page form label.custom-control, .modal form label.custom-control { min-height: 44px; padding-top: .55rem; padding-bottom: .55rem; margin-bottom: .25rem; cursor: pointer; }
.page form .custom-control-label, .modal form .custom-control-label { line-height: 1.55; overflow-wrap: anywhere; }
.page form .custom-control-label::before, .page form .custom-control-label::after,
.modal form .custom-control-label::before, .modal form .custom-control-label::after { top: .22em; }
.page form .custom-control-input:focus-visible ~ .custom-control-label::before,
.modal form .custom-control-input:focus-visible ~ .custom-control-label::before { outline: 3px solid var(--sp-ui-brand); outline-offset: 3px; }
.page form .selectgroup-input:focus-visible + .selectgroup-button { outline: 3px solid var(--sp-ui-brand); outline-offset: 3px; }
.page .card-footer:has(form), .page form .card-footer { border-color: var(--sp-ui-border); background: var(--sp-ui-surface); border-radius: 0 0 16px 16px; flex-wrap: wrap; gap: .5rem; }
.page .card-body:has(> form)::after { content: ''; display: block; clear: both; }
.sp-auth-shell { width: 100%; max-width: 30rem; padding: clamp(.5rem, 3vh, 1.5rem) 0 1rem; }
.sp-auth-shell.sp-auth-shell-wide { max-width: 42rem; }
.sp-auth-brand { display: flex; justify-content: center; margin-bottom: 1.5rem; }
.sp-auth-brand > a { display: inline-flex; align-items: center; min-height: 48px; padding: .25rem; border-radius: 10px; }
.sp-auth-brand-img { display: block; width: auto; max-width: min(200px, 100%); height: 48px; filter: url(#sp-auth-white-matte); }
.page .sp-auth-shell .card { border-radius: 22px; }
.page .sp-auth-shell .card-body { padding: clamp(1.25rem, 4vw, 2rem); }
.page .sp-auth-shell h1.card-title { margin-bottom: .65rem; font-size: clamp(1.65rem, 4vw, 2rem); letter-spacing: -.025em; }
.sp-auth-intro { margin-bottom: 1.5rem; color: var(--sp-ui-muted); font-size: 1rem; line-height: 1.6; }
.sp-auth-shell .signup-social-providers { margin-bottom: 0 !important; }
.sp-auth-shell .social-auth .btn-provider { min-height: 48px; border-radius: 12px; }
.sp-auth-shell .social-auth .btn-provider > .fa, .sp-auth-shell .provider-mark-seznam { flex-shrink: 0; }
.sp-auth-divider { display: flex; align-items: center; gap: .75rem; margin: 1.5rem 0; color: var(--sp-ui-muted); text-align: center; font-size: .875rem; line-height: 1.5; }
.sp-auth-divider::before, .sp-auth-divider::after { content: ''; flex: 1 1 0; height: 1px; background: var(--sp-ui-border); }
.sp-auth-divider > span { flex: 0 1 auto; max-width: 80%; }
.sp-sex-field { padding: 0; margin: 0 0 1.25rem; border: 0; }
.sp-sex-field legend { float: none; width: auto; font-size: 1rem; }
.sp-sex-field .selectgroup { gap: .5rem; flex-wrap: wrap; }
.sp-sex-field .selectgroup-item { flex: 1 1 auto; margin: 0; }
.sp-sex-field .selectgroup-button { display: flex; align-items: center; justify-content: center; gap: .45rem; min-height: 48px; padding: .7rem; border-radius: 12px !important; color: var(--sp-ui-muted); border-color: var(--sp-ui-border); }
.sp-sex-field .selectgroup-input:checked + .selectgroup-button { background: var(--sp-ui-soft); color: var(--sp-ui-brand); border-color: var(--sp-ui-brand); }
.registration-consents { padding: 1rem !important; margin: .5rem 0 1.25rem; border: 1px solid var(--sp-ui-border); border-radius: 14px; background: var(--sp-ui-soft); }
.registration-consents .form-group:last-of-type { margin-bottom: .5rem; }
.registration-consents .terms { font-size: .875rem; line-height: 1.6; }
.page .registration-consents .btn-link { display: inline; min-height: 44px; padding: .4rem .15rem !important; font-size: inherit; color: var(--sp-ui-brand); text-decoration: underline; }
.sp-login-options { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .25rem .75rem; margin: -.25rem 0 1rem; }
.sp-login-options .form-group { margin: 0 !important; }
.sp-login-options > a { display: inline-flex; align-items: center; min-height: 44px; }
.sp-auth-shell .btn-block { min-height: 50px; }
.sp-auth-shell .quick-auth-providers { margin-bottom: 0; }
.sp-auth-switch { margin: 0 0 .5rem; line-height: 1.6; }
.sp-auth-switch a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; max-width: 100%; padding: .35rem .5rem; color: var(--sp-ui-brand); }
@media (max-width: 639.98px) {
    .sp-registration-fields > .row > .col-6 { flex: 0 0 100%; max-width: 100%; }
    .body-landing-page .landing-page-signup-form .step-2 > .row > .col-6 { flex: 0 0 100%; max-width: 100%; }
    .body-landing-page .landing-page-signup-form .step-1 .select-group > .row { display: grid; grid-template-columns: .8fr 1.2fr 1fr; gap: .5rem; margin: 0; }
    .body-landing-page .landing-page-signup-form .step-1 .select-group > .row > .col-4 { width: 100%; max-width: 100%; padding: 0; }
    .sp-auth-shell .social-auth .auth-clients.auth-clients-labeled { grid-template-columns: minmax(0, 1fr); }
    .page .sp-auth-shell .card { border-radius: 18px; }
    .registration-consents { padding: .85rem !important; }
    .page form .card-footer > .btn:only-child { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
    .page form *, .modal form * { scroll-behavior: auto !important; transition-duration: 0s !important; }
}
