/* Переключатель темы в шапке (static/js/theme_switch.js). Отдельный файл: генератор
   Flux его не трогает, flux.js не перекрашивает — цвета берутся из переменных Flux. */
.yts { position: relative; display: inline-flex; align-items: center; }
.yts-btn {
    display: inline-flex; align-items: center; gap: 0.45rem;
    height: 2.4rem; padding: 0 0.85rem 0 0.7rem; border-radius: 999px; cursor: pointer;
    font: inherit; font-size: 0.86rem; line-height: 1;
    color: var(--fx-ink, #f3f0fa);
    background: var(--fx-pill-bg, rgba(255,255,255,0.06));
    border: 1px solid var(--fx-pill-border, rgba(255,255,255,0.12));
    box-shadow: 0 0 0 1px rgb(var(--fx-ink-rgb, 255 255 255) / 0.05), 0 4px 14px rgb(var(--fx-shade-rgb, 0 0 0) / 0.06);
    transition: background .15s, transform .15s;
}
.yts-btn:hover { background: rgb(var(--fx-ink-rgb, 255 255 255) / 0.07); }
.yts-btn:focus-visible, .yts-item:focus-visible { outline: 2px solid rgb(var(--fx-ink-rgb, 255 255 255) / 0.5); outline-offset: 2px; }
.yts-btn svg { width: 1.15rem; height: 1.15rem; flex: none; }
.yts-menu {
    position: absolute; top: calc(100% + 0.45rem); right: 0; z-index: 10050;
    min-width: 15rem; padding: 0.4rem;
    border-radius: 14px;
    background: var(--fx-menu-bg, rgba(24,20,36,0.97));
    border: 1px solid var(--fx-card-border, rgba(255,255,255,0.1));
    box-shadow: 0 18px 40px rgba(0,0,0,0.28);
    -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
}
.yts-menu[hidden] { display: none; }
.yts-menu-title { padding: 0.45rem 0.6rem 0.35rem; font-size: 0.75rem; color: var(--fx-g3, rgba(236,228,255,0.6)); }
.yts-item {
    display: grid; grid-template-columns: 1.4rem 1fr 1.1rem; align-items: center; gap: 0.6rem;
    width: 100%; padding: 0.6rem 0.6rem; border: 0; border-radius: 10px; cursor: pointer;
    background: transparent; color: var(--fx-ink, #f3f0fa); font: inherit; font-size: 0.9rem; text-align: left;
}
.yts-item:hover { background: rgb(var(--fx-ink-rgb, 255 255 255) / 0.06); }
.yts-item.on { background: rgb(var(--fx-ink-rgb, 255 255 255) / 0.08); }
.yts-ic svg, .yts-ck svg { width: 1.2rem; height: 1.2rem; display: block; }
.yts-tx small { display: block; margin-top: 2px; font-size: 0.72rem; color: var(--fx-g3, rgba(236,228,255,0.6)); }
.yts-floating { position: fixed; top: 0.9rem; right: 1rem; z-index: 10040; }

/* На узких экранах — только значок */
@media (max-width: 720px) {
    .yts-btn-label { display: none; }
    .yts-btn { width: 2.4rem; padding: 0; justify-content: center; }
}
/* Старый вид: кнопку не рисуем (скрипт её и не монтирует) */
:root:not([data-skin="flux"]) .yts { display: none; }
@media print { .yts { display: none !important; } }
/* Узкий экран: шапки маркетплейса и презентации переносятся в две строки, а не вылезают вбок */
@media (max-width: 720px) {
    .mp-header, .pr-header { flex-wrap: wrap; gap: 0.6rem; padding-left: 1rem; padding-right: 1rem; }
}