#welcome-screen img:first-of-type {
    height: auto; 
    width: 75%;
    border-radius: 1.5rem;
}

#chat-profiles img:first-of-type {
    display: none;
}

div[role=option] img
{
    display: none;
}

#welcome-screen div.prose:first-of-type {
    padding-top: .5rem;
}

#header {
    background-color: hsl(var(--primary));
}

#header .text-muted-foreground, #header button, #header input, #header optgroup, #header select, #header textarea {
    color: white;
}

#header .ring-offset-background:hover {
    color: hsl(var(--primary));
}

#header img[class~="h-6"] {
    display: none;
}

.bg-accent {
    background-color: hsl(var(--secondary));
}

/* "Thinking..." indicator shown in the assistant bubble while the initial
   answer is being generated (before the first streamed token). The word itself
   (from i18n) stays STATIC; only the trailing dots animate, cycling through
   0 → 1 → 2 → 3 dots and back via a stepped `content` animation. */
.thinking-indicator {
    display: inline-flex;
    align-items: baseline;
    color: hsl(var(--muted-foreground));
}

.thinking-dots::after {
    content: "";
    animation: thinkingDots 1.6s steps(1) infinite;
}

@keyframes thinkingDots {
    0% {
        content: "";
    }
    25% {
        content: ".";
    }
    50% {
        content: "..";
    }
    75% {
        content: "...";
    }
    100% {
        content: "";
    }
}

/* ─────────────────────────────────────────────────────────────────────────
   TeleNeoWeb — Deutsche Telekom brand font (frontend default).
   theme.json already sets --font-sans: 'TeleNeoWeb', sans-serif (and
   body { font-family: var(--font-sans) }), but there was no @font-face to load
   the file, so the browser silently fell back to the system sans-serif. These
   faces load the web fonts from /public/fonts/web (woff2 preferred, woff
   fallback) so the whole UI actually renders in TeleNeoWeb. font-display: swap
   avoids invisible text while the font downloads.
   ───────────────────────────────────────────────────────────────────────── */
@font-face {
    font-family: 'TeleNeoWeb';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('/public/fonts/web/TeleNeoWeb-Regular.woff2') format('woff2'),
         url('/public/fonts/web/TeleNeoWeb-Regular.woff') format('woff');
}

@font-face {
    font-family: 'TeleNeoWeb';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url('/public/fonts/web/TeleNeoWeb-RegularItalic.woff2') format('woff2'),
         url('/public/fonts/web/TeleNeoWeb-RegularItalic.woff') format('woff');
}

@font-face {
    font-family: 'TeleNeoWeb';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('/public/fonts/web/TeleNeoWeb-Medium.woff2') format('woff2'),
         url('/public/fonts/web/TeleNeoWeb-Medium.woff') format('woff');
}

@font-face {
    font-family: 'TeleNeoWeb';
    font-style: italic;
    font-weight: 500;
    font-display: swap;
    src: url('/public/fonts/web/TeleNeoWeb-MediumItalic.woff2') format('woff2'),
         url('/public/fonts/web/TeleNeoWeb-MediumItalic.woff') format('woff');
}

@font-face {
    font-family: 'TeleNeoWeb';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('/public/fonts/web/TeleNeoWeb-Bold.woff2') format('woff2'),
         url('/public/fonts/web/TeleNeoWeb-Bold.woff') format('woff');
}

@font-face {
    font-family: 'TeleNeoWeb';
    font-style: italic;
    font-weight: 700;
    font-display: swap;
    src: url('/public/fonts/web/TeleNeoWeb-BoldItalic.woff2') format('woff2'),
         url('/public/fonts/web/TeleNeoWeb-BoldItalic.woff') format('woff');
}