/* _content/ChatBotTest/Components/Layout/LoadingSpinner.razor.rz.scp.css */
/* Used under CC0 license */

.lds-ellipsis[b-g0u4e7dch3] {
    color: #666;
    animation: fade-in-b-g0u4e7dch3 1s;
}

@keyframes fade-in-b-g0u4e7dch3 {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

    .lds-ellipsis[b-g0u4e7dch3],
    .lds-ellipsis div[b-g0u4e7dch3] {
        box-sizing: border-box;
    }

.lds-ellipsis[b-g0u4e7dch3] {
    margin: auto;
    display: block;
    position: relative;
    width: 80px;
    height: 80px;
}

    .lds-ellipsis div[b-g0u4e7dch3] {
        position: absolute;
        top: 33.33333px;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background: currentColor;
        animation-timing-function: cubic-bezier(0, 1, 1, 0);
    }

        .lds-ellipsis div:nth-child(1)[b-g0u4e7dch3] {
            left: 8px;
            animation: lds-ellipsis1-b-g0u4e7dch3 0.6s infinite;
        }

        .lds-ellipsis div:nth-child(2)[b-g0u4e7dch3] {
            left: 8px;
            animation: lds-ellipsis2-b-g0u4e7dch3 0.6s infinite;
        }

        .lds-ellipsis div:nth-child(3)[b-g0u4e7dch3] {
            left: 32px;
            animation: lds-ellipsis2-b-g0u4e7dch3 0.6s infinite;
        }

        .lds-ellipsis div:nth-child(4)[b-g0u4e7dch3] {
            left: 56px;
            animation: lds-ellipsis3-b-g0u4e7dch3 0.6s infinite;
        }

@keyframes lds-ellipsis1-b-g0u4e7dch3 {
    0% {
        transform: scale(0);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes lds-ellipsis3-b-g0u4e7dch3 {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(0);
    }
}

@keyframes lds-ellipsis2-b-g0u4e7dch3 {
    0% {
        transform: translate(0, 0);
    }

    100% {
        transform: translate(24px, 0);
    }
}
/* _content/ChatBotTest/Components/Layout/MainLayout.razor.rz.scp.css */
/* Prevent Global Page Scrolling */
html[b-d0zemgd9uj], body[b-d0zemgd9uj] {
    height: 100%;
    overflow: hidden; /* Prevent global page scrolling */
    margin: 0;
    padding: 0;
}

/* Ensure MudLayout fills viewport */
.mud-layout[b-d0zemgd9uj] {
    height: 100vh;
    overflow: hidden;
}

.mud-main-content[b-d0zemgd9uj] {
    height: 100%;
    overflow: hidden;
}

/* Modern Error UI */
#blazor-error-ui[b-d0zemgd9uj] {
    color-scheme: light only;
    background: linear-gradient(135deg, #fef3c7, #fde68a);
    bottom: var(--spacing-md);
    left: var(--spacing-md);
    right: var(--spacing-md);
    width: auto;
    box-shadow: var(--shadow-xl);
    border-radius: var(--radius-lg);
    border: 1px solid #f59e0b;
    box-sizing: border-box;
    display: none;
    padding: var(--spacing-md) var(--spacing-lg);
    position: fixed;
    z-index: 9999;
    color: #92400e;
    font-weight: 500;
    animation: slideUp-b-d0zemgd9uj var(--transition-normal) ease-out;
}

#blazor-error-ui .dismiss[b-d0zemgd9uj] {
    cursor: pointer;
    position: absolute;
    right: var(--spacing-md);
    top: var(--spacing-md);
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.1);
    transition: all var(--transition-fast);
}

#blazor-error-ui .dismiss:hover[b-d0zemgd9uj] {
    background: rgba(0, 0, 0, 0.2);
    transform: scale(1.1);
}

/* Glass effect for app bar */
.glass-effect[b-d0zemgd9uj] {
    background: rgba(255, 255, 255, 0.9) !important;
    backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

/* Modern card styling */
.card-modern[b-d0zemgd9uj] {
    background: white;
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-xl);
    border: 1px solid var(--neutral-200);
    transition: all var(--transition-normal);
    overflow: hidden;
}

.card-modern:hover[b-d0zemgd9uj] {
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
    transform: translateY(-4px);
}

/* Animation utilities */
.fade-in[b-d0zemgd9uj] {
    animation: fadeIn-b-d0zemgd9uj 0.6s ease-in-out;
}

.slide-up[b-d0zemgd9uj] {
    animation: slideUp-b-d0zemgd9uj 0.5s ease-out;
}

@keyframes fadeIn-b-d0zemgd9uj {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes slideUp-b-d0zemgd9uj {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ChatBotTest/Components/Layout/SurveyPrompt.razor.rz.scp.css */
.surveyContainer[b-fhbzfibsts] {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    font-size: 0.9em;
    margin: 0.5rem auto -0.7rem auto;
    max-width: 1024px;
    color: #444;
}

    .surveyContainer a[b-fhbzfibsts] {
        text-decoration: underline;
    }

    .surveyContainer .tool-icon[b-fhbzfibsts] {
        margin-top: 0.15rem;
        width: 1.25rem;
        height: 1.25rem;
        flex-shrink: 0;
    }
/* _content/ChatBotTest/Components/Pages/Chat/Chat.razor.rz.scp.css */
/* Main Chat Container - Fixed Viewport Height */
.chat-main-container[b-ew45rmr45d] {
    height: 100vh;
    max-height: 100vh;
    overflow: hidden;
}

/* Modern Chat Page Container - Fixed Height */
.chat-page-container[b-ew45rmr45d] {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: 100%;
    background: transparent;
    overflow: hidden;
}

/* Modern Content Area - Fixed Height with Internal Scrolling */
.chat-content-area[b-ew45rmr45d] {
    display: grid;
    grid-template-columns: 1fr 400px; /* Chat principale + sidebar testi */
    gap: var(--spacing-lg);
    padding: var(--spacing-lg);
    overflow: hidden;
    flex: 1;
    min-height: 0; /* Important for grid/flex children to respect parent height */
    height: 100%;
}

/* Modern Chat Column - Fixed Height with Internal Scrolling */
.chat-column[b-ew45rmr45d] {
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-lg);
    border: 1px solid var(--neutral-200);
    overflow: hidden;
    transition: all var(--transition-normal);
    position: relative;
    height: 100%;
    min-height: 0; /* Important for flex children */
}

.chat-column[b-ew45rmr45d]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--primary-500), var(--primary-400));
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
}

.chat-column:hover[b-ew45rmr45d] {
    box-shadow: var(--shadow-xl);
    transform: translateY(-2px);
}

/* Modern Messages Area - Scrollable Content */
.messages-area[b-ew45rmr45d] {
    overflow-y: auto;
    overflow-x: hidden;
    padding: var(--spacing-lg);
    flex: 1;
    background: var(--neutral-50);
    min-height: 0; /* Important for flex children to scroll properly */
    height: 100%;
}

/* Modern Input Area */
.input-area[b-ew45rmr45d] {
    border-top: 1px solid var(--neutral-200);
    padding: var(--spacing-lg);
    background: white;
    backdrop-filter: blur(10px);
}

/* Modern Texts Column - Fixed Height with Internal Scrolling */
.texts-column[b-ew45rmr45d] {
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: var(--radius-xl);
    border: 1px solid var(--neutral-200);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
    transition: all var(--transition-normal);
    position: relative;
    height: 100%;
    min-height: 0; /* Important for flex children */
}

.texts-column[b-ew45rmr45d]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--primary-400), var(--primary-300));
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
}

.texts-column:hover[b-ew45rmr45d] {
    box-shadow: var(--shadow-xl);
    transform: translateY(-2px);
}

/* Modern Texts Column Header */
.texts-column-header[b-ew45rmr45d] {
    flex-shrink: 0;
    padding: var(--spacing-lg);
    background: var(--bg-primary);
    border-bottom: 1px solid var(--neutral-200);
    position: relative;
}

.texts-column-header[b-ew45rmr45d]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: var(--spacing-lg);
    right: var(--spacing-lg);
    height: 2px;
    background: linear-gradient(90deg, var(--primary-400), transparent);
}

/* Modern Texts Content - Scrollable Area */
.texts-content[b-ew45rmr45d] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: var(--spacing-lg);
    min-height: 0; /* Important for flex children to scroll properly */
    height: 100%;
    background: var(--bg-secondary);
}

/* Modern Single Text Cards */
.single-text[b-ew45rmr45d] {
    margin-bottom: var(--spacing-md);
    padding: var(--spacing-md);
    background: var(--bg-primary);
    border: 1px solid var(--neutral-200);
    border-radius: var(--radius-lg);
    word-wrap: break-word;
    white-space: pre-wrap;
    line-height: 1.6;
    box-shadow: var(--shadow-sm);
    transition: all var(--transition-fast);
    position: relative;
    overflow: hidden;
}

.single-text[b-ew45rmr45d]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, var(--primary-400), var(--primary-300));
}

.single-text:hover[b-ew45rmr45d] {
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
    border-color: var(--primary-200);
}

/* Modern Input Styling */
.input-box[b-ew45rmr45d] {
    margin: 0 !important;
    border-radius: var(--radius-lg) !important;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .chat-content-area[b-ew45rmr45d] {
        grid-template-columns: 1fr;
        grid-template-rows: 1fr auto;
        gap: var(--spacing-md);
    }

    .texts-column[b-ew45rmr45d] {
        max-height: 300px;
    }
}

@media (max-width: 768px) {
    .chat-content-area[b-ew45rmr45d] {
        padding: var(--spacing-md);
        gap: var(--spacing-sm);
    }

    .texts-column[b-ew45rmr45d] {
        max-height: 250px;
    }
}

/* Enhanced Scrollbar Styling for All Scrollable Areas */
.texts-content[b-ew45rmr45d]::-webkit-scrollbar,
.messages-area[b-ew45rmr45d]::-webkit-scrollbar,
.modern-sidebar[b-ew45rmr45d]::-webkit-scrollbar,
.sidebar-content[b-ew45rmr45d]::-webkit-scrollbar {
    width: 6px;
}

.texts-content[b-ew45rmr45d]::-webkit-scrollbar-track,
.messages-area[b-ew45rmr45d]::-webkit-scrollbar-track,
.modern-sidebar[b-ew45rmr45d]::-webkit-scrollbar-track,
.sidebar-content[b-ew45rmr45d]::-webkit-scrollbar-track {
    background: var(--neutral-100);
    border-radius: 3px;
}

.texts-content[b-ew45rmr45d]::-webkit-scrollbar-thumb,
.messages-area[b-ew45rmr45d]::-webkit-scrollbar-thumb,
.modern-sidebar[b-ew45rmr45d]::-webkit-scrollbar-thumb,
.sidebar-content[b-ew45rmr45d]::-webkit-scrollbar-thumb {
    background: var(--neutral-300);
    border-radius: 3px;
    transition: background var(--transition-fast);
}

.texts-content[b-ew45rmr45d]::-webkit-scrollbar-thumb:hover,
.messages-area[b-ew45rmr45d]::-webkit-scrollbar-thumb:hover,
.modern-sidebar[b-ew45rmr45d]::-webkit-scrollbar-thumb:hover,
.sidebar-content[b-ew45rmr45d]::-webkit-scrollbar-thumb:hover {
    background: var(--neutral-400);
}

/* Smooth scrolling behavior */
.texts-content[b-ew45rmr45d],
.messages-area[b-ew45rmr45d],
.modern-sidebar[b-ew45rmr45d],
.sidebar-content[b-ew45rmr45d] {
    scroll-behavior: smooth;
}

/* Syncfusion ChatUI Header Fixes */
[b-ew45rmr45d] .e-chat-ui .e-chat-header {
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    background: var(--primary-600) !important;
    padding: var(--spacing-md) var(--spacing-lg) !important;
    border-bottom: 1px solid var(--primary-700) !important;
    color: var(--text-inverse) !important;
}

[b-ew45rmr45d] .e-chat-ui .e-chat-header::before,
[b-ew45rmr45d] .e-chat-ui .e-chat-header::after {
    display: none !important;
}

/* Fix uncolored pixel columns on sides */
[b-ew45rmr45d] .e-chat-ui {
    border-left: none !important;
    border-right: none !important;
    border-top: none !important;
}

/* Ensure header spans full width */
[b-ew45rmr45d] .e-chat-ui .e-chat-header {
    margin: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Remove any additional borders or lines */
[b-ew45rmr45d] .e-chat-ui .e-chat-header .e-chat-header-text {
    border: none !important;
    background: transparent !important;
    color: var(--text-inverse) !important;
}

/* Fix header content styling */
[b-ew45rmr45d] .e-chat-ui .e-chat-header .e-chat-header-content {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    color: var(--text-inverse) !important;
}

/* Ensure all header text elements are white */
[b-ew45rmr45d] .e-chat-ui .e-chat-header * {
    color: var(--text-inverse) !important;
}

/* Fix header title and subtitle colors */
[b-ew45rmr45d] .e-chat-ui .e-chat-header .e-chat-header-title,
[b-ew45rmr45d] .e-chat-ui .e-chat-header .e-chat-header-subtitle,
[b-ew45rmr45d] .e-chat-ui .e-chat-header .e-chat-user-name,
[b-ew45rmr45d] .e-chat-ui .e-chat-header .e-chat-user-status {
    color: var(--text-inverse) !important;
}

/* Additional SfChatUI styling fixes */
[b-ew45rmr45d] .e-chat-ui .e-chat-container {
    border: none !important;
    background: var(--bg-primary) !important;
}

/* Fix message area styling */
[b-ew45rmr45d] .e-chat-ui .e-chat-message-container {
    background: var(--bg-secondary) !important;
    border: none !important;
}

/* Fix input area styling */
[b-ew45rmr45d] .e-chat-ui .e-chat-input-container {
    background: var(--bg-primary) !important;
    border-top: 1px solid var(--neutral-200) !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
}

/* Ensure consistent border radius */
[b-ew45rmr45d] .e-chat-ui {
    border-radius: 0 !important;
}

/* Fix any remaining visual inconsistencies */
[b-ew45rmr45d] .e-chat-ui * {
    box-sizing: border-box !important;
}
