/* ============================================================================
   КИНО1ТВ · легаси-сайт — перевод фонов на брендбук v4 (Moscow Midnight)
   KINO1TV-46. Только CSS: файл подключается ПОСЛЕ /static/build/min.css.
   Логотип и акцент (#188BF5) не меняются — акцент уже совпадает с брендбуком.

   Шкала поверхностей брендбука v4 (kino1tv-brandbook/brandbook-v4/css/style.css):
     --surface-deep     #07091A   было #11161B / rgba(19,31,42,…)
     --surface-base     #0B0E1A   было #21222D (hsl 235 15% 15%)
     --surface-card     #141828   было #2C2C37
     --surface-elevated #1B2036   было #414152
     hover-шаг          #262C45   было #363645   (единственное значение вне
                                                  брендбука — продолжение шкалы,
                                                  чтобы ховер остался различим)
   ========================================================================= */

:root {
  --k-surface-deep:     #07091A;
  --k-surface-base:     #0B0E1A;
  --k-surface-card:     #141828;
  --k-surface-elevated: #1B2036;
  --k-surface-hover:    #262C45;
  --k-elevated-scrim-40: rgba(27, 32, 54, .40);
  --k-scrim-90:         rgba(11, 14, 26, .90);
  --k-scrim-80:         rgba(11, 14, 26, .80);
  --k-base-scrim-70:    rgba(11, 14, 26, .70);
  --k-base-scrim-60:    rgba(11, 14, 26, .60);
  --k-base-scrim-40:    rgba(11, 14, 26, .40);
  --k-base-scrim-30:    rgba(11, 14, 26, .30);
  --k-base-scrim-98:    rgba(11, 14, 26, .98);
  --k-scrim-70:         rgba(7, 9, 26, .70);
  --k-scrim-60:         rgba(7, 9, 26, .60);
  --k-scrim-98:         rgba(7, 9, 26, .98);
  --k-image-bg:         rgba(20, 24, 40, .50);
  --k-card-scrim-90:    rgba(20, 24, 40, .90);
  --k-elevated-scrim-50: rgba(27, 32, 54, .50);
  --k-accent-tint-40:   rgba(24, 139, 245, .18);
  --k-accent-tint-60:   rgba(24, 139, 245, .26);
}

/* --- 1. Базовый фон страницы: #21222D → #0B0E1A ------------------------- */
html, body,
.video-wrap,
.player-wrap .app-splash        { background-color: var(--k-surface-base); }

.native-scroll-shell .native-scroll-button {
  background: linear-gradient(90deg, var(--k-surface-base) 0, var(--k-surface-base) 58px, rgba(11, 14, 26, 0) 100%);
}
.native-scroll-shell .native-scroll-button_next {
  background: linear-gradient(90deg, rgba(11, 14, 26, 0) 0, var(--k-surface-base) calc(100% - 58px), var(--k-surface-base) 100%);
}
/* хардкод #24252F в карусели сезонов — приводим к той же базе */
.seasons-nav-native-shell .native-scroll-button {
  background: linear-gradient(90deg, var(--k-surface-base) 0, var(--k-surface-base) 58px, rgba(11, 14, 26, 0) 100%);
}
.seasons-nav-native-shell .native-scroll-button_next {
  background: linear-gradient(90deg, rgba(11, 14, 26, 0) 0, var(--k-surface-base) calc(100% - 58px), var(--k-surface-base) 100%);
}

/* --- 2. Карточки и панели: #2C2C37 → #141828 ---------------------------- */
.item-page .footer,
.static-page .footer,
.mob-nav .mob-nav-overflow,
.cat-item_promo_img,
.cat-item_poster_img,
.cat-item_cover_img,
.cat-item_ban_img,
.cat-fotorama .arr--prev.arr--next:before,
.cat-fotorama .arr--next.arr--next:before,
.cat-fotorama .arr--prev.arr--prev:before,
.cat-fotorama .arr--next.arr--prev:before,
.series .cat-fotorama .arr--prev.arr--next:before,
.series .cat-fotorama .arr--next.arr--next:before,
.series .cat-fotorama .arr--prev.arr--prev:before,
.series .cat-fotorama .arr--next.arr--prev:before,
#channels_guide .full-width,
.payment-wrap,
.promo-block,
.promo-block-2,
.slindow                        { background-color: var(--k-surface-card); }

/* --- 3. Приподнятые поверхности: #414152 → #1B2036 --------------------- */
#navigation,
.nav-menu .nav-menu_sub,
.nav-menu .dropdown-menu,
.items-filter .filter-filter .dropdown-menu,
.items-filter .filter-filter .dropdown-toggle,
.footer .page-top,
.show-more a:hover,
.native-scroll-shell .native-scroll-button:active::before,
.native-scroll-shell .native-scroll-button:hover::before,
.genre-item.active,
.genre-item:active,
.genre-item:hover,
.seasons-nav-item.active,
.seasons-nav-item:active,
.seasons-nav-item:hover,
.mob-nav a.active,
.device-card,
.profile-subscribe-content .item .in,
.slindow .inline-b.msisdn-group input[name=login],
.slindow input.form-control.input-lg.pass,
.slindow .subs-item-button,
.slindow .subs-period            { background-color: var(--k-surface-elevated); }

.slindow .btns-pack li           { background-color: var(--k-surface-elevated) !important; }

.cat-fotorama.collection-car     { border-top-color: var(--k-surface-elevated);
                                   border-bottom-color: var(--k-surface-elevated); }
.slindow .inline-b.msisdn-group input[name=login],
.slindow input.form-control.input-lg.pass,
.slindow .subs-item-button,
.slindow .subs-period,
.slindow.modal-promo-code .subs-period,
.slindow .touch .modal .slindow .subs-period {
                                   border-color: var(--k-surface-elevated); }
.slindow .btns-pack li           { border-color: var(--k-surface-elevated) !important; }

.mob-nav a:hover                 { background-color: var(--k-elevated-scrim-40); }

/* --- 4. Ховер/активное над приподнятым: #363645 → #262C45 -------------- */
.device-icon,
.slindow .subs-item-button:hover,
.slindow .subs-item-button.active,
.slindow.modal-promo-code .subs-period:hover,
.slindow .touch .modal .slindow .subs-period:hover,
.slindow.modal-promo-code .subs-period:active,
.slindow .touch .modal .slindow .subs-period:active {
                                   background-color: var(--k-surface-hover); }
.slindow .subs-period:hover,
.slindow .subs-period.active     { background-color: var(--k-surface-hover) !important; }

/* --- 5. Навигация в режиме плеера: #11161B → #07091A ------------------- */
.item-page #navigation.blackest  { background-color: var(--k-surface-deep); }
body.player-mode #navigation     { background-color: var(--k-surface-deep) !important; }

/* --- 6. Затемнения и оверлеи ------------------------------------------- */
/* .8 над контентом */
.car-back:after,
.share-block .popover,
.series .season_series .item.free .i-w:after,
#channels_guide .pkvs-paywall.static .text-block,
.extraElement a.btn-auto-7:hover:before,
.modal-promoSubsSplash           { background-color: var(--k-scrim-80); }
#payment.modal                   { background: var(--k-scrim-80); }
.share-block .popover.bottom > .arrow:after { border-bottom-color: var(--k-scrim-80); }

/* .9 — бейджи и плашки поверх постеров */
.watched-title,
.series .season_series .item.watched .i-w:before { background: var(--k-scrim-90); }
.nfo .series_count,
.ageBadge,
.extraElement a:before           { background-color: var(--k-scrim-90); }
.serial-list-items .remove       { background: url(/static/public/img/svg/cross.svg) var(--k-scrim-90) center center no-repeat; }

/* .6 — мягкие подложки */
.landing .buttons .continue:before,
html:not(.touch) #nav-wrap.top #navigation .bg:after,
.min-age:before                  { background-color: var(--k-scrim-60); }

.min-age                        { background-color: var(--k-surface-card); }

/* .7 — подложка модалок */
.modal,
.modal-promoSubsSplash,
.slindow-overlay                 { background-color: var(--k-scrim-70); }

/* .98 — активный фильтр */
.items-filter .filter-filter .active { background-color: var(--k-scrim-98); }
#channels_guide .fullSchedule .fullSchedule-overlay { background-color: var(--k-base-scrim-98); }

/* .5 — подложка под постером в списке серий */
.serial-list-items > li .i-w,
.serial-list-items.on-air li .i-w,
body.mob-nav-opened:after,
.serial-list-items.promo li a    { background-color: var(--k-image-bg); }

/* inline-подложка оплаты и SVG-плейсхолдеры карточек */
.payment-wrap .head .bg          { background: var(--k-card-scrim-90) !important; }
.placeholder-car-item stop:first-child,
.placeholder-car-item stop:last-child { stop-color: var(--k-image-bg); }
.placeholder-car-item stop:nth-child(2) { stop-color: var(--k-elevated-scrim-50); }

/* --- 7. Синие подтяжки каруселей: hsla(210,45%,20%) → тинт акцента ----- */
.premieres .cat-fotorama .arr--prev,
.premieres .cat-fotorama .arr--next {
  background: linear-gradient(to left, rgba(0, 0, 0, 0), var(--k-accent-tint-40));
}
.premieres .cat-fotorama .arr--prev.arr--next,
.premieres .cat-fotorama .arr--next.arr--next {
  background: linear-gradient(to right, rgba(0, 0, 0, 0), var(--k-accent-tint-40));
}
#nav-wrap #navigation .bg:after  { background-color: var(--k-accent-tint-60); }

/* --- 8. Цвет текста на светлой плашке возрастного бейджа --------------- */
#channels_guide .fullSchedule .fullSchedule-item-title .ageBadge { color: var(--k-surface-base); }

/* --- 9. Embed-плеер: старая базовая поверхность и её прозрачности ------- */
.eump-player.eump-xsmall .eump-flexmenu-close-button,
.eump-player .eump-share-close-button,
.eump-player.eump-com-enabled.eump-sub-popup-enabled .eump-sub-popup .eump-sub-close-button,
.eump-player.eump-episodes-menu-enabled .eump-episodes-close-button {
  background: var(--k-surface-base);
}
.eump-play-not-available {
  background-color: var(--k-surface-base);
}

.eump-ended-show-sim:not(.has-rated) .eump-placeholder {
  background: var(--k-scrim-80) !important;
}
.eump-paused .eump-similar .similar-block,
.eump-ended-show-sim.has-rated .eump-similar .similar-block,
.eump-player .eump-footer {
  background: var(--k-scrim-80);
}

.eump-player.eump-xsmall .eump-flexmenu-page-nav,
.eump-player.eump-xsmall .eump-flexmenu-page-nav-content,
.eump-player.eump-started.eump-muted .eump-muted-label,
.eump-player.eump-started.eump-vol-0 .eump-muted-label,
.eump-player.eump-com-enabled.eump-sub-popup-enabled .eump-sub-popup,
.eump-player .eump-popup,
.eump-player.eump-live1tv-enabled.eump-live1tv-comsticker-enabled .eump-live1tv-comsticker,
.eump-night-time-label {
  background: var(--k-base-scrim-70);
}
.eump-player.eump-com-enabled .eump-com-label-button,
.eump-player.eump-com-enabled .eump-com-label-text,
.eump-player.eump-com-enabled.eump-com-can-skip .eump-com-label-text,
.eump-player.eump-com-enabled.eump-com-can-skip.eump-xsmall .eump-com-label-text,
.eump-midrolls-enabled .eump-midrolls-label .eump-midrolls-label-text {
  background-color: var(--k-base-scrim-70);
}

.eump-player .eump-new-volume-slider .eump-new-volume-svg,
.eump-player.eump-com-enabled.eump-com-has-linktxt .eump-com-linktxt-holder,
.eump-player.eump-episodes-menu-enabled .eump-episodes-menu {
  background: var(--k-base-scrim-60);
}
.eump-player .eump-new-volume-slider .eump-new-volume-svg path:first-child {
  fill: var(--k-base-scrim-60);
}

.eump-player .eump-timeline .eump-episode-serifs div::after {
  background-color: var(--k-base-scrim-40);
}
.eump-player .eump-small-options-items,
.eump-player .eump-tip-next-prev {
  background: var(--k-base-scrim-30);
}
.eump-player.eump-live1tv-enabled .eump-tip-next-prev {
  background: var(--k-base-scrim-30) !important;
}