.template-aiassistview {
    height: 650px;
    width: 65vw;
    margin: 0 auto;
}

.template-aiassistview .banner-content .e-assistview-icon:before,
.template-aiassistview .response-header .e-assistview-icon:before {
    margin-right: 10px;
}

.template-aiassistview .e-rtl .banner-content .e-assistview-icon:before,
.template-aiassistview .e-rtl .responseItemContent .e-assistview-icon:before
{
    margin-left: 10px;
}

.template-aiassistview .banner-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    align-items: center;
    padding: 10px;
    width: 65%;
    margin: 0 auto;
}

.template-aiassistview .e-carousel.e-partial .e-carousel-slide-container {
    padding: 0 50px;
}

.template-aiassistview .banner-content h3 {
    display: flex;
    margin: 20px 0px;
    font-size: 25px;
}

.template-aiassistview .banner-content .carousel-template {
    padding: 5px;
    position: relative;
    display: flex;
    justify-content: center;
    cursor: pointer;
}

.template-aiassistview .banner-content img {
    width: 100%;
    height: 250px;
    border-radius: 10px;
}

.template-aiassistview .banner-content .e-card {
    position: absolute;
    bottom: 20px;
    width: 86%;
    opacity: 0.8;
}

.template-aiassistview .banner-content .e-card-header {
    width: 100%;
    padding: 12px;
}

.template-aiassistview .e-aiassistview .e-views .e-suggestions li {
    padding: 0;
    border: none;
    box-shadow: none;
}

.template-aiassistview .suggestion-item {
    display: flex;
    align-items: center;
    background-color: #686868;
    color: white;
    padding: 4px 10px;
    opacity: 0.8;
    gap: 5px;
    height: 35px;
    border-radius: 5px;
}

.template-aiassistview .suggestion-item .assist-suggestion-content {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.template-aiassistview #ddMenu {
    border-radius: 50%;
}

.template-aiassistview .promptItemContent,
.template-aiassistview .responseItemContent {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.template-aiassistview .promptItemContent {
    align-items: flex-end;
    margin-right: 20px
}

.template-aiassistview .e-response-item-template .e-toolbar-items {
    margin-left: 35px;
}

.template-aiassistview .responseItemContent {
    margin-left: 20px
}

.template-aiassistview .promptItemContent .prompt-header,
.template-aiassistview .responseItemContent .response-header {
    font-size: 20px;
    font-weight: bold;
    display: flex;
    align-items: center;
}

.template-aiassistview #ddMenu.e-btn.e-icon-btn {
    padding: 8px;
    line-height: 14px;
}
.template-aiassistview #ddMenu.e-dropdown-btn.e-btn .e-btn-icon {
    margin-left: 0;
    width: 1em;
}

.template-aiassistview .promptItemContent .prompt-header span {
    margin-left: 10px;
}

.template-aiassistview .promptItemContent .assist-prompt-content {
    margin-right: 35px;
}

.template-aiassistview .responseItemContent .assist-response-content {
    margin-left: 35px;
}

.template-aiassistview .e-carousel .e-carousel-navigators .e-next .e-next-button,
.template-aiassistview .e-carousel .e-carousel-navigators .e-next .e-next-button:focus,
.template-aiassistview .e-carousel .e-carousel-navigators .e-next .e-next-button:hover,
.template-aiassistview .e-carousel .e-carousel-navigators .e-previous .e-previous-button,
.template-aiassistview .e-carousel .e-carousel-navigators .e-previous .e-previous-button:focus,
    .template-aiassistview .e-carousel .e-carousel-navigators .e-previous .e-previous-button:hover {
    outline: none;
    background-color: #f0f0f0;
    .e-btn-icon {
        color: #333;
    }
}

body[class*="dark"] .template-aiassistview .e-carousel .e-carousel-navigators .e-next .e-next-button,
body[class*="high"] .template-aiassistview .e-carousel .e-carousel-navigators .e-next .e-next-button,
body[class*="dark"] .template-aiassistview .e-carousel .e-carousel-navigators .e-next .e-next-button:focus,
body[class*="high"] .template-aiassistview .e-carousel .e-carousel-navigators .e-next .e-next-button:focus,
body[class*="dark"] .template-aiassistview .e-carousel .e-carousel-navigators .e-next .e-next-button:hover,
body[class*="high"] .template-aiassistview .e-carousel .e-carousel-navigators .e-next .e-next-button:hover,
body[class*="dark"] .template-aiassistview .e-carousel .e-carousel-navigators .e-previous .e-previous-button,
body[class*="high"] .template-aiassistview .e-carousel .e-carousel-navigators .e-previous .e-previous-button,
body[class*="dark"] .template-aiassistview .e-carousel .e-carousel-navigators .e-previous .e-previous-button:focus,
body[class*="high"] .template-aiassistview .e-carousel .e-carousel-navigators .e-previous .e-previous-button:focus,
body[class*="dark"] .template-aiassistview .e-carousel .e-carousel-navigators .e-previous .e-previous-button:hover,
body[class*="high"] .template-aiassistview .e-carousel .e-carousel-navigators .e-previous .e-previous-button:hover {
    outline: none;
    background-color: #333;
    .e-btn-icon {
        color: #f0f0f0;
    }
}

@media only screen and (max-width: 840px) {
    .template-aiassistview,
    .template-aiassistview .banner-content {
        width: 100%;
    }
}