@import './custom-theme.scss';
.brands-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem;

    .brand-card {
        width: 325px;
        padding: 1.5rem;
        border-radius: 0.4rem;
        background-color: white;
        cursor: pointer;

        .card-body {
            display: flex;
            flex-flow: column nowrap;
            gap: 0.75rem;
            .card-logo {
                display: inline-block;
                width: 2.25rem;
                height: 2.25rem;
                border-radius: 0.5rem;
                background-color: $indigo-500;
                color: white;
                line-height: 2.25rem;
                text-align: center;
                margin-right: 0.5rem;
            }
            .card-text {
                margin: 0;
                display: inline-flex;
                align-items: center;

                .card-text-title {
                    display: inline-flex;
                    width: 100px;
                    flex-flow: row nowrap;
                    align-items: center;
                    gap: 0.25rem;
                    color: $neutral-600;
                    line-height: 1.5rem;
                }
                .card-text-content {
                    line-height: 1.5rem;
                    color: $neutral-900;
                }
            }
        }
    }
}

.add-brand-form {
    .button-group {
        display: flex;
        flex-flow: row nowrap;
        gap: 0.5rem;
        justify-content: flex-end;
    }
}