html {
    /* Default is usually 16px. Changed to 13px for smaller, lighter fonts */
    font-size: 13px; 
}

.markdown-content h1 {
    font-size: 2em;
    font-weight: bold;
    margin-bottom: 1em;
    color: #1a202c;
}

.markdown-content h2 {
    font-size: 1.5em;
    font-weight: bold;
    margin-top: 1.5em;
    margin-bottom: 0.5em;
    color: #2d3748;
}

.markdown-content ul {
    list-style-type: disc;
    margin-left: 1.5em;
    margin-bottom: 1em;
}

.markdown-content p {
    margin-bottom: 1em;
    line-height: 1.6;
}

.markdown-content a {
    color: #4299e1;
    text-decoration: underline;
}

.markdown-content strong {
    font-weight: bold;
} 

.message-bubble {
    @apply mb-4 max-w-[80%];
}

.message-bubble.assistant {
    @apply self-start;
}

.message-bubble.assistant .bubble-content {
    @apply bg-[#353541] text-white rounded-lg px-4 py-2;
}

.message-bubble.user {
    @apply self-end;
}

.message-bubble.user .bubble-content {
    @apply bg-blue-600 text-white rounded-lg px-4 py-2;
}

/* Prevent flash of unstyled content for top navigation */
#topnav-container {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 64px; /* 16 * 4 = 64px (h-16 in Tailwind) */
    background-color: #1F1F29; /* Same as navigation background */
    z-index: 50;
}

/* ========== Glimbr Branding Styles ========== */

/* Large logo with text shadow (for auth pages) */
.glimbr-logo-large {
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.5), 0 0 20px rgba(0, 0, 0, 0.3), 0 0 30px rgba(0, 0, 0, 0.15);
}

/* Light text shadow variant (for mobile/light backgrounds) */
.glimbr-logo-light-shadow {
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.15), 0 0 20px rgba(255, 255, 255, 0.08), 0 0 30px rgba(255, 255, 255, 0.03);
}

/* Dark text shadow variant (for desktop/dark backgrounds) */
.glimbr-logo-dark-shadow {
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.15), 0 0 20px rgba(0, 0, 0, 0.08), 0 0 30px rgba(0, 0, 0, 0.03);
}

/* Logo underline gradient container */
.glimbr-logo-underline-container {
    position: relative;
    display: inline-block;
}

/* Logo underline gradient (large variant) */
.glimbr-logo-underline-large {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(to right, #4d54ff, #d03f90, #ff3868);
}

/* Logo underline gradient (small variant) */
.glimbr-logo-underline-small {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(to right, #4d54ff, #d03f90, #ff3868);
}

/* Simple text underline for navbar */
.glimbr-logo-text-underline {
    text-decoration: underline;
}

/* ========== Utility Classes ========== */

/* Display utilities */
.hidden-initial {
    display: none;
}

/* White text link */
.link-white {
    color: white;
}

/* ========== Calendar Grid Layouts ========== */

/* Week view calendar grid */
.calendar-grid-week {
    grid-template-columns: 80px repeat(7, 1fr);
}

/* Day view calendar grid */
.calendar-grid-day {
    grid-template-columns: 80px 1fr;
}

/* ========== Modal Styles ========== */

/* Modal content with scrollable area */
.modal-content-scrollable {
    max-height: calc(90vh - 140px);
}

/* Modal overlay with high z-index */
.modal-overlay-high {
    z-index: 60;
}

/* Modal background with transparency */
.modal-background-overlay {
    background-color: rgba(0, 0, 0, 0.5);
}

/* ========== Embed Chat Demo Styles ========== */

/* Warning box styling */
.embed-warning-spacing {
    margin-bottom: 30px;
    font-size: 16px;
}

/* Ordered list in embed demo */
.embed-list-spacing {
    margin: 10px 0;
    padding-left: 20px;
}

/* Link styling in embed demo */
.embed-link-gold {
    color: #ffd700;
}

/* Unordered list in embed demo */
.embed-ul-spacing {
    margin: 10px 0;
    padding-left: 20px;
}