@use "../../theme/breakpoints" as *;

#register, #login-confirm, #login, #interests {
    .content {
        max-width: 692px;
        border-radius: 1rem;
        background: linear-gradient(269deg, rgba(108, 109, 113, 0.74) 0%, rgba(60, 61, 66, 0.796) 39%, rgb(29, 30, 36) 100%) transparent;
        padding: 1rem;
        margin: 1rem;
        text-align: center;
        color: white;

        @media (min-width: $breakpoints-md) {
            padding: 2rem;
            margin: unset;
        }

        .form-container {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 1rem;

            @media (max-width: $breakpoints-sm) {
                gap: 0.3rem;
            }

            .input-control {
                width: 380px;
                @media (max-width: $breakpoints-sm) {
                    width: 100%;
                }
            }
        }

        #privacy-text, #privacy-links {
            font-size: 0.7rem;
        }

        a:not(.btn) {
            color: white;
            text-decoration: underline;
        }

        .btn-container {
            margin-top: 1rem;
        }
    }
}