.w-full {
    width: 100%;
}

.fl-r {
    float: right;
}

.chat-btn-header {
    height: 26px;
    width: 26px;
}
span.fl-r:has(.chat-btn-header.dxbl-btn-primary) {
	margin-left: 20px;
}
    .chat-btn-header.dxbl-btn-primary {
        background: transparent !important;
        border: 0px;
        color: currentColor;
    }

.dxbl-window > .dxbl-window-dialog > .dxbl-window-header .chat-btn-header.dxbl-btn-primary.dx-icon-expandform:not(.dxbl-disabled):not(:disabled):hover::before {
    content: "\f170";
    color: currentColor;
    opacity: 1 !important;
    z-index: 1;
    position: relative;
    background-color: transparent;
}

.dxbl-window > .dxbl-window-dialog > .dxbl-window-header .chat-btn-header.dxbl-btn-primary.dx-icon-close:not(.dxbl-disabled):not(:disabled):hover::before {
    content: "\f00a";
    color: currentColor;
    opacity: 1 !important;
    z-index: 1;
    position: relative;
    background-color: transparent;
}

span:has(.chat-header-logo ) {
    background: linear-gradient(45deg, var(--site-primary), var(--site-secondary));
    /* background: var(--site-secondary-custombg); */
    padding: 9px 7px 10px;
    border-radius: 40px;
}

.chat-header-logo {
    height: 24px;
    vertical-align: middle;
    margin-right: 8px;
    filter: var(--icon-filter-white);
}

.dxbl-window:has(.orya-container) {
    /* background-color: var(--dxbl-window-bg); */
    /*background-color: transparent;
	border-radius: 20px;
	animation-name: show-chatwindow;
    animation-duration: .5s;*/
}

    .dxbl-window:has(.orya-container)[vertical-alignment="Center"] {
        transform: translate(0,0) !important;
    }

.dxbl-window > .dxbl-window-dialog:has(.orya-container) {
    background-color: var(--dxbl-window-bg);
    border-radius: 20px;
    animation-name: open-chatwindow;
    animation-duration: .5s;
}

    .dxbl-window > .dxbl-window-dialog:has(.orya-container)::before {
        content: "";
        width: 100%;
        height: 100%;
        position: absolute;
        border-radius: 20px;
        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));
    }

.dxbl-window:has(.orya-container) > .dxbl-window-dialog.dxbl-popup-horizontalalignment-center {
    border-radius: 0px;
}

@keyframes open-chatwindow {
    0% {
        left: 100%;
        width: 550px;
    }

    90% {
        left: -2%;
    }

    100% {
        left: 0%;
    }
}

@keyframes show-chatwindow {
    0% {
        background-color: transparent;
    }

    90% {
        background-color: transparent;
    }

    100% {
        background-color: var(--dxbl-window-bg);
    }
}

.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: 100px;
    scroll-behavior: smooth;
}

.dxbl-window > .dxbl-window-dialog:has(.chat-message.user-message) .dxbl-window-body {
    margin-bottom: 120px;
    scroll-behavior: smooth;
}

.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 {
        background: transparent;
    }

        .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;
}

/* ----OPTION BUTTONS---- */
.orya-container .chat-main-container .dxbl-btn-standalone.dxbl-btn-outline-primary {
    background: var(--site-primary-custombg);
    color: white;
    border: 0px;
    border-radius: 20px;
    margin: 0px 10px 10px 0px;
    font-size: 14px;
    text-align: left;
}

/*mic button*/
/* ── Container ──────────────────────────────────────────────── */


/* .orya-voice-controls { */
/* position: relative; */
/* display: inline-flex; */
/* align-items: center; */
/* gap: 8px; */
/* top: -32px; */
/* left: 130px; */
/* } */

/* ── Main Mic Button ────────────────────────────────────────── */
.orya-voice-wrapper {
    display: block;
    opacity: 1;
    width: fit-content;
    position: absolute;
    bottom: 22px;
    left: 30px;
}

.orya-voice-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 50px;
    background: var(--orya-voice-bg, #f3f4f6);
    color: var(--orya-voice-fg, #374151);
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 2;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    padding: 6px;
    opacity: .75;
}

    .orya-voice-btn:hover:not(:disabled) {
        background: var(--orya-voice-bg-hover, #e5e7eb);
        transform: scale(1.05);
        opacity: 1;
    }

    .orya-voice-btn:active:not(:disabled) {
        transform: scale(0.95);
    }

    .orya-voice-btn:disabled {
        cursor: not-allowed;
        opacity: 0.6;
    }

    /* Recording state */
    .orya-voice-btn.recording {
        background: var(--orya-accent, #ef4444);
        color: #fff;
        animation: orya-pulse 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
    }

    /* Processing state */
    .orya-voice-btn.processing {
        background: var(--orya-accent, #6366f1);
        color: #fff;
    }

/* ── Icons ──────────────────────────────────────────────────── */
.orya-voice-icon {
    width: 20px;
    height: 20px;
}

.orya-voice-icon-sm {
    width: 16px;
    height: 16px;
}

.orya-voice-spinner {
    width: 20px;
    height: 20px;
    animation: orya-spin 1s linear infinite;
}

/* ── Amplitude Ring (overlays the button) ───────────────────── */
.orya-voice-amplitude-ring {
    position: absolute;
    top: 14px;
    left: 14px;
    width: 52px;
    height: 52px;
    transform: translate(-50%, -50%);
    pointer-events: none;
    z-index: 1;
    transition: stroke-dasharray 0.1s ease-out;
}

/* ── Timer ──────────────────────────────────────────────────── */
.orya-voice-timer {
    font-variant-numeric: tabular-nums;
    font-size: 12px;
    font-weight: 500;
    color: currentColor;
    min-width: 32px;
    text-align: center;
    margin-left: 20px;
    user-select: none;
}

/* ── TTS Stop Button ────────────────────────────────────────── */
.orya-voice-stop-tts {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 50%;
    background: var(--orya-voice-bg, #f3f4f6);
    color: var(--orya-voice-fg, #374151);
    cursor: pointer;
    transition: all 0.15s ease;
}

    .orya-voice-stop-tts:hover {
        background: var(--orya-voice-bg-hover, #e5e7eb);
    }

/* ── Animations ─────────────────────────────────────────────── */
@keyframes orya-pulse {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4);
    }

    50% {
        box-shadow: 0 0 0 10px rgba(239, 68, 68, 0);
    }
}

@keyframes orya-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}
@media screen and (max-width:450px) {
#OryaChatWindow > dxbl-popup-resizable-container {
	--dxbl-popup-resize-container-width: 100% !important;
    --dxbl-popup-resize-container-height: 100% !important;
}
}
/* ── Dark Mode Overrides (when parent sets data-theme="dark") ─ */
:root[data-theme="dark"] .orya-voice-btn,
.dark .orya-voice-btn {
    --orya-voice-bg: #374151;
    --orya-voice-fg: #e5e7eb;
    --orya-voice-bg-hover: #4b5563;
}