.crm-auth-flow { --auth-slide: 22px; --auth-error-bg: #fff2f0; --auth-error-text: #a52a34; min-width: 0; }
.crm-auth-flow[dir="rtl"] { --auth-slide: -22px; }
.crm-auth-flow [hidden] { display: none !important; }
.crm-auth-viewport { display: grid; overflow: hidden; isolation: isolate; align-items: start; }
.crm-auth-pane { grid-area: 1 / 1; min-width: 0; width: 100%; }
.crm-auth-flow fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.crm-auth-flow h1 { font-size: 1.5rem; line-height: 1.5; margin: 0 0 .35rem; }
.crm-auth-flow .crm-auth-description { line-height: 1.7; margin: 0 0 1.25rem; }
.crm-auth-flow .form-label { display: block; margin-bottom: .5rem; }
.crm-auth-flow .form-control { min-height: 44px; max-width: 100%; }
.crm-auth-flow .btn { min-height: 44px; white-space: normal; }
.crm-auth-flow .crm-auth-code { font-variant-numeric: tabular-nums; letter-spacing: .2em; text-align: center; font-size: 1.25rem; }
.crm-auth-flow .crm-auth-error { background: var(--auth-error-bg); color: var(--auth-error-text); border: 1px solid currentColor; border-radius: .5rem; padding: .65rem .85rem; line-height: 1.7; margin-bottom: .8rem; overflow-wrap: anywhere; }
.crm-auth-method-switch, .crm-auth-back { display: block; width: fit-content; max-width: 100%; padding: .65rem .25rem; margin: .25rem auto 0; text-align: center; line-height: 1.7; text-decoration: underline; text-underline-offset: .2em; }
.crm-auth-flow a:focus-visible, .crm-auth-flow button:focus-visible, .crm-auth-flow input:focus-visible { outline: 3px solid #4361ee; outline-offset: 3px; }
.crm-auth-flow a[aria-disabled="true"] { pointer-events: none; opacity: .65; }
.crm-auth-flow .crm-auth-stage-label { color: #60708d; font-size: .78rem; font-weight: 700; margin-bottom: .35rem; }
.crm-auth-company { border: 1px solid #e0e6ed; border-radius: 10px; padding: .75rem; margin-bottom: .75rem; text-align: center; box-shadow: 0 0 2px rgb(145 158 171 / 20%), 0 12px 24px -4px rgb(145 158 171 / 12%); }
.crm-auth-company img { width: 58px; height: 58px; object-fit: contain; }
.crm-auth-company h6 { margin: .5rem 0 0; }
.crm-auth-guest .card { overflow: hidden; }
.crm-auth-guest .card-body { min-width: 0; }
.crm-auth-help { margin-top: .5rem; }
.crm-auth-flow .is-leaving { animation: crm-auth-leave 280ms ease both; pointer-events: none; }
.crm-auth-flow .is-entering { animation: crm-auth-enter 280ms ease both; }
@keyframes crm-auth-leave { from { opacity: 1; transform: translateX(0); } to { opacity: 0; transform: translateX(calc(-1 * var(--auth-slide))); } }
@keyframes crm-auth-enter { from { opacity: 0; transform: translateX(var(--auth-slide)); } to { opacity: 1; transform: translateX(0); } }
body.layout-dark .crm-auth-flow { --auth-error-bg: #3b222d; --auth-error-text: #ffb9c0; }
body.layout-dark .crm-auth-company { border-color: #3b4b64; }
body.layout-dark .crm-auth-flow .crm-auth-stage-label { color: #b4bfd3; }
.crm-auth-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
@media (max-width: 575.98px) { .crm-auth-guest .card-body { padding: 1.25rem; } .crm-auth-flow h1 { font-size: 1.3rem; } }
@media (prefers-reduced-motion: reduce) { .crm-auth-flow .is-leaving, .crm-auth-flow .is-entering { animation: none !important; transform: none !important; } }