/* ==========================================================================
   UI v2 (14. 10. 2026) - svetly firemni vzhled podle _emailovky-redesign-2026-10/brief.md
   a pripominek art directora (kontrast, jedno plne tlacitko, stavy, pristrojovy box).
   Nacita se JEN s instance.php 'ui' => 'v2' (index.php: <html class="ui2">), vsechno je
   scopovane na html.ui2. Rollback = smazat radek 'ui' z instance.php.
   Layout: >= 1100 px sidebar 240 + seznam 400 + detail; 760-1099 px sidebar 72 + seznam 340
   + detail; < 760 px mobil se spodni listou.
   ========================================================================== */
html.ui2 {
  --b500: #4dbab6; --b600: #3a9e9a; --b700: #2c7f7c; --b800: #24706d; --b50: #e9f7f6; --b100: #cfeeec; --bink: #1f5f5d;
  --g0: #ffffff; --g50: #f5f7f7; --g100: #eef1f1; --g200: #e2e7e7; --g300: #cfd6d6; --g500: #6e7a79; --g700: #46514f; --g900: #1a2020;
  --ok: #2e8b57; --ok-ink: #1f6b3f; --ok-bg: #e8f5ee; --warn: #c7811a; --warn-ink: #8c4815; --warn-bg: #fdf3e3; --err: #c9403c; --err-bg: #fbeaea; --info: #3b6fa0; --info-bg: #e9f0f8;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --sw: 0px; --lw: 100%; --tbh: calc(60px + env(safe-area-inset-bottom, 0px));
  /* tokeny puvodniho vzhledu prepnute na svetly motiv (style.css / theme.css / cc-thread.css je pouzivaji) */
  --bg: var(--g50); --bg-raise: var(--g0); --surface: var(--g0); --surface-2: var(--g50);
  --line: var(--g200); --line-strong: var(--g300);
  --ink: var(--g900); --ink-rgb: 22,28,28; --muted: var(--g500); --text: var(--g900);
  --accent: var(--b700); --accent-rgb: 44,127,124; --accent-deep: var(--b800); --accent-soft: var(--b700); --accent-soft-rgb: 44,127,124;
  --accent-2: var(--b700); --accent2-rgb: 44,127,124; --accent2-soft: var(--b700); --accent2-deep: var(--b800);
  --on-accent: #ffffff; --danger: var(--err);
  color-scheme: light;
}
@media (min-width: 760px) { html.ui2 { --sw: 72px; --lw: 340px; } }
@media (min-width: 1100px) { html.ui2 { --sw: 240px; --lw: 400px; } }
html.ui2 .modal-cc-thread, html.ui2 .modal-cc-runlog {
  --cct-ink: 22,28,28; --cct-panel: #ffffff; --cct-panel-2: #ffffff;
  --cct-teal: 44,127,124; --cct-violet: 44,127,124; --cct-amber: 178,111,14; --cct-green: 46,139,87; --cct-red: 201,64,60;
}

/* ---------- zaklad ---------- */
html.ui2, html.ui2 body { background: var(--g50) !important; color: var(--g900); }
html.ui2 body, html.ui2 button, html.ui2 input, html.ui2 textarea, html.ui2 select { font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif; }
html.ui2 body { font-size: 14px; line-height: 20px; letter-spacing: 0; }
html.ui2 .bg-orbs, html.ui2 .orb { display: none !important; }
html.ui2 #usage-topbar .usage-track { background: var(--g100); }
html.ui2 *:focus-visible { outline: 2px solid var(--b500) !important; outline-offset: 2px; }
html.ui2 .muted, html.ui2 .status-line { color: var(--g500) !important; }
html.ui2 ::placeholder { color: var(--g500) !important; opacity: 1; }
html.ui2 .hidden { display: none !important; }
html.ui2 .ui2-hide { display: none !important; }
html.ui2 .glass { background: var(--g0) !important; border: 1px solid var(--g200) !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
html.ui2 a { color: var(--b700); }
html.ui2 .ui2-svg { flex: none; display: block; }

/* ikony v ::before (data-i nastavuje ui2.js) */
html.ui2 [data-i]::before {
  content: ""; flex: none; width: 16px; height: 16px; display: inline-block; vertical-align: -3px; background: currentColor;
  -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat;
}
html.ui2 [data-i]:not(.ui2-ionly)::before { margin-right: 8px; }
html.ui2 .ui2-ionly { font-size: 0 !important; display: inline-flex !important; align-items: center; justify-content: center; }
html.ui2 .ui2-ionly::before { width: 18px; height: 18px; margin: 0 !important; }

/* ---------- tlacitka ---------- */
html.ui2 .btn, html.ui2 .ui2-btn, html.ui2 .co-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 36px; padding: 0 14px; border-radius: 8px !important; font: 500 14px/20px "Inter", system-ui, sans-serif !important;
  background: var(--g0) !important; color: var(--g900) !important; border: 1px solid var(--g300) !important; box-shadow: none !important;
  cursor: pointer; text-decoration: none; white-space: nowrap; transition: background .12s, border-color .12s;
}
html.ui2 .btn:hover, html.ui2 .ui2-btn:hover, html.ui2 .co-btn:hover { background: var(--g50) !important; border-color: var(--g500) !important; filter: none !important; }
html.ui2 .btn:disabled { opacity: .55; }
/* JEDINE plne tlacitko: #2c7f7c + bily text (kontrast 4,9:1). Plne jsou jen akce, ktere to opravdu maji byt. */
html.ui2 #btn-cc-from-email, html.ui2 #dr-send, html.ui2 #cmp-send, html.ui2 #re-save, html.ui2 #kbe-save, html.ui2 #hbe-save,
html.ui2 #kbft-save-me, html.ui2 #dr-redo-send, html.ui2 #slt-reply-send, html.ui2 #dp-save-here, html.ui2 #pf-act-create, html.ui2 #secret-save,
html.ui2 .co-overlay .co-btn:not(.ghost):not(.danger):not(.sm) {
  background: var(--b700) !important; color: #fff !important; border-color: var(--b700) !important; font-weight: 600 !important;
}
html.ui2 #btn-cc-from-email:hover, html.ui2 #dr-send:hover, html.ui2 #cmp-send:hover, html.ui2 #re-save:hover, html.ui2 #kbe-save:hover,
html.ui2 #hbe-save:hover, html.ui2 #kbft-save-me:hover, html.ui2 #dr-redo-send:hover, html.ui2 #slt-reply-send:hover, html.ui2 #dp-save-here:hover,
html.ui2 #pf-act-create:hover, html.ui2 #secret-save:hover, html.ui2 .co-overlay .co-btn:not(.ghost):not(.danger):not(.sm):hover { background: var(--b800) !important; border-color: var(--b800) !important; }
html.ui2 .btn-danger-ghost, html.ui2 .co-btn.danger { color: var(--err) !important; border-color: #e7b9b7 !important; }
html.ui2 .ui2-btn-o { color: var(--bink) !important; border-color: var(--b500) !important; }
html.ui2 .ui2-btn-o:hover { background: var(--b50) !important; border-color: var(--b700) !important; }
html.ui2 .ui2-ib, html.ui2 .iconbtn {
  width: 36px; height: 36px; min-width: 36px; padding: 0; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center;
  background: transparent !important; border: 1px solid transparent !important; color: var(--g700) !important; cursor: pointer; position: relative;
}
html.ui2 .ui2-ib:hover, html.ui2 .iconbtn:hover { background: var(--g100) !important; color: var(--g900) !important; }
html.ui2 .ui2-ib:disabled { opacity: .35; cursor: default; }
html.ui2 .link-btn, html.ui2 .ui2-link { background: none !important; border: 0 !important; color: var(--b700) !important; font-weight: 500 !important; padding: 4px 0 !important; min-height: 0; }
@media (pointer: coarse) { html.ui2 .ui2-ib, html.ui2 .iconbtn { width: 44px; height: 44px; min-width: 44px; } html.ui2 .btn, html.ui2 .ui2-btn { min-height: 44px; } }

/* formulare */
html.ui2 input:not([type]), html.ui2 input[type="text"], html.ui2 input[type="email"], html.ui2 input[type="password"], html.ui2 input[type="search"], html.ui2 input[type="number"], html.ui2 input[type="date"], html.ui2 input[type="time"],
html.ui2 textarea, html.ui2 select, html.ui2 .co-field input, html.ui2 .co-field textarea, html.ui2 .co-field select, html.ui2 .co-input {
  background: var(--g0) !important; color: var(--g900) !important; border: 1px solid var(--g300) !important; border-radius: 8px !important; box-shadow: none !important;
}
html.ui2 input:focus, html.ui2 textarea:focus, html.ui2 select:focus { border-color: var(--b500) !important; box-shadow: 0 0 0 3px rgba(77,186,182,.22) !important; outline: none !important; }
html.ui2 .field > span, html.ui2 .field-label, html.ui2 .co-field { color: var(--g700); }
html.ui2 .field > span, html.ui2 .field-label { font-size: 12px; font-weight: 500; text-transform: none; letter-spacing: 0; }

/* ---------- stavove pilulky (jedina definice) ---------- */
html.ui2 .status-pill[class*="status-"] {
  display: inline-flex; align-items: center; gap: 6px; height: 22px; padding: 0 9px !important; border-radius: 999px !important;
  font-size: 0 !important; letter-spacing: 0 !important; border: 0 !important; box-shadow: none !important; text-transform: none !important;
}
html.ui2 .status-pill[class*="status-"]::before { content: none !important; }
html.ui2 .status-pill[class*="status-"]::after { font: 600 11px/14px "Inter", system-ui, sans-serif; letter-spacing: .02em; }
html.ui2 .status-pill.status-awaiting_user { background: var(--warn-bg) !important; color: var(--warn-ink) !important; }
html.ui2 .status-pill.status-awaiting_user::after { content: "Čeká na vás"; }
html.ui2 .status-pill.status-draft_email { background: var(--b50) !important; color: var(--bink) !important; }
html.ui2 .status-pill.status-draft_email::after { content: "Draft připraven"; }
html.ui2 .status-pill.status-pending, html.ui2 .status-pill.status-in_progress, html.ui2 .status-pill.status-user_replied { background: var(--info-bg) !important; color: var(--info) !important; }
html.ui2 .status-pill.status-pending::after, html.ui2 .status-pill.status-in_progress::after, html.ui2 .status-pill.status-user_replied::after { content: "AI pracuje"; }
html.ui2 .status-pill.status-completed { background: var(--ok-bg) !important; color: var(--ok-ink) !important; }
html.ui2 .status-pill.status-completed::after { content: "Hotovo"; }
html.ui2 .status-pill.status-cancelled { background: var(--g100) !important; color: var(--g500) !important; }
html.ui2 .status-pill.status-cancelled::after { content: "Zrušeno"; }
html.ui2 .status-pill.status-new, html.ui2 .status-pill.status-active { font-size: 11px !important; background: var(--g100) !important; color: var(--g700) !important; }
html.ui2 .ui2-sti { display: inline-flex; align-items: center; justify-content: center; flex: none; }
html.ui2 .ui2-st-wait { color: var(--warn); } html.ui2 .ui2-st-draft { color: var(--b700); } html.ui2 .ui2-st-work { color: var(--info); }
html.ui2 .ui2-st-done { color: var(--ok); } html.ui2 .ui2-st-off { color: var(--g500); } html.ui2 .ui2-st-err { color: var(--err); }
html.ui2 .ui2-st-work .ui2-svg { animation: ui2-pulse 1.6s ease-in-out infinite; }
@keyframes ui2-pulse { 50% { opacity: .45; } }

/* ---------- avatary ---------- */
html.ui2 .ui2-av {
  width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex: none;
  background: hsl(var(--av-h, 180), 28%, 90%); color: hsl(var(--av-h, 180), 32%, 28%); font: 600 11px/1 "Inter", system-ui, sans-serif; letter-spacing: .02em;
}
html.ui2 .ui2-av-ai { background: var(--b500); color: #fff; }
html.ui2 .ui2-av-sys { background: var(--g100); color: var(--g500); }

/* ---------- sidebar / spodni lista ---------- */
html.ui2 .tabbar {
  position: fixed !important; z-index: 150 !important; display: flex !important; margin: 0 !important; border-radius: 0 !important;
  background: var(--g0) !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html.ui2 .tabbar::before, html.ui2 .tabbar::after { content: none !important; display: none !important; }
html.ui2 .tabbar .tab .tab-ico { font-size: 0 !important; background: none !important; -webkit-mask: none !important; mask: none !important; width: auto !important; height: auto !important; display: inline-flex !important; }
html.ui2 .tabbar .tab { color: var(--g500) !important; background: transparent !important; box-shadow: none !important; }
html.ui2 .tabbar .tab.active, html.ui2 .tabbar .tab.active .tab-lbl { color: var(--b700) !important; }
html.ui2 .tabbar .tab-badge {
  position: absolute; min-width: 18px; height: 18px; line-height: 18px; padding: 0 5px; border-radius: 9px; box-shadow: none !important;
  background: var(--b700) !important; color: #fff !important; font: 600 11px/18px "Inter", system-ui, sans-serif !important; text-align: center;
}
html.ui2 .ui2-nav { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 40px; padding: 0 12px; border: 0; border-radius: 8px; background: none; color: var(--g700); font: 500 14px/20px "Inter", system-ui, sans-serif; cursor: pointer; text-align: left; }
html.ui2 .ui2-nav:hover { background: var(--g50); color: var(--g900); }
html.ui2 .ui2-nav.active { background: var(--b50); color: var(--bink); }
html.ui2 .ui2-nav.active .ui2-svg { color: var(--b700); }
html.ui2 .ui2-side-h { font: 600 11px/14px "Inter", system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--g500); padding: 16px 12px 6px; }
html.ui2:not(.ui2-admin) .ui2-admin-only { display: none !important; }
html.ui2 .ui2-side-fill { flex: 1 1 auto; }
html.ui2 .ui2-brand { height: 56px; display: flex; align-items: center; padding: 0 12px 8px; }
html.ui2 .ui2-brand-logo { display: none; width: 150px; height: 22px; }
html.ui2.has-brand-logo .ui2-brand-logo { display: block; background: var(--g900); -webkit-mask: var(--brand-logo) left center / contain no-repeat; mask: var(--brand-logo) left center / contain no-repeat; }
html.ui2.has-brand-logo.ui2-logo-light .ui2-brand-logo { background: var(--ui2-logo) left center / contain no-repeat; -webkit-mask: none; mask: none; }
html.ui2.has-brand-logo .ui2-brand-name { display: none; }
html.ui2 .ui2-brand-name { font: 600 18px/24px "Inter", system-ui, sans-serif; color: var(--g900); }
html.ui2 .ui2-user { display: flex; align-items: center; gap: 10px; width: 100%; margin-top: 8px; padding: 12px 8px; border: 0; border-top: 1px solid var(--g200); background: none; color: var(--g500); cursor: pointer; text-align: left; border-radius: 0; }
html.ui2 .ui2-user:hover, html.ui2 .ui2-user.active { background: var(--g50); }
html.ui2 .ui2-user-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; }
html.ui2 .ui2-user-txt b { font: 600 14px/20px "Inter", system-ui, sans-serif; color: var(--g900); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.ui2 .ui2-user-txt small { font-size: 12px; line-height: 16px; color: var(--g500); }
html.ui2 .ui2-user .ui2-av { width: 32px; height: 32px; font-size: 12px; }

@media (min-width: 760px) {
  html.ui2 .tabbar {
    left: 0 !important; top: 0 !important; bottom: 0 !important; right: auto !important; width: var(--sw) !important;
    flex-direction: column !important; justify-content: flex-start !important; align-items: stretch; gap: 2px !important;
    padding: 12px 12px 8px !important; border: 0 !important; border-right: 1px solid var(--g200) !important; overflow-y: auto;
  }
  html.ui2 .tabbar .tab {
    flex: 0 0 auto !important; flex-direction: row !important; justify-content: flex-start !important; gap: 12px !important;
    min-height: 40px !important; height: 40px; padding: 0 12px !important; border-radius: 8px !important; width: 100%; transform: none !important;
  }
  html.ui2 .tabbar .tab:hover { background: var(--g50) !important; color: var(--g900) !important; }
  html.ui2 .tabbar .tab.active { background: var(--b50) !important; color: var(--b700) !important; }
  html.ui2 .tabbar .tab .tab-lbl { font: 500 14px/20px "Inter", system-ui, sans-serif !important; color: var(--g700); letter-spacing: 0 !important; }
  html.ui2 .tabbar .tab.active .tab-lbl { color: var(--bink) !important; }
  html.ui2 .tabbar .tab-badge { position: static !important; transform: none !important; margin-left: auto; background: var(--g100) !important; color: var(--g900) !important; }
  html.ui2 .tabbar .tab.active .tab-badge, html.ui2 #tab-cc .tab-badge { background: var(--b700) !important; color: #fff !important; }
  html.ui2 #tab-more { display: none !important; }
  html.ui2 .ui2-side-extra { display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; }
  html.ui2 .ui2-side-sec { display: flex; flex-direction: column; gap: 2px; margin-top: 12px; border-top: 1px solid var(--g200); }
  html.ui2 .ui2-mob { display: none !important; }
}
/* tablet: sidebar jen ikony */
@media (min-width: 760px) and (max-width: 1099px) {
  html.ui2 .tabbar { padding: 12px 10px 8px !important; }
  html.ui2 .tabbar .tab .tab-lbl, html.ui2 .ui2-nav span, html.ui2 .ui2-side-h, html.ui2 .ui2-user-txt, html.ui2 .ui2-user > .ui2-svg, html.ui2 .ui2-brand { display: none !important; }
  html.ui2 .tabbar .tab, html.ui2 .ui2-nav { justify-content: center !important; padding: 0 !important; }
  html.ui2 .tabbar .tab-badge { position: absolute !important; top: 2px; right: 2px; margin: 0; }
  html.ui2 .ui2-user { justify-content: center; padding: 12px 0; }
  html.ui2 .ui2-desk span { display: none; }
}
@media (max-width: 759px) {
  html.ui2 .ui2-side, html.ui2 .ui2-desk { display: none !important; }
  html.ui2 .tabbar {
    left: 0 !important; right: 0 !important; bottom: 0 !important; top: auto !important; height: var(--tbh); width: auto !important;
    flex-direction: row !important; padding: 4px 4px env(safe-area-inset-bottom, 0px) !important; border: 0 !important; border-top: 1px solid var(--g200) !important;
  }
  html.ui2 body.modal-open .tabbar { display: flex !important; }
  html.ui2 .tabbar .tab { min-height: 52px !important; flex: 1 1 0; gap: 2px !important; padding: 4px 2px !important; border-radius: 8px; }
  html.ui2 .tabbar .tab .tab-lbl { font: 500 11px/14px "Inter", system-ui, sans-serif !important; color: inherit !important; }
  html.ui2 .tabbar .tab.active { background: transparent !important; }
  html.ui2 .tabbar .tab.active { color: var(--b700) !important; }
  html.ui2 .tabbar .tab.active .tab-lbl { font-weight: 600 !important; color: var(--bink) !important; }
  html.ui2 .tabbar .tab-badge { top: 2px !important; left: 50% !important; right: auto !important; transform: translateX(4px) !important; }
}

/* ---------- prostredni sloupec: Schranka ---------- */
html.ui2 .topbar { display: none !important; }
html.ui2 #view-app { padding-left: var(--sw); background: var(--g50); }
html.ui2 #view-app > #ui2-listhead, html.ui2 #view-app > #searchbar, html.ui2 #view-app > #ui2-chips, html.ui2 #view-app > .content {
  width: var(--lw); max-width: none; margin: 0; background: var(--g0); border-right: 1px solid var(--g200);
}
html.ui2 .ui2-colhead { padding: 16px 16px 8px; flex: none; }
html.ui2 .ui2-ch-top { display: flex; align-items: center; gap: 8px; min-height: 40px; }
html.ui2 .ui2-title { margin: 0; flex: 1 1 auto; font: 600 20px/28px "Inter", system-ui, sans-serif; color: var(--g900); letter-spacing: -0.01em; }
html.ui2 .ui2-ch-act { display: flex; align-items: center; gap: 4px; }
html.ui2 .ui2-ch-row { margin-top: 10px; display: flex; gap: 8px; }
html.ui2 .ui2-acct {
  display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 10px; max-width: 100%; flex: 1 1 auto;
  border: 1px solid var(--g300); border-radius: 8px; background: var(--g0); color: var(--g700); position: relative; cursor: pointer;
}
html.ui2 .ui2-acct:hover { border-color: var(--g500); }
html.ui2 .ui2-acct select { appearance: none; -webkit-appearance: none; border: 0 !important; box-shadow: none !important; background: transparent !important; padding: 0 !important; height: 34px; flex: 1 1 auto; min-width: 0; font: 500 14px/20px "Inter", system-ui, sans-serif; color: var(--g900) !important; cursor: pointer; }
html.ui2 .ui2-acct select:focus { box-shadow: none !important; }
html.ui2 .ui2-acct:focus-within { border-color: var(--b500); box-shadow: 0 0 0 3px rgba(77,186,182,.22); }
html.ui2 .ui2-tts .fab-badge { position: absolute; top: 2px; right: 2px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: var(--b700); color: #fff; font: 600 10px/16px "Inter", system-ui, sans-serif; }
html.ui2 #fab-tts-new { position: relative !important; right: auto !important; bottom: auto !important; box-shadow: none !important; }
html.ui2 #fab-tts-new.hidden { display: none !important; }
html.ui2 #searchbar { display: flex; align-items: center; gap: 4px; padding: 0 16px 8px !important; margin: 0 !important; border: 0 !important; border-radius: 0 !important; position: relative !important; top: auto !important; box-shadow: none !important; max-width: none; z-index: 2; flex: none; }
html.ui2 #search-input { color: var(--g900) !important; }
html.ui2 #searchbar input { flex: 1; height: 36px; min-height: 36px; padding: 0 12px 0 34px !important; font-size: 14px; background: var(--g50) !important; border-color: var(--g200) !important; }
html.ui2 .ui2-search-ico { position: absolute; left: 28px; top: 10px; color: var(--g500); pointer-events: none; }
@media (min-width: 760px) { html.ui2 #searchbar.hidden { display: flex !important; } html.ui2 #search-close { display: none !important; } }
html.ui2 .ui2-chips { display: flex; gap: 6px; padding: 0 16px 10px; flex: none; overflow-x: auto; scrollbar-width: none; }
html.ui2 .ui2-chip {
  display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--g200);
  background: var(--g0); color: var(--g700); font: 500 13px/18px "Inter", system-ui, sans-serif; cursor: pointer; white-space: nowrap;
}
html.ui2 .ui2-chip:hover { border-color: var(--g300); background: var(--g50); }
html.ui2 .ui2-chip.on { background: var(--b50); color: var(--bink); border-color: var(--b100); font-weight: 600; }
html.ui2 .ui2-chip i { font-style: normal; font-size: 11px; color: var(--g500); }
html.ui2 .ui2-chip i:empty { display: none; }
html.ui2 .content { padding: 0 !important; flex: 1 1 auto; overflow-y: auto; border-top: 1px solid var(--g200); }
html.ui2 #inbox-status { display: none; }
html.ui2 .list { gap: 0 !important; }
html.ui2 .status-line { padding: 16px; font-size: 13px; }
html.ui2 .fab { display: none !important; }
html.ui2 .app-loader { padding: 40px 0; }

/* radek mailu (mockup A) */
html.ui2 .email-item {
  position: relative; display: grid !important; grid-template-columns: 32px minmax(0, 1fr); column-gap: 12px; row-gap: 2px;
  padding: 12px 16px 12px 16px !important; margin: 0 !important; border-radius: 0 !important; background: var(--g0) !important;
  border: 0 !important; border-bottom: 1px solid var(--g200) !important; border-left: 3px solid transparent !important; box-shadow: none !important;
  transform: none !important; cursor: pointer; color: var(--g900);
}
html.ui2 .email-item:hover { background: var(--g50) !important; }
html.ui2 .email-item.ui2-sel { background: var(--b50) !important; border-left-color: var(--b500) !important; }
html.ui2 .email-item::before { content: none !important; }
html.ui2 .email-item.unread::after { content: ""; position: absolute; left: 6px; top: 22px; width: 6px; height: 6px; border-radius: 50%; background: var(--b500); }
html.ui2 .email-item > .ui2-av { grid-row: 1 / span 4; margin-top: 2px; width: 32px; height: 32px; }
html.ui2 .email-item .ei-row1 { grid-column: 2; display: flex; align-items: center; gap: 8px; min-width: 0; margin: 0 !important; }
html.ui2 .email-item .ei-from { flex: 1 1 auto; min-width: 0; font: 400 14px/20px "Inter", system-ui, sans-serif !important; color: var(--g900) !important; gap: 6px; }
html.ui2 .email-item.unread .ei-from { font-weight: 600 !important; }
html.ui2 .email-item .ei-date { font: 400 12px/16px "Inter", system-ui, sans-serif; color: var(--g500) !important; font-variant-numeric: tabular-nums; }
html.ui2 .email-item .ei-subject { grid-column: 2; font: 400 14px/20px "Inter", system-ui, sans-serif !important; color: var(--g900) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0 !important; }
html.ui2 .email-item .ei-summary {
  grid-column: 2; margin: 6px 0 0 !important; padding: 6px 10px 6px 8px !important; border-left: 3px solid var(--b500); border-radius: 0 6px 6px 0;
  background: var(--b50) !important; color: var(--g700) !important; font: 400 13px/18px "Inter", system-ui, sans-serif !important;
  padding-bottom: 0 !important; border-bottom: 6px solid var(--b50); max-height: 48px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; white-space: normal !important;
}
html.ui2 .ui2-ai { display: inline-block; margin-right: 6px; font: 600 11px/14px "Inter", system-ui, sans-serif; color: var(--bink); letter-spacing: .04em; }
html.ui2 .email-item .acct-badge { padding: 0 !important; text-align: center; opacity: 1; box-shadow: none !important; }
html.ui2 .email-item .fwd-label { font-size: 12px; color: var(--g500); margin-left: 6px; }
html.ui2 .email-item .cc-indicator { position: static !important; width: auto; height: 20px; min-width: 0; border: 0 !important; padding: 0 8px !important; box-shadow: none !important; display: inline-flex; align-items: center; cursor: pointer; border-radius: 999px !important; font: 600 11px/14px "Inter", system-ui, sans-serif !important; white-space: nowrap; transform: none !important; }
html.ui2 .ui2-pill-wait { background: var(--warn-bg) !important; color: var(--warn-ink) !important; }
html.ui2 .ui2-pill-work { background: var(--info-bg) !important; color: var(--info) !important; }
html.ui2 .ui2-pill-draft { background: var(--b50) !important; color: var(--bink) !important; }
html.ui2 .ui2-pill-done { background: var(--ok-bg) !important; color: var(--ok-ink) !important; }
html.ui2 .ui2-pill-off { background: var(--g100) !important; color: var(--g500) !important; }
html.ui2 .email-item .ei-row-actions { grid-column: 2; display: flex; gap: 4px; margin: 6px 0 0 !important; }
html.ui2 .email-item .mini-btn {
  width: 32px; height: 32px; min-width: 32px; padding: 0 !important; border-radius: 8px !important; color: var(--g700) !important;
  background: var(--g0) !important; border: 1px solid var(--g200) !important;
}
html.ui2 .email-item .mini-btn:hover { background: var(--b50) !important; border-color: var(--b500) !important; color: var(--bink) !important; }
html.ui2 .mini-arch::after { content: none !important; }
/* akce radku: desktop = na hover vpravo nahore v 1. radku (cas se schova), mobil = tlacitko ... nebo dlouhy stisk */
html.ui2 .email-item .ei-row-actions { position: absolute; right: 10px; top: 6px; margin: 0 !important; padding: 2px; border-radius: 8px; background: var(--g0); box-shadow: 0 1px 6px rgba(22,28,28,.14); display: none !important; z-index: 2; }
@media (hover: hover) and (pointer: fine) {
  html.ui2 .email-item:hover .ei-row-actions, html.ui2 .email-item:focus-within .ei-row-actions { display: flex !important; }
  html.ui2 .email-item:hover .ei-date, html.ui2 .email-item:hover .ei-row1 > .cc-indicator { visibility: hidden; }
  html.ui2 .ui2-rowmore { display: none !important; }
}
html.ui2 .ui2-rowmore { flex: none; width: 32px; height: 28px; margin: -4px -8px -4px 0; border: 0; background: none; color: var(--g500); border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; }
@media (pointer: coarse) { html.ui2 .ui2-rowmore { width: 40px; height: 36px; margin: -8px -10px -8px -2px; } }
html.ui2 #inbox-list.ui2-f-unread .email-item:not(.unread) { display: none !important; }
html.ui2 #inbox-list.ui2-f-wait .email-item:not(.ui2-row-wait):not(.ui2-row-draft) { display: none !important; }
/* vysledky hledani (stejny radek bez avataru) */
html.ui2 .email-item:not([data-ui2]) { display: block !important; }

/* prazdny pravy panel */
html.ui2 #ui2-empty { display: none; }
@media (min-width: 760px) {
  html.ui2 #ui2-empty { display: flex; position: fixed; left: calc(var(--sw) + var(--lw)); right: 0; top: 0; bottom: 0; align-items: center; justify-content: center; text-align: center; color: var(--g500); z-index: 1; pointer-events: none; }
  html.ui2 #ui2-empty .ui2-svg { margin: 0 auto 12px; color: var(--g300); }
  html.ui2 #ui2-empty p { margin: 0 0 4px; font: 500 16px/24px "Inter", system-ui, sans-serif; color: var(--g700); }
}

/* ---------- modaly: panel / sloupec / stranka / dialog ---------- */
html.ui2 .modal { animation: none !important; }
html.ui2 .modal-panel { background: var(--g0) !important; border: 0 !important; box-shadow: none !important; color: var(--g900); animation: none !important; }
html.ui2 .modal-head { background: var(--g0) !important; border-bottom: 1px solid var(--g200) !important; }
html.ui2 .modal-head h3 { font: 600 16px/24px "Inter", system-ui, sans-serif !important; color: var(--g900); letter-spacing: -0.005em; }
html.ui2 .modal-foot { border-top: 1px solid var(--g200) !important; background: var(--g0) !important; }
html.ui2 .modal-body { color: var(--g900); }
html.ui2 .modal-backdrop { background: rgba(22,28,28,.32) !important; backdrop-filter: none !important; }
html.ui2 .ui2-panel .modal-backdrop, html.ui2 .ui2-mid .modal-backdrop, html.ui2 .ui2-page .modal-backdrop { display: none !important; }
html.ui2 .ui2-panel, html.ui2 .ui2-mid, html.ui2 .ui2-page { padding: 0 !important; align-items: stretch !important; justify-content: stretch !important; z-index: 100; }
html.ui2 .ui2-panel .modal-panel, html.ui2 .ui2-mid .modal-panel, html.ui2 .ui2-page .modal-panel {
  width: 100% !important; max-width: none !important; height: 100% !important; max-height: none !important; border-radius: 0 !important; margin: 0 !important;
}
@media (min-width: 760px) {
  html.ui2 .modal.ui2-mid { left: var(--sw) !important; right: auto !important; width: var(--lw); top: 0; bottom: 0; }
  html.ui2 .ui2-mid .modal-panel { border-right: 1px solid var(--g200) !important; }
  html.ui2 .modal.ui2-panel { left: calc(var(--sw) + var(--lw)) !important; right: 0 !important; top: 0; bottom: 0; }
  html.ui2 .modal.ui2-page { left: var(--sw) !important; right: 0 !important; top: 0; bottom: 0; }
  html.ui2 .modal.ui2-page .modal-body { padding: 16px 24px 32px; }
  html.ui2 .modal.ui2-dlg { left: 0 !important; right: 0 !important; align-items: center !important; justify-content: center !important; z-index: 300; }
  html.ui2 .ui2-dlg .modal-panel { width: min(640px, calc(100vw - 32px)) !important; max-width: 640px !important; height: auto !important; max-height: calc(100dvh - 64px) !important; border-radius: 12px !important; box-shadow: 0 20px 60px rgba(22,28,28,.24) !important; border: 1px solid var(--g200) !important; }
  html.ui2 .ui2-dlg .modal-panel.modal-panel-wide { width: min(820px, calc(100vw - 32px)) !important; max-width: 820px !important; }
  html.ui2 .ui2-mid .modal-head [data-close], html.ui2 .ui2-page.ui2-more .modal-head [data-close] { display: none !important; }
}
@media (max-width: 759px) {
  html.ui2 .modal.ui2-panel, html.ui2 .modal.ui2-mid, html.ui2 .modal.ui2-page { left: 0 !important; right: 0 !important; top: 0 !important; bottom: var(--tbh) !important; padding-top: env(safe-area-inset-top, 0px) !important; background: var(--g0); }
  html.ui2 .ui2-panel .modal-foot, html.ui2 .ui2-mid .modal-foot, html.ui2 .ui2-page .modal-foot { padding-bottom: 10px !important; }
  html.ui2 .modal.ui2-dlg { z-index: 300; }
  html.ui2 .ui2-dlg .modal-panel { border-radius: 16px 16px 0 0 !important; max-height: calc(100dvh - 24px); }
  /* detail = full-screen push se sipkou zpet vlevo */
  html.ui2 .ui2-panel .modal-head, html.ui2 .ui2-page .modal-head { flex-wrap: nowrap; }
  html.ui2 .ui2-mid .modal-head [data-close] { display: none !important; }
  html.ui2 .ui2-more .modal-head [data-close] { display: none !important; }
}

/* ---------- detail mailu (mockup A) ---------- */
html.ui2 #modal-email .modal-panel { display: flex; flex-direction: column; }
html.ui2 #modal-email .ui2-actionbar { order: -2; border-top: 0 !important; border-bottom: 1px solid var(--g200) !important; padding: 12px 20px !important; gap: 8px; flex-wrap: wrap; justify-content: flex-start; }
html.ui2 #modal-email .ui2-actionbar .btn { flex: 0 0 auto !important; }
html.ui2 #modal-email #btn-cc-from-email { order: 0 !important; } html.ui2 #modal-email #btn-voice-reply { order: 1 !important; } html.ui2 #modal-email #btn-forward { order: 2 !important; } html.ui2 #modal-email #btn-archive { order: 3 !important; } html.ui2 #modal-email #btn-tts-email { order: 4 !important; }
html.ui2 #modal-email .modal-head { order: -1; border-bottom: 0 !important; padding: 20px 24px 8px !important; }
html.ui2 #modal-email #d-subject { font: 600 20px/28px "Inter", system-ui, sans-serif !important; margin: 0 0 8px; }
html.ui2 #modal-email .meta { color: var(--g700); font-size: 13px; line-height: 18px; }
html.ui2 #modal-email .meta strong { color: var(--g900); font-weight: 600; }
html.ui2 #modal-email .modal-body { padding: 8px 24px 32px !important; }
html.ui2 #modal-email .modal-body > * { max-width: 760px; }
html.ui2 .d-rcpt, html.ui2 .d-dateline { color: var(--g500) !important; }
html.ui2 .ui2-aicard { margin: 8px 0 16px; padding: 14px 16px; border-radius: 10px; background: var(--b50); border: 1px solid var(--b100); }
html.ui2 .ui2-aicard.ui2-off { display: none; }
html.ui2 .ui2-aicard-h { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; color: var(--g900); font-size: 15px; }
html.ui2 .ui2-aicard-i { width: 28px; height: 28px; border-radius: 50%; background: var(--b500); color: #fff; display: inline-flex; align-items: center; justify-content: center; }
html.ui2 #d-summary::before { content: "Shrnutí: "; font-weight: 600; color: var(--g900); }
html.ui2 #d-summary.summary-pending::before { content: none; }
html.ui2 .ui2-tag { margin-left: 4px; font-size: 12px; font-weight: 500; padding: 2px 10px; border-radius: 999px; background: var(--g0); color: var(--bink); border: 1px solid var(--b100); }
html.ui2 #d-summary { background: none !important; border: 0 !important; padding: 0 !important; margin: 0 !important; color: var(--g900) !important; font-size: 14px; line-height: 21px; box-shadow: none !important; }
html.ui2 #d-summary.summary-pending { color: var(--g500) !important; font-style: normal; }
html.ui2 #d-action { background: none !important; border: 0 !important; padding: 0 !important; margin: 10px 0 0 !important; box-shadow: none !important; display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; align-items: end; }
html.ui2 #d-action.hidden { display: none !important; }
html.ui2 #d-action .act-head { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; padding: 0 !important; background: none !important; border: 0 !important; cursor: default; pointer-events: none; color: var(--g900); }
html.ui2 #d-action .act-chip { font-weight: 600; font-size: 13px; background: none !important; padding: 0 !important; color: var(--g900) !important; }
html.ui2 #d-action .act-tag { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 999px; background: var(--g0); color: var(--bink); border: 1px solid var(--b100); }
html.ui2 #d-action .act-caret { display: none; }
html.ui2 #d-action .act-body { display: block !important; color: var(--g700) !important; font-size: 14px; line-height: 21px; padding: 0 !important; background: none !important; border: 0 !important; }
html.ui2 #d-action .ui2-do { align-self: end; }
html.ui2 .attachments { display: flex !important; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
html.ui2 .attachments.hidden { display: none !important; }
html.ui2 .attachments > *, html.ui2 .att-item, html.ui2 .draft-att, html.ui2 .cmp-att-chips > * {
  background: var(--g0) !important; border: 1px solid var(--g200) !important; border-radius: 8px !important; color: var(--g900) !important; box-shadow: none !important;
}
html.ui2 .att-size, html.ui2 .att-meta { color: var(--g500) !important; }
html.ui2 #d-body, html.ui2 #d-full { background: var(--g0) !important; color: var(--g900) !important; font-size: 15px; line-height: 24px; border-top: 1px solid var(--g200); padding-top: 16px; }
html.ui2 #d-body *:not(a):not(img) { color: inherit; }
html.ui2 #d-full { border: 1px solid var(--g200); border-radius: 8px; padding: 12px 16px; margin-top: 8px; }
html.ui2 .thread-toggle { margin: 12px 0; }
html.ui2 .proposed-times { background: var(--g50) !important; border: 1px solid var(--g200) !important; color: var(--g900) !important; border-radius: 8px; }

/* ---------- seznam AI ukolu (mockup B, prostredni sloupec) ---------- */
html.ui2 #modal-cc-list .modal-head, html.ui2 #modal-slack-list .modal-head { display: block; padding: 16px 16px 8px !important; border-bottom: 1px solid var(--g200) !important; }
html.ui2 #modal-cc-list .ui2-chips { padding: 10px 0 2px; gap: 4px; }
html.ui2 .ui2-find { display: flex; align-items: center; gap: 8px; flex: 1 1 auto; height: 36px; padding: 0 10px; border: 1px solid var(--g200); border-radius: 8px; background: var(--g50); color: var(--g500); }
html.ui2 .ui2-find:focus-within { border-color: var(--b500); box-shadow: 0 0 0 3px rgba(77,186,182,.22); }
html.ui2 .ui2-find input { flex: 1; border: 0 !important; background: transparent !important; box-shadow: none !important; padding: 0 !important; height: 34px; min-height: 0; font-size: 14px; }
html.ui2 #modal-cc-list .modal-body, html.ui2 #modal-slack-list .modal-body { padding: 0 !important; }
html.ui2 .cc-item {
  display: grid !important; grid-template-columns: 20px minmax(0, 1fr) auto; column-gap: 12px; row-gap: 2px; align-items: start;
  padding: 12px 16px !important; margin: 0 !important; border-radius: 0 !important; background: var(--g0) !important; opacity: 1 !important;
  border: 0 !important; border-bottom: 1px solid var(--g200) !important; border-left: 3px solid transparent !important; box-shadow: none !important; cursor: pointer;
}
html.ui2 .cc-item:hover { background: var(--g50) !important; }
html.ui2 .cc-item.ui2-sel { background: var(--b50) !important; border-left-color: var(--b500) !important; }
html.ui2 .cc-item.ui2-off { display: none !important; }
html.ui2 .cc-item > .ui2-sti { grid-row: 1 / span 3; margin-top: 2px; }
html.ui2 .cc-item .ei-row1 { grid-column: 2 / 4; display: flex; gap: 8px; align-items: baseline; margin: 0 !important; }
html.ui2 .cc-item .ei-from { flex: 1; min-width: 0; font: 600 14px/20px "Inter", system-ui, sans-serif !important; color: var(--g900) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.ui2 .cc-item .ei-date { font-size: 12px; color: var(--g500) !important; white-space: nowrap; }
html.ui2 .cc-item .ei-subject { grid-column: 2; font: 400 12px/16px "Inter", system-ui, sans-serif !important; color: var(--g500) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0 !important; }
html.ui2 .cc-item .status-row { grid-column: 3; grid-row: 2; display: flex; gap: 4px; align-items: center; margin: 0 !important; justify-content: flex-end; }
html.ui2 .cc-item .cc-from-mail { width: 28px; height: 28px; border-radius: 6px; border: 1px solid var(--g200) !important; background: var(--g0) !important; color: var(--g700); padding: 0; }
html.ui2 .cc-item .cc-from-mail::before { width: 14px !important; height: 14px !important; }

/* ---------- detail AI vlakna (mockup B) ---------- */
html.ui2 .modal-cc-thread .modal-panel.glass { background: var(--g0) !important; }
html.ui2 .modal-cc-thread .modal-body { background: var(--g0) !important; padding: 16px 24px 24px !important; }
html.ui2 .modal-cc-thread .modal-body > * { max-width: 920px; }
html.ui2 .modal-cc-thread .modal-head { padding: 16px 24px 12px !important; background: var(--g0) !important; }
html.ui2 .modal-cc-thread .modal-head h3, html.ui2 #cct-title { font: 600 20px/28px "Inter", system-ui, sans-serif !important; color: var(--g900) !important; -webkit-line-clamp: 2; }
html.ui2 .modal-cc-thread .cct-subrow #cct-sub { color: var(--g500) !important; font-size: 13px; }
html.ui2 .modal-cc-thread .modal-head-right .iconbtn { background: transparent !important; border: 1px solid transparent !important; border-radius: 8px !important; width: 36px; height: 36px; }
html.ui2 .modal-cc-thread .modal-head-right .iconbtn:hover { background: var(--g100) !important; }
/* panel s odpoctem: puvodni #cct-live (cc-thread.css) s puvodnimi tmavymi barvami; ui2 box je vypnuty (Tomas 14. 10. vecer) */
html.ui2 #cct-live {
  --cct-ink: 233,238,242; --cct-teal: 25,211,197; --cct-violet: 167,139,250; --cct-amber: 244,168,67; --cct-red: 255,91,110; --cct-green: 74,222,128;
  font-family: "Inter", system-ui, sans-serif;
}
html.ui2 #cct-live button { font-family: inherit; }

/* pristrojovy box: jediny tmavy prvek ve svetlem UI */
html.ui2 .ui2-inst {
  display: grid; grid-template-columns: 40px 140px minmax(0, 1fr) auto; gap: 0 16px; align-items: center;
  margin: 0 auto 16px; padding: 14px 16px; border-radius: 12px; background: var(--g900); color: #fff; position: relative;
}
html.ui2 .ui2-inst[hidden] { display: none; }
html.ui2 .ui2-inst-i { color: var(--b500); }
html.ui2 .ui2-inst-i { width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; }
html.ui2 .ui2-inst-done .ui2-inst-i { color: #fff; background: var(--ok); border-radius: 50%; }
html.ui2 .ui2-inst-err .ui2-inst-i, html.ui2 .ui2-inst-warn .ui2-inst-i { color: #c9403c; }
html.ui2 .ui2-inst-err { box-shadow: inset 0 0 0 1px #c9403c; }
html.ui2 .ui2-inst-clock { padding-right: 16px; border-right: 1px solid #3d4747; }
html.ui2 .ui2-inst-l { font: 600 11px/14px "Inter", system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--g300); }
html.ui2 .ui2-inst-t { font: 500 28px/36px var(--mono); letter-spacing: .02em; font-variant-numeric: tabular-nums; color: #fff; }
html.ui2 .ui2-inst-bar { height: 3px; border-radius: 2px; background: #3d4747; overflow: hidden; margin-top: 4px; }
html.ui2 .ui2-inst-bar i { display: block; height: 100%; background: var(--b500); transition: width 1s linear; }
html.ui2 .ui2-inst-done .ui2-inst-bar i { background: var(--b500); }
html.ui2 .ui2-inst-err .ui2-inst-bar i { background: #c9403c; }
html.ui2 .ui2-inst-mid { min-width: 0; }
html.ui2 .ui2-inst-s { font: 500 14px/20px "Inter", system-ui, sans-serif; color: #fff; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
html.ui2 .ui2-inst-m { font-size: 13px; line-height: 18px; color: var(--g300); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.ui2 .ui2-inst-ev { display: flex; align-items: center; gap: 4px; margin-top: 4px; font-size: 13px; line-height: 18px; color: #e6ecec; min-width: 0; }
html.ui2 .ui2-inst-ev span { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.ui2 .ui2-inst-ev em { font-style: normal; color: var(--g300); margin-left: 6px; }
html.ui2 .ui2-ib-dk { width: 28px !important; height: 28px !important; min-width: 28px !important; color: var(--g300) !important; }
html.ui2 .ui2-ib-dk:hover:not(:disabled) { background: #2a3434 !important; color: #fff !important; }
html.ui2 .ui2-inst-act { display: flex; gap: 8px; }
html.ui2 .ui2-btn-dk { background: transparent !important; color: #fff !important; border: 1px solid #5c6a6a !important; min-height: 36px; }
html.ui2 .ui2-btn-dk:hover { background: #2a3434 !important; border-color: var(--g300) !important; }

/* draft = karta Navrzeny e-mail */
html.ui2 .modal-cc-thread .draft-card { background: var(--g0) !important; border: 1px solid var(--g200) !important; border-radius: 12px !important; box-shadow: 0 1px 2px rgba(22,28,28,.06) !important; padding: 16px !important; margin: 0 auto 20px !important; }
html.ui2 .modal-cc-thread .draft-head { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; color: var(--g900) !important; font: 600 15px/22px "Inter", system-ui, sans-serif !important; }
html.ui2 .modal-cc-thread .draft-head .ui2-svg { color: var(--b700); }
html.ui2 .draft-card > .field:not(.field-trix) { display: grid; grid-template-columns: 72px minmax(0, 1fr); align-items: center; gap: 8px; margin: 0 0 8px; position: relative; }
html.ui2 .draft-card > .field:not(.field-trix) > span { color: var(--g500); font-size: 13px; }
html.ui2 .draft-card > .field > .ac-dropdown { grid-column: 2; }
html.ui2 .draft-card .ccbcc-toggle { display: flex; justify-content: flex-end; gap: 12px; margin: -4px 0 8px; }
html.ui2 .draft-card .field-trix { margin-top: 8px; }
html.ui2 .draft-card .field-trix > .field-label { display: none; }
html.ui2 trix-toolbar .trix-button-group { border-color: var(--g200) !important; background: var(--g0); }
html.ui2 trix-toolbar .trix-button { border-color: var(--g200) !important; background: var(--g0) !important; }
html.ui2 trix-toolbar .trix-button.trix-active { background: var(--b50) !important; }
html.ui2 trix-editor { background: var(--g0) !important; color: var(--g900) !important; border: 1px solid var(--g300) !important; border-radius: 8px !important; min-height: 180px; font-size: 14px; line-height: 21px; }
html.ui2 .draft-card .draft-foot { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 8px; margin-top: 14px; }
html.ui2 .draft-card .draft-foot #dr-send { order: -1; min-width: 140px; }
html.ui2 .draft-card .draft-foot .btn { flex: 0 0 auto !important; }
html.ui2 .draft-atts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
html.ui2 .draft-redo { background: var(--g50) !important; border: 1px solid var(--g200); border-radius: 8px; padding: 12px; margin-top: 12px; }

/* zpravy jako casova osa, chronologicky (nejnovejsi dole u composeru) */
html.ui2 .modal-cc-thread #cct-messages { display: flex; flex-direction: column; gap: 0 !important; }  /* nejnovejsi nahore (Tomas 18. 9. a 15. 10. 2026), poradi dava app.js */
html.ui2 .modal-cc-thread .chat .msg {
  display: grid; grid-template-columns: 28px minmax(0, 1fr); column-gap: 12px; align-items: start;
  max-width: 100% !important; align-self: stretch !important; margin: 0 !important; padding: 12px 12px !important;
  border: 0 !important; border-radius: 8px !important; background: transparent !important; box-shadow: none !important; text-align: left !important; opacity: 1 !important;
}
html.ui2 .modal-cc-thread .chat .msg-cc { background: var(--g50) !important; }
html.ui2 .modal-cc-thread .chat .msg > .ui2-av { grid-row: 1 / span 3; }
html.ui2 .modal-cc-thread .chat .msg-head { grid-column: 2; display: flex; align-items: center; gap: 8px; margin: 0 0 2px !important; font-size: 12px; color: var(--g500) !important; }
html.ui2 .modal-cc-thread .chat .msg-head > span:first-child { color: var(--g900) !important; font: 600 13px/18px "Inter", system-ui, sans-serif !important; letter-spacing: 0 !important; }
html.ui2 .modal-cc-thread .chat .msg-time::before { content: none !important; }
html.ui2 .modal-cc-thread .chat .tts-read-btn { margin-left: auto; width: 28px !important; height: 28px !important; min-width: 28px; border: 0 !important; background: transparent !important; color: var(--g500) !important; border-radius: 6px; }
html.ui2 .modal-cc-thread .chat .tts-read-btn:hover { background: var(--g100) !important; color: var(--g900) !important; }
html.ui2 .modal-cc-thread .chat .msg-body { grid-column: 2; font-size: 14px !important; line-height: 21px !important; color: var(--g900) !important; }
html.ui2 .modal-cc-thread .chat .msg-body a { color: var(--b700) !important; }
html.ui2 .modal-cc-thread .chat .msg-body code { background: var(--g100) !important; color: var(--g900); }
html.ui2 .modal-cc-thread .chat .msg-more { background: none !important; border: 0 !important; color: var(--b700) !important; padding: 0 4px !important; font-weight: 600 !important; }
html.ui2 .modal-cc-thread .chat .msg-system { font-size: 13px; }
html.ui2 .modal-cc-thread .chat .msg-sent-email { display: block; background: var(--ok-bg) !important; border: 1px solid #cfe8da !important; margin: 4px 0 !important; }
html.ui2 .msg-sent-head { color: var(--g900); } html.ui2 .msg-sent-icon { color: var(--ok); }
html.ui2 .msg-sent-sub { color: var(--g500) !important; }
html.ui2 .msg-sent-toggle { background: var(--g0) !important; border: 1px solid var(--g300) !important; color: var(--g900) !important; }
html.ui2 .msg-sent-body { color: var(--g900) !important; border-top-color: #cfe8da !important; }
html.ui2 .modal-cc-thread .msg-old { opacity: 1 !important; }
html.ui2 .cc-msg-skeleton .cms-bubble { background: var(--g100) !important; }

/* vystupy AI (driv Prilohy me prace) */
html.ui2 .cc-artifacts { margin: 8px 0 12px; padding: 12px; border: 1px solid var(--g200); border-radius: 10px; background: var(--g0); }
html.ui2 .cc-artifacts-head { font: 600 13px/18px "Inter", system-ui, sans-serif; color: var(--g900); margin-bottom: 8px; }
html.ui2 .cc-art-card { background: var(--g50) !important; border: 1px solid var(--g200) !important; border-radius: 8px !important; box-shadow: none !important; }
html.ui2 .cc-art-title { color: var(--g900) !important; } html.ui2 .cc-art-meta { color: var(--g500) !important; }
html.ui2 .cc-art-actions .btn { min-height: 32px; }
html.ui2 .cc-art-actions .cc-art-open { background: none !important; border: 0 !important; color: var(--b700) !important; padding: 0 6px !important; font-weight: 600 !important; }

/* puvodni e-mail: sbaleny radek ve svetlem ramu */
html.ui2 .ui2-orig { margin: 8px 0 12px !important; padding: 0 !important; border: 1px solid var(--g200) !important; border-radius: 10px !important; background: var(--g50) !important; overflow: hidden; }
html.ui2 .ui2-orig .chat-context-head { display: flex; align-items: center; gap: 8px; padding: 10px 12px; margin: 0 !important; cursor: pointer; color: var(--g900) !important; font: 500 14px/20px "Inter", system-ui, sans-serif !important; }
html.ui2 .ui2-orig .chat-context-head > span:nth-of-type(1) { flex: 1 1 auto; }
html.ui2 .ui2-orig .cc-email-html-open { order: 3; background: none !important; border: 0 !important; color: var(--b700) !important; font-size: 13px; font-weight: 500; cursor: pointer; }
html.ui2 .ui2-orig .ui2-orig-t { order: 4; color: var(--g500); transition: transform .15s; }
html.ui2 .ui2-orig.ui2-open .ui2-orig-t { transform: rotate(180deg); }
html.ui2 .ui2-orig > iframe, html.ui2 .ui2-orig > .chat-context-body { display: none; }
html.ui2 .ui2-orig.ui2-open > iframe { display: block; width: 100%; border: 0; border-top: 1px solid var(--g200); background: #fff; }
html.ui2 .ui2-orig.ui2-open > .chat-context-body { display: block; padding: 12px; border-top: 1px solid var(--g200); background: #fff; color: var(--g900) !important; font-size: 13px; }

/* composer */
html.ui2 .modal-cc-thread .modal-foot { background: var(--g0) !important; border-top: 1px solid var(--g200) !important; padding: 12px 24px !important; }
html.ui2 .modal-cc-thread .cc-reply { max-width: 920px; position: relative; display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px; }
html.ui2 .modal-cc-thread .cc-reply textarea, html.ui2 #slt-reply { flex: 1 1 300px; min-height: 44px !important; max-height: 180px; padding: 11px 14px !important; font-size: 14px !important; line-height: 20px !important; background: var(--g0) !important; border: 1px solid var(--g300) !important; border-radius: 10px !important; }
html.ui2 .modal-cc-thread .cc-reply-actions, html.ui2 #modal-slack-thread .cc-reply-actions { display: flex; gap: 6px; margin: 0 !important; flex: none; }
html.ui2 .modal-cc-thread .cc-reply-actions > button { width: 44px !important; min-width: 44px !important; height: 44px !important; min-height: 44px !important; padding: 0 !important; flex: none !important; border-radius: 10px !important; background: var(--g0) !important; border: 1px solid var(--g300) !important; color: var(--g700) !important; box-shadow: none !important; }
html.ui2 .modal-cc-thread .cc-reply-actions > button:hover { background: var(--g50) !important; color: var(--g900) !important; }
html.ui2 .modal-cc-thread .cc-reply-actions #cct-send { color: var(--b700) !important; border-color: var(--b500) !important; }
html.ui2 .modal-cc-thread .cc-reply-actions #cct-send::before { width: 20px; height: 20px; }
html.ui2 .mic-status { color: var(--g500) !important; width: 100%; }
html.ui2 .mic-status:empty { display: none; }
html.ui2 .mic-btn-small.recording, html.ui2 .btn-mic.recording, html.ui2 .mic-btn.recording { box-shadow: 0 0 0 4px rgba(77,186,182,.35) !important; color: var(--b700) !important; }
@media (min-width: 760px) { html.ui2 .modal-cc-thread.cct-mode-draft .modal-foot { display: flex !important; } }

/* ---------- Slack vlakno ---------- */
html.ui2 #modal-slack-thread .chat .msg, html.ui2 #slack-list > * { background: var(--g0) !important; border: 1px solid var(--g200) !important; color: var(--g900) !important; box-shadow: none !important; }
html.ui2 #slack-list > * { border-width: 0 0 1px 0 !important; border-radius: 0 !important; margin: 0 !important; }
html.ui2 #modal-slack-thread .cc-reply { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; }
html.ui2 .draft-card { background: var(--g0) !important; border: 1px solid var(--g200) !important; color: var(--g900); }
html.ui2 .chat-context { background: var(--g50) !important; border: 1px solid var(--g200) !important; color: var(--g900); }
html.ui2 .chat-context-head { color: var(--g700) !important; }
html.ui2 .chat-context-body { color: var(--g700) !important; }

/* ---------- Nastaveni, Tendery, Vice (stranky) ---------- */
html.ui2 .settings-tabs, html.ui2 .tender-tabs { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 1px solid var(--g200); padding-bottom: 8px; margin-bottom: 16px; }
html.ui2 .settings-tab, html.ui2 .tender-tab { display: inline-flex; align-items: center; min-height: 36px; padding: 0 12px; border-radius: 8px !important; border: 0 !important; background: transparent !important; color: var(--g700) !important; font: 500 14px/20px "Inter", system-ui, sans-serif !important; box-shadow: none !important; }
html.ui2 .settings-tab:hover, html.ui2 .tender-tab:hover { background: var(--g50) !important; }
html.ui2 .settings-tab.active, html.ui2 .tender-tab.active { background: var(--b50) !important; color: var(--bink) !important; }
html.ui2 #modal-settings .list > *, html.ui2 #modal-tender .list > *, html.ui2 #rl-list > *, html.ui2 .pp-item, html.ui2 #dp-folders > * {
  background: var(--g0) !important; border: 1px solid var(--g200) !important; color: var(--g900) !important; box-shadow: none !important; border-radius: 8px !important;
}
html.ui2 .pp-path, html.ui2 .pp-mtime, html.ui2 .pp-desc { color: var(--g500) !important; }
html.ui2 .tokens-summary-card, html.ui2 .tokens-plan-box, html.ui2 .tokens-scope-info, html.ui2 .tender-cfg-section, html.ui2 .hb-log, html.ui2 .hb-stale-warn, html.ui2 .re-action-block, html.ui2 .rule-type, html.ui2 .kbf, html.ui2 .chip-input {
  background: var(--g0) !important; border: 1px solid var(--g200) !important; color: var(--g900) !important; box-shadow: none !important;
}
html.ui2 .tokens-table th, html.ui2 .tokens-table td { border-color: var(--g200) !important; color: var(--g900); }
html.ui2 .badge { background: var(--b700) !important; color: #fff !important; box-shadow: none !important; }
html.ui2 code { background: var(--g100); color: var(--g900); }
html.ui2 .ui2-more .more-sheet { display: flex; flex-direction: column; }
html.ui2 .ui2-more-h { font: 600 11px/14px "Inter", system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--g500); padding: 16px 16px 6px; background: var(--g50); border-bottom: 1px solid var(--g200); }
html.ui2 .ui2-more .modal-body { padding: 0 !important; }
html.ui2 .more-item { display: flex; align-items: center; gap: 14px; min-height: 52px; padding: 0 16px !important; margin: 0 !important; background: var(--g0) !important; border: 0 !important; border-bottom: 1px solid var(--g200) !important; border-radius: 0 !important; color: var(--g900) !important; font: 400 15px/22px "Inter", system-ui, sans-serif !important; text-align: left; width: 100%; box-shadow: none !important; }
html.ui2 .more-item > span:nth-child(2) { flex: 1; }
html.ui2 .more-ico { color: var(--g700); display: inline-flex; width: 22px; font-size: 0; }
html.ui2 .more-ico img { width: 20px; height: 20px; filter: brightness(0) opacity(.7); font-size: 0; }
html.ui2 .more-ico:has(.ui2-svg) img { display: none; }
html.ui2 .more-arrow { color: var(--g500); font-size: 0; display: inline-flex; }
html.ui2 #app-version-line { display: none !important; }
@media (min-width: 760px) { html.ui2 .modal.ui2-more { left: 0 !important; z-index: 300; align-items: center !important; justify-content: center !important; } html.ui2 .ui2-more .modal-panel { width: 420px !important; height: auto !important; border-radius: 12px !important; border: 1px solid var(--g200) !important; } html.ui2 .ui2-more .modal-backdrop { display: block !important; } }

/* ---------- Sprava firmy a Muj ucet (company.js overlay) ---------- */
html.ui2 .co-overlay:not(.co-island) { background: var(--g50) !important; backdrop-filter: none !important; color: var(--g900) !important; }
@media (min-width: 760px) { html.ui2 .co-overlay#co-admin, html.ui2 .co-overlay#co-me { left: var(--sw); } }
@media (max-width: 759px) { html.ui2 .co-overlay#co-admin, html.ui2 .co-overlay#co-me { bottom: var(--tbh); } }
html.ui2 .co-overlay:not(.co-island) .co-card { background: var(--g0) !important; border: 1px solid var(--g200) !important; box-shadow: none !important; color: var(--g900); border-radius: 12px !important; }
html.ui2 .co-admin .co-brand, html.ui2 .co-me .co-brand { display: none !important; }
html.ui2 .co-overlay h1 { font: 600 20px/28px "Inter", system-ui, sans-serif !important; color: var(--g900); }
html.ui2 .co-lead, html.ui2 .co-muted, html.ui2 .co-field small { color: var(--g500) !important; }
html.ui2 .co-nav { background: var(--g50) !important; border: 1px solid var(--g200) !important; }
html.ui2 .co-nav button { color: var(--g700) !important; background: transparent !important; border-radius: 8px !important; }
html.ui2 .co-nav button.on { background: var(--b50) !important; color: var(--bink) !important; }
html.ui2 .co-ico { filter: brightness(0) opacity(.65); }
html.ui2 .co-box, html.ui2 .co-kpi, html.ui2 .co-kbrow, html.ui2 .co-me-card { background: var(--g0) !important; border: 1px solid var(--g200) !important; color: var(--g900) !important; }
html.ui2 .co-kpi b { color: var(--g900); }
html.ui2 .co-kpi.good b { color: var(--ok); } html.ui2 .co-kpi.warn b { color: var(--warn); }
html.ui2 .co-table th { color: var(--g500) !important; border-bottom: 1px solid var(--g200) !important; }
html.ui2 .co-table td { border-bottom: 1px solid var(--g200) !important; height: 44px; color: var(--g900); }
html.ui2 .co-table tr:hover td { background: var(--g50) !important; }
html.ui2 .co-pill { background: var(--g100) !important; color: var(--g700) !important; font-weight: 600 !important; }
html.ui2 .co-pill.admin { background: var(--b50) !important; color: var(--bink) !important; }
html.ui2 .co-pill.active, html.ui2 .co-pill.ok { background: var(--ok-bg) !important; color: var(--ok-ink) !important; }
html.ui2 .co-pill.invited, html.ui2 .co-pill.wait { background: var(--info-bg) !important; color: var(--info) !important; }
html.ui2 .co-pill.disabled, html.ui2 .co-pill.exhausted, html.ui2 .co-pill.bad { background: var(--err-bg) !important; color: var(--err) !important; }
html.ui2 .co-pill.humanit { background: var(--b50) !important; color: var(--bink) !important; }
html.ui2 .co-x { border: 1px solid var(--g300) !important; color: var(--g700) !important; border-radius: 8px !important; }
html.ui2 .co-avatar { background: var(--b500) !important; color: #fff !important; border-radius: 50% !important; }
html.ui2 .co-help > button { background: var(--g0) !important; border-color: var(--g300) !important; color: var(--g700) !important; }
html.ui2 .co-help .co-tip { background: var(--g0) !important; border: 1px solid var(--g200) !important; color: var(--g900) !important; box-shadow: 0 12px 30px rgba(22,28,28,.16) !important; }
html.ui2 .co-err { color: var(--err) !important; background: var(--err-bg) !important; border-color: #ecc4c2 !important; }
html.ui2 .co-ok { color: var(--ok) !important; background: var(--ok-bg) !important; border-color: #cfe8da !important; }
html.ui2 .co-modal .co-card, html.ui2 .co-modal-card { background: var(--g0) !important; color: var(--g900) !important; }
html.ui2 .co-userchip, html.ui2 #co-top-admin { display: none !important; }
html.ui2 .co-ai-warn { bottom: auto; top: 12px; }

/* ---------- toast nahore, nikdy pres listu ---------- */
html.ui2 .toast, html.ui2 .co-toast {
  top: calc(12px + env(safe-area-inset-top, 0px)) !important; bottom: auto !important; left: 50% !important; transform: translate(-50%, -8px) !important;
  background: var(--g900) !important; color: #fff !important; border: 0 !important; border-radius: 10px !important; box-shadow: 0 8px 24px rgba(22,28,28,.24) !important;
  font: 500 14px/20px "Inter", system-ui, sans-serif !important; padding: 10px 14px !important; max-width: min(520px, calc(100vw - 32px)) !important; z-index: 5000 !important;
}
html.ui2 .toast.show { transform: translate(-50%, 0) !important; }
html.ui2 .toast.error { background: var(--err) !important; }
html.ui2 .toast.success { background: var(--g900) !important; }
html.ui2 .toast-action { background: transparent !important; color: var(--b100) !important; border: 1px solid #5c6a6a !important; border-radius: 6px !important; margin-left: 12px; }
@media (min-width: 760px) { html.ui2 .toast, html.ui2 .co-toast { left: calc(var(--sw) + (100vw - var(--sw)) / 2) !important; } }

/* heartbeat stav: na desktopu dole v sidebaru, na mobilu nad listou */
html.ui2 .hb-box { background: var(--g0) !important; color: var(--g700) !important; border: 1px solid var(--g200) !important; box-shadow: 0 2px 8px rgba(22,28,28,.08) !important; border-radius: 8px !important; font-size: 12px !important; }
html.ui2 .hb-box .hb-label { color: var(--g700) !important; } html.ui2 .hb-box .hb-time { color: var(--g500) !important; }

/* ---------- mobil ---------- */
@media (max-width: 759px) {
  html.ui2 body { font-size: 15px; line-height: 22px; }
  html.ui2 #ui2-listhead { padding: calc(12px + env(safe-area-inset-top, 0px)) 16px 8px; }
  html.ui2 .ui2-title { font-size: 26px; line-height: 32px; font-weight: 600; }
  html.ui2 .ui2-acct { flex: 0 1 auto; }
  html.ui2 .content { padding-bottom: calc(var(--tbh) + 84px) !important; }
  html.ui2 #fab-cc-new { display: flex !important; position: fixed; right: 16px; bottom: calc(var(--tbh) + 16px) !important; width: 56px; height: 56px; border-radius: 50%; z-index: 140;
    background: var(--b700) !important; color: #fff !important; box-shadow: 0 6px 18px rgba(44,127,124,.35) !important; }
  html.ui2 #fab-cc-new::before { width: 24px !important; height: 24px !important; background: #fff !important; -webkit-mask: var(--i-sparkles) center / contain no-repeat !important; mask: var(--i-sparkles) center / contain no-repeat !important; }
  html.ui2.ui2-has-detail #fab-cc-new, html.ui2 body[data-fab-hide="1"] #fab-cc-new, html.ui2.ui2-has-overlay #fab-cc-new { display: none !important; }
  html.ui2 body.modal-open:not([data-fab-hide="1"]) #fab-cc-new { display: none !important; }
  html.ui2 body.modal-open:has(#modal-cc-list:not(.hidden)):not(:has(.ui2-panel:not(.hidden))) #fab-cc-new { display: flex !important; }
  html.ui2 .email-item .ei-row-actions .mini-btn { width: 44px; height: 36px; }
  html.ui2 .ui2-inst { grid-template-columns: 24px minmax(0, 1fr) auto; gap: 8px 12px; }
  html.ui2 .ui2-inst-clock { border: 0; padding: 0; }
  html.ui2 .ui2-inst-mid { grid-column: 1 / -1; }
  html.ui2 .ui2-inst-act { grid-column: 3; grid-row: 1; flex-direction: column; }
  html.ui2 .ui2-inst-act .ui2-btn { min-height: 36px; padding: 0 10px; }
  html.ui2 .modal-cc-thread .modal-body, html.ui2 #modal-email .modal-body { padding: 12px 16px 24px !important; }
  html.ui2 .modal-cc-thread .modal-foot { padding: 8px 12px !important; }
  html.ui2 #modal-email .ui2-actionbar { padding: 8px 12px !important; gap: 6px; flex-wrap: nowrap; overflow-x: auto; }
  html.ui2 #modal-email .ui2-actionbar .btn:not(#btn-cc-from-email) { font-size: 0 !important; width: 44px; padding: 0 !important; }
  html.ui2 #modal-email .ui2-actionbar .btn:not(#btn-cc-from-email)::before { margin: 0 !important; width: 18px; height: 18px; }
  html.ui2 .draft-card .draft-foot #dr-send { min-width: 0; }
  html.ui2 .ui2-inst-act { display: none !important; }
  html.ui2 .modal-head-right { flex-wrap: nowrap; }
}
@media (prefers-reduced-motion: reduce) { html.ui2 * { animation: none !important; transition: none !important; } }

/* menu "..." v hlavicce AI detailu: na mobilu schova odkaz/znalost/log/zastavit, na desktopu jsou ikony primo */
html.ui2 .ui2-mmenu-btn, html.ui2 #ui2-stop-m { display: none !important; }
@media (max-width: 759px) {
  html.ui2 .modal-cc-thread .modal-head-right { position: relative; }
  html.ui2 .modal-cc-thread .ui2-mmenu-btn { display: inline-flex !important; }
  html.ui2 .modal-cc-thread .modal-head-right > .iconbtn:not(.ui2-mmenu-btn):not([data-close]) { display: none !important; }
  html.ui2 .modal-cc-thread .modal-head-right.ui2-mmenu-open > .iconbtn:not(.ui2-mmenu-btn):not([data-close]) {
    display: flex !important; position: absolute; right: 0; width: 230px !important; height: 44px !important; justify-content: flex-start !important; gap: 12px;
    padding: 0 14px !important; background: var(--g0) !important; border: 1px solid var(--g200) !important; border-radius: 0 !important; z-index: 20; font-size: 14px !important; color: var(--g900) !important;
  }
  html.ui2 .modal-cc-thread .modal-head-right.ui2-mmenu-open > .iconbtn:not(.ui2-mmenu-btn):not([data-close])::after { content: attr(aria-label); font: 400 14px/20px "Inter", system-ui, sans-serif; white-space: nowrap; }
  html.ui2 .modal-head-right.ui2-mmenu-open > #cct-kb-btn { top: 44px; border-radius: 10px 10px 0 0 !important; }
  html.ui2 .modal-head-right.ui2-mmenu-open > #cct-link-btn { top: 87px; }
  html.ui2 .modal-head-right.ui2-mmenu-open > #cct-log-btn { top: 130px; }
  html.ui2 .modal-head-right.ui2-mmenu-open > #ui2-stop-m { top: 173px; border-radius: 0 0 10px 10px !important; box-shadow: 0 12px 30px rgba(22,28,28,.16); }
}
/* Vice: Odhlasit je akce (bez sipky) */
html.ui2 #co-more-logout .more-arrow { display: none !important; }

html.ui2 .draft-card .field input { height: 36px; min-height: 36px; padding: 0 10px !important; font-size: 14px !important; }
html.ui2 .planner-sidepanel[aria-hidden="true"] { box-shadow: none !important; visibility: hidden; }
html.ui2 .planner-sidepanel { background: var(--g0) !important; color: var(--g900); border-left: 1px solid var(--g200) !important; }

/* trix editor ve svetlem motivu (style.css ho ladi do tmava a invertuje ikony) */
html.ui2 .field trix-toolbar { background: var(--g0) !important; border: 1px solid var(--g300) !important; border-bottom: 0 !important; border-radius: 8px 8px 0 0 !important; backdrop-filter: none !important; }
html.ui2 .field trix-toolbar .trix-button-group { background: var(--g0) !important; border: 1px solid var(--g200) !important; }
html.ui2 .field trix-toolbar .trix-button { border-right: 1px solid var(--g200) !important; color: var(--g700) !important; background: transparent !important; }
html.ui2 .field trix-toolbar .trix-button:hover { background: var(--g50) !important; }
html.ui2 .field trix-toolbar .trix-button.trix-active { background: var(--b50) !important; }
html.ui2 .field trix-toolbar .trix-button--icon::before, html.ui2 .field trix-toolbar .trix-button--icon.trix-active::before { filter: none !important; opacity: .7; }
html.ui2 .field trix-toolbar .trix-dialog { background: var(--g0) !important; border: 1px solid var(--g200) !important; box-shadow: 0 8px 24px rgba(22,28,28,.16) !important; }
html.ui2 .field trix-toolbar .trix-dialog input { background: var(--g0) !important; color: var(--g900) !important; border: 1px solid var(--g300) !important; }
html.ui2 .field-trix trix-editor { border-radius: 0 0 8px 8px !important; }
/* zavirani panelu: tlacitko presunute ui2.js na zacatek hlavicky; desktop = X vpravo, mobil = sipka zpet vlevo */
html.ui2 .modal-head > .ui2-back { order: 99; flex: none; }
@media (max-width: 759px) {
  html.ui2 .modal-head > .ui2-back { order: -1; position: static !important; margin: 0 4px 0 -6px !important; --i: var(--i-arrow-left) !important; }
  html.ui2 .ui2-panel .modal-head, html.ui2 .ui2-page .modal-head { padding-left: 12px !important; align-items: flex-start; }
  html.ui2 .ui2-inst { grid-template-columns: 40px minmax(0, 1fr); }
  html.ui2 .ui2-inst-clock { grid-column: 2; }
  html.ui2 .ui2-inst-mid { grid-column: 1 / -1; margin-top: 8px; }
  html.ui2 .email-item .ei-row-actions { justify-content: flex-end; margin-top: 4px !important; }
  html.ui2 .email-item .ei-row-actions .mini-btn { width: 40px !important; height: 32px !important; border-color: transparent !important; }
}
/* stav AI (heartbeat) jako tichy radek v hlavicce seznamu, ne plovouci prvek pres obsah */
html.ui2 #ui2-listhead .hb-box { position: static !important; display: flex; gap: 8px; margin: 8px 0 0; padding: 4px 10px !important; width: auto !important; max-width: 100%; box-shadow: none !important; background: var(--g50) !important; border: 1px solid var(--g200) !important; transform: none !important; left: auto !important; bottom: auto !important; }
html.ui2 #ui2-listhead .hb-box.hidden { display: none !important; }
html.ui2 body.modal-open #ui2-listhead .hb-box:not(.hidden) { display: flex !important; }

/* Sprava firmy: v tabulce jen obrysova tlacitka (jedno plne = Pozvat uzivatele) */
html.ui2 .co-overlay .co-table .co-btn { background: var(--g0) !important; color: var(--g900) !important; border-color: var(--g300) !important; font-weight: 500 !important; }
html.ui2 .co-overlay .co-btn { box-shadow: none !important; }
html.ui2 .co-ico { opacity: .6; }
/* detail mailu na mobilu: nejdriv hlavicka se sipkou, pod ni akce; ikonova tlacitka 44 px */
@media (max-width: 759px) {
  html.ui2 #modal-email .modal-head { order: -2; }
  html.ui2 #modal-email .ui2-actionbar { order: -1; border-bottom: 1px solid var(--g200) !important; }
  html.ui2 #modal-email .ui2-actionbar .btn:not(#btn-cc-from-email) { flex: 0 0 44px !important; min-width: 44px !important; }
  html.ui2 #modal-email .ui2-actionbar #btn-cc-from-email { flex: 0 0 auto !important; }
}
html.ui2 .modal-head > .ui2-back { background: transparent !important; }
/* puvodni e-mail a vystupy AI pod casovou osou (seznam je column-reverse: nizsi order = niz) */

/* ===== iterace 2 ===== */
html.ui2 .ui2-emo { display: inline-flex; vertical-align: -2px; margin: 0 2px; color: var(--g700); }
html.ui2 .ui2-chip.on i { color: var(--bink); }
html.ui2 .hb-time, html.ui2 .att-size, html.ui2 .att-meta, html.ui2 .cmp-att-size { color: var(--g500) !important; }
html.ui2 .ui2-orig .cc-email-html-open, html.ui2 .ui2-link, html.ui2 .link-btn { color: #27706d !important; }
@media (max-width: 759px) {
  html.ui2 .email-item .ei-summary { -webkit-line-clamp: 1; max-height: 30px; }
  html.ui2 .email-item { padding-top: 10px !important; padding-bottom: 10px !important; }
}
/* stav AI u nadpisu: maly nenapadny indikator */
html.ui2 #ui2-listhead .ui2-ch-top { flex-wrap: nowrap; }
html.ui2 #ui2-listhead .ui2-title { flex: 0 0 auto; }
html.ui2 #ui2-listhead .ui2-ch-top > .hb-box { position: static !important; flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 6px; margin: 0 !important; padding: 0 !important;
  background: none !important; border: 0 !important; box-shadow: none !important; transform: none !important; width: auto !important; font-size: 12px !important; color: var(--g500) !important; overflow: hidden; }
html.ui2 #ui2-listhead .ui2-ch-top > .hb-box::before { content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--b500); animation: ui2-pulse 1.6s ease-in-out infinite; }
html.ui2 #ui2-listhead .ui2-ch-top > .hb-box .hb-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--g500) !important; font-size: 12px; }
html.ui2 #ui2-listhead .ui2-ch-top > .hb-box .hb-time { display: none; }
html.ui2 #ui2-listhead .ui2-ch-top > .hb-box.hidden { display: none !important; }
html.ui2 body.modal-open #ui2-listhead .ui2-ch-top > .hb-box:not(.hidden) { display: flex !important; }
html.ui2 #ui2-empty .ui2-svg { color: var(--b500) !important; }
/* prilohy v detailu mailu: ikona podle pripony, bez MIME, zadne prazdne ctverecky */
html.ui2 .att-card { display: flex !important; align-items: center; gap: 4px; padding: 6px 6px 6px 10px !important; min-width: 220px; max-width: 360px; }
html.ui2 .att-card .att-link { display: flex; align-items: center; gap: 10px; flex: 1 1 auto; min-width: 0; color: var(--g900) !important; text-decoration: none; }
html.ui2 .att-icon { position: relative; flex: none; width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; border-radius: 6px; background: var(--g100); color: var(--g700); font-size: 0; }
html.ui2 .att-icon b { position: absolute; bottom: -4px; right: -6px; font: 700 8px/12px "Inter", system-ui, sans-serif; padding: 0 3px; border-radius: 3px; background: var(--g700); color: #fff; letter-spacing: .02em; }
html.ui2 .att-info { display: flex; flex-direction: column; min-width: 0; }
html.ui2 .att-name { font-size: 13px; line-height: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--g900) !important; }
html.ui2 .att-meta { font-size: 12px; line-height: 16px; }
html.ui2 .att-action { flex: none; color: var(--g500); display: inline-flex; font-size: 0; }
html.ui2 .att-actions .btn-drive-save { width: 32px !important; height: 32px; min-height: 32px; padding: 0 !important; border: 0 !important; color: var(--g500) !important; background: none !important; }
html.ui2 .att-actions .btn-drive-save:hover { background: var(--g100) !important; color: var(--g900) !important; }
html.ui2 .att-ico, html.ui2 .cmp-att-icon { display: inline-flex; color: var(--g700); font-size: 0; }
/* Sprava firmy a Muj ucet jako stranka (navigace je v sidebaru) */
html.ui2 .co-overlay#co-admin, html.ui2 .co-overlay#co-me { padding: 0 !important; background: var(--g50) !important; align-items: stretch !important; }
html.ui2 #co-admin .co-card, html.ui2 #co-me .co-card { max-width: none !important; margin: 0 !important; border: 0 !important; border-radius: 0 !important; background: var(--g50) !important; padding: 24px 32px 40px !important; min-height: 100%; }
html.ui2 #co-adm-close, html.ui2 #co-me-close { display: none !important; }
html.ui2 .co-admin-head h1 { display: flex; flex-direction: column; gap: 2px; margin: 0 !important; }
html.ui2 .co-admin-head h1 small { font: 400 13px/18px "Inter", system-ui, sans-serif; color: var(--g500); }
@media (min-width: 760px) { html.ui2 #co-admin .co-nav { display: none !important; } }
@media (max-width: 759px) {
  html.ui2 #co-admin .co-card, html.ui2 #co-me .co-card { padding: calc(16px + env(safe-area-inset-top, 0px)) 16px 24px !important; }
  html.ui2 #co-admin .co-nav { display: flex !important; flex-wrap: nowrap; overflow-x: auto; gap: 4px; padding: 4px !important; }
  html.ui2 #co-admin .co-nav button { flex: none; white-space: nowrap; }
}
html.ui2 .co-nav button { display: inline-flex !important; align-items: center; gap: 8px; }
html.ui2 .co-box, html.ui2 .co-kpi { border-radius: 10px !important; }
html.ui2 .ui2-coico { display: inline-flex; vertical-align: -3px; color: var(--b700); margin-right: 4px; }
/* akcni list (menu ... u radku mailu) */
html.ui2 .ui2-sheet { position: fixed; inset: 0; z-index: 4500; display: flex; align-items: flex-end; justify-content: center; }
html.ui2 .ui2-sheet[hidden] { display: none; }
html.ui2 .ui2-sheet-bg { position: absolute; inset: 0; background: rgba(22,28,28,.32); }
html.ui2 .ui2-sheet-p { position: relative; width: 100%; max-width: 520px; background: var(--g0); border-radius: 16px 16px 0 0; padding: 8px 8px calc(8px + env(safe-area-inset-bottom, 0px)); box-shadow: 0 -8px 30px rgba(22,28,28,.18); }
html.ui2 .ui2-sheet-t { padding: 10px 12px 8px; font-size: 13px; color: var(--g500); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-bottom: 1px solid var(--g200); margin-bottom: 4px; }
html.ui2 .ui2-sheet-p button { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 52px; padding: 0 12px; border: 0; background: none; color: var(--g900); font: 400 16px/22px "Inter", system-ui, sans-serif; border-radius: 10px; text-align: left; }
html.ui2 .ui2-sheet-p button:active { background: var(--g100); }
html.ui2 .ui2-sheet-p button .ui2-svg { color: var(--g700); }
html.ui2 .ui2-sheet-p .ui2-sheet-c { justify-content: center; color: var(--g700); margin-top: 4px; border-top: 1px solid var(--g200); border-radius: 0; }
/* composer: Uzavrit jako popsane obrysove tlacitko */
html.ui2 .modal-cc-thread .cc-reply-actions #cct-cancel { width: auto !important; padding: 0 12px !important; font-size: 13px !important; }
html.ui2 .modal-cc-thread .cc-reply-actions #cct-cancel::before { margin-right: 6px !important; }
/* editor (Trix): Lucide ikony 16 px, ghost tlacitka v jednom radku bez ramecku skupin */
html.ui2 .field trix-toolbar .trix-button-row { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; padding: 4px !important; gap: 2px; }
html.ui2 .field trix-toolbar .trix-button-group { border: 0 !important; margin: 0 6px 0 0 !important; background: none !important; gap: 2px; }
html.ui2 .field trix-toolbar .trix-button-group-spacer { display: none; }
html.ui2 .field trix-toolbar .trix-button { border: 0 !important; border-radius: 6px !important; width: 32px; min-width: 32px; height: 32px; padding: 0 !important; }
html.ui2 .field trix-toolbar .trix-button--icon::before { background: currentColor !important; opacity: 1 !important; inset: 8px !important; -webkit-mask: var(--ti) center / 16px 16px no-repeat; mask: var(--ti) center / 16px 16px no-repeat; }
html.ui2 .field trix-toolbar .trix-button.trix-active { color: var(--bink) !important; }
html.ui2 trix-toolbar .trix-button--icon-bold { --ti: var(--i-bold); } html.ui2 trix-toolbar .trix-button--icon-italic { --ti: var(--i-italic); }
html.ui2 trix-toolbar .trix-button--icon-strike { --ti: var(--i-strikethrough); } html.ui2 trix-toolbar .trix-button--icon-link { --ti: var(--i-link); }
html.ui2 trix-toolbar .trix-button--icon-heading-1 { --ti: var(--i-heading); } html.ui2 trix-toolbar .trix-button--icon-bullet-list { --ti: var(--i-list); }
html.ui2 trix-toolbar .trix-button--icon-number-list { --ti: var(--i-list-ordered); } html.ui2 trix-toolbar .trix-button--icon-decrease-nesting-level { --ti: var(--i-indent-decrease); }
html.ui2 trix-toolbar .trix-button--icon-increase-nesting-level { --ti: var(--i-indent-increase); } html.ui2 trix-toolbar .trix-button--icon-undo { --ti: var(--i-undo-2); }
html.ui2 trix-toolbar .trix-button--icon-redo { --ti: var(--i-redo-2); }
@media (max-width: 759px) { html.ui2 .field trix-toolbar .trix-button-group--history-tools { display: none !important; } }

/* AI karta: Navrh dalsiho kroku | text | Udelat v jednom radku */
html.ui2 #d-action { grid-template-columns: auto minmax(0, 1fr) auto !important; align-items: center !important; gap: 4px 12px !important; }
html.ui2 #d-action .act-head { grid-column: 1 !important; }
html.ui2 #d-action .act-body { grid-column: 2; }
html.ui2 #d-action .ui2-do { grid-column: 3; }
@media (max-width: 759px) { html.ui2 #d-action { grid-template-columns: minmax(0, 1fr) auto !important; } html.ui2 #d-action .act-head, html.ui2 #d-action .act-body { grid-column: 1 / -1 !important; } html.ui2 #d-action .ui2-do { grid-column: 2; } }
/* hover akce jen v 1. radku (nad casem), nezakryvaji predmet */
@media (hover: hover) and (pointer: fine) {
  html.ui2 .email-item .ei-row-actions { top: 9px; right: 12px; padding: 0; gap: 2px; box-shadow: none; background: var(--g0); border-radius: 6px; }
  html.ui2 .email-item.ui2-sel .ei-row-actions { background: var(--b50); }
  html.ui2 .email-item .ei-row-actions .mini-btn { width: 26px !important; height: 26px !important; min-width: 26px !important; min-height: 0 !important; border-color: transparent !important; background: transparent !important; }
  html.ui2 .email-item .ei-row-actions .mini-btn::before { width: 16px !important; height: 16px !important; }
  html.ui2 .email-item .ei-row-actions .mini-btn:hover { background: var(--g100) !important; }
}

/* ===== iterace 3 ===== */
/* stav AI u nadpisu: jen teal tecka, text v tooltipu */
html.ui2 #ui2-listhead .ui2-ch-top > .hb-box { flex: 0 0 auto; width: 20px !important; height: 20px; justify-content: center; cursor: help; }
html.ui2 #ui2-listhead .ui2-ch-top > .hb-box .hb-label { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
html.ui2 #ui2-listhead .ui2-title { flex: 1 1 auto; }
html.ui2 #ui2-listhead .ui2-ch-top { gap: 4px; }
/* hover akce: plocha skupina 24 px bez ramecku, pozadi jako radek, jen v 1. radku */
@media (hover: hover) and (pointer: fine) {
  html.ui2 .email-item .ei-row-actions { top: 10px !important; right: 14px !important; height: 24px; padding: 0 !important; gap: 0 !important; box-shadow: none !important; border-radius: 0 !important; background: var(--g50) !important; }
  html.ui2 .email-item.ui2-sel .ei-row-actions { background: var(--b50) !important; }
  html.ui2 .email-item .ei-row-actions .mini-btn { width: 24px !important; height: 24px !important; min-width: 24px !important; border: 0 !important; border-radius: 4px !important; }
  html.ui2 .email-item .ei-row-actions .mini-btn:hover { background: var(--g200) !important; }
}
/* chip prilohy draftu a toolbar editoru */
html.ui2 .draft-atts .draft-att .att-size, html.ui2 .draft-att .att-size { color: #4d5a5a !important; opacity: 1 !important; }
html.ui2 .field trix-toolbar .trix-button { color: #8a9696 !important; }
html.ui2 .field trix-toolbar .trix-button:hover { color: var(--g900) !important; }
html.ui2 .field trix-toolbar .trix-button.trix-active { color: var(--bink) !important; }
/* prilohy v detailu mailu vedle sebe */
html.ui2 #d-attachments { flex-direction: row !important; flex-wrap: wrap !important; align-items: stretch; }
html.ui2 #d-attachments .att-card { flex: 0 1 300px; min-width: 0; max-width: 340px; margin: 0 !important; width: auto !important; }
/* AI ukol: zdroj se orizne, pocet zprav ne */
html.ui2 .cc-item .ei-subject { display: flex; gap: 6px; min-width: 0; }
html.ui2 .cc-item .ui2-src { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.ui2 .cc-item .ui2-cnt { flex: none; white-space: nowrap; }
html.ui2 .cc-item .ui2-cnt::before { content: "·"; margin-right: 6px; }
html.ui2 #d-attachments .att-card { flex: 0 0 auto !important; max-width: 420px; }
html.ui2 #d-attachments .att-info, html.ui2 #d-attachments .att-link { min-width: 0; flex: 0 1 auto; }
html.ui2 #d-attachments .att-name { overflow: visible; text-overflow: clip; }
@media (max-width: 759px) { html.ui2 #d-attachments .att-card { flex: 1 1 100% !important; max-width: none; } html.ui2 #d-attachments .att-name { overflow: hidden; text-overflow: ellipsis; } }

/* ===== 14. 10. vecer: pripominky Tomase ===== */
/* znacka uctu v radku: barva uctu (H = Humanit, C = Consuela), nazev v tooltipu */
html.ui2 .email-item .acct-badge { width: 18px !important; height: 18px !important; min-width: 18px !important; border-radius: 5px !important; font: 700 11px/18px "Inter", system-ui, sans-serif !important; color: #10201f !important; }
html.ui2 .email-item .ei-from .acct-badge { display: inline-flex !important; align-items: center; justify-content: center; }

/* mobil: akce u mailu rovnou v radku (bez mezikliku na ...) */
@media (hover: none), (pointer: coarse) {
  html.ui2 .email-item .ui2-rowmore { display: none !important; }
  html.ui2 .email-item .ei-row-actions {
    position: static !important; display: flex !important; grid-column: 2; justify-content: flex-start !important; gap: 8px !important;
    margin: 8px 0 0 !important; padding: 0 !important; background: none !important; box-shadow: none !important; border-radius: 0 !important; height: auto !important;
  }
  html.ui2 .email-item .ei-row-actions .mini-btn {
    width: auto !important; min-width: 44px !important; height: 36px !important; padding: 0 12px !important; gap: 6px;
    border: 1px solid var(--g200) !important; border-radius: 8px !important; background: var(--g0) !important; color: var(--g700) !important;
  }
  html.ui2 .email-item .ei-row-actions .mini-btn::after { font: 500 13px/18px "Inter", system-ui, sans-serif; white-space: nowrap; }
  html.ui2 .email-item .ei-row-actions .mini-cc::after { content: "Předat AI" !important; }
  html.ui2 .email-item .ei-row-actions .mini-arch::after { content: "Hotovo" !important; display: inline !important; }
  html.ui2 .email-item .ei-row-actions .mini-rule::after { content: "Pravidlo" !important; }
  html.ui2 .email-item .ei-row-actions .mini-btn:active { background: var(--b50) !important; border-color: var(--b500) !important; color: var(--bink) !important; }
}

/* Nastaveni > Obecne */
html.ui2 #modal-settings .modal-body:has(.settings-tab[data-stab="ui2gen"]:not(.active)) #settings-pane-ui2gen { display: none; }
html.ui2 .ui2-gen { padding: 4px 0 20px; max-width: 640px; }
html.ui2 .ui2-gen + .ui2-gen { border-top: 1px solid var(--g200); padding-top: 20px; }
html.ui2 .ui2-gen h4 { margin: 0 0 4px; font: 600 16px/24px "Inter", system-ui, sans-serif; color: var(--g900); }
html.ui2 .ui2-gen-d { margin: 0 0 12px; font-size: 13px; line-height: 18px; color: var(--g500); }
html.ui2 .ui2-seg { display: inline-flex; padding: 3px; gap: 2px; border-radius: 10px; background: var(--g100); border: 1px solid var(--g200); }
html.ui2 .ui2-seg button { min-height: 36px; padding: 0 16px; border: 0; border-radius: 8px; background: none; color: var(--g700); font: 500 14px/20px "Inter", system-ui, sans-serif; cursor: pointer; }
html.ui2 .ui2-seg button.on { background: var(--g0); color: var(--g900); font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,.18); }
html.ui2 .ui2-gen-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }
html.ui2 .ui2-gen-b { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 12px; border: 1px solid var(--g200); border-radius: 8px; background: var(--g0); color: var(--g900); font: 500 14px/20px "Inter", system-ui, sans-serif; cursor: pointer; text-align: left; }
html.ui2 .ui2-gen-b span:not(.ui2-gen-i) { flex: 1 1 auto; }
html.ui2 .ui2-gen-b .ui2-svg:first-child { color: var(--b700); }
html.ui2 .ui2-gen-b .ui2-svg:last-child { color: var(--g500); }
html.ui2 .ui2-gen-b:hover { border-color: var(--b500); background: var(--b50); }

/* ===== TMAVY MOTIV (Nastaveni > Obecne > Vzhled; vychozi pro instanci 'ui_theme' v instance.php) ===== */
html.ui2.ui2-dark {
  --g0: #15191c; --g50: #1b2024; --g100: #22282d; --g200: #262d32; --g300: #353d44; --g500: #86919a; --g700: #b5bec4; --g900: #e4e9ec;
  --b50: #15302e; --b100: #1d4643; --bink: #8fe0dc; --b700: #4dbab6; --b800: #62c9c5;
  --ok-ink: #7fd3a0; --ok-bg: #16301f; --warn-ink: #f2b25c; --warn-bg: #2d2213; --err: #ff8d88; --err-bg: #3a1e1d; --info: #9cc3f2; --info-bg: #182636;
  --accent: #4dbab6; --on-accent: #0f1214;
  --ink-rgb: 238,243,243;
  color-scheme: dark;
}
html.ui2.ui2-dark, html.ui2.ui2-dark body { background: #0f1214 !important; }
html.ui2.ui2-dark #view-app { background: #0f1214; }
html.ui2.ui2-dark .modal-cc-thread, html.ui2.ui2-dark .modal-cc-runlog { --cct-ink: 228,233,236; --cct-panel: #15191c; --cct-panel-2: #15191c; --cct-teal: 77,186,182; --cct-violet: 77,186,182; }
html.ui2.ui2-dark .ui2-av { background: hsl(var(--av-h, 180), 22%, 24%); color: hsl(var(--av-h, 180), 40%, 84%); }
html.ui2.ui2-dark .ui2-av-ai { background: var(--b700); color: #fff; }
html.ui2.ui2-dark .ui2-av-sys { background: var(--g100); color: var(--g500); }
html.ui2.ui2-dark a { color: var(--bink); }
html.ui2.ui2-dark .ui2-btn-o { color: var(--bink) !important; border-color: var(--b700) !important; }
html.ui2.ui2-dark .ui2-btn-o:hover { background: var(--b50) !important; }
html.ui2.ui2-dark .tabbar .tab.active, html.ui2.ui2-dark .tabbar .tab.active .tab-lbl, html.ui2.ui2-dark .ui2-nav.active .ui2-svg { color: var(--bink) !important; }
html.ui2.ui2-dark .tabbar .tab-badge, html.ui2.ui2-dark .tabbar .tab.active .tab-badge, html.ui2.ui2-dark #tab-cc .tab-badge { background: var(--b700) !important; color: #fff !important; }
html.ui2.ui2-dark.has-brand-logo .ui2-brand-logo { background: var(--brand-logo) left center / contain no-repeat !important; -webkit-mask: none !important; mask: none !important; }
html.ui2.ui2-dark .toast, html.ui2.ui2-dark .co-toast, html.ui2.ui2-dark .toast.success { background: #2c3737 !important; color: #eef3f3 !important; box-shadow: 0 8px 24px rgba(0,0,0,.5) !important; }
html.ui2.ui2-dark .ui2-orig.ui2-open > .chat-context-body { color: #161c1c !important; }
html.ui2.ui2-dark .email-item .ei-row-actions { box-shadow: none; }
html.ui2.ui2-dark .ui2-sheet-bg { background: rgba(0,0,0,.55); }
html.ui2.ui2-dark .field trix-toolbar .trix-button { color: var(--g500) !important; }
html.ui2.ui2-dark .field trix-toolbar .trix-button:hover { color: var(--g900) !important; }
html.ui2.ui2-dark .draft-atts .draft-att .att-size, html.ui2.ui2-dark .draft-att .att-size { color: var(--g500) !important; }
html.ui2.ui2-dark *:focus-visible { outline-color: var(--b500) !important; }
html.ui2.ui2-dark input, html.ui2.ui2-dark textarea, html.ui2.ui2-dark select { color: var(--g900); }

/* ===== 15. 10.: pripominky Tomase (ucty, draft, nastaveni, tmava plna tlacitka) ===== */
/* tmavy motiv: plna tlacitka teal #4dbab6 s tmavym textem (bily na #2c7f7c mel v tmavem jen 3,7:1) */
html.ui2.ui2-dark #btn-cc-from-email, html.ui2.ui2-dark #dr-send, html.ui2.ui2-dark #ui2-send-close, html.ui2.ui2-dark #cmp-send, html.ui2.ui2-dark #re-save, html.ui2.ui2-dark #kbe-save, html.ui2.ui2-dark #hbe-save,
html.ui2.ui2-dark #kbft-save-me, html.ui2.ui2-dark #dr-redo-send, html.ui2.ui2-dark #slt-reply-send, html.ui2.ui2-dark #dp-save-here, html.ui2.ui2-dark #pf-act-create, html.ui2.ui2-dark #secret-save,
html.ui2.ui2-dark .co-overlay .co-btn:not(.ghost):not(.danger):not(.sm), html.ui2.ui2-dark #fab-cc-new { color: #0f1214 !important; }
html.ui2.ui2-dark #fab-cc-new::before { background: #0f1214 !important; }
html.ui2.ui2-dark .tabbar .tab-badge, html.ui2.ui2-dark .tabbar .tab.active .tab-badge, html.ui2.ui2-dark #tab-cc .tab-badge, html.ui2.ui2-dark .ui2-tts .fab-badge { color: #0f1214 !important; }

/* ucty: prepinac jednim klikem misto roletky (do 4 uctu) */
html.ui2 .ui2-accts { display: none; }
html.ui2 .ui2-ch-row.ui2-seg-on .ui2-acct { display: none !important; }
html.ui2 .ui2-ch-row.ui2-seg-on .ui2-accts { display: flex; gap: 2px; padding: 3px; border-radius: 10px; background: var(--g100); border: 1px solid var(--g200); width: 100%; }
html.ui2 .ui2-acct-b { flex: 1 1 0; min-width: 0; display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 30px; padding: 0 8px; border: 0; border-radius: 7px; background: none; color: var(--g700); font: 500 13px/18px "Inter", system-ui, sans-serif; cursor: pointer; white-space: nowrap; }
html.ui2 .ui2-acct-b span:last-child { overflow: hidden; text-overflow: ellipsis; }
html.ui2 .ui2-acct-b:hover { color: var(--g900); }
html.ui2 .ui2-acct-b.on { background: var(--g0); color: var(--g900); font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,.14); }
html.ui2 .ui2-acct-bd { flex: none; width: 16px; height: 16px; border-radius: 4px; background: var(--acct); color: #10201f; font: 700 10px/16px "Inter", system-ui, sans-serif; text-align: center; }

/* draft: Odeslat a uzavrit = hlavni akce, Odeslat obrysove */
html.ui2 #dr-send { background: var(--g0) !important; color: var(--g900) !important; border-color: var(--g300) !important; font-weight: 500 !important; }
html.ui2 #dr-send:hover { background: var(--g50) !important; border-color: var(--g500) !important; }
html.ui2.ui2-dark #dr-send { color: var(--g900) !important; }
html.ui2 #ui2-send-close { background: var(--b700) !important; color: #fff !important; border-color: var(--b700) !important; font-weight: 600 !important; }
html.ui2 #ui2-send-close:hover { background: var(--b800) !important; border-color: var(--b800) !important; }
html.ui2 .draft-card .draft-foot { flex-wrap: wrap; }
@media (max-width: 759px) { html.ui2 #ui2-send-close { flex: 1 1 100%; } }


/* Nastaveni: Tokeny a Notifikace nejsou zalozky; Sprava firmy nahore vyrazne */
html.ui2 .settings-tab.ui2-hide { display: none !important; }
html.ui2 #ui2-gen-notif #settings-pane-notif { display: block !important; padding: 0; }
html.ui2 .ui2-gen-adm { max-width: 760px; padding: 16px; margin-bottom: 20px; border: 1px solid var(--g200); border-radius: 12px; background: var(--g0); }
html.ui2 .ui2-gen-adm + .ui2-gen { border-top: 0; padding-top: 4px; }
html.ui2 .ui2-gen-hd { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 14px; }
html.ui2 .ui2-gen-hd > .ui2-svg { color: var(--b700); margin-top: 2px; }
html.ui2.ui2-dark .ui2-gen-hd > .ui2-svg { color: var(--b500); }
html.ui2 .ui2-gen-adm .ui2-gen-grid { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
html.ui2 .ui2-gen-adm .ui2-gen-b { min-height: 60px; padding: 10px 12px; align-items: center; }
html.ui2 .ui2-gen-i { flex: none; width: 36px; height: 36px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; background: var(--b50); color: var(--bink); }
html.ui2 .ui2-gen-t { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
html.ui2 .ui2-gen-t b { font: 600 14px/20px "Inter", system-ui, sans-serif; color: var(--g900); }
html.ui2 .ui2-gen-t small { font-size: 12px; line-height: 16px; color: var(--g500); }

/* toast s akci (Zpet po archivaci): style.css ma pointer-events none -> tlacitko neslo stisknout */
html.ui2 .toast.show, html.ui2 .toast-action { pointer-events: auto !important; }
html.ui2 .draft-card .draft-foot #ui2-send-close { order: -2; }

/* ===== 15. 10.: SEZNAMY podle vitezne varianty (Fable: schranka A+D, AI ukoly F) =====
   Schranka: radek, ktery neco chce (stav nebo neprectene) = plny s barevnym prouzkem; FYI / Hotovo = sede shrnuti bez prouzku, stejna vyska.
   AI ukoly: stav je barevne slovo nahore, bez ikon a pilulek, razeno podle nalehavosti. */
html.ui2 { --rl-wait: #e0962b; --rl-work: #3b6fa0; --rl-draft: #4dbab6; --rl-err: #c9403c; }
html.ui2.ui2-dark { --rl-wait: #f2b25c; --rl-work: #9cc3f2; --rl-draft: #4dbab6; --rl-err: #ff8d88; }

html.ui2 .email-item {
  grid-template-columns: 28px minmax(0, 1fr) !important; column-gap: 12px !important; row-gap: 2px !important;
  padding: 10px 16px 10px 13px !important; border-left: 3px solid transparent !important; border-bottom: 1px solid var(--g200) !important;
}
html.ui2 .email-item:hover { background: var(--g50) !important; }
html.ui2 .email-item.ui2-sel { background: var(--b50) !important; border-left-color: var(--b500) !important; }
html.ui2 .email-item.ui2-row-wait { border-left-color: var(--rl-wait) !important; }
html.ui2 .email-item.ui2-row-draft { border-left-color: var(--rl-draft) !important; }
html.ui2 .email-item.ui2-row-work { border-left-color: var(--rl-work) !important; }
html.ui2 .email-item.ui2-row-err { border-left-color: var(--rl-err) !important; }
html.ui2 .email-item.unread::after { left: 4px !important; top: 17px !important; }
html.ui2 .email-item > .ui2-av { grid-row: 1 / span 3 !important; width: 28px !important; height: 28px !important; margin-top: 2px; font-size: 11px; background: var(--g100) !important; color: var(--g700) !important; }
html.ui2 .email-item .ei-from { font: 500 14px/20px "Inter", system-ui, sans-serif !important; color: var(--g700) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.ui2 .email-item.unread .ei-from { font-weight: 600 !important; color: var(--g900) !important; }
html.ui2 .email-item .ei-from .acct-badge { width: 16px !important; height: 16px !important; min-width: 16px !important; border-radius: 4px !important; font: 700 10px/16px "Inter", system-ui, sans-serif !important;
  background: color-mix(in srgb, var(--acct, #4dbab6) 24%, var(--g0)) !important; color: color-mix(in srgb, var(--acct, #4dbab6) 55%, #000) !important; }
html.ui2.ui2-dark .email-item .ei-from .acct-badge { background: color-mix(in srgb, var(--acct, #4dbab6) 22%, var(--g0)) !important; color: var(--acct, #4dbab6) !important; }
html.ui2 .ui2-acct-bd { background: color-mix(in srgb, var(--acct) 24%, var(--g0)) !important; color: color-mix(in srgb, var(--acct) 55%, #000) !important; }
html.ui2.ui2-dark .ui2-acct-bd { background: color-mix(in srgb, var(--acct) 22%, var(--g0)) !important; color: var(--acct) !important; }
html.ui2 .email-item .ei-subject { display: flex !important; align-items: center; gap: 8px; min-width: 0; font: 400 13px/18px "Inter", system-ui, sans-serif !important; color: var(--g900) !important; white-space: normal !important; overflow: visible !important; }
html.ui2 .email-item .ei-subject .ui2-subj { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.ui2 .email-item.unread .ei-subject .ui2-subj { font-weight: 500; }
html.ui2 .email-item .ei-subject .cc-indicator { flex: none; height: 18px !important; padding: 0 8px !important; border-radius: 9px !important; }
html.ui2 .email-item .ei-summary {
  margin: 2px 0 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: none !important;
  color: var(--g700) !important; font: 400 13px/18px "Inter", system-ui, sans-serif !important; max-height: 36px; -webkit-line-clamp: 2 !important;
}
html.ui2 .email-item .ui2-ai { display: inline-flex; vertical-align: -1px; margin-right: 6px; color: var(--g500); }
html.ui2 .email-item .ui2-ai .ui2-svg { width: 12px; height: 12px; }
html.ui2 .email-item .ui2-ai-fyi { font: 700 10px/14px "Inter", system-ui, sans-serif; letter-spacing: .04em; color: var(--g500); vertical-align: 0; }
html.ui2 .ui2-pill-done { background: var(--g100) !important; color: var(--g500) !important; }
html.ui2 .ui2-pill-err { background: var(--err-bg) !important; color: var(--err) !important; }
html.ui2 .email-item.ui2-fyi .ei-summary { color: var(--g500) !important; }
/* 15. 10. vecer (Tomas): vsechny radky stejne - bez avataru, stejna vyska po precteni i po obnoveni;
   shrnuti AI kurzivou (mene dulezite nez jmeno a predmet) */
html.ui2 .email-item { grid-template-columns: 0 minmax(0, 1fr) !important; column-gap: 0 !important; }
html.ui2 .email-item > .ui2-av { display: none !important; }
html.ui2 .email-item .ei-summary { font-style: italic !important; }
html.ui2 .email-item .ui2-ai { font-style: normal; }
html.ui2 .email-item:is(.ui2-fyi, .ui2-row-done, .ui2-row-off):not(.ui2-sel) { border-left-color: transparent !important; }
@media (hover: hover) and (pointer: fine) {
  html.ui2 .email-item:hover .ei-subject > .cc-indicator { visibility: hidden; }
}
/* mobil: akce dal jednim klepnutim, ale vizualne ustoupi */
@media (hover: none), (pointer: coarse) {
  html.ui2 .email-item .ei-row-actions { grid-column: 2 !important; justify-content: flex-end !important; gap: 4px !important; margin: 2px 0 0 !important; }
  html.ui2 .email-item .ei-row-actions .mini-btn { min-width: 44px !important; height: 32px !important; padding: 0 10px !important; border: 0 !important; background: none !important; color: var(--g500) !important; }
  html.ui2 .email-item .ei-row-actions .mini-btn::after { font: 500 12px/16px "Inter", system-ui, sans-serif !important; }
  html.ui2 .email-item .ei-summary { -webkit-line-clamp: 2 !important; max-height: 36px !important; }
  html.ui2 #inbox-list { padding-bottom: 88px; }
}

/* AI ukoly */
html.ui2 .cc-item { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; grid-template-rows: auto auto auto; column-gap: 12px !important; row-gap: 2px !important; align-items: center;
  padding: 10px 16px 10px 13px !important; border-left: 3px solid transparent !important; border-bottom: 1px solid var(--g200) !important; opacity: 1 !important; }
html.ui2 .cc-item.ui2-sel { background: var(--b50) !important; border-left-color: var(--b500) !important; }
html.ui2 .cc-item .ei-row1 { display: contents !important; }
html.ui2 .cc-item > .ui2-sti { grid-column: 1; grid-row: 1; display: inline-flex !important; align-items: center; gap: 6px; width: auto !important; height: auto !important; margin: 0 !important; background: none !important;
  font: 700 11px/16px "Inter", system-ui, sans-serif; letter-spacing: .04em; text-transform: uppercase; }
html.ui2 .ui2-sti.ui2-st-wait { color: var(--warn-ink) !important; }
html.ui2 .ui2-sti.ui2-st-draft { color: var(--bink) !important; }
html.ui2 .ui2-sti.ui2-st-work { color: var(--info) !important; }
html.ui2 .ui2-sti.ui2-st-work::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--info); animation: ui2-pulse 1.6s ease-in-out infinite; }
html.ui2 .ui2-sti.ui2-st-err { color: var(--err) !important; }
html.ui2 .ui2-sti.ui2-st-done, html.ui2 .ui2-sti.ui2-st-off { color: var(--g500) !important; }
@keyframes ui2-pulse { 0%, 100% { opacity: .35; } 50% { opacity: 1; } }
html.ui2 .cc-item .ei-date { grid-column: 2 !important; grid-row: 1; font: 400 12px/16px "Inter", system-ui, sans-serif; color: var(--g500) !important; white-space: nowrap; font-variant-numeric: tabular-nums; }
html.ui2 .cc-item .ei-from { grid-column: 1 !important; grid-row: 2; min-width: 0; font: 600 14px/20px "Inter", system-ui, sans-serif !important; color: var(--g900) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.ui2 .cc-item .ei-subject { grid-column: 1 !important; grid-row: 3; font-size: 12px !important; line-height: 16px !important; }
html.ui2 .cc-item .ui2-src { color: var(--g700); }
html.ui2 .cc-item .status-row { grid-column: 2 !important; grid-row: 2 / span 2 !important; }
html.ui2 .cc-item .status-row .status-pill, html.ui2 .cc-item .status-row .cc-indicator { display: none !important; }
html.ui2 .cc-item .cc-from-mail { width: 36px !important; height: 36px !important; border: 0 !important; background: none !important; color: var(--g500) !important; border-radius: 8px; }
html.ui2 .cc-item .cc-from-mail:hover { background: var(--g100) !important; color: var(--bink) !important; }
html.ui2 .cc-item:is([data-st="done"], [data-st="off"]) { grid-template-rows: auto auto; }
html.ui2 .cc-item:is([data-st="done"], [data-st="off"]) > .ui2-sti { display: none !important; }
html.ui2 .cc-item:is([data-st="done"], [data-st="off"]) .ei-from { grid-row: 1; font-weight: 500 !important; color: var(--g700) !important; }
html.ui2 .cc-item:is([data-st="done"], [data-st="off"]) .ei-subject { grid-row: 2; }
html.ui2 .cc-item:is([data-st="done"], [data-st="off"]) .status-row { grid-row: 2 !important; margin: -10px 0 -8px !important; }
html.ui2 .cc-item:is([data-st="done"], [data-st="off"]) .ui2-src { color: var(--g500); }
html.ui2 .cc-item .ui2-stw { flex: none; font: 700 10px/16px "Inter", system-ui, sans-serif; letter-spacing: .04em; text-transform: uppercase; color: var(--g500); }
html.ui2 .cc-item .ui2-stw::after { content: "·"; margin-left: 6px; }
html.ui2 .cc-item > .ui2-sti { justify-self: start !important; justify-content: flex-start !important; }
/* osobni instance (bez firemniho rezimu): tlacitko uzivatele nema co otevrit */
html.ui2:not(.co-mode) #ui2-user { display: none !important; }

/* 16. 10. (Tomas): prohlizec prilohy nesel zavrit - ui2 odstranil z tlacitka znak X a zustalo prazdne. */
html.ui2 .att-viewer-close { display: inline-flex !important; align-items: center; gap: 6px; width: auto !important; min-width: 44px; height: 36px; padding: 0 12px !important;
  border-radius: 8px !important; background: var(--g100) !important; color: var(--g900) !important; font: 600 14px/20px "Inter", system-ui, sans-serif; }
html.ui2 .att-viewer-close:empty::before { content: "\2715  Zavřít"; white-space: pre; pointer-events: none; }
/* prilohy k odpovedi AI (16. 10.) */
html.ui2 .cct-files { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
html.ui2 .cct-file-chip { display: inline-flex; align-items: center; gap: 4px; padding: 2px 4px 2px 10px; border-radius: 999px; background: var(--g100); color: var(--g900); font-size: 12px; }
html.ui2 .cct-file-chip button { border: 0; background: none; color: var(--g500); width: 24px; height: 24px; border-radius: 50%; cursor: pointer; font-size: 16px; line-height: 1; }
/* projekty firmy v pickeru (16. 10.) */
html.ui2 .pp-item .pp-row1 { display: flex; align-items: center; gap: 8px; }
html.ui2 .pp-item .pp-row1 .pp-name { flex: 1 1 auto; min-width: 0; }
html.ui2 .pp-item .pp-edit { flex: none; height: 28px; padding: 0 10px !important; font-size: 12px !important; }
/* navod Jak zacit (16. 10.) */
html.ui2 .ui2-guide details { border-top: 1px solid var(--g200); }
html.ui2 .ui2-guide details:last-of-type { border-bottom: 1px solid var(--g200); }
html.ui2 .ui2-guide summary { cursor: pointer; padding: 10px 0; font: 500 14px/20px "Inter", system-ui, sans-serif; color: var(--g900); }
html.ui2 .ui2-guide details p { margin: 0 0 12px; font-size: 13px; line-height: 20px; color: var(--g700); max-width: 680px; }
html.ui2 .ui2-guide code { padding: 1px 6px; border-radius: 4px; background: var(--g100); font-size: 12px; }
/* 16. 10. (Tomas): naseptavac adres v psani mailu mel napevno tmave pozadi -> ve svetlem motivu tmave na tmavem */
html.ui2 .ac-dropdown { background: var(--g0) !important; border: 1px solid var(--g200) !important; box-shadow: 0 8px 24px rgba(16,24,24,.14) !important; }
html.ui2 .ac-item { border-bottom-color: var(--g100) !important; color: var(--g900); }
html.ui2 .ac-item:hover, html.ui2 .ac-item.active, html.ui2 .ac-item.sel { background: var(--b50) !important; }
html.ui2 .ac-name { color: var(--g900) !important; }
html.ui2 .ac-email { color: var(--g700) !important; }
html.ui2 .ac-meta { color: var(--g500) !important; }
/* stranka Projekty (16. 10., assets/projects.js) */
html.ui2 #modal-projects .pj-panel { max-width: 920px; }
html.ui2 .pj-intro { margin: 0 0 10px; font-size: 13px; line-height: 20px; color: var(--g700); max-width: 700px; }
html.ui2 .pj-arch-tg { display: inline-flex; gap: 6px; align-items: center; margin-bottom: 12px; font-size: 13px; color: var(--g700); }
html.ui2 .pj-list { display: flex; flex-direction: column; gap: 12px; }
html.ui2 .pj-card { padding: 14px 16px; border: 1px solid var(--g200); border-radius: 12px; background: var(--g0); }
html.ui2 .pj-card.pj-archived { opacity: .7; }
html.ui2 .pj-hd { display: flex; gap: 12px; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; }
html.ui2 .pj-tt h4 { margin: 0; font: 600 16px/22px "Inter", system-ui, sans-serif; color: var(--g900); }
html.ui2 .pj-dir { font-size: 12px; color: var(--g500); background: none; padding: 0; }
html.ui2 .pj-badge { font: 600 11px/16px "Inter", system-ui, sans-serif; padding: 1px 6px; border-radius: 4px; background: var(--g100); color: var(--g500); vertical-align: 2px; }
html.ui2 .pj-act { display: flex; gap: 6px; flex-wrap: wrap; }
html.ui2 .pj-desc { margin: 8px 0 0; font-size: 13px; line-height: 20px; color: var(--g700); white-space: pre-wrap; }
html.ui2 .pj-muted { color: var(--g500); font-style: italic; }
html.ui2 .pj-disk { margin-top: 8px; font-size: 12px; color: var(--g700); }
html.ui2 .pj-disk small { color: var(--g500); }
html.ui2 .pj-files { margin-top: 6px; font-size: 12px; }
html.ui2 .pj-files summary { cursor: pointer; color: var(--bink); }
html.ui2 .pj-files ul { margin: 6px 0 0; padding: 0; list-style: none; max-height: 260px; overflow: auto; border-top: 1px solid var(--g100); }
html.ui2 .pj-files li { display: flex; justify-content: space-between; gap: 12px; padding: 4px 0; border-bottom: 1px solid var(--g100); color: var(--g900); }
html.ui2 .pj-files li small { color: var(--g500); white-space: nowrap; }
html.ui2 .pj-edit { margin-top: 12px; display: flex; flex-direction: column; gap: 8px; }
html.ui2 .pj-edit.hidden { display: none; }
html.ui2 .pj-edit label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--g700); }
html.ui2 .pj-edit input, html.ui2 .pj-edit textarea { font: 400 14px/20px "Inter", system-ui, sans-serif; padding: 8px 10px; border: 1px solid var(--g300); border-radius: 8px; background: var(--g0); color: var(--g900); }
html.ui2 .pj-edit-f { display: flex; gap: 8px; }
html.ui2 .pj-empty { display: flex; flex-direction: column; gap: 4px; padding: 24px; text-align: center; color: var(--g700); border: 1px dashed var(--g300); border-radius: 12px; }
html.ui2 .pj-empty b { color: var(--g900); }
/* krizek Zavrit: ui2 u nekterych dialogu (priloha, Projekty) odstrani znak a tlacitko zustane prazdne */
html.ui2 .iconbtn[data-close]:empty::before { content: "\2715"; font-size: 16px; line-height: 1; pointer-events: none; }

/* ===== opravy z testu 16. 10. odpoledne ===== */
/* ikonova tlacitka se tridou hidden (koš u neuzavreneho ukolu) */
html.ui2 .ui2-ionly.hidden, html.ui2 .iconbtn.hidden { display: none !important; }
/* Zpet na uzkem displeji: rozsirena klikaci plocha (::after inset) se pri position:static roztahla pres cely panel */
@media (max-width: 759px) { html.ui2 .modal-head > .ui2-back { position: relative !important; } }
/* naseptavac adres: normalni pismo (dedil VELKA PISMENA z .field span) */
html.ui2 .ac-dropdown span { text-transform: none !important; letter-spacing: normal !important; }
/* nahled prilohy: nazev souboru na tmave hlavicce */
html.ui2 .att-viewer-title { color: #fff !important; }
/* Slack ve svetlem motivu (barvy napevno pro tmavy) */
html.ui2 .slack-item { border-bottom-color: var(--g200) !important; }
html.ui2 .slack-item:hover { background: var(--g50) !important; }
html.ui2 .slack-item .item-preview { color: var(--g700) !important; }
html.ui2 .slack-item .item-suggestion { color: var(--bink) !important; }
html.ui2 .slack-status-pill { background: var(--g100) !important; color: var(--g700) !important; }
html.ui2 .slack-status-pill.status-new { background: var(--b50) !important; color: var(--bink) !important; }

/* ===== Ulozit na Google Disk (17. 10. 2026, prepracovano) ===== */
html.ui2 #modal-drive-picker .dp-panel { width: min(560px, 100vw) !important; max-height: min(720px, 92vh); display: flex; flex-direction: column; }
html.ui2 #modal-drive-picker .dp-head { align-items: flex-start; gap: 12px; padding: 18px 20px 14px !important; }
html.ui2 #modal-drive-picker .dp-head-t { flex: 1 1 auto; min-width: 0; }
html.ui2 #modal-drive-picker .dp-head h3 { margin: 0 0 6px; font: 600 18px/24px "Inter", system-ui, sans-serif; color: var(--g900); }
html.ui2 #modal-drive-picker .dp-file { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 4px 10px 4px 8px; border-radius: 6px; background: var(--g100); color: var(--g700); font: 500 13px/18px "Inter", system-ui, sans-serif; }
html.ui2 #modal-drive-picker .dp-file.dp-file-note { background: none; padding: 0; font-weight: 400; }
html.ui2 #modal-drive-picker .dp-file-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.ui2 #modal-drive-picker .dp-file-ico { display: inline-flex; color: var(--g500); flex: none; }
html.ui2 #modal-drive-picker .dp-body { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; gap: 14px; padding: 4px 20px 8px !important; overflow: hidden; }
html.ui2 #modal-drive-picker .dp-sec { display: flex; align-items: center; gap: 6px; margin: 0 0 8px; padding: 0 !important; border: 0 !important; background: none !important;
  font: 600 12px/16px "Inter", system-ui, sans-serif !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--g500) !important; }
html.ui2 #modal-drive-picker .dp-sec .dp-svg { color: var(--rl-wait); }
html.ui2 #modal-drive-picker .dp-favorites { margin: 0; }
html.ui2 #modal-drive-picker .dp-favorites.hidden { display: none; }
html.ui2 #modal-drive-picker .dp-fav-grid { display: flex; flex-wrap: wrap; gap: 8px; }
html.ui2 #modal-drive-picker .dp-fav-chip { display: inline-flex; align-items: center; gap: 6px; max-width: 220px; height: 34px; padding: 0 12px; border-radius: 17px;
  border: 1px solid var(--g200); background: var(--g0); color: var(--g900); font: 500 13px/18px "Inter", system-ui, sans-serif; cursor: pointer; transform: none !important; }
html.ui2 #modal-drive-picker .dp-fav-chip .dp-svg { color: var(--g500); flex: none; }
html.ui2 #modal-drive-picker .dp-fav-chip:hover { border-color: var(--g300); background: var(--g50); }
html.ui2 #modal-drive-picker .dp-fav-chip.dp-sel { border-color: var(--b500); background: var(--b50); color: var(--bink); }
html.ui2 #modal-drive-picker .dp-fav-chip.dp-sel .dp-svg { color: var(--bink); }
html.ui2 #modal-drive-picker .dp-fav-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.ui2 #modal-drive-picker .dp-browse { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; gap: 8px; }
html.ui2 #modal-drive-picker .dp-loc { display: flex; align-items: center; gap: 6px; min-height: 32px; }
html.ui2 #modal-drive-picker .dp-up { flex: none; width: 32px; height: 32px; border: 0; border-radius: 8px; background: none; color: var(--g700); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
html.ui2 #modal-drive-picker .dp-up:hover:not(:disabled) { background: var(--g100); }
html.ui2 #modal-drive-picker .dp-up:disabled { opacity: .35; cursor: default; }
html.ui2 #modal-drive-picker .drive-breadcrumb { display: flex; align-items: center; gap: 2px; min-width: 0; flex-wrap: nowrap; overflow: hidden; padding: 0 !important; margin: 0 !important; background: none !important; border: 0 !important; }
html.ui2 #modal-drive-picker .dp-bc-item { flex: 0 1 auto; min-width: 0; max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 4px 6px; border: 0; border-radius: 6px; background: none;
  font: 500 14px/20px "Inter", system-ui, sans-serif; color: var(--g700); }
html.ui2 #modal-drive-picker button.dp-bc-link { cursor: pointer; color: var(--g700); }
html.ui2 #modal-drive-picker button.dp-bc-link:hover { background: var(--g100); color: var(--g900); text-decoration: none; }
html.ui2 #modal-drive-picker .dp-bc-current { font-weight: 600; color: var(--g900); }
html.ui2 #modal-drive-picker .dp-bc-sep { display: inline-flex; color: var(--g300); opacity: 1; padding: 0; flex: none; }
html.ui2 #modal-drive-picker .dp-search { width: 100%; height: 38px; padding: 0 12px 0 36px !important; border: 1px solid var(--g200) !important; border-radius: 8px !important; background: var(--g0) !important; color: var(--g900) !important;
  font: 400 14px/20px "Inter", system-ui, sans-serif !important; box-shadow: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236e7a79' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: 12px center !important; }
html.ui2 #modal-drive-picker .dp-search:focus { border-color: var(--b500) !important; outline: none; }
html.ui2 #modal-drive-picker .dp-status { font-size: 13px; color: var(--g500); }
html.ui2 #modal-drive-picker .dp-status:empty { display: none; }
html.ui2 #modal-drive-picker .drive-folder-list { flex: 1 1 auto; min-height: 120px; max-height: none !important; overflow-y: auto; display: block; margin: 0 -8px; padding: 0 8px; }
/* radky: zrusit kartickovy vzhled z ui2.css (#dp-folders > *) */
html.ui2 #modal-drive-picker #dp-folders > * { margin: 0 !important; border: 0 !important; box-shadow: none !important; background: none !important; border-radius: 8px !important; padding: 0 !important; min-height: 0 !important; }
html.ui2 #modal-drive-picker .dp-row { display: flex !important; align-items: center; gap: 0; opacity: 1; }
html.ui2 #modal-drive-picker .dp-pick { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 12px; height: 44px; padding: 0 8px 0 10px; border: 0; border-radius: 8px; background: none; color: var(--g900); text-align: left; cursor: pointer; font: 400 14px/20px "Inter", system-ui, sans-serif; }
html.ui2 #modal-drive-picker .dp-pick:hover { background: var(--g50); }
html.ui2 #modal-drive-picker .dp-row.dp-sel .dp-pick { background: var(--b50); color: var(--bink); }
html.ui2 #modal-drive-picker .dp-ico { flex: none; width: 20px; display: inline-flex; justify-content: center; color: var(--g500); }
html.ui2 #modal-drive-picker .dp-ico-folder { color: var(--b700); }
html.ui2.ui2-dark #modal-drive-picker .dp-ico-folder { color: var(--b500); }
html.ui2 #modal-drive-picker .dp-folder-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
html.ui2 #modal-drive-picker .dp-date { flex: none; font-size: 12px; color: var(--g500); font-variant-numeric: tabular-nums; }
html.ui2 #modal-drive-picker .dp-check { flex: none; display: none; color: var(--bink); }
html.ui2 #modal-drive-picker .dp-row.dp-sel .dp-check { display: inline-flex; }
html.ui2 #modal-drive-picker .dp-row.dp-sel .dp-date { display: none; }
html.ui2 #modal-drive-picker .dp-open { flex: none; width: 40px; height: 44px; border: 0; border-radius: 8px; background: none; color: var(--g500); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
html.ui2 #modal-drive-picker .dp-open:hover { background: var(--g100); color: var(--g900); }
html.ui2 #modal-drive-picker .dp-row-file { height: 36px; padding: 0 10px !important; gap: 12px; color: var(--g500); font-size: 13px; }
html.ui2 #modal-drive-picker .dp-row-file .dp-folder-name { font-weight: 400; color: var(--g700); }
html.ui2 #modal-drive-picker #dp-folders > .dp-sec { margin: 12px 0 4px 10px !important; }
html.ui2 #modal-drive-picker #dp-folders > .dp-sec:first-child { margin-top: 2px !important; }
html.ui2 #modal-drive-picker .dp-more { padding: 6px 10px; font-size: 12px; }
html.ui2 #modal-drive-picker .dp-skel { height: 44px; padding: 0 10px !important; gap: 12px; }
html.ui2 #modal-drive-picker .dp-skel .dp-ico { height: 18px; border-radius: 4px; background: var(--g100); }
html.ui2 #modal-drive-picker .dp-skel-bar { flex: 0 1 220px; height: 12px; border-radius: 6px; background: var(--g100); animation: ui2-pulse 1.4s ease-in-out infinite; }
html.ui2 #modal-drive-picker .dp-empty { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 28px 12px; text-align: center; color: var(--g500); }
html.ui2 #modal-drive-picker .dp-empty b { color: var(--g900); font-weight: 600; }
html.ui2 #modal-drive-picker .dp-newrow { display: flex; align-items: center; gap: 8px; padding: 6px 8px 6px 10px; border: 1px solid var(--b500); border-radius: 8px; background: var(--b50); }
html.ui2 #modal-drive-picker .dp-newrow.hidden { display: none; }
html.ui2 #modal-drive-picker .dp-newrow input { flex: 1 1 auto; min-width: 0; height: 32px; padding: 0 8px; border: 0 !important; background: var(--g0) !important; border-radius: 6px !important; color: var(--g900); font: 400 14px/20px "Inter", system-ui, sans-serif; }
html.ui2 #modal-drive-picker .dp-foot { display: flex !important; align-items: center; gap: 8px; padding: 12px 20px !important; border-top: 1px solid var(--g200); }
html.ui2 #modal-drive-picker .dp-foot .btn { flex: none !important; min-width: 0 !important; }
html.ui2 #modal-drive-picker .dp-foot-sp { flex: 1 1 auto; }
html.ui2 #modal-drive-picker .dp-save { max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.ui2 #modal-drive-picker .dp-reconsent { padding: 16px; border-radius: 10px; background: var(--g50); border: 1px solid var(--g200); color: var(--g900); }
html.ui2 #modal-drive-picker .dp-reconsent-msg { color: var(--g700) !important; }
@media (max-width: 759px) {
  html.ui2 #modal-drive-picker .dp-panel { width: 100vw !important; max-height: 100dvh; }
  html.ui2 #modal-drive-picker .dp-foot { flex-wrap: wrap; }
  html.ui2 #modal-drive-picker .dp-foot [data-close] { display: none; }
  html.ui2 #modal-drive-picker .dp-save { flex: 1 1 100% !important; max-width: none; order: -1; height: 44px; }
}
html.ui2 #modal-drive-picker .dp-fav-chip { height: 34px !important; min-height: 0 !important; padding: 0 12px !important; border-radius: 17px !important; }
@media (max-width: 759px) {
  html.ui2 #modal-drive-picker .dp-foot .dp-save { flex: 1 1 100% !important; max-width: none !important; }
  html.ui2 #modal-drive-picker .dp-foot #dp-new-folder { flex: 1 1 auto !important; }
  html.ui2 #modal-drive-picker .dp-foot-sp { display: none; }
}
/* detail mailu na tabletu (760-1099 px): panel je uzky, akce jako na mobilu v jednom radku (Predat AI s popiskem, ostatni ikony s tooltipem) */
@media (min-width: 760px) and (max-width: 1099px) {
  html.ui2 #modal-email .ui2-actionbar { flex-wrap: nowrap; gap: 6px; padding: 10px 16px !important; }
  html.ui2 #modal-email .ui2-actionbar .btn:not(#btn-cc-from-email) { font-size: 0 !important; width: 40px; min-width: 40px !important; padding: 0 !important; flex: 0 0 40px !important; }
  html.ui2 #modal-email .ui2-actionbar .btn:not(#btn-cc-from-email)::before { margin: 0 !important; width: 18px; height: 18px; }
}
/* AI karta na tabletu: uzky panel, navrh kroku pres celou sirku a Udelat pod nim vpravo (jako mobil) */
@media (min-width: 760px) and (max-width: 1099px) {
  html.ui2 #d-action { grid-template-columns: minmax(0, 1fr) auto !important; }
  html.ui2 #d-action .act-head, html.ui2 #d-action .act-body { grid-column: 1 / -1 !important; }
  html.ui2 #d-action .ui2-do { grid-column: 2; }
}
/* ===== Preposlat (17. 10. 2026, UX review): vzkaz nahore, prilohy, karta puvodni zpravy jako citace na konci ===== */
html.ui2 #modal-compose { --cmp-err-ink: #9f2d29; --cmp-link: #27706d; }
html.ui2.ui2-dark #modal-compose { --cmp-err-ink: #ffb3ae; --cmp-link: #6fd0cc; }
/* chyba nad tlacitky (drive cervene pismo pod patickou) */
html.ui2 #cmp-error { min-height: 0; margin: 0; }
html.ui2 #cmp-error:empty { display: none; }
html.ui2 #cmp-error:not(:empty) { display: flex; align-items: flex-start; gap: 8px; margin: 0 16px 12px; padding: 10px 12px; border-radius: 8px; background: var(--err-bg); color: var(--cmp-err-ink);
  font: 500 13px/18px "Inter", system-ui, sans-serif; overflow-wrap: anywhere; }
html.ui2 #cmp-error:not(:empty)::before { content: ""; flex: none; width: 16px; height: 16px; margin-top: 1px; background: currentColor; -webkit-mask: var(--i-triangle-alert) center / contain no-repeat; mask: var(--i-triangle-alert) center / contain no-repeat; }
html.ui2 #modal-compose .field.cmp-invalid input { border-color: var(--err) !important; box-shadow: 0 0 0 3px rgba(201,64,60,.16) !important; }
html.ui2 #modal-compose .field.cmp-invalid > span { color: var(--cmp-err-ink); }
/* rezim Preposlat: kompaktni vzkaz s autogrow */
html.ui2 #modal-compose[data-mode="forward"] .field-grow { flex: none; min-height: 0; }
html.ui2 #modal-compose[data-mode="forward"] #cmp-body { flex: none; height: 96px; min-height: 96px; max-height: 320px; resize: none; line-height: 22px; }
html.ui2 #modal-compose[data-mode="forward"] .cmp-attach-row, html.ui2 #modal-compose[data-mode="forward"] .planner-toggle-row { display: inline-flex; margin: 0 20px 0 0; vertical-align: middle; }
html.ui2 #modal-compose[data-mode="forward"] .cmp-attach-row.hidden, html.ui2 #modal-compose[data-mode="forward"] .planner-toggle-row.hidden { display: none; }
html.ui2 #modal-compose[data-mode="forward"] .mic-row { margin-top: 8px; padding: 6px 12px 6px 6px; gap: 10px; min-height: 0; border-radius: 10px; background: var(--g50) !important; border: 1px solid var(--g200); }
html.ui2 #modal-compose[data-mode="forward"] .mic-btn { width: 40px; height: 40px; box-shadow: none !important; }
html.ui2 #modal-compose[data-mode="forward"] .mic-btn .ui2-svg { width: 18px; height: 18px; }
html.ui2 #modal-compose[data-mode="forward"] .mic-status { color: var(--g700) !important; font-size: 13px; }
html.ui2 #modal-compose[data-mode="forward"] .mic-interim { min-height: 0; }
html.ui2 #modal-compose[data-mode="forward"] .mic-interim:empty { display: none; }
html.ui2 #modal-compose[data-mode="forward"] .cmp-att-chips { margin: 12px 0 6px; }
/* karta preposilane zpravy */
html.ui2 #modal-compose .cmp-fwd { margin: 16px 0 4px; padding: 0 !important; border: 1px solid var(--g200); border-left: 3px solid var(--g300); border-radius: 10px; background: var(--g50); overflow: hidden; }
html.ui2 #modal-compose .cmp-fwd.hidden { display: none; }
html.ui2 #modal-compose .cmp-fwd-h { display: flex; align-items: center; gap: 8px; padding: 12px 14px 8px; opacity: 1; font-size: 13px; }
html.ui2 #modal-compose .cmp-fwd-t { display: inline-flex; align-items: center; gap: 8px; flex: 1 1 auto; min-width: 0; font: 600 13px/18px "Inter", system-ui, sans-serif; color: var(--g900); }
html.ui2 #modal-compose .cmp-fwd-t::before { content: ""; flex: none; width: 16px; height: 16px; background: var(--g700); -webkit-mask: var(--i-forward) center / contain no-repeat; mask: var(--i-forward) center / contain no-repeat; }
html.ui2 #modal-compose .cmp-fwd-note { flex: none; display: inline-flex; align-items: center; gap: 4px; color: var(--g700); font: 500 12px/16px "Inter", system-ui, sans-serif; }
html.ui2 #modal-compose .cmp-fwd-note:empty { display: none; }
html.ui2 #modal-compose .cmp-fwd-note::before { content: ""; width: 14px; height: 14px; background: currentColor; -webkit-mask: var(--i-paperclip) center / contain no-repeat; mask: var(--i-paperclip) center / contain no-repeat; }
html.ui2 #modal-compose .cmp-fwd-meta { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 12px; margin: 0; padding: 0 14px 12px; font: 400 13px/19px "Inter", system-ui, sans-serif; }
html.ui2 #modal-compose .cmp-fwd-meta dt { color: var(--g700); }
html.ui2 #modal-compose .cmp-fwd-meta dd { margin: 0; color: var(--g900); min-width: 0; overflow: hidden; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
html.ui2 #modal-compose .cmp-fwd-body { margin: 0; padding: 12px 14px 14px; border-top: 1px solid var(--g200); white-space: pre-wrap !important; overflow-wrap: anywhere; font: 400 14px/22px "Inter", system-ui, sans-serif; color: var(--g700);
  max-height: 286px; overflow: hidden; -webkit-mask-image: none; mask-image: none; transition: opacity .15s; }
html.ui2 #modal-compose .cmp-fwd.cmp-fwd-clip .cmp-fwd-body { -webkit-mask-image: linear-gradient(#000 calc(100% - 72px), transparent); mask-image: linear-gradient(#000 calc(100% - 72px), transparent); }
html.ui2 #modal-compose .cmp-fwd.cmp-fwd-open .cmp-fwd-body { max-height: none; overflow: visible; }
html.ui2 #modal-compose .cmp-fwd.cmp-fwd-loading .cmp-fwd-body { opacity: .5; }
html.ui2 #modal-compose .cmp-fwd-more { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; height: 40px; padding: 0 14px; border: 0; border-top: 1px solid var(--g200); background: var(--g50);
  color: var(--cmp-link); font: 600 13px/18px "Inter", system-ui, sans-serif; cursor: pointer; }
html.ui2 #modal-compose .cmp-fwd-more.hidden { display: none; }
html.ui2 #modal-compose .cmp-fwd-more:hover { background: var(--g100); }
html.ui2 #modal-compose .cmp-fwd-more:focus-visible { outline: 2px solid var(--b500); outline-offset: -2px; }
html.ui2 #modal-compose .cmp-fwd-more::after { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--i-chevron-down) center / contain no-repeat; mask: var(--i-chevron-down) center / contain no-repeat; transition: transform .15s; }
html.ui2 #modal-compose .cmp-fwd.cmp-fwd-open .cmp-fwd-more::after { transform: rotate(180deg); }
/* mobil: Preposlat pres celou obrazovku */
@media (max-width: 759px) {
  html.ui2 #modal-compose[data-mode="forward"] .modal-panel { height: 100dvh !important; max-height: 100dvh !important; border-radius: 0 !important; }
  html.ui2 #modal-compose[data-mode="forward"] .cmp-attach-row, html.ui2 #modal-compose[data-mode="forward"] .planner-toggle-row { display: flex; margin: 4px 0 0; }
}
html.ui2 #modal-compose .cmp-att-chips > .cmp-att-head { flex-basis: 100%; margin: 0 0 2px; padding: 0 !important; border: 0 !important; background: none !important; color: var(--g700) !important; font: 500 12px/16px "Inter", system-ui, sans-serif; }
html.ui2.ui2-dark #modal-compose .link-btn { color: var(--cmp-link) !important; }

/* ===== 18. 10. UX: Nastaveni jako seznam sekci (radky po skupinach) + podstranky =====
   Spolecne komponenty: .ui2-group (nadpis skupiny + karta), .ui2-row (radek 56 px: ikona, text, hodnota, sipka).
   Mobil: bud seznam, nebo podstranka (data-sub na #modal-settings). Od 760 px seznam vlevo, podstranka vpravo. */
html.ui2 .ui2-group { margin: 0 0 24px; }
html.ui2 .ui2-group-h { padding: 0 4px 8px; font: 600 12px/16px "Inter", system-ui, sans-serif; letter-spacing: .04em; text-transform: uppercase; color: var(--g500); }
html.ui2 .ui2-group-f { margin: 8px 4px 0; font-size: 13px; line-height: 18px; color: var(--g500); }
html.ui2 .ui2-group-b { background: var(--g0); border: 1px solid var(--g200); border-radius: 12px; overflow: hidden; }
html.ui2 .ui2-row {
  position: relative; display: flex; align-items: center; gap: 12px; width: 100%; min-height: 56px; margin: 0; padding: 10px 14px;
  border: 0; border-radius: 0; background: none; color: var(--g900); font: inherit; text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
html.ui2 .ui2-row + .ui2-row::before { content: ""; position: absolute; top: 0; left: 58px; right: 0; border-top: 1px solid var(--g200); }
html.ui2 .ui2-row.ui2-radio + .ui2-row::before { left: 14px; }
html.ui2 .ui2-row:hover { background: var(--g50); }
html.ui2 .ui2-row:active { background: var(--g100); }
html.ui2 .ui2-row:focus-visible { outline-offset: -2px !important; }
html.ui2 .ui2-row-i { flex: none; width: 32px; height: 32px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; background: var(--b50); color: var(--b700); }
html.ui2.ui2-dark .ui2-row-i { color: var(--bink); }
html.ui2 .ui2-row-t { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
html.ui2 .ui2-row-t b { font: 500 15px/20px "Inter", system-ui, sans-serif; color: var(--g900); }
html.ui2 .ui2-row-t small { font: 400 13px/18px "Inter", system-ui, sans-serif; color: var(--g500); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.ui2 .ui2-row-v { flex: none; font-size: 14px; color: var(--g500); }
html.ui2 .ui2-row > .ui2-svg:last-child { flex: none; color: var(--g500); }
html.ui2 .ui2-row-me { min-height: 72px; }
html.ui2 .ui2-row-me .ui2-av { width: 44px; height: 44px; font-size: 16px; }
html.ui2 .ui2-check { flex: none; color: var(--b700); visibility: hidden; }
html.ui2.ui2-dark .ui2-check { color: var(--bink); }
html.ui2 .ui2-radio.on .ui2-check { visibility: visible; }
html.ui2 .ui2-radio.on .ui2-row-t b { font-weight: 600; }

html.ui2 #modal-settings .settings-tabs { display: none !important; }
html.ui2 #modal-settings #settings-pane-ui2gen { display: block !important; }
html.ui2 #modal-settings .ui2-sp { display: none; }
html.ui2 #modal-settings[data-sub="look"] #ui2-sp-look, html.ui2 #modal-settings[data-sub="notif"] #ui2-sp-notif, html.ui2 #modal-settings[data-sub="help"] #ui2-sp-help { display: block; }
html.ui2 #modal-settings .modal-body { background: var(--g50); }
html.ui2.ui2-dark #modal-settings .modal-body { background: #0f1214; }
html.ui2 #modal-settings .modal-head h3 { font-size: 17px !important; }
/* uvodni text podstranky: obycejny odstavec, ne dalsi barevna karta */
html.ui2 #modal-settings.ui2-st .co-panehelp, html.ui2 #modal-settings.ui2-st .settings-pane > .muted:first-child {
  background: none !important; border: 0 !important; padding: 0 4px !important; margin: 0 0 16px !important; color: var(--g500) !important; font: 400 13px/19px "Inter", system-ui, sans-serif !important;
}
html.ui2 #modal-settings .co-panehelp b, html.ui2 #modal-settings .co-panehelp strong { color: var(--g700); }
/* Notifikace */
html.ui2 #ui2-gen-notif #settings-pane-notif { display: block !important; padding: 0; }
html.ui2 #ui2-sp-notif .notif-row { min-height: 56px; border-radius: 12px !important; }
/* Jak zacit: rozbalovaci radky */
html.ui2 .ui2-guide details { position: relative; }
html.ui2 .ui2-guide details + details { border-top: 1px solid var(--g200); }
html.ui2 .ui2-guide summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 52px; padding: 0 16px; font: 500 15px/20px "Inter", system-ui, sans-serif; color: var(--g900); cursor: pointer; list-style: none; }
html.ui2 .ui2-guide summary::-webkit-details-marker { display: none; }
html.ui2 .ui2-guide summary::after { content: ""; flex: none; width: 16px; height: 16px; background: var(--g500); -webkit-mask: var(--i-chevron-down) center / contain no-repeat; mask: var(--i-chevron-down) center / contain no-repeat; transition: transform .15s; }
html.ui2 .ui2-guide details[open] summary::after { transform: rotate(180deg); }
html.ui2 .ui2-guide details p { margin: 0; padding: 0 16px 16px; font-size: 14px; line-height: 21px; color: var(--g700); }

@media (max-width: 759px) {
  html.ui2 #modal-settings .modal-body { padding: 20px 16px calc(24px + env(safe-area-inset-bottom, 0px)) !important; }
  html.ui2 #modal-settings:not([data-sub=""]) #settings-pane-ui2gen { display: none !important; }
}
@media (min-width: 760px) {
  html.ui2 #modal-settings .modal-body { display: grid; grid-template-columns: 272px minmax(0, 1fr); column-gap: 32px; align-items: start; align-content: start; padding: 24px 32px 40px !important; }
  html.ui2 #modal-settings .modal-body > * { grid-column: 2; min-width: 0; max-width: 760px; }
  html.ui2 #modal-settings .modal-body > #settings-pane-ui2gen { grid-column: 1; grid-row: 1 / span 30; position: sticky; top: 0; }
  html.ui2 #settings-pane-ui2gen .ui2-group { margin-bottom: 16px; }
  html.ui2 #settings-pane-ui2gen .ui2-row { min-height: 44px; padding: 6px 10px; gap: 10px; }
  html.ui2 #settings-pane-ui2gen .ui2-row + .ui2-row::before { left: 48px; }
  html.ui2 #settings-pane-ui2gen .ui2-row:not(.ui2-row-me) small, html.ui2 #settings-pane-ui2gen .ui2-row > .ui2-svg:last-child, html.ui2 #settings-pane-ui2gen .ui2-row-v { display: none; }
  html.ui2 #settings-pane-ui2gen .ui2-row-i { width: 28px; height: 28px; }
  html.ui2 #settings-pane-ui2gen .ui2-row-t b { font-size: 14px; }
  html.ui2 #settings-pane-ui2gen .ui2-row-me { min-height: 60px; }
  html.ui2 #settings-pane-ui2gen .ui2-row-me .ui2-av { width: 36px; height: 36px; font-size: 14px; }
  html.ui2 #settings-pane-ui2gen .ui2-row.on { background: var(--b50); }
  html.ui2 #settings-pane-ui2gen .ui2-row.on .ui2-row-t b { font-weight: 600; color: var(--bink); }
}

/* Nastaveni > Pristupy (trezor, vault.js): bila karta jako ostatni skupiny, bez emoji ikon, pole 44 px */
html.ui2 #modal-settings .vt-card, html.ui2 #modal-settings .vt-codebox { background: var(--g0); border: 1px solid var(--g200); border-radius: 12px; padding: 16px; }
html.ui2 #modal-settings .vt-ico { display: none; }
html.ui2 #modal-settings .vt-title { font: 600 16px/22px "Inter", system-ui, sans-serif; color: var(--g900); }
html.ui2 #modal-settings .vt-head .vt-muted { margin-top: 2px; font-size: 13px; line-height: 19px; }
html.ui2 #modal-settings .vt-list-plain { margin: 12px 0 16px; padding: 12px 12px 12px 30px; border-radius: 8px; background: var(--g50); font-size: 13px; line-height: 19px; color: var(--g700); }
html.ui2 #modal-settings .vt-list-plain li + li { margin-top: 6px; }
html.ui2 #modal-settings .vt-form label { font: 500 13px/18px "Inter", system-ui, sans-serif; color: var(--g700); }
html.ui2 #modal-settings .vt-form input[type=password], html.ui2 #modal-settings .vt-form input[type=text] { min-height: 44px; }
html.ui2 #modal-settings .vt-check { font-weight: 400 !important; color: var(--g700) !important; line-height: 19px; }
html.ui2 #modal-settings .vt-check input { width: 18px; height: 18px; accent-color: var(--b700); }
html.ui2 #modal-settings .vt-actions .btn-primary, html.ui2 #modal-settings .vt-inline .btn-primary { background: var(--b700) !important; border-color: var(--b700) !important; color: #fff !important; font-weight: 600 !important; min-height: 44px; }
html.ui2.ui2-dark #modal-settings .vt-actions .btn-primary, html.ui2.ui2-dark #modal-settings .vt-inline .btn-primary { color: #0f1214 !important; }
html.ui2 #modal-settings .vt-item { background: var(--g0); border-color: var(--g200); }
html.ui2 #modal-settings .vt-tabs { background: var(--g100); border-color: var(--g200); }
html.ui2 #modal-settings .vt-tabs button.on { background: var(--g0); color: var(--g900); box-shadow: 0 1px 3px rgba(0,0,0,.14); }
@media (max-width: 759px) { html.ui2 #modal-settings .vt-actions .btn-primary { width: 100%; } }
html.ui2 #modal-settings.ui2-st .list > .empty { background: var(--g0) !important; border: 1px solid var(--g200) !important; border-radius: 12px !important; }
/* prepinac (switch) misto checkboxu u zapnuti/vypnuti */
html.ui2 #modal-settings .notif-row { justify-content: space-between; cursor: pointer; }
html.ui2 #modal-settings .notif-row input[type="checkbox"], html.ui2 .ui2-switch {
  -webkit-appearance: none; appearance: none; order: 2; flex: none; position: relative; width: 44px !important; height: 26px !important; margin: 0 0 0 auto !important;
  border-radius: 13px; background: var(--g300); border: 0; cursor: pointer; transition: background .15s;
}
html.ui2 #modal-settings .notif-row input[type="checkbox"]::before, html.ui2 .ui2-switch::before { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: transform .15s; }
html.ui2 #modal-settings .notif-row input[type="checkbox"]:checked, html.ui2 .ui2-switch:checked { background: var(--b700); }
html.ui2 #modal-settings .notif-row input[type="checkbox"]:checked::before, html.ui2 .ui2-switch:checked::before { transform: translateX(18px); }
html.ui2 #modal-settings .notif-row input[type="checkbox"]:disabled { opacity: .5; }

/* ===== 18. 10. UX: Sprava firmy - hlavicka se sipkou zpet, zalozky na desktopu, seznamy radku ===== */
html.ui2 .co-overlay#co-admin .co-admin-head, html.ui2 .co-overlay#co-admin .ui2-adm-sw { display: none !important; }
html.ui2 .ui2-adm-head { display: flex; align-items: center; gap: 6px; margin: 0 0 16px; min-width: 0; }
html.ui2 .ui2-adm-back { margin-left: -10px; flex: none; }
html.ui2 .ui2-adm-title { display: flex; align-items: center; gap: 8px; min-width: 0; min-height: 44px; padding: 0; border: 0; background: none; color: var(--g900); font: inherit; text-align: left; cursor: pointer; }
html.ui2 .ui2-adm-tt { display: flex; flex-direction: column; min-width: 0; }
html.ui2 .ui2-adm-tt b { font: 600 20px/26px "Inter", system-ui, sans-serif; letter-spacing: -.01em; }
html.ui2 .ui2-adm-tt small { font: 400 13px/18px "Inter", system-ui, sans-serif; color: var(--g500); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.ui2 .ui2-adm-title > .ui2-svg { flex: none; color: var(--g500); }
@media (max-width: 759px) { html.ui2 .co-overlay#co-admin .co-nav { display: none !important; } }
@media (min-width: 760px) {
  html.ui2 .ui2-adm-title { pointer-events: none; }
  html.ui2 .ui2-adm-title > .ui2-svg { display: none; }
  html.ui2 .co-overlay#co-admin .co-nav { display: flex !important; flex-wrap: nowrap; gap: 4px; margin: 0 0 24px !important; padding: 0 !important; overflow-x: auto; scrollbar-width: none; background: none !important; border: 0 !important; border-bottom: 1px solid var(--g200) !important; border-radius: 0 !important; }
  html.ui2 .co-overlay#co-admin .co-nav button { flex: none; min-height: 40px; margin: 0 0 -1px; padding: 0 12px !important; background: none !important; border: 0 !important; border-bottom: 2px solid transparent !important; border-radius: 0 !important; color: var(--g700) !important; font: 500 14px/20px "Inter", system-ui, sans-serif !important; box-shadow: none !important; }
  html.ui2 .co-overlay#co-admin .co-nav button:hover { color: var(--g900) !important; }
  html.ui2 .co-overlay#co-admin .co-nav button.on { color: var(--g900) !important; font-weight: 600 !important; border-bottom-color: var(--b700) !important; }
  html.ui2 .co-overlay#co-admin .co-nav button .ui2-svg { display: none; }
}
/* radek jako celek otevre Upravit; samostatne Upravit / Poslat odkaz na heslo (je i v Upravit) se neukazuje */
html.ui2 .co-overlay#co-admin .ui2-tap { cursor: pointer; }
html.ui2 .co-overlay#co-admin .ui2-tap:hover, html.ui2 .co-overlay#co-admin .ui2-tap:hover td { background: var(--g50) !important; }
html.ui2 .co-overlay#co-admin .ui2-tap-edit, html.ui2 .co-overlay#co-admin .ui2-sec-act { display: none !important; }
html.ui2 .co-overlay#co-admin .ui2-u-meta { display: none; }
html.ui2 .co-overlay#co-admin .ui2-u-av { width: 56px; padding-right: 0 !important; }
html.ui2 .co-overlay#co-admin .ui2-u-av .ui2-av { width: 36px; height: 36px; font-size: 13px; }
@media (min-width: 1100px) { html.ui2 .co-overlay#co-admin .co-t-users thead tr::before { content: ""; display: table-cell; background: var(--g50); border-bottom: 1px solid var(--g200); } }
@media (max-width: 1099px) {
  html.ui2 .co-overlay#co-admin .co-t-users tbody { display: block; gap: 0; grid-template-columns: none; border: 1px solid var(--g200); border-radius: 12px; background: var(--g0); overflow: hidden; }
  html.ui2 .co-overlay#co-admin .co-t-users tr { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto 16px; column-gap: 12px; row-gap: 2px; align-items: center; padding: 12px 14px !important; border: 0 !important; border-radius: 0; background: none; }
  html.ui2 .co-overlay#co-admin .co-t-users tr + tr { border-top: 1px solid var(--g200) !important; }
  html.ui2 .co-overlay#co-admin .co-t-users .ui2-u-av { width: auto; grid-column: 1; grid-row: 1 / span 3; align-self: start; }
  html.ui2 .co-overlay#co-admin .co-t-users .ui2-u-av .ui2-av { width: 40px; height: 40px; font-size: 15px; }
  html.ui2 .co-overlay#co-admin .co-t-users .co-c-name { grid-column: 2; grid-row: 1; }
  html.ui2 .co-overlay#co-admin .co-t-users .co-c-role { grid-column: 3; grid-row: 1; }
  html.ui2 .co-overlay#co-admin .co-t-users .co-c-state { grid-column: 2 / 4; grid-row: 2; margin-top: 2px; }
  html.ui2 .co-overlay#co-admin .co-t-users .ui2-u-meta { display: block; grid-column: 2 / 4; grid-row: 3; font-size: 13px; line-height: 18px; color: var(--g500); }
  html.ui2 .co-overlay#co-admin .co-t-users .co-c-groups, html.ui2 .co-overlay#co-admin .co-t-users .co-c-mail, html.ui2 .co-overlay#co-admin .co-t-users .co-c-ai, html.ui2 .co-overlay#co-admin .co-t-users .co-c-login { display: none !important; }
  html.ui2 .co-overlay#co-admin .co-t-users .ui2-hide-m, html.ui2 .co-overlay#co-admin .co-t-users .ui2-pill-default { display: none !important; }
  html.ui2 .co-overlay#co-admin .co-t-users .co-c-act { grid-column: 2 / 4; grid-row: 4; margin-top: 8px; }
  html.ui2 .co-overlay#co-admin .co-t-users .co-c-act .co-btn { flex: 0 1 auto !important; min-height: 40px !important; }
  html.ui2 .co-overlay#co-admin .co-t-users tr.ui2-tap::after { content: ""; grid-column: 4; grid-row: 1 / span 3; align-self: center; width: 16px; height: 16px; background: var(--g500); -webkit-mask: var(--i-chevron-right) center / contain no-repeat; mask: var(--i-chevron-right) center / contain no-repeat; }
}
/* skupiny a dokumenty: jeden seznam s oddelovaci, sipka vpravo, smazat jako ikona */
html.ui2 .co-overlay#co-admin .co-kbrow { margin: 0 !important; border-radius: 0 !important; border-bottom-width: 0 !important; min-height: 60px; display: flex !important; align-items: center; }
html.ui2 .co-overlay#co-admin .co-section-h + .co-kbrow, html.ui2 .co-overlay#co-admin :not(.co-kbrow) + .co-kbrow { border-top-left-radius: 12px !important; border-top-right-radius: 12px !important; }
html.ui2 .co-overlay#co-admin .co-kbrow:not(:has(+ .co-kbrow)) { border-bottom-width: 1px !important; border-bottom-left-radius: 12px !important; border-bottom-right-radius: 12px !important; margin-bottom: 16px !important; }
html.ui2 .co-overlay#co-admin .co-kbrow > div:first-child { flex: 1 1 auto; }
html.ui2 .co-overlay#co-admin .co-kbrow.ui2-tap::after { content: ""; flex: none; width: 16px; height: 16px; background: var(--g500); -webkit-mask: var(--i-chevron-right) center / contain no-repeat; mask: var(--i-chevron-right) center / contain no-repeat; }
html.ui2 .co-overlay#co-admin .co-kbrow [data-del-group] { width: 40px !important; min-width: 40px; height: 40px; min-height: 40px !important; padding: 0 !important; border-color: transparent !important; background: none !important; color: var(--g500) !important; }
html.ui2 .co-overlay#co-admin .co-kbrow [data-del-group]:hover { background: var(--err-bg) !important; color: var(--err) !important; }
/* Zalozni klice: vlastni prihlasovaci aplikace sbalene */
html.ui2 #co-admin details.co-adv { margin-top: 24px; border: 1px solid var(--g200); border-radius: 12px; background: var(--g0); }
html.ui2 #co-admin details.co-adv > summary { display: flex; align-items: center; gap: 8px; min-height: 52px; padding: 0 16px; font: 500 15px/20px "Inter", system-ui, sans-serif; color: var(--g900); cursor: pointer; list-style: none; }
html.ui2 #co-admin details.co-adv > summary::-webkit-details-marker { display: none; }
html.ui2 #co-admin details.co-adv > summary::after { content: ""; margin-left: auto; width: 16px; height: 16px; background: var(--g500); -webkit-mask: var(--i-chevron-down) center / contain no-repeat; mask: var(--i-chevron-down) center / contain no-repeat; }
html.ui2 #co-admin details.co-adv[open] > summary { border-bottom: 1px solid var(--g200); }
html.ui2 #co-admin details.co-adv[open] > summary::after { transform: rotate(180deg); }
html.ui2 #co-admin details.co-adv > :not(summary) { margin-left: 16px; margin-right: 16px; }
html.ui2 #co-admin details.co-adv > p.co-muted { margin-top: 14px; font-size: 13px; line-height: 19px; }
html.ui2 #co-admin details.co-adv > :last-child { margin-bottom: 16px; }
html.ui2 #co-admin .co-switch { display: flex; align-items: center; gap: 12px; min-height: 44px; }
html.ui2 #co-admin .co-switch .ui2-switch { order: 2; }
@media (min-width: 760px) { html.ui2 .co-overlay#co-admin .co-nav button { width: auto !important; min-width: 0 !important; flex: none !important; } }
@media (min-width: 1100px) { html.ui2 .co-overlay#co-admin .co-t-users .co-c-ai, html.ui2 .co-overlay#co-admin .co-t-users .co-c-login { white-space: nowrap; } }
@media (max-width: 1099px) { html.ui2 .co-overlay#co-admin .co-t-users .co-c-act { flex-wrap: nowrap; } html.ui2 .co-overlay#co-admin .co-t-users .co-c-act .co-btn { padding: 0 12px !important; } }

/* ===== 18. 10. UX: Meetingy jako stranka (ne dialog nad schrankou), nastaveni kompaktne ===== */
html.ui2 #modal-meetings.ui2-page .modal-body { background: var(--g50); }
html.ui2.ui2-dark #modal-meetings.ui2-page .modal-body { background: #0f1214; }
html.ui2 #modal-meetings .mt-bgs { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px; }
html.ui2 #modal-meetings .mt-bg-name { font-size: 13px; }
@media (max-width: 759px) {
  html.ui2 #modal-meetings.ui2-page .modal-body { padding: 16px 16px 24px !important; }
  html.ui2 #modal-meetings .mt-subnav { flex-direction: row; gap: 2px; padding: 3px; margin: 0; overflow: visible; background: var(--g100); border: 1px solid var(--g200); border-radius: 10px; }
  html.ui2 #modal-meetings .mt-sub { flex: 1 1 0; justify-content: center; min-height: 36px; padding: 0 6px; border: 0 !important; border-radius: 8px; color: var(--g700); font: 500 13px/18px "Inter", system-ui, sans-serif; }
  html.ui2 #modal-meetings .mt-sub svg { display: none; }
  html.ui2 #modal-meetings .mt-sub.on { background: var(--g0); color: var(--g900); font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,.14); }
  html.ui2 #modal-meetings .mt-bgs { gap: 8px; }
  html.ui2 #modal-meetings .mt-bg { padding: 6px 6px 8px; }
  html.ui2 #modal-meetings .mt-bg.on { padding: 5px 5px 7px; }
  html.ui2 #modal-meetings .mt-bg > small, html.ui2 #modal-meetings .mt-bg-none small { display: none; }
  html.ui2 #modal-meetings .mt-bg-none b { width: 28px; height: 28px; font-size: 14px; }
  html.ui2 #modal-meetings .mt-bg-name { font-size: 12px; line-height: 16px; }
}
html.ui2 #modal-meetings .modal-head h3 { flex: 1 1 auto; text-align: left; margin: 0 auto 0 0; align-self: center; }
html.ui2 #modal-meetings .status-line { text-transform: none !important; letter-spacing: 0 !important; font-size: 14px; color: var(--g500); }
html.ui2 #modal-meetings .mt-det-h [data-a="back"] { font-size: 0 !important; width: 40px; min-width: 40px; height: 40px; min-height: 40px; padding: 0 !important; border-color: transparent !important; background: none !important; }
html.ui2 #modal-meetings .mt-det-h [data-a="back"]::before { content: ""; width: 20px; height: 20px; background: currentColor; -webkit-mask: var(--i-arrow-left) center / contain no-repeat; mask: var(--i-arrow-left) center / contain no-repeat; }
html.ui2 #modal-meetings .mt-bg-prev { aspect-ratio: 16 / 9; width: 100%; }
/* detail meetingu: jedina sipka zpet (na seznam), bez zalozek nad detailem */
html.ui2 #modal-meetings:has(#mt-pane-detail:not(.hidden)) .mt-tabs { display: none !important; }
@media (max-width: 759px) { html.ui2 #modal-meetings:has(#mt-pane-detail:not(.hidden)) .modal-head { display: none !important; } html.ui2 #modal-meetings .mt-det-h { margin-left: -8px; } }

/* ===== 18. 10. UX: Muj ucet - poradi podle dulezitosti, sbalene formulare, sipka zpet ===== */
html.ui2 #co-me .co-me-head { display: flex; align-items: center; gap: 12px; }
html.ui2 #co-me .ui2-me-back { margin-left: -10px; flex: none; }
html.ui2 #co-me .co-me-grid > .co-me-card:has(#co-me-mail) { order: 1; }
html.ui2 #co-me .co-me-grid > .co-me-card:has(#co-me-cc-connect) { order: 2; }
html.ui2 #co-me .co-me-grid > #co-f-tok { order: 3; }
html.ui2 #co-me .co-me-grid > #co-f-pw { order: 4; }
html.ui2 #co-me .co-me-grid > .pk-card { order: 5; }
html.ui2 #co-me .co-me-grid > .co-me-card:has(#co-me-svc) { order: 6; }
html.ui2 #co-me .co-me-grid > .co-me-card:has(#co-me-intro) { order: 7; }
html.ui2 #co-me .co-me-grid > .co-me-card:has(#co-logout) { order: 8; }
html.ui2 #co-me .ui2-fold > h2 { cursor: pointer; margin: 0 !important; user-select: none; }
html.ui2 #co-me .ui2-fold > h2::after { content: ""; margin-left: auto; flex: none; width: 16px; height: 16px; background: var(--g500); -webkit-mask: var(--i-chevron-down) center / contain no-repeat; mask: var(--i-chevron-down) center / contain no-repeat; transition: transform .15s; }
html.ui2 #co-me .ui2-fold.open > h2 { margin-bottom: 12px !important; }
html.ui2 #co-me .ui2-fold.open > h2::after { transform: rotate(180deg); }
html.ui2 #co-me .ui2-fold:not(.open) > :not(h2) { display: none !important; }
html.ui2 #co-me .ui2-fold:not(.open) { align-self: start; padding-top: 16px !important; padding-bottom: 16px !important; }
html.ui2 #co-me .co-me-card:has(#co-logout) .co-btn.danger { width: 100%; }
@media (max-width: 759px) { html.ui2 #co-me .co-me-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 12px !important; } html.ui2 #co-me .co-me-card { padding: 16px !important; } }
/* Muj ucet: jeden sloupec i na desktopu (sbalene radky by ve dvou sloupcich nechavaly diry) */
html.ui2 #co-me .co-me-grid { grid-template-columns: minmax(0, 1fr) !important; max-width: 760px; gap: 12px !important; }
html.ui2 #co-me .co-me-head { max-width: 760px; }

/* ===== 18. 10. UX: trezor otevreny - polozky jako jeden seznam, akce vpravo, tip bez ramecku ===== */
html.ui2 #modal-settings .vt-pkrow.vt-muted { border: 0; padding: 0 2px; margin: 4px 0 14px; font-size: 13px; line-height: 18px; }
html.ui2 #modal-settings .vt-items { gap: 0; border: 1px solid var(--g200); border-radius: 12px; overflow: hidden; background: var(--g0); }
html.ui2 #modal-settings .vt-items .vt-item { border: 0; border-radius: 0; padding: 12px 14px; align-items: center; }
html.ui2 #modal-settings .vt-items .vt-item + .vt-item { border-top: 1px solid var(--g200); }
html.ui2 #modal-settings .vt-item-t { font: 600 15px/20px "Inter", system-ui, sans-serif; color: var(--g900); }
html.ui2 #modal-settings .vt-item-k { margin-top: 2px; }
html.ui2 #modal-settings .vt-item-k code { background: none !important; padding: 0 !important; color: var(--g500) !important; }
html.ui2 #modal-settings .vt-ib { width: 40px; height: 40px; color: var(--g700); }
html.ui2 #modal-settings .vt-ai { min-height: 40px; }
html.ui2 #modal-settings .vt-add, html.ui2 #modal-settings .vt-more { border-top: 0; margin-top: 12px; padding-top: 0; }
html.ui2 #modal-settings .vt-add > summary, html.ui2 #modal-settings .vt-more > summary { display: flex; align-items: center; min-height: 44px; padding: 0 14px; border: 1px solid var(--g200); border-radius: 10px; background: var(--g0); list-style: none; color: var(--b700); font-weight: 600; }
html.ui2.ui2-dark #modal-settings .vt-add > summary, html.ui2.ui2-dark #modal-settings .vt-more > summary { color: var(--bink); }
html.ui2 #modal-settings .vt-add > summary::-webkit-details-marker, html.ui2 #modal-settings .vt-more > summary::-webkit-details-marker { display: none; }
html.ui2 #modal-settings .vt-add[open] > summary, html.ui2 #modal-settings .vt-more[open] > summary { margin-bottom: 12px; }
@media (max-width: 520px) {
  html.ui2 #modal-settings .vt-items .vt-item { flex-direction: column; align-items: stretch; gap: 4px; }
  html.ui2 #modal-settings .vt-item-a { margin-left: -10px; }
}

/* ===== 18. 10. UX: kroky uvodniho nastaveni byly ve svetlem motivu bile na bile (barvy z puvodniho tmaveho vzhledu) ===== */
html.ui2 .co-steps li { color: var(--g500) !important; border-top-color: var(--g200) !important; font: 600 12px/16px "Inter", system-ui, sans-serif !important; padding-top: 8px !important; }
html.ui2 .co-steps li.done { color: var(--b700) !important; border-top-color: var(--b500) !important; }
html.ui2 .co-steps li.cur { color: var(--g900) !important; border-top-color: var(--b700) !important; }
html.ui2.ui2-dark .co-steps li.done { color: var(--bink) !important; }

/* ===== 18. 10. UX: menu Vice stejne jako Nastaveni (skupiny jako karty s radky, ikona v dlazdici) ===== */
html.ui2 .ui2-more .modal-body { background: var(--g50); padding: 4px 16px calc(24px + env(safe-area-inset-bottom, 0px)) !important; }
html.ui2.ui2-dark .ui2-more .modal-body { background: #0f1214; }
html.ui2 .ui2-more-h { background: none !important; border: 0 !important; padding: 20px 4px 8px !important; font: 600 12px/16px "Inter", system-ui, sans-serif !important; letter-spacing: .04em; }
html.ui2 .ui2-more .more-sheet { gap: 0 !important; }
html.ui2 .ui2-more-g { background: var(--g0); border: 1px solid var(--g200); border-radius: 12px; overflow: hidden; }
html.ui2 .ui2-more .more-item { position: relative; border: 0 !important; margin: 0 !important; min-height: 52px; gap: 12px; padding: 0 14px !important; font-weight: 500 !important; }
html.ui2 .ui2-more-g .more-item ~ .more-item::before { content: ""; position: absolute; top: 0; left: 58px; right: 0; border-top: 1px solid var(--g200); }
html.ui2 .ui2-more .more-ico { flex: none; width: 32px; height: 32px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; background: var(--b50); color: var(--b700); }
html.ui2.ui2-dark .ui2-more .more-ico { color: var(--bink); }
html.ui2 .ui2-more .more-item.ui2-more-danger .more-ico { background: var(--err-bg); }
html.ui2 .ui2-more .more-item.ui2-more-danger { justify-content: center; }
html.ui2 .ui2-more .more-item.ui2-more-danger > span:nth-child(2) { flex: 0 1 auto; }
html.ui2 .ui2-more .more-item.ui2-more-danger .more-ico { display: none; }
html.ui2 .ui2-more .more-arrow { color: var(--g500); }
html.ui2 .ui2-more .more-item:active { background: var(--g100) !important; }

/* ===== 18. 10. UX: drobnosti - stavove texty bez verzalek, planovac: volne casy v mrizce ===== */
html.ui2 .status-line { text-transform: none !important; letter-spacing: 0 !important; font-size: 14px !important; }
html.ui2 #inbox-list > .status-line, html.ui2 #cc-list > .status-line { padding: 48px 16px !important; text-align: center; color: var(--g500) !important; }
html.ui2 #pl-day-slots { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px !important; }
html.ui2 #pl-day-slots > * { margin: 0 !important; min-height: 44px; }
html.ui2 #pl-day-slots > .pl-busy, html.ui2 #pl-day-slots > :not(.pl-slot) { grid-column: 1 / -1; }
html.ui2 #co-me .co-mailpw { border-top-color: var(--g200); }
html.ui2 #co-me .co-mailpw > summary { color: var(--g900); font: 600 14px/20px "Inter", system-ui, sans-serif; }