﻿html,
body {
    min-height: 100%;
    margin: 0;
    font-family: "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #25373b;
    background: #eef3f2;
}

.cdoc-auth-stage {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 2rem;
}

.cdoc-auth-frame {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(24rem, 0.95fr);
    width: min(70rem, 100%);
    border: 1px solid rgba(174, 191, 186, 0.58);
    border-radius: 8px;
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0 12px 34px rgba(37, 55, 59, 0.12);
}

.cdoc-auth-brand-panel {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 34rem;
    padding: 2.25rem;
    color: #fffdf8;
    background: #233037;
}

.cdoc-auth-brand-mark {
    width: 4.5rem;
    height: 4.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.4rem;
    border-radius: 8px;
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.22);
}

.cdoc-auth-brand-mark img {
    width: 100%;
    height: 100%;
    display: block;
}

.cdoc-auth-kicker,
.cdoc-auth-page-kicker {
    margin: 0 0 0.55rem;
    font-size: 0.75rem;
    font-weight: 900;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.cdoc-auth-kicker {
    color: rgba(255, 253, 248, 0.74);
}

.cdoc-auth-brand-panel h1 {
    margin: 0;
    max-width: 34rem;
    font-size: 2.4rem;
    line-height: 1.05;
}

.cdoc-auth-copy {
    max-width: 36rem;
    margin: 1rem 0 0;
    color: rgba(255, 253, 248, 0.78);
    line-height: 1.62;
}

.cdoc-auth-footnote {
    margin-top: 2rem;
    color: rgba(255, 253, 248, 0.72);
    font-weight: 700;
}

.cdoc-auth-card {
    display: flex;
    align-items: center;
    padding: 2.25rem;
}

.cdoc-auth-content {
    width: 100%;
}

.cdoc-auth-page-kicker {
    color: #0e5855;
}

.cdoc-auth-content h2 {
    margin: 0;
    font-size: 1.65rem;
}

.cdoc-auth-page-copy {
    margin: 0.65rem 0 1.35rem;
    color: #607276;
    line-height: 1.55;
}

.cdoc-auth-form {
    display: grid;
    gap: 1rem;
}

.cdoc-auth-field {
    display: grid;
    gap: 0.35rem;
}

.cdoc-auth-field label,
.cdoc-auth-check label {
    color: #607276;
    font-weight: 800;
}

.cdoc-auth-field input {
    min-height: 2.75rem;
    padding: 0.55rem 0.75rem;
    border: 1px solid #aebfba;
    border-radius: 6px;
    color: #25373b;
    background: #ffffff;
}

.cdoc-auth-password-wrap {
    display: flex;
}

.cdoc-auth-password-wrap input {
    flex: 1;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.cdoc-auth-password-wrap button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 3rem;
    border: 1px solid #aebfba;
    border-left: 0;
    border-radius: 0 6px 6px 0;
    color: #0e5855;
    background: #f4f7f7;
    cursor: pointer;
}

.cdoc-auth-password-wrap button:focus-visible {
    outline: 2px solid #0e5855;
    outline-offset: -2px;
}

.cdoc-auth-password-toggle .cdoc-eye-closed,
.cdoc-auth-password-toggle[aria-pressed="true"] .cdoc-eye-open {
    display: none;
}

.cdoc-auth-password-toggle[aria-pressed="true"] .cdoc-eye-closed {
    display: inline;
}

.cdoc-auth-check {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.cdoc-auth-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.cdoc-auth-submit,
.cdoc-auth-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.75rem;
    padding: 0.65rem 1.05rem;
    border-radius: 6px;
    font-weight: 800;
    text-decoration: none;
}

.cdoc-auth-submit {
    border: 1px solid #0e5855;
    color: #fffdf8;
    background: #0e5855;
}

.cdoc-auth-secondary {
    border: 1px solid rgba(23, 126, 121, 0.24);
    color: #0e5855;
    background: #ffffff;
}

.cdoc-auth-validation,
.cdoc-auth-field-error {
    color: #b32121;
    font-weight: 700;
}

@media (max-width: 820px) {
    .cdoc-auth-stage {
        padding: 1rem;
    }

    .cdoc-auth-frame {
        grid-template-columns: 1fr;
    }

    .cdoc-auth-brand-panel {
        min-height: auto;
    }
}

