/* styles/components/ark-v5.css — шапка «Главной v5» (макет «ARKAN Главная v3», решение владельца 01.11.2026).
   Действует только при body.ark-v5 (флаг arkn_dash_v5, services/feature-flags.js). Цвета — наши токены, не палитра макета. */

/* Короткий поиск */
body.ark-v5 .ak-header #app-header__search { flex: 0 1 260px; }
body.ark-v5 .ak-header .gs-wrap { max-width: 260px; }

/* Остров выезжает от кнопки темы в сторону поиска (right задаёт header.js) */
body.ark-v5 #ark-island {
  position: fixed; top: 14px; right: var(--v5-isl-r, 220px); left: auto; transform: none;
  transform-origin: top right;
  background: #000; color: #fff; z-index: 300;
}
body.ark-v5 #ark-island.ark-island--compact { width: 36px; height: 36px; }

/* Страница макета живёт внутри нашего #app-main: высота по содержимому, прокручивается сам main (перенос из макета, где был свой body) */
body .hv5 { height: auto; min-height: 100%; overflow: visible; }

/* ── Оболочка в палитре макета: меню, шапка и фон — как в «ARKAN Главная v3» (перенос 01.11.2026) ── */
html body.ark-v5 {
  --v5-bg:#0D1B3A; --v5-line:#1A2D5C; --v5-fg:#E6ECF8; --v5-fg2:#9FB0D0; --v5-fg3:#6F82A8;
  --v5-hover:rgba(255,255,255,.05); --v5-on:rgba(122,162,255,.14); --v5-side:#0A1630;
  background: var(--v5-bg);
}
/* Карточки макета — в нашей тёмно-синей гамме (arkan-ds.css), чтобы остальные разделы не перекрашивать */
html body .hv5:not(.light) {
  --bg:#0D1B3A; --card:#11224A; --card-2:#162A57; --line:#22376A; --line-2:#3A5288;
  --fg:#E6ECF8; --fg-2:#9FB0D0; --fg-3:#6F82A8; --island:#000;
}
html[data-theme="light"] body.ark-v5 {
  --v5-bg:#f0f2f7; --v5-line:rgba(0,0,0,.09); --v5-fg:#111318; --v5-fg2:#4b5260; --v5-fg3:#8a909c;
  --v5-hover:rgba(0,0,0,.04); --v5-on:rgba(0,0,0,.07); --v5-side:#fff;
}
body.ark-v5 #app-main { overflow-x: hidden; }
body.ark-v5 .hv5 { background: transparent; }
body.ark-v5 .ak-header { background: transparent; border-bottom: 0; box-shadow: none; }

/* Кнопки и поиск шапки — в палитре макета */
html body.ark-v5 .ak-hamb, html body.ark-v5 .ak-ibtn, html body.ark-v5 .ak-bell, html body.ark-v5 .ak-theme, html body.ark-v5 .ak-avbtn {
  background: var(--v5-hover); border: 1px solid var(--v5-line); color: var(--v5-fg2); transition: background .15s, color .15s;
}
html body.ark-v5 .ak-hamb:hover, html body.ark-v5 .ak-ibtn:hover, html body.ark-v5 .ak-bell:hover, html body.ark-v5 .ak-theme:hover { background: var(--v5-on); color: var(--v5-fg); }
html body.ark-v5 .ak-theme { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; cursor: pointer; }
html body.ark-v5 .ak-avbtn { color: var(--v5-fg); }
html body.ark-v5 #app-header__search .gs-input-shell { background: var(--v5-hover); border: 1px solid var(--v5-line); border-radius: 10px; color: var(--v5-fg); }
html body.ark-v5 #app-header__search .gs-wrap, html body.ark-v5 #app-header__search .gs-input { background: transparent; border-color: transparent; color: var(--v5-fg); }
html body.ark-v5 #app-header__search .gs-input-shell:focus-within { border-color: hsl(220 90% 62%); }

/* Лента курсов — вплотную к шапке: убираем пустую полосу над макетной страницей */
body.ark-v5 #app-main:has(> .hv5) { padding-top: 6px; }
body.ark-v5 #ark-island.ark-island--toast { width: min(340px, 40vw); }
body.ark-v5 #ark-island.ark-island--expanded { width: min(340px, 40vw); }