html {
margin-top: 0 !important;
scroll-behavior: smooth;
}
body {
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* Offload card hover and transition animations to GPU for ultra-fluid 60fps interaction */
.item_loop_post,
.btn_single,
.dropdown_filmkio,
.bgcover,
.image_owl_home img {
will-change: transform, opacity;
backface-visibility: hidden;
-webkit-backface-visibility: hidden;
transform: translate3d(0, 0, 0);
-webkit-transform: translate3d(0, 0, 0);
}
/* Prevent layout shift and stacked raw items on initial load before Owl Carousel boots */
.filmkio_home_slider .home_owl_slider:not(.owl-loaded) {
display: flex !important;
flex-wrap: nowrap !important;
overflow: hidden !important;
opacity: 0.1;
max-height: 480px;
}
.filmkio_home_slider .home_owl_slider:not(.owl-loaded)>* {
flex: 0 0 160px !important;
margin-left: 16px !important;
display: inline-block !important;
}
/* Smooth fade-in animation once Owl Carousel is fully loaded */
.filmkio_home_slider .home_owl_slider.owl-loaded {
animation: fkFadeIn 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
opacity: 0;
}
@keyframes fkFadeIn {
from {
opacity: 0;
transform: translateY(12px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
/* Premium Micro-Animations and Smooth Transitions for Interactive Elements */
.item_loop_post {
transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.item_loop_post:hover {
transform: translateY(-8px) scale(1.03) translate3d(0, 0, 0) !important;
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.5) !important;
z-index: 10;
}
.btn_single {
transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.3s ease, box-shadow 0.3s ease !important;
}
.btn_single:hover {
transform: translateY(-2px) scale(1.02) !important;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) !important;
}
.btn_single:active {
transform: translateY(0) scale(0.97) !important;
}
/* Smooth search dropdown transitions */
.adv_options_search .dropdown_body {
opacity: 0;
transform: translateY(10px) scale(0.95);
transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), transform 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
pointer-events: none;
display: block !important;
visibility: hidden;
}
.adv_options_search .dropdown_filmkio.open .dropdown_body,
.adv_options_search .dropdown_filmkio.active .dropdown_body,
.adv_options_search .dropdown_filmkio:hover .dropdown_body {
opacity: 1 !important;
transform: translateY(0) scale(1) !important;
pointer-events: auto !important;
visibility: visible !important;
}
/* Stacking context fixes: ensure open dropdown is always elevated above sibling elements */
.dropdown_filmkio.open,
.dropdown_filmkio.active {
z-index: 10000 !important;
}
/* Stack rows in descending order to prevent lower rows from rendering on top of absolute dropdowns of upper rows */
.adv_options_search .content_row .row,
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row {
position: relative !important;
}
.adv_options_search .content_row .row:nth-child(1),
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row:nth-child(1) { z-index: 5 !important; }
.adv_options_search .content_row .row:nth-child(2),
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row:nth-child(2) { z-index: 4 !important; }
.adv_options_search .content_row .row:nth-child(3),
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row:nth-child(3) { z-index: 3 !important; }
.adv_options_search .content_row .row:nth-child(4),
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row:nth-child(4) { z-index: 2 !important; }
.adv_options_search .content_row .row:nth-child(5),
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row:nth-child(5) { z-index: 1 !important; }
/* Smooth dynamic scaling for the Membership Gate Modal */
.membership-gate-modal {
transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.membership-gate-modal .membership-gate-modal__card {
transform: scale(0.9) translateY(20px);
opacity: 0;
transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.membership-gate-modal.is-active .membership-gate-modal__card {
transform: scale(1) translateY(0) !important;
opacity: 1 !important;
}
* html body {
margin-top: 0 !important;
}
#wpadminbar {
display: none !important;
visibility: hidden !important;
}
body.admin-bar .filmkio_header {
top: 0 !important;
}
/* Subscription payment status banners */
.filmkio_dashboard .home_dashboard .subscription_status_banner {
border-radius: 14px;
border: 1px solid transparent;
margin-bottom: 12px;
padding: 14px 16px;
}
.filmkio_dashboard .home_dashboard .subscription_status_banner p {
font-weight: 700;
line-height: 1.8;
}
.filmkio_dashboard .home_dashboard .subscription_status_banner a,
.filmkio_dashboard .home_dashboard .subscription_status_banner .btn_close_success_banner {
border-radius: 10px;
font-weight: 700;
}
.filmkio_dashboard .home_dashboard .subscription_status_banner--active {
background: rgba(37, 173, 96, 0.16);
border-color: rgba(37, 173, 96, 0.45);
box-shadow: 0 8px 20px rgba(37, 173, 96, 0.2);
}
.filmkio_dashboard .home_dashboard .subscription_status_banner--failed {
background: rgba(218, 78, 78, 0.16);
border-color: rgba(218, 78, 78, 0.45);
box-shadow: 0 8px 20px rgba(218, 78, 78, 0.18);
}
.filmkio_dashboard .home_dashboard .subscription_status_banner--cancelled {
background: rgba(245, 173, 17, 0.16);
border-color: rgba(245, 173, 17, 0.45);
box-shadow: 0 8px 20px rgba(245, 173, 17, 0.18);
}
.filmkio_dashboard .home_dashboard .subscription_status_banner--default {
background: rgba(96, 112, 130, 0.14);
border-color: rgba(96, 112, 130, 0.38);
}
/* Standardized play/download gate message */
.tamasha-gate-message {
background: rgba(245, 173, 17, 0.11);
border: 1px solid rgba(245, 173, 17, 0.4);
border-radius: 12px;
margin-top: 14px;
padding: 12px 14px;
}
.tamasha-gate-message--warning {
margin-top: 10px;
}
.tamasha-gate-message--info {
background: rgba(96, 165, 250, 0.1);
border-color: rgba(96, 165, 250, 0.35);
}
.tamasha-gate-message--info p {
font-weight: 600;
line-height: 1.7;
margin: 0;
}
.tamasha-episode-notice {
margin-bottom: 14px;
}
.tamasha-episode-notice--inline {
flex-basis: 100%;
margin-top: 4px;
}
.single_btns .tamasha-episode-notice--inline {
width: 100%;
}
.episodes_selection_page .tamasha-episode-notice {
margin: 0 0 16px;
padding: 12px 16px;
}
.tamasha-gate-message p {
color: #f3f3f3;
font-weight: 700;
margin: 0 0 8px;
}
.tamasha-gate-message a {
color: #f5ad11;
font-weight: 800;
text-decoration: none;
}
.btn_play_online.is-gated,
.btnlinkrow.is-gated,
.linkst.is-gated {
opacity: 0.9;
}
/* Keep archive cards stable after AJAX re-render */
.main_archive .loop_archive_site .item_loop_post .bgcover img {
display: block;
height: 100%;
object-fit: cover;
width: 100%;
}
/* Canonical series archive grid (single source of truth) */
/* Force container to stack vertically on archive pages to prevent grid/pagination side-by-side collision */
.main_archive .container {
flex-direction: column !important;
flex-wrap: wrap !important;
}
/* Unified Grid Layout (Series & Movies) - High Specificity to avoid conflicts */
body .main_archive .latest_movies .body.loop_archive_site {
align-items: flex-start !important;
display: flex !important;
flex-wrap: wrap !important;
justify-content: flex-start !important;
margin: 20px -15px 20px 0 !important;
width: calc(100% + 15px) !important;
}
/* Hardened Archive Grid System */
body .main_archive .loop_archive_site {
display: flex !important;
flex-wrap: wrap !important;
gap: 30px 20px !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
}
body .main_archive .item_loop_post {
flex: 0 0 calc(16.66667% - 16.66667px) !important;
width: calc(16.66667% - 16.66667px) !important;
margin: 0 !important;
box-sizing: border-box !important;
flex-shrink: 0 !important;
position: relative !important;
}
body .main_archive .item_loop_post:hover {
z-index: 12 !important;
}
body .main_archive .item_loop_post .inner_loop_post,
body .main_archive .item_loop_post .bgcover {
width: 100% !important;
}
body .main_archive .item_loop_post .bgcover {
border-radius: 12px !important;
display: block !important;
height: 400px !important;
overflow: hidden !important;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
transition: all 0.3s ease !important;
}
.main_archive .item_loop_post .bgcover img {
border-radius: 12px;
display: block;
height: 100%;
object-fit: cover;
width: 100%;
}
.main_archive .item_loop_post h2 a {
direction: ltr;
display: block;
font-size: 1.05rem;
font-weight: 600;
overflow: hidden;
text-align: center;
text-overflow: ellipsis;
white-space: nowrap;
margin-top: 12px;
color: #f2f2f2;
transition: color 0.3s ease;
}
/* Responsive Breakpoints */
@media screen and (max-width: 1400px) {
body .main_archive .item_loop_post {
flex: 0 0 calc(20% - 16px) !important;
width: calc(20% - 16px) !important;
}
}
@media screen and (max-width: 1200px) {
body .main_archive .item_loop_post {
flex: 0 0 calc(25% - 15px) !important;
width: calc(25% - 15px) !important;
}
body .main_archive .item_loop_post .bgcover {
height: 350px !important;
}
}
@media screen and (max-width: 992px) {
body .main_archive .item_loop_post {
flex: 0 0 calc(33.33333% - 13.33333px) !important;
width: calc(33.33333% - 13.33333px) !important;
}
body .main_archive .item_loop_post .bgcover {
height: 320px !important;
}
}
@media screen and (max-width: 768px) {
body .main_archive .item_loop_post {
flex: 0 0 calc(50% - 10px) !important;
width: calc(50% - 10px) !important;
}
body .main_archive .item_loop_post .bgcover {
height: 300px !important;
}
}
.filmkio_header .left_side_header .left_btn_header.btn_light_dark_mode,
.filmkio_header .left_side_header .left_btn_header.btn_login_user,
.filmkio_header .left_side_header .left_btn_header.btn_search_header {
align-items: center;
background: rgba(0, 0, 0, 0.1);
border: 1px solid rgba(150, 150, 150, 0.1);
border-radius: 13px;
cursor: pointer;
display: inline-flex;
height: 43px;
justify-content: center;
line-height: 43px;
margin-right: 10px;
transition: all 0.3s ease;
width: 43px;
}
.filmkio_header .left_side_header .left_btn_header.btn_light_dark_mode:hover,
.filmkio_header .left_side_header .left_btn_header.btn_login_user:hover,
.filmkio_header .left_side_header .left_btn_header.btn_search_header:hover {
border-color: rgba(245, 173, 17, 0.7);
}
.filmkio_header .left_side_header .left_btn_header.btn_light_dark_mode .icon,
.filmkio_header .left_side_header .left_btn_header.btn_login_user .icon,
.filmkio_header .left_side_header .left_btn_header.btn_search_header .icon {
transition: 0.25s ease;
}
.filmkio_header .left_side_header .left_btn_header.btn_light_dark_mode:hover .icon,
.filmkio_header .left_side_header .left_btn_header.btn_login_user:hover .icon,
.filmkio_header .left_side_header .left_btn_header.btn_search_header:hover .icon {
transform: scale(1.06);
}
/* Keep dashboard menu/search isolated from homepage header interactions */
.filmkio_dashboard .left_side_head_dashboard .left_side_header.search-active .left_btn_header {
opacity: 1 !important;
transform: none !important;
visibility: visible !important;
}
.filmkio_dashboard .left_side_head_dashboard .menu_head_holder ul {
align-items: center;
display: flex;
gap: 10px;
margin: 0;
padding: 0;
}
.filmkio_dashboard .left_side_head_dashboard .menu_head_holder ul li {
align-items: center;
display: inline-flex;
}
.filmkio_dashboard .left_side_head_dashboard .menu_head_holder ul li a,
.filmkio_dashboard .left_side_head_dashboard .menu_head_holder ul li span {
font-size: 1rem;
font-weight: 600;
line-height: 1.6;
padding: 0;
}
.filmkio_dashboard .left_side_head_dashboard .menu_head_holder .icon_arrow {
height: 14px;
margin: 0 6px;
width: 14px;
}
/* ===== Header: transparent on all pages + glass scroll effect ===== */
/* Logo holder — works for SVG fallback, ![]()
, or custom-logo-link */
.filmkio_page .filmkio_header .right_side_header .logo_holder,
.filmkio_page .filmkio_header .right_side_header a.logo_holder,
.filmkio_page .filmkio_header .right_side_header .custom-logo-link.logo_holder {
align-items: center;
display: inline-flex;
flex-shrink: 0;
text-decoration: none;
}
.filmkio_page .filmkio_header .right_side_header .logo_holder .icon,
.filmkio_page .filmkio_header .right_side_header .logo_holder .svg_logo,
.filmkio_page .filmkio_header .right_side_header .logo_holder img,
.filmkio_page .filmkio_header .right_side_header .logo_holder .custom-logo {
display: block;
height: 36px;
max-height: 42px;
max-width: 180px;
object-fit: contain;
width: auto;
}
@media screen and (max-width: 600px) {
.filmkio_page .filmkio_header .right_side_header .logo_holder .icon,
.filmkio_page .filmkio_header .right_side_header .logo_holder .svg_logo,
.filmkio_page .filmkio_header .right_side_header .logo_holder img,
.filmkio_page .filmkio_header .right_side_header .logo_holder .custom-logo {
height: 34px;
max-height: 42px;
max-width: 140px;
}
}
/* Header base state (Scrolled): Glass morphism effect */
.filmkio_header {
z-index: 99999 !important;
-webkit-backdrop-filter: blur(8px) !important;
backdrop-filter: blur(8px) !important;
background-color: rgba(10, 13, 16, 0.7) !important;
background-image: none !important;
overflow: visible;
position: fixed;
right: 0;
transition: all 0.4s ease-in-out !important;
z-index: 2000;
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1) !important;
}
/* Remove gradient overlays if any */
.filmkio_header::before,
.filmkio_header::after {
display: none !important;
}
/* AT TOP state: Completely transparent on all pages - Force Clean */
.filmkio_header.in_top,
.filmkio_header.in_top .container,
.filmkio_header.in_top .right_side_header,
.filmkio_header.in_top .left_side_header {
background-color: transparent !important;
background: transparent !important;
background-image: none !important;
-webkit-backdrop-filter: blur(0px) !important;
backdrop-filter: blur(0px) !important;
box-shadow: none !important;
border: none !important;
}
/* Force content to start from the top for transparent header overlays */
.filmkio_page {
padding-top: 0 !important;
}
/* Adjust containers that start at the top to account for the transparent header */
.hero_title_archive,
.filmkio_home_slider {
margin-top: 0 !important;
}
.filmkio_home_slider .in_home_slider .data_for_show:before {
background: linear-gradient(90deg, rgb(255 255 255 / 20%), #000) !important;
}
/* Add top padding only to the inner content of heros so text isn't covered */
.hero_title_archive .center_texts {
padding-top: 100px !important;
}
.filmkio_home_slider .slide_data_text {
padding-top: 180px !important;
}
/* For Single Post pages (Movies/Series) */
.single_page .content_single_post {
padding-top: 72px !important;
}
/* Ensure transition is smooth for all nested elements if needed */
.filmkio_header,
.filmkio_header * {
transition: all 0.4s ease-in-out !important;
}
.filmkio_page .filmkio_header .left_side_header {
align-items: center;
display: flex;
flex: 1;
flex-flow: row nowrap;
gap: 0;
justify-content: flex-end;
position: relative;
}
.filmkio_page .filmkio_header .left_side_header .left_btn_header {
background: transparent;
border: 0;
border-radius: 0;
height: auto;
margin-right: 0;
position: relative;
width: auto;
}
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_search_header,
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_login_user,
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_light_dark_mode {
align-content: center;
align-items: center;
background: rgba(0, 0, 0, 0.1);
border: 1px solid hsla(0, 0%, 59%, 0.1);
border-radius: 10px;
cursor: pointer;
display: inline-flex;
height: 36px;
justify-content: center;
line-height: 36px;
margin-right: 8px;
transition: all 0.3s ease;
width: 36px;
}
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_search_header .icon,
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_login_user .icon,
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_light_dark_mode .icon {
fill: #f2f2f2;
height: 20px;
width: 20px;
}
}
.filmkio_page .filmkio_header .right_side_header .menu_header ul {
align-items: center;
display: flex;
flex-flow: row nowrap;
margin: 2rem;
position: relative;
transition: all 0.3s ease;
}
.filmkio_page .filmkio_header.in_top .right_side_header .menu_header ul {
margin: 2.4rem 2rem;
}
.filmkio_page .filmkio_header .right_side_header .menu_header ul li {
display: inline-block;
}
.filmkio_page .filmkio_header .right_side_header .menu_header ul li a {
font-size: 0.92rem;
font-weight: 600;
padding: 0 0.75rem;
display: inline-flex;
align-items: center;
gap: 8px !important;
}
.filmkio_page .filmkio_header.in_top .right_side_header .menu_header ul {
margin: 1rem 1.25rem;
}
.filmkio_page .filmkio_header .right_side_header .menu_header ul li a i {
margin-left: 0 !important;
margin-right: 0 !important;
font-size: 0.95rem !important;
opacity: 0.75 !important;
transition: transform 0.25s ease, color 0.25s ease, opacity 0.25s ease !important;
}
.filmkio_page .filmkio_header .right_side_header .menu_header ul li a:hover i,
.filmkio_page .filmkio_header .right_side_header .menu_header ul li.active a i {
opacity: 1 !important;
color: #f5ad11 !important;
transform: scale(1.1) !important;
}
.filmkio_page .filmkio_header .right_side_header .menu_header ul li span {
font-size: 1.1rem;
font-weight: 600;
padding: 2.4rem 1.3rem;
}
.filmkio_page .filmkio_header .right_side_header .menu_header ul li span .icon_arrow {
opacity: 0.7;
}
.filmkio_page .filmkio_header .right_side_header .menu_header ul li span .icon_arrow:before {
border: solid #fff;
border-width: 0 2px 2px 0;
content: "";
display: inline-block;
margin: 0 10px 0 0;
padding: 3px;
position: relative;
top: -1px;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
/* Exact reference replica from local home_page/styles.css */
.filmkio_page .filmkio_header .left_side_header .left_btn_header {
position: relative;
}
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_light_dark_mode,
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_login_user,
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_search_header {
align-content: center;
align-items: center;
background: rgba(0, 0, 0, 0.1);
border: 1px solid rgba(150, 150, 150, 0.1);
border-radius: 13px;
cursor: pointer;
display: inline-flex;
height: 43px;
justify-content: center;
line-height: 43px;
margin-right: 10px;
transition: 0.3s;
width: 43px;
}
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_light_dark_mode .icon,
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_login_user .icon,
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_search_header .icon {
fill: #f2f2f2;
height: 25px;
width: 25px;
}
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_light_dark_mode:hover,
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_login_user:hover,
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_search_header:hover {
border-color: rgba(245, 173, 17, 0.7);
}
/* ===== Search box & live results ===== */
/* lds-dual-ring spinner (same as namako-style but scoped) */
@keyframes lds-dual-ring {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .lds-dual-ring {
display: inline-block;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .lds-dual-ring::after {
animation: lds-dual-ring 1.2s linear infinite;
border-color: #fff transparent;
border-radius: 50%;
border-style: solid;
border-width: 3px;
content: " ";
display: block;
height: 30px;
margin: 20px 0;
width: 30px;
}
/* Show class */
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search.show {
display: block;
}
/* Result list container triangle */
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search ul {
position: relative;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search ul::before {
border: 10px solid transparent;
border-bottom-color: rgba(255, 255, 255, 0.1);
bottom: 99.9%;
content: "";
display: block;
height: 0;
left: 0;
margin: auto;
position: absolute;
right: 0;
width: 0;
z-index: 2;
}
/* Each result item */
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search ul li a {
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
display: flex;
flex-wrap: nowrap;
padding: 0 10px;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search ul li a:hover .cover img {
border: 2px solid #f5ad11;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search ul li a:hover .data_side h2 {
color: #f5ad11;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search ul li a:hover .data_side .genre_items {
padding-right: 5px;
}
/* Poster thumbnail */
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search ul li .cover {
border-radius: 10px;
flex-shrink: 0;
height: 80px;
margin: 10px 0;
overflow: hidden;
width: 80px;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search ul li .cover img {
border: 1.5px solid transparent;
border-radius: 10px;
height: 100%;
object-fit: cover;
object-position: center;
transition: all 0.2s ease-in-out;
width: 100%;
}
/* Title + genre column */
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search ul li .data_side {
align-content: center;
align-items: center;
display: flex;
flex-wrap: wrap;
padding: 0 10px;
text-align: right;
width: calc(100% - 120px);
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search ul li .data_side h2 {
direction: ltr;
font-size: 1rem;
font-weight: 500;
overflow: hidden;
text-overflow: ellipsis;
transition: all 0.2s ease-in-out;
white-space: nowrap;
width: 100%;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search ul li .data_side .genre_items {
color: #f2f2f2;
font-size: 0.9rem;
margin-top: 7px;
opacity: 0.75;
transition: all 0.2s ease-in-out;
}
/* IMDB rating column */
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search ul li .imdb_rate_holder {
align-content: center;
align-items: center;
border-right: 1px solid rgba(255, 255, 255, 0.1);
color: #f5ad11;
display: flex;
flex-shrink: 0;
flex-wrap: wrap;
font-size: 1.3rem;
font-weight: 600;
justify-content: center;
padding-right: 10px;
}
/* "View all results" footer link */
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search .more_title_link {
align-content: center;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search .more_title_link a {
color: #f5ad11;
display: block;
padding: 15px;
transition: all 0.2s ease-in-out;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search .more_title_link a:hover {
transform: scale(1.06);
}
/* No result message */
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search .no_result_note {
font-size: 1.1rem;
font-weight: 500;
padding: 25px 20px;
text-align: center;
}
/* ===== /Search results ===== */
.filmkio_page .filmkio_header .left_side_header .btn_search_header {
position: relative;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home {
bottom: auto;
left: -20px;
opacity: 0;
padding: 0 10px;
position: absolute;
top: auto;
transition: 0.3s;
visibility: hidden;
width: 100%;
z-index: 250;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home.show,
.filmkio_page .filmkio_header .left_side_header .search_box_header_home.visible {
left: 0;
opacity: 1;
visibility: visible;
}
.filmkio_page .filmkio_header .left_side_header.search-active .left_btn_header:not(.btn_search_header) {
opacity: 0;
pointer-events: none;
transform: scale(0.92);
visibility: hidden;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .inner_search_box {
background: rgb(10, 13, 16);
border: 1.5px solid rgba(255, 255, 255, 0.1);
border-radius: 15px;
display: flex;
flex-wrap: wrap;
position: relative;
width: 100%;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .inner_search_box input {
background: #0a0d10;
border: 0;
flex: 1;
font-size: 1rem;
outline: none;
padding: 10px;
width: 100%;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .inner_search_box .btn_submit_holder,
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .inner_search_box .btn_settings_holder {
align-content: center;
align-items: center;
border-left: 1.5px solid rgba(99, 99, 99, 0.2);
display: flex;
flex-wrap: wrap;
justify-content: center;
padding: 7px;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .inner_search_box .btn_settings_holder {
border-left: 0;
border-right: 1px solid rgba(99, 99, 99, 0.2);
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .inner_search_box .btn_submit_holder button,
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .inner_search_box .btn_settings_holder .settings_icon_holder {
align-content: center;
align-items: center;
background: rgba(99, 99, 99, 0.1);
border-radius: 15px;
cursor: pointer;
display: flex;
flex-wrap: wrap;
justify-content: center;
padding: 8px 0;
width: 50px;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .inner_search_box .icon {
fill: none;
height: 27px;
stroke: #f2f2f2;
width: 27px;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .result_ajax_search {
background: rgb(10, 13, 16);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 15px;
box-shadow: rgba(0, 0, 0, 0.8) 0px 0px 15px;
display: none;
margin-top: 10px;
position: absolute;
text-align: center;
top: 100%;
width: 95%;
}
/* Advanced search panel — exact reference */
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search {
background-color: rgb(20, 20, 20);
border-radius: 0.5rem;
box-shadow: rgba(0, 0, 0, 0.6) 0px 0.4rem 1rem 0px;
box-sizing: border-box;
left: 0;
min-width: 0;
opacity: 0;
position: absolute;
top: 100%;
transition: 0.3s;
visibility: hidden;
z-index: 100;
}
/* Triangle arrow at top of panel */
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search::before {
border-color: transparent transparent rgb(20, 20, 20);
border-image: initial;
border-style: solid;
border-width: 10px;
bottom: 99.9%;
content: "";
display: block;
height: 0;
left: 20px;
position: absolute;
width: 0;
z-index: 2;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search.open {
opacity: 1;
visibility: visible;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row {
display: flex;
flex-flow: column;
padding: 20px 8px 0;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row {
align-items: center;
display: flex;
flex-flow: row;
justify-content: space-between;
margin-bottom: 20px;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row .item_search {
display: inline-flex;
justify-content: space-between;
margin: 0.4rem;
position: relative;
width: 100%;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row .item_search .sep {
color: rgb(240, 240, 240);
line-height: 48px;
width: 5%;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row .item_search.btnSearchmobile {
display: none;
margin-top: 20px;
width: 100%;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row .item_search .dropdown_filmkio,
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row .item_search .floatlabelinput {
width: 100%;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row .item_search .dropdown_filmkio .main_dropdown,
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row .item_search.release_holder {
width: 100%;
}
/* Row with 3 equal-flex items (بازیگر/کارگردان/نویسنده) */
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row.s_row_th_adv {
column-gap: 10px;
flex-wrap: nowrap;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row.s_row_th_adv .item_search {
flex: 1 1 0%;
width: auto;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row.s_row_th_adv .item_search .floatlabelinput {
flex: 1 1 0%;
width: 33.33%;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row.s_row_th_adv .item_search .floatlabelinput input {
width: 100%;
}
/* Hide desktop search button in rows (shown only in mobile) */
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .content_row .row .item_search.btnsearchHolder {
display: none;
}
/* Dropdown component */
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .dropdown_filmkio {
display: flex;
position: relative;
user-select: none;
width: 100%;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .dropdown_filmkio .label_dropdown {
background-color: rgb(20, 20, 20);
border-radius: 0.5rem;
color: rgb(120, 120, 120);
padding: 0 0.4rem;
pointer-events: none;
position: absolute;
right: 0.8rem;
top: 50%;
transform: translateY(-2rem) scale(0.9);
transition: 0.3s;
white-space: nowrap;
will-change: transform;
z-index: 2;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .dropdown_filmkio .main_dropdown {
align-items: center;
background: none;
border: 0.1rem solid rgb(120, 120, 120);
border-radius: 0.5rem;
color: rgb(255, 255, 255);
cursor: pointer;
display: flex;
flex-flow: row;
height: 3rem;
justify-content: space-between;
outline: 0;
padding: 0 0.8rem;
position: relative;
transition: 0.2s;
width: 100%;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .dropdown_filmkio .main_dropdown .dropdown_value {
color: rgb(240, 240, 240);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .dropdown_filmkio .main_dropdown .dropdown_icon {
transform: rotate(180deg);
transition: 0.3s;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .dropdown_filmkio .main_dropdown .dropdown_icon svg {
height: 24px;
stroke: rgb(255, 255, 255);
width: 24px;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .dropdown_filmkio .dropdown_body {
background-color: rgb(10, 13, 16);
border-radius: 0.5rem;
box-shadow: rgb(0, 0, 0) 0px 0.1rem 1rem 0px;
display: flex;
flex-flow: column;
max-height: 15.2rem;
opacity: 0;
overflow-y: auto;
padding: 0 0 0.8rem 0.8rem;
position: absolute;
top: 90%;
transform: translateZ(0) translateY(0.5rem);
transform-origin: center top;
visibility: hidden;
width: 100%;
z-index: 100;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .dropdown_filmkio.open .dropdown_body {
opacity: 1;
visibility: visible;
pointer-events: auto !important;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .dropdown_filmkio .dropdown_body input {
background: none;
border-bottom: 0.1rem solid rgb(120, 120, 120);
border-left: 0;
border-radius: 0;
border-right: 0;
border-top: 0;
margin-bottom: 0.5rem;
outline: 0;
padding: 0.4rem 0.8rem;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .dropdown_filmkio .dropdown_body .item_dropdown_body,
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .dropdown_filmkio .dropdown_body .item_dropdown_genre_body {
cursor: pointer;
float: right;
padding: 0.6rem 0.8rem;
transition: 0.3s;
width: 100%;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .dropdown_filmkio .dropdown_body .item_dropdown_body.active,
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .dropdown_filmkio .dropdown_body .item_dropdown_body:hover,
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .dropdown_filmkio .dropdown_body .item_dropdown_genre_body.active,
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .dropdown_filmkio .dropdown_body .item_dropdown_genre_body:hover {
background-color: rgb(35, 39, 41);
color: rgb(245, 173, 17);
}
/* Float label inputs */
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .floatlabelinput {
position: relative;
width: 100%;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .floatlabelinput input {
background: none;
border: 0.1rem solid rgb(120, 120, 120);
border-radius: 0.5rem;
color: rgb(240, 240, 240);
height: 3rem;
outline: 0;
padding: 1.2rem 0.8rem;
transition: 0.2s;
width: 100%;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .floatlabelinput .label_placeholder {
color: rgb(240, 240, 240);
cursor: text;
opacity: 0.6;
overflow: hidden;
padding: 0.75rem;
position: absolute;
right: 0;
top: 0;
transition: 0.12s cubic-bezier(0.25, 0.46, 0.45, 0.94);
white-space: nowrap;
z-index: -1;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .floatlabelinput input:focus~label,
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .floatlabelinput.has-val label {
background: rgb(20, 20, 20);
color: rgb(120, 120, 120);
cursor: default;
font-size: 0.95em;
height: 20px;
opacity: 1;
padding: 0 5px;
right: 10px;
top: -10px;
z-index: 80;
}
/* Release year row */
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .release_put {
display: flex;
width: 45%;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .release_put input {
background: none;
border: 0.1rem solid rgb(120, 120, 120);
border-radius: 0.5rem;
color: rgb(240, 240, 240);
height: 3rem;
outline: 0;
padding: 1.2rem 0.8rem;
transition: 0.2s;
width: 100%;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .release_put .label_placeholder {
align-items: center;
background: rgb(20, 20, 20);
color: rgb(120, 120, 120);
cursor: default;
display: flex;
font-size: 0.95em;
height: 20px;
opacity: 1;
padding: 0 5px;
position: absolute;
right: 10px;
top: -10px;
z-index: 80;
}
/* Search button */
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .btnadvancedSearch {
align-items: center;
background: rgb(245, 173, 17);
border: 0;
border-radius: 0.5rem;
color: rgb(30, 30, 30);
cursor: pointer;
display: flex;
height: 3rem;
justify-content: center;
outline: none;
padding: 0.4rem 1.6rem;
text-align: center;
transition: 0.3s;
white-space: nowrap;
width: 100%;
}
.filmkio_page .filmkio_header .left_side_header .search_box_header_home .adv_options_search .btnadvancedSearch:hover {
background: rgb(220, 153, 9);
}
/* Responsive — search box mobile */
@media screen and (max-width: 1024px) {
/* Parent overlay when search is active - fully covers the logo and entire header */
.filmkio_page .filmkio_header .left_side_header.search-active {
position: fixed !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
width: 100vw !important;
height: 60px !important;
background: #0a0d10 !important;
z-index: 999999 !important; /* ultra-high z-index to overlay everything including logo */
display: flex !important;
align-items: center !important;
justify-content: center !important;
box-sizing: border-box !important;
padding: 0 !important;
}
/* Hide all buttons inside active search parent */
.filmkio_page .filmkio_header .left_side_header.search-active .left_btn_header {
display: none !important;
}
/* Search box inside the active full-width parent */
.search_box_header_home {
display: none !important;
}
.search_box_header_home.visible {
display: flex !important;
position: relative !important;
top: auto !important;
left: auto !important;
right: auto !important;
width: 100% !important;
height: auto !important;
background: transparent !important;
opacity: 1 !important;
visibility: visible !important;
transform: none !important;
box-shadow: none !important;
padding: 8px 12px !important;
box-sizing: border-box !important;
z-index: 1 !important;
}
.search_box_header_home .inner_search_box {
height: 44px !important;
border-radius: 12px !important;
background: #14181b !important;
border: 1px solid rgba(255, 255, 255, 0.08) !important;
width: 100% !important;
display: flex !important;
align-items: center !important;
flex-wrap: nowrap !important;
margin: 0 !important;
}
.search_box_header_home .inner_search_box input {
height: 100% !important;
padding: 0 12px !important;
font-size: 0.95rem !important;
background: transparent !important;
color: #fff !important;
}
/* Live AJAX results dropdown - fixed below the active header overlay */
.search_box_header_home .result_ajax_search {
position: fixed !important;
top: 60px !important;
left: 12px !important;
right: 12px !important;
width: calc(100vw - 24px) !important;
max-height: calc(100vh - 80px) !important;
background: #0a0d10 !important;
border: 1px solid rgba(255, 255, 255, 0.08) !important;
border-radius: 12px !important;
box-shadow: 0 10px 30px rgba(0,0,0,0.6) !important;
overflow-y: auto !important;
z-index: 999999 !important;
display: none;
}
.search_box_header_home .result_ajax_search.show {
display: block !important;
}
/* پنل تنظیمات جستجو — fixed زیر هدر، تمام عرض صفحه */
.adv_options_search {
position: fixed !important;
top: 60px !important; /* height of mobile header */
left: 0 !important;
right: 0 !important;
width: 100% !important;
max-width: 100vw !important;
max-height: calc(100dvh - 60px) !important;
background: #0a0d10 !important;
overflow-x: hidden !important;
overflow-y: auto !important;
-webkit-overflow-scrolling: touch !important;
border-radius: 0 !important;
box-sizing: border-box !important;
z-index: 99999 !important;
padding-bottom: 180px !important;
}
/* Dropdown mobile styling to prevent overflow / narrow boxes */
.adv_options_search .dropdown_filmkio .dropdown_body {
min-width: 185px !important;
right: 0 !important;
left: auto !important;
width: auto !important;
}
/* مثلث بالا مخفی */
.adv_options_search::before {
display: none !important;
}
.adv_options_search .content_row {
padding: clamp(10px, 3vw, 16px) clamp(10px, 3vw, 16px) 0 !important;
}
/* همیشه ۲ ستونه — grid ریسپانسیو */
.adv_options_search .content_row .row,
.adv_options_search .content_row .row.s_row_th_adv {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: clamp(6px, 2vw, 10px) !important;
margin-bottom: 0 !important;
flex-wrap: unset !important;
column-gap: clamp(6px, 2vw, 10px) !important;
}
.adv_options_search .content_row .row .item_search,
.adv_options_search .content_row .row.s_row_th_adv .item_search {
flex: unset !important;
margin: 0 0 clamp(8px, 2vw, 12px) !important;
min-width: 0 !important;
width: auto !important;
}
.adv_options_search .content_row .row .item_search.btnSearchmobile,
.adv_options_search .content_row .row.mobile_only .item_search {
display: flex !important;
grid-column: 1 / -1 !important;
margin-top: 0 !important;
width: 100% !important;
}
.adv_options_search .content_row .row .item_search .dropdown_filmkio,
.adv_options_search .content_row .row .item_search .floatlabelinput,
.adv_options_search .content_row .row .item_search.release_holder {
min-width: 0 !important;
width: 100% !important;
}
.adv_options_search .dropdown_filmkio .main_dropdown .dropdown_value {
font-size: clamp(11px, 3vw, 13px) !important;
}
/* utility: show/hide per viewport */
.adv_options_search .desktop_only {
display: none !important;
}
.adv_options_search .mobile_only {
display: flex !important;
}
}
@media screen and (max-width: 600px) {
.adv_options_search {
top: 60px !important;
max-height: calc(100dvh - 60px) !important;
}
.adv_options_search .content_row .row,
.adv_options_search .content_row .row.s_row_th_adv {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: clamp(5px, 1.5vw, 8px) !important;
}
.adv_options_search .content_row .row .item_search,
.adv_options_search .content_row .row.s_row_th_adv .item_search {
margin-bottom: clamp(6px, 1.5vw, 10px) !important;
}
.adv_options_search .dropdown_filmkio .main_dropdown,
.adv_options_search .floatlabelinput input,
.adv_options_search .release_put input {
font-size: clamp(11px, 3.2vw, 13px) !important;
height: clamp(38px, 11vw, 44px) !important;
padding: 0 clamp(6px, 2vw, 10px) !important;
}
.adv_options_search .dropdown_filmkio .label_dropdown,
.adv_options_search .floatlabelinput .label_placeholder,
.adv_options_search .release_put .label_placeholder {
font-size: clamp(9px, 2.5vw, 11px) !important;
}
.adv_options_search .dropdown_filmkio .main_dropdown .dropdown_icon svg {
height: clamp(16px, 4.5vw, 20px) !important;
width: clamp(16px, 4.5vw, 20px) !important;
}
.adv_options_search .release_holder {
gap: clamp(2px, 1vw, 5px) !important;
}
.adv_options_search .release_holder .sep {
font-size: clamp(9px, 2.5vw, 11px) !important;
}
.adv_options_search .btnadvancedSearch {
font-size: clamp(12px, 3.5vw, 14px) !important;
height: clamp(40px, 11vw, 46px) !important;
}
}
.filmkio_dashboard .dashboard_users .head_dashboard {
border-bottom: 2px dashed #1f292e;
position: static;
}
.filmkio_dashboard .dashboard_users {
background: #0b0e0f;
margin: 0;
max-width: 100%;
min-height: 100vh;
overflow: hidden;
padding: 0;
}
.filmkio_dashboard .dashboard_users .head_dashboard .right_side_head,
.filmkio_dashboard .dashboard_users .main_dashboard .sidebar_dashboard {
width: 16%;
}
.filmkio_dashboard .dashboard_users .head_dashboard .left_side_head_dashboard {
padding: 20px 40px;
}
.filmkio_dashboard .dashboard_users .main_dashboard .inner_main_dashboard {
align-content: flex-start;
align-items: flex-start;
border-right: 2px dashed #1f292e;
display: flex;
flex: 1 1 0%;
flex-wrap: wrap;
position: relative;
right: -2px;
}
.filmkio_dashboard .sidebar_dashboard {
padding: 0;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard {
background: transparent;
border: 0;
border-radius: 0;
padding: 0;
width: 100%;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar {
padding-right: 40px;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .head_sidebar {
padding: 40px 20px;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .head_sidebar .sidebar_avatar {
background: #0b0d0f;
border: 2px dashed #1f292e;
border-radius: 10%;
font-size: 2.5rem;
height: 100px;
line-height: 115px;
width: 100px;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .head_sidebar span {
font-size: 1.4rem;
font-weight: 800;
letter-spacing: 2px;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li {
border-bottom: 2px dashed transparent;
border-right: 2px dashed transparent;
border-top: 2px dashed transparent;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li a {
border-bottom: 2px dashed transparent;
border-right: 2px dashed transparent;
border-top: 2px dashed transparent;
left: -2px;
padding: 24px 30px 20px;
position: relative;
transition: all 0.3s ease;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li.active {
border-bottom: 2px dashed #1f292e;
border-bottom-right-radius: 50px;
border-right: 2px dashed #1f292e;
border-top: 2px dashed #1f292e;
border-top-right-radius: 50px;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li.active a {
background-color: #0b0e0f;
border-bottom-right-radius: 50px;
border-top-right-radius: 50px;
color: #f5ad11;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li.active a::before {
background-color: #0b0e0f;
border-bottom: 2px dashed #1f292e;
border-bottom-left-radius: 1rem;
border-left: 2px dashed #1f292e;
box-shadow: #0b0e0f -15px 15px 0;
content: "";
height: 30px;
left: 2px;
position: absolute;
top: -32px;
width: 30px;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li.active a::after {
background-color: #0b0e0f;
border-left: 2px dashed #1f292e;
border-top: 2px dashed #1f292e;
border-top-left-radius: 1rem;
bottom: -32px;
box-shadow: #0b0e0f -15px -15px 0;
content: "";
height: 30px;
left: 2px;
position: absolute;
width: 30px;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li .icon {
fill: #cfd1d0;
height: 23px;
margin: -6px 0 0 12px;
transition: all 0.3s ease;
width: 23px;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li .icon_addToWatchList {
height: 21px;
width: 16px;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li.active .icon,
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li:hover .icon,
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li:hover a {
color: #f5ad11;
fill: #f5ad11;
}
.filmkio_dashboard .home_dashboard .style_block_dashboard {
transition: border-color 0.3s ease, transform 0.3s ease;
}
.filmkio_dashboard .home_dashboard .style_block_dashboard:hover {
border-color: rgba(245, 173, 17, 0.55);
transform: translateY(-2px);
}
.filmkio_dashboard .home_dashboard .style_block_dashboard .title .left_side a {
transition: all 0.25s ease;
}
.filmkio_dashboard .home_dashboard .style_block_dashboard .title .left_side a:hover {
border-color: #f5ad11;
transform: translateY(-1px);
}
.filmkio_dashboard .transactions_list_dashboard {
width: 100%;
}
.filmkio_dashboard .transactions_overview_cards {
display: grid;
gap: 14px;
grid-template-columns: repeat(3, minmax(0, 1fr));
margin-bottom: 18px;
}
.filmkio_dashboard .transactions_overview_cards .overview_card {
background: linear-gradient(145deg, rgba(20, 26, 31, 0.92), rgba(12, 16, 20, 0.9));
border: 1px solid rgba(245, 173, 17, 0.18);
border-radius: 16px;
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.25);
padding: 14px 16px;
}
.filmkio_dashboard .transactions_overview_cards .overview_card .label {
color: #9ea6ad;
display: block;
font-size: 0.95rem;
margin-bottom: 6px;
}
.filmkio_dashboard .transactions_overview_cards .overview_card .value {
color: #f5ad11;
font-size: 1.45rem;
font-weight: 800;
}
.filmkio_dashboard .transactions_table_wrap {
background: rgba(11, 15, 19, 0.88);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 16px;
overflow: hidden;
}
.filmkio_dashboard .transactions_table .head .tr {
background: rgba(245, 173, 17, 0.08);
border-bottom: 1px solid rgba(245, 173, 17, 0.2);
}
.filmkio_dashboard .transactions_table .head .th {
color: #f4f5f6;
font-size: 0.94rem;
font-weight: 700;
padding: 14px 12px;
}
.filmkio_dashboard .transactions_table .body .tr {
align-items: center;
border-bottom: 1px dashed rgba(255, 255, 255, 0.08);
transition: background-color 0.2s ease;
}
.filmkio_dashboard .transactions_table .body .tr:last-child {
border-bottom: 0;
}
.filmkio_dashboard .transactions_table .body .tr:hover {
background: rgba(255, 255, 255, 0.03);
}
.filmkio_dashboard .transactions_table .body .td {
color: #d6dade;
font-size: 0.92rem;
padding: 13px 12px;
}
.filmkio_dashboard .transactions_table .order_code {
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 10px;
color: #f6f7f8;
display: inline-block;
font-size: 0.82rem;
font-weight: 700;
letter-spacing: 0.4px;
padding: 5px 8px;
}
.filmkio_dashboard .transactions_table .amount {
color: #f6f7f8;
font-weight: 700;
}
.filmkio_dashboard .transactions_table .amount small {
color: #9ea6ad;
font-size: 0.76rem;
}
.filmkio_dashboard .transactions_table .status_badge {
border-radius: 999px;
display: inline-flex;
font-size: 0.8rem;
font-weight: 700;
padding: 4px 10px;
}
.filmkio_dashboard .transactions_table .status_badge.is_success {
background: rgba(25, 180, 90, 0.18);
border: 1px solid rgba(25, 180, 90, 0.35);
color: #8bf0b5;
}
.filmkio_dashboard .transactions_table .status_badge.is_failed {
background: rgba(212, 71, 71, 0.18);
border: 1px solid rgba(212, 71, 71, 0.35);
color: #ff9e9e;
}
.filmkio_dashboard .transactions_empty_state {
background: rgba(11, 15, 19, 0.88);
border: 1px dashed rgba(245, 173, 17, 0.35);
border-radius: 16px;
padding: 34px 18px;
text-align: center;
}
.filmkio_dashboard .transactions_empty_state .empty_state_icon .icon {
color: #f5ad11;
height: 32px;
margin-bottom: 10px;
width: 32px;
}
.filmkio_dashboard .transactions_empty_state h4 {
color: #f5f5f5;
font-size: 1.1rem;
margin-bottom: 6px;
}
.filmkio_dashboard .transactions_empty_state p {
color: #adb5bc;
margin-bottom: 14px;
}
@media screen and (max-width: 1450px) {
.filmkio_dashboard .dashboard_users .head_dashboard .right_side_head,
.filmkio_dashboard .dashboard_users .main_dashboard .sidebar_dashboard {
width: 17%;
}
.filmkio_dashboard .dashboard_users .main_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar {
padding-right: 20px;
}
}
@media screen and (max-width: 1200px) {
.filmkio_dashboard .dashboard_users .head_dashboard .right_side_head,
.filmkio_dashboard .dashboard_users .main_dashboard .sidebar_dashboard {
width: 20%;
}
}
@media screen and (max-width: 1025px) {
.filmkio_dashboard .dashboard_users .head_dashboard .right_side_head,
.filmkio_dashboard .dashboard_users .main_dashboard .sidebar_dashboard {
width: 25%;
}
}
@media screen and (max-width: 850px) {
.filmkio_dashboard .dashboard_users .head_dashboard .right_side_head,
.filmkio_dashboard .dashboard_users .main_dashboard .sidebar_dashboard {
width: 35%;
}
.filmkio_dashboard .home_dashboard {
margin-bottom: 0;
padding: 10px 10px 0;
}
.filmkio_dashboard .home_dashboard .top_home_dashboard_blocks .style_block_dashboard.subscription_block {
margin-bottom: 10px;
}
.filmkio_dashboard .transactions_overview_cards {
grid-template-columns: 1fr;
}
.filmkio_dashboard .transactions_table .head {
display: none;
}
.filmkio_dashboard .transactions_table .body .tr {
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 12px;
display: grid;
grid-template-columns: 1fr;
margin-bottom: 10px;
padding: 8px;
}
.filmkio_dashboard .transactions_table .body .td {
align-items: center;
display: flex;
font-size: 0.88rem;
justify-content: space-between;
padding: 7px 4px;
}
.filmkio_dashboard .transactions_table .body .td::before {
color: #949ea7;
content: attr(data-label);
font-size: 0.78rem;
margin-left: 10px;
}
}
@media screen and (max-width: 700px) {
.filmkio_dashboard .dashboard_users .head_dashboard {
justify-content: space-between;
}
.filmkio_dashboard .dashboard_users .head_dashboard .left_side_head_dashboard {
display: block;
flex: 0 0 auto;
padding: 10px;
}
.filmkio_dashboard .dashboard_users .head_dashboard .left_side_head_dashboard .menu_head_holder {
display: none;
}
.filmkio_dashboard .dashboard_users .head_dashboard .left_side_head_dashboard .left_side_header {
display: block;
flex: 0 0 auto;
}
.filmkio_dashboard .dashboard_users .main_dashboard {
flex-direction: column-reverse;
}
.filmkio_dashboard .dashboard_users .main_dashboard .sidebar_dashboard {
display: none;
margin-bottom: 70px;
width: 100%;
}
.filmkio_dashboard .dashboard_users .main_dashboard .inner_main_dashboard {
flex: 0 0 auto;
overflow: hidden;
width: 100%;
}
.filmkio_dashboard .dashboard_users .main_dashboard .sidebar_dashboard.empty_subpage {
display: flex;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .head_sidebar {
display: none;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar {
padding-right: 0;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul {
display: flex;
flex-wrap: wrap;
padding: 10px;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li {
padding: 5px;
width: 33.33%;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li.active {
border: 0;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li a,
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li.active a {
align-items: center;
background: rgba(99, 99, 99, 0.1);
border-radius: 10px;
display: flex;
flex-flow: column wrap;
font-size: 1rem;
justify-content: center;
padding: 25px 7px;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li .icon {
margin: 0;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li span {
margin-top: 10px;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li.active a::after,
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li.active a::before {
display: none;
}
}
/* ===== Mobile header layout fix ===== */
@media screen and (max-width: 850px) {
/* حذف backdrop-filter از header در موبایل تا position:fixed روی پنل سرچ درست کار کنه */
.filmkio_page .filmkio_header,
.filmkio_header {
-webkit-backdrop-filter: none !important;
backdrop-filter: none !important;
}
/* اعمال blur به pseudo-element بهجای خود header */
.filmkio_page .filmkio_header::after {
-webkit-backdrop-filter: blur(6px);
backdrop-filter: blur(6px);
content: "";
position: absolute;
inset: 0;
z-index: -1;
pointer-events: none;
}
.filmkio_header .container {
padding: 0 1.2rem;
}
.filmkio_page .filmkio_header .right_side_header .menu_header {
display: none;
}
.left_side_header {
gap: 8px;
}
.right_side_header {
gap: 10px;
}
}
@media screen and (max-width: 600px) {
.filmkio_header .container {
padding: 0 0.8rem;
}
.filmkio_header .left_side_header .left_btn_header.btn_light_dark_mode,
.filmkio_header .left_side_header .left_btn_header.btn_login_user,
.filmkio_header .left_side_header .left_btn_header.btn_search_header {
height: 36px;
width: 36px;
margin-right: 0;
}
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_search_header,
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_login_user,
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_light_dark_mode {
width: 36px;
height: 36px;
border-radius: 10px;
}
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_search_header .icon,
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_login_user .icon,
.filmkio_page .filmkio_header .left_side_header .left_btn_header.btn_light_dark_mode .icon {
width: 18px;
height: 18px;
}
.left_side_header {
gap: 6px;
}
.filmkio_header {
height: 64px;
}
.filmkio_header .container {
height: 64px;
}
.filmkio_dashboard .home_dashboard .top_home_dashboard_blocks .style_block_dashboard {
border-radius: 12px;
padding: 16px 0;
}
}
/* Canonical header action button styles (final source of truth) */
.filmkio_page .filmkio_header .left_side_header .left_btn_header .link_left_side_header {
align-items: center;
border-radius: 13px;
display: inline-flex;
font: 500 1rem/43px "iranyekan", "YekanBakh", sans-serif;
letter-spacing: 0;
height: 43px;
justify-content: center;
min-width: 85px;
padding: 0 10px;
text-rendering: optimizeLegibility;
white-space: nowrap;
-webkit-font-smoothing: antialiased;
}
.filmkio_page .filmkio_header .left_side_header .left_btn_header .link_left_side_header.link_login {
background: rgba(0, 0, 0, 0.1);
border: 1px solid rgba(150, 150, 150, 0.1);
color: #f2f2f2;
padding: 3px 10px 0;
}
.filmkio_page .filmkio_header .left_side_header .left_btn_header .link_left_side_header.link_pricing {
background: #f5ad11;
color: #0b0e0f;
padding: 3px 10px 0;
}
@media screen and (max-width: 600px) {
.filmkio_page .filmkio_header .left_side_header .left_btn_header .link_left_side_header {
font-size: 0.82rem;
height: 36px;
line-height: 36px;
min-width: unset;
padding: 0 8px;
border-radius: 10px;
}
}
/* ===== Dashboard mobile hardening ===== */
.filmkio_dashboard .dashboard_users,
.filmkio_dashboard .dashboard_users .main_dashboard,
.filmkio_dashboard .dashboard_users .main_dashboard .inner_main_dashboard,
.filmkio_dashboard .home_dashboard,
.filmkio_dashboard .transactions_list_dashboard {
max-width: 100%;
min-width: 0;
}
@media screen and (max-width: 700px) {
.filmkio_dashboard .dashboard_users {
overflow-x: clip;
}
.filmkio_dashboard .dashboard_users .main_dashboard {
gap: 10px;
overflow-x: clip;
padding: 0 0 14px;
}
.filmkio_dashboard .dashboard_users .main_dashboard .sidebar_dashboard {
margin-bottom: 0;
padding: 0 10px;
position: static;
}
.filmkio_dashboard .dashboard_users .main_dashboard .inner_main_dashboard {
border-right: 0;
overflow: visible;
right: 0;
}
.filmkio_dashboard .message_help_dashboard {
gap: 8px;
padding: 14px 16px;
}
.filmkio_dashboard .message_help_dashboard .right_side,
.filmkio_dashboard .message_help_dashboard .left_side {
justify-content: center;
text-align: center;
width: 100%;
}
.filmkio_dashboard .home_dashboard {
padding: 10px 12px 0;
}
.filmkio_dashboard .top_home_dashboard_blocks {
gap: 12px;
margin-bottom: 12px;
}
.filmkio_dashboard .style_block_dashboard,
.filmkio_dashboard .home_dashboard .top_home_dashboard_blocks .style_block_dashboard {
padding: 16px 14px;
width: 100%;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul {
gap: 8px;
padding: 6px 2px 10px;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li {
min-width: 0;
padding: 0;
width: calc(50% - 4px);
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li a,
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li.active a {
font-size: 0.86rem;
gap: 7px;
min-height: 82px;
overflow: hidden;
padding: 12px 10px;
text-align: center;
white-space: normal;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li .icon {
height: 20px;
width: 20px;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li span {
line-height: 1.45;
margin-top: 0;
overflow-wrap: anywhere;
}
.filmkio_dashboard .transactions_table_wrap {
overflow: hidden;
}
.filmkio_dashboard .transactions_table .body .tr {
margin-bottom: 12px;
min-width: 0;
}
.filmkio_dashboard .transactions_table .body .td {
align-items: flex-start;
flex-wrap: wrap;
gap: 8px;
min-width: 0;
text-align: left;
}
.filmkio_dashboard .transactions_table .body .td::before {
flex-shrink: 0;
margin-left: 0;
}
.filmkio_dashboard .transactions_table .order_code,
.filmkio_dashboard .transactions_table .amount,
.filmkio_dashboard .transactions_table .status_badge {
max-width: 100%;
overflow-wrap: anywhere;
}
}
@media screen and (max-width: 520px) {
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li {
width: 100%;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li a,
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li.active a {
align-items: center;
flex-direction: row;
justify-content: flex-start;
min-height: 56px;
padding: 12px;
text-align: right;
}
.filmkio_dashboard .sidebar_dashboard .inner_sidebar_dashboard .body_sidebar ul li span {
margin-right: 8px;
}
}
/* ===== Canonical mega-menu layout — exact namako.fun reference ===== */
/* sub_menu_pages: zero-size absolute anchor at horizontal center of "بخشها" li */
.filmkio_page .sub_menu_pages {
height: 0;
left: 50%;
overflow: visible;
position: absolute;
top: 100%;
width: 0;
}
/* Give the li itself position:relative so sub_menu_pages anchors to it */
.filmkio_page .filmkio_header .right_side_header .menu_header ul li.has_child_category {
position: relative;
}
/* Hover trigger — keep transform:translateX(-50%) so menu stays centered */
.filmkio_page .filmkio_header .right_side_header .menu_header ul li.has_child_category:hover .sub_menu_pages .inner_sub_menu_pages {
opacity: 1;
transform: translateX(-50%);
visibility: visible;
}
/* Container — centered under "بخشها" via translateX(-50%) */
.filmkio_page .sub_menu_pages .inner_sub_menu_pages {
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
background-color: rgba(10, 13, 16, 0.9);
border: none !important;
border-radius: 15px;
box-shadow: rgba(0, 0, 0, 0.8) 0px 0px 30px;
display: flex;
flex-flow: row nowrap;
left: 0;
min-width: clamp(600px, calc(100vw - 60px), 1100px);
opacity: 0;
overflow: hidden;
padding: 15px;
position: absolute;
right: auto;
top: 20px;
transform: translateX(-50%);
transition: opacity 0.3s, visibility 0.3s;
visibility: hidden;
z-index: 2004;
}
/* Decorative gradient overlay */
.filmkio_page .sub_menu_pages .inner_sub_menu_pages::before {
background: linear-gradient(90deg, rgba(0, 0, 0, 0.2), rgb(10, 13, 16));
box-shadow: rgba(0, 0, 0, 0.9) -200px 0px 200px -150px inset;
content: "";
height: 100%;
left: 0;
opacity: 1;
position: absolute;
top: 0;
transition: 0.6s;
width: 100%;
z-index: -1;
}
/* Left sidebar: fixed 140px, no extra border from main.css */
.filmkio_page .sub_menu_pages .inner_sub_menu_pages .title_sub_menu {
border-left: none;
margin-left: -2px;
padding: 30px 0;
width: 140px;
}
/* Tab buttons in sidebar — exact reference, overrides main.css color/border-radius/margin */
.filmkio_page .sub_menu_pages .inner_sub_menu_pages .title_sub_menu .item_title_submenu {
border-radius: 0;
color: #f2f2f2;
cursor: pointer;
font-size: 0.95rem;
font-weight: 500;
margin: 0;
margin-top: 1px;
padding: 12px 18px;
transition: 0.3s;
border-right: 3px solid transparent;
}
/* Active tab: dark bg + dashed borders + shadow (reference exact) */
.filmkio_page .sub_menu_pages .inner_sub_menu_pages .title_sub_menu .item_title_submenu.active {
background: rgb(10, 13, 16);
border-bottom: 1.5px dashed rgb(31, 41, 46);
border-bottom-right-radius: 10px;
border-left: none;
border-right: 2px dashed rgb(31, 41, 46);
border-top: 1.5px dashed rgb(31, 41, 46);
border-top-right-radius: 10px;
box-shadow: rgb(0, 0, 0) 8px 5px 8px, rgb(0, 0, 0) 8px -8px 8px;
color: #f2f2f2;
position: relative;
}
/* Content panel: scrollable horizontally so extra columns don't float outside background */
.filmkio_page .sub_menu_pages .inner_sub_menu_pages .body_sub_menu {
border-bottom-left-radius: 15px;
border-right: 1.5px dashed rgba(255, 255, 255, 0.1);
border-top-left-radius: 15px;
flex: 1 1 auto;
max-height: none;
overflow-x: auto;
overflow-y: hidden;
padding: 10px 20px;
min-height: 350px;
}
/* Tab panels: Dynamic height, flex so grid can expand */
.filmkio_page .sub_menu_pages .inner_sub_menu_pages .body_sub_menu .tab_inner_menu {
display: none;
min-height: 320px;
height: auto;
overflow: visible;
padding: 10px;
width: 100%;
}
.filmkio_page .sub_menu_pages .inner_sub_menu_pages .body_sub_menu .tab_inner_menu.active {
display: flex;
}
/* Grid layout: Robust column alignment for mega-menu items */
.filmkio_page .sub_menu_pages .inner_sub_menu_pages .body_sub_menu .tab_inner_menu ul {
display: grid;
grid-template-columns: repeat(4, 170px);
gap: 12px 25px;
margin: 0;
padding: 10px;
list-style: none !important;
width: max-content;
}
.filmkio_page .sub_menu_pages .inner_sub_menu_pages .body_sub_menu .tab_inner_menu ul li {
list-style: none !important;
margin: 0;
width: 170px;
}
/* Links: compact padding, overrides main.css 13px/8px/border-radius */
.filmkio_page .sub_menu_pages .inner_sub_menu_pages .body_sub_menu .tab_inner_menu ul li a {
border-radius: 0;
color: #f2f2f2;
display: block;
font-size: 1rem;
font-weight: 500;
padding: 7px 10px;
transition: 0.3s;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.filmkio_page .sub_menu_pages .inner_sub_menu_pages .body_sub_menu .tab_inner_menu ul li a:hover {
background: transparent;
color: rgb(246, 173, 18);
}
/* Bullet dot before each link */
.filmkio_page .sub_menu_pages .inner_sub_menu_pages .body_sub_menu .tab_inner_menu ul li a::before {
background: rgb(255, 255, 255);
content: "";
float: right;
height: 6px;
margin-left: 8px;
margin-top: 5px;
opacity: 0.7;
width: 6px;
}
/* ===== end mega-menu ===== */
/* Movies/Series archive parity and loader stability */
.main_archive .archive_items_holder .loading_search {
display: none;
}
.main_archive .archive_items_holder .loop_archive_site {
min-height: 120px;
}
.hero_title_archive.get_query_items .background_title {
height: 320px;
object-fit: cover;
width: 100%;
}
.hero_title_archive.get_query_items .overlay_title .center_texts {
padding: 0 20px;
}
.main_archive .filters_holder {
display: flex !important;
flex-direction: column !important;
margin: 0 auto;
max-width: 2544px;
padding: 0 4.8rem;
width: 100% !important;
}
.main_archive .filters_row_archive {
display: flex !important;
flex-wrap: wrap !important;
gap: 14px;
justify-content: center !important;
margin-bottom: 32px !important;
width: 100% !important;
}
.main_archive .archive_items_holder {
display: block !important;
width: 100% !important;
margin-top: 20px !important;
}
.main_archive .filmkio_select {
min-width: 210px;
position: relative;
}
.main_archive .filmkio_select .body_select {
max-height: 280px;
overflow-y: auto;
}
@media screen and (max-width: 850px) {
.main_archive .filters_holder {
padding: 0 10px;
}
.hero_title_archive.get_query_items .background_title {
height: 240px;
}
.main_archive .filters_row_archive {
gap: 10px;
}
.main_archive .filmkio_select {
min-width: calc(50% - 5px);
}
}
@media screen and (max-width: 600px) {
.main_archive .filmkio_select {
min-width: 100%;
}
}
/* Movies archive visual parity */
body.post-type-archive-tm_movie .hero_title_archive.get_query_items {
border-bottom-left-radius: 25px;
border-bottom-right-radius: 25px;
margin: 0 auto 35px;
max-width: 2544px;
overflow: hidden;
position: relative;
}
body.post-type-archive-tm_movie .hero_title_archive.get_query_items .overlay_title {
background: linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.75));
inset: 0;
position: absolute;
}
body.post-type-archive-tm_movie .hero_title_archive.get_query_items .center_texts {
bottom: 22px;
position: absolute;
right: 4.8rem;
z-index: 3;
}
body.post-type-archive-tm_movie .hero_title_archive.get_query_items .center_texts h1 {
font-size: 2.1rem;
font-weight: 700;
}
body.post-type-archive-tm_movie .hero_title_archive.get_query_items .center_texts h2 {
color: rgba(255, 255, 255, 0.82);
font-size: 1rem;
font-weight: 500;
margin-top: 8px;
}
/* Simplified Archive Overrides (Ensuring global grid dominance) */
body.post-type-archive-tm_movie .main_archive .latest_movies,
body.post-type-archive-tm_series .main_archive .latest_movies {
margin-top: 10px !important;
}
body.post-type-archive-tm_movie .main_archive .latest_movies .body,
body.post-type-archive-tm_series .main_archive .latest_movies .body {
margin: 0 !important;
width: 100% !important;
}
body.post-type-archive-tm_series .main_archive:not(.main_archive_series_ref) .item_loop_post .bgcover,
body.page-template-page-series .main_archive:not(.main_archive_series_ref) .item_loop_post .bgcover,
body.page-template-templates-page-series-php .main_archive:not(.main_archive_series_ref) .item_loop_post .bgcover {
height: 280px;
}
/* ===== Search Results Page ===== */
.filmkio_search_page {
min-height: 80vh !important;
padding-top: 90px !important;
padding-bottom: 60px !important;
box-sizing: border-box !important;
}
/* Header bar */
.search_page_header {
background: linear-gradient(180deg, rgba(10, 13, 16, 0.95) 0%, rgba(10, 13, 16, 0.7) 100%);
border-bottom: 1.5px solid rgba(255, 255, 255, 0.06);
padding: 30px 20px 25px;
}
.search_page_header .inner_search_page_header {
align-items: center;
display: flex;
justify-content: space-between;
margin: 0 auto;
max-width: 1400px;
}
.search_page_header .search_page_title {
align-items: center;
display: flex;
gap: 14px;
}
.search_page_header .search_page_title .icon_search_page {
flex-shrink: 0;
height: 30px;
stroke: #f5ad11;
width: 30px;
}
.search_page_header .search_page_title h1 {
color: #f2f2f2;
font-size: clamp(1.1rem, 2.5vw, 1.6rem);
font-weight: 700;
line-height: 1.4;
margin: 0;
}
.search_page_header .search_page_count span {
background: rgba(245, 173, 17, 0.12);
border: 1px solid rgba(245, 173, 17, 0.3);
border-radius: 20px;
color: #f5ad11;
font-size: 0.95rem;
padding: 5px 14px;
}
/* Active filter tags */
.search_active_tags {
align-items: center;
display: flex;
flex-wrap: wrap;
gap: 8px;
margin: 0 auto;
max-width: 1400px;
padding: 15px 20px 5px;
}
.search_active_tags .search_tag {
background: rgba(99, 99, 99, 0.15);
border: 1px solid rgba(99, 99, 99, 0.25);
border-radius: 20px;
color: #c8c8c8;
font-size: 0.85rem;
padding: 4px 12px;
}
.search_active_tags .search_tag_clear {
background: rgba(245, 80, 80, 0.1);
border: 1px solid rgba(245, 80, 80, 0.3);
border-radius: 20px;
color: #f08080;
cursor: pointer;
font-size: 0.85rem;
padding: 4px 12px;
transition: 0.2s;
}
.search_active_tags .search_tag_clear:hover {
background: rgba(245, 80, 80, 0.2);
}
/* Grid area */
.filmkio_search_page .main_archive.search_archive {
margin: 0 auto;
max-width: 1400px;
padding: 20px;
}
.filmkio_search_page .items_holder {
width: 100%;
}
/* No results state */
.no_search_results {
display: flex;
justify-content: center;
padding: 80px 20px;
text-align: center;
}
.no_search_results .inner_no_results {
align-items: center;
display: flex;
flex-direction: column;
gap: 16px;
max-width: 400px;
}
.no_search_results .icon_no_result {
height: 60px;
opacity: 0.3;
stroke: #f2f2f2;
width: 60px;
}
.no_search_results h2 {
color: #f2f2f2;
font-size: 1.4rem;
font-weight: 700;
}
.no_search_results p {
color: #a0a0a0;
font-size: 1rem;
line-height: 1.6;
}
.no_search_results .btn_back_home {
background: #f5ad11;
border-radius: 0.5rem;
color: #0b0e0f;
font-weight: 600;
margin-top: 10px;
padding: 12px 28px;
transition: 0.2s;
}
.no_search_results .btn_back_home:hover {
background: #dca00f;
}
/* Pagination */
.search_pagination {
margin-top: 40px;
text-align: center;
}
.search_pagination .page-numbers {
align-items: center;
display: inline-flex;
gap: 0;
list-style: none;
margin: 0;
padding: 0;
}
.search_pagination .page-numbers li a,
.search_pagination .page-numbers li span {
align-items: center;
background: rgba(99, 99, 99, 0.1);
border: 1px solid rgba(99, 99, 99, 0.2);
color: #f2f2f2;
display: flex;
height: 40px;
justify-content: center;
min-width: 40px;
padding: 0 12px;
transition: 0.2s;
}
.search_pagination .page-numbers li a:hover {
background: rgba(245, 173, 17, 0.15);
border-color: rgba(245, 173, 17, 0.4);
color: #f5ad11;
}
.search_pagination .page-numbers li span.current {
background: #f5ad11;
border-color: #f5ad11;
color: #0b0e0f;
font-weight: 700;
}
.search_pagination .page-numbers li:first-child a,
.search_pagination .page-numbers li:first-child span {
border-radius: 0 8px 8px 0;
}
.search_pagination .page-numbers li:last-child a,
.search_pagination .page-numbers li:last-child span {
border-radius: 8px 0 0 8px;
}
/* Responsive */
@media screen and (max-width: 768px) {
.search_page_header .inner_search_page_header {
flex-direction: column;
align-items: flex-start;
gap: 10px;
}
.filmkio_search_page .main_archive.search_archive {
padding: 15px 10px;
}
}
/* ===== /Search Results Page ===== */
/* ===== Blog Archive Page ===== */
.hero_title_archive_blog {
align-content: center;
align-items: center;
display: flex;
justify-content: center;
padding: 160px 0 50px;
width: 100%;
}
.hero_title_archive_blog h1 {
font-size: 3rem;
font-weight: 600;
}
.main_holder_blog {
align-items: flex-start !important;
display: flex;
flex-wrap: wrap;
margin: 10px -10px 50px;
width: calc(100% + 10px);
}
.main_holder_blog .item_news {
border-radius: 13px;
flex: 0 0 calc(33.333% - 10px);
height: 250px;
margin: 0 10px 10px 0;
overflow: hidden;
position: relative;
transition: z-index 0.3s;
width: calc(33.333% - 10px);
z-index: 5;
}
.main_holder_blog .item_news a {
display: block;
height: 100%;
width: 100%;
}
.main_holder_blog .item_news .date_created {
background: rgba(0, 0, 0, 0.7);
border-radius: 13px;
color: #fff;
left: 15px;
padding: 5px 10px;
position: absolute;
top: 15px;
z-index: 20;
font-size: 0.85rem;
}
.main_holder_blog .item_news img {
height: 100%;
object-fit: cover;
transition: all 0.3s ease-in-out;
width: 100%;
display: block;
}
.main_holder_blog .item_news .meta_data {
bottom: 0;
height: 100%;
position: absolute;
right: 0;
width: 100%;
z-index: 20;
}
.main_holder_blog .item_news .meta_data::before {
background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.8));
border-radius: 3px;
box-shadow: inset 0 -90px 100px -120px rgba(0, 0, 0, 0.7);
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.main_holder_blog .item_news .meta_data .inner_meta_data {
bottom: 0;
padding: 10px;
position: absolute;
right: 0;
width: 100%;
}
.main_holder_blog .item_news .meta_data h2 {
color: #fff;
font-size: 1.2rem;
overflow: hidden;
text-overflow: ellipsis;
transition: all 0.3s ease-in-out;
white-space: nowrap;
width: 100%;
}
.main_holder_blog .item_news .meta_data .reading_time {
color: #f2f2f2;
font-size: 0.85rem;
font-weight: 400;
margin-top: 7px;
}
.main_holder_blog .item_news:hover img {
transform: scale(1.1);
}
.main_holder_blog .item_news:hover .meta_data h2 {
color: #f5ad11;
}
/* Blog Pagination */
.pagination {
align-content: center;
align-items: center;
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-bottom: 50px;
width: 100%;
}
.pagination .inner_pagenavi {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 0;
}
.pagination .inner_pagenavi .page-numbers,
.pagination .inner_pagenavi a,
.pagination .inner_pagenavi span {
background: #232323;
border-radius: 18px;
color: #fff;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 1rem;
font-weight: 600;
margin-left: 10px;
margin-bottom: 10px;
min-height: 50px;
min-width: 50px;
padding: 0 14px;
text-align: center;
transition: all 0.2s ease-in-out;
text-decoration: none;
}
.pagination .inner_pagenavi .page-numbers.current,
.pagination .inner_pagenavi .page-numbers:hover,
.pagination .inner_pagenavi a:hover {
background: #f5ad11;
color: #0b0e0f;
}
.pagination .inner_pagenavi .page-numbers.dots {
background: transparent;
cursor: default;
}
/* ===== Blog Post Detail (single-blog) ===== */
.content_container {
min-height: 100vh;
position: relative;
width: 100%;
}
.content_container .header_single_blog {
align-content: center;
align-items: center;
background-color: #1a1a1a;
background-position: center top;
background-size: cover;
display: flex;
flex-wrap: wrap;
height: 600px;
justify-content: center;
position: relative;
width: 100%;
}
.content_container .header_single_blog::before {
background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.8));
border-radius: 3px;
box-shadow: inset 0 -90px 100px -120px rgba(0, 0, 0, 0.7);
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.content_container .header_single_blog .center_block {
margin-top: 150px;
padding: 0 20px;
position: relative;
text-align: center;
z-index: 2;
max-width: 800px;
}
.content_container .header_single_blog .center_block h1 {
color: #f2f2f2;
font-size: 3rem;
font-weight: 800;
line-height: 1.4;
}
.content_container .header_single_blog .center_block h2 {
color: #f2f2f2;
font-size: 1.5rem;
font-weight: 600;
margin-top: 8px;
line-height: 1.5;
}
.content_container .header_single_blog .center_block .meta_data {
color: #f2f2f2;
font-size: 1.1rem;
font-weight: 400;
margin-top: 20px;
}
.content_container .header_single_blog .center_block .meta_data span {
color: #f5ad11;
margin: 0 2px;
}
.content_container .main_blog_content {
padding-bottom: 60px;
}
.content_container .content_text_blog {
margin-top: -100px;
padding: 0 10%;
position: relative;
z-index: 10;
}
.content_container .content_text_blog .inner_content_text_blog {
background: #0c1012;
border-radius: 10px;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.6);
color: #f2f2f2;
font-size: 18.5px;
padding: 30px;
line-height: 1.8;
}
.content_container .content_text_blog .inner_content_text_blog p {
line-height: 36px;
text-align: justify;
margin-bottom: 16px;
}
.content_container .content_text_blog .inner_content_text_blog p a {
border-bottom: 2px solid #f5ad11;
color: #f2f2f2;
padding: 0 0 3px;
}
.content_container .content_text_blog .inner_content_text_blog p a:hover {
color: #f5ad11;
}
.content_container .content_text_blog .inner_content_text_blog h2,
.content_container .content_text_blog .inner_content_text_blog .h2 {
font-size: 27px;
font-weight: 700;
margin: 24px 0 12px;
}
.content_container .content_text_blog .inner_content_text_blog h3,
.content_container .content_text_blog .inner_content_text_blog .h3 {
font-size: 24px;
font-weight: 700;
margin: 20px 0 10px;
}
.content_container .content_text_blog .inner_content_text_blog h4 {
font-size: 20px;
font-weight: 600;
margin: 16px 0 8px;
}
.content_container .content_text_blog .inner_content_text_blog img {
border: none;
border-radius: 8px;
box-shadow: none;
height: auto;
margin: 10px 0;
max-width: 100%;
}
.content_container .content_text_blog .inner_content_text_blog blockquote {
border-right: 4px solid #f5ad11 !important;
color: #f2f2f2 !important;
margin: 20px auto 15px !important;
padding: 15px !important;
position: relative !important;
text-align: justify !important;
background: rgba(245, 173, 17, 0.05);
border-radius: 0 8px 8px 0;
}
.content_container .content_text_blog .inner_content_text_blog blockquote::before {
color: #f5ad11;
content: "❞" !important;
font-size: 70px !important;
position: absolute !important;
right: 17px !important;
top: -15px !important;
line-height: 1;
}
.content_container .content_text_blog .inner_content_text_blog ul,
.content_container .content_text_blog .inner_content_text_blog ol {
margin: 12px 0 12px 20px;
padding-right: 20px;
}
.content_container .content_text_blog .inner_content_text_blog ul li {
list-style: disc;
margin-bottom: 6px;
line-height: 32px;
}
.content_container .content_text_blog .inner_content_text_blog ol li {
list-style: decimal;
margin-bottom: 6px;
line-height: 32px;
}
/* Comments section in blog post */
.content_container .comments_blog {
padding: 0 10%;
margin-top: 30px;
}
/* Responsive */
@media screen and (max-width: 1200px) {
.content_container .content_text_blog {
padding: 0 1%;
}
}
@media screen and (max-width: 900px) {
.main_holder_blog .item_news {
flex: 0 0 calc(50% - 10px);
width: calc(50% - 10px);
}
.content_container .header_single_blog {
height: 400px;
}
.content_container .header_single_blog .center_block h1 {
font-size: 2rem;
}
.content_container .header_single_blog .center_block h2 {
font-size: 1.2rem;
}
}
@media screen and (max-width: 600px) {
.hero_title_archive_blog {
padding: 110px 0 30px;
}
.hero_title_archive_blog h1 {
font-size: 2rem;
}
.main_holder_blog .item_news {
flex: 0 0 calc(100% - 10px);
width: calc(100% - 10px);
height: 220px;
}
.content_container .header_single_blog {
height: 300px;
}
.content_container .header_single_blog .center_block {
margin-top: 80px;
}
.content_container .header_single_blog .center_block h1 {
font-size: 1.5rem;
}
.content_container .content_text_blog {
padding: 0 2%;
margin-top: -50px;
}
.content_container .content_text_blog .inner_content_text_blog {
font-size: 16px;
padding: 20px;
}
.content_container .comments_blog {
padding: 0 2%;
}
}
/* ===== /Blog ===== */
/* ===== Artists Page ===== */
/* No-image fallback for artist cards */
.artist_items_holder .body .item_artist .profile_image .artist_no_image {
width: 100%;
height: 100%;
background: #1a1f22;
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
}
/* ── Artist detail (taxonomy) page ──────────────────── */
.hero_title_artists {
padding: 120px 20px 40px;
}
.hero_title_artists .artist_profile_layout {
display: flex;
flex-flow: row nowrap;
align-items: flex-start;
gap: 40px;
width: 100%;
max-width: 900px;
margin: 0 auto;
position: relative;
z-index: 30;
}
.hero_title_artists .artist_profile_media {
flex: 0 0 200px;
width: 200px;
}
.hero_title_artists .artist_profile_media img {
width: 200px;
height: 260px;
object-fit: cover;
object-position: top;
border-radius: 12px;
display: block;
}
.hero_title_artists .artist_profile_media .artist_no_image {
width: 200px;
height: 260px;
background: rgba(255, 255, 255, 0.06);
border-radius: 12px;
}
.hero_title_artists .artist_profile_meta {
flex: 1;
min-width: 0;
}
.hero_title_artists .artist_profile_meta h1 {
font-size: 2rem;
font-weight: 700;
color: #f2f2f2;
margin-bottom: 6px;
}
.hero_title_artists .artist_persian_name {
font-size: 1.1rem;
color: #ccc;
margin-bottom: 10px;
direction: rtl;
}
.hero_title_artists .meta_data_artists {
font-size: 0.9rem;
color: #aaa;
margin-bottom: 14px;
}
.hero_title_artists .meta_data_artists.career_badge {
background: rgba(245, 173, 17, 0.15);
color: #f5ad11;
border-radius: 6px;
padding: 4px 10px;
display: inline-block;
font-size: 0.85rem;
}
.hero_title_artists .meta_single_list {
list-style: none;
padding: 0;
margin: 0 0 14px;
}
.hero_title_artists .meta_single_list li {
display: flex;
align-items: center;
gap: 8px;
padding: 7px 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.07);
font-size: 0.9rem;
color: #f2f2f2;
}
.hero_title_artists .meta_single_list .label_data_single {
color: #999;
white-space: nowrap;
}
.hero_title_artists .meta_single_list .value_data_single a {
color: #f5ad11;
text-decoration: none;
}
.hero_title_artists .artist_bio {
font-size: 0.9rem;
color: #ccc;
line-height: 1.7;
direction: rtl;
margin-top: 10px;
}
@media screen and (max-width: 600px) {
.hero_title_artists .artist_profile_layout {
flex-direction: column;
align-items: center;
text-align: center;
}
.hero_title_artists .artist_profile_meta h1 {
font-size: 1.5rem;
}
}
/* ===== /Artists Page ===== */
/* ===== Terms Page ===== */
.terms_page_ref {
padding: 120px 0 56px;
}
.terms_card_ref {
max-width: 980px;
margin: 0 auto;
padding: 28px 28px 22px;
border-radius: 14px;
border: 1px solid hsla(0, 0%, 100%, 0.08);
background: linear-gradient(180deg, rgba(20, 24, 29, 0.96) 0%, rgba(13, 16, 20, 0.96) 100%);
box-shadow: 0 14px 44px rgba(0, 0, 0, 0.35);
}
.terms_title_ref {
margin: 0 0 16px;
color: #fff;
font-size: 2rem;
font-weight: 700;
line-height: 1.3;
}
.terms_intro_ref {
margin: 0 0 20px;
color: hsla(0, 0%, 100%, 0.86);
font-size: 1.02rem;
line-height: 2;
}
.terms_dynamic_content_ref h2,
.terms_dynamic_content_ref h3 {
margin: 18px 0 8px;
color: #f5ad11;
font-size: 1.12rem;
font-weight: 700;
}
.terms_dynamic_content_ref p,
.terms_dynamic_content_ref li {
margin: 0 0 10px;
color: hsla(0, 0%, 100%, 0.84);
font-size: 0.98rem;
line-height: 1.95;
}
.terms_dynamic_content_ref ul,
.terms_dynamic_content_ref ol {
margin: 10px 0 16px;
padding-right: 18px;
}
.terms_sign_ref {
margin: 22px 0 0;
padding-top: 16px;
border-top: 1px dashed hsla(0, 0%, 100%, 0.16);
color: hsla(0, 0%, 100%, 0.88);
line-height: 1.9;
}
@media (max-width: 991px) {
.terms_page_ref {
padding-top: 98px;
}
.terms_card_ref {
padding: 22px 18px 16px;
}
.terms_title_ref {
font-size: 1.6rem;
}
}
/* Advanced Search Panel Parity (Namako Style) */
.adv_options_search {
background-color: #0c0e10 !important;
border-radius: 12px !important;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.8) !important;
width: 440px !important;
padding: 10px !important;
margin-top: 15px !important;
border: 1px solid rgba(255, 255, 255, 0.05) !important;
}
.adv_options_search:before {
border-bottom-color: #0c0e10 !important;
left: 30px !important;
}
.adv_options_search .content_row {
padding: 10px !important;
}
.adv_options_search .row {
margin-bottom: 15px !important;
gap: 10px !important;
display: flex !important;
flex-wrap: nowrap !important;
}
.adv_options_search .item_search {
margin: 0 !important;
flex: 1 !important;
}
/* Row 1 Specifics */
.adv_options_search .btnsearchHolder {
flex: 1.2 !important;
}
.adv_options_search .btnadvancedSearch {
background: #f5ad11 !important;
color: #000 !important;
font-weight: 800 !important;
border-radius: 8px !important;
height: 46px !important;
font-size: 14px !important;
margin-bottom: 0 !important;
box-shadow: 0 4px 15px rgba(245, 173, 17, 0.2) !important;
}
.adv_options_search .btnadvancedSearch:hover {
background: #ffc107 !important;
transform: translateY(-1px);
}
/* Dropdown & Input Labels */
.dropdown_filmkio .label_dropdown,
.floatlabelinput .label_placeholder {
background-color: #0c0e10 !important;
color: #9da3a7 !important;
font-size: 11px !important;
font-weight: 600 !important;
padding: 0 6px !important;
right: 12px !important;
top: 0 !important;
transform: translateY(-50%) !important;
}
.dropdown_filmkio .main_dropdown,
.floatlabelinput input {
background: rgba(255, 255, 255, 0.02) !important;
border: 1.5px solid #232a31 !important;
border-radius: 8px !important;
height: 46px !important;
color: #fff !important;
font-size: 13px !important;
padding: 0 12px !important;
}
.dropdown_filmkio .main_dropdown:hover,
.floatlabelinput input:focus {
border-color: #f5ad11 !important;
background: rgba(255, 255, 255, 0.04) !important;
}
.dropdown_filmkio .main_dropdown .dropdown_value {
color: #fff !important;
}
/* Cast/Director/Writer Inputs */
.floatlabelinput {
position: relative !important;
width: 100% !important;
}
/* Release Holder (Year Input) */
.adv_options_search .release_holder {
display: flex !important;
align-items: center !important;
gap: 5px !important;
flex: 1.5 !important;
}
.adv_options_search .release_holder .release_put {
flex: 1 !important;
}
.adv_options_search .release_holder .sep {
color: #6c757d !important;
font-size: 12px !important;
width: auto !important;
padding: 0 2px !important;
}
/* Responsive Search — generic fallback (no scoped page body override) */
@media screen and (max-width: 768px) {
.adv_options_search .row {
flex-wrap: wrap !important;
}
.desktop_only {
display: none !important;
}
.mobile_only {
display: flex !important;
}
}
/* Genre Archive Parity (Namako Style - Final Polish) */
.genre_archive_wrapper {
background: #0b0e0f !important;
min-height: 100vh !important;
color: #fff !important;
padding-top: 90px !important;
padding-bottom: 80px !important;
box-sizing: border-box !important;
}
/* Neutralize theme's flex container */
.genre_archive_wrapper .container,
.genre_hero_section .container,
.archive_controls_row.container,
.main_archive_grid.container {
display: block !important;
max-width: 1400px !important;
margin: 0 auto !important;
}
.genre_hero_section {
height: 480px !important;
position: relative !important;
background-size: cover !important;
background-position: center !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
padding-bottom: 0 !important;
}
.genre_hero_overlay {
position: absolute !important;
inset: 0 !important;
background: linear-gradient(0deg, #0b0e0f 0%, rgba(11, 14, 15, 0.4) 50%, rgba(11, 14, 15, 0.8) 100%) !important;
backdrop-filter: blur(2px) !important;
z-index: 1 !important;
}
.genre_hero_content {
position: relative !important;
z-index: 2 !important;
text-align: center !important;
max-width: 800px !important;
}
.genre_title {
font-size: 2.8rem !important;
font-weight: 800 !important;
margin-bottom: 5px !important;
text-shadow: 0 4px 20px rgba(0, 0, 0, 0.8) !important;
}
.genre_count {
display: block !important;
font-size: 1.1rem !important;
color: rgba(255, 255, 255, 0.6) !important;
font-weight: 500 !important;
}
/* Filter Bar Refinement */
.archive_controls_row {
margin-top: -34px !important;
position: relative !important;
z-index: 2400 !important;
margin-bottom: 76px !important;
}
.archive_filters {
display: flex !important;
justify-content: center !important;
gap: 24px !important;
align-items: flex-end !important;
flex-wrap: nowrap !important;
position: relative !important;
z-index: 2600 !important;
}
.filter_box_item {
display: flex !important;
flex-direction: column !important;
gap: 10px !important;
text-align: right !important;
position: relative !important;
min-width: 0 !important;
width: calc((100% - 48px) / 3) !important;
max-width: 280px !important;
z-index: 1 !important;
}
.filter_box_item label {
font-size: 0.85rem !important;
color: rgba(255, 255, 255, 0.4) !important;
margin-right: 5px !important;
}
.filter_dropdown_trigger {
background: rgba(255, 255, 255, 0.03) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 12px !important;
padding: 0 18px !important;
min-width: 220px !important;
max-width: 280px !important;
height: 50px !important;
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
cursor: pointer !important;
transition: all 0.3s !important;
}
.filter_dropdown_trigger:hover {
background: rgba(255, 255, 255, 0.06) !important;
border-color: rgba(255, 255, 255, 0.2) !important;
}
.filter_dropdown_trigger span {
font-size: 0.95rem !important;
font-weight: 600 !important;
color: #fff !important;
}
.filter_dropdown_trigger svg {
width: 18px !important;
height: 18px !important;
color: rgba(255, 255, 255, 0.4) !important;
transition: transform 0.3s !important;
}
.tm-select.active .filter_dropdown_trigger svg {
transform: rotate(180deg) !important;
}
.tm-select.active {
z-index: 9000 !important;
}
/* Dropdown Menu Style */
.filter_dropdown_menu {
position: absolute !important;
top: 100% !important;
right: 0 !important;
left: auto !important;
background: rgba(15, 18, 20, 0.95) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
backdrop-filter: blur(25px) !important;
border-radius: 15px !important;
margin-top: 10px !important;
z-index: 9500 !important;
min-width: 220px !important;
max-width: 340px !important;
width: max-content !important;
max-height: 320px !important;
overflow-y: auto !important;
overflow-x: hidden !important;
overscroll-behavior: contain !important;
opacity: 0 !important;
visibility: hidden !important;
transform: translateY(10px) !important;
transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1) !important;
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.6) !important;
padding: 8px !important;
pointer-events: none !important;
}
.tm-select.active .filter_dropdown_menu {
opacity: 1 !important;
visibility: visible !important;
transform: translateY(0) !important;
pointer-events: auto !important;
}
.filter_option {
padding: 12px 18px !important;
font-size: 0.9rem !important;
color: rgba(255, 255, 255, 0.6) !important;
cursor: pointer !important;
transition: all 0.2s !important;
border-radius: 10px !important;
text-align: right !important;
}
.filter_option:hover {
background: rgba(255, 255, 255, 0.05) !important;
color: #fff !important;
}
.filter_option.active {
background: #f5ad11 !important;
color: #0b0e0f !important;
font-weight: 700 !important;
}
/* Grid Layout (7 Columns) */
.main_archive_grid {
padding: 0 20px !important;
position: relative !important;
z-index: 1 !important;
margin-top: 4px !important;
}
.row_archive_posts {
display: grid !important;
grid-template-columns: repeat(7, 1fr) !important;
gap: 25px !important;
width: 100% !important;
margin-top: 10px !important;
}
/* Movie Card Refinement */
.item_loop_post {
width: 100% !important;
margin: 0 !important;
position: relative !important;
}
.item_loop_post .bgcover {
height: 310px !important;
/* Larger poster size */
border-radius: 12px !important;
overflow: hidden !important;
position: relative !important;
background-size: cover !important;
background-position: center !important;
border: 1px solid transparent !important;
transition: transform 0.32s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.32s ease, border-color 0.32s ease !important;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.42) !important;
}
.item_loop_post .bgcover::before {
content: "" !important;
position: absolute !important;
inset: 0 !important;
display: none !important;
}
.item_loop_post:hover .bgcover {
transform: translateY(-6px) scale(1.018) !important;
box-shadow: 0 24px 44px rgba(0, 0, 0, 0.62), 0 0 0 1px rgba(245, 173, 17, 0.35) inset !important;
border-color: rgba(245, 173, 17, 0.62) !important;
}
/* Ribbon Badges (Top Right Diagonal) */
.item_loop_post .top_cover_loop {
position: absolute !important;
top: 0 !important;
right: 0 !important;
z-index: 10 !important;
}
.item_loop_post .badge_quality {
display: flex !important;
align-items: center !important;
justify-content: center !important;
position: absolute !important;
top: 15px !important;
right: -30px !important;
width: 120px !important;
height: 24px !important;
text-align: center !important;
transform: rotate(45deg) !important;
font-size: 0.75rem !important;
font-weight: 800 !important;
padding: 0 !important;
margin: 0 !important;
line-height: 1 !important;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5) !important;
color: #0b0e0f !important;
letter-spacing: 0.5px !important;
}
.item_loop_post .badge_quality.badge-subtitled {
background: #f5ad11 !important;
}
.item_loop_post .badge_quality.badge-dubbed {
background: #2d5395 !important;
color: #fff !important;
}
/* IMDB Overlay (Bottom Left) - Deepened and Optimized */
.item_loop_post .bgcover::after {
content: "" !important;
position: absolute !important;
inset: 0 !important;
border-radius: inherit !important;
background: linear-gradient(0deg,
rgba(0, 0, 0, 0.94) 0%,
rgba(0, 0, 0, 0.72) 32%,
rgba(0, 0, 0, 0.4) 60%,
rgba(0, 0, 0, 0.16) 82%,
rgba(0, 0, 0, 0.02) 100%) !important;
z-index: 1 !important;
pointer-events: none !important;
}
.item_loop_post:hover .bgcover::after {
background: linear-gradient(0deg,
rgba(0, 0, 0, 0.9) 0%,
rgba(0, 0, 0, 0.66) 34%,
rgba(0, 0, 0, 0.34) 62%,
rgba(0, 0, 0, 0.13) 84%,
rgba(0, 0, 0, 0.02) 100%) !important;
}
.item_loop_post .imdbRate {
position: absolute !important;
bottom: 52px !important;
left: 12px !important;
z-index: 8 !important;
color: #f5ad11 !important;
font-size: 0.75rem !important;
font-weight: 600 !important;
display: flex !important;
align-items: baseline !important;
gap: 2px !important;
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8) !important;
}
.item_loop_post .imdbRate strong {
font-size: 0.75rem !important;
}
.item_loop_post .imdbRate small {
font-size: 0.65rem !important;
opacity: 0.85 !important;
font-weight: 600 !important;
}
.item_loop_post h2 {
margin-top: 12px !important;
font-size: 0.9rem !important;
text-align: center !important;
font-weight: 600 !important;
color: #fff !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
}
/* Pagination Refinement */
.pagination_wrapper {
margin-top: 60px !important;
}
.pagination_wrapper .nav-links {
display: flex !important;
justify-content: center !important;
align-items: center !important;
gap: 12px !important;
}
.pagination_wrapper .page-numbers {
width: 42px !important;
height: 42px !important;
background: rgba(255, 255, 255, 0.05) !important;
border-radius: 50% !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
color: #fff !important;
font-weight: 700 !important;
font-size: 0.95rem !important;
transition: all 0.3s !important;
}
.pagination_wrapper .page-numbers.current,
.pagination_wrapper .page-numbers:hover {
background: #f5ad11 !important;
color: #0b0e0f !important;
}
.pagination_wrapper .next {
width: auto !important;
padding: 0 20px !important;
border-radius: 25px !important;
background: rgba(255, 255, 255, 0.08) !important;
}
/* Canonical archive parity for movies/series/genre/country/language */
body.post-type-archive-tm_movie .genre_archive_wrapper .row_archive_posts,
body.post-type-archive-tm_series .genre_archive_wrapper .row_archive_posts,
body.tax-tm_genre .genre_archive_wrapper .row_archive_posts,
body.tax-tm_series_genre .genre_archive_wrapper .row_archive_posts,
body.tax-tm_country .genre_archive_wrapper .row_archive_posts,
body.tax-tm_language .genre_archive_wrapper .row_archive_posts {
display: grid !important;
grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
gap: 22px !important;
width: 100% !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .row_archive_posts>.item_loop_post,
body.post-type-archive-tm_series .genre_archive_wrapper .row_archive_posts>.item_loop_post,
body.tax-tm_genre .genre_archive_wrapper .row_archive_posts>.item_loop_post,
body.tax-tm_series_genre .genre_archive_wrapper .row_archive_posts>.item_loop_post,
body.tax-tm_country .genre_archive_wrapper .row_archive_posts>.item_loop_post,
body.tax-tm_language .genre_archive_wrapper .row_archive_posts>.item_loop_post {
width: 100% !important;
min-width: 0 !important;
margin: 0 !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .bgcover,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .bgcover {
height: 330px !important;
border: none !important;
border-radius: 12px !important;
overflow: hidden !important;
position: relative !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post:hover .bgcover,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post:hover .bgcover,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post:hover .bgcover,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post:hover .bgcover,
body.tax-tm_country .genre_archive_wrapper .item_loop_post:hover .bgcover,
body.tax-tm_language .genre_archive_wrapper .item_loop_post:hover .bgcover {
border: 1px solid rgba(245, 173, 17, 0.58) !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .cover_link_loop,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .cover_link_loop,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .cover_link_loop,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .cover_link_loop,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .cover_link_loop,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .cover_link_loop {
display: flex !important;
flex-direction: column !important;
gap: 10px !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .bgcover img,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .bgcover img,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .bgcover img,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .bgcover img,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .bgcover img,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .bgcover img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .bottom_cover_loop {
position: relative !important;
left: auto !important;
right: auto !important;
bottom: auto !important;
height: auto !important;
display: flex !important;
flex-direction: column !important;
justify-content: flex-start !important;
align-items: center !important;
gap: 4px !important;
padding: 8px 4px 0 !important;
z-index: 6 !important;
background: none !important;
pointer-events: auto !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .bottom_cover_loop h2,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .bottom_cover_loop h2,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .bottom_cover_loop h2,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .bottom_cover_loop h2,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .bottom_cover_loop h2,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .bottom_cover_loop h2 {
margin: 0 !important;
width: 100% !important;
color: #fff !important;
font-size: 0.95rem !important;
line-height: 1.4 !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
text-align: center !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .meta_loop_row,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .meta_loop_row,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .meta_loop_row,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .meta_loop_row,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .meta_loop_row,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .meta_loop_row {
width: 100% !important;
min-height: 22px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .year_loop,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .year_loop,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .year_loop,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .year_loop,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .year_loop,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .year_loop {
font-size: 0.8rem !important;
color: rgba(255, 255, 255, 0.78) !important;
line-height: 1.2 !important;
}
@media screen and (max-width: 1280px) {
body.post-type-archive-tm_movie .genre_archive_wrapper .row_archive_posts,
body.post-type-archive-tm_series .genre_archive_wrapper .row_archive_posts,
body.tax-tm_genre .genre_archive_wrapper .row_archive_posts,
body.tax-tm_series_genre .genre_archive_wrapper .row_archive_posts,
body.tax-tm_country .genre_archive_wrapper .row_archive_posts,
body.tax-tm_language .genre_archive_wrapper .row_archive_posts {
grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}
}
@media screen and (max-width: 1024px) {
.archive_controls_row {
margin-bottom: 68px !important;
}
.archive_filters {
gap: 18px !important;
}
.filter_box_item {
min-width: 200px !important;
}
.filter_dropdown_trigger {
min-width: 200px !important;
max-width: 250px !important;
height: 48px !important;
}
.filter_dropdown_menu {
min-width: 200px !important;
max-width: 300px !important;
max-height: 290px !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .row_archive_posts,
body.post-type-archive-tm_series .genre_archive_wrapper .row_archive_posts,
body.tax-tm_genre .genre_archive_wrapper .row_archive_posts,
body.tax-tm_series_genre .genre_archive_wrapper .row_archive_posts,
body.tax-tm_country .genre_archive_wrapper .row_archive_posts,
body.tax-tm_language .genre_archive_wrapper .row_archive_posts {
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .bgcover,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .bgcover {
height: 296px !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .bottom_cover_loop {
height: auto !important;
padding: 6px 2px 0 !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .imdbRate,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .imdbRate,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .imdbRate,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .imdbRate,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .imdbRate,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .imdbRate {
bottom: 10px !important;
left: 10px !important;
font-size: 0.98rem !important;
}
.item_loop_post:hover .bgcover {
transform: translateY(-5px) scale(1.014) !important;
box-shadow: 0 20px 36px rgba(0, 0, 0, 0.56), 0 0 0 1px rgba(245, 173, 17, 0.32) inset !important;
}
}
@media screen and (max-width: 768px) {
.archive_controls_row {
margin-top: -22px !important;
margin-bottom: 58px !important;
}
.archive_filters {
display: flex !important;
width: 100% !important;
justify-content: center !important;
gap: 8px !important;
}
.archive_filters .filter-genre,
.archive_filters .filter-country,
.archive_filters .filter-language {
display: none !important;
}
.filter_box_item {
flex: 1 1 0% !important;
min-width: 0 !important;
width: auto !important;
max-width: none !important;
}
.filter_dropdown_trigger {
min-width: 100% !important;
max-width: 100% !important;
height: 46px !important;
padding: 0 10px !important;
}
.filter_dropdown_trigger span {
font-size: 0.85rem !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
}
.filter_dropdown_trigger svg {
width: 14px !important;
height: 14px !important;
flex-shrink: 0 !important;
}
.filter_box_item label {
font-size: 0.78rem !important;
margin-right: 2px !important;
}
.filter_dropdown_menu {
right: 0 !important;
left: 0 !important;
width: auto !important;
min-width: 0 !important;
max-width: none !important;
max-height: 260px !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .row_archive_posts,
body.post-type-archive-tm_series .genre_archive_wrapper .row_archive_posts,
body.tax-tm_genre .genre_archive_wrapper .row_archive_posts,
body.tax-tm_series_genre .genre_archive_wrapper .row_archive_posts,
body.tax-tm_country .genre_archive_wrapper .row_archive_posts,
body.tax-tm_language .genre_archive_wrapper .row_archive_posts {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 14px !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .bgcover,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .bgcover {
height: 238px !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .bgcover::after,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .bgcover::after,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .bgcover::after,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .bgcover::after,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .bgcover::after,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .bgcover::after {
background: linear-gradient(0deg,
rgba(0, 0, 0, 0.88) 0%,
rgba(0, 0, 0, 0.6) 34%,
rgba(0, 0, 0, 0.3) 62%,
rgba(0, 0, 0, 0.1) 84%,
rgba(0, 0, 0, 0.02) 100%) !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .bottom_cover_loop {
height: auto !important;
padding: 5px 2px 0 !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .imdbRate,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .imdbRate,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .imdbRate,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .imdbRate,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .imdbRate,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .imdbRate {
bottom: 8px !important;
left: 9px !important;
font-size: 0.92rem !important;
}
.item_loop_post:hover .bgcover {
transform: translateY(-3px) scale(1.01) !important;
border-color: rgba(245, 173, 17, 0.55) !important;
}
}
@media screen and (max-width: 540px) {
.archive_controls_row {
margin-bottom: 46px !important;
}
.archive_filters {
gap: 6px !important;
}
.filter_box_item {
width: auto !important;
}
.filter_dropdown_trigger {
height: 42px !important;
padding: 0 8px !important;
}
.filter_dropdown_trigger span {
font-size: 0.8rem !important;
}
.filter_box_item label {
font-size: 0.72rem !important;
}
.filter_dropdown_menu {
max-height: 240px !important;
}
.filter_option {
font-size: 0.86rem !important;
padding: 10px 14px !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .row_archive_posts,
body.post-type-archive-tm_series .genre_archive_wrapper .row_archive_posts,
body.tax-tm_genre .genre_archive_wrapper .row_archive_posts,
body.tax-tm_series_genre .genre_archive_wrapper .row_archive_posts,
body.tax-tm_country .genre_archive_wrapper .row_archive_posts,
body.tax-tm_language .genre_archive_wrapper .row_archive_posts {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 12px !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .bgcover,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .bgcover {
height: 226px !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .bgcover::after,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .bgcover::after,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .bgcover::after,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .bgcover::after,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .bgcover::after,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .bgcover::after {
background: linear-gradient(0deg,
rgba(0, 0, 0, 0.86) 0%,
rgba(0, 0, 0, 0.56) 36%,
rgba(0, 0, 0, 0.27) 66%,
rgba(0, 0, 0, 0.08) 88%,
rgba(0, 0, 0, 0.01) 100%) !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .bottom_cover_loop,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .bottom_cover_loop {
height: 49% !important;
padding: 0 8px 7px !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .imdbRate,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .imdbRate,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .imdbRate,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .imdbRate,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .imdbRate,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .imdbRate {
font-size: 0.88rem !important;
bottom: 34px !important;
left: 8px !important;
}
.item_loop_post:hover .bgcover {
transform: none !important;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.44) !important;
border-color: rgba(245, 173, 17, 0.42) !important;
}
}
/* ─── Homepage: latest movies grid + ribbons ─────────────────────────────── */
body .main_page_container.home_page .latest_movies .body {
display: grid !important;
grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
gap: 22px 16px !important;
width: 100% !important;
align-items: start !important;
}
body .main_page_container.home_page .latest_movies .item_loop_post .bgcover {
height: auto !important;
aspect-ratio: 2 / 3 !important;
max-height: 280px !important;
}
/* Ribbon badges: flat wrap + bottom placement — see poster-cards.css */
body .main_page_container.home_page .latest_movies .item_loop_post .badge.dubbed,
body .main_page_container.home_page .latest_movies .item_loop_post .badge.dubbed_and_subtitle,
body .main_page_container.home_page .latest_movies .item_loop_post .badge_quality.badge-dubbed,
body .main_page_container.home_page .latest_movies .item_loop_post .badge_quality.dubbed_and_subtitle {
background: #2d5395 !important;
color: #fff !important;
}
.item_loop_post .badge.dubbed,
.item_loop_post .badge_quality.badge-dubbed,
.update_series .body .item_series .badge_holder .badge.dubbed,
.item_loop_post .bgcover .badge.dubbed {
background: #2d5395 !important;
color: #fff !important;
}
.item_loop_post .badge.dubbed_and_subtitle,
.item_loop_post .badge_quality.dubbed_and_subtitle,
.update_series .body .item_series .badge_holder .badge.dubbed_and_subtitle,
.item_loop_post .bgcover .badge.dubbed_and_subtitle {
background: #2d5395 !important;
color: #fff !important;
}
.item_loop_post .badge,
.item_loop_post .badge_quality,
.update_series .body .item_series .badge_holder .badge {
display: flex !important;
align-items: center !important;
justify-content: center !important;
text-align: center !important;
line-height: 1.32 !important;
white-space: normal !important;
}
@media (max-width: 1400px) {
body .main_page_container.home_page .latest_movies .body {
grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}
}
@media (max-width: 992px) {
body .main_page_container.home_page .latest_movies .body {
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
}
@media (max-width: 768px) {
body .main_page_container.home_page .latest_movies .body {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
}
@media (max-width: 576px) {
body .main_page_container.home_page .latest_movies .body {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 16px 12px !important;
}
}
/* ─── Homepage: continue watching row ───────────────────────────────────── */
.tm-home-continue-wrap {
margin-top: 20px;
margin-bottom: 8px;
}
/* .container uses row flex in namako; one child otherwise shrinks to the horizontal track width. */
.tm-home-continue-wrap.container {
display: flex !important;
flex-direction: column !important;
flex-wrap: nowrap !important;
align-items: stretch !important;
justify-content: flex-start !important;
width: 100%;
}
.tm-home-continue-wrap>.tm-home-continue {
display: flex;
flex-direction: column;
align-items: stretch;
width: 100%;
}
.tm-home-continue-wrap .more_btn_archive {
width: 100%;
max-width: 100%;
margin-top: 18px;
display: flex;
justify-content: center;
align-items: center;
flex-wrap: nowrap;
box-sizing: border-box;
}
.tm-home-continue-wrap .more_btn_archive a {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: unset;
text-align: center;
box-sizing: border-box;
}
.tm-home-continue h3 {
font-size: 1.2rem;
margin: 0 0 14px;
font-weight: 700;
}
.tm-home-continue__track_wrap {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
padding-bottom: 6px;
}
.tm-home-continue__track.body {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 16px;
min-height: 120px;
align-items: stretch;
}
.tm-home-continue__guest,
.tm-home-continue__empty {
margin: 0;
padding: 12px 4px;
color: rgba(255, 255, 255, 0.75);
}
.tm-home-continue-card {
flex: 0 0 200px;
max-width: 220px;
position: relative;
display: flex;
flex-direction: column;
}
.tm-home-continue-card__thumb {
position: relative;
border-radius: 10px;
overflow: hidden;
background: #111;
flex-shrink: 0;
}
.tm-home-continue-card__thumb img {
display: block;
width: 100%;
height: auto;
aspect-ratio: 16 / 10;
object-fit: cover;
}
.tm-home-continue__remove {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
border: none;
background: #0b0e0f;
color: #fd2f31;
font-size: 0.82rem;
font-weight: 600;
line-height: 1.25;
padding: 5px 18px 7px;
border-radius: 0 0 14px 14px;
cursor: pointer;
z-index: 8;
display: inline-flex;
align-items: center;
justify-content: center;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.45);
transition: background 0.2s ease, color 0.2s ease;
width: auto;
min-width: 3.5rem;
height: auto;
}
.tm-home-continue__remove:hover {
background: #fd2f31;
color: #fff;
}
.tm-home-continue-card__play {
position: absolute;
inset: 0;
z-index: 2;
display: flex;
align-items: center;
justify-content: center;
font-size: 2rem;
color: rgba(255, 255, 255, 0.92);
text-decoration: none;
background: rgba(0, 0, 0, 0.25);
opacity: 0;
transition: opacity 0.2s ease;
}
.tm-home-continue-card:hover .tm-home-continue-card__play {
opacity: 1;
}
.tm-home-continue-card__meta {
font-size: 0.78rem;
color: rgba(255, 255, 255, 0.8);
margin-top: 6px;
line-height: 1.35;
flex-shrink: 0;
}
.tm-home-continue-card__time {
color: #f5ad11;
font-weight: 600;
}
.tm-home-continue-card__bar {
height: 4px;
background: rgba(255, 255, 255, 0.12);
border-radius: 3px;
margin-top: 10px;
overflow: hidden;
flex-shrink: 0;
}
.tm-home-continue-card__bar span {
display: block;
height: 100%;
background: linear-gradient(90deg, #f5ad11, #ffb84d);
border-radius: 3px;
}
.tm-home-continue-card h4,
.tm-home-continue-card__title {
margin: 10px 0 0;
font-size: 0.88rem;
font-weight: 600;
line-height: 1.45;
text-align: right;
min-height: 2.6em;
}
.tm-home-continue-card h4 a,
.tm-home-continue-card__title a {
color: #fff;
text-decoration: none;
}
.tm-home-continue-card h4 a:hover,
.tm-home-continue-card__title a:hover {
color: #f5ad11;
}
/* ─── Dashboard: tracked / watched cards ───────────────────────────────── */
.tm-dashboard-tracked__grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
gap: 18px;
}
.tm-tracked-card .image_holder {
position: relative;
border-radius: 10px;
overflow: hidden;
}
.tm-tracked-card .image_holder img {
display: block;
width: 100%;
height: auto;
aspect-ratio: 16 / 10;
object-fit: cover;
}
.tm-tracked-card__remove {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
width: auto;
min-width: 3.5rem;
height: auto;
border-radius: 0 0 14px 14px;
border: none;
background: #0b0e0f;
color: #fd2f31;
font-size: 0.82rem;
font-weight: 600;
line-height: 1.25;
padding: 5px 18px 7px;
cursor: pointer;
z-index: 20;
display: inline-flex;
align-items: center;
justify-content: center;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.45);
transition: background 0.2s ease, color 0.2s ease;
}
.tm-tracked-card__remove:hover {
background: #fd2f31;
color: #fff;
}
.tm-tracked-card__play {
position: absolute;
inset: 0;
z-index: 2;
display: flex;
align-items: center;
justify-content: center;
font-size: 2rem;
color: #fff;
text-decoration: none;
background: rgba(0, 0, 0, 0.28);
opacity: 0;
transition: opacity 0.2s ease;
}
.tm-tracked-card:hover .tm-tracked-card__play {
opacity: 1;
}
.tm-tracked-card__meta {
display: flex;
justify-content: space-between;
gap: 8px;
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.78);
margin-top: 6px;
}
.tm-tracked-card__time {
color: #f5ad11;
font-weight: 600;
}
.tm-tracked-card__progress {
height: 4px;
background: rgba(255, 255, 255, 0.12);
border-radius: 3px;
margin-top: 8px;
overflow: hidden;
}
.tm-tracked-card__progress-bar {
display: block;
height: 100%;
background: linear-gradient(90deg, #f5ad11, #ffb84d);
border-radius: 3px;
}
.watchlist_holder .remove_watchlist {
position: absolute;
top: 8px;
right: 8px;
width: 30px;
height: 30px;
border-radius: 50%;
background: rgba(198, 40, 40, 0.95);
color: #fff;
display: flex;
align-items: center;
justify-content: center;
font-size: 18px;
cursor: pointer;
z-index: 5;
border: 1px solid rgba(255, 255, 255, 0.25);
}
.watchlist_holder .item_loop_post .bgcover {
position: relative;
}
/* Dashboard header shell stacking: see assets/css/dashboard-header.css (loaded on panel only). */
.mobile-menu-toggle {
align-items: center;
background: rgba(0, 0, 0, 0.18);
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: 13px;
cursor: pointer;
display: none;
flex-direction: column;
gap: 5px;
height: 43px;
justify-content: center;
margin-left: 10px;
position: relative;
width: 43px;
z-index: 2010;
}
.mobile-menu-toggle span {
background: #f2f2f2;
border-radius: 2px;
display: block;
height: 2px;
transition: transform 0.25s ease, opacity 0.25s ease;
width: 20px;
}
.mobile-menu-toggle.active span:nth-child(1) {
transform: translateY(7px) rotate(45deg);
}
.mobile-menu-toggle.active span:nth-child(2) {
opacity: 0;
}
.mobile-menu-toggle.active span:nth-child(3) {
transform: translateY(-7px) rotate(-45deg);
}
.mobile-menu {
background: rgba(10, 13, 16, 0.96);
border-top: 1px solid rgba(255, 255, 255, 0.08);
box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
left: 0;
max-height: calc(100vh - 68px);
opacity: 0;
overflow-y: auto;
padding: 14px 16px 20px;
pointer-events: none;
position: fixed;
right: 0;
top: 68px;
transform: translateY(-12px);
transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease;
visibility: hidden;
z-index: 2005;
}
body.admin-bar .mobile-menu {
top: 100px;
max-height: calc(100vh - 100px);
}
.mobile-menu.active {
opacity: 1;
pointer-events: auto;
transform: translateY(0);
visibility: visible;
}
.mobile-menu__inner {
margin: 0 auto;
max-width: 560px;
}
.mobile-menu__nav ul {
display: block;
margin: 0;
}
.mobile-menu__nav li {
border-bottom: 1px dashed rgba(255, 255, 255, 0.09);
display: block;
}
.mobile-menu__nav a {
color: #f2f2f2;
display: flex;
font-size: 1rem;
font-weight: 700;
justify-content: space-between;
padding: 14px 6px;
}
.mobile-menu__nav a:hover {
color: #f5ad11;
}
.mobile-menu__nav .sub-menu {
background: rgba(255, 255, 255, 0.035);
border-radius: 12px;
margin: 0 0 10px;
padding: 6px 10px;
}
.mobile-menu__nav .sub-menu li {
border-bottom: 0;
}
.mobile-menu__nav .sub-menu a {
font-size: 0.92rem;
font-weight: 500;
padding: 9px 4px;
}
.mobile-menu__actions {
display: flex;
gap: 10px;
margin-top: 16px;
}
.mobile-menu__action {
align-items: center;
background: rgba(255, 255, 255, 0.07);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
color: #f2f2f2;
display: inline-flex;
flex: 1;
font-weight: 700;
justify-content: center;
padding: 12px 10px;
}
.mobile-menu__action--primary {
background: #f5ad11;
color: #0b0e0f;
}
body.mobile-menu-open {
overflow: hidden;
}
@media screen and (max-width: 850px) {
.mobile-menu-toggle {
display: inline-flex;
}
.filmkio_page .filmkio_header .right_side_header .menu_header {
display: none !important;
}
}
@media screen and (max-width: 600px) {
.mobile-menu {
max-height: calc(100vh - 60px);
top: 60px;
}
body.admin-bar .mobile-menu {
max-height: calc(100vh - 106px);
top: 106px;
}
}
/* Home hero: keep the same layout, but let the backdrop artwork read brighter. */
.filmkio_home_slider .image_owl_home::after {
background:
linear-gradient(90deg,
rgba(11, 14, 15, 0.58) 0%,
rgba(11, 14, 15, 0.42) 34%,
rgba(11, 14, 15, 0.02) 64%,
rgba(0, 0, 0, 0.54) 100%),
linear-gradient(0deg,
rgba(11, 14, 15, 0.64) 0%,
rgba(11, 14, 15, 0.02) 46%) !important;
}
.filmkio_home_slider .image_owl_home img {
filter: brightness(1.34) contrast(1.03) saturate(1.09);
}
.filmkio_home_slider .right_side_home_slider {
background: rgba(0, 0, 0, 0.42) !important;
}
@media screen and (max-width: 1100px) {
.filmkio_home_slider .image_owl_home::after {
background:
linear-gradient(90deg,
rgba(11, 14, 15, 0.5) 0%,
rgba(11, 14, 15, 0.28) 38%,
rgba(11, 14, 15, 0.02) 68%,
rgba(0, 0, 0, 0.42) 100%),
linear-gradient(0deg,
rgba(11, 14, 15, 0.58) 0%,
rgba(11, 14, 15, 0.03) 48%) !important;
}
.filmkio_home_slider .image_owl_home img {
filter: brightness(1.38) contrast(1.02) saturate(1.08);
}
.filmkio_home_slider .right_side_home_slider {
background: rgba(0, 0, 0, 0.34) !important;
}
}
@media screen and (max-width: 700px) {
.filmkio_home_slider .image_owl_home::after {
background:
linear-gradient(0deg,
rgba(11, 14, 15, 0.62) 0%,
rgba(11, 14, 15, 0.08) 48%,
rgba(11, 14, 15, 0.28) 100%) !important;
}
.filmkio_home_slider .image_owl_home img {
filter: brightness(1.42) contrast(1.01) saturate(1.08);
}
.filmkio_home_slider .right_side_home_slider {
background: rgba(0, 0, 0, 0.26) !important;
}
}
/* Mobile navigation is controlled by the existing bottom "منو" button. */
@media screen and (max-width: 1100px) {
.filmkio_page .filmkio_header .right_side_header .menu_header,
.filmkio_page .filmkio_header .right_side_header .menu_header ul,
.filmkio_header .right_side_header .menu_header,
.filmkio_header .right_side_header .menu_header ul {
display: none !important;
}
.mobile_footer_menu {
display: block !important;
z-index: 99999 !important;
}
body.page-template-sign-in .mobile_footer_menu,
body.play_online .mobile_footer_menu {
display: none !important;
}
.filmkio_page {
padding-bottom: calc(80px + env(safe-area-inset-bottom, 0px));
}
.side_menu_mobile {
display: flex !important;
flex-direction: column !important;
width: 86vw !important;
max-width: 430px !important;
}
.side_menu_mobile .mobile_links_menu ul {
margin-top: 20px;
}
.side_menu_mobile .mobile_links_menu li {
margin-bottom: 6px;
position: relative;
}
.side_menu_mobile .mobile_links_menu a {
align-items: center;
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.06);
border-radius: 10px;
color: #f2f2f2;
display: flex;
font-size: 0.9rem;
font-weight: 600;
justify-content: space-between;
min-height: 40px;
padding: 8px 12px;
}
.side_menu_mobile .mobile_links_menu a .link_label {
display: flex !important;
align-items: center !important;
gap: 12px !important;
}
.side_menu_mobile .mobile_links_menu a .link_label i {
font-size: 1.15rem !important;
color: rgba(255, 255, 255, 0.6) !important;
transition: color 0.25s ease !important;
width: 20px !important;
text-align: center !important;
}
.side_menu_mobile .mobile_links_menu a:hover .link_label i {
color: #f5ad11 !important;
}
.side_menu_mobile .mobile_links_menu a .arrow_icon {
font-size: 0.8rem !important;
color: rgba(255, 255, 255, 0.3) !important;
transition: transform 0.25s ease, color 0.25s ease !important;
}
.side_menu_mobile .mobile_links_menu a:hover .arrow_icon {
transform: translateX(-4px) !important;
color: #f5ad11 !important;
}
.side_menu_mobile .mobile_links_menu a:hover {
border-color: rgba(245, 173, 17, 0.45);
color: #f5ad11;
}
.side_menu_mobile .mobile_links_menu .sub-menu {
display: none;
margin: 8px 10px 0 0;
padding-bottom: 0;
}
.side_menu_mobile .mobile_links_menu li.is-open>.sub-menu {
animation: mobileAccordionIn 0.22s ease both;
display: block;
}
.side_menu_mobile .mobile_links_menu .sub-menu a {
background: rgba(255, 255, 255, 0.025);
font-size: 0.92rem;
font-weight: 500;
padding: 10px 12px 8px;
}
.side_menu_mobile .mobile-submenu-toggle {
align-items: center;
background: rgba(245, 173, 17, 0.1);
border: 1px solid rgba(245, 173, 17, 0.18);
border-radius: 10px;
cursor: pointer;
display: inline-flex;
height: 34px;
justify-content: center;
left: 7px;
position: absolute;
top: 7px;
transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
width: 34px;
z-index: 2;
}
.side_menu_mobile .mobile-submenu-toggle span {
border-bottom: 2px solid #f5ad11;
border-left: 2px solid #f5ad11;
display: block;
height: 8px;
transform: rotate(-45deg);
transition: transform 0.2s ease;
width: 8px;
}
.side_menu_mobile li.is-open>.mobile-submenu-toggle {
background: rgba(245, 173, 17, 0.18);
border-color: rgba(245, 173, 17, 0.42);
}
.side_menu_mobile li.is-open>.mobile-submenu-toggle span {
transform: rotate(135deg);
}
}
@keyframes mobileAccordionIn {
from {
opacity: 0;
transform: translateY(-6px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@media screen and (min-width: 1101px) {
.mobile_footer_menu {
display: none !important;
}
.filmkio_page {
padding-bottom: 0;
}
}
@media screen and (max-width: 480px) {
.mobile_footer_menu ul li span {
font-size: 0.8rem !important;
}
.mobile_footer_menu ul li .icon_holder .icon,
.mobile_footer_menu ul li svg.icon {
height: 26px !important;
width: 26px !important;
}
.mobile_footer_menu ul li .btn_mobile_menu {
padding: 8px 2px 10px !important;
}
.side_menu_mobile {
width: 88vw;
}
}
/* Home slider posters: keep the original grid spacing; only enlarge the poster artwork slightly. */
.filmkio_home_slider .home_owl_slider.tm-home-carousel {
gap: 15px;
max-height: 630px;
padding: 20px;
}
.filmkio_home_slider .home_owl_slider.tm-home-carousel .item_loop_post .bgcover {
border: 1px solid rgba(0, 0, 0, 0.88);
min-height: 306px;
height: auto !important;
aspect-ratio: 2 / 3;
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.42);
transform: scale(1.11);
transform-origin: center center;
}
@media screen and (max-width: 1100px) {
.filmkio_home_slider .home_owl_slider.tm-home-carousel {
gap: 15px;
padding: 20px;
}
.filmkio_home_slider .home_owl_slider.tm-home-carousel .item_loop_post .bgcover {
min-height: 292px;
transform: scale(1.09);
}
}
@media screen and (max-width: 700px) {
.filmkio_home_slider .home_owl_slider.tm-home-carousel {
flex-wrap: wrap;
overflow-x: hidden;
padding: 20px;
}
.filmkio_home_slider .home_owl_slider.tm-home-carousel .item_loop_post .bgcover {
min-height: 250px;
transform: scale(1.07);
}
}
@media screen and (max-width: 430px) {
.filmkio_home_slider .home_owl_slider.tm-home-carousel {
gap: 10px;
padding: 14px;
}
.filmkio_home_slider .home_owl_slider.tm-home-carousel .item_loop_post .bgcover {
min-height: 210px;
transform: scale(1.06);
}
}
@media screen and (max-width: 1100px) {
.mobile_footer_menu {
isolation: isolate;
pointer-events: auto !important;
left: 50% !important;
right: auto !important;
width: min(92vw, 420px) !important;
max-width: 420px !important;
bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
border-radius: 36px !important;
overflow: hidden !important;
background: rgba(18, 20, 22, 0.92) !important;
backdrop-filter: saturate(180%) blur(18px) !important;
-webkit-backdrop-filter: saturate(180%) blur(18px) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
box-shadow:
0 10px 40px rgba(0, 0, 0, 0.35),
0 1px 0 rgba(255, 255, 255, 0.06) inset !important;
transform: translate3d(-50%, 0, 0) !important;
z-index: 12000 !important;
}
.mobile_footer_menu ul {
justify-content: space-evenly !important;
padding: 8px 6px 10px !important;
gap: 2px !important;
}
.mobile_footer_menu ul li {
width: auto !important;
flex: 1 1 0 !important;
max-width: none !important;
}
.mobile_footer_menu ul li .btn_mobile_menu {
min-height: 44px !important;
padding: 6px 2px 8px !important;
}
.mobile_footer_menu ul li .icon_holder .icon,
.mobile_footer_menu ul li svg.icon {
width: 22px !important;
height: 22px !important;
margin-bottom: 4px !important;
}
.mobile_footer_menu ul li span {
font-size: 0.72rem !important;
font-weight: 600 !important;
}
.mobile_footer_menu .btn_mobile_menu {
cursor: pointer;
touch-action: manipulation;
-webkit-tap-highlight-color: transparent;
}
.overlay_popup {
z-index: 100000 !important;
}
.side_menu_mobile {
z-index: 100050 !important;
right: 0 !important;
transform: translateX(100%) !important;
}
.side_menu_mobile.active {
transform: translateX(0) !important;
}
}
@media screen and (max-width: 1100px) {
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .bgcover,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .bgcover,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .bgcover,
body .archive_site .item_loop_post .bgcover,
body .main_archive .item_loop_post .bgcover {
aspect-ratio: 2 / 3 !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
background-position: center !important;
background-size: cover !important;
}
body.post-type-archive-tm_movie .genre_archive_wrapper .item_loop_post .bgcover img,
body.post-type-archive-tm_series .genre_archive_wrapper .item_loop_post .bgcover img,
body.tax-tm_genre .genre_archive_wrapper .item_loop_post .bgcover img,
body.tax-tm_series_genre .genre_archive_wrapper .item_loop_post .bgcover img,
body.tax-tm_country .genre_archive_wrapper .item_loop_post .bgcover img,
body.tax-tm_language .genre_archive_wrapper .item_loop_post .bgcover img,
body .archive_site .item_loop_post .bgcover img,
body .main_archive .item_loop_post .bgcover img {
height: 100% !important;
object-fit: cover !important;
width: 100% !important;
}
}
/* ─── Premium Responsive Dashboard Watched History Grid ───────────────── */
/* Layout Stretch fixes for dashboard tabs to prevent collapsing under flex containers */
.wached_items,
.archive_watched,
.watchlist_holder,
.tm-dashboard-tracked {
width: 100% !important;
display: block !important;
box-sizing: border-box !important;
}
.tm-dashboard-tracked__grid {
display: grid !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
gap: 20px !important;
width: 100% !important;
padding: 10px 0 !important;
}
.tm-tracked-card {
background: rgba(17, 22, 24, 0.65) !important;
border: 1px solid rgba(255, 255, 255, 0.05) !important;
border-radius: 12px !important;
padding: 8px !important;
transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease !important;
display: flex !important;
flex-direction: column !important;
justify-content: space-between !important;
box-sizing: border-box !important;
}
.tm-tracked-card:hover {
transform: translateY(-4px) !important;
border-color: rgba(245, 173, 17, 0.3) !important;
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.55) !important;
}
.tm-tracked-card .image_holder {
border-radius: 10px !important;
border: 1px solid #000000 !important;
overflow: hidden !important;
position: relative !important;
aspect-ratio: 2 / 3 !important;
width: 100% !important;
display: block !important;
}
.tm-tracked-card .image_holder a {
display: block !important;
width: 100% !important;
height: 100% !important;
}
.tm-tracked-card .image_holder img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
display: block !important;
}
.tm-tracked-card .bottom_wached {
padding-top: 8px !important;
}
.tm-tracked-card .bottom_wached h3 {
margin: 0 !important;
font-size: 0.84rem !important;
font-weight: 600 !important;
line-height: 1.4 !important;
text-align: right !important;
}
.tm-tracked-card .bottom_wached h3 a {
color: rgba(255, 255, 255, 0.95) !important;
transition: color 0.2s ease !important;
}
.tm-tracked-card:hover .bottom_wached h3 a {
color: #f5ad11 !important;
}
/* Responsive Dashboard Media Queries */
@media screen and (max-width: 1400px) {
.tm-dashboard-tracked__grid {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 18px !important;
}
}
@media screen and (max-width: 1200px) {
.tm-dashboard-tracked__grid {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 16px !important;
}
}
@media screen and (max-width: 992px) {
.tm-dashboard-tracked__grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 14px !important;
}
}
@media screen and (max-width: 768px) {
.tm-dashboard-tracked__grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 12px !important;
}
.filmkio_dashboard .dashboard_users .main_dashboard .inner_main_dashboard {
padding: 15px !important;
box-sizing: border-box !important;
}
}
@media screen and (max-width: 480px) {
.tm-dashboard-tracked__grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 10px !important;
}
.tm-tracked-card {
padding: 6px !important;
}
.tm-tracked-card .bottom_wached h3 {
font-size: 0.78rem !important;
}
.tm-tracked-card__remove {
padding: 4px 10px 5px !important;
font-size: 0.7rem !important;
}
.tm-tracked-card__meta {
font-size: 0.68rem !important;
flex-direction: column !important;
gap: 2px !important;
align-items: flex-start !important;
}
}
/* Local SVG Play Icon Customization */
.tm-tracked-card__play svg {
width: 48px !important;
height: 48px !important;
fill: #f5ad11 !important;
filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.5)) !important;
transition: transform 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}
.tm-tracked-card__play:hover svg {
transform: scale(1.15) !important;
}
.tm-home-continue-card__play svg {
width: 48px !important;
height: 48px !important;
fill: #f5ad11 !important;
filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.5)) !important;
transition: transform 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}
.tm-home-continue-card__play:hover svg {
transform: scale(1.15) !important;
}
/* Premium item_loop_post Watched Card integration */
.tm-dashboard-tracked__grid .item_loop_post.item_wached {
background: transparent !important;
border: none !important;
box-shadow: none !important;
padding: 0 !important;
}
.tm-dashboard-tracked__grid .item_loop_post.item_wached .inner_loop_post {
background: rgba(17, 22, 24, 0.65) !important;
border: 1px solid rgba(255, 255, 255, 0.05) !important;
border-radius: 12px !important;
padding: 8px !important;
box-sizing: border-box !important;
transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease !important;
}
.tm-dashboard-tracked__grid .item_loop_post.item_wached:hover .inner_loop_post {
transform: translateY(-4px) !important;
border-color: rgba(245, 173, 17, 0.3) !important;
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.55) !important;
}
/* bgcover (poster container) overrides */
.tm-dashboard-tracked__grid .item_loop_post.item_wached .bgcover {
position: relative !important;
border-radius: 10px !important;
border: 1px solid #000000 !important;
overflow: hidden !important;
aspect-ratio: 2 / 3 !important;
width: 100% !important;
display: block !important;
margin: 0 !important;
padding: 0 !important;
}
.tm-dashboard-tracked__grid .item_loop_post.item_wached .bgcover a {
display: block !important;
width: 100% !important;
height: 100% !important;
padding: 0 !important;
margin: 0 !important;
}
.tm-dashboard-tracked__grid .item_loop_post.item_wached .bgcover img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
display: block !important;
}
/* Absolute Delete Button */
.tm-tracked-card__remove {
position: absolute !important;
top: 8px !important;
left: 8px !important;
width: 28px !important;
height: 28px !important;
background: rgba(17, 22, 24, 0.8) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 50% !important;
color: rgba(255, 255, 255, 0.7) !important;
font-size: 16px !important;
line-height: 26px !important;
text-align: center !important;
padding: 0 !important;
margin: 0 !important;
cursor: pointer !important;
z-index: 10 !important;
transform: none !important;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3) !important;
transition: all 0.2s ease !important;
}
.tm-tracked-card__remove:hover {
background: #fd2f31 !important;
color: #fff !important;
border-color: #fd2f31 !important;
transform: scale(1.1) !important;
}
/* Absolute Play Button Overlays */
.tm-tracked-card__play {
position: absolute !important;
inset: 0 !important;
z-index: 2 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
background: rgba(0, 0, 0, 0.28) !important;
opacity: 0 !important;
transition: opacity 0.2s ease !important;
}
.tm-dashboard-tracked__grid .item_loop_post.item_wached:hover .tm-tracked-card__play {
opacity: 1 !important;
}
/* Absolute Progress Bar at the bottom of the poster image */
.tm-tracked-card__progress {
position: absolute !important;
bottom: 0 !important;
left: 0 !important;
right: 0 !important;
height: 5px !important;
background: rgba(255, 255, 255, 0.2) !important;
z-index: 5 !important;
margin: 0 !important;
border-radius: 0 !important;
overflow: hidden !important;
}
.tm-tracked-card__progress-bar {
display: block !important;
height: 100% !important;
background: #f5ad11 !important;
box-shadow: 0 0 8px #f5ad11 !important;
}
/* Meta Data section above title */
.tm-tracked-card__meta {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
padding: 8px 2px 2px !important;
font-size: 0.74rem !important;
color: rgba(255, 255, 255, 0.5) !important;
margin: 0 !important;
}
.tm-tracked-card__time {
color: #f5ad11 !important;
font-weight: 500 !important;
}
/* Title h2 Overrides matching loop-movie/series */
.tm-dashboard-tracked__grid .item_loop_post.item_wached h2 {
font-size: 0.84rem !important;
font-weight: 600 !important;
margin: 6px 0 0 !important;
line-height: 1.4 !important;
text-align: right !important;
padding: 0 2px !important;
}
.tm-dashboard-tracked__grid .item_loop_post.item_wached h2 a {
color: rgba(255, 255, 255, 0.95) !important;
transition: color 0.2s ease !important;
}
.tm-dashboard-tracked__grid .item_loop_post.item_wached h2 a:hover {
color: #f5ad11 !important;
}
/* 🏆 Dashboard Title Counts Badge */
.tm-dashboard-badge {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
background: rgba(245, 173, 17, 0.15) !important;
color: #f5ad11 !important;
font-size: 0.72rem !important;
font-weight: 600 !important;
padding: 4px 10px !important;
border-radius: 20px !important;
border: 1px solid rgba(245, 173, 17, 0.25) !important;
margin-right: 8px !important;
vertical-align: middle !important;
}
/* 🎯 Floating Progress Bubble */
.tm-tracked-card__pct-badge {
position: absolute !important;
bottom: 12px !important;
right: 8px !important;
background: rgba(11, 14, 15, 0.85) !important;
color: #f5ad11 !important;
font-size: 0.68rem !important;
font-weight: 700 !important;
padding: 2px 7px 3px !important;
border-radius: 4px !important;
border: 1px solid rgba(245, 173, 17, 0.3) !important;
z-index: 6 !important;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5) !important;
}
/* 🎬 Floating Gold Play Button Circle */
.play-btn-circle {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 52px !important;
height: 52px !important;
background: #f5ad11 !important;
border-radius: 50% !important;
box-shadow: 0 4px 15px rgba(245, 173, 17, 0.5) !important;
transform: scale(0.85) !important;
transition: transform 0.28s cubic-bezier(0.175, 0.885, 0.32, 1.275), background 0.25s ease !important;
}
.tm-tracked-card__play:hover .play-btn-circle {
transform: scale(1) !important;
background: #ffffff !important;
box-shadow: 0 6px 20px rgba(255, 255, 255, 0.6) !important;
}
.play-btn-circle svg {
width: 24px !important;
height: 24px !important;
fill: #0b0e0f !important;
margin-left: -2px !important;
}
/* 🪟 Premium Glassmorphic Empty State */
.tm-glass-empty-state {
background: rgba(17, 22, 24, 0.45) !important;
border: 1px dashed rgba(255, 255, 255, 0.08) !important;
backdrop-filter: blur(8px) !important;
border-radius: 16px !important;
padding: 40px 20px !important;
text-align: center !important;
margin: 20px 0 !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
}
.tm-glass-empty-state .empty-icon-wrap {
width: 64px !important;
height: 64px !important;
background: rgba(245, 173, 17, 0.08) !important;
border: 1px solid rgba(245, 173, 17, 0.15) !important;
border-radius: 50% !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
margin-bottom: 16px !important;
color: #f5ad11 !important;
}
.tm-glass-empty-state .empty-icon-wrap svg {
width: 32px !important;
height: 32px !important;
}
.tm-glass-empty-state p {
font-size: 0.92rem !important;
color: rgba(255, 255, 255, 0.7) !important;
margin-bottom: 20px !important;
}
.tm-glass-empty-state .btn_buy_sub {
background: linear-gradient(135deg, #f5ad11, #e09907) !important;
color: #0b0e0f !important;
font-weight: 700 !important;
font-size: 0.88rem !important;
padding: 10px 24px !important;
border-radius: 8px !important;
box-shadow: 0 4px 15px rgba(245, 173, 17, 0.3) !important;
transition: all 0.25s ease !important;
border: none !important;
}
.tm-glass-empty-state .btn_buy_sub:hover {
transform: translateY(-2px) !important;
box-shadow: 0 6px 20px rgba(245, 173, 17, 0.45) !important;
filter: brightness(1.1) !important;
}
/* Homepage Match: Watched Dashboard Card styling */
.tm-dashboard-watched-card {
width: 100% !important;
max-width: none !important;
flex: none !important;
display: flex !important;
flex-direction: column !important;
box-sizing: border-box !important;
background: rgba(17, 22, 24, 0.65) !important;
border: 1px solid rgba(255, 255, 255, 0.05) !important;
border-radius: 12px !important;
padding: 10px !important;
transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.28s ease, border-color 0.28s ease !important;
}
.tm-dashboard-watched-card:hover {
transform: translateY(-4px) !important;
border-color: rgba(245, 173, 17, 0.3) !important;
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.55) !important;
}
.tm-dashboard-watched-card .tm-home-continue-card__thumb {
position: relative !important;
border-radius: 10px !important;
border: 1px solid #000000 !important;
overflow: hidden !important;
aspect-ratio: 16 / 10 !important;
width: 100% !important;
display: block !important;
background: #111 !important;
}
.tm-dashboard-watched-card .tm-home-continue-card__thumb img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
display: block !important;
}
.tm-dashboard-watched-card .tm-home-continue__remove {
position: absolute !important;
top: 0 !important;
left: 50% !important;
transform: translateX(-50%) !important;
border: none !important;
background: #0b0e0f !important;
color: #fd2f31 !important;
font-size: 0.82rem !important;
font-weight: 600 !important;
line-height: 1.25 !important;
padding: 5px 18px 7px !important;
border-radius: 0 0 14px 14px !important;
cursor: pointer !important;
z-index: 8 !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.45) !important;
transition: background 0.2s ease, color 0.2s ease !important;
width: auto !important;
min-width: 3.5rem !important;
height: auto !important;
}
.tm-dashboard-watched-card .tm-home-continue__remove:hover {
background: #fd2f31 !important;
color: #fff !important;
}
.tm-dashboard-watched-card .tm-home-continue-card__play {
position: absolute !important;
inset: 0 !important;
z-index: 2 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
background: rgba(0, 0, 0, 0.28) !important;
opacity: 0 !important;
transition: opacity 0.2s ease !important;
}
.tm-dashboard-watched-card:hover .tm-home-continue-card__play {
opacity: 1 !important;
}
.tm-dashboard-watched-card .tm-home-continue-card__play svg {
width: 48px !important;
height: 48px !important;
fill: #f5ad11 !important;
filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.5)) !important;
transition: transform 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}
.tm-dashboard-watched-card .tm-home-continue-card__play:hover svg {
transform: scale(1.15) !important;
}
.tm-dashboard-watched-card .tm-home-continue-card__title {
font-size: 0.86rem !important;
font-weight: 600 !important;
margin: 10px 0 4px !important;
line-height: 1.4 !important;
text-align: right !important;
}
.tm-dashboard-watched-card .tm-home-continue-card__title a {
color: rgba(255, 255, 255, 0.95) !important;
transition: color 0.2s ease !important;
}
.tm-dashboard-watched-card .tm-home-continue-card__title a:hover {
color: #f5ad11 !important;
}
.tm-dashboard-watched-card .tm-home-continue-card__meta {
font-size: 0.72rem !important;
color: rgba(255, 255, 255, 0.5) !important;
text-align: right !important;
margin-bottom: 8px !important;
direction: rtl !important;
}
.tm-dashboard-watched-card .tm-home-continue-card__time {
color: #f5ad11 !important;
font-weight: 600 !important;
}
.tm-dashboard-watched-card .tm-home-continue-card__bar {
height: 4px !important;
background: rgba(255, 255, 255, 0.12) !important;
border-radius: 3px !important;
margin-top: 4px !important;
overflow: hidden !important;
width: 100% !important;
}
.tm-dashboard-watched-card .tm-home-continue-card__bar span {
display: block !important;
height: 100% !important;
background: linear-gradient(90deg, #f5ad11, #ffb84d) !important;
border-radius: 3px !important;
}
/* 🛡️ Sidebar Alignment & Flex Blowout Prevention */
.filmkio_dashboard .dashboard_users .main_dashboard .inner_main_dashboard {
min-width: 0 !important;
box-sizing: border-box !important;
}
.wached_items.archive_watched.tm-dashboard-tracked {
width: 100% !important;
max-width: 100% !important;
box-sizing: border-box !important;
display: block !important;
padding: 0 15px !important;
}
/* 📊 Landscape Responsive Column Grid */
.tm-dashboard-tracked__grid {
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 20px !important;
width: 100% !important;
box-sizing: border-box !important;
margin: 0 !important;
padding: 10px 0 !important;
}
@media screen and (max-width: 1200px) {
.tm-dashboard-tracked__grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 16px !important;
}
}
@media screen and (max-width: 768px) {
.wached_items.archive_watched.tm-dashboard-tracked {
padding: 0 8px !important;
}
.tm-dashboard-tracked__grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 12px !important;
}
}
@media screen and (max-width: 576px) {
.tm-dashboard-tracked__grid {
grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
gap: 14px !important;
}
.tm-dashboard-watched-card {
padding: 8px !important;
}
}
/* 🎬 Premium Watchlist Dashboard Grid Restoration */
.watchlist_holder .body {
display: grid !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
gap: 20px !important;
width: 100% !important;
box-sizing: border-box !important;
padding: 10px 0 !important;
margin: 0 !important;
}
.watchlist_holder .item_loop_post {
width: 100% !important;
max-width: none !important;
flex: none !important;
box-sizing: border-box !important;
}
.watchlist_holder .item_loop_post .bgcover {
aspect-ratio: 2 / 3 !important;
width: 100% !important;
border-radius: 10px !important;
border: 1px solid #000000 !important;
overflow: hidden !important;
display: block !important;
position: relative !important;
}
.watchlist_holder .item_loop_post .bgcover img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
display: block !important;
}
@media screen and (max-width: 1200px) {
.watchlist_holder .body {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 16px !important;
}
}
@media screen and (max-width: 768px) {
.watchlist_holder .body {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 12px !important;
}
}
@media screen and (max-width: 480px) {
.watchlist_holder .body {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 10px !important;
}
}
/* 🚨 Premium Glassmorphic 404 Page Styling */
.tm-404-page-wrapper {
min-height: 90vh !important;
background: radial-gradient(circle at 50% 50%, #161c1e 0%, #0b0e0f 100%) !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
padding: 150px 20px 80px !important;
box-sizing: border-box !important;
}
.tm-404-glass-box {
background: rgba(17, 22, 24, 0.7) !important;
-webkit-backdrop-filter: blur(16px) !important;
backdrop-filter: blur(16px) !important;
border: 1px solid rgba(255, 255, 255, 0.08) !important;
border-radius: 24px !important;
max-width: 600px !important;
width: 100% !important;
padding: 50px 40px !important;
text-align: center !important;
box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4) !important;
box-sizing: border-box !important;
}
.tm-404-glitch-number {
font-size: 110px !important;
font-weight: 900 !important;
line-height: 1 !important;
background: linear-gradient(135deg, #ff9f43 0%, #f5ad11 100%) !important;
-webkit-background-clip: text !important;
-webkit-text-fill-color: transparent !important;
margin-bottom: 10px !important;
letter-spacing: -2px !important;
text-shadow: 0 10px 20px rgba(245, 173, 17, 0.2) !important;
}
.tm-404-icon-wrap {
width: 70px !important;
height: 70px !important;
background: rgba(245, 173, 17, 0.1) !important;
border-radius: 50% !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
margin: 0 auto 24px !important;
color: #f5ad11 !important;
}
.tm-404-icon-wrap svg {
width: 36px !important;
height: 36px !important;
}
.tm-404-title {
color: #ffffff !important;
font-size: 24px !important;
font-weight: 700 !important;
margin: 0 0 14px 0 !important;
}
.tm-404-desc {
color: #a0aec0 !important;
font-size: 15px !important;
line-height: 1.7 !important;
margin: 0 0 35px 0 !important;
}
/* 404 Search */
.tm-404-search-box {
max-width: 420px !important;
margin: 0 auto 30px !important;
}
.tm-404-search-form {
position: relative !important;
display: flex !important;
align-items: center !important;
width: 100% !important;
}
.tm-404-search-input {
width: 100% !important;
height: 52px !important;
background: rgba(0, 0, 0, 0.4) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 30px !important;
padding: 0 25px 0 60px !important;
color: #fff !important;
font-size: 14px !important;
outline: none !important;
transition: all 0.3s ease !important;
box-sizing: border-box !important;
}
.tm-404-search-input:focus {
border-color: #f5ad11 !important;
box-shadow: 0 0 12px rgba(245, 173, 17, 0.25) !important;
}
.tm-404-search-btn {
position: absolute !important;
left: 6px !important;
width: 40px !important;
height: 40px !important;
background: #f5ad11 !important;
border: none !important;
border-radius: 50% !important;
color: #0b0e0f !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
cursor: pointer !important;
transition: all 0.3s ease !important;
}
.tm-404-search-btn:hover {
background: #ff9f43 !important;
transform: scale(1.05) !important;
}
.tm-404-search-btn svg {
width: 18px !important;
height: 18px !important;
}
/* Home Button */
.tm-404-btn-home {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
background: linear-gradient(135deg, #f5ad11 0%, #ff9f43 100%) !important;
color: #0b0e0f !important;
font-size: 15px !important;
font-weight: 700 !important;
padding: 14px 35px !important;
border-radius: 30px !important;
text-decoration: none !important;
transition: all 0.3s ease !important;
box-shadow: 0 10px 20px rgba(245, 173, 17, 0.2) !important;
}
.tm-404-btn-home:hover {
transform: translateY(-2px) !important;
box-shadow: 0 12px 24px rgba(245, 173, 17, 0.3) !important;
}
@media screen and (max-width: 768px) {
.tm-404-page-wrapper {
padding-top: 120px !important;
}
.tm-404-glass-box {
padding: 35px 25px !important;
}
.tm-404-glitch-number {
font-size: 85px !important;
}
}
/* Premium Glassmorphic Membership Gate Modal */
.tamasha-member-gate-modal {
position: fixed;
inset: 0;
z-index: 999999;
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
visibility: hidden;
transition: opacity 0.4s ease, visibility 0.4s ease;
}
.tamasha-member-gate-modal.is-active {
opacity: 1;
visibility: visible;
}
.tamasha-member-gate-overlay {
position: absolute;
inset: 0;
background: rgba(10, 13, 16, 0.85);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
}
.tamasha-member-gate-container {
position: relative;
width: 90%;
max-width: 460px;
background: rgba(20, 24, 28, 0.75);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 24px;
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.15);
padding: 30px;
transform: scale(0.92);
transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
z-index: 10;
text-align: center;
}
.tamasha-member-gate-modal.is-active .tamasha-member-gate-container {
transform: scale(1);
}
.tamasha-member-gate-close {
position: absolute;
top: 15px;
left: 15px;
width: 32px;
height: 32px;
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 50%;
color: #fff;
font-size: 22px;
line-height: 28px;
text-align: center;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
}
.tamasha-member-gate-close:hover {
background: #f5ad11;
color: #0b0e0f;
border-color: #f5ad11;
}
.tamasha-member-gate-content {
display: flex;
flex-direction: column;
align-items: center;
gap: 16px;
}
.tamasha-member-gate-content .icon-lock-holder {
width: 64px;
height: 64px;
background: rgba(245, 173, 17, 0.1);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
color: #f5ad11;
margin-bottom: 8px;
}
.tamasha-member-gate-content .icon-lock {
width: 32px;
height: 32px;
}
.tamasha-member-gate-content h3 {
font-size: 1.4rem;
font-weight: 800;
color: #fff;
margin: 0;
}
.tamasha-member-gate-content p {
font-size: 0.95rem;
color: rgba(255, 255, 255, 0.7);
line-height: 1.7;
margin: 0;
text-align: center;
}
.tamasha-member-gate-actions {
display: flex;
flex-direction: column;
gap: 12px;
width: 100%;
margin-top: 10px;
}
.btn-member-gate {
width: 100%;
padding: 12px 24px;
border-radius: 12px;
font-size: 1rem;
font-weight: 700;
text-decoration: none;
transition: all 0.3s ease;
text-align: center;
}
.btn-member-gate--primary {
background: #f5ad11;
color: #0b0e0f;
}
.btn-member-gate--primary:hover {
background: #fff;
transform: translateY(-2px);
}
.btn-member-gate--secondary {
background: rgba(255, 255, 255, 0.08);
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.btn-member-gate--secondary:hover {
background: rgba(255, 255, 255, 0.15);
border-color: rgba(255, 255, 255, 0.2);
transform: translateY(-2px);
}
body.lock-body-scroll {
overflow: hidden !important;
}
/* poster-cards.css overrides — series in mixed grids use portrait stack, not landscape */
.webflix-poster-grid .item_series .series-stack .bgcover,
.latest_movies .body .item_series .series-stack .bgcover,
.main_page_container .item_series .series-stack .bgcover {
aspect-ratio: 2 / 3 !important;
height: auto !important;
max-height: none !important;
min-height: 0 !important;
}
body .main_archive .item_loop_post .bgcover {
height: auto !important;
aspect-ratio: 2 / 3 !important;
max-height: none !important;
}
@media screen and (max-width: 1200px) {
body .main_archive .item_loop_post .bgcover {
height: auto !important;
}
}
@media screen and (max-width: 992px) {
body .main_archive .item_loop_post .bgcover {
height: auto !important;
}
}
@media screen and (max-width: 768px) {
body .main_archive .item_loop_post .bgcover {
height: auto !important;
}
}