@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
@import "bm.css";

@font-face {
  font-family: iconfont;
  font-style: normal;
  font-weight: 400;
  src: url(../font/iconfont.ttf) format("woff2"), url(../font/iconfont.ttf) format("woff"), url(../font/iconfont.ttf) format("truetype"), local("☺");
}

@media screen and (max-width: 511px) {
  .noveltyPromo__footer .nbl-button__primaryText {
    font-size: 0;
  }

  .noveltyPromo__footer .nbl-button__iconWrapper {
    margin-right: 0 !important;
  }
}

.-translate-x-1\/2 {
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-y-1\/2 {
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}



*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x: ;
  --tw-pan-y: ;
  --tw-pinch-zoom: ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position: ;
  --tw-gradient-via-position: ;
  --tw-gradient-to-position: ;
  --tw-ordinal: ;
  --tw-slashed-zero: ;
  --tw-numeric-figure: ;
  --tw-numeric-spacing: ;
  --tw-numeric-fraction: ;
  --tw-ring-inset: ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur: ;
  --tw-brightness: ;
  --tw-contrast: ;
  --tw-grayscale: ;
  --tw-hue-rotate: ;
  --tw-invert: ;
  --tw-saturate: ;
  --tw-sepia: ;
  --tw-drop-shadow: ;
  --tw-backdrop-blur: ;
  --tw-backdrop-brightness: ;
  --tw-backdrop-contrast: ;
  --tw-backdrop-grayscale: ;
  --tw-backdrop-hue-rotate: ;
  --tw-backdrop-invert: ;
  --tw-backdrop-opacity: ;
  --tw-backdrop-saturate: ;
  --tw-backdrop-sepia: ;
  --tw-contain-size: ;
  --tw-contain-layout: ;
  --tw-contain-paint: ;
  --tw-contain-style: ;
}

.icon {
  font-family: iconfont;
  position: relative;
}

.icon-play:before {
  content: "\E2ED";
}
.icon-trash:before {
  content: "\E0D3";
}
.icon-1080:before {
  content: "\E000";
}
.icon-eye:before {
  content: "\E39D";
}
.icon-tv:before {
  content: "\E1F7";
}
.icon-percent:before {
  content: "\E0E9";
}
.icon-mobile:before {
  content: "\E3ED";
}
.icon-plus:before {
  content: "\E010";
}

.icon-review:before {}

.icon-mark:before {
  content: "\E15D";
}

.icon-marked:before {
  content: "\E15B";
}

.icon-left:before {
  content: "\E03C";
}

.icon-right:before {
  content: "\E043";
}

.icon-tv:before {
  content: "\E1F7";
}
.icon-bell:before {
  content: "\E328";
}
.icon-volume:before {
  content: "\E313";
}
.icon-mute:before {
  content: "\E31A";
}
.icon-warning:before {
  content: "\E065";
}

.icon-tv:before {
  content: "\E1F7";
}

.icon-bell-active:before {
  content: "\E327";
}

.icon-like:before {
  content: "\E3FD";
}

.icon-like-active:before {
  content: "\E3FB";
}

.icon-share:before {
  content: "\E396";
}

.icon-similar:before {
  content: "\E3A8";
}

.icon-rating:before {
  content: "\E343";
}

.icon-hide:before {
  content: "\E225";
}

.icon-like:before {
  content: "\E3FD";
}

.icon-disslike:before {
  content: "\E3F3";
}

.icon-disslike-active:before {
  content: "\E3EE";
}

.icon-check:before {
  content: "\E38B";
}

.icon.icon-close:before {
  content: "\E144";
}

.icon.icon-user:before {
  content: "\E055";
}

.icon.icon-down:before {
  content: "\E030";
}

.icon.icon-up:before {
  content: "\E049";
}

.icon.icon-camera:before {
  content: "\E280";
}

.icon.icon-series:before {
  content: "\E250";
}

.icon.icon-info:before {
  content: "\E00B";
}

.icon.icon-logout:before {
  content: "\E150";
}

.icon.icon-play:before {
  content: "\E2EF";
}

.icon.icon-fullscreen:before {
  content: "\E172";
}

.w-1-7 {
  width: 153.143px;
}

.line-clamp-1 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.line-clamp-2 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.line-clamp-3 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

:root {
  --color-white: #fff;
  --color-gray: #ffffff7a;
  --color-text-secondary-gray: #a5a1b2;
  --color-secondary: #1f1b2e;
  --color-secondary-bg: #3e3758;
  --color-gray-button: #1f1b2e;
  --color-hover-gray-button: #1e2332;
  --color-secondary-hover: #2e2844;
  --color-softred: #db242491;
  --color-red: #f30745;
  --color-hover-red: #a90909;
  --color-hover-softred: #db2424;
  --color-lightgreen: #40d04f;
  --color-dropdown-box-default: #7e798f;
  --color-modal-background: rgba(7, 5, 14, 0.96);
}

.first-bg {
  background-color: #2b2442;
  border-radius: 16px;
  padding-bottom: 8px;
  padding-top: 8px;
}

/*
  1. Use a more-intuitive box-sizing model.
*/
*,
*::before,
*::after {
  box-sizing: border-box;
}

/*
    2. Remove default margin
  */
* {
  margin: 0;
}

/*
    Typographic tweaks!
    3. Add accessible line-height
    4. Improve text rendering
  */
body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  font-family: "Poppins", system-ui;
  background-color: #100e19;
  color: white;
  height: 100%;
}

body.contentCard {
  height: 100% !important;
  overflow-x: hidden;
  width: auto !important;
}

/*
    5. Improve media defaults
  */
img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

/*
    6. Remove built-in form typography styles
  */
input,
button,
textarea,
select {
  font: inherit;
}

/*
    7. Avoid text overflows
  */
p,
h1,
h2,
h3,
h4,
h5,
h6 {
  overflow-wrap: break-word;
}

/*
    8. Create a root stacking context
  */
#root,
#__next {
  isolation: isolate;
}

a {
  text-decoration: none;
}

li {
  text-align: left;
  list-style-type: none;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
  object-fit: cover;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: -moz-crisp-edges;
  image-rendering: crisp-edges;
}

button:focus {
  outline: none;
}

.primary-fs {
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}

.line-clamp-3 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.root {
  background-color: #100e19;
  display: flex;
  flex: 1 0 auto;
  flex-direction: column;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
  min-height: 100%;
  overflow-x: hidden;
  padding: 0;
  position: relative;
  width: 100%;
}

#grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 15px;
  padding: 20px;
  max-width: 1200px;
  margin: 0 auto;
}

.section-title {
  line-height: 24px;
  text-align: left;
  margin-bottom: 1.5rem;
}

.section-title:not(.blank) {
  margin-top: 3rem;
}

.section-title .section-title-arrow {
  display: inline-block;
  margin-left: 8px;
}

.section-title .section-title-arrow-item {
  background-image: url(../images/arrowRight_6x16.svg);
  height: 16px;
  width: 6px;
}

.section-title .section-title-arrow .section-title-arrow-item {
  position: relative;
  top: 1px;
}

.section-title h2 {
  font-size: 21px;
  font-style: normal;
  font-weight: 700;
}

.section-title p {
  color: var(--color-text-secondary-gray);
  font-size: 14px;
}

.grid-item {
  background-color: #333;
  border: 1px solid #444;
  padding: 20px;
  border-radius: 8px;
  text-align: center;
}

.grid-item h3 {
  font-size: 18px;
  margin-bottom: 10px;
}

.grid-item p {
  margin: 5px 0;
  font-size: 14px;
}

.header {
  background-color: rgba(16, 14, 25, 0);
  z-index: 1000;
}

.header-body {
  height: 72px;
  align-items: stretch;
  box-sizing: border-box;
  display: flex;
  position: relative;
}

.header-logo-image {
  display: block;
  width: 150px;
  aspect-ratio: 16 / 5;
}

.header-logo svg {
  width: 150px;
}

.header-nav ul,
.header-nav ul li {
  height: 100%;
  display: flex;
  align-items: center;
}

.header-nav ul li:first-child {
  padding-left: 0;
}

.header-nav ul li:hover a {
  color: #fff;
}

.header-nav ul li a {
  white-space: nowrap;
  height: 100%;
  display: flex;
  align-items: center;
  padding: 10px 16px;
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  color: hsla(0, 0%, 100%, 0.48);
  transition: 0.4s;
}

.header-search-button {
  transition: 0.4s;
}

.header-search-button img,
.notification-button a img {
  width: 16px;
  opacity: 0.48;
  transition: 0.4s;
}

.header-search-button:hover img,
.notification-button a:hover img {
  opacity: 1;
}

.header-search-button:hover span {
  color: #fff;
}

.header-login-button .login-btn {
  background-color: var(--color-softred);
  border-radius: 12px;
  border-width: 1px;
  border-color: var(--color-softred);
  height: 40px;
  padding: 9px 9px 9px 4px;
  color: #fff;
  font-size: 15px;
  transition: 0.4s;
  transition-property: border-color, background-color;
}

.header-login-button .login-btn:hover {
  background-color: var(--color-hover-softred);
  border-color: var(--color-hover-softred);
}

.header-login-button .login-btn:hover .avatar-box {
  background-color: var(--color-hover-red);
  border-color: var(--color-hover-red);
}

.avatar-box {
  background-color: #140c3342;
  background-image: linear-gradient(126deg, rgba(58, 53, 90, 0), #312a483d);
  border: 1px;
  padding: 8px;
  border-radius: 6px;
  margin-right: 6px;
  transition: 0.4s;
}

.login-btn-text {
  padding-left: 4px;
  padding-right: 12px;
}

.header-items .header-dropdown-menu {
  background: var(--color-secondary);
  border-radius: 12px;
  box-shadow: 0 20px 96px #12101b;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  transform: translateY(0);
  transition-delay: 0s;
  transition-duration: 0.4s;
  transition-property: visibility, opacity, height;
  transition-timing-function: ease-out;
  visibility: hidden;
  width: 100%;
  will-change: transform, height;
  z-index: -2;
}

.hovered-header-items {
  transition-duration: 250ms;
}

.hovered-header-items .header-dropdown-menu {
  opacity: 1;
  overflow: hidden;
  transform: translateY(4px);
  transition-duration: 250ms;
  visibility: visible;
}

.header-item.headerTop_state_init {
  background-color: rgba(16, 14, 25, 0);
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transform: translateY(0);
  transition-duration: 80ms;
  z-index: 1000;
}

.dropdown-menu-body {
  background-color: var(--color-secondary);
  height: 460px;
}

.headerDropdown__body {
  box-sizing: border-box;
  margin-top: 68px;
  padding: 32px;
  position: relative;
  height: 100%;
  display: flex;
  justify-content: space-between;
}

.in-page .header-body:after {
  background-color: hsla(0, 0%, 100%, 0.16);
  bottom: 0;
  content: "";
  height: 1px;
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
}

body:not(.in-page) .headerDropdown__body {
  border-top: 1px solid hsla(0, 0%, 100%, 0.16);
}

.visible.transition {
  position: relative;
  z-index: 10000;
}

.headerDropdown__grid {
  width: 100%;
  display: flex;
  gap: 20px;
}

.dropdownLinksList {
  width: 100%;
  margin-bottom: 20px;
}

.dropdownLinksList__title {
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 10px;
  text-align: left;
}

.dropdownContent__doubleColumn {
  width: 33.33333333%;
}

.dropdownContent__doubleColumn,
.dropdownContent__singleColumn {
  box-sizing: border-box;
  padding-left: 12px;
  padding-right: 12px;
}

.dropdownContent__singleColumn {
  width: 16.66666667%;
}

.dropdownContent__doubleColumn .dropdownLinksList__list {
  -moz-column-count: 2;
  column-count: 2;
  -moz-column-fill: auto;
  column-fill: auto;
  -moz-column-gap: 24px;
  column-gap: 24px;
  height: 304px;
}

.dropdownLinksList__item {
  margin-bottom: 8px;
  break-inside: avoid;
  font-size: 14px;
  color: var(--color-text-secondary-gray);
}

.nbl-link {
  cursor: pointer;
  display: inline;
  opacity: 1;
  position: relative;
  text-decoration: none;
  transition-property: color, box-shadow, opacity;
}

.watchParams__item .nbl-link_noLink {
  cursor: default;
  pointer-events: none;
}

.nbl-link:not(:hover):not(:active),
.nbl-link:not(:hover):not(:active) .nbl-link:after,
body.touch .nbl-link:hover:not(:active),
body.touch .nbl-link:hover:not(:active) .nbl-link:after {
  transition-duration: 0.4s;
}

.nbl-link_style_wovou.nbl-link:not(:hover):not(:active) {
  color: hsla(0, 0%, 100%, 0.72);
}

.dropdownContent__sideContent {
  box-sizing: border-box;
  display: flex;
  justify-content: flex-end;
  margin-bottom: 20px;
  padding-left: 12px;
  padding-right: 12px;
  width: 50%;
  border-left: 1px solid rgb(255 255 255 / 13%);
}

.subscription-img {
  width: 300px;
  border-radius: 8px;
}

.subscription-details {
  text-align: center;
  margin-top: 10px;
}

.subscription-details h4 {
  color: var(--color-red);
  font-weight: 600;
}

/* Movie List CSS */
.movie-list {
  padding: 20px 0;
}

.static-movie-list .movie-list-box {
  margin: -10px;
}

.static-movie-list .movie-list-box .movie-list-card {
  padding: 10px;
}

.trend-movies-slide .movie-list-card .movie-link {
  min-width: 58%;
  max-width: 58%;
}

.movie-link {
  display: block;
  transition: 0.3s ease;
}

.movie-list-card:hover img,
.cast-movie-list-card:hover img {
  transform: scale(1.04);
  transition: transform 0.3s ease;
}

.movie-list-card:hover .image-properties,
.cast-movie-list-card:hover .image-properties {
  opacity: 1;
  transition-duration: 0.3s;
  transform: scale(1.04);
  z-index: 4;
}

.movie-list-card:hover .box-numbers img,
.cast-movie-list-card:hover .box-numbers img {
  opacity: 1;
  transition-duration: 0.3s;
  transform: scale(1.04);
  z-index: 4;
}

.movie-list-card:hover .movie-list-info h4,
.cast-movie-list-card:hover .movie-list-info h4 {
  color: var(--color-white);
}

.image-properties {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgb(0 0 0 / 75%);
  padding: 10px;
  border-radius: 16px;
  transition-duration: 0.3s;
  z-index: 2;
}

.image-properties .action-buttons ul li button .icon {
  font-size: 22px;
}

.movie-info {
  position: absolute;
  bottom: 0;
  right: 0;
  padding: 10px;
}

.movie-info .categories,
.movie-info .season-info {
  font-size: 12px;
  font-weight: 500;
  color: var(--color-text-secondary-gray);
}

.movie-info .item-name {
  color: #fff;
}

.movie-info .movie-info-rating {
  line-height: 0;
}

.movie-info .movie-info-rating strong,
.movie-info .movie-info-rating span {
  letter-spacing: -5px;
}
.movie-info .anime-rating strong,
.movie-info .anime-rating span {
  letter-spacing: -2px;
}

.movie-info .movie-info-rating span {
  font-size: 35px;
}

.custom-carousel {
  display: flex;
  overflow-x: auto;
  margin:0 -10px;
}

.custom-carousel::-webkit-scrollbar {
  height: 8px;
}

.custom-carousel::-webkit-scrollbar-thumb,
.icon-box-wrapper::-webkit-scrollbar-thumb {
  background-color: var(--color-secondary-bg);
  border-radius: 4px;
}

.carousel-item {
  padding: 10px;
}

.carousel-link {
  flex: 0 0 auto;
  width: 150px;
  background-color: var(--color-secondary);
  border-radius: 8px;
  padding: 12px;
  text-align: center;
  transition: transform 0.3s ease, background-color 0.3s ease;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  color: var(--color-text-primary);
}

.carousel-link:hover {
  transform: scale(1.05);
  background-color: var(--color-secondary-hover);
}

.carousel-icon {
  width: 32px;
  height: 32px;
  margin-bottom: 8px;
}

.carousel-caption {
  font-size: 14px;
  font-weight: 500;
}

/* Varsayılan olarak her satırda 7 kart (lg ekranlar) */
.static-movie-list .movie-list-card {
  width: calc(100% / 7);
  /* 7 kart */
}

/* Orta büyüklükteki ekranlar (1024px ve altı) - 5 kart */
@media (max-width: 1024px) {
  .static-movie-list .movie-list-card {
    width: calc(100% / 5);
    /* 5 kart */
  }
}

/* Küçük ekranlar (768px ve altı) - 3 kart */
@media (max-width: 768px) {
  .static-movie-list .movie-list-card {
    width: calc(100% / 3);
    /* 3 kart */
  }

  .custom-carousel {
    gap: 12px;
  }

  .carousel-item {
    width: 120px;
    padding: 10px;
  }
}

/* Ekstra küçük ekranlar (576px ve altı) - 2 kart */
@media (max-width: 425px) {
  .static-movie-list .movie-list-card {
    width: calc(100% / 2);
    /* 2 kart */
  }

  .carousel-item {
    width: 100px;
    padding: 8px;
  }

  .carousel-caption {
    font-size: 12px;
  }

  .form-login-element {
    flex-direction: column;
  }

  .login-container .logo {
    display: flex;
  }

  .login-modal-header h2 {
    text-align: center;
  }

  .login-modal-header h4 {
    text-align: center;
    margin-top: 20px;
  }
}

/* Image wrapper */
.image-wrapper img {
  border-radius: 16px;
  overflow: hidden;
  transition: transform 0.3s ease;
  /*width: 100%;*/
}

.box-numbers {
  position: relative;
  -ms-flex-positive: 1;
  flex-grow: 1;
  overflow: hidden;
}

.box-numbers img {
  background-size: cover;
  background-repeat: no-repeat;
  height: 250px;
  -webkit-transform: translatex(16%);
  transform: translatex(30%);
  transition: transform 0.3s ease;
  overflow: unset;
}

/* Movie Information */
.movie-list-info {
  text-align: left;
  margin-top: 10px;
}

.movie-list-info h4 {
  font-size: 14px;
  color: #fff;
  transition: transform 0.3s ease;
  transition: 0.3s;
}

.movie-list-info p {
  font-size: 12px;
  color: #ffffff8a;
  font-weight: 300;
}

.slider-bg {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  display: inline-block;
  vertical-align: top;
  white-space: normal;
}

.slider-bg img {
  width: 100%;
  max-height: 524px;
  object-fit: cover;
  transition: 0.4s;
}

/* Gradient efekti için before */
.slider-bg::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to top, rgb(16 14 25), rgb(255 166 166 / 0%));
  opacity: 1;
  transition: opacity 0.5s ease;
  /* Opacity'yi transition ile kontrol ediyoruz */
  z-index: 1;
}

.slider-bg img {
  position: relative;
  z-index: 0;
}

/* Slide yapısı */
.main-slider>.swiper-wrapper>.swiper-slide {
  position: relative;
  height: 523px;
  overflow: hidden;
}

/* Resimler normal görünsün */
.main-slider>.swiper-wrapper>.swiper-slide>img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Gradient arka plan için before pseudo-element */
.main-slider>.swiper-wrapper>.swiper-slide::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to top, rgb(16 14 25), rgb(255 166 166 / 0%));
  z-index: 10;
}

.main-slider>.swiper-wrapper>.swiper-slide-active {
  width: 1216px !important;
  z-index: 2;
  /* Aktif slayt diğerlerinin önünde */
}

.main-slider>.swiper-wrapper>.swiper-slide-prev,
.main-slider>.swiper-wrapper>.swiper-slide-next {
  z-index: 1;
  /* Diğer slaytlar geride */
}

/* Slaytların z-index düzenlemesi */
.main-slider>.swiper-wrapper>.swiper-slide img {
  position: relative;
  z-index: 2;
  /* Görseller gradient arka planın üstünde olacak */
}

/* Slider kontrol butonları */
.main-slider-next::after,
.main-slider-prev::after {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 800;
  padding: 1rem;
  opacity: 0.75;
  border-radius: 50%;
  color: #ffffff;
}

.main-slider-text-body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 60%;
}

.main-slider-text-body>img {
  width: 300px;
  height: 100%;
  object-fit: contain;
}

.main-slider-text-body>p {
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  margin-top: 20px;
  text-align: left;
}

.main-slider-text-body>a {
  background-color: var(--color-red);
  color: var(--color-white);
  font-size: 15px;
  border-radius: 12px;
  padding: 9px 15px;
  height: 40px;
  transition: 0.4s;
  margin-top: 20px;
}

.main-slider-text-body>a:hover {
  background-color: var(--color-hover-softred);
}

.footer-container {
  background: #100e19;
  padding-bottom: 48px;
  padding-top: 48px;
  z-index: -1;
  position: relative;
}

.footer-container .footer-wrapper {
  grid-template-columns: repeat(5, minmax(0, 5fr));
  gap: 2.5rem;
}

.footer-container:before {
  background-color: hsla(0, 0%, 100%, 0.16);
  content: "";
  height: 1px;
  left: 12px;
  position: absolute;
  right: 12px;
  top: 0;
}

.footer-content ul,
.footer-content h3 {
  text-align: left;
}

.footer-content {
  color: hsla(0, 0%, 100%, 0.48);
}

.footer-content ul li a {
  transition: color 0.4s;
}

.footer-social-area {
  padding-bottom: 48px;
  padding-top: 48px;
  position: relative;
}

.footer-social-area ul {
  display: flex;
  margin: -10px;
}

.footer-social-area ul li {
  padding: 10px;
  width: 100%;
}

.footer-social-area:before {
  background-color: hsla(0, 0%, 100%, 0.16);
  content: "";
  height: 1px;
  left: 0px;
  position: absolute;
  right: 0px;
  top: 0;
}

.social-button-text-area {
  margin-left: 10px;
}

.footer-social-area ul li a {
  padding: 10px 16px;
  transition: background-color 0.4s;
  background: #1f1b2e;
  color: hsla(0, 0%, 100%, 0.48);
}

.footer-social-area ul li a:hover {
  background: #28233b;
}

.text-sub-color {
  color: var(--color-dropdown-box-default);
}

.box-text {
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  display: block;
  display: -webkit-box;
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  height: 40px;
  line-height: 20px;
  margin-top: 0;
  text-overflow: ellipsis;
}

.box-text h2 {
  white-space: nowrap;
}

.text-pre {
  color: hsla(0, 0%, 100%, 0.72);
  font-size: 11px;
  font-style: normal;
  font-weight: 500;
  height: 12px;
  line-height: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.text-caption {
  color: #fff;
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  height: 20px;
  line-height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.social-picture {
  align-self: center;
  flex-grow: 0;
  flex-shrink: 0;
}

.copyright-content {
  text-align: left;
  line-height: 35px;
}

.copyright-content p {
  font-size: 14px;
  color: hsla(0, 0%, 100%, 0.48);
}

.setting-box,
.subscribe-box {
  background: #1f1b2e;
  border-radius: 16px;
}

.setting-box a,
.subscribe-box a {
  overflow: hidden;
  border-radius: 16px;
  transition: background-color 0.4s;
  padding: 24px 18px 22px;
  width: 100%;
  height: 100%;
}

.setting-box a:hover {
  background: #2e2844;
}

.page-wrapper {
  position: relative;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  padding-bottom: 30px;
}

.page-wrapper:before {
  height: 30px;
  clear: both;
  content: "";
  display: block;
}

.user-picture img {
  width: 88px;
  border-radius: 20px;
}

.subscribe-box {
  background: #1f1b2e url("https://dizipal812.com/assets/v6/images/logo-dpal.svg?V=2");
  background-position: 159% 5%;
  background-repeat: no-repeat;
  background-size: auto 50%;
  border-radius: 16px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  position: relative;
  transition-property: background-color;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  transition: background-color 0.4s;
}

.subscribe-box:hover {
  background: #2e2844 url("https://dizipal812.com/assets/v6/images/logo-dpal.svg?V=2");
  background-position: 159% 5%;
  background-repeat: no-repeat;
  background-size: auto 50%;
}

.box-ico svg {
  color: #a5a1b2;
}

/*Form*/

.form-group {
  margin: -10px;
}

.form-group>button {
  right: 28px;
  color: #6c7388;
  font-size: 0.95em;
  font-weight: 700;
}

.form-element {
  padding: 10px;
}

.form-element>label {
  padding: 0 5px;
  top: 28px;
  left: 25px;
  cursor: text;
  user-select: none;
  color: #6c7388;
  font-size: 12px;
  font-weight: 500;
  background: #1f1b2e;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.form-element input {
  padding: 17px 18px;
  width: 100%;
  outline: none;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  border-radius: 16px;
  color: #fff;
  background: #1f1b2e;
  font-size: 12px;
  font-weight: 700;
  border: 1px solid #231f34;
  -webkit-transition: border 0.3s ease-in-out;
  -moz-transition: border 0.3s ease-in-out;
  -ms-transition: border 0.3s ease-in-out;
  -o-transition: border 0.3s ease-in-out;
  transition: border 0.3s ease-in-out;
}

.form-element input:focus {
  border-color: #231f34;
  background-color: #231f34;
}

.form-element input:focus+label {
  top: 4px;
  left: 24px;
  font-size: 0.75em;
  font-weight: 500;
}

.form-element input:valid+label {
  top: 4px;
  left: 24px;
  font-size: 12px;
  font-weight: 500;
}

.form-element input:valid+.form-element-reset {
  display: block;
}

.form-element input::placeholder {
  color: #6c7388;
  font-weight: 500;
}

.form-element textarea {
  padding: 17px 18px;
  width: 100%;
  resize: none;
  outline: none;
  min-height: 100px;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  border-radius: 16px;
  color: #fff;
  background: #1f1b2e;
  font-size: 12px;
  font-weight: 700;
  border: 1px solid #231f34;
  -webkit-transition: border 0.3s ease-in-out;
  -moz-transition: border 0.3s ease-in-out;
  -ms-transition: border 0.3s ease-in-out;
  -o-transition: border 0.3s ease-in-out;
  transition: border 0.3s ease-in-out;
}

.form-element textarea:focus {
  border-color: #231f34;
  background-color: #231f34;
}

.form-element textarea:focus+label {
  top: 4px;
  left: 24px;
  font-size: 0.75em;
  font-weight: 500;
}

.form-element textarea:valid+label {
  top: 4px;
  left: 24px;
  font-size: 0.75em;
  font-weight: 500;
}

.form-element textarea::placeholder {
  color: #6c7388;
  font-size: inherit;
  font-weight: 500;
}

.form-element select {
  padding: 17px 52px 17px 18px;
  width: 100%;
  outline: none;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
  color: #fff;
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  font-size: 0.95em;
  font-weight: 700;
  border: 1px solid #3f485f;
  -webkit-transition: border 0.3s ease-in-out;
  -moz-transition: border 0.3s ease-in-out;
  -ms-transition: border 0.3s ease-in-out;
  -o-transition: border 0.3s ease-in-out;
  transition: border 0.3s ease-in-out;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' stroke='%236c7388' stroke-width='3' fill='none' stroke-linecap='round' stroke-linejoin='round' class='css-i6dzq1'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 16px;
  background-position: calc(100% - 14px);
}

.form-element select option {
  background: #1f1b2e;
}

.form-element select:focus {
  border-color: #2e2844;
}

.form-element select:focus+label {
  top: 4px;
  left: 24px;
  font-size: 0.75em;
  font-weight: 500;
}

.form-element select:valid+label {
  top: 4px;
  left: 24px;
  font-size: 0.75em;
  font-weight: 500;
}

.form-element select::placeholder {
  color: #6c7388;
}

.form-element>button,
.form-element>a {
  padding: 10px 30px;
  outline: none;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  border-radius: 16px;
  color: #fff;
  background: #6c7388;
  font-size: 13px;
  font-weight: 700;
  border: 1px solid transparent;
  -webkit-transition: background-color 0.3s ease-in-out;
  -moz-transition: background-color 0.3s ease-in-out;
  -ms-transition: background-color 0.3s ease-in-out;
  -o-transition: background-color 0.3s ease-in-out;
  transition: background-color 0.3s ease-in-out;
  -webkit-tap-highlight-color: transparent;
}

.form-element>button svg,
.form-element>a svg {
  width: 22px;
  height: 22px;
  color: #fff;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.form-element>button:active,
.form-element>a:active {
  -webkit-transform: scale(0.95);
  -moz-transform: scale(0.95);
  -ms-transform: scale(0.95);
  -o-transform: scale(0.95);
  transform: scale(0.95);
}

.form-element>button.button-first,
.form-element>a.button-first {
  background: #db2424;
}

.form-element>button.button-second,
.form-element>a.button-second {
  background: #7750f8;
}

.form-element>button.button-third,
.form-element>a.button-third {
  color: #fff;
  background: transparent;
  border-color: #fff;
}

.form-element>button.button-third svg,
.form-element>a.button-third svg {
  fill: none;
  color: #fff;
}

.form-element>button.button-third.active,
.form-element>a.button-third.active {
  color: #fff;
  background: #7750f8;
  border-color: transparent;
}

.form-element>button.button-third.active svg,
.form-element>a.button-third.active svg {
  color: #fff;
}

.form-element>button.just-icon svg,
.form-element>a.just-icon svg {
  margin: 0;
}

.form-element-end-icon {
  top: 50%;
  right: 14px;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
}

.form-element-end-icon button {
  padding: 14px;
}

.form-element-end-icon button svg {
  width: 22px;
  height: 22px;
  color: #6c7388;
}

.form-element-icon {
  top: 17px;
  left: 17px;
}

.form-element-icon+input {
  padding: 17px 18px 17px 65px;
}

.form-element-icon+input:valid+label,
.form-element-icon+input:focus+label {
  left: 70px;
}

.form-element-icon+input+label {
  left: 70px;
}

.form-element-reset {
  top: 23px;
  right: 29px;
  display: none;
}

.form-element-reset button svg {
  width: 22px;
  height: 22px;
  color: #6c7388;
}

.form-link a {
  color: #6c7388;
  font-size: 0.95em;
  font-weight: 700;
  -webkit-transition: color 0.3s ease-in-out;
  -moz-transition: color 0.3s ease-in-out;
  -ms-transition: color 0.3s ease-in-out;
  -o-transition: color 0.3s ease-in-out;
  transition: color 0.3s ease-in-out;
}

.form-link a:hover {
  color: #fff;
}

.form-actionbar {
  bottom: 13px;
  width: calc(100% - 20px);
  -webkit-border-radius: 0 0 6px 6px;
  -moz-border-radius: 0 0 6px 6px;
  -ms-border-radius: 0 0 6px 6px;
  -o-border-radius: 0 0 6px 6px;
  border-radius: 0 0 6px 6px;
  border: 1px solid #3f485f;
  background: #202535;
}

.form-actionbar ul li {
  padding: 5px;
}

.form-actionbar ul li button {
  padding: 5px;
}

.form-actionbar ul li button svg {
  width: 22px;
  height: 22px;
  fill: #6c7388;
}

.form-actionbar+textarea {
  margin: 0 0 43px;
  min-height: 194px;
  -webkit-border-radius: 6px 6px 0 0;
  -moz-border-radius: 6px 6px 0 0;
  -ms-border-radius: 6px 6px 0 0;
  -o-border-radius: 6px 6px 0 0;
  border-radius: 6px 6px 0 0;
}

.breadcrumb ul li {
  color: hsla(0, 0%, 100%, 0.56);
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}

.breadcrumb ul li:not(:hover):not(:active) {
  color: hsla(0, 0%, 100%, 0.72);
}

.breadcrumb ul li:last-child:not(:first-child):before {
  color: hsla(0, 0%, 100%, 0.56);
}

.breadcrumb-modern .breadcrumb-item+.breadcrumb-item:before {
  background-color: hsla(0, 0%, 100%, 0.56);
  content: "";
  display: inline-block;
  height: 2px;
  margin-bottom: 3px;
  margin-left: 7px;
  margin-right: 7px;
  width: 2px;
}

.breadcrumb-item a {
  transition: color 0.4s;
}

body:not(.touch) .breadcrumb-item a:hover:not(:active) {
  color: #fff !important;
}

.header-bar-title {
  font-size: 32px;
  font-style: normal;
  font-weight: 700;
  line-height: 36px;
}

.header-bar-subtitle {
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  margin-top: 4px;
  opacity: 0.48;
}

/*Notif seettings*/

.switch label {
  cursor: pointer;
}

.switch label input {
  display: none;
}

.switch label input:checked+.switch-button {
  background: #d32323;
}

.switch label input:checked+.switch-button .switch-button-icon {
  left: 26px;
}

.switch-button {
  width: 52px;
  height: 28px;
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  -ms-border-radius: 25px;
  -o-border-radius: 25px;
  border-radius: 25px;
  border: 1px solid #2e2844;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  background: #202535;
}

.switch-button-icon {
  top: 2px;
  left: 2px;
  width: 22px;
  height: 22px;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  -ms-border-radius: 100%;
  -o-border-radius: 100%;
  border-radius: 100%;
  background: #fff;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.switch-button-icon::before,
.switch-button-icon::after {
  content: "";
  top: 7px;
  width: 2px;
  height: 8px;
  opacity: 0.2;
  position: absolute;
  background: #121621;
}

.switch-button-icon::before {
  left: 8px;
}

.switch-button-icon::after {
  right: 8px;
}

.list-wrapper .item-box .ui.checkbox {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.checkbox label {
  cursor: pointer;
}

.checkbox label:before {
  display: none;
}

.checkbox label input[type="radio"]+.checkbox-icon {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  -ms-border-radius: 100%;
  -o-border-radius: 100%;
  border-radius: 100%;
}

.checkbox label input[type="radio"]+.checkbox-icon::before {
  top: 50%;
  left: 50%;
  width: 10px;
  height: 10px;
  border: none;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  -ms-border-radius: 100%;
  -o-border-radius: 100%;
  border-radius: 100%;
  background: #1f1b2e;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.checkbox label input:checked+.checkbox-icon {
  background: #40d04f;
  border-color: transparent;
}

.checkbox label input:checked+.checkbox-icon::before {
  opacity: 1;
}

.checkbox-text {
  margin: 0 0 0 10px;
  color: #fff;
  font-size: 0.95em;
  font-weight: 700;
}

.options-drop button svg {
  width: 22px;
  height: 22px;
  fill: #6c7388;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.options-drop button:hover svg {
  fill: #fff;
}

.options-drop-content {
  right: 0;
  opacity: 0;
  z-index: 50;
  visibility: hidden;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
  -webkit-transform: translate(0px, -20px);
  -moz-transform: translate(0px, -20px);
  -ms-transform: translate(0px, -20px);
  -o-transform: translate(0px, -20px);
  transform: translate(0px, -20px);
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  background: #202535;
  -webkit-box-shadow: 3px 5px 20px 0 rgba(18, 22, 33, 0.9);
  -moz-box-shadow: 3px 5px 20px 0 rgba(18, 22, 33, 0.9);
  -ms-box-shadow: 3px 5px 20px 0 rgba(18, 22, 33, 0.9);
  -o-box-shadow: 3px 5px 20px 0 rgba(18, 22, 33, 0.9);
  box-shadow: 3px 5px 20px 0 rgba(18, 22, 33, 0.9);
}

.options-drop-content ul {
  padding: 10px 0;
}

.options-drop-content ul li a {
  padding: 10px 20px;
  white-space: nowrap;
  color: #fff;
  font-size: 0.85em;
  font-weight: 700;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.options-drop-content ul li a svg {
  margin: 0 20px 0 0;
  width: 22px;
  height: 22px;
  color: #6c7388;
  -webkit-transition: transform 0.3s ease-in-out;
  -moz-transition: transform 0.3s ease-in-out;
  -ms-transition: transform 0.3s ease-in-out;
  -o-transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
}

.options-drop-content ul li a img {
  margin: 0 20px 0 0;
  width: 22px;
  height: 22px;
}

.options-drop-content ul li a svg.no-stroke {
  fill: #6c7388;
}

.options-drop-content ul li a:hover {
  color: #4ff461;
  background: #181d29;
}

.options-drop-content ul li a:hover.second {
  color: #f44d4d;
}

.options-drop-content ul li a.active {
  color: #4ff461;
  background: #181d29;
}

.options-drop-content ul li a.active svg {
  color: #4ff461;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

.options-drop-content ul:nth-child(n + 2) {
  border-top: 1px solid #272e42;
}

.options-drop.active button svg {
  fill: #fff;
}

.options-drop.active .options-drop-content {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translate(0px, 0px);
  -moz-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  -o-transform: translate(0px, 0px);
  transform: translate(0px, 0px);
}

.general-settings-box-text span {
  color: #fff;
  font-size: 0.95em;
  font-weight: 700;
}

.general-settings-box-text p {
  margin: 5px 0 0;
  line-height: 1.4;
  color: #6c7388;
  font-size: 0.75em;
  font-weight: 500;
}

.settings-content {
  margin: 0 0 0 20px;
  width: 100%;
}

.settings-content-head {
  margin: 0 0 20px;
}

.settings-content-head-left span {
  color: #6c7388;
  text-transform: uppercase;
  font-size: 0.75em;
  font-weight: 500;
}

.settings-content-head-left h1 {
  margin: 5px 0 0;
  color: #fff;
  font-size: 1.5em;
  font-weight: 700;
}

.settings-content-head-left h1 strong {
  color: #4ff461;
}

.settings-content-head-right a {
  color: #6c7388;
  font-size: 0.95em;
  font-weight: 700;
  -webkit-transition: color 0.3s ease-in-out;
  -moz-transition: color 0.3s ease-in-out;
  -ms-transition: color 0.3s ease-in-out;
  -o-transition: color 0.3s ease-in-out;
  transition: color 0.3s ease-in-out;
}

.settings-content-head-right a:hover {
  color: #fff;
}

.settings-content-area {
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  border-radius: 16px;
}

.settings-content-area .form-result {
  margin: 0 0 20px;
}

.settings-content-area-head {
  margin: 0 0 25px;
}

.settings-content-area-head span {
  color: #fff;
  font-size: 0.95em;
  font-weight: 700;
}

.settings-content-area ul {
  margin: -10px;
}

.settings-content-area ul li {
  padding: 10px;
}

.settings-content-area:nth-child(n + 2) {
  margin: 20px 0 0;
}

.social-icons ul {
  margin: -5px;
}

.social-icons ul li {
  padding: 5px;
}

.social-icons ul li a {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.social-icons ul li a:hover {
  -webkit-transform: translate(0, -5px);
  -moz-transform: translate(0, -5px);
  -ms-transform: translate(0, -5px);
  -o-transform: translate(0, -5px);
  transform: translate(0, -5px);
}

.social-icons .square-arrows button {
  width: auto;
}

.social-icons .square-arrows button.left {
  left: -24px;
}

.social-icons .square-arrows button.right {
  right: -24px;
}

.social-icon span {
  width: 43px;
  height: 43px;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  -o-border-radius: 12px;
  border-radius: 12px;
  background-color: #30284e;
  background-image: linear-gradient(293deg, rgba(58, 53, 90, 0), #3a355a);
}

.social-icon span svg {
  width: 16px;
  height: 16px;
  fill: #fff;
}

.social-icon.imdb span {}

.social-icon.imdb span svg {
  color: #121621;
}

.social-icon.facebook span {}

.social-icon.twitter span {}

.social-icon.instagram span {}

.social-icon.twitch span {}

.social-icon.youtube span {}

.social-icon.discord span {}

.social-icon.google span {}

.social-share ul {
  margin: 0 0 30px;
}

.social-share ul li {
  padding: 10px 0;
}

.social-share ul li a {
  color: #6c7388;
  font-size: 0.95em;
  font-weight: 700;
}

.social-share ul li a span {
  margin: 0 0 10px;
  width: 62px;
  height: 62px;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  -ms-border-radius: 100%;
  -o-border-radius: 100%;
  border-radius: 100%;
  background: #6c7388;
}

.social-share ul li a span svg {
  width: 22px;
  height: 22px;
  fill: #fff;
}

.social-share ul li a span.facebook {
  background: rgba(55, 99, 210, 0.2);
}

.social-share ul li a span.facebook svg {
  fill: #3763d2;
}

.social-share ul li a span.twitter {
  background: rgba(26, 188, 255, 0.2);
}

.social-share ul li a span.twitter svg {
  fill: #1abcff;
}

.social-share ul li a span.discord {
  background: rgba(114, 137, 218, 0.2);
}

.social-share ul li a span.discord svg {
  fill: #7289da;
}

.social-share ul li a span.whatsapp {
  background: rgba(37, 211, 102, 0.2);
}

.social-share ul li a span.whatsapp svg {
  fill: #25d366;
}

.social-share .form-element input {
  padding: 17px 72px 17px 18px;
}

.requests>ul {
  margin: -10px;
}

.requests>ul>li {
  padding: 10px;
}

.requests-box {
  padding: 15px;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  border-radius: 16px;
  transition: background-color 0.4s;
  background-image: linear-gradient(293deg, rgba(58, 53, 90, 0), #312a48);
}

.requests-box.request-box-selected:not(:hover):not(:active) {
  background-color: #1f1b2e;
}

.requests-box-actions ul {
  margin: -5px;
}

.requests-box-actions ul li {
  padding: 5px;
}

.requests-box-actions ul li button {
  transition-duration: 80ms;
  padding: 10px 15px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
  border: 1px solid #3f485f;
}

.requests-box-actions ul li button svg {
  width: 22px;
  height: 22px;
  color: #6c7388;
  -webkit-transition: background-color, color 0.3s;
  -moz-transition: background-color, color 0.3s;
  -ms-transition: background-color, color 0.3s;
  -o-transition: background-color, color 0.3s;
  transition: background-color, color 0.3s;
}

.requests-box-actions ul li button span {
  margin: 0 0 0 10px;
  color: #6c7388;
  font-size: 0.85em;
  font-weight: 500;
  -webkit-transition: background-color, color 0.3s;
  -moz-transition: background-color, color 0.3s;
  -ms-transition: background-color, color 0.3s;
  -o-transition: background-color, color 0.3s;
  transition: background-color, color 0.3s;
}

.requests-box-actions ul li button:hover {
  border-color: transparent;
}

.requests-box-actions ul li button:hover svg {
  color: #fff;
}

.requests-box-actions ul li button:hover.accept-friend {
  background: #30284e;
  transform: scale(1.06);
}

.requests-box-actions ul li button:hover.accept-friend span {
  color: #fff;
}

.requests-box-actions ul li button:hover.declined-friend {
  background: #db2424;
  transform: scale(1.06);
}

.user-medium-image img {
  width: 66px;
  height: 66px;
  object-fit: cover;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  border-radius: 16px;
}

.user-medium-text {
  margin: 0 0 0 10px;
  min-width: 0;
}

.user-medium-text>span {
  color: #6c7388;
  font-size: 0.95em;
  font-weight: 500;
}

.user-medium-text>span a {
  color: #fff;
  font-size: inherit;
  font-weight: 700;
}

.user-medium-text p {
  margin: 5px 0 0;
  color: #6c7388;
  font-size: 0.85em;
  font-weight: 500;
}

.count-badge {
  margin-left: 10px;
}

.notifications ul {
  margin: -10px;
}

.notifications ul li {
  padding: 10px;
}

.notifications-box {
  padding: 20px;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  -o-border-radius: 12px;
  border-radius: 12px;

  background-image: linear-gradient(293deg, rgba(58, 53, 90, 0), #312a48);
}

.notifications-box-icon span {
  width: 44px;
  height: 44px;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  -ms-border-radius: 100%;
  -o-border-radius: 100%;
  border-radius: 100%;
}

.notifications-box-icon span svg {
  width: 22px;
  height: 22px;
  color: #fff;
}

.notifications-box-icon.like span {
  background: #7750f8;
}

.notifications-box-icon.flow-post span {
  background: crimson;
}

.notifications-box-icon.request span {
  background: #40d04f;
}

.notifications-box-icon.comment span {
  background: #08b8f1;
}

.notifications-box-image a img {
  width: 40px;
  height: 40px;
  object-fit: cover;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  -o-border-radius: 12px;
  border-radius: 12px;
}

.notifications-box-text {
  margin: 0 0 0 10px;
}

.notifications-box-text span {
  line-height: 20px;
  color: #fff;
  font-size: 0.95em;
  font-weight: 500;
}

.notifications-box-text span a {
  font-size: inherit;
  font-weight: 700;
}

.notifications-box-text span a small {
  color: #db2424;
  font-size: inherit;
  font-weight: 500;
}

.notifications-box-text span img {
  margin: -2px 0 0;
  width: 20px;
  height: 20px;
}

.notifications-box-text p {
  margin: 5px 0 0;
  color: #6c7388;
  font-size: 0.75em;
  font-weight: 500;
}

.notifications-box-status {
  margin: 0 0 0 20px;
}

.notifications-box-status svg {
  width: 22px;
  height: 22px;
  opacity: 0.3;
  fill: #9b97ad;
}

.notifications-box.unread {
  background-color: #1f1b2e;
}

.see-more button {
  padding: 15px 30px;
  overflow: hidden;
  outline: none;
  color: #fff;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  -o-border-radius: 12px;
  border-radius: 12px;
  font-size: 0.95em;
  font-weight: 700;
  background: #2e2844;
  -webkit-transition: all 0.1s;
  -moz-transition: all 0.1s;
  -ms-transition: all 0.1s;
  -o-transition: all 0.1s;
  transition: all 0.1s;
}

.see-more button:hover {
  -webkit-transform: scale(1.02);
  -moz-transform: scale(1.02);
  -ms-transform: scale(1.02);
  -o-transform: scale(1.02);
  transform: scale(1.02);
}

.see-more button:disabled {
  opacity: 0.7;
  pointer-events: none;
}

.see-more button:active {
  -webkit-transform: scale(0.95);
  -moz-transform: scale(0.95);
  -ms-transform: scale(0.95);
  -o-transform: scale(0.95);
  transform: scale(0.95);
}

.transform-poster {
  box-shadow: 12px 8px 27px rgb(31 27 46);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.transform-poster:hover {
  transform: scale(1.05);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.8);
}

.transform-poster:nth-child(1) {
  transform: rotate(0deg) translateX(0);
}

.transform-poster:nth-child(2) {
  transform: rotate(10deg) translateX(5px);
}

.transform-poster:nth-child(3) {
  transform: rotate(15deg) translateX(10px);
}

.hover\:scale-105:hover {
  transform: scale(1.05);
}

.collection-box {
  border-radius: 16px;
  background-color: #1f1b2e;
  transition: 400ms;
  transition-property: border-color, background-color;
  background-image: linear-gradient(126deg, rgba(58, 53, 90, 0), #312a48);
  padding: 10px;
}

.collection-box:hover {
  background-color: #58526f;
}

.collection-text {
  font-weight: 600;
}

.transform-poster {
  width: 170px;
}

.collection-images {
  left: -20%;
}

.collection-images {
  height: 220px;
}

/* DETAİL */
.video-area {
  width: 100%;
  height: 650px;
  background-color: #161222;
    border-radius: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #999;
  font-size: 18px;
  margin-bottom: 20px;
}

.button-group {
  display: flex;
  gap: 15px;
}

.button-group:not(.blank) {
  margin-bottom: 20px;
}

.button-group button,
.button-group>a {
  border: 1px solid var(--color-gray-button);
  background-color: #1f1b2e;

  padding: 10px 16px;
  border-radius: 16px;
  font-size: 14px;
  font-weight: 500;
  color: #fff;
  cursor: pointer;
  transition: 0.2s;
}

.button-group button:hover,
.button-group a:hover {
  background-color: #5f5887;
  background-image: linear-gradient(90deg, rgba(58, 53, 90, 0), #3a355a);
}

.button-group button .icon,
.button-group a .icon {
  font-size: 16px;
}

.description-area {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}

.description-left {
  width: 80%;
  margin-right: 20px;
}

.description-right {
  width: 20%;
  font-size: 14px;
  text-align: left;
}

.description-right .description-right-item-box {
  margin-bottom: 20px;
}

.description-right .description-right-item-box:last-child {
  margin-bottom: 0;
}

.description-right .description-right-item-box .title {
  margin: 0 0 10px;
  color: var(--color-white);
}

.description-right .description-right-item-box .subtitle {
  font-size: 14px;
  font-weight: 600;
  color: var(--color-text-secondary-gray);
}

.description-note {
  color: #7a7a7a;
  font-size: 12px;
  display: block;
  margin-top: 5px;
}

.quality-buttons {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  margin-top: 10px;
}

.quality-option {
  background-color: #404058;
  color: #fff;
  padding: 5px 10px;
  border-radius: 5px;
  font-size: 12px;
}

.movie-description {
  color: var(--color-text-secondary-gray);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.6;
  text-align: left;
}

.imdb-card-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: var(--color-gray-button);
  padding: 10px;
  border-radius: 5px;
  margin-top: 20px;
}

.imdb-card-wrapper .imdb-card {
  display: flex;
  align-items: center;
}

.imdb-card-wrapper .imdb-card .rating-box {
  background-color: #fdbf1a;
  background-image: linear-gradient(225deg, rgba(58, 53, 90, 0), #ef4604);
  color: var(--color-white);
  padding: 10px;
  border-radius: 5px;
  font-size: 1.5rem;
  font-weight: bold;
  margin-right: 15px;
}

.imdb-card-wrapper .imdb-card .details p {
  margin: 0;
}

.imdb-card-wrapper .imdb-card .details .title {
  font-size: 15px;
  font-style: normal;
  line-height: 20px;
  font-weight: 500;
  color: var(--color-white);
}

.imdb-card-wrapper .imdb-card .details .subtitle {
  text-align: left;
  font-size: 14px;
  font-style: normal;
  line-height: 20px;
  font-weight: 400;
  color: var(--color-text-secondary-gray);
  margin-top: 5px;
}

.imdb-card-wrapper .review-btn {
  background-color: var(--color-gray-button);
  border: 1px solid var(--color-hover-gray-button);
  border-radius: 6px;
  padding: 10px;
  font-size: 14px;
  font-weight: 400;
  transition: 0.2s;
}

.imdb-card-wrapper .review-btn:hover {
  background-color: var(--color-hover-gray-button);
  border: 1px solid var(--color-hover-gray-button);
}

.tabs {
  display: flex;
  border-bottom: 1px solid #404058;
  margin-bottom: 20px;
  padding-bottom: 10px;
}

.tab {
  padding: 10px 20px;
  cursor: pointer;
  color: #bbb;
  font-weight: 500;
}

.tabs::-webkit-scrollbar {
  height: 5px;
}

.tabs::-webkit-scrollbar-thumb {
  background-color: var(--color-secondary-bg);
  border-radius: 4px;
}

.tab.active {
  color: #fff;
  border-bottom: 3px solid #d80000;
}

.tab-content.tab-item {
  display: none;
}

.tab-content.tab-item.active {
  display: inherit;
}

.tab-active {
  border-bottom: 2px solid red;
}

.episodes-swiper,
.swiper-cast-movie-list-container {
  overflow: hidden;
}

.episode-content {
  margin-top: 20px;
}

.episodes {
  display: flex;
  flex-wrap: wrap;
  margin: -10px;
}

.episode-card {
  width: 100%;
  border-radius: 10px;
  flex-shrink: 0;
  text-align: left;
  padding: 10px;
}

.episode-link {
  display: block;
  transition: 0.3s ease;
}

.episode-link:hover img {
  transform: scale(1.04);
}

.episode-card img {
  width: 100%;
  height: 130px;
  border-radius: 16px;
  object-fit: cover;
  transition: 0.3s ease;
}

.episode-info {
  padding: 10px 0;
}

.episode-info h4 {
  font-size: 14px;
  font-weight: 600;
  color: #fff;
}

.episode-info p {
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  color: #a5a1b2;
  display: block;
  display: -webkit-box;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
  margin: 4px 0;
  max-height: 64px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.episode-info .details {
  font-size: 12px;
  color: #666;
  display: flex;
  justify-content: space-between;
}

/*CAST SECTİON*/

.cast-list {
  padding: 20px 0;
}

.cast-list-wrapper {
  overflow-x: auto;
  padding-bottom: 20px;
}

.cast-list-wrapper::-webkit-scrollbar {
  height: 5px;
  padding-bottom: 40px;
}

.cast-list-wrapper::-webkit-scrollbar-thumb {
  background-color: var(--color-secondary-bg);
  border-radius: 4px;
}

.cast-member {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
}

.cast-info {
  text-align: left;
}

.profile-pic {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: 10px;
  background-color: var(--color-secondary-bg);
}

.cast-link h4 {
  font-size: 13px;
  font-weight: 500;
  color: var(--color-text-secondary-gray);
  transition: color 0.3s ease;
}

.cast-link p {
  font-size: 12px;
  color: var(--color-gray);
}

.cast-link:hover h4 {
  color: var(--color-white);
  transition: color 0.3s ease;
}

.cast-link {
  text-decoration: none;
  color: inherit;
}

/* COMMENTS CSS */

/* General Styling */
.comments-section {
  padding: 20px 0;
}

/* Tabs */
.comment-section .tabs {
  border-bottom: 1px solid #404058;
  margin-bottom: 10px;
}

.comment-section .tabs ul {
  display: flex;
  gap: 20px;
  list-style-type: none;
  padding: 0;
}

.comment-section .tab {
  color: #bbb;
  cursor: pointer;
  padding: 10px 0;
}

.comment-section .tab.active {
  color: #fff;
  border-bottom: 2px solid #d80000;
}

.comment-section .tab-count {
  background-color: #d80000;
  color: white;
  border-radius: 50%;
  padding: 2px 8px;
  margin-left: 5px;
}

/* Comment Form */
.comment-form {
  display: flex;
  gap: 10px;
}

.comment-input {
  flex-grow: 1;
  padding: 10px;
  border: none;
  border-radius: 5px;
  color: white;

  background-color: var(--color-gray-button);
    font-size: 13px;
    line-height: 1.9;
    color: #fff;
    border: 1px solid #343a46;
    padding: 10px 15px;
    border-radius: 2px;
    box-shadow: none;
    display: block;
    height: auto;
    overflow: auto;
    cursor: text;
    padding-right: 40px;
}

.comment-input:focus {
  outline: none;
}

.comment-input::placeholder {
  color: var(--color-text-secondary-gray);
  font-size: 14px;
}

.comment-submit {

  padding: 10px 15px;
    color: #fff;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
  background-color: var(--color-red);
    text-transform: uppercase;
    font-size: .75em;
    font-weight: 600;
}

/* Comment List */
.comment-list:not(.blank) {
  padding: 0;
  margin: 20px 0 0;
}

.comment-item {
  margin-bottom: 20px;
  background-color: #1f1b2e;
  border-radius: 6px;
  padding: 20px;
}

.comment-user {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  width: 100%;
  gap: 20px;
}

.comment-box {
  gap: 10px;
}

.user-avatar {
  width: 50px;
  height: 50px;
  border: 1px solid var(--color-dropdown-box-default);
  border-radius: 50%;
  background-color: var(--color-gray-button);
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
}

.user-name {
  font-size: 14px;
  font-weight: 500;
  color: var(--color-white);
}

.comment-date {
  font-size: 12px;
  color: var(--color-text-secondary-gray);
}

.comment-text {
  font-size: 14px;
  color: var(--color-text-secondary-gray);
  margin-bottom: 5px;
}

.comment-text img {
  display: inline;
  width: 20px;
}

/* Comment Actions */
.comment-actions .user-action-count {
  margin: 0 5px;
  font-size: 13px;
}

.comment-actions-wrapper .action {
  cursor: pointer;
  color: #797684;
}

.comment-actions-wrapper .action.dislike {
  color: #e80e6d;
}

.comment-actions-wrapper .action.like {
  color: #47d510;
}

/* Jump animation */
@keyframes jump {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-10px);
  }
}

/* Firework burst */
@keyframes firework {
  0% {
    opacity: 1;
    transform: scale(0);
  }

  100% {
    opacity: 0;
    transform: scale(1.5);
  }
}

/* Button focus style */
.comment-actions-wrapper .action.like:focus {
  animation: jump 0.5s ease;
  position: relative;
  /* Make sure the firework pseudo-elements are positioned correctly */
}

/* Firework effect */
.comment-actions-wrapper .action.like:focus::before,
.comment-actions-wrapper .action.like:focus::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: rgba(255, 0, 0, 0.6);
  /* Adjust the color */
  transform: translate(-50%, -50%) scale(0);
  animation: firework 0.6s ease forwards;
}

.comment-actions-wrapper .action.like:focus::after {
  background-color: rgba(255, 255, 0, 0.6);
  /* Second firework color */
  animation-delay: 0.1s;
  /* Staggered for more effect */
}

.comment-actions-wrapper .action.dislike:focus {
  animation: shake 0.5s ease;
  position: relative;
}

@keyframes shake {
  0% {
    transform: translateX(0);
  }

  25% {
    transform: translateX(-3px);
  }

  50% {
    transform: translateX(3px);
  }

  75% {
    transform: translateX(-3px);
  }

  100% {
    transform: translateX(0);
  }
}

/* FİLTER PAGE CSS */
/* General styling for the filter section */
.filter-section {
  background-color: var(--color-secondary);
  padding: 20px;
  border-radius: 10px;
  color: var(--color-white);
}

.filter-row {
  display: flex;
  gap: 10px;
}

/* Dropdown appearance */
.filter-dropdown {
  background-color: #3a3a52;
  color: white;
  border: none;
  border-radius: 5px;
  padding: 10px;
}

.select2-container {
  width: 100% !important;
}

/* Select2'nin buton görünümü */
.select2-container--default .select2-selection--multiple {
  background-color: #3a3a52 !important;
  color: white;
  border: none !important;
  border-radius: 5px;
  padding: 10px;
  display: flex;
  align-items: center;
  cursor: pointer !important;
  width: 100%;
  min-height: 50px !important;
  /* Buton yüksekliği */
  position: relative;
}

/* Label için başlangıç stili */
.select-label {
  position: absolute;
  top: 15px;
  left: 15px;
  font-size: 16px;
  color: #fff;
  transition: all 0.3s ease;
  pointer-events: none;
  user-select: none;
  z-index: 1;
}

/* Label aktif olduğunda yukarı çıkar */
.select-label.active-label {
  top: -10px;
  font-size: 12px;
  color: #bbb;
}

/* Seçili öğeler göründüğünde alt metin stili */
.select2-selection__rendered {
  display: flex;
  flex-wrap: wrap;
  color: #aaa;
  /* Seçili değerlerin rengi */
  font-size: 14px;
  margin-top: 20px;
  padding-left: 15px;
}

/* Dropdown ve seçenekler için stili */
.select2-container--default .select2-dropdown {
  background-color: #2b2b3a;
  border-radius: 10px;
  padding: 15px;
  width: max-content !important;
}

.select2-results__option {
  color: white;
}

/* Dropdown hover efekti */
.select2-container--default .select2-results__option--highlighted {
  background-color: #57577b;
}

.select2-container--default .select2-search--inline .select2-search__field {
  display: none;
}

.select2-container--default .select2-selection--multiple::after {
  content: "\25BC";
  /* Unicode aşağı bakan ok */
  position: absolute;
  right: 15px;
  /* Sağ tarafa hizala */
  top: 50%;
  transform: translateY(-50%);
  color: #fff;
  font-size: 14px;
}

/* SİLİNECEK

.filter-dropdown-container {
    width: 100%;
    margin: 20px 0;
    position: relative;
}

.select2-container--default .select2-selection--multiple {
    background-color: #3a3a52;
    color: white;
    border: none;
    border-radius: 10px;
    padding: 10px;
    display: flex;
    align-items: center;
    cursor: pointer;
    min-height: 50px;
    position: relative;
}

.select-label {
    position: absolute;
    top: 12px;
    left: 20px;
    font-size: 16px;
    color: white;
    transition: all 0.3s ease;
    z-index: 1;
}

.select-label.active-label {
    top: -10px;
    font-size: 12px;
    color: #aaa;
}

.custom-dropdown .select2-results__option {
    display: flex;
    align-items: center;
    padding: 10px;
    color: white;
}

.custom-dropdown .select2-results__option--highlighted {
    background-color: #44446b;
}

.custom-dropdown .select2-results__option i {
    margin-right: 10px;
}

.custom-dropdown .select2-group {
    font-weight: bold;
    background-color: #2b2b3a;
    padding: 10px;
    color: #fff;
}

.custom-dropdown .select2-selection__rendered {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding-left: 10px;
    color: white;
}

.select2-container--default .select2-selection--multiple::after {
    content: '\25BC';
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: white;
}
*/

.filter-desktop-content {
  background-color: var(--color-secondary);
  padding: 20px;
  border-radius: 12px;
}

.filter-desktop-content>ul {
  display: flex;
  flex-wrap: wrap;
  margin: -5px;
}

.filter-desktop-content>ul li {
  padding: 5px;
  width: 25%;
}

.filter-desktop-content ul li .ui.selection {
  background-color: var(--color-secondary-bg);
  border: none;
  height: 56px;
  padding: 5px 10px !important;
}

.filter-desktop-content ul li .ui.selection .default span {
  color: var(--color-white);
  font-size: 13px;
  font-weight: 500;
}

.filter-desktop-content ul li .ui.selection .default .select-item-box {
  transition: 0.4s;
  list-style: none;
  color: var(--color-text-secondary-gray);
  font-size: 12px;
  font-weight: 600;
}

.filter-desktop-content ul li .ui.selection .default .select-item-box .remove-item {
  display: none;
}

.filter-desktop-content ul li .ui.selection .dropdown-icon {
  background-image: url("/assets/v6/images/arrow-down.svg");
  align-self: center;
  flex: 0 0 16px;
  height: 6px;
  margin-left: 16px;
  width: 16px;
}

.icon-box-wrapper .item input[type="checkbox"] {
  display: none;
}

.hidden-box {
  display: none !important;
}

.filter-desktop-content .test-dropdown {
  position: absolute !important;
  top: 65px !important;
  left: 0 !important;
  bottom: inherit !important;
  overflow: hidden !important;
  background-color: var(--color-secondary-bg) !important;
  width: 630px !important;
  border: none !important;
  border-radius: 4px !important;
  padding: 16px !important;
}

.filter-desktop-content .years-dropdown,
.filter-desktop-content .sort-dropdown {
  position: absolute !important;
  top: 65px !important;
  left: 0 !important;
  bottom: inherit !important;
  overflow: hidden !important;
  background-color: var(--color-secondary-bg) !important;
  width: auto !important;
  border: none !important;
  border-radius: 4px !important;
  padding: 16px !important;
}

.filter-desktop-content .years-dropdown .list-wrapper,
.filter-desktop-content .sort-dropdown .list-wrapper {
  grid-template-columns: 1fr;
  margin-top: 0;
  padding-top: 0;
  max-height: 300px;
  overflow-y: auto;
  overflow-x: hidden;
  border-top: 0;
}

/* Scrollbar stilleri */
.filter-desktop-content .years-dropdown .list-wrapper::-webkit-scrollbar,
.filter-desktop-content .sort-dropdown .list-wrapper::-webkit-scrollbar {
  width: 6px;
}

.filter-desktop-content .years-dropdown .list-wrapper::-webkit-scrollbar-track,
.filter-desktop-content .sort-dropdown .list-wrapper::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 3px;
}

.filter-desktop-content .years-dropdown .list-wrapper::-webkit-scrollbar-thumb,
.filter-desktop-content .sort-dropdown .list-wrapper::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.3);
  border-radius: 3px;
}

.filter-desktop-content .years-dropdown .list-wrapper::-webkit-scrollbar-thumb:hover,
.filter-desktop-content .sort-dropdown .list-wrapper::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.5);
}

.filter-desktop-content .test-dropdown .icon-box-wrapper {
  gap: 10px;
}

.filter-desktop-content .test-dropdown .icon-box-wrapper img {
  width: 32px;
  height: 32px;
}

.filter-desktop-content .test-dropdown .icon-box-wrapper .item {
  background-color: var(--color-transparent);
  border: 1px solid var(--color-dropdown-box-default);
  padding: 16px 8px;
  border-radius: 6px;
  width: 20%;
  height: 88px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: 0.4s;
  box-sizing: border-box;
  width: calc(20% - 10px);
  white-space: pre-line;
  text-align: center;
  /* 5 elemanı yan yana sığdıracak şekilde genişlik hesaplandı */
}

.filter-desktop-content .test-dropdown .icon-box-wrapper .item:hover {
  background-color: var(--color-dropdown-box-default) !important;
}

.filter-desktop-content .test-dropdown .icon-box-wrapper .item.filtered {
  display: flex !important;
}

.ui.dropdown .filtered.item-box.item {
  display: block !important;
}

.list-wrapper {
  margin-top: 16px;
  border-top: 1px solid var(--color-text-secondary-gray);
  padding-top: 4px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-column-gap: 40px;
}

.country-dropdown .list-wrapper {
  border-top: none;
  padding-top: 0;
  margin-top: 0;
}

.list-wrapper .item {
  margin-top: 12px;
}

.list-wrapper .item .checkbox label {
  color: var(--color-text-secondary-gray);
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
}

.list-wrapper .item-box.active.filtered .ui.checkbox label {
  color: var(--color-white);
}

.list-wrapper .item .checkbox label:hover {
  color: var(--color-white);
}

.filter-desktop .test-dropdown .icon-box-wrapper .item.active {
  background-color: var(--color-dropdown-box-default) !important;
}

.filter-desktop .test-dropdown .icon-box-wrapper .item span {
  margin-top: 5px;
  color: var(--color-white);
  font-size: 12px;
}

.icon.icon-check {
  display: none;
  margin-left: 8px;
}

.item-box.active .icon.icon-check {
  display: inline-block;
  color: var(--color-white);
}

.filter-clear-btn {
  opacity: 0.32;
}

.filter-clear-btn.active {
  opacity: 1;
}

.glide__track {
  cursor: -webkit-grab;
  cursor: grab;
  overflow-x: hidden;
  position: relative;
}

.glide__slide {
  height: 523.74531835px;
  border-radius: 16px;
  transition: 0.4s;
  display: inline-block;
  vertical-align: top;
  white-space: normal;
  position: relative;
}

.slider-link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  display: block;
}

.glide__arrows {
  max-width: 1216px;
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.movie-list-slider {
  position: relative;
}

.movie-list-slider .glide__slides {
  display: flex;
  justify-content: center;
  align-items: center;
  list-style-type: none;
}

.movie-list-slider .glide__arrows .glide__arrow--prev {
  position: absolute;
  top: 30%;
  left: -2%;
  transform: translate(-50%, -50%);
  z-index: -1;
}

.movie-list-slider .glide__arrows .glide__arrow--next {
  position: absolute;
  top: 30%;
  right: -2%;
  transform: translate(-50%, -50%);
  z-index: -1;
}

.glide__arrows .glide__arrow--prev {
  background-image: url("/assets/v6/images/arrow-left.svg");
  position: absolute;
  left: 0;
  top: 50%;
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  -o-object-fit: contain;
  object-fit: contain;
  -o-object-position: center;
  object-position: center;
  opacity: 0.72;
  transform: scale(1);
  transition-duration: 0.4s;
  width: 12px;
  height: 32px;
}

.glide__arrows .glide__arrow--next {
  background-image: url("/assets/v6/images/arrow-right.svg");
  position: absolute;
  right: 0;
  top: 50%;
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  -o-object-fit: contain;
  object-fit: contain;
  -o-object-position: center;
  object-position: center;
  opacity: 0.72;
  transform: scale(1);
  transition-duration: 0.4s;
  width: 12px;
  height: 32px;
}

.slide-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  z-index: 10;
}

.slide-content img {
  width: auto;
  height: 60px;
  object-fit: contain;
}

.slide-content .film-categories li {
  font-size: 14px;
  position: relative;
  color: var(--color-text-secondary-gray);
}

.slide-content .film-categories li:not(:first-child):before {
  background-color: #fff;
  border-radius: 50%;
  position: relative;
  content: "";
  width: 2px;
  height: 2px;
  margin-bottom: 3px;
  margin-left: 6px;
  margin-right: 6px;
  text-align: center;
  display: inline-block;
}

.slide-content .slider-movie-description p {
  color: var(--color-text-secondary-gray);
  font-size: 14px;
}

.glide__slide--active.slider-bg::before {
  opacity: 0;
}

.glide__slide--active>.slide-content .slider-movie-description p,
.glide__slide--active>.slide-content .film-categories li {
  color: #fff;
}

.movie-small-box {
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
  background: var(--color-secondary);
}

.movie-small-box-image a img {
  width: 80px;
  height: 80px;
  object-fit: cover;
  object-position: top;
  background: #6c7388;

  border-radius: 8px;
}

.movie-small-box-content-header>h3 {
  color: #fff;
  font-size: 15px;
  font-weight: 600;
}

.movie-small-box-content-header>p {
  font-size: 13px;
  font-weight: 400;
}

.movie-small-box-content-footer span,
.movie-small-box-content-footer p {
  color: #6c7388;
  font-size: 0.95em;
  font-weight: 500;
}

.movie-small-box {
  background: var(--color-secondary);
  border-radius: 16px;
  padding: 8px;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
  background-image: linear-gradient(126deg, rgba(58, 53, 90, 0), #312a48);
}

.movie-small-box-content {
  color: #ffffff;
}

.movie-small-box-date {
  min-width: 50px;
}

.flags li {
  cursor: pointer;
}

.flags svg {
  width: 22px;
}

.progress-bar {
  background: #2e2f3d;
  height: 6px;
  border-radius: 4px;
  overflow: hidden;
}

.progress {
  height: 100%;
}

.expand-btn {
  text-align: left;
  color: var(--color-white);
  font-size: 14px;
  cursor: pointer;
  margin-top: 8px;
}

.expandable-text {
  color: var(--color-text-secondary-gray);
  font-size: 14px;
  margin-top: 8px;
}

.expandable-list {
  margin-top: 8px;
}

.expandable-list li {
  color: var(--color-text-secondary-gray);
  font-size: 14px;
  margin: 8px 0 0 8px;
  padding: 0 0 0 16px;
  position: relative;
}

.expandable-list li::before {
  background-color: #a5a1b2;
  border-radius: 50%;
  content: "";
  height: 6px;
  left: 0;
  position: absolute;
  top: 10px;
  width: 6px;
}

.movie-list .swiper-movie-list,
.movie-list .trend-movies {
  margin: -20px;
}

.movie-list .swiper-movie-list .swiper-container {
  padding: 20px;
  overflow: hidden;
  width: 100%;
}

.movie-list .trend-movies .swiper-container {
  padding: 20px;
  overflow: hidden;
  width: 100%;
}

/* .movie-list .swiper-movie-list .swiper-container .swiper-slide,
.movie-list .trend-movies .swiper-container .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
} */

/* .movie-list .swiper-movie-list .swiper-container .swiper-slide {
    width: 153px;
} */

.swiper-movie-list .swiper-button-next,
.swiper-movie-list .swiper-button-prev,
.avatar-boxes .swiper-button-next,
.avatar-boxes .swiper-button-prev,
.trend-movies .swiper-button-next,
.avatar-carousel .swiper-button-next,
.trend-movies .swiper-button-prev,
.avatar-carousel .swiper-button-prev,
.episode-content .swiper-button-next,
.episode-content .swiper-button-prev,
.swiper-cast-movie-list-container .swiper-button-next,
.swiper-cast-movie-list-container .swiper-button-prev {
  position: absolute;
  top: 45%;
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  object-fit: contain;
  object-position: center;
  opacity: 0.72;
  transform: scale(1);
  transition-duration: 0.4s;
  width: 32px;
  height: 32px;
}

.episode-content .swiper-button-next,
.episode-content .swiper-button-prev {
  top: 50%;
}

.swiper-movie-list .swiper-button-next:hover,
.swiper-movie-list .swiper-button-prev:hover,
.trend-movies .swiper-button-next:hover,
.trend-movies .swiper-button-next:hover,
.trend-movies .swiper-button-prev:hover,
.avatar-carousel .swiper-button-next:hover,
.avatar-carousel .swiper-button-prev:hover,
.episode-content .swiper-button-next:hover,
.episode-content .swiper-button-prev :hover,
.swiper-cast-movie-list-container .swiper-button-next:hover,
.swiper-cast-movie-list-container .swiper-button-prev :hover {
  opacity: 1;
  transform: scale(1.1);
}

.swiper-movie-list .swiper-button-next:after,
.swiper-movie-list .swiper-button-prev:after,
.trend-movies .swiper-button-next:after,
.trend-movies .swiper-button-prev:after,
.avatar-carousel .swiper-button-next:after,
.avatar-carousel .swiper-button-prev:after,
.episode-content .swiper-button-next:after,
.episode-content .swiper-button-prev:after,
.swiper-cast-movie-list-container .swiper-button-next:after,
.swiper-cast-movie-list-container .swiper-button-prev:after {
  display: none;
}

.swiper-button-disabled {
  display: none !important;
}

.swiper-container.trend-movies-containers:after {
  content: "";
  top: 0;
  right: 0;
  bottom: 0;
  width: 5%;
  height: 100%;
  z-index: 1;
  position: absolute;
  background-image: linear-gradient(90deg, rgba(58, 53, 90, 0), #100e19);
}

.swiper-movie-list .swiper-button-prev,
.trend-movies .swiper-button-prev,
.avatar-carousel .swiper-button-prev,
.episode-content .swiper-button-prev,
.swiper-cast-movie-list-container .swiper-button-prev {
  left: -2%;
  background-image: url("/assets/v6/images/arrow-left.svg");
}

.swiper-cast-movie-list-container .swiper-button-prev {
  left: -6%;
}

.swiper-movie-list .swiper-button-next,
.trend-movies .swiper-button-next,
.avatar-carousel .swiper-button-next,
.episode-content .swiper-button-next,
.swiper-cast-movie-list-container .swiper-button-next {
  right: -2%;
  background-image: url("/assets/v6/images/arrow-right.svg");
}

.swiper-cast-movie-list-container .swiper-button-next {
  right: -6%;
}

.header-mobile-nav {
  display: none;
}

#filterModal #popular-dropdown,
#filterModal #gender-dropdown {
  margin-top: 5px;
  background-color: transparent;
  border: none;
  outline: none;
  width: 100%;
}

#filterModal {
  width: inherit !important;
}

#popular-dropdown ul,
#gender-dropdown ul {
  display: flex;
  align-items: center;
}

#popular-dropdown .ui.checkbox input[type="checkbox"],
#gender-dropdown .ui.checkbox input[type="checkbox"] {
  display: none;
  /* Checkbox'ı gizle */
}

#filterModal #popular-dropdown .ui.checkbox label,
#filterModal #gender-dropdown .ui.checkbox label {
  background-color: var(--color-secondary);
  color: var(--color-white);
  min-height: 40px;
  cursor: pointer;
  display: flex;
  align-items: center;
  border-radius: 12px;
  padding: 12px 8px !important;
}

#filterModal #gender-dropdown .ui.checkbox label {
  flex-direction: column;
  justify-content: center;
  height: 88px;
  cursor: pointer;
}

#filterModal #popular-dropdown .ui.checkbox input[type="checkbox"]:checked+label,
#filterModal #gender-dropdown .ui.checkbox.item-box input[type="checkbox"]:checked+label {
  background-color: var(--color-dropdown-box-default);
}

.modals.dimmer[class*="top aligned"] .modal {
  margin: 0;
  width: 100%;
  box-shadow: none;
  margin-top: 5vh !important;
}

.ui.dimmer {
  padding: 0;
}

#filterModal {
  background-color: var(--color-modal-background);
  margin: 0;
  scroll-behavior: smooth;
  margin-top: 0 !important;
  /* padding-bottom: calc(121px + env(safe-area-inset-bottom)); */
}

#filterModal .modal-lg {
  margin-left: 20px !important;
  margin-right: 20px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  width: auto;
  max-width: none;
  height: 100%;
}

#filterModal .modal-lg .modal-content {
  position: relative;
  height: 100%;
}

#filterModal .modal-lg .modal-content .modal-footer {
  position: sticky;
  left: 0;
  right: 0;
  bottom: -16px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: center;
  padding: 16px;
  width: 100%;
  background: linear-gradient(180deg, rgba(7, 5, 14, 0), #07050e 46.1%);
  box-sizing: border-box;
}

#filterModal .modal-lg .modal-content .modal-footer .btn {
  border-radius: 12px;
  border-width: 1px;
  height: 40px;
  padding: 9px 15px;
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}

#filterModal .modal-lg .modal-content .modal-footer .btn.apply-button {
  background-color: #f30745;
  border-color: #f30745;
  transition-duration: 0.4s;
  width: 100%;
}

#filterModal .modal-lg .modal-content .modal-footer .btn.reset-button {
  background-color: hsla(0, 0%, 100%, 0);
  border-color: hsla(0, 0%, 100%, 0.32);
  transition-duration: 0.4s;
  display: flex;
  justify-content: center;
  width: 100%;
}

#filterModal .modal-lg .modal-content .modal-footer .btn.reset-button span {
  background-color: var(--color-dropdown-box-default);
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  margin-left: 6px;
  margin-right: 6px;
  padding: 2px 6px;
  border-radius: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#filterModal .modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

#filterModal .modal-body {
  max-height: calc(100vh - 300px);
  overflow: hidden;
  overflow-y: auto;
  padding-right: 15px;
  margin-right: -15px;
}

#filterModal.modal-body::-webkit-scrollbar {
  width: 8px;
}

#filterModal.modal-body::-webkit-scrollbar-thumb {
  background-color: var(--color-secondary-bg);
  border-radius: 4px;
}

#filterModal.modal-body::-webkit-scrollbar-thumb:hover {
  background-color: #5a5169;
}

.icon-box-wrapper::-webkit-scrollbar {
  height: 8px;
}

.icon-box-wrapper::-webkit-scrollbar-thumb {
  background-color: #a5a1b2;
  border-radius: 4px;
}

#filterModal .modal-body .filterContainer {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-direction: column;
  width: 100%;
}

#filterModal .modal-title {
  font-size: 40px;
  font-style: normal;
  font-weight: 900;
  line-height: 44px;
  margin-top: 60px;
  margin-bottom: 32px;
  padding-left: 12px;
  padding-right: 12px;
  color: #fff;
  visibility: visible;
}

#filterModal .filterContainer__content {
  overflow: hidden;
  overflow-x: scroll;
  transition: max-height 0.2s ease;
  gap: 10px;
  padding-bottom: 10px;
}

#filterModal .modal-body .filterContainer .filterContainer__content .filterContainer__content__item {
  flex-shrink: 0;
}
.filterContainer__content__item .icon-img {
  width: 32px;
  height: 32px;
}
.nbl-controlButton_size_mugen label {
  height: 40px;
  padding: 10px 16px;
}

#filterModal .filterContainer__content .filterContainer__content__item .item.item-box .filterContainer__content__item__text {
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  display: block;
  display: -webkit-box;
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  margin-top: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  text-overflow: -o-ellipsis-lastline;
  text-align: center;
  width: 100%;
}

#filterModal .filterContainer__content .filterContainer__content__item.filterContainer__content__iconItem .item.item-box .filterContainer__content__item__text {
  margin-top: 8px;
}

#filterModal .filterContainer h4 {
  color: #fff;
  font-size: 15px;
  font-style: normal;
  font-weight: 700;
  line-height: 22px;
  margin-bottom: 16px;
  padding-left: 12px;
  padding-right: 12px;
}

#filterModal #modal-years-dropdown,
#filterModal #modal-countries-dropdown {
  background-color: transparent;
  border: none;
  outline: none;
  width: 100%;
  margin-top: 16px;
  transition: all 0.3s ease;
  padding: 0;
}

.filterMoldalLabelBtn img {
  transition: transform 0.3s ease;
}

.filterMoldalLabelBtn.open img {
  transform: rotate(180deg);
}

#modal-years-dropdown ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  max-height: 200px;
  overflow-y: auto;
  overflow-x: hidden;
}

/* Mobile scrollbar stilleri */
#modal-years-dropdown ul::-webkit-scrollbar {
  width: 6px;
 
}

#modal-years-dropdown ul::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 3px;
}

#modal-years-dropdown ul::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.3);
  border-radius: 3px;
}

#modal-years-dropdown ul::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.5);
}

#modal-years-dropdown .ui.radio input[type="radio"] {
  display: none;
  /* Radio butonunu gizle */
}

#filterModal #modal-years-dropdown .ui.radio label {
  background-color: var(--color-secondary);
  color: var(--color-white);
  min-height: 40px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  transition: background-color 0.3s ease;
}

#filterModal #modal-years-dropdown .ui.radio input[type="radio"]:checked+label {
  background-color: #5f5887;
  background-image: linear-gradient(90deg, rgba(58, 53, 90, 0), #3a355a);
}

#modal-countries-dropdown ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

#modal-countries-dropdown ul li,
#modal-years-dropdown ul li {
  width: auto !important;
}

#modal-countries-dropdown .ui.checkbox input[type="checkbox"] {
  display: none;
  /* Checkbox'ı gizle */
}

#filterModal #modal-countries-dropdown .ui.checkbox label {
  background-color: var(--color-secondary);
  color: var(--color-white);
  min-height: 40px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  transition: background-color 0.3s ease;
}

#filterModal #modal-countries-dropdown .ui.checkbox input[type="checkbox"]:checked+label {
  background-color: #5f5887;
  background-image: linear-gradient(90deg, rgba(58, 53, 90, 0), #3a355a);
}

.modal-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px;
  background-color: transparent;
}

/*Deneme*/
.basePage .basePage__inner {
  background-color: #100e19;
  display: flex;
  flex: 1 0 auto;
  flex-direction: column;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
  min-height: 100%;
  overflow-x: hidden;
  overflow-y: clip;
  padding: 0;
  position: relative;
  width: 100%;
}

@media screen and (min-width: 600px) {
  .basePage .basePage__inner .root-wrapper:before {
    height: 72px;
  }

  .filterContainer__content__item.item.item-box {
    height: 88px;
    padding: 16px 8px;
  }
}

.basePage .basePage__inner .root-wrapper:before {
  content: "";
  height: 64px;
  display: block;
}

.header-items {
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 1000;
}

.header-items.headerTop_state_init {
  background-color: rgba(16, 14, 25, 0);
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transform: translateY(0);
  transition-duration: 80ms;
}

/*Slider Denemeleri*/
.promoSlider .ivi-carousel {
  position: relative;
  margin-top: 10px;
}

.ivi-carousel {
  position: relative;
  display: flex;
  width: 100%;
}

body:not(.touch) .ivi-carousel-container {
  margin-left: -12px;
  margin-right: -12px;
  padding-left: 12px;
  padding-right: 12px;
}

.ivi-carousel-container {
  -ms-overflow-style: none;
  margin-bottom: -24px;
  margin-top: -24px;
  overflow-x: scroll;
  padding-bottom: 24px;
  padding-top: 24px;
  scrollbar-width: none;
  white-space: nowrap;
}

.promoSlider .nbl-xArrowButton {
  bottom: 0;
  cursor: pointer;
  font-size: 0;
  height: 100%;
  position: absolute;
  top: 0;
  z-index: 3;
}

.promoSlider .nbl-xArrowButton:before {
  bottom: 0;
  content: "";
  left: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: opacity 0.4s;
}

.promoSlider .nbl-xArrowButton:active .nbl-xArrowButton__nbl-iconSvg {
  opacity: 1;
  transform: scale(0.8);
  transition: opacity 80ms, transform 80ms;
}

.promoSlider .nbl-xArrowButton:hover .nbl-xArrowButton__nbl-iconSvg {
  opacity: 1;
  transition: opacity 80ms;
}

.promoSlider .nbl-xArrowButton .nbl-xArrowButton__nbl-iconSvg {
  color: #fff;
  opacity: 0.72;
  position: absolute;
  top: 50%;
  transition: transform 0.4s, opacity 0.4s;
}

.nbl-iconSvg {
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  object-fit: contain;
  object-position: center;
}

.promoSlider .nbl-xArrowButton .nbl-xArrowButton__nbl-iconSvg:after {
  bottom: -16px;
  content: "";
  left: -16px;
  position: absolute;
  right: -16px;
  top: -16px;
}

.fakePage-pageSection_header {
  padding-bottom: 0;
}

.page-section-inner {
  margin-left: -12px;
  margin-right: -12px;
}

.watchTitle-image {
  height: 100%;
  left: 0;
  -o-object-fit: contain;
  object-fit: contain;
  position: absolute;
  top: 0;
  width: 100%;
}

.background-container {
  height: 0;
  padding-bottom: 56.25%;
  position: absolute;
  right: -20px;
  top: -96px;
  width: 100%;
}

.background-gradient {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.background-gradient:before {
  background: linear-gradient(90deg, #100e19 20%, rgba(16, 14, 25, 0));
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}

.background-container .background-image {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.watchTitle-title-hide {
  clip: rect(0 0 0 0);
  border: 0 !important;
  clip-path: inset(100%) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute;
  white-space: nowrap !important;
  width: 1px !important;
}

@media screen and (min-width: 1280px) {
  .ivi-carousel-viewport {
    height: 370px;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 1216px !important;
  }

  .pageSection-container-inner {
    margin-left: -12px;
    margin-right: -12px;
  }

  .background-gradient:before {
    background: linear-gradient(90deg, #100e19 20%, rgba(16, 14, 25, 0));
  }

  .background__gradient:after {
    background: linear-gradient(270deg, #100e19 0, rgba(16, 14, 25, 0));
    bottom: 0;
    content: "";
    display: block;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 20%;
    z-index: 1;
  }
}

/*Arrow*/
@media screen and (min-width: 1353px) {
  .promoSlider .nbl-xArrowButton_direction_right {
    left: 50%;
    transform: translateX(632px);
  }

  .promoSlider .nbl-xArrowButton:hover:before {
    opacity: 0.72;
    transition: opacity 80ms;
  }

  .promoSlider .nbl-xArrowButton {
    width: 35%;
  }

  .promoSlider .nbl-xArrowButton_direction_left {
    right: 50%;
    transform: translateX(-632px);
  }

  .promoSlider .nbl-xArrowButton_direction_right .nbl-xArrowButton__nbl-iconSvg {
    left: 16px;
  }

  .promoSlider .nbl-xArrowButton_direction_left .nbl-xArrowButton__nbl-iconSvg {
    right: 16px;
  }
}

@media screen and (min-width: 1280px) {
  .container {
    margin-left: auto;
    margin-right: auto;
    width: 1216px;
    max-width: inherit !important;
  }
}

@media screen and (min-width: 600px) and (max-width: 1279px) {
  .container {
    margin-left: 20px;
    margin-right: 20px;
    width: auto;
    max-width: inherit !important;
  }

  .pageSection__container {
    margin-left: 20px;
    margin-right: 20px;
    width: auto;
  }
}

@media (max-width: 1024px) {
  .glide {
    padding: 0 10px;
  }
}

@media (max-width: 767px) {
  .button-group {}

  .slide-content {
    justify-content: flex-end;
  }

  .modals.dimmer[class*="top aligned"] .modal {
    width: 90%;
    margin: 0 auto;
  }
}

@media screen and (min-width: 880px) and (max-width: 1159px) {
  .filter-desktop>ul>li {
    width: 25%;
  }

  .episode-card {
    width: 25%;
  }
}

@media screen and (min-width: 880px) {
  .watchTitle-imageContainer {
    height: 132px;
  }
}

@media screen and (min-width: 600px) and (max-width: 879px) {
  .filter-desktop>ul>li {
    width: 50%;
  }

  .episode-card {
    width: 33.333333%;
  }
}

@media (max-width: 640px) {
  /* .swiper-movie-list .swiper-button-next,
    .swiper-movie-list .swiper-button-prev,
    .trend-movies .swiper-button-next,
    .trend-movies .swiper-button-prev {
        display: none !important;
    } */

  #filterModal .modal-lg .modal-content .modal-footer {
    gap: 20px;
  }

  .filters-mobile-buttons {
    width: 100%;
  }
}

@media screen and (min-width: 600px) {
  .pageSection__container {
    padding-bottom: 24px;
    padding-top: 24px;
  }

  .promoSlider .nbl-xArrowButton_direction_right {
    left: 50%;
    transform: translateX(632px);
  }

  .nbl-xArrowButton {
    height: 100%;
    padding: 0;
    position: relative;
  }

  .nbl-xArrowButton_direction_right,
  .nbl-xArrowButton_direction_left {
    padding: 0;
    width: 52px;
  }

  .promoSlider .nbl-xArrowButton .nbl-xArrowButton__nbl-iconSvg {
    height: 32px;
    margin-top: -16px;
    width: 12px;
    top: 50%;
    position: absolute;
  }

  .nbl-xArrowButton_direction_right .nbl-xArrowButton__nbl-iconSvg {
    background-image: url(../images/arrowRight_12x32.svg);
    left: 8px;
  }

  .nbl-xArrowButton_direction_left .nbl-xArrowButton__nbl-iconSvg {
    background-image: url(../images/arrowLeft_12x32.svg);
    right: 8px;
  }

  .nbl-xArrowButton .nbl-xArrowButton__container {
    cursor: pointer;
    height: 100%;
    min-width: 32px;
    position: relative;
  }

  body.touch .nbl-xArrowButton:active .nbl-xArrowButton__nbl-icon,
  body.touch .nbl-xArrowButton:active .nbl-xArrowButton__nbl-iconSvg,
  body:not(.touch) .nbl-xArrowButton:active .nbl-xArrowButton__nbl-icon,
  body:not(.touch) .nbl-xArrowButton:active .nbl-xArrowButton__nbl-iconSvg {
    opacity: 1;
    transform: scale(0.9);
    transition-duration: 80ms;
  }

  .nbl-xArrowButton:not(:hover):not(:active) .nbl-xArrowButton__nbl-icon,
  .nbl-xArrowButton:not(:hover):not(:active) .nbl-xArrowButton__nbl-iconSvg,
  body.touch .nbl-xArrowButton:hover:not(:active) .nbl-xArrowButton__nbl-icon,
  body.touch .nbl-xArrowButton:hover:not(:active) .nbl-xArrowButton__nbl-iconSvg {
    opacity: 0.72;
    transform: scale(1);
    transition-duration: 0.4s;
  }

  .promoSlider .nbl-xArrowButton_direction_right:before {
    background-image: linear-gradient(90deg, rgba(31, 27, 46, 0), rgba(31, 27, 46, 0.72));
  }

  .promoSlider .nbl-xArrowButton_direction_left:before {
    background-image: linear-gradient(270deg, rgba(31, 27, 46, 0), rgba(31, 27, 46, 0.72));
  }

  .fakePage-pageSection-header {
    height: 0;
  }

  .fakePage-watchTitle {
    padding-left: 12px;
    padding-right: 12px;
  }

  .fakePage-watchTitle .watchTitle-image {
    max-width: 100%;
    width: auto;
  }

  .fakePage-watchTitle .watchTitle-title {
    text-align: left;
  }

  .background {
    padding-left: 12px;
    padding-right: 12px;
  }

  .footer-social-area ul li {
    width: auto;
  }
}

@media screen and (max-width: 599px) {
  .container {
    margin-left: 16px;
    margin-right: 16px;
    width: auto;
  }

  .glide__slide {
    height: calc(100vw * 0.83) !important;
    max-height: 500px;
  }

  .slider-bg>img {
    height: 100%;
    object-fit: cover;
  }

  .glide__slide--active.slider-bg::before {
    opacity: 1;
  }

  .glide__arrows .glide__arrow--prev {
    height: 20px;
    margin-top: -10px;
    width: 8px;
    left: 0;
  }

  .glide__arrows .glide__arrow--next {
    height: 20px;
    margin-top: -10px;
    width: 8px;
    right: 0;
  }

  .slide-content {
    width: 100%;
    align-items: center;
  }

  .slide-content img {
    max-height: 140px;
  }

  .filter-desktop .test-dropdown {
    width: 100% !important;
  }

  .filter-desktop .test-dropdown .icon-box-wrapper .item span {
    font-size: 13px;
    font-style: normal;
    font-weight: 500;
    height: 16px;
    line-height: 16px;
    margin-top: 0;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .ui.selection.dropdown .menu {
    max-height: none !important;
  }

  .list-wrapper {
    display: block;
  }

  .episode-card {
    width: 50%;
    max-width: 100%;
  }

  .footer-container .footer-wrapper {
    grid-template-columns: repeat(2, minmax(0, 2fr));
    gap: 2.5rem;
  }

  .footer-social-area ul li {
    width: 33.333333%;
  }
}

@media screen and (min-width: 600px) and (max-width: 743px) {
  .filter-desktop .test-dropdown {
    max-height: none !important;
    width: 416px !important;
  }

  .filter-desktop .test-dropdown .icon-box-wrapper .item {
    height: 100%;
    width: calc(25% - 8px);
  }

  .filters-mobile-buttons {
    width: 100%;
    margin-bottom: 16px;
  }

  .filters-mobile-buttons:last-child {
    margin-bottom: 0
  }
}

@media screen and (min-width: 392px) and (max-width: 511px) {
  .filterContainer_genres .filterContainer__item {
    width: 33.33333333%;
  }

  .watchEncyclopedia__watchInfoTable {
    width: 100%;
  }
}

@media screen and (min-width: 512px) and (max-width: 599) {
  .filterContainer_genres .filterContainer__item {
    width: 25%;
  }
}

@media screen and (max-width: 879px) {
  .watchEncyclopedia {
    flex-direction: column;
  }

  .watchEncyclopedia__watchInfoTable+.watchEncyclopedia__watchInfoTable {
    margin-top: 40px;
  }
}

@media screen and (min-width: 272px) and (max-width: 599px) {
  .pageSection__container {
    margin-left: 16px;
    margin-right: 16px;
    width: auto;
  }

  .pageSection__container {
    padding-bottom: 16px;
    padding-top: 16px;
  }

  .header-logo-image {
    width: 100px;
  }

  .box-numbers img {
    height: 300px;
  }

  .filter-desktop>ul>li {
    width: 100%;
  }

  .filter-desktop .test-dropdown .icon-box-wrapper .item {
    height: 100%;
    width: calc(50% - 5px);
  }

  .clear-filters {
    font-size: 13px;
  }

  #filterModal .modal-body .filterContainer .filterContainer__content .filterContainer__content__item {
    width: 25%;
  }

  .isMobile-gender-dropdown {
    padding: 0 !important;
  }

  .watchEncyclopedia__watchInfoTable {
    padding-left: 8px;
    padding-right: 8px;
  }

  .personFilmography__personFilmographyItem+.personFilmography__personFilmographyItem {
    margin-top: 32px;
  }

  .personFilmographyItem__figure {
    width: 75px;
  }

  .nbl-poster_type_poster:before {
    background-color: #1f1b2e;
    padding-bottom: 153.48837209%;
  }

  .nbl-poster_type_poster .nbl-poster__image,
  .nbl-poster_type_poster .nbl-poster__imageWrapper,
  .nbl-poster_type_poster .nbl-poster__imageWrapper:before,
  .nbl-poster_type_poster .nbl-poster__properties,
  .nbl-poster_type_poster:before {
    border-radius: 12px 12px 12px 12px;
  }

  .nbl-poster_type_poster .nbl-poster__imageWrapper:before {
    padding-bottom: 153.48837209%;
  }

  .personFilmographyItem__main {
    flex-direction: column;
  }

  .personFilmographyItem__action {
    margin-top: 10px;
    width: 100%;
  }

  .personFilmographyItem__action {
    margin-top: 10px;
    width: 100%;
  }

  .searchInput__title {
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    line-height: 44px;
    margin-bottom: 32px;
    padding-left: 8px;
    padding-right: 8px;
    margin-bottom: 20px;
  }

  .video-area {
    height: 280px;
  }

  .description-area {
    flex-direction: column;
  }

  .description-left {
    width: 100%;
    margin-right: 0;
    order: 2;
  }

  .description-right {
    order: 1;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
  }

  .description-right .description-right-item-box {
    padding-right: 20px;
    padding-bottom: 20px;
    margin-bottom: 0;
  }

  .description-right .description-right-item-box:last-child {
    margin-bottom: auto;
  }

  .quality-buttons {
    margin-top: 0;
    padding-bottom: 20px;
  }

  .login-wrapper {
    width: auto;
  }

  .login-container {
    margin-top: 5vh;
  }

  .breadcrumb {
    margin-bottom: 0;
  }

  .breadcrumb .breadcrumb-item:last-child {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
  }
}

@media screen and (min-width: 1096px) and (max-width: 1271px) {
  #filterModal .modal-body .filterContainer .filterContainer__content .filterContainer__content__item {
    width: 16.66666667%;
  }

  #filterModal #modal-years-dropdown .modal-body .filterContainer.filterContainer__content .filterContainer__content__item,
  #filterModal #modal-countries-dropdown .modal-body .filterContainer .filterContainer__content .filterContainer__content__item {
    width: auto !important;
  }

  .footer-container .footer-wrapper {
    grid-template-columns: repeat(5, minmax(0, 5fr));
    gap: 2.5rem;
  }
}

@media screen and (min-width: 744px) and (max-width: 1095px) {
  #filterModal .modal-body .filterContainer .filterContainer__content .filterContainer__content__item {
    width: 25%;
  }

  .filters-mobile-buttons {
    display: flex;
    padding-left: 8px;
    padding-right: 8px;
    margin-bottom: 16px;
    width: 50%;
  }

  .footer-container .footer-wrapper {
    grid-template-columns: repeat(4, minmax(0, 4fr));
    gap: 2.5rem;
  }
}

@media screen and (min-width: 600px) and (max-width: 743px) {
  #filterModal .modal-body .filterContainer .filterContainer__content .filterContainer__content__item {
    width: 33.33333333%;

  }

  .footer-container .footer-wrapper {
    grid-template-columns: repeat(3, minmax(0, 3fr));
    gap: 2.5rem;
  }
}

@media screen and (min-width: 1272px) {
  /* .isMobile-gender-dropdown .filterContainer__content__item {
    width: 14.28571429%;
  } */
}

@media (min-width: 1160px) {
  .filter-mobile {
    display: none;
  }

  .episode-card {
    width: 20%;
  }

  .fakePage-watchTitle {
    width: 50%;
  }

  .fakePage-title.font-degree {
    font-size: 56px;
    font-style: normal;
    font-weight: 700;
    line-height: 56px;
  }

  .background {
    margin-left: 25%;
    width: 75%;
  }
}

@media (max-width: 1160px) {

  .header-nav,
  .user-actions {
    display: none;
  }

  .header-mobile-nav {
    height: 48px;
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    background-color: rgba(31, 27, 46, 0.88);
    z-index: 1000;
  }

  .filter-desktop {
    display: none;
  }

  .filter-mobile {
    display: block;
    margin-top: 20px;
  }

  .mobile-filter-button {
    background-color: var(--color-secondary);
    color: var(--color-white);
    border: none;
    border-radius: 28px;
    height: 32px;
    padding: 6px 16px;
    font-size: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    transition: background-color 0.3s ease, transform 0.3s ease;
    cursor: pointer;
  }

  .mobile-filter-button span {
    font-size: 15px;
    font-style: normal;
    font-weight: 500;
    height: 20px;
    line-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-filter-button .filter-icon {
    width: 24px;
    height: 24px;
  }

  .mobile-filter-button:focus {
    outline: none;
  }

  .mobile-bottom-nav {
    display: flex;
    justify-content: center;
    width: 100%;
  }

  .mobile-bottom-nav-item {
    cursor: pointer;
    display: flex;
    flex-basis: 100%;
    flex-direction: column;
    align-items: center;
    flex-grow: 1;
    flex-shrink: 1;
    max-width: 120px;
    padding-bottom: 4px;
    padding-top: 8px;
    position: relative;
    text-decoration: none;
  }

  .mobile-bottom-nav-item.selected .mobile-bottom-nav-item-glow-image {
    opacity: 1;
  }

  .mobile-bottom-nav-item .mobile-bottom-nav-item-glow-image {
    background-image: url("/assets/v6/images/mobile-nav-glow.svg");
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: 64px 48px;
    height: 48px;
    left: 50%;
    opacity: 0;
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    width: 64px;
  }

  .mobile-bottom-nav-item .mobile-bottom-nav-item-icon {
    align-self: center;
    height: 20px;
    position: relative;
    width: 20px;
  }

  .mobile-bottom-nav-item .mobile-bottom-nav-item-icon img {
    height: 20px;
    left: 0;
    position: absolute;
    top: 0;
    width: 20px;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
  }

  .mobile-bottom-nav-item span {
    align-self: center;
    color: #a5a1b2;
    font-size: 10px;
    font-style: normal;
    font-weight: 500;
    height: 12px;
    line-height: 12px;
    margin-top: 4px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

@media (min-width: 640px) {
  .header-logo-image {
    width: 150px !important;
  }
}

@media (min-width: 768px) {
  #filterModal .modal-footer {
    margin-left: 16.66666667%;
    width: 66.66666667% !important;
    max-width: 1216px;
  }

  .filters-mobile-buttons {
    display: flex;
    padding-left: 8px;
    padding-right: 8px;
    margin-bottom: 16px;
    width: 50%;
  }
}

@media (max-width: 461px) {
  .container {
    margin-left: 16px;
    margin-right: 16px;
  }

  .header-logo a {
    width: 100px;
    height: auto;
  }

  .slide-content {
    width: 100%;
  }

  .slide-content slider-movie-description {
    text-align: center;
  }

  .footer-social-area ul li {
    width: 50%;
  }

  .form-element>label {
    font-size: 10px;
  }
}

/*Düzenlenecek*/

@media screen and (min-width: 600px) {
  body:not(.touch) .pageSection:last-child:not(:first-child) {
    padding-bottom: 80px;
  }
}

.pageSection:not(.pageSection_grow) {
  flex-shrink: 0;
}

.fakePage__pageSection_meta {
  overflow-x: hidden;
}

.fakePage__pageSection_meta .pageSection__container {
  padding-bottom: 0;
}

@media screen and (min-width: 600px) {
  .pageSection__container {
    padding-bottom: 24px;
    padding-top: 24px;
  }
}

@media screen and (min-width: 1280px) {
  .pageSection__container {
    margin-left: auto;
    margin-right: auto;
    width: 1216px;
  }

  .pageSection__container-inner {
    margin-left: -12px;
    margin-right: -12px;
  }

  .pageSection__container {
    margin-left: auto;
    margin-right: auto;
    width: 1216px;
  }

  .pageSection__container-inner {
    margin-left: -12px;
    margin-right: -12px;
  }
}

@media screen and (min-width: 1280px) {
  .pageSection__container {
    margin-left: auto;
    margin-right: auto;
    width: 1216px;
  }

  .pageSection__container-inner {
    margin-left: -12px;
    margin-right: -12px;
  }

  .pageSection__container {
    margin-left: auto;
    margin-right: auto;
    width: 1216px;
  }

  .pageSection__container-inner {
    margin-left: -12px;
    margin-right: -12px;
  }
}

.fakePage__badgeLine,
.fakePage__controls,
.fakePage__explanation,
.fakePage__knowledge,
.fakePage__mistakes,
.fakePage__watchDescription,
.fakePage__watchParams,
.fakePage__watchTitle {
  box-sizing: border-box;
  position: relative;
  z-index: 1;
}

@media screen and (min-width: 1160px) {

  .fakePage__badgeLine,
  .fakePage__controls,
  .fakePage__explanation,
  .fakePage__knowledge,
  .fakePage__mistakes,
  .fakePage__watchDescription,
  .fakePage__watchParams,
  .fakePage__watchTitle {
    width: 50%;
  }

  .fakePage__watchDescription.is-truncated {
    width: 100%;
  }
}

@media screen and (min-width: 880px) and (max-width: 1159px) {

  .fakePage__badgeLine,
  .fakePage__controls,
  .fakePage__explanation,
  .fakePage__knowledge,
  .fakePage__mistakes,
  .fakePage__watchDescription,
  .fakePage__watchParams,
  .fakePage__watchTitle {
    width: 66.66666667%;
  }
}

@media screen and (min-width: 600px) and (max-width: 879px) {

  .fakePage__badgeLine,
  .fakePage__controls,
  .fakePage__explanation,
  .fakePage__knowledge,
  .fakePage__mistakes,
  .fakePage__watchDescription,
  .fakePage__watchParams,
  .fakePage__watchTitle {
    width: 100%;
  }
}

@media screen and (min-width: 512px) and (max-width: 599px) {

  .fakePage__badgeLine,
  .fakePage__controls,
  .fakePage__explanation,
  .fakePage__knowledge,
  .fakePage__mistakes,
  .fakePage__watchDescription,
  .fakePage__watchParams,
  .fakePage__watchTitle {
    width: 100%;
  }
}

@media screen and (min-width: 392px) and (max-width: 511px) {

  .fakePage__badgeLine,
  .fakePage__controls,
  .fakePage__explanation,
  .fakePage__knowledge,
  .fakePage__mistakes,
  .fakePage__watchDescription,
  .fakePage__watchParams,
  .fakePage__watchTitle {
    width: 100%;
  }
}

@media screen and (max-width: 391px) {

  .fakePage__badgeLine,
  .fakePage__controls,
  .fakePage__explanation,
  .fakePage__knowledge,
  .fakePage__mistakes,
  .fakePage__watchDescription,
  .fakePage__watchParams,
  .fakePage__watchTitle {
    width: 100%;
  }
}

@media screen and (min-width: 600px) {

  .fakePage__badgeLine,
  .fakePage__controls,
  .fakePage__explanation,
  .fakePage__knowledge,
  .fakePage__mistakes,
  .fakePage__watchDescription,
  .fakePage__watchParams,
  .fakePage__watchTitle {
    padding-left: 12px;
    padding-right: 12px;
  }
}

@media screen and (min-width: 272px) and (max-width: 599px) {

  .fakePage__badgeLine,
  .fakePage__controls,
  .fakePage__explanation,
  .fakePage__knowledge,
  .fakePage__mistakes,
  .fakePage__watchDescription,
  .fakePage__watchParams,
  .fakePage__watchTitle {
    padding-left: 8px;
    padding-right: 8px;
  }
}

@media screen and (min-width: 880px) {
  .watchTitle__imageContainer {
    height: 132px;
  }
}

@media screen and (min-width: 600px) {
  .fakePage__watchTitle .watchTitle__title {
    text-align: left;
  }

  .fakePage__watchTitle .watchTitle__image {
    max-width: 100%;
    width: auto;
  }

  .fakePage__watchParams {
    margin-top: 20px;
  }
}

.watchTitle__image {
  height: 100%;
  left: 0;
  -o-object-fit: contain;
  object-fit: contain;
  position: absolute;
  top: 0;
  width: 100%;
}

@media screen and (min-width: 880px) and (max-width: 1159px) {
  .watchTitle__image {
    max-width: 100%;
    position: relative;
    width: auto;
  }
}

.watchTitle__title {
  color: #fff;
  font-size: 56px;
  font-style: normal;
  font-weight: 700;
  line-height: 56px;
  text-align: center;
}

@media screen and (min-width: 1160px) {
  .watchTitle__title.font-1160-56-56 {
    font-size: 56px;
    font-style: normal;
    font-weight: 700;
    line-height: 56px;
  }

  .watchTitle__title.font-1160-50-50 {
    font-size: 50px;
    line-height: 50px;
  }

  .watchTitle__title.font-600-46-46 {
    font-size: 46px;
    line-height: 46px;
  }

  .watchTitle__title.font-1160-42-44 {
    font-size: 42px;
    line-height: 44px;
  }

  .watchTitle__title.font-1160-36-40 {
    font-size: 36px;
    line-height: 40px;
  }

  .watchTitle__title.font-1160-32-36 {
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 36px;
  }

  .watchTitle__title.font-1160-28-32 {
    font-size: 28px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px;
  }

  .watchTitle__title.font-1160-24-28 {
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
  }
}

@media screen and (min-width: 600px) and (max-width: 1159px) {
  .watchTitle__title.font-600-56-56 {
    font-size: 56px;
    font-style: normal;
    font-weight: 700;
    line-height: 56px;
  }

  .watchTitle__title.font-600-50-50 {
    font-size: 50px;
    line-height: 50px;
  }

  .watchTitle__title.font-600-46-46 {
    font-size: 46px;
    line-height: 46px;
  }

  .watchTitle__title.font-600-42-44 {
    font-size: 42px;
    line-height: 44px;
  }

  .watchTitle__title.font-600-40-44 {
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    line-height: 44px;
  }

  .watchTitle__title.font-600-36-40 {
    font-size: 36px;
    line-height: 40px;
  }

  .watchTitle__title.font-600-32-36 {
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 36px;
  }

  .watchTitle__title.font-600-28-32 {
    font-size: 28px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px;
  }
}

@media screen and (max-width: 599px) {
  .watchTitle__title.font-320-56-56 {
    font-size: 56px;
    font-style: normal;
    font-weight: 700;
    line-height: 56px;
  }

  .watchTitle__title.font-320-42-44 {
    font-size: 42px;
    line-height: 44px;
  }

  .watchTitle__title.font-320-36-40 {
    font-size: 36px;
    line-height: 40px;
  }

  .watchTitle__title.font-320-32-36 {
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 36px;
  }

  .watchTitle__title.font-320-28-32 {
    font-size: 28px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px;
  }

  .watchTitle__title.font-320-24-28 {
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
  }

  .watchTitle__title.font-320-20-24 {
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
  }
}

@media screen and (min-width: 880px) and (max-width: 1159px) {
  .watchTitle__title {
    text-align: left;
  }
}

.watchTitle__title_hide {
  clip: rect(0 0 0 0);
  border: 0 !important;
  clip-path: inset(100%) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute;
  white-space: nowrap !important;
  width: 1px !important;
}

@media screen and (min-width: 600px) {
  .fakePage__watchParams .watchParams__paramsList {
    justify-content: flex-start;
  }
}

.watchParams__item {
  display: inline-block;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  position: relative;
  vertical-align: top;
}

.watchParams__item:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.watchParams__item:not(:first-child):before {
  content: "";
  display: inline-block;
  width: 8px;
}

.watchParams__item_hasDot:not(:first-child):before {
  background-color: hsla(0, 0%, 100%, 0.72);
  border-radius: 50%;
  content: "";
  height: 2px;
  margin-bottom: 3px;
  margin-left: 6px;
  margin-right: 6px;
  position: relative;
  text-align: center;
  width: 2px;
}

.watchParams__item .nbl-link_noLink {
  cursor: default;
  pointer-events: none;
}

.watchParams__paramsList+.watchParams__paramsList {
  margin-top: 4px;
}

.watchParams__paramsList {
  color: hsla(0, 0%, 100%, 0.8);
  display: flex;
  justify-content: center;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media screen and (min-width: 880px) and (max-width: 1159px) {
  .watchParams__paramsList {
    justify-content: flex-start;
  }
}

.badgeLine {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

@media screen and (min-width: 272px) and (max-width: 599px) {
  .badgeLine {
    justify-content: center;
  }
}

@media screen and (min-width: 600px) {
  .fakePage__explanation .explanation__container {
    display: inline-flex;
  }

  .fakePage__badgeLine {
    margin-top: 20px;
  }
}

.controls {
  display: flex;
  flex-wrap: nowrap;
}

.fakePage__controls {
  margin-top: 28px;
}

.controls__container {
  width: 100%;
}

.controls .nbl-segmentControl {
  border-radius: 0;
  gap: 12px;
  margin-left: -1000px;
  margin-right: -1000px;
  padding-left: 1000px;
  padding-right: 1000px;
  width: 100%;
}

body.touch .controls .nbl-segmentControl {
  overflow-x: scroll;
}

body:not(.touch) .controls .nbl-segmentControl {
  overflow: unset;
}

.controls .nbl-segmentControl>* {
  flex-shrink: 0;
}

.controls__unavailableControl {
  position: relative;
}

.nbl-segmentControl_size_bytrat {
  border-radius: 0;
  padding: 0;
}

.nbl-segmentControl_hasNativeScroll {
  -webkit-overflow-scrolling: touch;
}

.nbl-segmentControlItem_style_arf.nbl-segmentControlItem_selected:not(:hover):not(:active),
body.touch .nbl-segmentControlItem_style_arf.nbl-segmentControlItem_selected:hover:not(:active) {
  background-color: #5f5887;
}

.nbl-segmentControlItem_style_arf.nbl-segmentControlItem:not(:hover):not(:active),
body.touch .nbl-segmentControlItem_style_arf.nbl-segmentControlItem:hover:not(:active) {
  background-color: #1f1b2e;
}

.nbl-segmentControlItem_size_vusmus {
  border-radius: 12px;
  border-width: 0;
  box-sizing: border-box;
  height: 40px;
  padding: 10px 16px;
}

.nbl-segmentControlItem {
  border-style: solid;
  cursor: pointer;
  display: flex;
  opacity: 1;
}

.nbl-segmentControlItem_size_vusmus .nbl-segmentControlItem__caption {
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  height: 20px;
  line-height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nbl-segmentControlItem_textAlign_center .nbl-segmentControlItem__caption {
  text-align: center;
}

.pageSection__container {
  position: relative;
}

.background__gradient:before {
  background: linear-gradient(90deg, #100e19 20%, rgba(16, 14, 25, 0));
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}

@media screen and (min-width: 1280px) {
  .background__gradient:before {
    background: linear-gradient(90deg, #100e19 20%, rgba(16, 14, 25, 0));
  }
}

.background__image {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.background__container:after {
  background: linear-gradient(0deg, #100e19 0, rgba(16, 14, 25, 0));
  bottom: 0;
  content: "";
  display: block;
  height: 40%;
  left: 0;
  position: absolute;
  right: 0;
  width: 100%;
  z-index: 1;
}

.fakePage__header {
  height: 28px;
  overflow: hidden;
  position: relative;
  z-index: 2;
}

.fakePage__header,
.header__container {
  align-items: center;
  display: flex;
}

.background__gradient {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.background__container {
  height: 0;
  padding-bottom: 56.25%;
  position: absolute;
  right: -20px;
  top: -96px;
  width: 100%;
}

@media screen and (min-width: 600px) {
  .fakePage__header .header__container {
    padding-left: 12px;
    padding-right: 12px;
  }
}

@media screen and (min-width: 1160px) {
  .fakePage__header .header__container {
    width: 100%;
  }
}

body:not(.touch) .header__nbl-simpleControlButton {
  display: none;
}

@media screen and (min-width: 600px) {
  .header__nbl-simpleControlButton {
    display: none;
  }
}

.nbl-simpleControlButton_size_acor {
  box-sizing: border-box;
  height: 52px;
  padding: 16px;
}

.nbl-simpleControlButton_size_acor .nbl-simpleControlButton__content {
  height: 20px;
}

.nbl-simpleControlButton_style_mox:not(:hover):not(:active) .nbl-simpleControlButton__content,
body.touch .nbl-simpleControlButton_style_mox:hover:not(:active) .nbl-simpleControlButton__content {
  opacity: 1;
  transition-duration: 0.3s;
}

.nbl-simpleControlButton .nbl-simpleControlButton__content {
  display: flex;
  transition-property: opacity;
}

.nbl-simpleControlButton:not(:hover):not(:active) .nbl-simpleControlButton__iconWrapper,
.nbl-simpleControlButton:not(:hover):not(:active) .nbl-simpleControlButton__nbl-iconSvg,
body.touch .nbl-simpleControlButton:hover:not(:active) .nbl-simpleControlButton__iconWrapper,
body.touch .nbl-simpleControlButton:hover:not(:active) .nbl-simpleControlButton__nbl-iconSvg {
  transform: scale(1);
  transition-duration: 0.3s;
}

.nbl-simpleControlButton_size_acor .nbl-simpleControlButton__iconWrapper {
  align-self: center;
}

.nbl-simpleControlButton .nbl-simpleControlButton__iconWrapper {
  align-self: center;
  line-height: 0;
  transform-origin: 50% 50%;
  transition-property: transform;
}

.nbl-simpleControlButton:not(:hover):not(:active) .nbl-simpleControlButton__iconWrapper,
.nbl-simpleControlButton:not(:hover):not(:active) .nbl-simpleControlButton__nbl-iconSvg,
body.touch .nbl-simpleControlButton:hover:not(:active) .nbl-simpleControlButton__iconWrapper,
body.touch .nbl-simpleControlButton:hover:not(:active) .nbl-simpleControlButton__nbl-iconSvg {
  transform: scale(1);
  transition-duration: 0.3s;
}

.nbl-simpleControlButton_size_acor .nbl-simpleControlButton__nbl-iconSvg {
  height: 20px;
  width: 20px;
}

.background {
  position: relative;
}

.watchTitle__imageContainer {
  position: relative;
}

body:not(.touch) .nbl-button_style_makoto.nbl-button:hover:not(:active) {
  background-color: #2e2844;
  border-color: #2e2844;
}

.fakePage__underside {
  max-width: 100%;
  overflow-x: hidden;
  position: relative;
  z-index: 2;
}

.fakePage__pageSection_hide {
  clip: rect(0 0 0 0);
  border: 0 !important;
  clip-path: inset(100%) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute;
  white-space: nowrap !important;
  width: 1px !important;
}

.contentCard .clause {
  color: hsla(0, 0%, 100%, 0.72);
}

.clause {
  color: #a5a1b2;
}

.clause__text {
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
}

@media screen and (min-width: 880px) {
  .watchDescription__clause .clause__text.is-truncated .clause__text-inner {
    -webkit-line-clamp: 8;
    -webkit-box-orient: vertical;
    display: block;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    text-overflow: -o-ellipsis-lastline;
  }
}

.clause__text.is-truncated .clause__text-inner {
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  display: block;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  text-overflow: -o-ellipsis-lastline;
}

.clause__text div,
.clause__text li,
.clause__text p {
  font-size: inherit;
  font-style: inherit;
  font-weight: inherit;
  line-height: inherit;
}

.clause__text.is-truncated .clause__bottomComponent {
  display: none;
}

@media screen and (min-width: 1160px) {
  .watchOptions__container {
    margin-bottom: 8px;
    margin-top: 32px;
    padding-bottom: 32px;
    padding-top: 16px;
    position: relative;
  }

  .watchOptions__title {
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
  }

  .watchOptions__values {
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    display: block;
    display: -webkit-box;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    margin-top: 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-overflow: -o-ellipsis-lastline;
  }

  .watchOptions__options+.watchOptions__options {
    margin-top: 16px;
  }

  .watchOptions__title_narrow {
    display: none;
  }

  .watchOptions__iconsList {
    justify-content: flex-start;
    margin-top: 8px;
  }
}

.watchOptions__title span {
  color: hsla(0, 0%, 100%, 0.4);
}

.nbl-textBadge_isShadowEnabled_1.nbl-textBadge_style_rolin {
  box-shadow: 0 4px 12px hsla(0, 0%, 100%, 0);
}

.clause .clause__toggle {
  cursor: pointer;
  display: inline-block;
  margin-top: 8px;
}

.clause__toggle {
  color: hsla(0, 0%, 100%, 0.88);
  cursor: pointer;
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
  transition-duration: 0.4s;
  transition-property: transform, color;
}

.nbl-link_style_reska.nbl-link:not(:hover):not(:active) {
  color: hsla(0, 0%, 100%, 0.48);
}

.nbl-link:not(:hover):not(:active),
.nbl-link:not(:hover):not(:active) .nbl-link:after,
body.touch .nbl-link:hover:not(:active),
body.touch .nbl-link:hover:not(:active) .nbl-link:after {
  transition-duration: 0.4s;
}

.nbl-blockHeader_size_zylros .nbl-blockHeader__title,
.nbl-blockHeader_size_zylros .nbl-blockHeader__titleText {
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 28px;
}

.nbl-blockHeader .nbl-blockHeader__titleText {
  display: inline;
  margin-bottom: 0;
  margin-top: 0;
}

.watchEncyclopedia {
  display: flex;
  position: relative;
}

@media screen and (min-width: 600px) {
  .watchEncyclopedia__watchInfoTable {
    padding-left: 12px;
    padding-right: 12px;
  }
}

@media screen and (min-width: 880px) and (max-width: 1159px) {
  .watchEncyclopedia__watchInfoTable {
    width: 66.66666667%;
  }
}

@media screen and (min-width: 1160px) {
  .watchEncyclopedia__watchInfoTable {
    width: 50%;
  }
}

.watchInfoTable__nbl-blockHeader {
  margin-bottom: 8px;
}

.nbl-blockHeader_fullWidth_false {
  display: inline-flex;
  max-width: 100%;
}

.nbl-blockHeader {
  text-decoration: none;
}

.nbl-blockHeader_composition_zel.nbl-blockHeader_size_zylros .nbl-blockHeader__textBlock {
  min-height: 52px;
}

.nbl-blockHeader .nbl-blockHeader__textBlock {
  align-self: flex-start;
  display: flex;
  flex-grow: 1;
  flex-shrink: 1;
  min-width: 0;
  position: relative;
}

.nbl-blockHeader .nbl-blockHeader__textBlockContent {
  align-self: center;
  overflow: hidden;
}

.nbl-blockHeader .nbl-blockHeader__title {
  color: #fff;
}

.nbl-blockHeader_composition_zel.nbl-blockHeader_size_zylros .nbl-blockHeader__title {
  padding-bottom: 4px;
}

.nbl-blockHeader_size_zylros .nbl-blockHeader__title {
  max-height: 28px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nbl-blockHeader_arrowMode_insideTitle .nbl-blockHeader__arrow,
.nbl-blockHeader_arrowMode_none .nbl-blockHeader__arrow,
.nbl-blockHeader_arrowMode_none .nbl-blockHeader__titleArrow,
.nbl-blockHeader_arrowMode_outsideTitle .nbl-blockHeader__titleArrow,
.nbl-blockHeader_composition_apken .nbl-blockHeader__subtitle,
.nbl-blockHeader_composition_chep .nbl-blockHeader__image,
.nbl-blockHeader_composition_chep.nbl-blockHeader_size_elkas .nbl-blockHeader__image,
.nbl-blockHeader_composition_chep.nbl-blockHeader_size_elkas .nbl-blockHeader__overtitle,
.nbl-blockHeader_composition_nigbo .nbl-blockHeader__image,
.nbl-blockHeader_composition_nigbo .nbl-blockHeader__subtitle,
.nbl-blockHeader_composition_tebhat .nbl-blockHeader__image,
.nbl-blockHeader_composition_tebhat .nbl-blockHeader__subtitle,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_barros .nbl-blockHeader__image,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_barros .nbl-blockHeader__overtitle,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_barros .nbl-blockHeader__subtitle,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_barxiron .nbl-blockHeader__image,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_barxiron .nbl-blockHeader__overtitle,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_barxiron .nbl-blockHeader__subtitle,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_elkas .nbl-blockHeader__image,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_elkas .nbl-blockHeader__overtitle,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_elkas .nbl-blockHeader__subtitle,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_komus .nbl-blockHeader__image,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_komus .nbl-blockHeader__overtitle,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_komus .nbl-blockHeader__subtitle,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_sylnan .nbl-blockHeader__image,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_sylnan .nbl-blockHeader__overtitle,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_sylnan .nbl-blockHeader__subtitle,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_zylros .nbl-blockHeader__image,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_zylros .nbl-blockHeader__overtitle,
.nbl-blockHeader_composition_tebhat.nbl-blockHeader_size_zylros .nbl-blockHeader__subtitle,
.nbl-blockHeader_composition_ullaz .nbl-blockHeader__subtitle,
.nbl-blockHeader_composition_vaal .nbl-blockHeader__image,
.nbl-blockHeader_composition_vaal .nbl-blockHeader__subtitle {
  display: none;
}

.nbl-blockHeader .nbl-blockHeader__titleArrow {
  display: inline-block;
  margin-left: 8px;
}

.nbl-blockHeader .nbl-blockHeader__titleArrow .nbl-blockHeader__arrowItem {
  position: relative;
  top: 1px;
}

.nbl-blockHeader .nbl-blockHeader__arrowItem {
  background-image: url(../images/arrowRight_6x16.svg);
  height: 16px;
  width: 6px;
}

.nbl-plankMeta {
  display: flex;
}

.nbl-plankMeta_style_shagnu .nbl-plankMeta__aside,
.nbl-plankMeta_style_shagnu .nbl-plankMeta__title {
  color: hsla(0, 0%, 100%, 0.48);
}

.nbl-plankMeta_type_vilvati .nbl-plankMeta__aside,
.nbl-plankMeta_type_vilvati .nbl-plankMeta__title {
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  display: block;
  display: -webkit-box;
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
  max-height: 32px;
  overflow: hidden;
  text-overflow: ellipsis;
  text-overflow: -o-ellipsis-lastline;
}

.nbl-plankMeta_type_vilvati .nbl-plankMeta__title {
  margin-right: 16px;
  width: 144px;
}

.nbl-plankMeta .nbl-plankMeta__title {
  align-self: flex-start;
  flex-shrink: 0;
  text-align: left;
}

.nbl-plankMeta_style_shagnu .nbl-plankMeta__aside,
.nbl-plankMeta_style_shagnu .nbl-plankMeta__title {
  color: hsla(0, 0%, 100%, 0.48);
}

.nbl-plankMeta_type_vilvati .nbl-plankMeta__aside {
  text-align: left;
}

.nbl-plankMeta_style_shagnu .nbl-plankMeta__nbl-link.nbl-link:not(:hover):not(:active) {
  color: hsla(0, 0%, 100%, 0.72);
}

.watchInfoTable__row+.watchInfoTable__row {
  margin-top: 16px;
}

.nbl-plankMeta {
  display: flex;
}

.nbl-textBadge_style_rolin {
  -webkit-backdrop-filter: blur(0);
  backdrop-filter: blur(0);
  background-color: hsla(0, 0%, 100%, 0.16);
}

.nbl-textBadge_size_nokro {
  align-items: center;
  border-radius: 4px 4px 4px 4px;
  box-sizing: border-box;
  display: inline-flex;
  height: 20px;
  padding: 2px 6px;
}

.nbl-textBadge_size_nokro .nbl-textBadge__text {
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  height: 16px;
  letter-spacing: 0;
  line-height: 16px;
  margin-top: 0;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nbl-textBadge_style_rolin .nbl-textBadge__nbl-icon:after,
.nbl-textBadge_style_rolin .nbl-textBadge__nbl-icon:before,
.nbl-textBadge_style_rolin .nbl-textBadge__text {
  color: var(--color-white);
}

.nbl-button_style_makoto.nbl-button:not(:hover):not(:active) {
  background-color: #1f1b2e;
  border-color: #1f1b2e;
}

.nbl-button_style_iekichi.nbl-button:not(:hover):not(:active) {
  background-color: #312b45;
  border-color: #312b45;
}

.nbl-button_style_iekichi.nbl-button:not(:hover):not(:active) .nbl-button__iconWrapper {
  opacity: 1;
}

body:not(.touch) .nbl-button_style_iekichi.nbl-button:hover:not(:active) {
  background-color: #3a3352;
  border-color: #3a3352;
}

.nbl-button:not(:hover):not(:active),
.nbl-button:not(:hover):not(:active) *,
.nbl-button:not(:hover):not(:active) .nbl-button__strikedText:after,
body.touch .nbl-button:hover:not(:active),
body.touch .nbl-button:hover:not(:active) *,
body.touch .nbl-button:hover:not(:active) .nbl-button__strikedText:after {
  transition-duration: 0.4s;
}

.nbl-button_size_reiko {
  border-radius: 12px;
  border-width: 1px;
  height: 40px;
  padding: 11px;
}

.nbl-button_style_makoto {
  -webkit-backdrop-filter: blur(0);
  backdrop-filter: blur(0);
}

.nbl-button {
  align-items: center;
  background-origin: border-box;
  border-style: solid;
  box-sizing: border-box;
  cursor: pointer;
  display: inline-flex;
  flex-direction: column;
  font-family: iviSans, Arial, Helvetica, Helvetica Neue, FreeSans, sans-serif;
  justify-content: center;
  position: relative;
  text-decoration: none;
  transition-property: border-color, background-color;
}

@media screen and (min-width: 880px) {
  .watchDescription__clause .clause__text.is-truncated .clause__text-inner {
    -webkit-line-clamp: 8;
    -webkit-box-orient: vertical;
    display: block;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    text-overflow: -o-ellipsis-lastline;
  }
}

.clause__text.is-truncated .clause__text-inner {
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  display: block;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  text-overflow: -o-ellipsis-lastline;
}

@media screen and (max-width: 1159px) {
  .watchOptions__options {
    display: flex;
    justify-content: space-between;
  }
}

@media screen and (max-width: 1159px) {
  .watchOptions__options:first-child {
    padding-bottom: 12px;
  }
}

@media screen and (max-width: 1159px) {
  .watchOptions__title {
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    width: 80px;
  }

  .watchOptions__values {
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .watchOptions__options:not(:first-child):not(:last-child) {
    padding-bottom: 12px;
    padding-top: 12px;
  }

  .watchOptions__options+.watchOptions__options {
    border-top: 1px solid hsla(0, 0%, 100%, 0.16);
  }

  .watchOptions__options:last-child {
    padding-top: 12px;
  }

  .watchOptions__title_wide {
    display: none;
  }
}

.watchOptions__iconsList {
  display: flex;
  flex-wrap: wrap;
  height: 20px;
  justify-content: flex-end;
  margin-left: auto;
  overflow: hidden;
  gap: 10px;
}

/*Cast Profile CSS*/

@media screen and (min-width: 1280px) {
  .person__backlinkSection {
    margin-left: auto;
    margin-right: auto;
    width: 1216px;
  }
}

@media screen and (min-width: 1280px) {
  .person__backlinkSection {
    margin-left: auto;
    margin-right: auto;
    width: 1216px;
  }
}

.person__backlinkSection {
  position: relative;
  z-index: 1;
}

@media screen and (min-width: 1280px) {
  .person__backlinkSection-inner {
    margin-left: -12px;
    margin-right: -12px;
  }
}

@media screen and (min-width: 1280px) {
  .person__backlinkSection-inner {
    margin-left: -12px;
    margin-right: -12px;
  }
}

@media screen and (min-width: 600px) {
  .person__backlink {
    padding-left: 12px;
    padding-right: 12px;
  }
}

@media screen and (min-width: 1160px) {
  .person__backlink {
    width: 100%;
  }
}

.person__backlink {
  box-sizing: border-box;
  position: relative;
}

@media screen and (min-width: 600px) {
  .person__backlink .nbl-simpleControlButton {
    top: 16px;
  }
}

.person__backlink .nbl-simpleControlButton {
  cursor: pointer;
  padding-left: 0;
  position: absolute;
}

.nbl-simpleControlButton_size_barb {
  box-sizing: border-box;
  height: 52px;
  padding: 16px 12px 16px 16px;
}

.nbl-simpleControlButton_style_mox:not(:hover):not(:active) .nbl-simpleControlButton__content,
body.touch .nbl-simpleControlButton_style_mox:hover:not(:active) .nbl-simpleControlButton__content {
  opacity: 1;
  transition-duration: 0.3s;
}

.nbl-simpleControlButton_size_barb .nbl-simpleControlButton__content {
  height: 20px;
}

.nbl-simpleControlButton .nbl-simpleControlButton__content {
  display: flex;
  transition-property: opacity;
}

.nbl-simpleControlButton:not(:hover):not(:active) .nbl-simpleControlButton__iconWrapper,
.nbl-simpleControlButton:not(:hover):not(:active) .nbl-simpleControlButton__nbl-iconSvg,
body.touch .nbl-simpleControlButton:hover:not(:active) .nbl-simpleControlButton__iconWrapper,
body.touch .nbl-simpleControlButton:hover:not(:active) .nbl-simpleControlButton__nbl-iconSvg {
  transform: scale(1);
  transition-duration: 0.3s;
}

.nbl-simpleControlButton_size_barb .nbl-simpleControlButton__iconWrapper {
  align-self: center;
}

.nbl-simpleControlButton .nbl-simpleControlButton__iconWrapper {
  align-self: center;
  line-height: 0;
  transform-origin: 50% 50%;
  transition-property: transform;
}

.nbl-simpleControlButton_size_barb .nbl-simpleControlButton__caption {
  align-self: center;
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  height: 20px;
  line-height: 20px;
  margin-left: 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media screen and (min-width: 600px) {
  .person__contentColumn {
    padding-left: 12px;
    padding-right: 12px;
  }
}

@media screen and (min-width: 1160px) {
  .person__contentColumn {
    margin-left: 25%;
    width: 50%;
  }
}

.person__contentColumn {
  box-sizing: border-box;
  position: relative;
}

@media screen and (min-width: 880px) {
  .personHeader_hasPosterImage {
    padding-top: 60px;
  }
}

.personHeader {
  display: flex;
  flex-direction: column;
}

.personHeader_hasPosterImage .personHeader__figure {
  height: 120px;
  margin-bottom: 16px;
  margin-top: 40px;
  order: -2;
  width: 120px;
}

.personHeader_hasPosterImage .personHeader__figure .nbl-poster {
  cursor: auto;
}

.nbl-poster:not(.nbl-poster_locked) {
  cursor: pointer;
}

.nbl-poster {
  display: block;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.nbl-poster_type_person:before {
  border-radius: 50%;
}

.nbl-poster_type_person:before {
  background-color: #1f1b2e;
  padding-bottom: 100%;
}

.nbl-poster:before {
  content: "";
  display: block;
  height: 0;
}

.nbl-poster .nbl-poster__imageWrapper {
  display: flex;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.nbl-poster_type_person .nbl-poster__imageWrapper:before {
  padding-bottom: 100%;
}

.nbl-poster .nbl-poster__imageWrapper:before {
  content: "";
  display: block;
  height: 0;
  width: 100%;
}

.personHeader_hasPosterImage .personHeader__figure .nbl-poster__image,
.personHeader_hasPosterImage .personHeader__figure .nbl-poster__imagePersonWrapper {
  border-radius: 16px;
}

.nbl-poster_type_person .nbl-poster__imagePersonWrapper {
  align-items: center;
  border-radius: 50%;
  bottom: 0;
  display: flex;
  height: 100%;
  left: 0;
  overflow: hidden;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
}

.personHeader_hasPosterImage .personHeader__figure .nbl-poster__image,
.personHeader_hasPosterImage .personHeader__figure .nbl-poster__imagePersonWrapper {
  border-radius: 16px;
}

.nbl-poster_type_person .nbl-poster__image {
  border-radius: 50%;
  height: auto;
  position: static;
}

.nbl-poster .nbl-poster__image {
  height: 100%;
  left: 0;
  -o-object-fit: cover;
  object-fit: cover;
  position: absolute;
  top: 0;
  width: 100%;
}

.personHeader_hasPosterImage .personHeader__alternate {
  margin-top: 16px;
}

.personHeader__alternate {
  color: #a5a1b2;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
}

.personHeader_hasPosterImage .personHeader__title {
  order: -1;
}

@media screen and (min-width: 600px) {
  .personHeader__title {
    font-size: 56px;
    font-style: normal;
    font-weight: 900;
    font-weight: 700;
    line-height: 56px;
  }
}

.personHeader__title {
  word-wrap: break-word;
  color: #fff;
}

.personHeader__story {
  margin-top: 16px;
}

.personHeader__clause.clause {
  color: #d9d7e0;
}

.personHeader__clause.clause .clause__toggle:not(:hover):not(:active),
body.touch .personHeader__clause.clause .clause__toggle:hover:not(:active) {
  color: #a5a1b2;
  transition-duration: 0.4s;
}

.personHeader__clause.clause .clause__toggle {
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  margin-top: 6px;
}

@media screen and (min-width: 600px) {

  .person__breadCrumbs,
  .person__personAnchorLink,
  .person__personBiography,
  .person__personComments,
  .person__personFilmography,
  .person__personMainFilms,
  .person__personPopulars {
    margin-top: 40px;
  }
}

.personAnchorLink__list {
  display: flex;
}

@media screen and (min-width: 600px) {
  .personAnchorLink__item {
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 21px;
  }
}

.personAnchorLink__item {
  position: relative;
}

.personAnchorLink__link:not(:hover):not(:active),
body.touch .personAnchorLink__link:hover:not(:active) {
  color: hsla(0, 0%, 100%, 0.88);
  transition-duration: 0.4s;
}

.personAnchorLink__link {
  cursor: pointer;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  transition-property: color;
}

.personAnchorLink__item:not(:first-child):before {
  color: #fff;
  content: "•";
  display: inline-flex;
  margin-left: 8px;
  margin-right: 8px;
}

@media screen and (min-width: 600px) {

  .person__breadCrumbs,
  .person__personAnchorLink,
  .person__personBiography,
  .person__personComments,
  .person__personFilmography,
  .person__personMainFilms,
  .person__personPopulars {
    margin-top: 40px;
  }
}

.gallery {
  position: relative;
}

@media screen and (min-width: 600px) {
  .gallery_personsGallery .gallery__header {
    padding-left: 12px;
    padding-right: 12px;
  }
}

@media screen and (min-width: 1160px) {
  .gallery_personsGallery .gallery__header {
    margin-left: 25%;
    width: 50%;
  }
}

.gallery_personsGallery .gallery__header {
  box-sizing: border-box;
}

.gallery .gallery__carousel {
  position: relative;
}

@media screen and (min-width: 600px) {
  .gallery__header+.gallery__carousel {
    margin-top: 24px;
  }
}

.gallery_personsGallery .gallery__carousel {
  padding-left: 0;
  padding-right: 0;
}

@media screen and (min-width: 600px) {
  .gallery_personsGallery .gallery__carousel {
    padding-left: 12px;
    padding-right: 12px;
  }
}

@media screen and (min-width: 1160px) {
  .gallery_personsGallery .gallery__carousel {
    margin-left: 25%;
    width: 50%;
  }
}

@media screen and (min-width: 600px) {
  .personFilmography__header {
    align-items: flex-end;
  }
}

.personFilmography__header {
  display: flex;
  flex-wrap: wrap;
}

@media screen and (min-width: 600px) {
  .personFilmography__title {
    margin-right: 8px;
  }
}

.personFilmography__title {
  color: #fff;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 28px;
  margin-bottom: 4px;
}

.personFilmography__extraTitle {
  color: #a5a1b2;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  margin-bottom: 4px;
}

@media screen and (min-width: 600px) {
  .personFilmography__content {
    margin-top: 16px;
  }
}

.personFilmography__scrollableTabsSection.nbl-scrollableTabs_variation_vex .nbl-scrollableTabs__nbl-scrollpane {
  padding-left: 0;
  padding-right: 0;
}

.nbl-scrollableTabs_variation_vex .nbl-scrollableTabs__nbl-scrollpane {
  box-sizing: border-box;
  padding-left: 32px;
  padding-right: 32px;
  width: 100%;
}

.nbl-scrollpane_variation_crein {
  padding-left: 32px;
  padding-right: 32px;
}

.nbl-scrollpane {
  display: inline-block;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.nbl-scrollableTabs_variation_vex .nbl-scrollableTabs__nbl-scrollpane.nbl-scrollpane_hasNativeScroll .nbl-scrollpane__viewport {
  overflow-x: auto;
}

.nbl-scrollpane_variation_crein.nbl-scrollpane_hasNativeScroll .nbl-scrollpane__viewport {
  overflow-x: auto;
}

.nbl-scrollableTabs_variation_vex .nbl-scrollableTabs__nbl-scrollpane .nbl-scrollpane__viewport {
  overflow-x: hidden;
}

.nbl-scrollpane_variation_crein .nbl-scrollpane__viewport {
  overflow-x: hidden;
}

.nbl-scrollpane_hasNativeScroll .nbl-scrollpane__viewport {
  -webkit-overflow-scrolling: touch;
}

.nbl-scrollpane .nbl-scrollpane__content {
  display: table;
  transition: transform 0.2s;
  -webkit-user-select: text;
  -moz-user-select: text;
  user-select: text;
  width: 100%;
}

.nbl-scrollpane .nbl-scrollpane__content>* {
  overflow: hidden;
}

.nbl-scrollableTabs_variation_vex .nbl-scrollableTabs__nbl-tabs {
  font-size: 0;
  white-space: nowrap;
}

.nbl-tabs {
  position: relative;
}

.nbl-tabs .nbl-tabs__inner {
  overflow: hidden;
}

.nbl-scrollableTabs_variation_vex .nbl-scrollableTabs__nbl-tabs .nbl-tabs__gutter {
  bottom: 0;
  height: 1px;
  left: 0;
  right: 0;
}

.nbl-tabs_style_fir .nbl-tabs__gutter {
  background-color: hsla(0, 0%, 100%, 0.16);
}

.nbl-tabs .nbl-tabs__gutter {
  position: absolute;
}

.nbl-tabs_style_fir .nbl-tabs__nbl-tabsItem {
  opacity: 1;
}

.nbl-scrollableTabs_variation_vex .nbl-scrollableTabs__nbl-tabs .nbl-tabs__nbl-tabsItem {
  padding: 0 0 12px;
}

.nbl-tabsItem:not(:hover):not(:active),
.nbl-tabsItem:not(:hover):not(:active) *,
body.touch .nbl-tabsItem:hover:not(:active),
body.touch .nbl-tabsItem:hover:not(:active) * {
  transition-duration: 0.4s;
}

.nbl-tabsItem .nbl-tabsItem__captionRow {
  display: table;
  font-size: 0;
  white-space: nowrap;
}

.nbl-scrollableTabs_variation_vex .nbl-scrollableTabs__nbl-tabs .nbl-tabs__nbl-tabsItem .nbl-tabsItem__caption {
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  height: 20px;
  line-height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nbl-tabs_style_fir .nbl-tabs__nbl-tabsItem.nbl-tabsItem_selected:not(:hover):not(:active) .nbl-tabsItem__caption,
body.touch .nbl-tabs_style_fir .nbl-tabs__nbl-tabsItem.nbl-tabsItem_selected:active .nbl-tabsItem__caption,
body.touch .nbl-tabs_style_fir .nbl-tabs__nbl-tabsItem.nbl-tabsItem_selected:hover:not(:active) .nbl-tabsItem__caption,
body.touch .nbl-tabs_style_fir .nbl-tabs__nbl-tabsItem:active .nbl-tabsItem__caption,
body:not(.touch) .nbl-tabs_style_fir .nbl-tabs__nbl-tabsItem.nbl-tabsItem_selected:active .nbl-tabsItem__caption,
body:not(.touch) .nbl-tabs_style_fir .nbl-tabs__nbl-tabsItem.nbl-tabsItem_selected:hover:not(:active) .nbl-tabsItem__caption,
body:not(.touch) .nbl-tabs_style_fir .nbl-tabs__nbl-tabsItem:active .nbl-tabsItem__caption,
body:not(.touch) .nbl-tabs_style_fir .nbl-tabs__nbl-tabsItem:hover:not(:active) .nbl-tabsItem__caption {
  color: #fff;
}

.nbl-tabs_style_fir .nbl-tabs__nbl-tabsItem.nbl-tabsItem_selected:not(:hover):not(:active) .nbl-tabsItem__stripe,
body.touch .nbl-tabs_style_fir .nbl-tabs__nbl-tabsItem.nbl-tabsItem_selected:active .nbl-tabsItem__stripe,
body.touch .nbl-tabs_style_fir .nbl-tabs__nbl-tabsItem.nbl-tabsItem_selected:hover:not(:active) .nbl-tabsItem__stripe,
body:not(.touch) .nbl-tabs_style_fir .nbl-tabs__nbl-tabsItem.nbl-tabsItem_selected:active .nbl-tabsItem__stripe,
body:not(.touch) .nbl-tabs_style_fir .nbl-tabs__nbl-tabsItem.nbl-tabsItem_selected:hover:not(:active) .nbl-tabsItem__stripe {
  background-color: #f30745;
}

.nbl-scrollableTabs_variation_vex .nbl-scrollableTabs__nbl-tabs .nbl-tabs__nbl-tabsItem .nbl-tabsItem__stripe {
  height: 4px;
}

.nbl-tabsItem .nbl-tabsItem__stripe {
  bottom: 0;
  left: 0;
  position: absolute;
  transition-property: background-color;
}

.personFilmography__list {
  margin-top: 16px;
}

.personFilmographyItem__body {
  align-items: center;
  display: flex;
}

@media screen and (min-width: 600px) {
  .personFilmographyItem__figure {
    width: 80px;
  }
}

.personFilmographyItem__figure {
  flex-shrink: 0;
}

.personFilmographyItem__figure .nbl-poster {
  width: 100%;
}

.personFilmographyItem__figure .nbl-poster.nbl-poster_type_poster .nbl-poster__image,
.personFilmographyItem__figure .nbl-poster.nbl-poster_type_poster:before {
  border-radius: 4px;
}

@media screen and (min-width: 600px) {

  .nbl-poster_type_poster .nbl-poster__image,
  .nbl-poster_type_poster .nbl-poster__imageWrapper,
  .nbl-poster_type_poster .nbl-poster__imageWrapper:before,
  .nbl-poster_type_poster .nbl-poster__properties,
  .nbl-poster_type_poster:before {
    border-radius: 16px 16px 16px 16px;
  }
}

@media screen and (min-width: 600px) {
  .nbl-poster_type_poster:before {
    background-color: #1f1b2e;
    padding-bottom: 153.48837209%;
  }

  .nbl-poster_type_poster .nbl-poster__imageWrapper:before {
    padding-bottom: 153.48837209%;
  }

  .personFilmographyItem__main {
    align-items: center;
    justify-content: space-between;
  }

  .personFilmographyItem__info {
    margin-right: 16px;
    max-width: 60%;
    width: 100%;
  }

  .personFilmographyItem__action {
    min-width: 140px;
  }

  .personFilmography__personFilmographyItem+.personFilmography__personFilmographyItem {
    margin-top: 16px;
  }
}

.personFilmographyItem__main {
  display: flex;
  flex: 0 1 100%;
  margin-left: 16px;
}

.personFilmographyItem__title,
.personFilmographyItem__year {
  color: #fff;
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
}

.personFilmographyItem__title {
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  display: block;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  text-overflow: -o-ellipsis-lastline;
}

.personFilmographyItem__rating {
  color: #a5a1b2;
  display: flex;
}

.personFilmographyItem__info>*+* {
  margin-top: 4px;
}

.personFilmographyItem__ratingLabel {
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
}

.personFilmographyItem__ratingValue {
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  margin-left: 4px;
}

.nbl-button_size_shinnok {
  border-radius: 12px;
  border-width: 1px;
  height: 40px;
  padding: 9px 15px;
}

.nbl-button_style_makoto.nbl-button:not(:hover):not(:active) .nbl-button__primaryText {
  color: #fff;
}

.nbl-button_size_shinnok .nbl-button__primaryText,
.nbl-button_size_shinnok .nbl-button__primaryText .nbl-button__strikedText {
  font-size: 15px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
}

.nbl-button .nbl-button__primaryText,
.nbl-button .nbl-button__secondaryText {
  display: block;
  transition-property: color;
  width: 100%;
}

.personBiography__title {
  color: #fff;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 28px;
}

.personBiography__clause.clause {
  color: #d9d7e0;
  margin-top: 16px;
}

.personFilmographyItem__action .nbl-button {
  width: 100%;
}

.nbl-button_textAlign_center {
  align-content: center;
  text-align: center;
}

/*Search Page*/

.search {
  color: var(--color-white);
}

@media screen and (min-width: 600px) {
  .searchInput {
    padding-bottom: 32px;
  }

  .searchInput__title {
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    line-height: 44px;
    margin-bottom: 32px;
  }

  .searchInput__title {
    padding-left: 12px;
    padding-right: 12px;
  }

  .searchInput__form {
    padding-left: 12px;
    padding-right: 12px;
  }

  .video-area {
    height: 600px;
  }
}

.searchInput {
  padding-top: 15px;
  top: 0;
  z-index: 1;
}

@media screen and (min-width: 1280px) {
  .searchInput__container {
    margin-left: auto;
    margin-right: auto;
    width: 1216px;
  }

  .searchInput__container-inner {
    margin-left: -12px;
    margin-right: -12px;
  }
}

.searchInput .nbl-input {
  max-width: 820px;
  width: 100%;
}

.searchInput .nbl-input input {
  background-color: #fff;
  color: #000;
}

.nbl-input_type_pascal.nbl-input_state_filled .nbl-input__placeholder,
.nbl-input_type_pascal.nbl-input_state_focused .nbl-input__placeholder {
  transform: translate3d(0, -8px, 0) scale(0.86666667) perspective(1px);
}

.nbl-input_type_pascal .nbl-input__body {
  border-radius: 12px;
  height: 40px;
}

.nbl-input .nbl-input__body {
  overflow: hidden;
  position: relative;
  transform: translateZ(0);
}

.nbl-input_iconType_button:not(.nbl-input_state_focused):not(.nbl-input_state_filled) .nbl-input__editbox {
  padding-right: 40px;
}

.nbl-input_style_xenon:not(.nbl-input_error) .nbl-input__editbox {
  background-color: #d9d7e0;
  color: #1f1b2e;
}

.nbl-input .nbl-input__editbox {
  border-width: 0;
  box-sizing: border-box;
  color: transparent;
  cursor: pointer;
  display: block;
  font-family: inherit;
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  transform: translateZ(0);
  transition-property: background-color, color;
  width: 100%;
  height: 100%;
}

.nbl-input_iconType_button .nbl-input__button {
  width: 40px;
}

.nbl-input_type_pascal .nbl-input__button {
  bottom: 0;
  height: 40px;
  top: 0;
}

.nbl-input .nbl-input__button_disabled,
.nbl-input_state_disabled .nbl-input__button,
.nbl-input_state_disabled .nbl-input__reveal {
  cursor: default;
  pointer-events: none;
}

.nbl-input .nbl-input__button {
  cursor: pointer;
  position: absolute;
  right: 0;
}

.nbl-input_style_xenon:not(.nbl-input_error) .nbl-input__button:not(.nbl-input__button_disabled) .nbl-input__nbl-iconSvg,
.nbl-input_style_xenon:not(.nbl-input_error) .nbl-input__button_disabled .nbl-input__nbl-iconSvg,
.nbl-input_style_xenon:not(.nbl-input_error) .nbl-input__icon .nbl-input__nbl-iconSvg {
  opacity: 0.16;
}

.nbl-input_iconType_button .nbl-input__button .nbl-input__nbl-iconSvg {
  left: 12px;
  right: 12px;
}

.nbl-input_type_pascal .nbl-input__button .nbl-input__nbl-iconSvg {
  bottom: 12px;
  top: 12px;
}

.nbl-input .nbl-input__button .nbl-input__nbl-iconSvg {
  height: 16px;
  position: absolute;
  width: 16px;
}

.nbl-input .nbl-input__overlays {
  bottom: 0;
  left: 0;
  overflow: hidden;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  transform: translateZ(0);
}

.nbl-input_style_xenon:not(.nbl-input_error) .nbl-input__placeholder,
.nbl-input_style_xenon:not(.nbl-input_error):not(.nbl-input_state_focused):not(.nbl-input_state_filled) .nbl-input__placeholder {
  color: #a5a1b2;
}

.nbl-input_iconType_button .nbl-input__placeholder {
  left: 12px;
  right: 40px;
}

.nbl-input_type_pascal .nbl-input__placeholder {
  height: 20px;
  top: 10px;
}

.nbl-input .nbl-input__placeholder {
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  height: 20px;
  line-height: 20px;
  overflow: hidden;
  pointer-events: none;
  position: absolute;
  text-overflow: ellipsis;
  text-rendering: geometricPrecision;
  transform-origin: 0 0;
  transition-property: transform, color;
  white-space: nowrap;
  will-change: transform;
}

.nbl-input_style_xenon:not(.nbl-input_error) .nbl-input__stripe {
  background-color: rgba(31, 27, 46, 0.16);
}

.nbl-input .nbl-input__stripe {
  bottom: 0;
  height: 2px;
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  transition-property: background-color;
}

@media screen and (max-width: 599px) {
  .searchBlock__container {
    margin-left: 16px;
    margin-right: 16px;
    width: auto;
  }
}

.series-watch-nav {
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.alternative-group {
  padding: 10px 0px;
}

.series-watch-nav ul li a {
  padding: 7px 0;
  color: #6a6883;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  border-bottom: 1px solid transparent;
  -webkit-transition: color 0.2s ease-in-out;
  -moz-transition: color 0.2s ease-in-out;
  -ms-transition: color 0.2s ease-in-out;
  -o-transition: color 0.2s ease-in-out;
  transition: color 0.2s ease-in-out;
}

.series-watch-nav ul li a img {
  margin-right: 10px;
  width: 20px;
}

.series-watch-nav ul li a:hover {
  color: #9b9dab;
}

.series-watch-nav ul li:nth-child(n + 2) {
  margin: 0 0 0 20px;
}

.series-watch-nav ul li.series-watch-nav-active {
  border-bottom: 1px solid #42e3d0;
}

.series-watch-nav ul li.series-watch-nav-active a {
  color: #42e3d0;
}

.series-watch-alternatives {
  padding: 10px 0px;
}

.series-watch-alternatives ul li.series-alter-active {
  background-color: #5f5887;
  background-image: linear-gradient(90deg, rgba(58, 53, 90, 0), #3a355a);
}

.series-watch-alternatives ul li {
  border: 1px solid var(--color-gray-button);
  background-color: #1f1b2e;
  border-radius: 16px;
  font-size: 14px;
  font-weight: 500;
  color: #fff;
  cursor: pointer;
  transition: 0.2s;
}
.series-watch-alternatives ul li button {
padding: 5px 10px;
}

body.no-scroll {
  overflow: hidden;
}

body.no-scroll .header-items.headerTop_state_init {
  background-color: rgb(16 14 25);
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
}

#mobileNavigator {
  display: none;
}

#mobileNavigator.active {
  background-color: #100e19;
  border-top: 1px solid hsla(0, 0%, 100%, 0.16);
  position: fixed;
  display: block;
  top: 72px;
  left: 0;
  right: 0;
  height: 100%;
  overflow: hidden;
  overflow-y: auto;
  overflow-x: scroll;
  z-index: 10;
  padding-bottom: calc(85px + env(safe-area-inset-bottom));
  scroll-behavior: smooth;
}

#mobileNavigator.active .pageSection-container {
  padding-bottom: calc(85px + env(safe-area-inset-bottom));
}

#mobileNavigator.active body {
  overflow: hidden;
}

.mobile-navigator-nav .nav-item {
  margin-top: 24px;
}

.mobile-navigator-nav .nav-item:first-child {
  margin-top: 0;
}

.mobile-navigator-nav .nav-item .nav-content>a {
  color: hsla(0, 0%, 100%, 0.72);
  transition-duration: 0.4s;
  font-size: 14px;
  margin-top: 24px;
}

.modal-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  color: #fff;
  padding: 9px 15px;
  border: none;
  border-radius: 8px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  transition: background-color 0.3s ease;
}

.modal-button .icon {
  margin-right: 12px;
}

.modal-button:hover {
  background-color: #444;
}

/* Özel buton renkleri */
.login-btn {
  background-color: #ff0033;
}

.login-btn:hover {
  background-color: #1f1b2e;
}

.wc-button {
  background-color: #1f1b2e;
  border-color: #1f1b2e;
}

.mobile-navigator-content .mobile-navigator-group-item {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid hsla(0, 0%, 100%, 0.16);
}

.mobile-navigator-content .mobile-navigator-group-item:last-child {
  margin-bottom: 24px;
  padding-bottom: 24px;
}

.dropdown-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  font-size: 16px;
  margin-bottom: 8px;
  font-weight: 600;
  transition: background-color 0.3s ease;
}

.dropdown-content {
  padding-left: 0;
  margin-top: 24px;
  width: 256px;
}

.dropdown-content-title {
  color: var(--color-white);
  font-size: 15px;
  font-weight: 600;
  margin-top: 12px;
}

.dropdown-content ul {
  margin-top: 12px;
}

.dropdown-content ul li:not(:first-child) {
  margin-top: 12px;
}

.dropdown-content ul li a {
  color: hsla(0, 0%, 100%, 0.72);
  font-size: 14px;
}

.dropdown-content.hidden {
  display: none;
}

/* Dropdown içindeki öğe hover */
.dropdown-content li:hover {
  background-color: #333;
}

.mobile-navigator-footer ul {
  display: flex;
  flex-wrap: wrap;
  margin: -10px;
}

.mobile-navigator-footer ul li {
  padding: 10px;
}

.mobile-navigator-footer ul li a {
  padding: 10px 16px;
  transition: background-color 0.4s;
  background: #1f1b2e;
  color: hsla(0, 0%, 100%, 0.48);
  border-radius: 6px;
}

.mobile-navigator-footer ul li a .social-picture {
  align-self: center;
  flex-grow: 0;
  flex-shrink: 0;
}

.mobile-navigator-footer ul li a .social-button-text-area {
  margin-left: 10px;
}

.alert {
  padding: 15px 15px;
  background-color: #7a0f0f;
  border-radius: 8px;
}

.alert-text {
  margin-left: 10px;
}

.cast-list ul {
  margin: -10px;
}

.cast-list ul li {
  padding: 10px;
}

.cast-box {
  overflow: hidden;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
}

.cast-box-content {
  padding: 20px;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  background: linear-gradient(to bottom, transparent, rgb(16 14 25));
}

.cast-box-content span {
  color: #fff;
  font-size: 0.95em;
  font-weight: 700;
}

.cast-box-content p {
  margin: 5px 0 0;
  color: #6c7388;
  font-size: 0.95em;
  font-weight: 500;
}

.cast-box:hover .cast-box-content {
  opacity: 0;
  visibility: hidden;
}

.cast-detail-poster {
  top: 20px;
}

.cast-detail-poster img {
  width: 100%;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
}

.pagination {
  margin: 40px 0 0;
}

.pagination ul {
  margin-bottom: 20px;
  padding: 5px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
  background: #292a2d
}

.pagination ul li a {
  padding: 10px 20px;
  color: #fff;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 7400;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.pagination ul li a svg {
  width: 16px;
  height: 16px;
  color: #fff;
}

.pagination ul li a {
  height: 100%;
  display: flex
  ;
      justify-content: center;
      flex-direction: column-reverse;
}

.pagination ul li a:hover {
  background: #111214;
}

.pagination ul li:nth-child(n + 2) {
}

.pagination ul li:nth-child(n + 2)::before {
  content: "";
  top: 50%;
  left: -10px;
  width: 1px;
  height: 20px;
  position: absolute;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
  background: #293145;
}

.pagination ul li.active a {
  color: #fff;
  background: #111214;
}

.channels-area {
  margin: 40px 0 0;
}

.channels>ul>li:nth-child(n + 2) {
  margin: 40px 0 0;
}

.channels-box {
  padding: 40px 30px 0;
  z-index: 1;
}

.channels-box>a>img {
  margin: 0 0 30px;
  height: 40px;
}

.channels-box ul {
  margin: 30px 0 0;
}

.channels-box ul li .movie-box-image a img {
  height: 200px;
}

.channels-box-logo {
  top: 0;
  right: 30px;
}

.channels-box-logo img {
  width: 120px;
}

.channels-box-text h4 {
  color: #fff;
  font-size: 1.5em;
  font-weight: 700;
}

.channels-box-text p {
  margin: 5px 0 0;
  color: #6c7388;
  font-size: 0.95em;
  font-weight: 500;
}

.channels-box-right a {
  color: #fff;
  font-size: 0.95em;
  font-weight: 700;
}

.channels-box-right a svg {
  margin: 0 0 0 10px;
  width: 32px;
  height: 32px;
  color: #6c7388;
}

.channels-box::before {
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 330px;
  z-index: -1;
  position: absolute;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
  background: #1c212f;
}

.channels-box .square-arrows {
  margin: 20px 0 0;
}

.channels-mini {
  margin: 40px 0 0;
}

.channels-mini-box {
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
  background-color: #5f5887;
  background-image: linear-gradient(90deg, rgba(58, 53, 90, 0), #3a355a);
}

.channels-mini-box img {
  width: 60px;
}

.channels-mini-box a {
  padding: 35px;
  height: 90px;
}

.channels-detail-info {
  padding: 30px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
  background: #1c212f;
}

.channels-detail-info img {
  height: 30px;
}

.channels-detail-info span {
  color: #fff;
  font-size: 1.3em;
  font-weight: 700;
}

.channels-detail-stats ul {
  margin: 0 -30px;
}

.channels-detail-stats ul li {
  padding: 0 30px;
}

.channels-detail-stats ul li span {
  color: #fff;
  font-size: 1.3em;
  font-weight: 700;
  text-transform: uppercase;
}

.channels-detail-stats ul li p {
  margin: 5px 0 0;
  color: #6c7388;
  font-size: 0.75em;
  font-weight: 500;
  text-transform: uppercase;
}

.channels-detail-stats ul li:nth-child(n + 2)::before {
  content: "";
  top: 50%;
  left: 0;
  width: 1px;
  height: 20px;
  position: absolute;
  background: #3f485f;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
}

.channels-detail-movies {
  margin: 40px 0 0;
}

.channels-detail-movies ul {
  margin: -10px;
}

.channels-detail-movies ul li {
  padding: 10px;
}

.channels ul {
  margin: -10px;
}

.channels ul li {
  padding: 10px;
}

/* TRENDLER */
.noveltyHeader__plateBody {
  align-items: center;
  background-color: #1f1b2e;
  border-radius: 12px;
  display: flex;
  padding: 8px 0;
}

@media screen and (min-width: 272px) and (max-width: 599px) {
  .noveltyPromo__playerSection .playerBlock__wrapper {
    margin-left: -12px;
    margin-right: -12px;
  }

  .novelty__noveltyGallery .noveltyPromo {
    padding-bottom: 16px;
    padding-left: 8px;
    padding-right: 8px;
  }
}

@media screen and (max-width: 599px) {

  .noveltyPromo .noveltyPromo__headerAvailable,
  .noveltyPromo .noveltyPromo__headerInfoTextType,
  .noveltyPromo .noveltyPromo__playerSection,
  .noveltyPromo .noveltyPromo__priceBadge,
  .noveltyPromo .noveltyPromo__title {
    display: none;
  }

  .noveltyPromo .noveltyPromo__headerInfoPosterSection {
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    width: 100%;
  }

  .noveltyPromo .noveltyPromo__bodyInner {
    border-radius: 16px;
    padding: 4px 4px 16px;
  }

  .noveltyPromo .noveltyPromo__headerInfoPoster {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
  }

  .noveltyPromo .noveltyPromo__headerInfoTextSection {
    padding: 12px 12px 4px;
  }

  .noveltyPromo .noveltyPromo__headerInfoTextTitle {
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    color: #fff;
    display: block;
    display: -webkit-box;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-overflow: -o-ellipsis-lastline;
  }

  .noveltyPromo .noveltyPromo__headerAvailable,
  .noveltyPromo .noveltyPromo__headerInfoTextType,
  .noveltyPromo .noveltyPromo__playerSection,
  .noveltyPromo .noveltyPromo__priceBadge,
  .noveltyPromo .noveltyPromo__title {
    display: none;
  }

  .noveltyPromo .noveltyPromo__headerAvailable,
  .noveltyPromo .noveltyPromo__headerInfoTextType,
  .noveltyPromo .noveltyPromo__playerSection,
  .noveltyPromo .noveltyPromo__priceBadge,
  .noveltyPromo .noveltyPromo__title {
    display: none;
  }

  .playerBlock__areaWrapper {
    margin-left: -16px;
    margin-right: -16px;
  }

  .noveltyPromo .noveltyPromo__headerInfoPosterSection:before {
    content: "";
    display: block;
    padding-bottom: 56.4516129%;
  }

  .noveltyPromo .noveltyPromo__content {
    display: flex;
    flex-direction: column-reverse;
    padding-left: 12px;
    padding-right: 12px;
  }

  .noveltyPromo .noveltyPromo__infoSection {
    margin-top: 12px;
  }

  .noveltyPromo .noveltyPromo__meta {
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .noveltyPromo__metaRow .nbl-textBadge {
    align-items: center;
    border-radius: 4px 4px 4px 4px;
    box-sizing: border-box;
    display: inline-flex;
    height: 16px;
    padding: 2px 4px;
  }

  .noveltyPromo__metaRow .nbl-textBadge .nbl-textBadge__text {
    font-size: 10px;
    font-style: normal;
    font-weight: 500;
    height: 12px;
    letter-spacing: 0;
    line-height: 12px;
    margin-top: 0;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .noveltyPromo .noveltyPromo__footer {
    padding: 12px 12px 0;
  }

  .noveltyPromo .noveltyPromo__footer .nbl-button:not(:last-child) {
    margin-right: 12px;
  }

  .noveltyPromo .noveltyPromo__footer .noveltyPromo__nbl-button_share .nbl-button__primaryText,
  .noveltyPromo .noveltyPromo__footer .noveltyPromo__nbl-button_unavailable .nbl-button__primaryText {
    font-size: 0;
  }

  .nbl-segmentControl_size_penti {
    border-radius: 12px;
    padding: 4px;
  }

  #filterModal #popular-dropdown .ui.checkbox label,
  #filterModal #gender-dropdown .ui.checkbox label {
    padding: 0;
  }

  #popular-dropdown ul,
  #gender-dropdown ul {
    flex-wrap: inherit !important;
  }

  #filterModal #popular-dropdown,
  #filterModal #gender-dropdown {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
  }

  #filterModal .modal-body .filterContainer .filterContainer__content .filterContainer__content__item {
    flex-shrink: 0;
  }
}

@media screen and (min-width: 600px) {
  .novelty__noveltyHeader {
    padding-left: 12px;
    padding-right: 12px;
  }

  .noveltyHeader__plateBody {
    padding: 0 8px 0 0;
  }

  .novelty__noveltyGallery {
    padding-left: 12px;
    padding-right: 12px;
  }

  .novelty__noveltyGallery .noveltyPromo {
    padding-bottom: 24px;
    padding-left: 12px;
    padding-right: 12px;
  }

  .novelty__noveltyGallery_whatsnew {
    margin-top: 40px;
    padding-left: 0;
    padding-right: 0;
  }

  .novelty__noveltyGallery {
    padding-top: 0;
  }

  .novelty__noveltyGallery .noveltyPromo_type_full {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
  }

  .noveltyPromo_type_full .noveltyPromo__bodyInner {
    border-radius: 24px;
    padding: 24px;
  }

  .noveltyPromo_type_full .noveltyPromo__header {
    display: flex;
    justify-content: space-between;
    padding-bottom: 16px;
  }

  .noveltyPromo_type_full .noveltyPromo__headerAvailable,
  .noveltyPromo_type_full .noveltyPromo__headerInfo {
    align-items: center;
    display: flex;
  }

  .noveltyPromo_type_full .noveltyPromo__headerInfoPosterSection {
    border-radius: 8px;
    flex-shrink: 0;
    height: 65px;
    overflow: hidden;
    position: relative;
    width: 115px;
  }

  .noveltyPromo_type_full .noveltyPromo__headerInfoPosterSection:before {
    content: "";
    display: block;
    padding-bottom: 56.4516129%;
  }

  .noveltyPromo_type_full .noveltyPromo__headerInfoPoster {
    height: 65px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
  }

  .noveltyPromo_type_full .noveltyPromo__headerAvailableTextSection,
  .noveltyPromo_type_full .noveltyPromo__headerInfoTextSection {
    margin-left: 12px;
  }

  .noveltyPromo_type_full .noveltyPromo__headerInfoTextTitle {
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    color: #fff;
    display: block;
    display: -webkit-box;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    margin-bottom: 4px;
    overflow: hidden;
    padding-right: 20px;
    text-overflow: ellipsis;
    text-overflow: -o-ellipsis-lastline;
  }

  .noveltyPromo_type_full .noveltyPromo__headerAvailableTextType,
  .noveltyPromo_type_full .noveltyPromo__headerInfoTextType {
    color: hsla(0, 0%, 100%, 0.72);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
  }

  .playerBlock__nbl-button {
    width: 320px;
  }

  .playerBlock__nbl-ageBadge {
    bottom: 16px;
    left: 16px;
    position: absolute;
  }

  .noveltyPromo_type_full .noveltyPromo__content {
    padding-top: 24px;
  }

  .noveltyPromo_type_full .noveltyPromo__title {
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 36px;
    margin-bottom: 12px;
  }

  .noveltyPromo__metaRow .nbl-textBadge .nbl-textBadge__text {
    font-size: 13px;
    font-style: normal;
    font-weight: 500;
    height: 16px;
    letter-spacing: 0;
    line-height: 16px;
    margin-top: 0;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .noveltyPromo_type_full .noveltyPromo__meta {
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
  }

  .noveltyPromo_type_full .noveltyPromo__textSection {
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
  }

  .noveltyPromo_type_full .noveltyPromo__textSection .clause__text.is-truncated .clause__text-inner {
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    display: block;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    text-overflow: -o-ellipsis-lastline;
  }

  .noveltyPromo_type_full .noveltyPromo__footer {
    padding-top: 24px;
  }

  .noveltyPromo_type_full .noveltyPromo__footer .nbl-button:not(:last-child) {
    margin-right: 16px;
  }

  .noveltyPromo_type_full .noveltyPromo__footer .nbl-button:not(:last-child) {
    margin-right: 16px;
  }

  .noveltyPromo__metaRow .nbl-textBadge {
    align-items: center;
    border-radius: 4px 4px 4px 4px;
    box-sizing: border-box;
    display: inline-flex;
    height: 20px;
    padding: 2px 6px;
  }

  body:not(.touch) .noveltyPromo_type_compact {
    transition: z-index 0.4s 0.1s;
    z-index: 0;
  }

  .novelty__noveltyGallery .noveltyPromo_type_compact {
    padding-left: 12px;
    padding-right: 12px;
  }

  .novelty__noveltyGallery .noveltyPromo {
    padding-bottom: 24px;
    padding-left: 12px;
    padding-right: 12px;
  }

  body:not(.touch) .noveltyPromo_type_compact .noveltyPromo__body:before {
    content: "";
    display: block;
    padding-bottom: 95.3125%;
  }

  body:not(.touch) .noveltyPromo_type_compact .noveltyPromo__bodyInner {
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    transition: top 0.4s, left 0.4s, right 0.4s;
  }

  .noveltyPromo_type_compact .noveltyPromo__bodyInner {
    border-radius: 12px;
    padding: 4px 4px 24px;
    transform: translateZ(0);
  }

  body:not(.touch) .noveltyPromo_type_compact .noveltyPromo__headerInfoPosterSection {
    opacity: 1;
    transition: opacity 0.4s;
  }

  .noveltyPromo_type_compact .noveltyPromo__headerInfoPosterSection {
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    width: 100%;
  }

  .noveltyPromo_type_compact .noveltyPromo__headerInfoPosterSection:before {
    content: "";
    display: block;
    padding-bottom: 56.4516129%;
  }

  .noveltyPromo_type_compact .noveltyPromo__headerInfoPoster {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
  }

  body:not(.touch) .noveltyPromo_type_compact .noveltyPromo__headerInfoTextSection {
    box-sizing: border-box;
    height: 12px;
    opacity: 0;
    transform: translateY(-30px);
    transition: height 0.4s, opacity 0.4s, transform 0.4s;
  }

  .noveltyPromo_type_compact .noveltyPromo__headerInfoTextSection {
    padding: 12px 12px 4px;
  }

  .noveltyPromo_type_compact .noveltyPromo__headerInfoTextTitle {
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    color: #fff;
    display: block;
    display: -webkit-box;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-overflow: -o-ellipsis-lastline;
  }

  body:not(.touch) .noveltyPromo_type_compact .noveltyPromo__footer .noveltyPromo__nbl-button_share,
  body:not(.touch) .noveltyPromo_type_compact .noveltyPromo__footer .noveltyPromo__nbl-button_trailer,
  body:not(.touch) .noveltyPromo_type_compact .noveltyPromo__headerInfoTextType,
  body:not(.touch) .noveltyPromo_type_compact .noveltyPromo__metaRow .noveltyPromo__rating,
  body:not(.touch) .noveltyPromo_type_compact .noveltyPromo__title {
    display: none;
  }

  .noveltyPromo_type_compact .noveltyPromo__headerInfoTextType,
  .noveltyPromo_type_compact .noveltyPromo__textSection .clause__text .clause__toggle,
  .noveltyPromo_type_compact .noveltyPromo__title {
    display: none;
  }

  .noveltyPromo_type_compact .noveltyPromo__content {
    display: flex;
    flex-direction: column-reverse;
    padding: 0 12px;
  }

  body:not(.touch) .noveltyPromo_type_compact .noveltyPromo__infoSection {
    height: 0;
    margin-top: 0;
    opacity: 0;
    transform: translateY(-32px);
    transition: height 0.4s, opacity 0.4s, margin-top 0.4s, transform 0.4s;
  }

  .noveltyPromo_type_compact .noveltyPromo__infoSection {
    margin-top: 8px;
  }

  .noveltyPromo_type_compact .noveltyPromo__meta,
  .noveltyPromo_type_compact .noveltyPromo__priceBadge {
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
  }

  .noveltyPromo_type_compact .noveltyPromo__textSection {
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
  }

  body:not(.touch) .noveltyPromo_type_compact .noveltyPromo__textSection .clause {
    transition: width 0.4s;
    width: 100%;
  }

  .noveltyPromo_type_compact .noveltyPromo__textSection .clause__text {
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
  }

  body:not(.touch) .noveltyPromo_type_compact .noveltyPromo__footer {
    height: 0;
    opacity: 0;
    padding-top: 0;
    transition: opacity 0.4s, height 0.4s, padding-top 0.4s;
  }

  .noveltyPromo_type_compact .noveltyPromo__footer {
    padding-left: 12px;
    padding-right: 12px;
  }

  body:not(.touch) .noveltyPromo_type_compact:hover {
    transition: z-index 0.01s;
    z-index: 1;
  }

  body:not(.touch) .noveltyPromo_type_compact:hover .noveltyPromo__bodyInner {
    box-shadow: 0 32px 64px rgba(0, 0, 0, 0.56);
    left: -8px;
    right: -8px;
    top: -40px;
    transform: translateZ(0);
    transition: top 0.4s, left 0.4s, right 0.4s;
  }

  body:not(.touch) .noveltyPromo_type_compact:hover .noveltyPromo__headerInfoPosterSection {
    opacity: 0;
    transition: opacity 0.4s;
  }

  .noveltyPromo_type_compact .noveltyPromo__headerInfoPosterSection {
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    width: 100%;
  }

  body:not(.touch) .noveltyPromo_type_compact:hover .noveltyPromo__headerInfoTextSection {
    height: 36px;
    opacity: 1;
    transform: translate(0);
    transition: height 0.4s, opacity 0.4s, transform 0.4s;
  }

  .noveltyPromo_type_compact .noveltyPromo__headerInfoTextSection {
    padding: 12px 12px 4px;
  }

  body:not(.touch) .noveltyPromo_type_compact:hover .noveltyPromo__content {
    padding-top: 0;
  }

  .noveltyPromo_type_compact .noveltyPromo__content {
    display: flex;
    flex-direction: column-reverse;
    padding: 0 12px;
  }

  body:not(.touch) .noveltyPromo_type_compact:hover .noveltyPromo__infoSection {
    height: 36px;
    margin-top: 8px;
    opacity: 1;
    transform: translate(0);
    transition: height 0.4s, opacity 0.4s, margin-top 0.4s, transform 0.4s;
  }

  body:not(.touch) .noveltyPromo_type_compact:hover .noveltyPromo__textSection .clause {
    transition: width 0.4s;
    width: calc(100% - 16px);
  }

  body:not(.touch) .noveltyPromo_type_compact:hover .noveltyPromo__footer {
    height: 40px;
    opacity: 1;
    padding-top: 12px;
    transition: opacity 0.4s, height 0.4s, padding-top 0.4s;
  }
}

@media screen and (min-width: 600px) and (max-width: 879px) {
  .novelty__noveltyGallery .noveltyPromo_type_compact {
    width: 50%;
  }

  .noveltyHeader__plateBody {
    padding: 0 8px 0 0;
  }
}

@media screen and (min-width: 880px) {
  .noveltyPromo_type_full .noveltyPromo__content {
    display: grid;
    gap: 24px;
    grid-template-columns: 1fr 1fr;
  }

  .novelty__noveltyGallery .noveltyPromo_type_compact {
    width: 33.33333333%;
  }
}

@media screen and (min-width: 1160px) {
  .novelty__noveltyHeader {
    margin-left: 12.5%;
    width: 75%;
  }

  .novelty__noveltyGallery {
    margin-left: 12.5%;
    width: 75%;
  }

  .novelty__noveltyGallery .noveltyPromo_type_full {
    width: 100%;
  }
}

.noveltyHeader__mainPlate {
  margin-top: 16px;
}

.nbl-segmentControl_size_artis {
  border-radius: 20px;
  padding: 8px;
}

.nbl-segmentControl_size_penti {
  padding: 8px;
  border-radius: 20px;
}

.nbl-segmentControl_size_penti .nbl-segmentControl__item {
  border-radius: 8px;
  border-width: 0;
  box-sizing: border-box;
  height: 32px;
  padding: 8px 12px;
}

.nbl-segmentControl {
  display: flex;
  overflow: hidden;
}

.nbl-segmentControl_hasNativeScroll {
  overflow: auto;
}

.nbl-segmentControl_size_penti .nbl-segmentControl__item .nbl-segmentControlItem__caption {
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  height: 16px;
  line-height: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nbl-segmentControlItem:not(:hover):not(:active),
.nbl-segmentControlItem:not(:hover):not(:active) .nbl-segmentControlItem__caption,
body.touch .nbl-segmentControlItem:hover:not(:active),
body.touch .nbl-segmentControlItem:hover:not(:active) .nbl-segmentControlItem__caption {
  transition-duration: 0.4s;
}

.nbl-segmentControl .nbl-segmentControl__item {
  flex-shrink: 0;
}

.nbl-segmentControlItem_selected {
  background-image: linear-gradient(90deg, rgba(58, 53, 90, 0), #3a355a);
}

.nbl-segmentControlItem:not(:hover):not(:active) .nbl-segmentControlItem__caption,
.nbl-segmentControlItem_selected:not(:hover):not(:active) .nbl-segmentControlItem__caption,
body.touch .nbl-segmentControlItem:active .nbl-segmentControlItem__caption,
body.touch .nbl-segmentControlItem:hover:not(:active) .nbl-segmentControlItem__caption,
body.touch .nbl-segmentControlItem_selected:active .nbl-segmentControlItem__caption,
body.touch .nbl-segmentControlItem_selected:hover:not(:active) .nbl-segmentControlItem__caption,
body:not(.touch) .nbl-segmentControlItem:active .nbl-segmentControlItem__caption,
body:not(.touch) .nbl-segmentControlItem:hover:not(:active) .nbl-segmentControlItem__caption,
body:not(.touch) .nbl-segmentControlItem_selected:active .nbl-segmentControlItem__caption,
body:not(.touch) .nbl-segmentControlItem_selected:hover:not(:active) .nbl-segmentControlItem__caption {
  color: #fff;
}


.nbl-button_size_shinnok .nbl-button__iconWrapper {
  padding-top: 1px;
}

.nbl-button .nbl-button__iconWrapper,
.nbl-button .nbl-button__nbl-icon,
.nbl-button .nbl-button__nbl-picture {
  display: inline-block;
  position: relative;
  transition-property: opacity;
  vertical-align: top;
}

.nbl-segmentControl_size_artis .nbl-segmentControl__item .nbl-segmentControlItem__caption {
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  height: 20px;
  line-height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nbl-segmentControl_size_artis .nbl-segmentControl__item+.nbl-segmentControl__item {
  margin-left: 8px;
}

.nbl-segmentControl_size_artis .nbl-segmentControl__item {
  border-radius: 12px;
  border-width: 0;
  box-sizing: border-box;
  height: 40px;
  padding: 10px 16px;
}

.nbl-segmentControl .nbl-segmentControl__item {
  flex-shrink: 0;
}

.noveltyPromo__body {
  position: relative;
}

.noveltyPromo__bodyInner {
  background-color: #1f1b2e;
  box-sizing: border-box;
}

.playerBlock__area {
  box-sizing: content-box;
  height: 0;
  padding-bottom: 56.25%;
  position: relative;
}

.playerBlock__inner,
.playerBlock__wrapper {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.playerBlock__inner {
  overflow: hidden;
}

.noveltyPromo_type_full .noveltyPromo__playerSection .playerBlock__overlay,
.noveltyPromo_type_full .noveltyPromo__playerSection .playerBlock__video {
  border-radius: 16px;
}

.noveltyPromo__playerSection .playerBlock__video {
  -webkit-mask-image: -webkit-radial-gradient(#fff, #000);
  z-index: 1;
}

.playerBlock__video {
  height: 100%;
  overflow: hidden;
  position: relative;
  width: 100%;
}

.playerBlock__videoIframeWrapper {
  height: 100%;
  overflow: hidden;
  position: relative;
  width: 100%;
  z-index: 1;
}

.playerBlock__videoIframeWrapper {
  height: 100%;
  overflow: hidden;
  position: relative;
  width: 100%;
  z-index: 1;
}

.playerBlock__video .playerBlock__posterImg,
.playerBlock__video .playerBlock__previewImg,
.playerBlock__video .playerBlock__trailer {
  display: block;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
}

.playerBlock__video .playerBlock__posterImg,
.playerBlock__video .playerBlock__previewImg {
  min-height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
}

.noveltyPromo_type_full .noveltyPromo__playerSection .playerBlock__overlay,
.noveltyPromo_type_full .noveltyPromo__playerSection .playerBlock__video {
  border-radius: 16px;
}

.playerBlock__overlay {
  background-color: rgba(7, 5, 14, 0.4);
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.playerBlock__actionWrapper {
  align-items: center;
  display: flex;
  flex-direction: column;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}

.playerBlock__actionWrapper .details__actionsInner_mediumReservedSpace {
  min-height: 96px;
}

.playerBlock__actionWrapper .details__actionsInner {
  align-items: center;
  display: flex;
  flex-direction: column;
  text-align: center;
}

.playerBlock__nbl-button_playerMainAction.playerBlock__nbl-button:not(:active):not(:hover) {
  background-color: rgba(243, 7, 69, 0.8);
  border-color: transparent;
}

.nbl-button_style_kioshi.nbl-button:not(:hover):not(:active) {
  background-color: #db2424;
  border-color: #e42727;
}

.nbl-button_style_kioshi.nbl-button:not(:hover):not(:active) .nbl-button__primaryText {
  color: #fff;
}

.nbl-button_size_motaro .nbl-button__primaryText,
.nbl-button_size_motaro .nbl-button__primaryText .nbl-button__strikedText {
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}

.nbl-button .nbl-button__primaryText,
.nbl-button .nbl-button__secondaryText {
  display: block;
  transition-property: color;
  width: 100%;
}

.nbl-button_size_motaro .nbl-button__secondaryText {
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
}

.nbl-button_style_kioshi.nbl-button:not(:hover):not(:active) .nbl-button__secondaryText {
  color: hsla(0, 0%, 100%, 0.72);
}

.nbl-ageBadge_value_18 {
  background-image: url(https://solea-parent.dfs.ivi.ru/picture/ffffff!0.48,000000!0.48/age18.svg);
}

.nbl-ageBadge {
  height: 16px;
  width: 28px;
}

.noveltyPromo__title {
  color: #fff;
}

.noveltyPromo__metaRow> :not(:last-child) {
  margin-right: 8px;
}

.nbl-textBadge_isShadowEnabled_1.nbl-textBadge_style_dan {
  box-shadow: 0 4px 12px rgba(115, 163, 47, 0);
}

.nbl-textBadge_style_dan {
  -webkit-backdrop-filter: blur(0);
  backdrop-filter: blur(0);
  background-color: #73a32f;
}

.nbl-textBadge_style_dan .nbl-textBadge__nbl-icon:after,
.nbl-textBadge_style_dan .nbl-textBadge__nbl-icon:before,
.nbl-textBadge_style_dan .nbl-textBadge__text {
  color: #fff;
}

.noveltyPromo__meta {
  color: var(--color-dropdown-box-default);
}

.noveltyPromo__textSection,
.noveltyPromo__textSection .clause {
  color: #d9d7e0;
}

.noveltyPromo__footer {
  display: flex;
}

.novelty__noveltyGallery_whatsnew {
  display: flex;
  flex-wrap: wrap;
}

.novelty__noveltyHeader+.novelty__noveltyGallery {
  margin-top: 32px;
}

.nbl-segmentControl_size_artis .nbl-segmentControl__item {
  border-radius: 12px;
  border-width: 0;
  box-sizing: border-box;
  height: 40px;
  padding: 10px 16px;
}

.nbl-button_size_motaro {
  border-radius: 16px;
  border-width: 1px;
  height: 48px;
  padding: 5px 15px;
}

.playerBlock__note,
.playerBlock__remark {
  color: #fff;
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
  margin-top: 8px;
  text-align: center;
}

.noveltyPromo__bodyInner {
  background-color: #1f1b2e;
  box-sizing: border-box;
}

.noveltyPromo__headerInfoPosterSection {
  display: block;
  position: relative;
}

.noveltyPromo__trailerSection {
  box-sizing: border-box;
  left: 0;
  padding: 4px 4px 16px;
  position: absolute;
  top: 0;
  width: 100%;
}

.noveltyPromoTrailerBlock__area {
  box-sizing: content-box;
  height: 0;
  padding-bottom: 56.25%;
  position: relative;
}

.noveltyPromoTrailerBlock__inner,
.noveltyPromoTrailerBlock__wrapper {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.noveltyPromo_type_compact .noveltyPromoTrailerBlock__inner,
.noveltyPromo_type_compact .noveltyPromo__playerSection .playerBlock__overlay,
.noveltyPromo_type_compact .noveltyPromo__playerSection .playerBlock__video {
  border-radius: 12px;
}

.noveltyPromoTrailerBlock__inner {
  overflow: hidden;
  transform: translateZ(0);
}

.nbl-textBadge_isShadowEnabled_1.nbl-textBadge_style_shun {
  box-shadow: 0 4px 12px hsla(254, 9%, 52%, 0);
}

.nbl-textBadge_style_shun {
  -webkit-backdrop-filter: blur(0);
  backdrop-filter: blur(0);
  background-color: #7e798f;
}

.nbl-textBadge_size_huxa {
  align-items: center;
  border-radius: 4px 4px 4px 4px;
  box-sizing: border-box;
  display: inline-flex;
  height: 16px;
  padding: 2px 4px;
}

.nbl-textBadge_style_shun .nbl-textBadge__nbl-icon:after,
.nbl-textBadge_style_shun .nbl-textBadge__nbl-icon:before,
.nbl-textBadge_style_shun .nbl-textBadge__text {
  color: #fff;
}

.nbl-textBadge_size_huxa .nbl-textBadge__text {
  font-size: 10px;
  font-style: normal;
  font-weight: 500;
  height: 12px;
  letter-spacing: 0;
  line-height: 12px;
  margin-top: 0;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.noveltyPromo__metaRow+.noveltyPromo__metaRow {
  margin-top: 4px;
}

.noveltyPromo__metaRow> :not(:last-child) {
  margin-right: 8px;
}

.noveltyPromo_type_compact .noveltyPromo__meta {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}

.noveltyPromo__textSection,
.noveltyPromo__textSection .clause {
  color: #d9d7e0;
}

.noveltyPromo__footer {
  display: flex;
}

.noveltyPromo_type_compact .noveltyPromo__footer .nbl-button:not(:last-child) {
  margin-right: 8px;
}

.nbl-button_style_iekichi.nbl-button:not(:hover):not(:active) .nbl-button__primaryText {
  color: #fff;
}

.noveltyPromoTrailerBlock__bgVideo {
  border-radius: 8px;
  bottom: 0;
  left: 0;
  overflow: hidden;
  position: absolute;
  right: 0;
  top: 0;
}

.noveltyPromoTrailerBlock__videoPlayer {
  height: 102%;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
}

.noveltyPromoTrailerBlock__trailerLink {
  align-items: center;
  background-color: rgba(31, 27, 46, 0.56);
  border-radius: 4px;
  cursor: pointer;
  display: flex;
  height: 20px;
  justify-content: center;
  position: absolute;
  right: 8px;
  top: 8px;
  width: 20px;
}

.noveltyPromo__metaRow {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
}

.nbl-button_size_shinnok .nbl-button__nbl-iconSvg {
  height: 16px;
  width: 16px;
}
.noveltyPromoTrailerBlock__ratingTextBadge {
    bottom: 8px;
    position: absolute;
    right: 8px;
}

.top-search-box {
  width: 50%;
  margin:0 auto;
  padding:70px 0px;
  background-color: #000 ;
}
.top-search-box input {
  width: 100%;
  color: #000;
  padding: 15px 20px;
}


.main-search-drop {
  padding: 20px 0;
  top: 100%;
  left: 0;
  width: 100%;
  max-height: 480px;
  opacity: 0;
  z-index: 9999;
  overflow-y: auto;
  visibility: hidden;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
  background: #000;
  -webkit-transform: translate(0, -20px);
  -moz-transform: translate(0, -20px);
  -ms-transform: translate(0, -20px);
  -o-transform: translate(0, -20px);
  transform: translate(0, -20px);
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  -webkit-box-shadow: 3px 20px 20px 0 rgba(18, 22, 33, 0.4);
  -moz-box-shadow: 3px 20px 20px 0 rgba(18, 22, 33, 0.4);
  -ms-box-shadow: 3px 20px 20px 0 rgba(18, 22, 33, 0.4);
  -o-box-shadow: 3px 20px 20px 0 rgba(18, 22, 33, 0.4);
  box-shadow: 3px 20px 20px 0 rgba(18, 22, 33, 0.4);
}
.main-search-drop-box > span {
  margin: 0 0 10px;
  padding: 0 20px;
  color: #6c7388;
  text-transform: uppercase;
  font-size: 0.85em;
  font-weight: 500;
}
.main-search-drop-box > ul > li > a {
  padding: 10px 20px;
  -webkit-transition: background 0.3s ease-in-out;
  -moz-transition: background 0.3s ease-in-out;
  -ms-transition: background 0.3s ease-in-out;
  -o-transition: background 0.3s ease-in-out;
  transition: background 0.3s ease-in-out;
}
.main-search-drop-box > ul > li > a:hover {
  background: #293145;
}
.main-search-drop-box-icon svg {
  width: 22px;
  height: 22px;
  color: rgba(108, 115, 136, 0.3);
}


.main-search-drop {
  padding: 20px 0;
  top: 100%;
  left: 0;
  width: 100%;
  max-height: 480px;
  opacity: 0;
  z-index: 9999;
  overflow-y: auto;
  visibility: hidden;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
  background: #1c212f;
  -webkit-transform: translate(0, -20px);
  -moz-transform: translate(0, -20px);
  -ms-transform: translate(0, -20px);
  -o-transform: translate(0, -20px);
  transform: translate(0, -20px);
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  -webkit-box-shadow: 3px 20px 20px 0 rgba(18, 22, 33, 0.4);
  -moz-box-shadow: 3px 20px 20px 0 rgba(18, 22, 33, 0.4);
  -ms-box-shadow: 3px 20px 20px 0 rgba(18, 22, 33, 0.4);
  -o-box-shadow: 3px 20px 20px 0 rgba(18, 22, 33, 0.4);
  box-shadow: 3px 20px 20px 0 rgba(18, 22, 33, 0.4);
}
.main-search-drop-box > span {
  margin: 0 0 10px;
  padding: 0 20px;
  color: #6c7388;
  text-transform: uppercase;
  font-size: 0.85em;
  font-weight: 500;
}
.main-search-drop-box > ul > li > a {
  padding: 10px 20px;
  -webkit-transition: background 0.3s ease-in-out;
  -moz-transition: background 0.3s ease-in-out;
  -ms-transition: background 0.3s ease-in-out;
  -o-transition: background 0.3s ease-in-out;
  transition: background 0.3s ease-in-out;
}
.main-search-drop-box > ul > li > a:hover {
  background: #293145;
}
.main-search-drop-box-icon svg {
  width: 22px;
  height: 22px;
  color: rgba(108, 115, 136, 0.3);
}

.main-search-drop-box .user-medium-text > span {
  color: #fff;
  font-size: 0.95em;
  font-weight: 700;
}
.main-search-drop-box:nth-child(n+3) {
  margin: 20px 0 0;
  padding: 30px 0 0;
  border-top: 1px dashed rgba(63, 72, 95, 0.3);
}
.main-search-drop.active {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translate(0, 20px);
  -moz-transform: translate(0, 20px);
  -ms-transform: translate(0, 20px);
  -o-transform: translate(0, 20px);
  transform: translate(0, 20px);
}
.main-search-drop::-webkit-scrollbar {
  display: none;
}


.main-search-icon {
  top: 50%;
  left: 15px;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
}
.main-search-icon svg {
  width: 22px;
  height: 22px;
  color: #6c7388;
}
.main-search-movie-box-image img {
  width: 50px;
  height: 50px;
  object-fit: cover;
  object-position: top;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border-radius: 8px;
}
.main-search-movie-box-text {
  margin: 0 0 0 10px;
}
.main-search-movie-box-text > span {
  color: #fff;
  font-size: 0.95em;
  font-weight: 700;
}
.main-search-movie-box-text ul {
  margin: 5px -10px 0;
}
.main-search-movie-box-text ul li {
  padding: 0 10px;
}
.main-search-movie-box-text ul li > span {
  color: #6c7388;
  font-size: 0.85em;
  font-weight: 500;
}
.main-search-movie-box-text ul li p {
  color: #6c7388;
  font-size: 0.85em;
  font-weight: 500;
}
.main-search-movie-box-text ul li p a {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.main-search-movie-box-text ul li p a:hover {
  color: #4ff461;
}
.main-search-movie-box-text ul li:nth-child(n+2)::before {
  content: "•";
  left: -3px;
  position: absolute;
  color: #6c7388;
  font-size: 0.85em;
  font-weight: 500;
}



.checkbox label {
  cursor: pointer
}

.checkbox label input:checked+.checkbox-icon {
  background: #e90042 
}

.checkbox label input:checked+.checkbox-icon::before {
  opacity: 1
}

.checkbox-icon {
  width: 16px;
  height: 16px;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  -ms-border-radius: 100%;
  -o-border-radius: 100%;
  border-radius: 100%;
  background: #252833;
  -webkit-transition: background .2s ease-in-out;
  -moz-transition: background .2s ease-in-out;
  -ms-transition: background .2s ease-in-out;
  -o-transition: background .2s ease-in-out;
  transition: background .2s ease-in-out
}

.checkbox-icon::before {
  content: '';
  width: 8px;
  height: 8px;
  opacity: 0;
  -webkit-border-radius: inherit;
  -moz-border-radius: inherit;
  -ms-border-radius: inherit;
  -o-border-radius: inherit;
  border-radius: inherit;
  background: #e984a0;
  -webkit-transition: opacity .2s ease-in-out;
  -moz-transition: opacity .2s ease-in-out;
  -ms-transition: opacity .2s ease-in-out;
  -o-transition: opacity .2s ease-in-out;
  transition: opacity .2s ease-in-out
}

.checkbox-text {
  margin: 0 0 0 10px;
  color: #9b9dab;
  font-size: .75em;
  font-weight: 400
}


.comment-spoiler img,
.comment-spoiler .comment-review-box-subject {
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -ms-filter: blur(5px);
  -o-filter: blur(5px);
  filter: blur(5px)
}

.comment-spoiler-2 {
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -ms-filter: blur(5px);
  -o-filter: blur(5px);
  filter: blur(5px);
  padding: 20px
}

.comment-spoiler-content {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(69, 36, 36, 0.2)
}

.comment-spoiler-content button {
  padding: 15px;
  color: #14151d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  background: #fff;
  font-size: .8125em;
  font-weight: 400
}
.comment-review-box-reply-list {
  margin: 10px 0 0
}

.comment-review-box-reply-form {
  display: none
}

.comment-review-box-reply-form form input {
  padding: 9px;
  width: 100%;
  outline: 0;
  color: #9b9dab;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  background: #111216;
  font-size: .8125em;
  font-weight: 400;
  border: 1px solid #1e2029
}

.comment-review-box-reply-form form input::placeholder {
  color: #fff
}

.comment-review-box-reply-form form button {
  margin: 0 0 0 5px;
  padding: 8px 15px;
  color: #fff;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  text-transform: uppercase;
  font-size: .75em;
  font-weight: 400;
  background: #e90042;
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out
}

.comment-review-box-reply-form form button:hover {
  color: #fff;
  background: #db0c46
}
.comment-reply-list {
  border-radius: 16px;
  margin-top: 20px;
  padding: 20px 0px;
    background-color: rgb(0 0 0 / 27%);
}
.comment-reply-list .comment-item {
  padding: 20px 20px;
  margin:0;
  border-radius: 0;
  border-bottom: 1px solid #ffffff14;
  background-color: transparent;
}
.comment-reply-list .comment-item:first-child {
  padding-top: 0;
}
.comment-reply-list .comment-item:last-child {
  padding-bottom: 0;
  margin-top: 0;
  border:0;
}
.reply-comment {
  font-size: 13px;
  color: #aaa;
}


.bg-badge {
  background-color: #2B2B2B;
}

/* Placeholder Image Styles */
.image-container {
  position: relative;
  overflow: hidden;
}

.placeholder-image {
  background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
  border: 2px solid #333;
  border-radius: 8px;
  transition: all 0.3s ease;
}

.placeholder-image:hover {
  background: linear-gradient(135deg, #2d2d2d 0%, #404040 100%);
  border-color: #555;
}

.placeholder-image svg {
  opacity: 0.6;
  transition: opacity 0.3s ease;
}

.placeholder-image:hover svg {
  opacity: 0.8;
}

/* Episode card placeholder */
.episode-card .placeholder-image {
  min-height: 130px;
  border-radius: 12px;
}

/* Movie card placeholder */
.movie-list-card .placeholder-image {
  min-height: 300px;
  border-radius: 8px;
}

/* Cast card placeholder */
.cast-box .placeholder-image {
  border-radius: 12px;
  position: absolute;
  top: 0;
  left: 0;
}

/* Cast detail placeholder */
.personHeader__nbl-poster .placeholder-image {
  border-radius: 8px;
  max-width: 300px;
  max-height: 450px;
  aspect-ratio: 2/3;
}

/* Filmography placeholder */
.personFilmographyItem .placeholder-image {
  border-radius: 6px;
}

.filmography-placeholder {
  width: 100%;
  height: 100%;
  min-height: 120px;
  max-height: 180px;
  aspect-ratio: 2/3;
  position: absolute;
  top: 0;
  left: 0;
}

/* Search Page Back Button */
.back-button {
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.back-button:hover {
  transform: translateY(-1px);
  border-color: rgba(255, 255, 255, 0.2);
}

.back-button:active {
  transform: translateY(0);
}

/* Seri Filmler Widget - Minimal */
.series-widget {
  background: rgba(31, 27, 46, 0.6);
  border-radius: 8px;
  padding: 20px;
  margin: 24px 0;
  border: 1px solid rgba(255, 255, 255, 0.08);
  transition: all 0.2s ease;
  backdrop-filter: blur(10px);
}

.series-widget:hover {
  border-color: rgba(255, 255, 255, 0.15);
  background: rgba(31, 27, 46, 0.8);
}

.series-widget-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.series-widget-icon {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 6px;
  padding: 8px;
  color: rgba(255, 255, 255, 0.8);
  display: flex;
  align-items: center;
  justify-content: center;
}

.series-widget-title h3 {
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  margin: 0 0 2px 0;
}

.series-widget-title p {
  color: rgba(255, 255, 255, 0.6);
  font-size: 13px;
  margin: 0;
}

.series-widget-content {
  display: flex;
  gap: 16px;
  align-items: center;
}

.series-widget-posters {
  flex-shrink: 0;
  position: relative;
  width: 100px;
  height: 150px;
}

.series-poster-card {
  position: absolute;
  top: 0;
  left: 0;
  width: 100px;
  height: 150px;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  transition: all 0.3s ease;
  border: 2px solid rgba(255, 255, 255, 0.1);
}

.series-poster-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.series-widget:hover .series-poster-card:nth-child(1) {
  transform: translateX(0) translateY(0) rotate(0deg) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

.series-widget:hover .series-poster-card:nth-child(2) {
  transform: translateX(15px) translateY(0) rotate(2deg) !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
}

.series-widget:hover .series-poster-card:nth-child(3) {
  transform: translateX(30px) translateY(0) rotate(4deg) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
}

.series-widget-info {
  flex: 1;
  transition: transform 0.3s ease;
}

.series-widget:hover .series-widget-info {
  transform: translateX(40px);
}

.series-widget-info h4 {
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  margin: 0 0 8px 0;
}

.series-widget-description {
  color: rgba(255, 255, 255, 0.7);
  font-size: 13px;
  line-height: 1.4;
  margin: 0 0 12px 0;
}

.series-widget-features {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
}

.feature-badge {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  padding: 4px 8px;
  display: flex;
  align-items: center;
  gap: 4px;
  color: rgba(255, 255, 255, 0.7);
  font-size: 11px;
  font-weight: 400;
}

.feature-badge svg {
  color: rgba(255, 255, 255, 0.6);
  width: 12px;
  height: 12px;
}

.series-widget-button {
  background: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.9);
  text-decoration: none;
  padding: 8px 16px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 500;
  font-size: 13px;
  transition: all 0.2s ease;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.series-widget-button:hover {
  background: rgba(255, 255, 255, 0.15);
  border-color: rgba(255, 255, 255, 0.2);
  color: white;
  text-decoration: none;
}

.series-widget-button svg {
  transition: transform 0.2s ease;
  width: 14px;
  height: 14px;
}

.series-widget-button:hover svg {
  transform: translateX(1px);
}

@media (max-width: 768px) {
  .series-widget-content {
    flex-direction: column;
    text-align: center;
  }
  
  .series-widget-posters {
    width: 80px;
    height: 120px;
    margin-bottom: 16px;
  }
  
  .series-poster-card {
    width: 80px;
    height: 120px;
  }
  
  /* Mobilde posterler her zaman açık yelpaze şeklinde */
  .series-poster-card:nth-child(1) {
    transform: translateX(-8px) translateY(0) rotate(-2deg) !important;
  }
  
  .series-poster-card:nth-child(2) {
    transform: translateX(0) translateY(0) rotate(0deg) !important;
  }
  
  .series-poster-card:nth-child(3) {
    transform: translateX(8px) translateY(0) rotate(2deg) !important;
  }
  
  /* Mobilde hover efektlerini kapat */
  .series-widget:hover .series-poster-card:nth-child(1),
  .series-widget:hover .series-poster-card:nth-child(2),
  .series-widget:hover .series-poster-card:nth-child(3) {
    transform: inherit !important;
  }
  
  .series-widget:hover .series-widget-info {
    transform: none;
  }
  
  .series-widget-features {
    justify-content: center;
  }
}
