:root {
    --nc-primary: #3B82F6; /* Tailwind Blue-500 */
    --nc-primary-light: #60A5FA; /* Blue-400 */
    --nc-primary-dark: #2563EB; /* Blue-600 */
    --text-dark-primary: #1F2937;  
    --text-dark-secondary: #4B5563; 
    --text-on-primary-bg: #FFFFFF; 
    --bg-bot-message-light: #FFFFFF;   
    --border-color-light-subtle: #E5E7EB; 
}

/* --- Bot Message & Report Styles --- */
#report-container {
    display: flex;
    flex-direction: column;
    padding-bottom: 80px; /* Space for follow-up input */
}

.bot-message {
    background: var(--bg-bot-message-light);
    border: 1px solid #E5E7EB;
    border-radius: 0.75rem;
    padding: 1rem 1.25rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); 
    animation: fadeIn 0.5s ease;
    margin-bottom: 1.5rem;
}

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

/* --- Markdown Styles --- */
.bot-message .markdown-content ul, .bot-message .markdown-content ol { color: var(--text-dark-secondary); margin-left: 20px; padding-left: 10px;}
.bot-message .markdown-content li { margin-bottom: 0.3em; }
.bot-message .markdown-content code:not(pre code) { background-color: rgba(59, 130, 246, 0.1); color: var(--nc-primary-dark); padding: 0.2em 0.4em; border-radius: 3px; font-size: 0.9em; font-family: 'Consolas', 'Monaco', monospace; }
.bot-message .markdown-content pre { background-color: #F3F4F6; border: 1px solid var(--border-color-light-subtle); color: #1F2937; padding: 1em; border-radius: 0.5rem; overflow-x: auto; font-family: 'Consolas', 'Monaco', monospace; font-size: 0.9em; white-space: pre-wrap; }
.bot-message .markdown-content pre code { background: none; padding: 0; font-size: inherit; white-space: pre-wrap; color: inherit;}
.bot-message .markdown-content a { color: var(--nc-primary); font-weight: 500; text-decoration: underline; }
.bot-message .markdown-content blockquote { border-left: 4px solid var(--nc-primary-light); color: var(--text-dark-secondary); background-color: rgba(59, 130, 246, 0.05); padding: 0.5rem 1rem; margin-left: 0; border-radius: 0 0.5rem 0.5rem 0;}
.bot-message .markdown-content h1, .bot-message .markdown-content h2, .bot-message .markdown-content h3, .bot-message .markdown-content h4, .bot-message .markdown-content h5, .bot-message .markdown-content h6 { color: var(--text-dark-primary); margin-top: 1.5em; margin-bottom: 0.75em; font-weight: 700; }
.bot-message .markdown-content table { border-collapse: collapse; margin: 1em 0; width: 100%; display: block; overflow-x: auto; }
.bot-message .markdown-content th, .bot-message .markdown-content td { border: 1px solid var(--border-color-light-subtle); padding: 0.75em; text-align: left; }
.bot-message .markdown-content th { background-color: #F9FAFB; color: var(--text-dark-primary); font-weight: 600; }

/* --- Think Block Styles --- */
.bot-message .message-content-area { display: flex; flex-direction: column; }
.bot-message .loading-indicator-container { order: 0; }
.bot-message .think-container { order: 1; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border-color-light-subtle); color: var(--text-dark-primary); }
.bot-message .answer-content { order: 2; margin-top: 10px; }
.bot-message .think-preview { color: var(--text-dark-secondary); font-size: 0.9rem; display: flex; align-items: center; gap: 0.5rem; }
.bot-message .think-preview .fa-brain { color: var(--nc-primary-light); }
.bot-message .think-duration { color: var(--text-dark-secondary); opacity: 0.8; font-size: 0.8em; }
.bot-message .think-content-wrapper { max-height: 0; opacity: 0; overflow: hidden; transition: all 0.4s ease-in-out; padding: 0; margin: 0; border-radius: 0.5rem; }
.bot-message .think-content-wrapper.expanded { max-height: 400px; opacity: 1; margin-top: 0.75em; padding: 0; background-color: #F9FAFB; box-shadow: inset 0 2px 4px rgba(0,0,0,0.05);}
.bot-message .think-content-wrapper pre { font-family: 'Consolas', 'Monaco', monospace; font-size: 0.85em; background: transparent; border-left: 3px solid var(--nc-primary); white-space: pre-wrap; word-wrap: break-word; overflow-x: auto; color: var(--text-dark-secondary); margin: 0; padding: 1rem; border: none; }
.bot-message .toggle-think { color: var(--nc-primary); cursor: pointer; font-size: 0.9rem; margin-top: 0.5rem; display: inline-flex; align-items: center; gap: 0.5rem; }
.bot-message .toggle-think:hover { text-decoration: underline; }
.toggle-think .fas { transition: transform 0.3s ease-out; }
.toggle-think.expanded .fa-chevron-down { transform: rotate(180deg); }

/* --- Loading Indicator --- */
.loading-indicator-container { display: none; justify-content: center; align-items: center; padding: 10px 0; height: 30px; }
.loading-indicator-container.active { display: flex !important; }
.loading-indicator { font-size: 1rem; color: var(--text-dark-secondary); display: flex; align-items: center; }
.loading-indicator .fa-spinner { margin-right: 8px; animation: spin 1s linear infinite; color: var(--nc-primary); }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

/* --- Modal Styles --- */
.modal-overlay {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    display: flex; justify-content: center; align-items: center;
    z-index: 1000; backdrop-filter: blur(4px);
    opacity: 0; visibility: hidden; transition: all 0.3s ease;
}
.modal-overlay.visible { opacity: 1; visibility: visible; }
.modal {
    background: #FFFFFF; padding: 2rem; border-radius: 1.5rem;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    text-align: center; width: 90%; max-width: 400px;
    transform: scale(0.95); transition: transform 0.3s ease;
}
.modal-overlay.visible .modal { transform: scale(1); }
.modal h2 { color: var(--nc-primary); font-size: 1.5rem; font-weight: 700; margin-bottom: 1rem; display: flex; align-items: center; justify-content: center; gap: 0.5rem; }
.modal p { color: var(--text-dark-secondary); margin-bottom: 1.5rem; }
.modal input[type="password"],
.modal input[type="tel"] {
    width: 100%; padding: 0.75rem 1rem; margin-bottom: 1.5rem;
    border: 1px solid var(--border-color-light-subtle); border-radius: 0.75rem;
    font-size: 1rem; outline: none; transition: ring 0.2s;
    background-color: #F9FAFB; color: var(--text-dark-primary);
}
.modal input[type="password"]:focus,
.modal input[type="tel"]:focus { ring: 2px solid var(--nc-primary); border-color: var(--nc-primary); }
.modal button {
    width: 100%; padding: 0.75rem; border: none; border-radius: 0.75rem;
    background-color: var(--nc-primary); color: white;
    font-size: 1rem; font-weight: 600; cursor: pointer;
    transition: background-color 0.2s;
}
.modal button:hover { background-color: var(--nc-primary-dark); }
.modal .modal-error { color: #EF4444; margin-top: 1rem; font-size: 0.875rem; min-height: 1.25rem; }

/* --- Follow-up Styles --- */
.follow-up-container {
    position: fixed; bottom: 0; left: 0; right: 0;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    border-top: 1px solid var(--border-color-light-subtle);
    display: flex; gap: 0.75rem; align-items: center;
    z-index: 50;
    transform: translateY(100%); transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    max-width: 100%;
}
@media (min-width: 768px) {
    .follow-up-container {
        max-width: 28rem; /* Matches max-w-md */
        margin: 0 auto;
        left: 50%;
        transform: translate(-50%, 100%);
        border-radius: 1.5rem 1.5rem 0 0;
        border-left: 1px solid var(--border-color-light-subtle);
        border-right: 1px solid var(--border-color-light-subtle);
        bottom: 0;
    }
    .follow-up-container.visible {
        transform: translate(-50%, 0);
    }
}
@media (max-width: 767px) {
    .follow-up-container.visible {
        transform: translateY(0);
    }
}

#follow-up-input {
    flex: 1; padding: 0.75rem 1.25rem;
    border: 1px solid var(--border-color-light-subtle);
    border-radius: 9999px;
    font-size: 0.95rem; outline: none;
    background-color: #F9FAFB;
}
#follow-up-input:focus { border-color: var(--nc-primary); ring: 2px solid rgba(59, 130, 246, 0.2); }
#follow-up-send-btn {
    width: 3rem; height: 3rem; flex-shrink: 0;
    border-radius: 50%; border: none;
    background: var(--nc-primary); color: white;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; transition: transform 0.2s, background-color 0.2s;
    box-shadow: 0 4px 6px -1px rgba(59, 130, 246, 0.3);
}
#follow-up-send-btn:hover { background-color: var(--nc-primary-dark); transform: scale(1.05); }

/* Tooltip */
.follow-up-tooltip {
    position: absolute; bottom: 120%; left: 50%; transform: translateX(-50%) translateY(10px);
    background: #1F2937; color: white;
    padding: 0.5rem 1rem; border-radius: 0.5rem;
    font-size: 0.875rem; white-space: nowrap;
    opacity: 0; visibility: hidden; transition: all 0.3s ease;
    pointer-events: none;
}
.follow-up-tooltip.visible { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.follow-up-tooltip::after {
    content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
    border-width: 6px; border-style: solid; border-color: #1F2937 transparent transparent transparent;
}