/* ==========================================================
   404 Page
========================================================== */

    .auth-card {
        text-align: center;
    }

    .error-icon {

        width: 92px;
        height: 92px;

        margin: 0 auto 24px;

        border-radius: 50%;

        display: flex;
        align-items: center;
        justify-content: center;

        color: #B8860B;

        font-size: 34px;

        background: linear-gradient(135deg,
                rgba(255, 215, 0, .14),
                rgba(255, 169, 40, .18));

        box-shadow:
            0 15px 35px rgba(255, 215, 0, .18);
    }

    .error-code {

        display: inline-block;

        margin-bottom: 14px;

        padding: 6px 14px;

        border-radius: 100px;

        font-family: 'JetBrains Mono', monospace;

        font-size: .78rem;

        letter-spacing: .18em;

        text-transform: uppercase;

        color: #6b7280;

        background: #f3f4f6;

        border: 1px solid #e5e7eb;
    }

    .auth-title {

        margin-bottom: 14px;
    }

    .auth-sub {

        max-width: 420px;

        margin: 0 auto 36px;

        line-height: 1.75;
    }

    .error-actions {

        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    .error-actions .submit {

        text-decoration: none;
    }

    .back-btn {

        border: none;

        background: none;

        cursor: pointer;

        color: #1a0dab;

        font-weight: 600;

        font-size: .95rem;

        transition: .2s;
    }

    .back-btn:hover {

        color: #0f5bd7;
    }

    .error-help {

        margin-top: 34px;

        padding-top: 24px;

        border-top: 1px solid #ececec;

        font-size: .92rem;

        color: #6b7280;
    }

    .error-help a {

        color: #1a0dab;

        text-decoration: none;

        font-weight: 600;
    }

    .error-help a:hover {

        text-decoration: underline;
    }

    .error-help i {

        margin-right: 6px;

        color: #34A853;
    }

    @media (max-width:520px) {

        .error-icon {

            width: 72px;
            height: 72px;

            font-size: 28px;
        }

        .error-actions {

            gap: 12px;
        }
    }