/* GhostFilm — призрачная тема. Подключается после основных стилей. */

:root {
  --ghost-mint: #7cf3cf;
  --ghost-cyan: #5ad7f0;
  --ghost-violet: #9b8cff;
  --ghost-ink: #0a0c12;
  --glow: 0 0 18px rgba(124, 243, 207, .45);
  --glow-soft: 0 0 28px rgba(124, 243, 207, .22);
}

/* ---------- светлая тема: «молочный призрак» ---------- */
:root {
  --bg: #ffffff;
  --bg-darker: #eef3f8;
  --bg-darker-1: #e2e9f1;
  --tt: #2a3344;
  --tt-fade: #6f7b90;
  --accent: #1fb88c;
  --ui-bg-btn: #1fb88c;
  --ui-bg-btn-hover: #17a07a;
  --ui-tt-btn: #fff;
  --ui-bdc-inp-focus: #1fb88c;
}

/* ---------- тёмная тема: основная ---------- */
.dt {
  --bg: rgba(20, 25, 36, .78);
  --bg-darker: #0e121b;
  --bg-darker-1: #0a0d14;
  --bg-black: #090b11;
  --bg-blackest: #06080c;
  --tt: #e3e9f4;
  --tt-fade: #98a5ba;
  --tt-fade-0: #b6c1d3;
  --bdc: rgba(160, 190, 230, .16);
  --accent: var(--ghost-mint);
  --ui-bg-btn: var(--ghost-mint);
  --ui-bg-btn-hover: #a4fae0;
  --ui-tt-btn: #05241b;
  --ui-bg: #141924;
  --ui-bg-darker: #0e121b;
  --ui-bg-darkest: #090b11;
  --ui-accent: var(--ghost-cyan);
  --ui-bdc-inp-focus: var(--ghost-mint);
  --bsh-long: 0 0 80px rgba(0, 0, 0, .65);
  --bsh-block: 0 1px 0 rgba(124, 243, 207, .14), 0 8px 24px rgba(0, 0, 0, .35);
  --bsh: 0 0 0 1px rgba(160, 190, 230, .1), 0 6px 18px rgba(0, 0, 0, .5);
}

::selection { background: rgba(124, 243, 207, .35); color: #fff; }
html { scrollbar-color: rgba(124, 243, 207, .45) #0a0c12; scrollbar-width: thin; }

/* ---------- фон ---------- */
body.dt {
  background:
    radial-gradient(1200px 600px at 50% -120px, rgba(90, 215, 240, .14), transparent 70%),
    radial-gradient(900px 500px at 8% 40%, rgba(155, 140, 255, .08), transparent 70%),
    radial-gradient(900px 500px at 95% 70%, rgba(124, 243, 207, .06), transparent 70%),
    #0a0c12;
  background-attachment: fixed;
}
body.lt {
  background: radial-gradient(1000px 500px at 50% -100px, rgba(124, 243, 207, .25), transparent 70%), #dfe8f1;
  background-attachment: fixed;
}
.wrapper::before { filter: grayscale(.2) hue-rotate(120deg) brightness(.85); opacity: .55; }
.dt .wrapper::after { background: linear-gradient(to top, #0e121b 0%, transparent 300px); }
.wrapper__container--main { background-color: var(--bg-darker); box-shadow: var(--bsh-long); border-radius: 0 0 14px 14px; }
.dt .wrapper__container--main { box-shadow: var(--bsh-long), 0 0 0 1px rgba(124, 243, 207, .07); }

/* ---------- плавающие призраки ---------- */
.ghost-field { position: fixed; inset: 0; z-index: 1; pointer-events: none; overflow: hidden; }
.ghost-field i {
  position: absolute; display: block; width: var(--s); height: var(--s);
  background: url(../images/ghost-logo.svg) center / contain no-repeat;
  opacity: var(--o); filter: blur(var(--b)) drop-shadow(0 0 22px rgba(124, 243, 207, .5));
  left: var(--x); top: var(--y);
  animation: ghost-float var(--d) ease-in-out infinite, ghost-sway calc(var(--d) * 1.7) ease-in-out infinite;
  animation-delay: var(--dl), var(--dl);
}
.ghost-field i:nth-child(1) { --s: 110px; --o: .10; --b: 1px; --x: 3%;  --y: 18%; --d: 9s;  --dl: 0s; }
.ghost-field i:nth-child(2) { --s: 70px;  --o: .08; --b: 2px; --x: 93%; --y: 12%; --d: 7s;  --dl: -2s; }
.ghost-field i:nth-child(3) { --s: 150px; --o: .07; --b: 3px; --x: 90%; --y: 58%; --d: 12s; --dl: -4s; }
.ghost-field i:nth-child(4) { --s: 60px;  --o: .10; --b: 1px; --x: 6%;  --y: 72%; --d: 8s;  --dl: -1s; }
.ghost-field i:nth-child(5) { --s: 90px;  --o: .06; --b: 2px; --x: 48%; --y: 86%; --d: 10s; --dl: -5s; }
.lt .ghost-field i { filter: blur(var(--b)) drop-shadow(0 0 14px rgba(31, 184, 140, .5)); --o: .12; }
@keyframes ghost-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -34px; } }
@keyframes ghost-sway { 0%, 100% { rotate: -5deg; } 50% { rotate: 5deg; } }

/* ---------- шапка ---------- */
.dt .header {
  background: rgba(14, 18, 27, .72);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  backdrop-filter: blur(16px) saturate(1.4);
  border-bottom: 1px solid rgba(124, 243, 207, .18);
}
.lt .header { background: rgba(255, 255, 255, .82); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.dt .header__menu > li > a { color: #dbe4f2; opacity: .75; transition: opacity .2s, color .2s, text-shadow .2s; }
.dt .header__menu > li > a:hover, .dt .header__menu > li.active > a { opacity: 1; color: var(--ghost-mint); text-shadow: 0 0 14px rgba(124, 243, 207, .6); }
.header__menu > li.active > a::after, .header__menu > li > a:hover::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--ghost-mint), transparent); box-shadow: 0 0 12px var(--ghost-mint);
}
.header__menu > li > a { position: relative; }

.logo::before {
  background-image: url(../images/ghost-logo.svg); background-size: contain;
  filter: drop-shadow(0 0 8px rgba(124, 243, 207, .55)); animation: ghost-bob 4s ease-in-out infinite;
}
@keyframes ghost-bob { 0%, 100% { translate: 0 -50%; } 50% { translate: 0 calc(-50% - 3px); } }
.dt .header__logo span, .dt .footer__logo span { color: var(--ghost-mint); text-shadow: 0 0 16px rgba(124, 243, 207, .55); }
.header__logo span { color: #1fb88c; }

.dt .search-block__input { background: rgba(255, 255, 255, .05); border-radius: 999px; padding-left: 18px; }
.dt .search-block__input:focus { box-shadow: 0 0 0 1px var(--ghost-mint), var(--glow); }
.dt .search-block__btn { color: var(--ghost-mint); }

/* ---------- кнопки ---------- */
.btn:not(.btn-nobg):not(.btn-border):not(.btn-fade), input[type=submit], input[type=button], button.header__btn-login, .ac-form__btn {
  background-image: linear-gradient(135deg, var(--ghost-mint), var(--ghost-cyan));
  border: 0; border-radius: 999px; font-weight: 600; letter-spacing: .02em;
  box-shadow: 0 4px 14px rgba(90, 215, 240, .28); transition: box-shadow .25s, transform .2s, filter .2s;
}
.dt .btn:not(.btn-nobg):not(.btn-border):not(.btn-fade), .dt input[type=submit], .dt input[type=button], .dt button.header__btn-login, .dt .ac-form__btn { color: #05241b; }
.btn:not(.btn-nobg):not(.btn-border):not(.btn-fade):hover, input[type=submit]:hover, input[type=button]:hover, button.header__btn-login:hover, .ac-form__btn:hover {
  box-shadow: var(--glow), 0 6px 20px rgba(90, 215, 240, .35); transform: translateY(-1px); filter: brightness(1.08);
}
.dt .header__theme-select { color: var(--ghost-mint); }

/* ---------- заголовки и вкладки ---------- */
.dt .sect__title, .dt .page__header h1 { color: #fff; }
.sect > .sect__header > h1.sect__title, .carou__caption { position: relative; padding-left: 34px; }
.sect > .sect__header > h1.sect__title::before, .carou__caption::before {
  content: ''; position: absolute; left: 0; top: 50%; width: 24px; height: 24px; translate: 0 -50%;
  background: url(../images/ghost-logo.svg) center / contain no-repeat; filter: drop-shadow(0 0 6px rgba(124, 243, 207, .6));
}
.dt .carou__caption { color: #fff; }
.dt .sect__tabs button.is-active { background: rgba(124, 243, 207, .12); color: var(--ghost-mint); border-radius: 999px; box-shadow: inset 0 0 0 1px rgba(124, 243, 207, .35); }
.sect__tabs button { border-radius: 999px; transition: background .2s, color .2s; }
.dt .sect__tabs button:hover { color: var(--ghost-mint); }
.dt .carou { background: linear-gradient(180deg, #06080c, #0a0e16); border-bottom: 1px solid rgba(124, 243, 207, .1); }
.dt .speedbar { color: var(--tt-fade); }
.dt .speedbar a { color: #cfe9e1; }

/* ---------- карточки ---------- */
.item { transition: transform .35s cubic-bezier(.2, .8, .2, 1); }
.item:hover { transform: translateY(-6px); z-index: 4; }
.item__img { border-radius: 10px; transition: box-shadow .35s; }
.dt .item:hover .item__img { box-shadow: 0 0 0 1px rgba(124, 243, 207, .55), 0 0 28px rgba(124, 243, 207, .28), 0 14px 30px rgba(0, 0, 0, .6); }
.lt .item:hover .item__img { box-shadow: 0 0 0 1px rgba(31, 184, 140, .5), 0 12px 26px rgba(31, 100, 140, .25); }
.item__img img { transition: transform .6s cubic-bezier(.2, .8, .2, 1), filter .4s; }
.item:hover .item__img img { transform: scale(1.07); filter: saturate(1.15); }
.img-mask::after { height: 70%; background: linear-gradient(to top, rgba(6, 8, 14, .97) 0%, rgba(10, 16, 28, .6) 45%, transparent 100%); }
.item__desc { border-radius: 10px; }
.item__title { text-shadow: 0 2px 10px rgba(0, 0, 0, .8); }
.green, .red, .fade {
  border-radius: 999px; padding: 3px 12px; letter-spacing: .04em; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.green { background: rgba(124, 243, 207, .9); color: #05241b; box-shadow: 0 0 12px rgba(124, 243, 207, .5); }
.red { background: rgba(255, 107, 129, .92); box-shadow: 0 0 12px rgba(255, 107, 129, .45); }
.fade { background: rgba(120, 135, 160, .85); }
.item__rates-item.kp::before { color: #ff8a3d; }

/* ---------- страница фильма ---------- */
.dt .page__bg { background: linear-gradient(180deg, rgba(20, 26, 40, .85), rgba(14, 18, 27, .9)); border-top: 1px solid rgba(124, 243, 207, .1); }
.dt .page__cols-right { background-color: rgba(255, 255, 255, .03); }
.dt .page__poster, .dt .page__img { box-shadow: 0 0 0 1px rgba(124, 243, 207, .25), 0 0 30px rgba(124, 243, 207, .14), 0 14px 30px rgba(0, 0, 0, .5); }
.dt .page__list a { color: var(--ghost-mint); --blue: var(--ghost-mint); }
.dt .page__list a:hover { text-shadow: 0 0 10px rgba(124, 243, 207, .6); }
.page__ratingscore-ring { box-shadow: 0 0 18px rgba(124, 243, 207, .35); }
.dt .fr:hover .fr__title, .dt .fr.is-active .fr__title { color: var(--ghost-mint); }
.dt .fr__img { border-radius: 6px; overflow: hidden; box-shadow: 0 0 0 1px rgba(124, 243, 207, .18); }
.dt .page__cols:has(.page__player) .page__cols-right { background-color: #0a0d14; }

/* плеер: призрачная заставка */
#main-container { border-radius: 12px; box-shadow: 0 0 0 1px rgba(124, 243, 207, .25), 0 0 40px rgba(124, 243, 207, .12); }
#main-container::before {
  content: ''; position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background: radial-gradient(circle at 50% 55%, rgba(124, 243, 207, .10), transparent 55%);
}
.action-trigger { border-color: rgba(124, 243, 207, .6); box-shadow: 0 0 34px rgba(124, 243, 207, .28); animation: pulse-glow 3s ease-in-out infinite; }
.action-trigger::before {
  content: ''; display: block; width: 46px; height: 46px; margin: 0 auto 10px;
  background: url(../images/ghost-logo.svg) center / contain no-repeat; filter: drop-shadow(0 0 10px rgba(124, 243, 207, .8));
}
@keyframes pulse-glow { 0%, 100% { box-shadow: 0 0 22px rgba(124, 243, 207, .2); } 50% { box-shadow: 0 0 46px rgba(124, 243, 207, .45); } }

/* ---------- формы, комментарии, пагинация ---------- */
.dt .ac-form__editor textarea, .dt .ac-form__header input, .dt .filter__cell select, .dt .comm, .dt input[type=text] {
  background-color: rgba(0, 0, 0, .35); border-color: rgba(160, 190, 230, .18); color: #e3e9f4;
}
.dt .ac-form__editor textarea:focus, .dt .ac-form__header input:focus { outline: none; box-shadow: 0 0 0 1px var(--ghost-mint), var(--glow); }
.dt .comm { border: 1px solid rgba(160, 190, 230, .1); border-radius: 10px; }
.comm__letter { border-radius: 50%; box-shadow: 0 0 12px rgba(155, 140, 255, .5); background: linear-gradient(135deg, #9b8cff, #5ad7f0) !important; }
.pagination__pages a, .pagination__pages span { border-radius: 999px; }
.pagination__pages span:not(.nav_ext) { background: linear-gradient(135deg, var(--ghost-mint), var(--ghost-cyan)); color: #05241b; box-shadow: var(--glow); }
.dt .pagination__pages a:hover { color: var(--ghost-mint); box-shadow: inset 0 0 0 1px rgba(124, 243, 207, .5); }
.message-info { border-radius: 10px; }

/* ---------- подвал: призрачный край ---------- */
.footer { position: relative; margin-top: 56px; border-radius: 0 0 14px 14px; }
.footer::before {
  content: ''; position: absolute; left: 0; right: 0; top: -39px; height: 40px; background: var(--bg-black);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 40' preserveAspectRatio='none'%3E%3Cpath d='M0 40V22c10 0 10-14 20-14s10 14 20 14 10-14 20-14 10 14 20 14 10-14 20-14 10 14 20 14v18z'/%3E%3C/svg%3E") bottom / 120px 40px repeat-x;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 40' preserveAspectRatio='none'%3E%3Cpath d='M0 40V22c10 0 10-14 20-14s10 14 20 14 10-14 20-14 10 14 20 14 10-14 20-14 10 14 20 14v18z'/%3E%3C/svg%3E") bottom / 120px 40px repeat-x;
}
.dt .footer { background: linear-gradient(180deg, #090b11, #06080c); }
.footer__menu a { color: var(--ghost-mint); }

.scrolltop { border-radius: 50%; background-image: linear-gradient(135deg, var(--ghost-mint), var(--ghost-cyan)); color: #05241b; box-shadow: var(--glow); }

/* ---------- 404 ---------- */
.ghost-404 { text-align: center; padding: 30px 0 10px; }
.ghost-404 img { width: 120px; height: 120px; animation: ghost-bob2 3.5s ease-in-out infinite; filter: drop-shadow(0 0 24px rgba(124, 243, 207, .6)); }
.ghost-404 p { margin: 10px 0 0; color: var(--tt-fade); }
@keyframes ghost-bob2 { 0%, 100% { translate: 0 0; } 50% { translate: 0 -14px; } }

@media (max-width: 760px) {
  .ghost-field i:nth-child(n+4) { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .ghost-field i, .logo::before, .action-trigger, .ghost-404 img { animation: none !important; }
  .item, .item__img img { transition: none; }
}