/* ОБЪЕКТ — общие элементы видео-блоков: переключатель «Где смотреть» RuTube / YouTube (objvs-*) и строка
   фильтров-плейлистов (objvf-*). Разметку дают objv_source_switch() и objv_filters_html() (objekt-videos.php),
   поведение переключателя — objekt-video-source.js, фильтров — сами блоки (objekt-videos.js, objekt-shorts.js).
   Подключается вместе с видео-модалкой. main.css гасит рамку фокуса у всего — поэтому у :focus-visible здесь !important. */

/* ---------- «Где смотреть» ---------- */
.objvs{
  display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;
  font-family:var(--objekt-font-body);color:var(--objekt-color-cream);
}
.objvs,
.objvs *{box-sizing:border-box;}
.objvs .objvs-label{flex-shrink:0;font-size:15px;line-height:1.3;color:var(--objekt-color-cream);}
.objvs .objvs-btns{display:flex;gap:10px;}
.objvs .objvs-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-width:clamp(118px, 9vw, 150px);height:clamp(44px, 3vw, 52px);padding:0 18px;margin:0;
  border:1px solid rgba(245,242,237,0.28);border-radius:0;background:transparent;
  color:var(--objekt-color-cream);font-family:inherit;font-size:15px;font-weight:500;line-height:1;letter-spacing:.02em;text-transform:none;
  cursor:pointer;box-shadow:none;-webkit-appearance:none;appearance:none;
  transition:background-color .2s ease, border-color .2s ease, color .2s ease;
}
.objvs .objvs-btn svg{display:block;flex-shrink:0;fill:currentColor;}
.objvs .objvs-btn .objvs-logo--rt{width:18px;height:15px;}
.objvs .objvs-btn .objvs-logo--yt{width:24px;height:17px;}
.objvs .objvs-btn:hover{border-color:var(--objekt-color-accent);}
.objvs .objvs-btn[aria-pressed="true"]{background:var(--objekt-color-accent);border-color:var(--objekt-color-accent);color:var(--objekt-color-bg);}
.objvs .objvs-btn[aria-pressed="true"]:hover{background:var(--objekt-color-accent-hover);border-color:var(--objekt-color-accent-hover);}
.objvs .objvs-btn:focus-visible{outline:2px solid var(--objekt-color-cream) !important;outline-offset:3px;}
.objvs .objvs-note{flex:1 1 100%;margin:0;font-size:13px;line-height:1.45;color:rgba(245,242,237,0.55);}
.objvs .objvs-note__full{display:none;}
/* компьютер: подпись справа от кнопок, через тонкую вертикальную черту */
@media (min-width:768px){
  .objvs{flex-wrap:nowrap;gap:clamp(16px, 1.4vw, 24px);}
  .objvs .objvs-note{flex:0 1 auto;max-width:22em;padding-left:clamp(16px, 1.4vw, 24px);border-left:1px solid rgba(245,242,237,0.2);}
  .objvs .objvs-note__full{display:inline;}
  .objvs .objvs-note__short{display:none;}
}

/* ---------- фильтры-плейлисты ---------- */
.objvf{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;font-family:var(--objekt-font-body);}
.objvf .objvf-chip{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:38px;padding:0 clamp(16px, 1.3vw, 22px);margin:0;
  border:1px solid rgba(245,242,237,0.3);border-radius:0;background:transparent;
  color:var(--objekt-color-cream);font-family:inherit;font-size:14px;line-height:1.2;letter-spacing:.01em;text-transform:none;
  cursor:pointer;box-shadow:none;-webkit-appearance:none;appearance:none;
  transition:background-color .2s ease, border-color .2s ease, color .2s ease;
}
.objvf .objvf-chip:hover{border-color:var(--objekt-color-accent);color:var(--objekt-color-accent);}
.objvf .objvf-chip[aria-pressed="true"]{background:var(--objekt-color-accent);border-color:var(--objekt-color-accent);color:var(--objekt-color-bg);}
.objvf .objvf-chip:focus-visible{outline:2px solid var(--objekt-color-cream) !important;outline-offset:2px;}
@media (min-width:768px){ .objvf .objvf-chip{min-height:40px;font-size:15px;} }

/* смена фильтра: сетка гаснет на время подгрузки и проявляется заново (класс ставят блоки) */
.objv-grid,
.objsh-grid{transition:opacity .15s ease;}
.is-filtering .objv-grid,
.is-filtering .objsh-grid{opacity:.25;pointer-events:none;}

@media (prefers-reduced-motion: reduce){
  .objvs .objvs-btn,
  .objvf .objvf-chip,
  .objv-grid,
  .objsh-grid{transition:none;}
}
