/* Markdown styling for chat messages */

/* Base styles for message content */
.message-content {
    line-height: 1.5;
}

/* Bold text */
.message-content strong {
    font-weight: 600;
    color: #2c3e50;
}

/* Italic text */
.message-content em {
    font-style: italic;
    color: #34495e;
}

/* Headings */
.message-content h2 {
    font-size: 1.4em;
    margin: 0.8em 0 0.5em;
    border-bottom: 1px solid #eaecef;
    padding-bottom: 0.3em;
    color: #1a2a3a;
}

.message-content h3 {
    font-size: 1.2em;
    margin: 0.6em 0 0.4em;
    color: #2c3e50;
}

/* Links */
.message-content a {
    color: #3498db;
    text-decoration: none;
    border-bottom: 1px dotted #3498db;
    transition: all 0.2s ease;
}

.message-content a:hover {
    color: #2980b9;
    border-bottom-style: solid;
}

/* Unordered lists */
.message-content ul {
    padding-left: 20px;
    margin: 0.5em 0;
}

.message-content ul li {
    margin-bottom: 0.3em;
    position: relative;
    list-style-type: none;
    padding-left: 0.8em;
}

.message-content ul li:before {
    content: "•";
    position: absolute;
    left: -0.5em;
    color: #3498db;
}

/* Ordered lists */
.message-content ol {
    padding-left: 20px;
    margin: 0.5em 0;
    counter-reset: item;
}

.message-content ol li {
    margin-bottom: 0.3em;
    position: relative;
    list-style-type: none;
    counter-increment: item;
    padding-left: 0.8em;
}

.message-content ol li:before {
    content: counter(item) ".";
    position: absolute;
    left: -1.5em;
    width: 1.5em;
    text-align: right;
    color: #3498db;
    font-weight: 500;
}

/* Paragraphs */
.message-content p {
    margin: 0.5em 0;
}

/* Code blocks */
.message-content code {
    background-color: #f8f8f8;
    padding: 0.2em 0.4em;
    border-radius: 3px;
    font-family: monospace;
    font-size: 0.9em;
    color: #e74c3c;
}

/* Styles for multi-line fenced code blocks (e.g., SQL, JSON) */
.message-content pre {
    background-color: #f4f6f8; /* Light grey background */
    border: 1px solid #e0e0e0; /* Subtle border */
    border-radius: 5px;         /* Rounded corners */
    padding: 10px;              /* Padding around the code block */
    overflow-x: auto;         /* Allow horizontal scrolling for long lines */
    margin: 1em 0;              /* Margin above and below the block */
    white-space: pre-wrap;      /* Preserve whitespace and wrap lines if needed, but primarily rely on scroll */
    word-wrap: break-word;      /* Break long words if necessary to prevent overflow */
}

/* Reset/specific styles for the <code> tag within <pre> */
.message-content pre code {
    background-color: transparent; /* Inherit from pre, or set to none */
    color: #333;                 /* Darker text color for readability */
    padding: 0;                  /* Remove padding if any inherited from inline code */
    font-size: 0.9em;            /* Slightly smaller font size for code blocks */
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; /* Consistent monospaced font stack */
    border: none;                /* Remove border if any inherited */
    border-radius: 0;            /* Remove border-radius if any inherited */
}

/* Fix adjacent lists spacing */
.message-content ul + ul,
.message-content ol + ol,
.message-content ul + ol,
.message-content ol + ul {
    margin-top: -0.3em;
}