* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
    font-family:
        Arial,
        Tahoma,
        sans-serif;
}

body {
    background: #f5f7fb;
    color: #18212f;
}

.auth-page {
    min-height: 100vh;

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

    padding: 25px;

    background:
        radial-gradient(
            circle at top right,
            #dbeafe 0,
            transparent 35%
        ),
        radial-gradient(
            circle at bottom left,
            #ede9fe 0,
            transparent 35%
        ),
        #f8fafc;
}

.auth-card {
    width: 100%;
    max-width: 430px;

    padding: 38px;

    background: rgba(
        255,
        255,
        255,
        .96
    );

    border-radius: 24px;

    box-shadow:
        0 25px 60px
        rgba(15, 23, 42, .12);
}

.auth-logo {
    width: 70px;
    height: 70px;

    margin: 0 auto 18px;

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

    border-radius: 20px;

    background: #2563eb;
    color: #fff;

    font-size: 30px;
}

.auth-card h1 {
    margin: 0;

    text-align: center;

    font-size: 27px;

    font-weight: 800;
}

.auth-subtitle {
    margin:
        10px 0 28px;

    text-align: center;

    color: #64748b;
}

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;

    margin-bottom: 8px;

    font-weight: 700;
}

.form-group input {
    width: 100%;
    height: 52px;

    padding: 0 15px;

    border:
        1px solid #dbe2ea;

    border-radius: 12px;

    outline: none;

    background: #fff;

    transition: .2s;
}

.form-group input:focus {
    border-color: #2563eb;

    box-shadow:
        0 0 0 4px
        rgba(37, 99, 235, .10);
}

.btn {
    border: 0;

    border-radius: 12px;

    padding:
        0 22px;

    min-height: 50px;

    cursor: pointer;

    font-size: 16px;

    font-weight: 700;
}

.btn-primary {
    background: #2563eb;
    color: #fff;
}

.btn-primary:hover {
    background: #1d4ed8;
}

.btn-block {
    width: 100%;
}

.alert {
    padding: 13px 15px;

    margin-bottom: 20px;

    border-radius: 12px;
}

.alert-danger {
    background: #fee2e2;
    color: #991b1b;
}

.alert-success {
    background: #dcfce7;
    color: #166534;
}