﻿.w-full {
    width: 100%;
}
.fl-r{
    float:right;
}

.chat-btn-header {
    height:26px;
    width:26px;
}

.chat-header-logo {
    height: 24px;
    vertical-align: middle;
    margin-right: 8px;
}
.dxbl-window:has(.orya-container) {
    background-color: var(--dxbl-window-bg);
}
    .dxbl-window:has(.orya-container)[vertical-alignment="Center"] {
        transform: translate(0,0) !important;
    }

.dxbl-window > .dxbl-window-dialog:has(.orya-container) {
    background: radial-gradient(circle at top left,rgba(var(--_primary), 0.1), rgba(var(--_secondary), 0.1), rgba(var(--_secondary), 0), rgba(var(--_secondary), 0));
    border-radius: 20px;
}
.dxbl-window > .dxbl-window-dialog:has(.orya-container) .dxbl-window-header {
    padding-top: 20px;
}
.dxbl-window > .dxbl-window-dialog:has(.orya-container) .dxbl-window-header,
.dxbl-window > .dxbl-window-dialog:has(.orya-container) .dxbl-window-header::before {
    background: transparent !important;
    background-color: transparent !important;
    border-bottom: 0px;
}
    .dxbl-window > .dxbl-window-dialog:has(.orya-container) .dxbl-window-body {
        padding: 20px 20px 0px 20px;
        background: transparent !important;
        overflow: auto;
        margin-bottom: 115px;
    }

    .dxbl-window > .dxbl-window-dialog:has(.orya-container) .dxbl-window-body > .orya-container {
        width: 100%;
    }
        .dxbl-window > .dxbl-window-dialog:has(.orya-container) .dxbl-window-body > .orya-container .chat-main-container .dxbl-chatui-root .dxbl-chatui .dxbl-chatui-submitarea .dxbl-chatui-submitarea-container {
            width: calc(100% - 50px);
        }

        .dxbl-window > .dxbl-window-dialog:has(.orya-container) .dxbl-window-body > .orya-container .chat-main-container .dxbl-chatui-submitarea-container {
            position: fixed;
            bottom: 15px;
            max-width: 1100px;
        }


/*----ASK ORYA BUTTON*/
.header button.dxbl-btn.dxbl-btn-secondary[data-action-name="Ask Orya"] {
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 5px;
    /*background: linear-gradient(to right, rgba(var(--_secondary),0.0), rgba(var(--_secondary),0.0)) !important;*/
    color: currentColor;
    transition: .5s;
}
.header .dxbl-toolbar-item > .dxbl-btn:not(.dxbl-disabled):not(:disabled):not(.xaf-image-overlay)[data-action-name="Ask Orya"]:hover {
    border-radius: 30px;
    /*background: linear-gradient(to right, rgba(var(--_secondary),0.30), rgba(var(--_secondary),0.10)) !important;*/
    background: transparent !important;
    background-image: none!important;
    box-shadow: 0 0 0px 4px rgba(var(--_secondary), 0.4) !important;
    /*color: currentColor !important;*/
    transition: .5s;
}
.dxbl-toolbar-item:has(.dxbl-btn[data-action-name="Ask Orya"]) {
    background: transparent;
}
.dxbl-toolbar-item:has(.dxbl-btn[data-action-name="Ask Orya"]):hover {
    background-image: linear-gradient(60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82);
    background-size: 400% 400%;
    border-radius: 30px;
    animation: ask-orya-btn 3s ease alternate infinite;
}
@keyframes ask-orya-btn {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

.header button.dxbl-btn.dxbl-btn-secondary[data-action-name="Ask Orya"]::before {
    content: '';
    background-image: url('/images/Orya-icon-color.png');
    background-repeat: no-repeat !important;
    background-repeat: no-repeat !important;
    background-size: 24px !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    opacity: 1 !important;
    border-radius: 20px !important;
    position: relative !important;
    z-index: 1 !important;
}
.header button.dxbl-btn.dxbl-btn-secondary[data-action-name="Ask Orya"]:hover::before {
    content: '';
    background-image: url('/images/Orya-icon-white.png');
    background-color: transparent !important;
    animation: logo-spin 1s linear infinite;
    transition: .5s;
}

    @keyframes logo-spin {
        0% {
            transform: rotate(0deg);
        }

        100% {
            transform: rotate(360deg);
        }
    }

    .header button[data-action-name="Ask Orya"] img {
    display:none;
}