﻿.divider {
    display: flex;
    align-items: center;
    color: #9ca3af;
    font-weight: 600;
}

    .divider > div.line {
        flex-grow: 1;
        border-top: 1px #d1d5db solid;
    }

    .divider > span {
        margin-inline: 1rem;
    }

.external-account-container {
    display: flex;
    justify-content: center;
    padding-top: 1rem;
}

    .external-account-container > button {
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 8rem;
        height: 3.125rem;
        border: 0.125rem #d1d5db solid;
        border-radius: 0.5rem;
        background-color: white;
        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 150ms;
        margin-inline: 1rem;
    }

        .external-account-container > button:hover {
            background-color: #f3f4f6;
        }

        .external-account-container > button > img {
            width: 1.5rem;
            height: 1.5rem;
        }

        .external-account-container > button {
            color: black;
        }

@media(min-width: 640px) {
    .external-account-container {
        gap: 1rem;
    }

        .external-account-container > button {
            min-width: 10rem;
        }
}
