.card-container {
    composes: CardContainer from '../styles.scss';
}

.main-section {
    composes: MainSection from '../styles.scss';

    &.mobile {
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        height: 80px;
        padding-left: 0;
    }
}

.name-section {
    composes: NameSection from '../styles.scss';

    .handle {
        cursor: grab;
    }

    &.mobile {
        width: 100%;
        height: 40px;
        padding-left: 5px;
    }
}

.permission-container {
    composes: PermissionContainer from '../styles.scss';

    &.mobile {
        width: 100%;
        height: 40px;
        padding-left: 5px;
    }
}

.permission-section {
    composes: PermissionSection from '../styles.scss';
}

.action-section {
    composes: ActionSection from '../styles.scss';
}

.action-container {
    composes: ActionContainer from '../styles.scss';
}

.handle {
    padding-right: 10px;
    color: var(--primary-color);
    font-size: 12px;
}

.dropdown-section {
    composes: DropdownSection from '../styles.scss';
}

.dropdown-list {
    composes: DropdownList from '../styles.scss';
}
