/* NL series page overrides - mini-poster, posters grid, sidebar */
.breadcrumb-container {
    margin-bottom: 0.5rem;
    display: flex;
    justify-content: space-between;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    --tw-bg-opacity: 1;
    background-color: rgb(209 213 219 / var(--tw-bg-opacity));
}
.breadcrumb-container:where(.dark, .dark *) {
    background-color: rgb(63 63 70 / 0.2);
}
.posters-4-col {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}
@media not all and (min-width: 768px) {
    .posters-4-col {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
.poster {
    position: relative;
    border-radius: 0.75rem;
    --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}
.poster:hover {
    --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.poster img {
    aspect-ratio: 9 / 13.5;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition-property: transform;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}
.poster-wrapper {
    position: relative;
    overflow: hidden;
    border-radius: 0.75rem;
}
.poster svg {
    width: 1rem;
    height: 1rem;
    fill: currentColor;
}
.poster-content {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 0.75rem;
    background-image: linear-gradient(to top, var(--tw-gradient-stops));
    --tw-gradient-from: rgb(31 41 55 / 0.8) var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(31 41 55 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
    --tw-gradient-from-position: 0%;
    --tw-gradient-to: rgb(17 24 39 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), rgb(17 24 39 / 0.7) var(--tw-gradient-via-position), var(--tw-gradient-to);
    --tw-gradient-via-position: 30%;
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity));
}
.poster-content:where(.dark, .dark *) {
    --tw-gradient-from: rgb(0 0 0 / 0.9) var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
    --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), rgb(0 0 0 / 0.6) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.poster-content span {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    line-height: 1rem;
    color: rgb(255 255 255 / 0.7);
}
.poster-content .poster-lang {
    min-width: 0px;
    flex-shrink: 0;
}
.poster-content .poster-lang span {
    display: block;
    min-width: 0px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.poster-content .poster-info {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.poster-content .poster-info .poster-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 700;
}
@media not all and (min-width: 768px) {
    .poster-content .poster-info .poster-title {
        font-size: 0.875rem;
        line-height: 1.25rem;
    }
}
.poster-content .poster-meta {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.poster-content .poster-meta span svg {
    width: 0.75rem;
    height: 0.75rem;
}
.poster-content .poster-meta .imdb {
    --tw-text-opacity: 1;
    color: rgb(234 179 8 / var(--tw-text-opacity));
}
.poster:hover img {
    --tw-scale-x: 1.05;
    --tw-scale-y: 1.05;
    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));
}
.mini-poster {
    display: flex;
    gap: 0.75rem;
    border-radius: 0.75rem;
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 246 / var(--tw-bg-opacity));
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}
.mini-poster:where(.dark, .dark *) {
    --tw-bg-opacity: 1;
    background-color: rgb(24 24 27 / var(--tw-bg-opacity));
}
.mini-poster.without-image {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-inline-start: 1rem;
}
.mini-poster:has(.mini-poster-episode-info) img {
    width: 5rem;
    height: 5rem;
}
.mini-poster img {
    width: 3.5rem;
    height: 3.5rem;
    min-width: 3.5rem;
    border-top-left-radius: 0.75rem;
    border-bottom-left-radius: 0.75rem;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: top;
    object-position: top;
}
.mini-poster .mini-poster-content {
    display: flex;
    min-width: 0px;
    flex: 1 1 0%;
    flex-direction: column;
    justify-content: center;
    gap: 0.25rem;
}
.mini-poster .mini-poster-content .mini-poster-title {
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-inline-end: 0.5rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 700;
    --tw-text-opacity: 1;
    color: rgb(55 65 81 / var(--tw-text-opacity));
}
.mini-poster .mini-poster-content .mini-poster-title:where(.dark, .dark *) {
    --tw-text-opacity: 1;
    color: rgb(212 212 216 / var(--tw-text-opacity));
}
.mini-poster .mini-poster-content .mini-poster-episode-info {
    padding-inline-end: 1rem;
    font-size: 0.75rem;
    line-height: 1rem;
    --tw-text-opacity: 1;
    color: rgb(75 85 99 / var(--tw-text-opacity));
}
.mini-poster .mini-poster-content .mini-poster-episode-info:where(.dark, .dark *) {
    --tw-text-opacity: 1;
    color: rgb(161 161 170 / var(--tw-text-opacity));
}
.mini-poster .mini-poster-content .mini-poster-meta {
    padding-inline-end: 1rem;
    font-size: 0.75rem;
    line-height: 1rem;
    --tw-text-opacity: 1;
    color: rgb(156 163 175 / var(--tw-text-opacity));
}
.mini-poster .mini-poster-content .mini-poster-meta:where(.dark, .dark *) {
    --tw-text-opacity: 1;
    color: rgb(212 212 216 / var(--tw-text-opacity));
}
.mini-poster .mini-poster-content .mini-poster-meta {
    display: flex;
    min-width: 0px;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}
.mini-poster .mini-poster-content .mini-poster-meta svg {
    width: 1rem;
    height: 1rem;
    min-width: 1rem;
    fill: #a1a1aa;
}
.mini-poster .mini-poster-content .mini-poster-meta span {
    display: flex;
    min-width: 0px;
    align-items: center;
    gap: 0.25rem;
}
.mini-poster .mini-poster-content .mini-poster-meta span.mini-poster-lang {
    display: block;
    min-width: 0px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.mini-poster:hover {
    --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    --tw-shadow-color: #d1d5db;
    --tw-shadow: var(--tw-shadow-colored);
}
.mini-poster:hover:where(.dark, .dark *) {
    --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    --tw-shadow-color: rgb(24 24 27 / 0.5);
    --tw-shadow: var(--tw-shadow-colored);
}
.mini-poster:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 246 / var(--tw-bg-opacity));
}
.mini-poster:hover:where(.dark, .dark *) {
    --tw-bg-opacity: 1;
    background-color: rgb(9 9 11 / var(--tw-bg-opacity));
}
.mini-poster:hover .mini-poster-title {
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity));
}
.mini-poster:hover .mini-poster-title:where(.dark, .dark *) {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity));
}
.mini-poster[data-active="1"] {
    position: relative;
    cursor: default;
    --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.mini-poster[data-active="1"]:where(.dark, .dark *) {
    --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.mini-poster[data-active="1"] {
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 246 / var(--tw-bg-opacity));
}
.mini-poster[data-active="1"]:where(.dark, .dark *) {
    --tw-bg-opacity: 1;
    background-color: rgb(9 9 11 / var(--tw-bg-opacity));
}
.mini-poster[data-active="1"] .mini-poster-content {
    padding-inline-start: 0.25rem;
}
.mini-poster[data-active="1"] .mini-poster-content .mini-poster-title {
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity));
}
.mini-poster[data-active="1"] .mini-poster-content .mini-poster-title:where(.dark, .dark *) {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity));
}
.mini-poster[data-active="1"]:before {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    width: 0.5rem;
    border-top-left-radius: 0.75rem;
    border-bottom-left-radius: 0.75rem;
    --tw-bg-opacity: 1;
    background-color: rgb(239 68 68 / var(--tw-bg-opacity));
}
.mini-poster[data-active="1"]:where(.dark, .dark *):before {
    --tw-bg-opacity: 1;
    background-color: rgb(220 38 38 / var(--tw-bg-opacity));
}
.mini-poster[data-active="1"]:before {
    --tw-content: "";
    content: var(--tw-content);
}
.mini-poster:active {
    --tw-scale-x: .95;
    --tw-scale-y: .95;
    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));
}
.sidebar {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}
.sidebar .list-of-poster-wrapper {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.sidebar .nav {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 0.5rem;
}
.sidebar .nav.two-column {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.sidebar .nav .nav-link {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.875rem;
    line-height: 1.25rem;
    border-radius: 0.5rem;
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 246 / var(--tw-bg-opacity));
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    --tw-text-opacity: 1;
    color: rgb(31 41 55 / var(--tw-text-opacity));
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}
.sidebar .nav .nav-link:where(.dark, .dark *) {
    --tw-bg-opacity: 1;
    background-color: rgb(24 24 27 / var(--tw-bg-opacity));
    --tw-text-opacity: 1;
    color: rgb(212 212 216 / var(--tw-text-opacity));
}
.sidebar .nav .nav-link:hover {
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity));
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.sidebar .nav .nav-link:hover:where(.dark, .dark *) {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity));
    --tw-bg-opacity: 1;
    background-color: rgb(9 9 11 / var(--tw-bg-opacity));
}
.sidebar .nav .nav-link svg {
    margin-inline-end: 0.5rem;
    display: inline-flex;
    width: 1.25rem;
    height: 1.25rem;
    fill: #a1a1aa;
}
@media not all and (min-width: 768px) {
    .column-end:has(.sidebar) {
        display: none;
    }
    .column-end .sidebar {
        display: none;
    }
}


/* Seasons tabs */
.seasons .section-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}
.seasons .section-tab{padding:.5rem 1.1rem;border-radius:.5rem;background:rgb(243 244 246);font-size:.875rem;line-height:1.25rem;font-weight:600;color:rgb(55 65 81);border:none;cursor:pointer;transition-property:all;transition-duration:150ms}
.dark .seasons .section-tab{background:rgb(24 24 27);color:rgb(212 212 216)}
.seasons .section-tab:hover{background:rgb(229 231 235)}
.dark .seasons .section-tab:hover{background:rgb(39 39 42)}
.seasons .section-tab[data-active="1"]{background:rgb(220 38 38);color:rgb(255 255 255)}
.dark .seasons .section-tab[data-active="1"]{background:rgb(185 28 28);color:rgb(255 255 255)}
.seasons .seasons-tabs-wrapper{display:block}
.seasons .seasons-tab-content{display:none;flex-direction:column;gap:.5rem}
.seasons .seasons-tab-content[data-active="1"]{display:flex}


/* Other episodes scroll list */
.episodes-scroll{max-height:34rem;overflow-y:auto;padding-right:.25rem}
.episodes-scroll::-webkit-scrollbar{width:6px}
.episodes-scroll::-webkit-scrollbar-thumb{background:#3f3f46;border-radius:3px}
