/* ============================================================================
   РеалСтат · chrome.css — ЕДИНАЯ ШАПКА для спецпроектов.
   Компактный автономный файл: только бренд + крошки + тумблер темы. НЕ тянет
   весь styles.css (важно для полноэкранных карт). Токены бренда продублированы
   локально, чтобы совпадать с главной без зависимости от основного стиля.
   Классы с префиксом .rsx- — чтобы не конфликтовать с инлайн-стилями страниц.

   Два режима:
   1) .rsx-header            — сплошная шапка-бар (светлые контентные страницы,
                               есть тумблер темы: свет ↔ тьма).
   2) .rsx-onmap             — брендовая строка ВНУТРИ оверлей-плашки карты
                               (полноэкранные тёмные карты, без тумблера,
                               не отжирает высоту — живёт в существующем title).
   ========================================================================== */
:root {
  --rsx-navy:#15355E; --rsx-ink:#14181F; --rsx-ink2:#5B6470;
  --rsx-surface:#FFFFFF; --rsx-hairline:#E6E4DE; --rsx-link:#1A5FA0; --rsx-canvas:#FAF9F6;
  --rsx-serif:'Source Serif 4', Georgia, 'Times New Roman', serif;
  --rsx-sans:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
}
[data-theme="dark"] {
  --rsx-navy:#BFD3EC; --rsx-ink:#E7EAEE; --rsx-ink2:#9BA4B0;
  --rsx-surface:#161B22; --rsx-hairline:#232A33; --rsx-link:#5B9BD8; --rsx-canvas:#0E1217;
}

/* ---- сплошная шапка (светлые страницы) ---- */
.rsx-header {
  display:flex; align-items:center; gap:16px; height:56px; padding:0 20px;
  background:var(--rsx-surface); border-bottom:1px solid var(--rsx-hairline);
  font-family:var(--rsx-sans);
}

/* ---- бренд (общий для обоих режимов) ---- */
.rsx-brand { display:inline-flex; align-items:center; gap:8px; color:var(--rsx-ink);
  font-weight:600; text-decoration:none; flex:none; }
.rsx-brand:hover { text-decoration:none; }
.rsx-mark { color:var(--rsx-navy); font-size:22px; line-height:1; }
.rsx-name { font-family:var(--rsx-serif); font-size:18px; letter-spacing:-.01em; }

/* ---- крошки ---- */
.rsx-crumbs { display:flex; align-items:center; gap:8px; min-width:0;
  font-size:13px; font-family:var(--rsx-sans); color:var(--rsx-ink2); overflow:hidden; }
.rsx-crumbs a { color:var(--rsx-link); text-decoration:none; white-space:nowrap; }
.rsx-crumbs a:hover { text-decoration:underline; }
.rsx-sep { color:var(--rsx-hairline); }
.rsx-crumb-cur { color:var(--rsx-ink2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ---- тумблер темы (в стиле .theme-toggle главной) ---- */
.rsx-toggle { margin-left:auto; flex:none; position:relative; width:44px; height:44px;
  display:grid; place-items:center; cursor:pointer;
  background:var(--rsx-surface); color:var(--rsx-ink);
  border:1px solid var(--rsx-hairline); border-radius:10px; }
.rsx-toggle:hover { border-color:var(--rsx-ink2); }
.rsx-toggle:focus-visible { outline:2px solid var(--rsx-link); outline-offset:2px; }
.rsx-ti { position:absolute; font-size:16px; line-height:1; transition:opacity .2s, transform .2s; }
.rsx-ti--sun { color:#9A5A1E; opacity:1; }
.rsx-ti--moon { opacity:0; transform:scale(.6); }
[data-theme="dark"] .rsx-ti--sun { opacity:0; transform:scale(.6); }
[data-theme="dark"] .rsx-ti--moon { opacity:1; transform:none; color:var(--rsx-navy); }

/* ---- база тёмной темы для светлых контентных страниц (по классу body.rsx-page) ---- */
[data-theme="dark"] body.rsx-page { background:var(--rsx-canvas); color:var(--rsx-ink); }

/* ---- бренд-строка ВНУТРИ плашки тёмной карты (оверлей, без тумблера) ----
   Цвета фиксированы под тёмную карту (страница всегда тёмная). Живёт внутри
   существующего title-card — второй шапки не создаём. */
.rsx-onmap { display:flex; flex-direction:column; align-items:flex-start; gap:2px;
  pointer-events:auto; font-family:var(--rsx-sans); }
.rsx-onmap .rsx-brand { color:#f2ecdb; }
.rsx-onmap .rsx-mark { color:#cde0f8; font-size:18px; }
.rsx-onmap .rsx-name { font-size:15px; }
.rsx-onmap .rsx-crumbs { font-size:11px; color:#93a7bd; }
.rsx-onmap .rsx-crumbs a { color:#93a7bd; }
.rsx-onmap .rsx-crumbs a:hover { color:#fff; text-decoration:none; }
.rsx-onmap .rsx-sep { color:#4a5f79; }
.rsx-onmap .rsx-crumb-cur { color:#7c93ab; }

@media (max-width:560px) {
  .rsx-header { height:52px; padding:0 14px; gap:10px; }
  .rsx-name { font-size:17px; }
}
