/* Dialogue quotes for posts: my prompts vs Claude excerpted output.
   Prompts: dark grey text on a light gray-green field — the record of
   the past. Claude output: monospace — computer text. The two solid
   left borders carry distinct colors. */
blockquote.dialogue-prompt,
blockquote.dialogue-llm {
    margin: 1.5rem 0;
    padding: 0.75rem 1rem;
    border-radius: 6px;
}

blockquote.dialogue-prompt {
    background: #e6ede6;
    color: #3a3f3a;
    border-inline-start: 4px solid #4a7c59;
    /* Messaging-app schema: my messages sit shifted to the right */
    margin-inline-start: 2.5rem;
}

/* The theme sets the font on article p/li directly, so inheritance is
   not enough — target those elements too */
blockquote.dialogue-llm,
blockquote.dialogue-llm p,
blockquote.dialogue-llm li {
    font-family: var(--code-font, monospace), monospace;
}

blockquote.dialogue-llm {
    font-size: 0.9em;
    border-inline-start: 4px solid #d97757;
}

/* Ellipsis-only paragraphs mark elided output. The negative block-start
   margin cancels the preceding paragraph's block-end margin through
   collapse, leaving a 0.4rem gap on each side instead of a blank line. */
blockquote.dialogue-llm p.dialogue-ellipsis {
    margin-block-start: calc(0.4rem - var(--paragraph-spacing, 24px));
    margin-block-end: 0.4rem;
    line-height: 1;
}

/* Marker for a context switch: a new chat, opened because the goal changed */
.context-switch {
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
    margin: 2.5rem 0 1.5rem;
    padding-top: 1rem;
    border-top: 2px solid var(--divider-color, #ccc);
}

.context-switch-label {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--primary-color, #087e96);
    white-space: nowrap;
}

.context-switch-goal {
    font-size: 0.9rem;
    font-style: italic;
    color: var(--text-2, #888);
}

.dialogue-label {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-2, #888);
    margin-bottom: 0.3rem;
    font-family: var(--sans-serif-font, sans-serif);
}

/* Dark scheme: the inverse — light gray-green text on dark gray-green */
[data-theme='dark'] blockquote.dialogue-prompt {
    background: #222b24;
    color: #c6d2c6;
    border-inline-start-color: #6fa07e;
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme='light']) blockquote.dialogue-prompt {
        background: #222b24;
        color: #c6d2c6;
        border-inline-start-color: #6fa07e;
    }
}