/**=====================
    2.7 Basic-card CSS Start
==========================**/

.dark-color-header {
    background-color: unset !important;
    color: var(--theme-default);
    ul {
        li {
            &:first-child,
            &:last-child {
                i {
                    color: var(--theme-default) !important;
                }
            }

            i {
                color: $light-color !important;
            }
        }
    }
}
.dark-card {
    .card-body {
        border-radius: 0 !important;
    }
    .card-header {
        border-bottom: 1px solid $light-gray !important;
    }
    .card-footer {
        border-top: 1px solid $light-gray !important;
    }
    .bg-dark {
        background-color: $dark-card-background !important;
    }
}
.creative-card {
    .card {
        .card-header {
            p {
                text-overflow: ellipsis;
                overflow: hidden;
                display: -webkit-box !important;
                -webkit-line-clamp: 1;
                -webkit-box-orient: vertical;
                white-space: normal;
            }
        }
        .card-body {
            p {
                text-overflow: ellipsis;
                overflow: hidden;
                display: -webkit-box !important;
                -webkit-line-clamp: 5;
                -webkit-box-orient: vertical;
                white-space: normal;
            }
            .list-group-numbered {
                li {
                    display: flex;
                    .badge {
                        @media screen and (max-width: 1020px) {
                            display: none !important;
                        }
                    }
                    @media screen and (max-width: 1020px) {
                        span {
                            text-overflow: ellipsis;
                            overflow: hidden;
                            display: -webkit-box !important;
                            -webkit-line-clamp: 1;
                            -webkit-box-orient: vertical;
                            white-space: normal;
                        }
                    }
                }
            }
            .list-group {
                a {
                    img {
                        @media screen and (max-width: 1020px) {
                            margin-right: 5px;
                            [dir="rtl"] & {
                                margin-right: unset;
                                margin-left: 5px;
                            }
                        }
                    }
                    @media screen and (max-width: 1020px) {
                        span {
                            text-overflow: ellipsis;
                            overflow: hidden;
                            display: -webkit-box !important;
                            -webkit-line-clamp: 1;
                            -webkit-box-orient: vertical;
                            white-space: normal;
                        }
                    }
                }
            }
        }
    }
}
.dragable-card {
    .card {
        .card-body {
            .alert {
                p {
                    text-overflow: ellipsis;
                    overflow: hidden;
                    display: -webkit-box !important;
                    -webkit-line-clamp: 1;
                    -webkit-box-orient: vertical;
                    white-space: normal; 
                }
            }
        }
    }
}
/**=====================
  2.7 Basic-card CSS Ends
==========================**/