/* ------------------------------------------------------------ 0.13: font size, wallpaper, contrast, motion and the dark theme */

/* Font size (Settings → Chats). Zoom also enlarges screen-height units, so heights are divided by it to still fit the screen. */
html { --ui-zoom: 1; }
html[data-text-size='small'] { --ui-zoom: .9; }
html[data-text-size='large'] { --ui-zoom: 1.16; }
html[data-text-size='xlarge'] { --ui-zoom: 1.32; }
html:not([data-text-size='medium']) .app-shell, html:not([data-text-size='medium']) dialog, html:not([data-text-size='medium']) .incoming-card, html:not([data-text-size='medium']) .auth-card { zoom: var(--ui-zoom); }
html:not([data-text-size='medium']) .app-shell { height: calc(100dvh / var(--ui-zoom) - 32px); }
html:not([data-text-size='medium']) dialog { max-height: calc(100dvh / var(--ui-zoom) - 32px); }
html:not([data-text-size='medium']) .settings-dialog { height: min(780px, calc(100dvh / var(--ui-zoom) - 48px)); }
@media (min-width: 1600px) { html:not([data-text-size='medium']) .app-shell { height: calc(100dvh / var(--ui-zoom) - 48px); } }
/* 0.14: zoom enlarges screen-width units too, so dialogs (the call screen among them) are kept inside the screen the same way. */
@media (min-width: 761px) { html:not([data-text-size='medium']) dialog { max-width: calc(100vw / var(--ui-zoom) - 24px); } }
@media (max-width: 760px) {
  html:not([data-text-size='medium']) .app-shell { height: calc(100dvh / var(--ui-zoom)); min-height: 0; }
  html:not([data-text-size='medium']) .auth-card { min-height: calc(100dvh / var(--ui-zoom)); }
  html:not([data-text-size='medium']) dialog { width: calc(100vw / var(--ui-zoom)); max-width: calc(100vw / var(--ui-zoom)); max-height: calc(100dvh / var(--ui-zoom)); }
  html:not([data-text-size='medium']) .call-dialog, html:not([data-text-size='medium']) .settings-dialog { height: calc(100dvh / var(--ui-zoom)); max-height: calc(100dvh / var(--ui-zoom)); }
}

/* Chat wallpaper (Settings → Chats → Wallpaper), with or without its pattern of dots. */
html { --wall: #eeeae1; --dots-a: #93a38c25; --dots-b: #fff8; }
html[data-wallpaper='sand'] { --wall: #ece0c8; }
html[data-wallpaper='mint'] { --wall: #d6ecdf; }
html[data-wallpaper='sky'] { --wall: #d5e6f2; }
html[data-wallpaper='rose'] { --wall: #f2dcdc; }
html[data-wallpaper='lavender'] { --wall: #e2dcf1; }
html[data-wallpaper='slate'] { --wall: #d3dade; }
html[data-wallpaper='plain'] { --wall: #f4f5f3; }
.chat-messages { background-color: var(--wall); background-image: radial-gradient(var(--dots-a) .85px, transparent .85px), radial-gradient(var(--dots-b) .7px, transparent .7px); }
html.no-doodles .chat-messages { background-image: none; }
.wallpaper-swatch { background-color: #eeeae1; background-image: radial-gradient(#93a38c50 1px, transparent 1px); background-size: 9px 9px; }
.wallpaper-swatch[data-wallpaper='sand'] { background-color: #ece0c8; }
.wallpaper-swatch[data-wallpaper='mint'] { background-color: #d6ecdf; }
.wallpaper-swatch[data-wallpaper='sky'] { background-color: #d5e6f2; }
.wallpaper-swatch[data-wallpaper='rose'] { background-color: #f2dcdc; }
.wallpaper-swatch[data-wallpaper='lavender'] { background-color: #e2dcf1; }
.wallpaper-swatch[data-wallpaper='slate'] { background-color: #d3dade; }
.wallpaper-swatch[data-wallpaper='plain'] { background-color: #f4f5f3; }

/* Increase contrast (Settings → Accessibility). */
html.high-contrast { --muted: #34463f; --line: #a9b9b1; --body: #1f332c; }
html.high-contrast .message-meta, html.high-contrast .composer-foot, html.high-contrast .chat-list-top time, html.high-contrast .voice-time { color: var(--muted); }
html.high-contrast input:not([type='checkbox']):not([type='radio']), html.high-contrast select, html.high-contrast .message-field, html.high-contrast .message-input, html.high-contrast .tool-button, html.high-contrast .send-in-chip { border-color: #6f837a; }
html.high-contrast .message-bubble { box-shadow: 0 0 0 1px #0000003d; }
html.high-contrast .chat-list-item { border-bottom-color: #c5d1cb; }

/* Reduce animation (Settings → Accessibility). */
html.reduce-motion *, html.reduce-motion *::before, html.reduce-motion *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }

/* ------------------------------------------------------------ dark theme (Settings → Chats → Theme) */
html[data-theme='dark'] {
  color-scheme: dark;
  --ink: #e9edef; --body: #d1d7db; --muted: #8d9ca5; --accent: #21b58f; --accent-dark: #1c9c7b; --accent-soft: #123a31; --line: #233138; --surface: #111b21; --danger: #f1857a; --seen: #53bdeb;
  --panel: #111b21; --row-hover: #1d2930; --switch-off: #3b4a54; --photo-back: #2a3942; --raised: #202c33; --field: #2a3942; --field-line: #33454f;
  --wall: #0b141a; --dots-a: #ffffff0d; --dots-b: #ffffff06;
}
html[data-theme='dark'][data-wallpaper='sand'] { --wall: #29231a; }
html[data-theme='dark'][data-wallpaper='mint'] { --wall: #10281f; }
html[data-theme='dark'][data-wallpaper='sky'] { --wall: #0f212e; }
html[data-theme='dark'][data-wallpaper='rose'] { --wall: #2b1a1d; }
html[data-theme='dark'][data-wallpaper='lavender'] { --wall: #201b31; }
html[data-theme='dark'][data-wallpaper='slate'] { --wall: #1a2227; }
html[data-theme='dark'][data-wallpaper='plain'] { --wall: #141414; }
html[data-theme='dark'] .wallpaper-swatch { background-color: #0b141a; background-image: radial-gradient(#ffffff22 1px, transparent 1px); color: #e9edef; }
html[data-theme='dark'] .wallpaper-swatch[data-wallpaper='sand'] { background-color: #29231a; }
html[data-theme='dark'] .wallpaper-swatch[data-wallpaper='mint'] { background-color: #10281f; }
html[data-theme='dark'] .wallpaper-swatch[data-wallpaper='sky'] { background-color: #0f212e; }
html[data-theme='dark'] .wallpaper-swatch[data-wallpaper='rose'] { background-color: #2b1a1d; }
html[data-theme='dark'] .wallpaper-swatch[data-wallpaper='lavender'] { background-color: #201b31; }
html[data-theme='dark'] .wallpaper-swatch[data-wallpaper='slate'] { background-color: #1a2227; }
html[data-theme='dark'] .wallpaper-swatch[data-wallpaper='plain'] { background-color: #141414; }
html[data-theme='dark'].high-contrast { --muted: #c3ccd1; --line: #46565f; --body: #e9edef; }
html[data-theme='dark'].high-contrast input:not([type='checkbox']):not([type='radio']), html[data-theme='dark'].high-contrast select, html[data-theme='dark'].high-contrast .message-field, html[data-theme='dark'].high-contrast .tool-button { border-color: #6b7f8a; }
html[data-theme='dark'].high-contrast .message-bubble { box-shadow: 0 0 0 1px #ffffff40; }
html[data-theme='dark'].high-contrast .chat-list-item { border-bottom-color: #33454f; }

html[data-theme='dark'] body { background: linear-gradient(#0d2e28 0 116px, #0b141a 116px); }
html[data-theme='dark'] .boot { background: #0b141a; }
html[data-theme='dark'] .auth-card { background: var(--surface); box-shadow: 0 16px 60px #0008; }
html[data-theme='dark'] .auth-form .form-field label, html[data-theme='dark'] .auth-form .field-label, html[data-theme='dark'] .choice-field legend { color: var(--body); }
html[data-theme='dark'] .choice { border-color: var(--field-line); }
html[data-theme='dark'] .segment-control, html[data-theme='dark'] .language-switch { background: var(--raised); }
html[data-theme='dark'] .segment-control button, html[data-theme='dark'] .language-switch button { color: var(--muted); }
html[data-theme='dark'] .segment-control button.active, html[data-theme='dark'] .language-switch button.active { background: var(--field); color: var(--ink); box-shadow: none; }
html[data-theme='dark'] .app-shell { background: var(--surface); box-shadow: 0 12px 50px #0007; }
html[data-theme='dark'] .chat-sidebar { background: var(--surface); border-right-color: var(--line); }
html[data-theme='dark'] .chat-search { background: var(--raised); color: var(--muted); }
html[data-theme='dark'] .filter-chip { background: var(--raised); color: var(--muted); }
html[data-theme='dark'] .filter-chip.active { background: #0a3d33; color: #7ee2c3; }
html[data-theme='dark'] .chip-count { background: #ffffff1f; }
html[data-theme='dark'] .chat-list-item { background: var(--surface); border-bottom-color: #1b262c; }
html[data-theme='dark'] .chat-list-item:hover { background: var(--raised); }
html[data-theme='dark'] .chat-list-item.active { background: var(--field); }
html[data-theme='dark'] .unread-badge { background: var(--accent); color: #0b141a; }
html[data-theme='dark'] .notify-card { background: #182229; border-color: var(--field-line); }
html[data-theme='dark'] .sidebar-footer { background: var(--surface); }
html[data-theme='dark'] .avatar { background: #23423a; color: #9fe3cb; }
html[data-theme='dark'] .avatar.group { background: #2b3150; color: #b9c2f3; }
html[data-theme='dark'] .avatar.has-photo { background: var(--photo-back); }
html[data-theme='dark'] .call-person .avatar { background: #638973; color: white; }
html[data-theme='dark'] .incoming-card .avatar { background: #3d7a62; color: white; }
html[data-theme='dark'] .conversation-header { background: var(--raised); border-bottom-color: var(--line); }
html[data-theme='dark'] .chat-empty h3 { color: var(--ink); }
html[data-theme='dark'] .chat-empty p { color: var(--muted); }
html[data-theme='dark'] .day-label { background: #182229; color: var(--muted); box-shadow: none; }
html[data-theme='dark'] .system-line { background: #2a2614; color: #e8d48f; }
html[data-theme='dark'] .message-bubble { background: #202c33; color: var(--ink); box-shadow: 0 1px 1px #0006; }
html[data-theme='dark'] .message-bubble.incoming::before { border-top-color: #202c33; }
html[data-theme='dark'] .message-bubble.outgoing { background: #005c4b; }
html[data-theme='dark'] .message-bubble.outgoing::before { border-top-color: #005c4b; }
html[data-theme='dark'] .preview-bubble { background: #202c33; color: var(--ink); box-shadow: 0 1px 1px #0006; }
html[data-theme='dark'] .preview-bubble.incoming::before { border-top-color: #202c33; }
html[data-theme='dark'] .preview-bubble.outgoing { background: #005c4b; }
html[data-theme='dark'] .preview-bubble.outgoing::before { border-top-color: #005c4b; }
html[data-theme='dark'] .message-bubble.failed { background: #4a2323; }
html[data-theme='dark'] .message-bubble.failed::before { border-top-color: #4a2323; }
html[data-theme='dark'] .message-sender { color: #4fd1a5; }
html[data-theme='dark'] .message-meta { color: #ffffff99; }
html[data-theme='dark'] .message-original { border-top-color: #ffffff1f; color: #c3ccd1; }
html[data-theme='dark'] .message-translation { border-left-color: #3d8b6e; background: #ffffff0d; color: #d6eee3; }
html[data-theme='dark'] .message-bubble.outgoing .message-translation { background: #ffffff14; }
html[data-theme='dark'] .message-translation.explanation { border-left-color: #8f7fd1; background: #221d33; color: #dcd4f7; }
html[data-theme='dark'] .message-tools { border-top-color: #ffffff17; }
html[data-theme='dark'] .message-text.transcript { color: var(--body); }
html[data-theme='dark'] .composer { background: var(--raised); border-top-color: var(--line); }
html[data-theme='dark'] .tool-button, html[data-theme='dark'] .send-in-chip { background: var(--field); border-color: var(--field-line); color: var(--body); }
html[data-theme='dark'] .tool-button:hover { background: #33454f; color: var(--ink); }
html[data-theme='dark'] .tool-button.active, html[data-theme='dark'] .send-in-chip.active { background: #0a3d33; border-color: #1f6b55; color: #7ee2c3; }
html[data-theme='dark'] .tool-tray { background: var(--surface); border-color: var(--field-line); }
html[data-theme='dark'] .tool-panel > label, html[data-theme='dark'] .language-control label, html[data-theme='dark'] .assistant-toolbar label, html[data-theme='dark'] .form-field label, html[data-theme='dark'] .field-label { color: var(--body); }
html[data-theme='dark'] .draft-context { background: #12352b; color: #b5e0c7; }
html[data-theme='dark'] .message-field { background: var(--field); border-color: var(--field); }
html[data-theme='dark'] .round-button.voice { background: var(--field); border-color: var(--field-line); }
html[data-theme='dark'] .round-button.voice.working { background: var(--field); }
html[data-theme='dark'] .composer-foot { color: var(--muted); }
html[data-theme='dark'] .translation-preview { background: #182229; border-color: var(--field-line); }
html[data-theme='dark'] .preview-label { color: #9fd0b7; }
html[data-theme='dark'] #preview-empty { color: var(--muted); }
html[data-theme='dark'] .preview-text { color: var(--ink); }
html[data-theme='dark'] .sample-pills button { background: #182229; border-color: var(--field-line); color: #9fd0b7; }
html[data-theme='dark'] .assistant-result { background: #182229; border-color: var(--field-line); color: var(--ink); }
html[data-theme='dark'] .reminder-item strong { color: var(--ink); }
html[data-theme='dark'] .reminder-empty { color: var(--muted); }
html[data-theme='dark'] .icon-button { color: #aebac1; }
html[data-theme='dark'] .icon-button:hover { background: var(--field); color: var(--ink); }
html[data-theme='dark'] .primary-button, html[data-theme='dark'] .round-button.send, html[data-theme='dark'] .voice-play, html[data-theme='dark'] .photo-edit { color: #0b141a; }
html[data-theme='dark'] .primary-button.danger-fill { color: #1a0d0b; }
html[data-theme='dark'] .secondary-button { background: var(--raised); border-color: var(--field-line); color: #7ee2c3; }
html[data-theme='dark'] .secondary-button:hover:not(:disabled) { background: var(--field); border-color: var(--field-line); }
html[data-theme='dark'] input:not([type='checkbox']):not([type='radio']), html[data-theme='dark'] select, html[data-theme='dark'] .message-input { background-color: var(--field); border-color: var(--field-line); color: var(--ink); }
html[data-theme='dark'] input::placeholder, html[data-theme='dark'] textarea::placeholder { color: #8696a0; }
html[data-theme='dark'] .notice { background: #2b2616; border-color: #4d3f1a; color: #f0d58c; }
html[data-theme='dark'] .safety-banner { background: #2b2616; border-color: #4d3f1a; color: #f0d58c; }
html[data-theme='dark'] .reaction-chip { border-color: #ffffff26; background: #ffffff14; }
html[data-theme='dark'] .reaction-choice:hover, html[data-theme='dark'] .reaction-choice.chosen { background: #ffffff1f; }
html[data-theme='dark'] .message-quote, html[data-theme='dark'] .reply-bar { background: #ffffff12; }
html[data-theme='dark'] .message-quote strong, html[data-theme='dark'] .reply-copy strong { color: var(--accent); }
html[data-theme='dark'] .message-deleted, html[data-theme='dark'] .blocked-bar, html[data-theme='dark'] .report-quote { color: var(--muted); }
html[data-theme='dark'] .notice[role='alert'], html[data-theme='dark'] .notice.error { background: #3a1f1c; border-color: #5c2e27; color: #f6c0b5; }
html[data-theme='dark'] .status-pill { background: #182229; border-color: var(--field-line); color: var(--muted); }
html[data-theme='dark'] .status-pill.connected { background: #0f2e27; border-color: #1f5a49; color: #7ee2c3; }
html[data-theme='dark'] .status-pill.offline { background: #2b2616; border-color: #4d3f1a; color: #e6c07b; }
html[data-theme='dark'] dialog:not(.call-dialog) { background: var(--surface); border-color: var(--line); color: var(--body); box-shadow: 0 18px 90px #000a; }
html[data-theme='dark'] dialog::backdrop { background: #000000a6; }
html[data-theme='dark'] button.person-row:hover, html[data-theme='dark'] label.person-row:hover { background: var(--raised); }
html[data-theme='dark'] .invite-card { background: #182229; border-color: var(--field-line); }
html[data-theme='dark'] .invite-card.result { background: #0f2e27; border-color: #1f5a49; }
html[data-theme='dark'] #invite-link { background: var(--field); color: var(--ink); }
html[data-theme='dark'] .family-row { border-bottom-color: var(--line); }
html[data-theme='dark'] .recording-bar { background: #2b1b19; border-color: #5c2e27; color: #f6c0b5; }
html[data-theme='dark'] .photo-preview { background: var(--surface); border-color: var(--field-line); }
html[data-theme='dark'] .photo-preview img, html[data-theme='dark'] .message-photo { background: var(--raised); }
html[data-theme='dark'] .voice-bar { background: #3b4a54; }
html[data-theme='dark'] .message-bubble.outgoing .voice-bar { background: #2e7d6b; }
html[data-theme='dark'] .voice-time { color: #aebac1; }
html[data-theme='dark'] .catchup-card { background: #1a1726; border-bottom-color: #2f2a45; color: #dcd4f7; }
html[data-theme='dark'] .medicine-empty { border-color: var(--field-line); color: var(--muted); }
html[data-theme='dark'] .medicine-card, html[data-theme='dark'] .medicine-row { background: #182229; border-color: var(--field-line); }
html[data-theme='dark'] .medicine-row .form-field.unsure { background: #3a2f12; box-shadow: inset 0 0 0 1px #c8961f; }
html[data-theme='dark'] .unsure-note { color: #f2c66d; }
html[data-theme='dark'] .medicine-head small, html[data-theme='dark'] .medicine-notes, html[data-theme='dark'] .dose-heading { color: #aebac1; }
html[data-theme='dark'] .dose { background: var(--raised); }
html[data-theme='dark'] .dose.status-taken { background: #0f2e27; color: #7ee2c3; }
html[data-theme='dark'] .dose.status-missed { background: #3a1f1c; color: #f6c0b5; }
html[data-theme='dark'] .dose.status-due, html[data-theme='dark'] .dose.status-snoozed { background: #2b2616; color: #f0d58c; }
html[data-theme='dark'] .dose.status-skipped { color: var(--muted); }
html[data-theme='dark'] .time-item { background: var(--field); border-color: var(--field-line); }
html[data-theme='dark'] .medicine-due { background: #2b2616; border-color: #8a6d2b; color: #f0d58c; }
html[data-theme='dark'] .medicine-due-copy small { color: #c9b27a; }
html[data-theme='dark'] .call-header-actions .icon-button { color: var(--accent); }
html[data-theme='dark'] .call-banner { background: #0f2e27; border-bottom-color: #1f5a49; color: #7ee2c3; }
html[data-theme='dark'] .brand-mark, html[data-theme='dark'] .welcome-mark { background: #0a8f74; color: white; }
html[data-theme='dark'] .toast { background: #2a3942; color: var(--ink); box-shadow: 0 5px 25px #0008; }
html[data-theme='dark'] .toast.error { background: #6b2f26; color: #ffe6df; }
html[data-theme='dark'] .info-about { background: var(--raised); }

/* 0.19: menus, videos and documents, the chat list's new rows, search, and calls in the dark theme. */
html[data-theme='dark'] .tool-menu, html[data-theme='dark'] .attach-preview { background: var(--surface); border-color: var(--field-line); box-shadow: 0 12px 34px #000a; }
html[data-theme='dark'] .tool-menu button, html[data-theme='dark'] .option-row, html[data-theme='dark'] .list-heading, html[data-theme='dark'] .search-result, html[data-theme='dark'] .call-open { color: var(--ink); }
html[data-theme='dark'] .tool-menu button:hover, html[data-theme='dark'] .tool-menu button:focus-visible, html[data-theme='dark'] .option-row:hover { background: var(--raised); }
html[data-theme='dark'] .tool-menu button.active { background: #0a3d33; color: #7ee2c3; }
html[data-theme='dark'] .file-card, html[data-theme='dark'] .message-file { background: #ffffff12; }
html[data-theme='dark'] .message-file:hover { background: #ffffff1c; }
html[data-theme='dark'] .list-heading, html[data-theme='dark'] .search-result, html[data-theme='dark'] .call-row { background: var(--surface); border-bottom-color: #1b262c; }
html[data-theme='dark'] .list-heading:hover, html[data-theme='dark'] .search-result:hover { background: var(--raised); }
html[data-theme='dark'] .search-result small { color: var(--body); }
html[data-theme='dark'] .list-section { color: var(--accent); }
html[data-theme='dark'] mark { background: #6b5a12; color: var(--ink); }
html[data-theme='dark'] .latest-pill { background: var(--raised); border-color: var(--field-line); color: #7ee2c3; box-shadow: 0 4px 14px #0008; }
html[data-theme='dark'] .unread-badge.muted { background: #4b5a62; color: var(--ink); }
html[data-theme='dark'] .chat-flag { color: var(--muted); }