.application-card-container {

    display: flex;
    border: 1px solid #DFE2E7;
    border-radius: 4px;
    border-left-width: 8px;
    border-left-color: #36C9A9;
    padding: 1.75rem 2.5rem 1rem 3rem;

    width: var(--aisera-uicomponents-app-card-width, 91rem);
    min-height: var(--aisera-uicomponents-app-card-min-height, 21.75rem);

    .title-section {
        display: flex;
        align-items: center;
        margin-right: 2.5rem;
        overflow: hidden;
    }

    .title {
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
    }

    .logo-section {
        padding: 1rem;
        background-color: #000;
        border-radius: 14px;
        margin-top: 0.25rem;
        --aisera-uicomponents-avatar-width: 4.25rem;
        --aisera-uicomponents-avatar-height: 4.25rem;
    }

    .data-section {
        margin-left: 2.5rem;

        .card-section {
            display: flex;
            align-items: center;
            margin-top: 1rem;

            --aisera-uicomponents-divider-height: 2.5rem ;
            // --aisera-uicomponents-card-section-width: 37.75rem;
            // --aisera-uicomponents-card-section-min-height: 6rem;

            .section-padding {
                padding: 0 2.5rem;
            }
            .data-source {
                --aisera-uicomponents-card-section-icon-bgcolor: rgba(62, 183, 172, 0.05);
            }

            .channel {
                --aisera-uicomponents-card-section-icon-bgcolor: rgba(255, 93, 95, 0.05);
            }
        }

    }



    .environment {
        margin-left: 0.75rem;
        font-size: var(--font-size-xsmall);
        font-weight: 400;

        &-live {
            color: var(--semantic-success-text, #319B84);
            padding: 0 0.5rem;
            border-radius: 4px;
            background: #36C9A91A;
            font-size: var(--font-size-small);
            font-weight: 700;
        }

        &-circle {
            border-radius: 50%;
            width: 2rem;
            height: 2rem;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        &-dev {
            background: #287FCE1A;

        }

        &-uat {
            background: #9B7CD01A;
        }
    }

    .summary-box {
        padding: 0.75rem 1rem;
        border-radius: 4px;
        border: 1px solid #DFE2E7;
        margin-top: 1.5rem;
        font-weight: 600;
        font-size: var(--font-size-small);

        .summary-title {
            display: flex;
        }

        .summary-text {
            font-weight: 400;
        }

        .summary-values {
            margin-top: 0.5rem;
        }
        .summary-icon {
            display: flex;
            align-items: center;
            margin-left: 0.25rem;
        }
    }

    .properties {
        margin-top: 0.75rem;

        .label-padding {
            padding: 0 11.5rem;
        }

        .value {
            margin-left: 1rem;
        }

        .label {
            margin-top: 0.5rem;
        }
    }

}