/**
 * CockpitOS Light - Chatbot Messages
 * 
 * Verantwortlichkeit: Message Styling
 * 
 * @package CockpitOS_Light_Theme
 * @version 1.0.0
 */

.chatbot-message {
    display: flex;
    flex-direction: column;
    gap: var(--chatbot-spacing-xs);
    margin-bottom: var(--chatbot-spacing-lg);
    animation: messageSlideIn var(--chatbot-transition-normal);
}

@keyframes messageSlideIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.chatbot-message__content {
    padding: 16px 20px;
    border-radius: var(--chatbot-radius-md);
    max-width: 85%;
    word-wrap: break-word;
    line-height: 1.6;
    font-size: 15px;
    display: flex;
    flex-direction: column;
    gap: 0;
    /* Unified container for text + cards */
    position: relative;
}

/* Mobile: Mehr Platz für Message-Boxen */
@media (max-width: 768px) {
    .chatbot-message__content {
        max-width: 95%;
        padding: 14px 16px;
    }
}

@media (max-width: 480px) {
    .chatbot-message__content {
        max-width: 98%;
        padding: 12px 14px;
    }
}

/* Text wrapper - separates text from cards visually */
.chatbot-message__content-text-wrapper {
    margin-bottom: 0;
    flex-shrink: 0;
    padding-bottom: 0;
}

/* Text Content */
.chatbot-message__content-text-wrapper .chatbot-message__content-text {
    word-wrap: break-word;
    line-height: 1.6;
    margin: 0;
}

/* Fallback for direct text content (without wrapper) */
.chatbot-message__content-text {
    word-wrap: break-word;
    line-height: 1.6;
}

.chatbot-message__content-text strong {
    font-weight: 600;
    color: var(--chatbot-text);
}

.chatbot-message__content-text em {
    font-style: italic;
}

.chatbot-message__content-text a {
    color: var(--chatbot-primary);
    text-decoration: underline;
}

.chatbot-message__content-text a:hover {
    color: var(--chatbot-primary-dark);
}

.chatbot-message__content-text ol,
.chatbot-message__content-text ul {
    margin: 8px 0;
    padding-left: 24px;
}

.chatbot-message__content-text li {
    margin: 4px 0;
}

.chatbot-message__content-text br {
    line-height: 1.6;
}

/* Window Mode: Größere Max-Width */
.cockpit-os-chatbot-modal[data-layout="window"] .chatbot-message__content {
    max-width: 90%;
}

@media (max-width: 768px) {
    .cockpit-os-chatbot-modal[data-layout="window"] .chatbot-message__content {
        max-width: 95%;
    }
}

@media (max-width: 480px) {
    .cockpit-os-chatbot-modal[data-layout="window"] .chatbot-message__content {
        max-width: 98%;
    }
}

/* User Message */
.chatbot-message--user {
    align-items: flex-end;
}

.chatbot-message--user .chatbot-message__content {
    background: var(--chatbot-message-user-bg);
    color: var(--chatbot-message-user-text);
    border-bottom-right-radius: var(--chatbot-radius-sm);
}

/* Assistant Message */
.chatbot-message--assistant {
    align-items: flex-start;
}

.chatbot-message--assistant .chatbot-message__content {
    background: var(--chatbot-message-assistant-bg);
    color: var(--chatbot-message-assistant-text);
    border-bottom-left-radius: var(--chatbot-radius-sm);
}

/* Error Message */
.chatbot-message--error {
    justify-content: center;
}

.chatbot-message--error .chatbot-message__content {
    background: var(--color-error);
    color: var(--color-white);
    text-align: center;
}

/* Loading Message */
.chatbot-message--loading {
    justify-content: flex-start;
}

.chatbot-loading {
    display: inline-flex;
    align-items: center;
    gap: var(--chatbot-spacing-xs);
    padding: var(--chatbot-spacing-md);
    background: var(--chatbot-message-assistant-bg);
    border-radius: var(--chatbot-radius-md);
    max-width: fit-content;
}

.chatbot-loading__dot {
    width: 8px;
    height: 8px;
    background: var(--chatbot-text-secondary);
    border-radius: var(--chatbot-radius-full);
    animation: loadingDot 1.4s infinite ease-in-out both;
}

.chatbot-loading__dot:nth-child(1) {
    animation-delay: -0.32s;
}

.chatbot-loading__dot:nth-child(2) {
    animation-delay: -0.16s;
}

@keyframes loadingDot {
    0%, 80%, 100% {
        transform: scale(0);
        opacity: 0.5;
    }
    40% {
        transform: scale(1);
        opacity: 1;
    }
}

/* Streaming Message - Cursor (NUR wenn streaming Klasse vorhanden) */
.chatbot-message--streaming .chatbot-message__content::after {
    content: '▋';
    animation: blink 1s infinite;
    margin-left: 2px;
    color: var(--chatbot-text);
    display: inline-block;
}

.chatbot-message--streaming .chatbot-message__content-text::after {
    content: '▋';
    animation: blink 1s infinite;
    margin-left: 2px;
    color: var(--chatbot-text);
    display: inline-block;
}

/* KEIN Cursor wenn NICHT streaming */
.chatbot-message:not(.chatbot-message--streaming) .chatbot-message__content::after {
    content: none !important;
    animation: none !important;
    display: none !important;
}

.chatbot-message:not(.chatbot-message--streaming) .chatbot-message__content-text::after {
    content: none !important;
    animation: none !important;
    display: none !important;
}

/* Finalized messages - sicherstellen dass kein Cursor */
.chatbot-message--finalized .chatbot-message__content::after,
.chatbot-message--finalized .chatbot-message__content-text::after {
    content: none !important;
    animation: none !important;
    display: none !important;
}

@keyframes blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}