/*
Theme Name: FarsKids Player
Theme URI: https://farskids.co
Author: FarsKids
Author URI: https://farskids.co
Description: قالب وردپرس فارس‌کیدز - سایت موزیک و فیلم
Version: 3.4
Text Domain: farskids
Tags: music, video, rtl, translation-ready
*/

@font-face {
	font-family:bakhn;
	font-style: normal;
	src: url('fonts/YekanBakhFaNum-Regular.woff') format('woff'),   
	url('fonts/YekanBakhFaNum-Regular.woff2') format('woff2');		 
}
@font-face {
	font-family:bakhb;
	font-style: normal;
	src: url('fonts/YekanBakhFaNum-Bold.woff') format('woff'),   
	url('fonts/YekanBakhFaNum-Bold.woff2') format('woff2'); 
}
.topshadow {
	width: 60%;
    height: 388px;
    border-radius: 1000px;
    opacity: 0.4;
    background: linear-gradient(180deg, #E20B0B 0%, rgba(171, 171, 171, 0.63) 52.08%, #000 99.48%);
    filter: blur(180px);
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: -30%;
	z-index: -1;
}
.fixedside {
	background:linear-gradient(178deg, rgb(255 255 255 / 3%) 0%, rgba(255, 255, 255, 0.00) 100%);
	border:1px solid rgb(255 255 255 / 4%);
	backdrop-filter: blur(4.5px);
}
.fixedside-bottom {
	background: #21212173;
    backdrop-filter: blur(38.5px);
}
.fixedside-bottom li a {
	flex-flow: column;
    justify-content: center;
    text-align: center;
}
.player .track.active img {
	border:2px solid #b91c1c;
}
.player .active_element {
	color: #b91c1c;
}
.ipost .content .maintext a {
	color: #005CB1;
}
.dark .ipost .content .maintext a {
	color: #54adff;
}
.ipost .content img {
	border-radius: 15px;
	margin-top: 15px;
}
.ipost .covers img {
	margin-top: 0px !important;
}
.formbox input[type=text],.formbox input[type=password],.formbox input[type=email],.formbox input[type=number],.formbox input[type=tel],.formbox input[type=url],.formbox textarea {
	background-color: rgb(255 255 255 / 3%);
	width:100%;
	padding: 15px !important;
	border-radius: 10px;
	margin-bottom: 10px;
	border:1px solid transparent;
}
textarea {
	min-height: 150px;
}
.formbox input[type=text]:focus,.formbox input[type=password]:focus,.formbox input[type=email]:focus,.formbox input[type=number]:focus,.formbox input[type=tel]:focus,.formbox input[type=url]:focus,.formbox textarea:focus {
	outline: 0;
	border:1px solid #747474;
}
.slider-post-gradient {
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 54.17%, rgb(41 1 1 / 48%) 100%), #300808;
    opacity: 0.2;
}
.player .controls .playbtn {
	background: linear-gradient(100deg, #FE1E00 0%, #A01515 100%);
	box-shadow: 0px 3px 26px -6px rgba(226, 11, 11, 0.77);
	background-size: 150% auto;
    transition: .5s cubic-bezier(.13,.51,.65,.74);
}
.player .controls .playbtn:hover {
	background-position: right center;
}
.likepost:hover .icon-heart::before ,.likepost.active .icon-heart::before{
	content: "\e90b";
	color: #e20b0b;
}
.sharebox::after {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(250, 250, 250, 0);
	border-top-color: #838383;
	border-width: 5px;
	margin-left: -5px;
}
.viewest::after {
	content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    height: 1px;
    width: 100%;
    background-color: #211c1a;;
}
.viewest::before {
	content: '';
    position: absolute;
	left: 0;
	height: 100%;
    width: 1px;
    background-color: #211c1a;;
}
.swiper-wrapper {
	padding-bottom: 45px;
}
.swiper-pagination-bullet {
    width: 15px;
    border-radius: 4px;
    height: 3px;
}
.swiper-pagination-bullet {
	background-color: #868686;
}
.swiper-pagination-bullet-active {
	background-color: #9B1D15;
}
.top-43 {
	top:43%;
}
.pb-80 {
	padding-bottom:80px;
}
.sm\:w-48 {
width: 12rem;
}
.loadmore {
    padding: 10px 20px;
    border: 1px solid #ffffff1f;
    border-radius: 35px;
    width: fit-content;
    margin: 10px auto;
	position:relative;
	transition:0.3s;
}
.loadmore:hover {
	padding: 10px 30px;
}
.loadmore::after {
	background: #1c1917;
    content: " ";
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 3px solid #fff;
    border-color: #fff transparent #fff transparent;
    animation: lds-dual-ring 1.2s linear infinite;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
    left: 0;
    right: 0;
    position: absolute;
    margin: 0px auto;
    top: 10px;
}
.loadmore::before {
	content: " ";
    background: #1c1917;
    left: 0;
    right: 0;
    top: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
    border-radius: 50px;
}
.loadmore.loading::after,.loadmore.loading::before {
	opacity:1;
	visibility:visible;
}
@keyframes lds-dual-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/*
.blogsingle article span {
	color: #adadad !important;
}
*/
.blogsingle article hr {
	border-color: #ffffff1c;
    margin: 10px 0;
}
.blogsingle article {
	text-align: justify;
}
.blogsingle article  p {
	margin: 15px 0;
}
.blogsingle .cats a {
	background: #00000057;
    padding: 6px 11px;
    border-radius: 15px;
    color: #ffffffdb;
}
.blogsingle .cats a:hover {
	background:#000;
}
::selection {
    background: #991616;
    color: #fff;
}
::selection {
    background: #991616;
    color: #fff;
}
.tracks .track.active,.tracks .track:hover  {
	background: rgb(238 238 238 / 7%);
}
.w-65 {
	width: 65%;
}
.ads {
	margin:15px 0;
}
.ads img {
	width: 100%;
    margin-bottom: 10px;
    border-radius: 20px;
}
.magcontents article p {
	overflow: hidden;
    white-space: pre;
    text-overflow: ellipsis;
	font-size: 13px;
}
table td {
    border: 1px solid #ffffff12;
    padding: 9px;

}
/*
.blogsingle h1,.blogsingle h2,.blogsingle h3,.blogsingle h4,.blogsingle h5,.blogsingle h6 {
    font-size: initial;
    font-weight: initial;
} */
.blogsingle blockquote {
    padding-right: 13px;
    border-right: 3px solid #FF9800;
}
.blogsingle article img {
	border-radius: 15px;
}
.blogsingle article a {
	display:inline-flex;
}
.blogsingle .alert {
    background: #30363a;
    padding: 5px;
    border-radius: 10px;
    color: #FFF;
}
.blogsingle article ol {
	list-style: decimal;
	margin-right: 17px;
}
.blogsingle article ul {
	list-style: disc;
	margin-right: 17px;
}
.w50p {
	width:50%;
}
.scrollbox {
    scrollbar-color: #979797 #f1f1f1;
    scrollbar-width: thin
}

.scrollbox::-webkit-scrollbar {
    width: 3px;
    border-radius: 6px;
    overflow: hidden
}

.scrollbox::-webkit-scrollbar-thumb {
    background: #979797
}

.scrollbox::-webkit-scrollbar-track {
    background: #f1f1f100
}

footer {
	padding-bottom: 5.25rem !important;
}
.playlist {
	background: #33302f;
}
.playlist .track .more {
	margin-top:18px;
}
.playlist .track,.ttllist {
    border-color: rgb(255 255 255 / 8%);
}
.player.fx {
	border-radius: 1.5rem;
	margin-bottom: 5px;
}
.seekbar {
	width: 97%;
    left: 1.5%;
	right: 1.5%;
    margin: 0 auto;
}
.fixbtmmenu {
	width: 95.5%;
	z-index: 999;
}
.rotate-180 {
    transform: rotate(180deg);
}
img.aligncenter {
    margin: 0 auto;
}
.playlist .track .actions *:hover {
	color: #ff2d35;
}
.magcontents article {
	border-bottom: 1px solid #eeeeee12;
    padding-bottom: 15px;
}
.moreread a figure img {
	object-fit:cover;
	height: 3rem;
    width: 3rem;
}
aside .menu-item-has-children {
	position:relative;
}
aside .menu-item-has-children ul {
	display:none;
	padding-right:7px;
}
aside .menu-item-has-children::before {
	position:absolute;
	font-family: 'icomoon';
	content: "\e901";
	font-size:15px;
	left: 0;
    top: 9px;
}
aside .menu-item-has-children.active::before {
	transform:rotate(180deg);
}
.farskidsmusic i {
	border: 1px solid #D1D1D1;
    padding: 0 3px;
    border-radius: 5px;
}
.w-52 {width: 13rem;}
.w-48 {width: 12rem;}
.flex-wrap { flex-wrap: wrap;}
.h-30 {
	height : 30rem;
}
.movie_tag {
    color: #FFF;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 13px;
}
.movie_tag.dub {
	background: #009688;
}
.movie_tag.sub {
	background: #2196f3;
}
.pricetag {
	color: #49dd4f;
    padding: 3px 10px;
    border-radius: 10px;
    font-size: 13px;
    border: 1px solid #4CAF50;
}
.iconmovie1 , .iconmovie2 , .iconmovie3 , .iconmovie4{
    width: 50px;
    height: 50px;
    background:url("/wp-content/uploads/2023/11/p2.png") no-repeat center center;
    background-size: 100%;
    display: block;
    margin: 0 auto;
    margin-bottom: 8px;
    fill: #d1d5db;
}
.iconmovie2 {
    background:url("/wp-content/uploads/2023/11/p3.png") no-repeat center center;
    background-size: 100%;
}
.iconmovie3 {
    background:url("/wp-content/uploads/2023/11/p1.png") no-repeat center center;
    background-size: 100%;
}
.iconmovie4 {
    background:url("/wp-content/uploads/2023/11/p4.png") no-repeat center center;
    background-size: 100%;
}
.icon-filmtory {
    background:url("/wp-content/uploads/2023/11/popcorn.png") no-repeat center center;
    background-size:100%;
    display:block;
    width:18px;
    height:21px;
}
aside ul li a:hover .icon-filmtory {
	filter: brightness(2);
}
.h_iframe-aparat_embed_frame iframe {
    width: 100%;
    min-height: 40vh;
    height: 100%;
}
.table_parent {
	width: 100%;
    overflow-x: auto;
}
/*
.movielinks .tabs span:first-child {
	background: #98161d;
	color:#FFF;
}*/
.movie_brows .postslider figure {
	width: 170px;
}
.movie_brows .postslider .group {
	margin-left:20px !important;
}
.moviepost {
	margin-bottom:20px !important;
	position:relative;
}
.dubsub {
    position: absolute;
    z-index: 2;
    inset: 14px;
}
.dubsub span {
    background: #009688;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 12px;
    color: #FFF;
}
.dubsub span.sub {
	background: #df5532;
}
@media only screen and (max-width: 991px) {
	.player.fx .songname,.player.fx .artistname {
		font-size: 12px;
	}
	.player .post {
		width: 65%;
	}
}
@media only screen and (max-width: 450px) {
	.movie_brows .postslider figure {
		width:100%;
	}
}
@media only screen and (max-width: 425px) {
	.movies.tabcontent {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap:10px;
	}
	.moviepost {
		width:auto;
	}
	.featured p {
		    display: none;
	}
	.title {
		padding: 0.7rem !important;
	}
	.seekbar  {
    width: 94%;
	}
	.magcontents article p {
		display:none;
	}
	.artistpage .engname {
		font-size: 2.5rem !important;
	}
	.moreread .post .text {
		width: 75%;
    	margin-top: 0;
	}
	.moreread .post figure {
		width: 25% !important;
	}
	.moreread a figure img {
		height: 100%;
		width: 100%;
	}
}
@media only screen and (max-width: 767px) { 
	.movie_content {
		flex-flow: column;
		height:auto;
	}	
	.movie_content .cover {
		margin:0 auto;
	}
	.movie_links {
		flex-wrap: wrap;
		width: 100%;
	}
	.movie_links .links {
		width: 100%;
    flex-flow: column;
    margin-top: 11px;
	}
	.movie_links .links a {
		padding: 14px;
	}
}
@media only screen and (max-width: 639px) {
	.magbgcontent {
		padding: 0;
    	background: transparent;
	}
	.magcontents article img {
		width: 100% !important;
		border-radius: 1rem;
	}
	.magcontents article a {
		width: 7rem !important;
	}
	.magcontents article a.\32xsm\:w-full {
		width: 100% !important;
	}
	.magcontents article p {
		display:none;
	}
	.magcontents article h2 {
		font-size: 0.9rem;
		margin-top: 0;
	}
	.magcontents article .info a {
		display: none;
	}
	.magcontents article .left {
		margin-top: 0;
	}
	.magcontents article.bigpost .left {
		margin: 0.5rem !important;
		width:100%!important;
	}
	.magcontents article .left span {
		margin-right:0;
	}
	/*
	.magcontents article .w-65 {
		width: 100%;*/
	.player .songinfo{
		width: 60%;
	}
	.movielinks .tabs {
		white-space: nowrap;
		overflow-x: scroll;
		padding-bottom: 10px;
		overflow-y: hidden;
	}
}
@media only screen and (max-width: 1280px) {
	footer {
		padding-bottom: 10rem !important;
	}
}
/* =========================================================
   Farskids - Swiper compatibility/core safety rules
   ========================================================= */
.swiper {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1;
    display: block;
}
.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    box-sizing: content-box;
    transition-property: transform;
    padding-bottom: 45px;
}
.swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    display: block;
    transition-property: transform;
}
.swiper-horizontal { touch-action: pan-y; }
.swiper-vertical { touch-action: pan-x; }

/* =========================================================
   FARSKIDS PLAYER — closed / mini / expanded
   ========================================================= */
#farskids-fixed-menu {
    width: min(1360px, calc(100% - 28px));
    z-index: 90;
}
.fk-player-shell {
    position: relative;
    width: 100%;
    height: 0;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 0;
    visibility: hidden;
    transform: translate3d(0, 28px, 0);
    pointer-events: none;
    transition: opacity .28s ease, transform .38s cubic-bezier(.2,.75,.2,1), visibility .28s;
    z-index: 90;
}
.fk-player-shell.is-visible {
    height: 78px;
    opacity: 1;
    visibility: visible;
    transform: translate3d(0,0,0);
    pointer-events: auto;
}
.fk-player-bar {
    position: relative;
    min-height: 72px;
    width: 100%;
    display: grid;
    grid-template-columns: minmax(250px, 1fr) auto minmax(230px, 1fr);
    align-items: center;
    gap: 28px;
    padding: 9px 18px;
    overflow: visible;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 18px;
    background: linear-gradient(120deg, rgba(20,23,25,.93), rgba(9,12,14,.88));
    box-shadow: 0 18px 55px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.04);
    backdrop-filter: blur(26px) saturate(120%);
    -webkit-backdrop-filter: blur(26px) saturate(120%);
}
.fk-player-bar:before {
    content:"";
    position:absolute;
    inset:-18px 15% -22px;
    z-index:-1;
    background: radial-gradient(ellipse, rgba(226,11,11,.13), transparent 66%);
    filter:blur(22px);
    pointer-events:none;
}
.fk-seekbar {
    position:absolute;
    left:0;
    right:0;
    top:-1px;
    height:2px;
    border-radius:99px;
    background:rgba(255,255,255,.13);
    cursor:pointer;
    overflow:hidden;
    z-index:2;
}
.fk-seekbar .seek { height:100%; width:0; background:linear-gradient(90deg,#e20b0b,#ff3b2f); box-shadow:0 0 12px rgba(226,11,11,.5); }
.fk-player-song { min-width:0; justify-self:start; cursor:pointer; direction:rtl; }
.fk-cover-wrap { flex:0 0 auto; margin-left:11px; }
.fk-player-cover {
    display:block;
    width:54px;
    height:54px;
    object-fit:cover;
    border-radius:13px !important;
    box-shadow:0 7px 24px rgba(0,0,0,.38);
}
.fk-song-text { min-width:0; width:205px; line-height:1.65; text-align:right; }
.fk-song-text .songname { font-size:13px; }
.fk-song-text .artistname { font-size:10px; color:#999; }
.fk-player-controls { justify-content:center; gap:16px; white-space:nowrap; direction:ltr; }
.fk-player-controls .timer,.fk-player-controls .duration { color:#888; font-size:10px; min-width:38px; }
.fk-player-controls > i { color:#d8d8d8; font-size:17px; transition:.2s; }
.fk-player-controls > i:hover { color:#fff; transform:translateY(-1px); }
.fk-player-controls .playbtn,
.fk-panel-controls .playbtn {
    width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center;
    border-radius:50%; background:linear-gradient(145deg,#ff3023,#d30d0d);
    box-shadow:0 7px 28px rgba(226,11,11,.35), inset 0 1px 0 rgba(255,255,255,.18);
}
.fk-player-controls .playbtn i,.fk-panel-controls .playbtn i { position:static; font-size:17px; }
.fk-player-right { justify-self:end; gap:18px; flex-direction:row; direction:ltr; }
.fk-volume { display:flex; align-items:center; gap:8px; direction:ltr; color:#ddd; }
.fk-volume-track { width:86px; height:4px; border-radius:99px; background:rgba(255,255,255,.15); overflow:hidden; cursor:pointer; }
.fk-volume-track .seekvol { width:70%; height:100%; background:linear-gradient(90deg,#e20b0b,#ff3b2f); border-radius:99px; }
.fk-menu-toggle {
    width:40px; height:40px; border:0; background:transparent; color:#eee; display:flex;
    flex-direction:column; justify-content:center; align-items:center; gap:5px; cursor:pointer;
    padding:8px; border-radius:10px; transition:.2s;
}
.fk-menu-toggle:hover { background:rgba(255,255,255,.07); }
.fk-menu-toggle span { display:block; width:19px; height:2px; border-radius:2px; background:currentColor; }

.fk-player-panel {
    position:absolute !important;
    left:0 !important; right:0 !important; bottom:calc(100% + 12px) !important;
    width:100% !important; height:min(72vh,640px);
    display:flex !important; flex-direction:column; opacity:0; visibility:hidden; pointer-events:none;
    transform:translate3d(0,22px,0) scale(.985); transform-origin:bottom center;
    border:1px solid rgba(255,255,255,.10) !important; border-radius:22px !important;
    background-image:linear-gradient(135deg,rgba(14,19,22,.91),rgba(7,10,12,.94)), var(--fk-cover-url, none) !important;
    background-size:cover; background-position:center;
    box-shadow:0 30px 100px rgba(0,0,0,.60), inset 0 1px 0 rgba(255,255,255,.045) !important;
    backdrop-filter:blur(34px) saturate(125%); -webkit-backdrop-filter:blur(34px) saturate(125%);
    overflow:hidden !important; transition:opacity .25s ease, transform .35s cubic-bezier(.2,.75,.2,1), visibility .25s;
}
.fk-player-panel:before {
    content:""; position:absolute; inset:0; pointer-events:none;
    background:radial-gradient(circle at 15% 15%,rgba(226,11,11,.10),transparent 34%), radial-gradient(circle at 80% 10%,rgba(255,255,255,.05),transparent 30%), rgba(5,8,10,.55);
}
.fk-player-shell.panel-open .fk-player-panel { opacity:1; visibility:visible; pointer-events:auto; transform:translate3d(0,0,0) scale(1); }
.fk-panel-top {
    position:relative; display:grid; grid-template-columns:minmax(270px,.75fr) minmax(380px,1.25fr); align-items:center;
    gap:42px; padding:30px 34px 26px; border-bottom:1px solid rgba(255,255,255,.07); z-index:1;
}
.fk-panel-close { position:absolute; top:14px; right:15px; width:34px; height:34px; border:0; background:rgba(255,255,255,.05); color:#ddd; border-radius:50%; font-size:24px; line-height:1; cursor:pointer; }
.fk-panel-current { display:flex; align-items:center; gap:18px; direction:rtl; min-width:0; }
.fk-panel-cover img { width:128px; height:128px; object-fit:cover; border-radius:18px; display:block; box-shadow:0 15px 35px rgba(0,0,0,.38); }
.fk-panel-meta { min-width:0; text-align:right; }
.fk-panel-meta .songname { font-size:19px; font-weight:700; margin-bottom:5px; }
.fk-panel-meta .artistname { color:#aaa; font-size:12px; }
.fk-panel-actions { min-width:0; padding-top:12px; }
.fk-panel-progress { direction:ltr; }
.fk-panel-seek { width:100%; height:4px; border-radius:99px; background:rgba(255,255,255,.15); cursor:pointer; overflow:hidden; }
.fk-panel-seek .seek { width:0; height:100%; background:linear-gradient(90deg,#e20b0b,#ff3b2f); }
.fk-panel-times { display:flex; justify-content:space-between; color:#888; font-size:10px; margin-top:8px; direction:ltr; }
.fk-panel-controls { display:flex; align-items:center; justify-content:center; gap:24px; margin-top:17px; direction:ltr; }
.fk-panel-controls > i { color:#ddd; font-size:18px; }
.fk-panel-volume { margin-left:auto; display:flex; align-items:center; gap:9px; direction:ltr; color:#ddd; }
.fk-panel-volume .fk-volume-track { width:78px; }
.fk-player-panel .ttllist { position:relative; z-index:1; display:flex !important; align-items:center; justify-content:space-between; padding:17px 24px 12px; border-bottom:1px solid rgba(255,255,255,.06); font-size:14px; flex:0 0 auto; }
.fk-panel-count { color:#777; font-size:10px; }
.fk-player-panel .list { position:relative; z-index:1; flex:1; min-height:0; overflow-y:auto; padding:4px 8px 10px; }
.fk-player-panel .track { min-height:66px; padding:0 9px; border-radius:12px; background:transparent; }
.fk-player-panel .track:hover { background:rgba(255,255,255,.035); }
.fk-player-panel .track.active { background:linear-gradient(90deg,rgba(226,11,11,.10),rgba(255,255,255,.025)); }
.fk-player-panel .track .post { padding:8px !important; min-width:0; direction:rtl; }
.fk-player-panel .track .post > div:first-child { margin-left:10px; }
.fk-player-panel .track .post img { width:46px !important; height:46px; object-fit:cover; border-radius:10px !important; }
.fk-player-panel .track .songinfo { min-width:0; text-align:right; }
.fk-player-panel .track .songn { font-size:12px; }
.fk-player-panel .track .artistn { color:#8f8f8f; font-size:10px; }
.fk-player-panel .track .actions,.fk-player-panel .track .more { padding:0 !important; }
.fk-player-panel .track .trplay { padding:13px !important; color:#aaa; transition:.2s; }
.fk-player-panel .track .trplay:hover { color:#e20b0b; }
body.fk-player-panel-open { overflow:hidden; }

@media (max-width: 767px) {
    #farskids-fixed-menu { width:calc(100% - 12px); bottom:6px !important; }
    .fk-player-shell.is-visible { height:70px; }
    .fk-player-bar { min-height:64px; height:64px; border-radius:16px; padding:7px 9px; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
    .fk-player-song { min-width:0; }
    .fk-player-cover { width:48px; height:48px; border-radius:11px !important; }
    .fk-cover-wrap { margin-left:8px; }
    .fk-song-text { width:auto; max-width:125px; }
    .fk-song-text .songname { font-size:11px; }
    .fk-song-text .artistname { font-size:9px; }
    .fk-player-controls { gap:8px; }
    .fk-player-controls .timer,.fk-player-controls .duration,.fk-player-controls .repeat { display:none; }
    .fk-player-controls .previous,.fk-player-controls .next { font-size:14px; }
    .fk-player-controls .playbtn { width:38px; height:38px; }
    .fk-player-controls .playbtn i { font-size:15px; }
    .fk-player-right { gap:5px; }
    .fk-volume { display:none; }
    .fk-menu-toggle { width:34px; height:34px; }
    .fk-seekbar { left:0; right:0; }

    .fk-player-panel { position:fixed !important; inset:0 !important; width:100vw !important; height:100dvh !important; max-height:none; border-radius:0 !important; transform:translate3d(0,100%,0) !important; z-index:1001 !important; background:linear-gradient(180deg,#111719,#080b0d) !important; }
    .fk-player-shell.panel-open .fk-player-panel { transform:translate3d(0,0,0) !important; }
    .fk-panel-top { display:block; padding:55px 18px 18px; border-bottom:0; }
    .fk-panel-current { flex-direction:column; text-align:center; gap:12px; }
    .fk-panel-cover img { width:min(62vw,245px); height:min(62vw,245px); border-radius:20px; margin:0 auto; }
    .fk-panel-meta { text-align:center; }
    .fk-panel-meta .songname { font-size:17px; }
    .fk-panel-meta .artistname { font-size:11px; }
    .fk-panel-actions { padding-top:22px; }
    .fk-panel-controls { gap:21px; margin-top:18px; flex-wrap:nowrap; }
    .fk-panel-volume { margin-left:0; }
    .fk-panel-volume .fk-volume-track { width:62px; }
    .fk-player-panel .ttllist { padding:13px 18px 10px; }
    .fk-player-panel .list { padding:4px 10px 20px; }
    .fk-player-panel .track { min-height:61px; padding:0 4px; }
    .fk-player-panel .track .post img { width:43px !important; height:43px; }
    .fk-panel-close { top:14px; right:14px; z-index:3; }
}

@media (min-width:768px) and (max-width:1100px) {
    .fk-player-bar { grid-template-columns:minmax(180px,1fr) auto minmax(190px,1fr); gap:12px; }
    .fk-song-text { width:145px; }
    .fk-player-controls { gap:10px; }
    .fk-volume-track { width:62px; }
}


/* =========================================================
   FARSKIDS PLAYER BUGFIXES — v3
   ========================================================= */
.fk-player-shell { overflow: visible; }
.fk-player-shell:not(.is-visible) .fk-player-bar,
.fk-player-shell:not(.is-visible) .fk-player-panel {
    visibility: hidden !important;
    pointer-events: none !important;
}
.fk-player-shell.is-visible .fk-player-bar { visibility: visible; }

/* Progress must always fill from the LEFT to the RIGHT. */
.fk-seekbar,
.fk-seekbar .seek,
.fk-panel-seek,
.fk-panel-seek .seek { direction:ltr !important; }
.fk-seekbar .seek {
    position:absolute;
    left:0;
    right:auto;
    top:0;
    width:0;
}

/* The expanded panel no longer duplicates playback controls. */
.fk-panel-actions-empty { display:none !important; }
.fk-panel-top { grid-template-columns: 1fr !important; justify-items:center; }
.fk-panel-current { width:100%; justify-content:center; }
.fk-panel-cover img { width:170px; height:170px; }

/* Keep the mobile bottom navigation visible; the player sits above it. */
@media (max-width:767px) {
    .fixedside-bottom {
        display:block !important;
        position:fixed !important;
        left:6px !important;
        right:6px !important;
        bottom:6px !important;
        width:auto !important;
        z-index:1100 !important;
    }
    #farskids-fixed-menu {
        bottom:76px !important;
        width:calc(100% - 12px) !important;
        z-index:1101 !important;
    }
    .fk-player-shell.is-visible { height:70px !important; }
    .fk-player-bar { z-index:1102; }
    .fk-player-panel { z-index:1200 !important; }
    .fk-panel-top { padding:48px 18px 12px !important; }
    .fk-panel-cover img { width:min(58vw,220px) !important; height:min(58vw,220px) !important; }
    .fk-player-panel .list { padding-bottom:96px !important; }
}

/* Mini player controls: previous / play / next use the natural LTR order. */
.fk-player-controls { direction:ltr !important; flex-direction:row !important; }

/* =========================================================
   FARSKIDS PLAYER — FINAL INTERACTION / LAYOUT PATCH
   ========================================================= */
/* Never let the hidden player leave a visual footprint. */
#farskids-fixed-menu .fk-player-shell:not(.is-visible) {
    display:block !important;
    height:0 !important;
    min-height:0 !important;
    margin:0 !important;
}
#farskids-fixed-menu .fk-player-shell:not(.is-visible) > * {
    visibility:hidden !important;
    pointer-events:none !important;
}

/* Cover/title are real links so the site's AJAX router can intercept them. */
.fk-player-song,
.fk-panel-current {
    color:inherit;
    text-decoration:none !important;
    -webkit-tap-highlight-color:transparent;
}
.fk-player-song,
.fk-panel-current,
.fk-player-cover,
.fk-panel-cover img {
    transition:transform .28s cubic-bezier(.2,.8,.2,1), filter .28s ease, box-shadow .28s ease;
}
.fk-player-song:hover .fk-player-cover,
.fk-panel-current:hover .fk-panel-cover img {
    transform:scale(1.035);
    filter:brightness(1.08) saturate(1.06);
}
.fk-player-song.fk-player-link-press .fk-player-cover,
.fk-panel-current.fk-player-link-press .fk-panel-cover img {
    transform:scale(.955);
    filter:brightness(.88) saturate(.96);
}

/* Mobile hamburger must always be visible/clickable above the bottom nav. */
@media (max-width:767px) {
    #farskids-fixed-menu { z-index:1101 !important; }
    #farskids-fixed-menu .fk-player-shell { z-index:1102 !important; }
    #farskids-fixed-menu .fk-player-bar { z-index:1103 !important; }
    #farskids-fixed-menu .fk-menu-toggle {
        display:flex !important;
        visibility:visible !important;
        opacity:1 !important;
        pointer-events:auto !important;
        position:relative !important;
        z-index:1110 !important;
        flex:0 0 34px;
    }
    #farskids-fixed-menu .fk-player-right { position:relative; z-index:1110; }
    #farskids-fixed-menu .fixedside-bottom {
        z-index:1090 !important;
    }
}

/* Desktop expanded panel: artwork stays on the RIGHT; no duplicated controls. */
@media (min-width:768px) {
    .fk-player-panel .fk-panel-top {
        display:grid !important;
        grid-template-columns:minmax(0, 1fr) minmax(180px, 260px) !important;
        align-items:center !important;
        gap:34px !important;
        padding:28px 30px 24px !important;
        justify-items:stretch !important;
    }
    .fk-player-panel .fk-panel-current {
        grid-column:1 !important;
        grid-row:1 !important;
        width:100% !important;
        justify-content:flex-start !important;
        flex-direction:row !important;
        text-align:right !important;
    }
    .fk-player-panel .fk-panel-cover { flex:0 0 auto; }
    .fk-player-panel .fk-panel-cover img {
        width:190px !important;
        height:190px !important;
        border-radius:20px !important;
    }
    .fk-player-panel .fk-panel-meta { min-width:0; flex:1; text-align:right !important; }
    .fk-player-panel .fk-panel-actions-empty {
        display:none !important;
    }
    .fk-player-panel .ttllist {
        text-align:right;
    }
}

/* Keep progress LTR regardless of RTL page direction. */
.fk-seekbar .seek,
.fk-panel-seek .seek {
    left:0 !important;
    right:auto !important;
    transform-origin:left center !important;
}


/* =========================================================
   FARSKIDS PLAYER — MOBILE FINAL FIX
   ========================================================= */
@media (max-width:767px) {
    /* The mobile player is above the persistent bottom navigation. */
    #farskids-fixed-menu {
        bottom:76px !important;
        left:6px !important;
        right:6px !important;
        width:auto !important;
        z-index:1200 !important;
    }
    #farskids-fixed-menu .fk-player-shell { z-index:1201 !important; }
    #farskids-fixed-menu .fk-player-bar { z-index:1202 !important; }

    /* No hamburger on mobile. */
    #farskids-fixed-menu .fk-menu-toggle {
        display:none !important;
        pointer-events:none !important;
    }
    #farskids-fixed-menu .fk-player-right { display:none !important; }

    /* Cover/title is an obvious tappable target. */
    #farskids-fixed-menu .fk-player-song,
    #farskids-fixed-menu .fk-player-song * {
        cursor:pointer !important;
    }

    /* Open the expanded player upward from the bottom, never downward. */
    #farskids-fixed-menu .fk-player-panel {
        position:fixed !important;
        left:6px !important;
        right:6px !important;
        top:auto !important;
        bottom:76px !important;
        inset-inline:auto !important;
        width:calc(100vw - 12px) !important;
        height:min(86dvh,760px) !important;
        max-height:calc(100dvh - 92px) !important;
        border-radius:22px 22px 0 0 !important;
        transform:translate3d(0,calc(100% + 18px),0) !important;
        transform-origin:center bottom !important;
        z-index:1300 !important;
        overflow:hidden !important;
    }
    #farskids-fixed-menu .fk-player-shell.panel-open .fk-player-panel {
        transform:translate3d(0,0,0) !important;
    }
    body.fk-player-panel-open { overflow:hidden !important; }

    /* Expanded mobile cover is still the navigation target. */
    #farskids-fixed-menu .fk-panel-current,
    #farskids-fixed-menu .fk-panel-current * {
        cursor:pointer !important;
    }

    /* Persistent mobile navigation stays below the player/panel. */
    .fixedside-bottom {
        display:block !important;
        position:fixed !important;
        left:6px !important;
        right:6px !important;
        bottom:6px !important;
        width:auto !important;
        z-index:1100 !important;
    }
}

/* Desktop and mobile link affordance. */
.fk-player-song,
.fk-panel-current { cursor:pointer !important; }


/* =========================================================
   FARSKIDS PLAYER — MOBILE CLOSE BUTTON + ARTWORK SYNC
   ========================================================= */
@media (max-width:767px) {
    #farskids-fixed-menu .fk-player-panel .fk-panel-close {
        display:flex !important;
        visibility:visible !important;
        opacity:1 !important;
        position:absolute !important;
        top:12px !important;
        right:12px !important;
        left:auto !important;
        width:42px !important;
        height:42px !important;
        align-items:center !important;
        justify-content:center !important;
        z-index:9999 !important;
        color:#fff !important;
        background:rgba(255,255,255,.10) !important;
        border:1px solid rgba(255,255,255,.14) !important;
        border-radius:50% !important;
        font-size:30px !important;
        line-height:42px !important;
        font-family:Arial,sans-serif !important;
        box-shadow:0 8px 25px rgba(0,0,0,.30) !important;
        cursor:pointer !important;
        pointer-events:auto !important;
    }
    #farskids-fixed-menu .fk-player-panel .fk-panel-close:hover,
    #farskids-fixed-menu .fk-player-panel .fk-panel-close:active {
        background:rgba(255,255,255,.18) !important;
        transform:scale(.96);
    }
}

/* The large artwork is always a live reflection of the currently playing track. */
.fk-player-panel .fk-panel-cover img {
    transition:opacity .18s ease, transform .28s cubic-bezier(.2,.8,.2,1);
}

/* =========================================================
   FARSKIDS PLAYER — MOBILE PANEL SAFE HEIGHT v5
   Keep the expanded player clear of the top edge so the close
   button is always comfortably reachable on short/tall phones.
   ========================================================= */
@media (max-width:767px) {
    #farskids-fixed-menu .fk-player-panel {
        height:min(78dvh,680px) !important;
        max-height:calc(100dvh - 140px) !important;
        bottom:76px !important;
        overflow:hidden !important;
    }

    #farskids-fixed-menu .fk-player-panel .fk-panel-close {
        top:12px !important;
        right:12px !important;
        width:44px !important;
        height:44px !important;
        min-width:44px !important;
        min-height:44px !important;
        z-index:99999 !important;
        touch-action:manipulation !important;
    }

    #farskids-fixed-menu .fk-player-panel .fk-panel-top {
        padding-top:64px !important;
    }
}


/* =========================================================
   FARSKIDS SPA — LIGHT PAGE TRANSITION
   CSS-only visual feedback. No overlay, no external library, no layout shift.
   Blur is applied only to the content container while AJAX navigation is active.
   ========================================================= */
#fk-page-loader {
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    width:0;
    height:2px !important;
    opacity:0;
    display:none;
    z-index:2147483647 !important;
    pointer-events:none !important;
    background:linear-gradient(90deg, rgba(255,255,255,0), currentColor 35%, currentColor 72%, rgba(255,255,255,.72));
    box-shadow:0 0 8px rgba(255,255,255,.28);
    transition:width .38s cubic-bezier(.22,.61,.36,1), opacity .16s ease;
}
#fk-page-loader::after {
    content:"";
    position:absolute;
    top:-1px;
    right:-2px;
    width:72px;
    height:4px;
    border-radius:999px;
    background:currentColor;
    opacity:.28;
    filter:blur(3px);
}

/* The transition never changes dimensions, so the page cannot jump. */
html.fk-page-loading div.xl\:container {
    transition:opacity .18s ease, filter .20s ease, transform .20s cubic-bezier(.22,.61,.36,1);
    opacity:.90;
    filter:blur(2px);
}

/* Mobile gets the same effect, but slightly lighter for low-power GPUs. */
@media (max-width:767px) {
    html.fk-page-loading div.xl\:container {
        opacity:.92;
        filter:blur(1.5px);
        transform:translate3d(0,2px,0);
    }
}

@media (prefers-reduced-motion: reduce) {
    html.fk-page-loading div.xl\:container {
        filter:none;
        transform:none;
        transition:opacity .1s ease;
    }
    #fk-page-loader { transition:opacity .1s ease; }
}


/* =========================================================
   FARSKIDS PLAYER — MOBILE FULL ARTWORK HIT AREA
   ========================================================= */
@media (max-width:767px) {
    #farskids-fixed-menu .fk-player-song,
    #farskids-fixed-menu .fk-cover-wrap,
    #farskids-fixed-menu .fk-player-cover {
        pointer-events:auto !important;
        touch-action:manipulation !important;
        -webkit-tap-highlight-color:transparent;
    }
    #farskids-fixed-menu .fk-cover-wrap {
        position:relative;
        z-index:5;
    }
}

/* =========================================================
   FARSKIDS PLAYER — MOBILE PANEL ARTWORK / LIST BALANCE v9
   Only adjusts the expanded mobile player composition.
   ========================================================= */
@media (max-width:767px) {
    #farskids-fixed-menu .fk-player-panel .fk-panel-top {
        padding:54px 16px 10px !important;
    }

    #farskids-fixed-menu .fk-player-panel .fk-panel-current {
        gap:9px !important;
    }

    #farskids-fixed-menu .fk-player-panel .fk-panel-cover img {
        width:clamp(140px,40vw,160px) !important;
        height:clamp(140px,40vw,160px) !important;
        max-width:160px !important;
        max-height:160px !important;
        border-radius:18px !important;
    }

    #farskids-fixed-menu .fk-player-panel .fk-panel-meta .songname {
        font-size:16px !important;
        margin-bottom:3px !important;
    }

    #farskids-fixed-menu .fk-player-panel .ttllist {
        padding:10px 16px 8px !important;
        font-size:13px !important;
    }

    #farskids-fixed-menu .fk-player-panel .list {
        padding:3px 8px 18px !important;
    }
}

/* FarsKids v10 mobile player refinement */
#fk-cover{cursor:pointer;object-fit:cover;}
@media(max-width:768px){
  #fk-cover{width:44px!important;height:44px!important;border-radius:12px!important;}
  #fk-mini-player{padding-top:8px!important;padding-bottom:8px!important;}
}


/* =========================================================
   FARSKIDS ALBUM TRACKS — NUMBER / SMALL COVER / TITLE / PLAY / DOWNLOAD
   ========================================================= */
.fk-album-track {
    min-height: 50px;
    width: 100%;
    background: rgba(255,255,255,.018);
    border: 1px solid rgba(255,255,255,.035);
    direction: rtl;
    gap: 9px;
}
.fk-album-track:hover {
    background: rgba(255,255,255,.045);
}
.fk-album-track-number {
    width: 25px;
    min-width: 25px;
    text-align: center;
    color: rgba(255,255,255,.42);
    font-size: 12px;
    font-variant-numeric: tabular-nums;
}
.fk-album-track-cover {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    max-height: 40px !important;
    object-fit: cover !important;
    display: block;
    box-shadow: 0 3px 12px rgba(0,0,0,.22);
}
.fk-album-track-name {
    min-width: 0;
    flex: 1 1 auto;
    max-width: none;
    line-height: 1.8;
    text-align: right;
    color: #eee;
}
.fk-album-track .playtrack {
    position: relative;
    z-index: 2;
    flex-shrink: 0;
    margin: 0 !important;
}
.fk-album-track-downloads {
    direction: rtl;
    margin: 0 !important;
}
@media (max-width: 767px) {
    .fk-album-track {
        min-height: 48px;
        padding: 5px 4px !important;
        gap: 7px;
    }
    .fk-album-track-number {
        width: 20px;
        min-width: 20px;
        font-size: 11px;
    }
    .fk-album-track-cover {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
        max-height: 38px !important;
        border-radius: 8px !important;
    }
    .fk-album-track-name {
        font-size: 12px !important;
    }
    .fk-album-track .playtrack {
        width: 28px !important;
        min-width: 28px !important;
        height: 28px !important;
        padding-top: 6px !important;
    }
    .fk-album-track-downloads {
        gap: 3px !important;
    }
    .fk-album-track-downloads a {
        padding: 7px 6px 6px !important;
        font-size: 9px !important;
        white-space: nowrap;
    }
}



/* FARSKIDS GLOBAL CONTENT ARTWORK — SQUARE ROUNDED CORNERS */
/* Content covers use a rounded square; circular avatars/buttons remain circular. */
.xl\:container img.rounded-full.w-full,
.xl\:container img.w-12.rounded-full,
.xl\:container img.rounded-full:not([class*="avatar"]):not([alt*="نویسنده"]),
.related-posts img,
.related-music img,
.related-movies img,
.movies-related img,
.music-related img {
    border-radius: 14px !important;
}

/* Post featured image: keep author/share metadata outside the image frame. */
.fk-post-featured-frame {
    width: 100%;
    aspect-ratio: 16 / 9;
}
.fk-post-featured-frame .fk-post-featured-image {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    display: block;
}
.fk-post-meta {
    position: relative;
    z-index: 2;
}
@media (max-width: 639px) {
    .fk-post-meta {
        padding: 12px 4px;
    }
    .fk-post-featured-frame {
        width: 100%;
        aspect-ratio: 16 / 9;
    }
}

/* Live search: visible loading indicator without page navigation. */
.fk-live-search-form {
    position: relative;
    width: 100%;
}
.fk-search-spinner {
    display: none;
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    width: 22px;
    height: 22px;
    box-sizing: border-box;
    border: 3px solid rgba(255,255,255,.18);
    border-top-color: #ef4444;
    border-right-color: #ef4444;
    border-radius: 50%;
    z-index: 5;
    pointer-events: none;
}
.fk-search-spinner.is-active {
    display: block;
    animation: fkSearchSpin .65s linear infinite;
}
@keyframes fkSearchSpin {
    from { transform: translateY(-50%) rotate(0deg); }
    to { transform: translateY(-50%) rotate(360deg); }
}
.fk-live-search-form input {
    min-width: 0;
    flex: 1 1 auto;
    padding-left: 48px !important;
}


 /* Farskids search music subtabs fix */
.fk-music-subtabs{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:16px;
}
.fk-music-subtab{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:8px 18px !important;
    min-height:36px !important;
    border-radius:9999px !important;
    cursor:pointer !important;
    font-size:14px !important;
    color:#d1d5db !important;
    background:rgba(255,255,255,.05) !important;
    border:0 !important;
    transition:.2s !important;
    appearance:none !important;
}
.fk-music-subtab:hover,
.fk-music-subtab.is-active{
    background:#991b1b !important;
    color:#fff !important;
}


/* FarsKids lyrics popup safe responsive */

.fk-lyrics-open-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    padding:9px 14px;
    min-height:38px;
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.14);
    box-shadow:0 8px 25px rgba(0,0,0,.18);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    cursor:pointer;
}

.fk-lyrics-modal{
    position:fixed;
    inset:0;
    z-index:2147483000;
    display:none;
    align-items:center;
    justify-content:center;
    padding:16px;
}

.fk-lyrics-modal.is-open{
    display:flex;
}

.fk-lyrics-backdrop{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.62);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
}

.fk-lyrics-dialog{
    position:relative;
    z-index:2;
    width:min(540px,92vw);
    max-height:62vh;
    background:rgba(25,25,30,.96);
    border:1px solid rgba(255,255,255,.12);
    border-radius:18px;
    overflow:hidden;
    box-shadow:0 20px 70px rgba(0,0,0,.55);
}

.fk-lyrics-dialog-inner{
    padding:15px;
}

.fk-lyrics-close{
    position:absolute;
    top:10px;
    left:10px;
    z-index:3;
    width:32px;
    height:32px;
    border-radius:50%;
    background:rgba(255,255,255,.14);
    color:#fff;
    cursor:pointer;
}

.fk-lyrics-scroll{
    max-height:calc(62vh - 80px);
    overflow-y:auto;
    overflow-x:hidden;
    padding:0 5px 15px;
    -webkit-overflow-scrolling:touch;
}

body.fk-lyrics-modal-open{
    overflow:hidden;
}

@media(max-width:768px){

    .fk-lyrics-modal{
        align-items:flex-start;
        padding:55px 12px 125px;
    }

    .fk-lyrics-dialog{
        width:94vw;
        max-height:52vh;
        margin:0 auto;
    }

    .fk-lyrics-dialog-inner{
        padding:13px 12px;
    }

    .fk-lyrics-scroll{
        max-height:calc(52vh - 75px);
        font-size:14px;
        line-height:1.9;
    }
}

@media(max-width:390px){

    .fk-lyrics-modal{
        padding-top:45px;
        padding-bottom:120px;
    }

    .fk-lyrics-dialog{
        width:92vw;
        max-height:48vh;
    }

    .fk-lyrics-scroll{
        max-height:calc(48vh - 75px);
    }
}


/* =========================================================
   FARSKIDS 3.2 — PERSISTENT APP SHELL / AJAX CONTENT
   ========================================================= */
.fk-app-header{
    position:fixed;
    top:0;
    right:270px;
    left:0;
    height:64px;
    z-index:10020;
    background:rgba(20,19,24,.86);
    border-bottom:1px solid rgba(255,255,255,.055);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
}
.fk-app-header-inner{height:100%;display:flex;align-items:center;gap:14px;padding:0 20px;direction:ltr}
.fk-app-nav-arrows{display:flex;gap:8px;align-items:center}
.fk-app-nav-arrows button{width:38px;height:38px;border:0;border-radius:50%;background:rgba(255,255,255,.07);color:#fff;font-size:25px;line-height:1;cursor:pointer;transition:.2s}
.fk-app-nav-arrows button:hover{background:rgba(255,255,255,.14);transform:translateY(-1px)}
.fk-header-search{direction:rtl;display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 auto;width:min(520px,55%);height:40px;padding:0 15px;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(255,255,255,.035);color:#8f8c96;text-decoration:none!important;transition:.2s}
.fk-header-search:hover{color:#fff;border-color:rgba(180,110,255,.4);background:rgba(255,255,255,.06)}
.fk-header-search i{font-size:16px;color:#d8b7ff}
.fk-app-header-actions{display:flex;gap:9px;align-items:center;direction:rtl}
.fk-app-header-actions a{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;color:#aaa;text-decoration:none!important;background:rgba(255,255,255,.04);transition:.2s}
.fk-app-header-actions a:hover{color:#fff;background:rgba(255,255,255,.1)}
.fk-mobile-brand{display:none}

.fk-app-sidebar{
    position:fixed!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    width:270px!important;
    height:100vh!important;
    min-height:100vh!important;
    margin:0!important;
    border-radius:0!important;
    z-index:10030!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding:20px 18px 16px!important;
    display:flex!important;
    flex-direction:column!important;
    background:rgba(23,22,27,.94)!important;
    border-left:1px solid rgba(255,255,255,.06)!important;
    border-right:0!important;
    backdrop-filter:blur(20px)!important;
    -webkit-backdrop-filter:blur(20px)!important;
}
.fk-app-sidebar > h1{flex:0 0 auto;margin-bottom:8px}
.fk-app-sidebar > h1 img{max-width:155px;max-height:52px}
.fk-app-sidebar ul{flex:0 0 auto}
.fk-app-sidebar a{border-radius:10px}
.fk-app-sidebar a:hover{background:rgba(255,255,255,.045)}
.fk-app-sidebar a.fk-nav-active{background:linear-gradient(90deg,rgba(139,75,255,.28),rgba(139,75,255,.08));color:#fff!important}
.fk-sidebar-footer{margin-top:auto;padding-top:16px;border-top:1px solid rgba(255,255,255,.07);color:#777;font-size:10px;direction:rtl}
.fk-sidebar-socials{display:flex;justify-content:flex-start;gap:12px;margin-bottom:10px}
.fk-sidebar-socials a{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#a6a3ab;background:rgba(255,255,255,.045)}
.fk-sidebar-socials a:hover{color:#fff;background:rgba(255,255,255,.1)}
.fk-sidebar-footer-links{white-space:nowrap;margin-bottom:7px}.fk-sidebar-footer-links a{padding:0;background:none!important;color:#8e8a93}.fk-sidebar-footer-links a:hover{color:#fff}.fk-sidebar-footer-links span{opacity:.35}
.fk-sidebar-copy{opacity:.55}

/* Existing page templates keep their own grid wrapper; the App Shell turns that wrapper into the content canvas. */
@media (min-width:1024px){
    body{padding-right:270px;padding-top:64px;padding-bottom:90px;overflow-x:hidden}
    body > .xl\:container,
    body > div.xl\:container{width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important;display:block!important;padding-top:24px!important}
    body > .xl\:container > main,
    body > div.xl\:container > main{width:100%!important;max-width:none!important;min-width:0!important;padding-left:28px!important;padding-right:28px!important}
    .fk-page-grid{width:100%!important;max-width:none!important;display:block!important}
    .fk-page-grid > main{width:100%!important;padding-left:28px!important;padding-right:28px!important}
    #farskids-fixed-menu{position:fixed!important;left:18px!important;right:288px!important;width:auto!important;bottom:10px!important;z-index:10010!important}
    #farskids-fixed-menu .player{width:100%!important}
    .fixedside-bottom{display:none!important}
    .fk-route-target{min-height:calc(100vh - 150px)}
}

@media (max-width:1023px){
    body{padding-top:62px;padding-bottom:96px;overflow-x:hidden}
    .fk-app-sidebar{display:none!important}
    .fk-app-header{right:0;left:0;height:62px}
    .fk-app-header-inner{padding:0 12px;gap:9px}
    .fk-app-nav-arrows{display:none}
    .fk-mobile-brand{display:flex;align-items:center;flex:0 0 auto}
    .fk-mobile-brand img{width:105px;max-height:42px}
    .fk-header-search{width:auto;flex:1;min-width:0;height:38px;font-size:11px}
    .fk-header-search span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .fk-app-header-actions{display:flex}
    .fk-app-header-actions a:first-child{display:none}
    body > .xl\:container,
    body > div.xl\:container{width:100%!important;max-width:none!important;margin:0!important;display:block!important;padding-top:12px!important}
    body > .xl\:container > main,
    body > div.xl\:container > main{width:100%!important;padding:0 12px!important}
    .fk-page-grid{width:100%!important;max-width:none!important;display:block!important;padding-top:12px!important}
    .fk-page-grid > main{width:100%!important;padding:0 12px!important}
    #farskids-fixed-menu{bottom:74px!important;left:6px!important;right:6px!important;width:auto!important;z-index:10010!important}
    .fixedside-bottom{display:block!important;position:fixed!important;left:6px!important;right:6px!important;bottom:6px!important;width:auto!important;z-index:10020!important}
    .fk-sidebar-footer{display:none}
    .fk-route-target{min-height:calc(100vh - 160px)}
}

/* The route target is the only area blurred during navigation. Sidebar, header and player remain sharp and persistent. */
.fk-route-target.fk-route-loading{filter:blur(7px)!important;opacity:.6!important;transition:filter .2s ease,opacity .2s ease}

@media (max-width:520px){
    .fk-app-header-actions a{width:34px;height:34px}
    .fk-mobile-brand img{width:96px}
    .fk-header-search{padding:0 11px}
}


/* =========================================================
   FARSKIDS FINAL UI PATCH — requested visual corrections
   ========================================================= */
/* Header search is intentionally removed on both desktop and mobile. */
.fk-header-search{display:none!important}
.fk-app-header-actions a[title="جستجو"],
.fk-app-header-actions a[aria-label="جستجو"]{display:none!important}

/* Keep the fixed shell in the site's existing charcoal/red palette. */
.fk-app-sidebar a.fk-nav-active{background:rgba(153,27,27,.26)!important;color:#fff!important}
.fk-app-sidebar a:hover{background:rgba(255,255,255,.045)!important}
.fk-app-header-actions a:hover{color:#fff!important;background:rgba(255,255,255,.08)!important}

/* The logo inside page templates is redundant: the persistent header/sidebar owns branding. */
.xl\:container img.w-36.col-span-4.mx-auto.2xsm\:block.mb-6.xl\:hidden.opacity-90{display:none!important}

/* Loader belongs only to the content canvas, never over the header/sidebar/player chrome. */
#fk-page-loader{top:64px!important;right:270px!important;bottom:90px!important;left:0!important;z-index:10040!important;background:rgba(7,8,13,.30)!important}
#fk-page-loader .fk-loader-inner{border-top-color:#e63946!important;border-left-color:rgba(255,255,255,.72)!important;border-right-color:rgba(255,255,255,.14)!important;box-shadow:0 0 24px rgba(230,57,70,.18)!important}

/* Expanded player must sit above the fixed header so its close button can always be tapped. */
body.fk-player-panel-open #farskids-fixed-menu{z-index:20000!important}
body.fk-player-panel-open #farskids-fixed-menu .fk-player-panel{z-index:20001!important}
body.fk-player-panel-open .fk-app-header{z-index:10020!important}

/* Mobile bottom navigation is flush with the viewport edge, like a native app. */
@media(max-width:1023px){
    body{padding-bottom:96px!important}
    .fixedside-bottom{
        left:0!important;right:0!important;bottom:0!important;width:100%!important;
        margin:0!important;border-radius:0!important;
        padding:8px 10px max(8px,env(safe-area-inset-bottom))!important;
        z-index:10020!important;
        border-left:0!important;border-right:0!important;border-bottom:0!important;
        background:rgba(24,23,22,.98)!important;
        backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
    }
    .fixedside-bottom ul{padding-left:4px!important;padding-right:4px!important}
    #farskids-fixed-menu{left:0!important;right:0!important;bottom:96px!important;width:100%!important}
    #farskids-fixed-menu .fk-player-panel{z-index:20001!important}
    #fk-page-loader{top:62px!important;right:0!important;bottom:96px!important;left:0!important}
}

@media(max-width:767px){
    /* Make the close button sit in the visible top area of the expanded player. */
    body.fk-player-panel-open #farskids-fixed-menu .fk-player-panel .fk-panel-close{
        display:flex!important;visibility:visible!important;opacity:1!important;
        top:12px!important;right:12px!important;z-index:20010!important;
    }
}


/* =========================================================
   FARSKIDS MOBILE / AJAX FINAL BUGFIX — 2026-09-23
   ========================================================= */
:root{--fk-mobile-nav-height:76px;--fk-mobile-player-height:70px;--fk-app-header-height:62px}

/* Header: no search/browse action; mobile brand is exactly centered. */
.fk-header-search,
.fk-app-header-actions a[title="مرور"],
.fk-app-header-actions a[aria-label="مرور"],
.fk-app-header-actions a[title="جستجو"],
.fk-app-header-actions a[aria-label="جستجو"]{display:none!important}
@media(max-width:1023px){
    .fk-app-header{height:var(--fk-app-header-height)!important}
    .fk-app-header-inner{position:relative!important;padding:0 12px!important;justify-content:center!important}
    .fk-mobile-brand{position:absolute!important;left:50%!important;right:auto!important;top:50%!important;transform:translate(-50%,-50%)!important;display:flex!important;align-items:center!important;justify-content:center!important;margin:0!important}
    .fk-mobile-brand img{width:104px!important;max-width:104px!important;height:auto!important;max-height:42px!important;margin:0!important}
    .fk-app-header-actions{display:none!important}
}

/* Remove duplicate in-content mobile logos. Sidebar/header owns the brand. */
.fk-route-target > img.w-36,
.fk-route-target main > img.w-36,
.fk-route-target img.w-36.col-span-4.mx-auto,
main img.w-36.col-span-4.mx-auto,
main > img[src*="/images/logo.svg"],
main > img[src*="/images/logo-mag.svg"]{display:none!important}

/* The mobile app navigation is edge-to-edge and never gets a red active/focus box. */
@media(max-width:1023px){
    .fixedside-bottom{
        left:0!important;right:0!important;bottom:0!important;width:100%!important;
        margin:0!important;border-radius:0!important;
        padding:8px 10px max(8px,env(safe-area-inset-bottom))!important;
        z-index:10020!important;
        box-shadow:none!important;
    }
    .fixedside-bottom a,
    .fixedside-bottom a:hover,
    .fixedside-bottom a:focus,
    .fixedside-bottom a:active,
    .fixedside-bottom a.fk-nav-active{
        background:transparent!important;
        border:0!important;
        outline:0!important;
        box-shadow:none!important;
        color:inherit!important;
    }
    .fixedside-bottom a.fk-nav-active i,
    .fixedside-bottom a.fk-nav-active span{color:inherit!important}
    .fixedside-bottom li{background:transparent!important}
    body{padding-bottom:calc(var(--fk-mobile-nav-height) + 4px)!important}
}

/* Player sits directly on top of the bottom navigation — zero gap. */
@media(max-width:767px){
    #farskids-fixed-menu{
        left:0!important;right:0!important;width:100%!important;
        bottom:var(--fk-mobile-nav-height)!important;
        z-index:10010!important;
        margin:0!important;
    }
    #farskids-fixed-menu .fk-player-shell{z-index:10011!important}
    #farskids-fixed-menu .fk-player-bar{z-index:10012!important}
    #farskids-fixed-menu .fk-player-panel{
        left:0!important;right:0!important;width:100vw!important;
        bottom:var(--fk-mobile-nav-height)!important;
        border-radius:18px 18px 0 0!important;
        z-index:10050!important;
        max-height:calc(100dvh - var(--fk-mobile-nav-height) - var(--fk-app-header-height) - 8px)!important;
        height:calc(100dvh - var(--fk-mobile-nav-height) - var(--fk-app-header-height) - 8px)!important;
    }
    body.fk-player-panel-open #farskids-fixed-menu .fk-player-panel{z-index:10050!important}
    body.fk-player-panel-open .fk-app-header{z-index:10020!important}
    body.fk-player-panel-open #farskids-fixed-menu .fk-panel-close{
        position:absolute!important;top:12px!important;right:12px!important;
        width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;
        display:flex!important;align-items:center!important;justify-content:center!important;
        z-index:10060!important;pointer-events:auto!important;visibility:visible!important;opacity:1!important;
    }
}

/* Route loader: center spinner over content only. It must remain UNDER header/sidebar. */
#fk-page-loader{
    position:fixed!important;
    top:var(--fk-app-header-height)!important;
    right:270px!important;
    bottom:90px!important;
    left:0!important;
    width:auto!important;
    height:auto!important;
    min-height:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    z-index:10000!important;
    background:rgba(12,11,11,.26)!important;
    backdrop-filter:blur(7px)!important;
    -webkit-backdrop-filter:blur(7px)!important;
    border:0!important;
    box-shadow:none!important;
}
#fk-page-loader::before{
    content:""!important;
    display:block!important;
    width:48px!important;height:48px!important;
    border-radius:50%!important;
    border:4px solid rgba(255,255,255,.14)!important;
    border-top-color:#e20b0b!important;
    border-right-color:rgba(255,255,255,.82)!important;
    border-left-color:rgba(255,255,255,.28)!important;
    animation:fkCenterSpin .72s linear infinite!important;
    box-shadow:0 0 22px rgba(226,11,11,.18)!important;
}
#fk-page-loader::after{display:none!important;content:none!important}
@keyframes fkCenterSpin{to{transform:rotate(360deg)}}
@media(max-width:1023px){
    #fk-page-loader{
        top:var(--fk-app-header-height)!important;
        right:0!important;left:0!important;
        bottom:calc(var(--fk-mobile-nav-height) + var(--fk-mobile-player-height))!important;
        z-index:10000!important;
    }
}

/* Lyrics modal: keep dialog away from the header and always expose the close button. */
.fk-lyrics-modal{z-index:100000!important;padding:20px!important;align-items:center!important}
.fk-lyrics-dialog{position:relative!important;max-height:min(72dvh,720px)!important}
.fk-lyrics-close{position:absolute!important;top:10px!important;left:10px!important;right:auto!important;width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;z-index:100010!important;display:flex!important;align-items:center!important;justify-content:center!important;pointer-events:auto!important;visibility:visible!important;opacity:1!important;font-size:26px!important}
.fk-lyrics-scroll{max-height:calc(min(72dvh,720px) - 85px)!important}
@media(max-width:768px){
    .fk-lyrics-modal{padding:calc(var(--fk-app-header-height) + 10px) 10px calc(var(--fk-mobile-nav-height) + 10px)!important;align-items:center!important}
    .fk-lyrics-dialog{width:min(94vw,540px)!important;max-height:calc(100dvh - var(--fk-app-header-height) - var(--fk-mobile-nav-height) - 20px)!important;margin:0 auto!important}
    .fk-lyrics-dialog-inner{padding:58px 12px 13px!important}
    .fk-lyrics-close{top:10px!important;left:10px!important;width:42px!important;height:42px!important;z-index:100020!important}
    .fk-lyrics-scroll{max-height:calc(100dvh - var(--fk-app-header-height) - var(--fk-mobile-nav-height) - 105px)!important}
}

/* Keep content blur limited to the AJAX canvas; chrome never blurs. */
.fk-route-target.fk-route-loading{filter:blur(7px)!important;opacity:.58!important}


/* =========================================================
   FARSKIDS FINAL UI/CHROME FIX — 2026-09-23
   ========================================================= */
/* Existing FarsKids charcoal/brown palette — no navy/purple. Glass without changing the site's colors. */
.fk-app-header{
    background:rgba(23,22,21,.78)!important;
    border-bottom:1px solid rgba(255,255,255,.09)!important;
    box-shadow:0 8px 30px rgba(0,0,0,.16)!important;
    backdrop-filter:blur(20px) saturate(110%)!important;
    -webkit-backdrop-filter:blur(20px) saturate(110%)!important;
}
.fk-app-sidebar{
    background:rgba(24,23,22,.78)!important;
    border-left:1px solid rgba(255,255,255,.09)!important;
    box-shadow:-8px 0 30px rgba(0,0,0,.14)!important;
    backdrop-filter:blur(22px) saturate(110%)!important;
    -webkit-backdrop-filter:blur(22px) saturate(110%)!important;
}
.fk-app-sidebar a.fk-nav-active{background:rgba(255,255,255,.075)!important;color:#fff!important}
.fk-app-sidebar a:hover{background:rgba(255,255,255,.055)!important}

/* The route loader is a real centered overlay over the content canvas. */
#fk-page-loader{
    position:fixed!important;
    top:var(--fk-app-header-height,64px)!important;
    right:270px!important;
    bottom:90px!important;
    left:0!important;
    width:auto!important;
    height:auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    background:rgba(23,22,21,.34)!important;
    backdrop-filter:blur(7px)!important;
    -webkit-backdrop-filter:blur(7px)!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    z-index:10010!important;
    transition:opacity .16s ease,visibility .16s ease!important;
}
#fk-page-loader.active,
html.fk-page-loading #fk-page-loader{
    opacity:1!important;
    visibility:visible!important;
}
#fk-page-loader:before{
    content:""!important;
    width:46px!important;
    height:46px!important;
    display:block!important;
    border-radius:50%!important;
    border:4px solid rgba(255,255,255,.16)!important;
    border-top-color:#e20b0b!important;
    border-right-color:rgba(255,255,255,.82)!important;
    border-left-color:rgba(255,255,255,.35)!important;
    animation:fkFinalLoaderSpin .72s linear infinite!important;
    box-shadow:0 0 22px rgba(226,11,11,.18)!important;
}
@keyframes fkFinalLoaderSpin{to{transform:rotate(360deg)}}
.fk-route-target.fk-route-loading,
html.fk-page-loading .xl\\:container{
    filter:blur(7px)!important;
    opacity:.60!important;
    transition:filter .16s ease,opacity .16s ease!important;
}

/* Mobile chrome: nav is flush to the viewport, player touches it with zero gap. */
@media(max-width:1023px){
    :root{--fk-mobile-nav-height:76px!important;--fk-app-header-height:62px!important}
    .fixedside-bottom{
        left:0!important;right:0!important;bottom:0!important;width:100%!important;
        margin:0!important;border-radius:0!important;
        padding:8px 10px max(8px,env(safe-area-inset-bottom))!important;
        background:rgba(24,23,22,.88)!important;
        border-top:1px solid rgba(255,255,255,.08)!important;
        backdrop-filter:blur(18px) saturate(110%)!important;
        -webkit-backdrop-filter:blur(18px) saturate(110%)!important;
    }
    #farskids-fixed-menu{
        left:0!important;right:0!important;width:100%!important;
        bottom:var(--fk-mobile-nav-height)!important;
        margin:0!important;
    }
    #farskids-fixed-menu .fk-player-shell.is-visible{margin:0!important}
    #fk-page-loader{
        top:var(--fk-app-header-height)!important;
        right:0!important;left:0!important;
        bottom:var(--fk-mobile-nav-height)!important;
        z-index:10010!important;
    }
}
@media(max-width:767px){
    #farskids-fixed-menu .fk-player-panel{
        left:0!important;right:0!important;width:100vw!important;
        bottom:var(--fk-mobile-nav-height)!important;
        border-radius:18px 18px 0 0!important;
        max-height:calc(100dvh - var(--fk-app-header-height) - var(--fk-mobile-nav-height) - 8px)!important;
        height:calc(100dvh - var(--fk-app-header-height) - var(--fk-mobile-nav-height) - 8px)!important;
    }
    #farskids-fixed-menu .fk-player-bar{border-radius:0!important}
}

/* Lyrics: always above the player, compact on phones, with a reachable close button. */
.fk-lyrics-modal{
    z-index:2147483646!important;
    padding:14px!important;
}
.fk-lyrics-dialog{
    width:min(540px,92vw)!important;
    max-height:min(68dvh,680px)!important;
}
.fk-lyrics-scroll{max-height:calc(min(68dvh,680px) - 82px)!important}
@media(max-width:767px){
    .fk-lyrics-modal{
        inset:var(--fk-app-header-height) 0 var(--fk-mobile-nav-height) 0!important;
        padding:8px 10px!important;
        align-items:center!important;
    }
    .fk-lyrics-dialog{
        width:min(94vw,500px)!important;
        max-width:94vw!important;
        max-height:calc(100dvh - var(--fk-app-header-height) - var(--fk-mobile-nav-height) - 16px)!important;
        margin:0!important;
    }
    .fk-lyrics-dialog-inner{padding:52px 11px 10px!important}
    .fk-lyrics-scroll{
        max-height:calc(100dvh - var(--fk-app-header-height) - var(--fk-mobile-nav-height) - 92px)!important;
        overflow-y:auto!important;
    }
    .fk-lyrics-close{
        top:8px!important;left:8px!important;
        width:40px!important;height:40px!important;
        min-width:40px!important;min-height:40px!important;
        z-index:2147483647!important;
        pointer-events:auto!important;
    }
}


/* =========================================================
   FARSKIDS MOBILE NAV — ACTIVE ROUTE + ZERO-GAP PLAYER
   ========================================================= */
@media (max-width:1023px){
    .fixedside-bottom a.fk-mobile-active{
        color:#fff!important;
        opacity:1!important;
        transform:translateY(-1px);
    }
    .fixedside-bottom a.fk-mobile-active i{
        color:#ff2d35!important;
        filter:drop-shadow(0 0 5px rgba(255,45,53,.30));
        transform:scale(1.08);
    }
    .fixedside-bottom a.fk-mobile-active span{
        color:#fff!important;
        font-weight:700!important;
    }
    .fixedside-bottom a.fk-mobile-active:after{
        content:"";
        display:block;
        position:absolute;
        left:50%;
        bottom:-3px;
        width:4px;
        height:4px;
        border-radius:50%;
        background:#ff2d35;
        transform:translateX(-50%);
        box-shadow:0 0 7px rgba(255,45,53,.45);
    }
    .fixedside-bottom li{position:relative!important;}
}

@media (max-width:767px){
    /* The player is attached directly to the navigation: no 1px/5px/6px gap. */
    #farskids-fixed-menu,
    #farskids-fixed-menu .fk-player-shell,
    #farskids-fixed-menu .fk-player-bar{
        margin:0!important;
    }
    #farskids-fixed-menu{
        bottom:var(--fk-mobile-nav-height)!important;
        left:0!important;
        right:0!important;
        width:100%!important;
    }
    #farskids-fixed-menu .fk-player-shell.is-visible{
        height:70px!important;
        margin:0!important;
    }
    #farskids-fixed-menu .fk-player-bar{
        border-radius:0!important;
    }
}

/* =========================================================
   FARSKIDS HEADER ACCOUNT AVATAR — FINAL
   ========================================================= */
.fk-app-header-inner{position:relative!important;display:block!important;padding:0 20px!important;direction:ltr!important}
.fk-app-nav-arrows{position:absolute!important;left:20px!important;top:13px!important;z-index:2!important}
.fk-app-header-actions{position:absolute!important;left:112px!important;top:14px!important;display:flex!important;align-items:center!important;z-index:3!important;direction:ltr!important}
.fk-header-avatar{width:36px!important;height:36px!important;border-radius:50%!important;overflow:hidden!important;display:flex!important;align-items:center!important;justify-content:center!important;background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.10)!important;color:#d6d3d1!important;text-decoration:none!important;padding:0!important}
.fk-header-avatar img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important;border-radius:50%!important}
.fk-header-avatar i{font-size:18px!important;line-height:1!important}
.fk-header-avatar:hover{background:rgba(255,255,255,.12)!important;color:#fff!important}
.fk-mobile-brand{display:flex!important;position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;align-items:center!important;justify-content:center!important;z-index:2!important;margin:0!important}
.fk-mobile-brand img{display:block!important;width:105px!important;max-height:42px!important}

@media(max-width:1023px){
  .fk-app-header-inner{padding:0!important}
  .fk-app-nav-arrows{display:none!important}
  .fk-app-header-actions{left:12px!important;top:14px!important}
  .fk-header-avatar{width:34px!important;height:34px!important}
  .fk-mobile-brand img{width:96px!important;max-height:40px!important}
}


/* =========================================================
   FARSKIDS MOBILE HEADER CLEANUP — 2026-09-24
   Remove any legacy second mobile header/login row. The only
   mobile chrome is #fk-app-header + fixed bottom navigation.
   ========================================================= */
@media(max-width:1023px){
    #fk-app-header{display:block!important;position:fixed!important;top:0!important;left:0!important;right:0!important;height:62px!important;z-index:10020!important}
    #fk-app-header .fk-app-header-inner{position:relative!important;width:100%!important;height:62px!important;display:block!important;padding:0!important;margin:0!important}

    /* One centered brand only. */
    #fk-app-header .fk-mobile-brand{
        display:flex!important;
        position:absolute!important;
        left:50%!important;
        right:auto!important;
        top:50%!important;
        transform:translate(-50%,-50%)!important;
        width:auto!important;
        height:auto!important;
        margin:0!important;
        z-index:5!important;
    }
    #fk-app-header .fk-mobile-brand img{width:104px!important;max-width:104px!important;height:auto!important;max-height:42px!important;margin:0!important}

    /* Avatar belongs on the left corner of the main header. */
    #fk-app-header .fk-app-header-actions{
        display:flex!important;
        position:absolute!important;
        left:12px!important;
        right:auto!important;
        top:50%!important;
        transform:translateY(-50%)!important;
        width:36px!important;
        height:36px!important;
        margin:0!important;
        z-index:6!important;
    }
    #fk-app-header .fk-header-avatar{
        display:flex!important;
        width:34px!important;height:34px!important;
        min-width:34px!important;min-height:34px!important;
        border-radius:50%!important;
    }

    /* Legacy header/login rows generated by old templates. */
    body > header:not(#fk-app-header),
    body > .mobile-header,
    body > .mobile-header-wrapper,
    body > .fk-mobile-header,
    body > .site-mobile-header,
    body > .mobile-top-header,
    body > .mobile-login-header{display:none!important}

    /* Never show the old login/register pill outside the persistent header. */
    body a.fk-mobile-login,
    body button.fk-mobile-login,
    body .fk-login-trigger:not(#fk-app-header .fk-login-trigger),
    body #fk-login-btn:not(#fk-app-header #fk-login-btn),
    body #fk-sidebar-login-btn{display:none!important}
}

/* The route content must not recreate branding above the page itself. */
@media(max-width:1023px){
    .fk-route-target img[src*="/images/logo.svg"]:not(.farskids-tariff-logo),
    .fk-route-target img[src*="/images/logo-mag.svg"]{
        display:none!important;
    }
}

/* =========================================================
   FARSKIDS REQUESTED UI PATCH — 2026-09-24
   ========================================================= */
/* Desktop: branding belongs to the persistent sidebar only. */
@media (min-width:1024px){
    #fk-app-header .fk-mobile-brand{display:none!important;}
}

/* Playlist detail: track name on top, artist directly underneath. */
.fk-album-track-name{
    min-width:0;
    flex:1 1 auto;
    overflow:hidden;
    text-align:right;
    line-height:1.55;
}
.fk-album-track-title{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.fk-album-track-artist{
    display:block;
    margin-top:2px;
    color:#9a9a9a;
    font-size:10px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

/* Playlist detail: no per-track download controls. */
.single-playlists .fk-album-track-downloads{display:none!important;}

/* Compact + action used beside date/share on song pages. */
.fk-add-to-playlist-icon{
    width:28px;
    height:28px;
    min-width:28px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(255,255,255,.12);
    border-radius:50%;
    background:rgba(255,255,255,.055);
    color:#bdbdbd;
    cursor:pointer;
    text-decoration:none!important;
    transition:all .18s ease;
    padding:0;
}
.fk-add-to-playlist-icon:hover,
.fk-add-to-playlist-icon:focus-visible{
    color:#fff;
    background:rgba(255,255,255,.11);
    border-color:rgba(255,255,255,.22);
    outline:none;
}

/* Mobile: mini player is flush against the bottom navigation. */
@media (max-width:767px){
    #farskids-fixed-menu{
        left:0!important;
        right:0!important;
        width:100%!important;
        bottom:var(--fk-mobile-nav-height)!important;
        margin:0!important;
    }
    #farskids-fixed-menu .fk-player-shell.is-visible{
        margin:0!important;
        transform:none!important;
    }

    /* Reserve the mini-player's footprint so the last page content never sits
       underneath it while the player is visible. */
    body.fk-player-visible{
        padding-bottom:calc(var(--fk-mobile-nav-height) + var(--fk-mobile-player-height) + 8px)!important;
    }

    /* The lyrics dialog must be above both the mini player and expanded player. */
    .fk-lyrics-modal{
        z-index:2147483647!important;
    }
    .fk-lyrics-modal .fk-lyrics-dialog,
    .fk-lyrics-modal .fk-lyrics-backdrop{
        z-index:2147483647!important;
    }
}


/* =========================================================
   FARSKIDS FINAL REQUESTED FIX — 2026-09-24b
   ========================================================= */
@media (min-width:1024px){
    /* Desktop branding is sidebar-only. */
    html body #fk-app-header .fk-mobile-brand,
    html body #fk-app-header a.fk-mobile-brand{display:none!important;visibility:hidden!important;width:0!important;height:0!important;overflow:hidden!important}
}

/* Clearer add-to-playlist affordance: compact pill with a visible purpose label. */
.fk-add-to-playlist-icon{
    width:auto!important;
    min-width:34px!important;
    height:30px!important;
    padding:0 9px!important;
    gap:5px!important;
    border-radius:999px!important;
    background:linear-gradient(135deg,rgba(226,11,11,.16),rgba(255,255,255,.06))!important;
    border:1px solid rgba(226,11,11,.30)!important;
    color:#eee!important;
    box-shadow:0 4px 16px rgba(0,0,0,.14)!important;
    white-space:nowrap!important;
}
.fk-add-to-playlist-icon .icon-plus{font-size:15px!important;line-height:1!important}
.fk-add-to-playlist-icon .fk-add-label{font-size:10px!important;line-height:1!important}
.fk-add-to-playlist-icon:hover,.fk-add-to-playlist-icon:focus-visible{
    color:#fff!important;
    background:linear-gradient(135deg,rgba(226,11,11,.30),rgba(255,255,255,.10))!important;
    border-color:rgba(226,11,11,.55)!important;
    transform:translateY(-1px)!important;
}

/* Playlist header actions: like sits directly beside share. */
.single-playlists .likepost{gap:2px!important}
.single-playlists .fk-playlist-action-hint{
    display:inline-flex!important;
    align-items:center!important;
    gap:5px!important;
    height:30px!important;
    padding:0 10px!important;
    border-radius:999px!important;
    border:1px solid rgba(226,11,11,.28)!important;
    background:rgba(226,11,11,.10)!important;
    color:#eee!important;
    font-size:11px!important;
    cursor:default!important;
}
.single-playlists .fk-playlist-action-hint:first-letter{font-size:18px!important}

/* Mobile player: calculate the real nav height so the player touches it with no gap. */
@media(max-width:767px){
    #farskids-fixed-menu{
        bottom:var(--fk-mobile-nav-real-height,76px)!important;
        left:0!important;right:0!important;width:100%!important;
        margin:0!important;padding:0!important;
    }
    #farskids-fixed-menu .fk-player-shell.is-visible{
        height:70px!important;
        margin:0!important;
        padding:0!important;
        transform:none!important;
    }
    #farskids-fixed-menu .fk-player-bar{
        margin:0!important;
        border-radius:0!important;
    }
    #farskids-fixed-menu .fk-player-panel{
        bottom:var(--fk-mobile-nav-real-height,76px)!important;
    }
    body.fk-player-visible #ajax-content,
    body.fk-player-visible main#ajax-content,
    body.fk-player-visible .fk-route-target{
        padding-bottom:calc(var(--fk-mobile-player-height,70px) + var(--fk-mobile-nav-real-height,76px) + 24px)!important;
    }

    /* Lyrics must occupy the viewport above the nav and above the player. */
    body .fk-lyrics-modal{
        position:fixed!important;
        inset:var(--fk-app-header-height,62px) 0 0 0!important;
        z-index:2147483647!important;
        padding:10px!important;
        align-items:center!important;
    }
    body .fk-lyrics-modal .fk-lyrics-dialog{
        position:relative!important;
        z-index:2147483647!important;
        max-height:calc(100dvh - var(--fk-app-header-height,62px) - 20px)!important;
    }
}

/* Make the lyrics/add-to-playlist modals true body-level overlays. */

/* =========================================================
   FARSKIDS — MOBILE PLAYER / LYRICS DEFINITIVE FIX — 2026-09-24
   ========================================================= */
@media (max-width:767px){
    /* Bottom navigation is the exact anchor for the mini player. */
    .fixedside-bottom{
        bottom:0!important;
        margin:0!important;
        padding-bottom:max(8px,env(safe-area-inset-bottom))!important;
    }

    /* The mini player sits directly on the navigation: zero gap, zero extra height. */
    #farskids-fixed-menu{
        position:fixed!important;
        left:0!important;
        right:0!important;
        bottom:var(--fk-mobile-nav-real-height,76px)!important;
        width:100%!important;
        margin:0!important;
        padding:0!important;
        height:auto!important;
        z-index:12000!important;
    }
    #farskids-fixed-menu .fk-player-shell.is-visible{
        display:block!important;
        height:64px!important;
        min-height:64px!important;
        max-height:64px!important;
        margin:0!important;
        padding:0!important;
        bottom:auto!important;
        transform:none!important;
    }
    #farskids-fixed-menu .fk-player-bar{
        box-sizing:border-box!important;
        width:100%!important;
        height:64px!important;
        min-height:64px!important;
        max-height:64px!important;
        margin:0!important;
        padding:7px 9px!important;
        border-radius:0!important;
        transform:none!important;
    }

    /* The expanded player also ends exactly at the top edge of the bottom nav. */
    #farskids-fixed-menu .fk-player-panel{
        position:fixed!important;
        left:0!important;
        right:0!important;
        bottom:var(--fk-mobile-nav-real-height,76px)!important;
        width:100vw!important;
        height:calc(100dvh - var(--fk-app-header-height,62px) - var(--fk-mobile-nav-real-height,76px))!important;
        max-height:calc(100dvh - var(--fk-app-header-height,62px) - var(--fk-mobile-nav-real-height,76px))!important;
        z-index:2147483001!important;
    }

    /* Reserve the exact occupied area in the document. */
    body.fk-player-visible{
        padding-bottom:calc(var(--fk-mobile-nav-real-height,76px) + 64px + 12px)!important;
    }
    body.fk-player-visible #ajax-content,
    body.fk-player-visible main#ajax-content,
    body.fk-player-visible .fk-route-target{
        padding-bottom:12px!important;
    }

    /* Lyrics modal is a body-level overlay ABOVE the mini/expanded player. */
    body .fk-lyrics-modal{
        position:fixed!important;
        top:var(--fk-app-header-height,62px)!important;
        right:0!important;
        left:0!important;
        bottom:calc(var(--fk-mobile-nav-real-height,76px) + 64px)!important;
        inset:auto 0 calc(var(--fk-mobile-nav-real-height,76px) + 64px) 0!important;
        width:100vw!important;
        height:auto!important;
        padding:10px!important;
        align-items:center!important;
        justify-content:center!important;
        z-index:2147483647!important;
    }
    body .fk-lyrics-modal .fk-lyrics-backdrop,
    body .fk-lyrics-modal .fk-lyrics-dialog{
        z-index:2147483647!important;
    }
    body .fk-lyrics-modal .fk-lyrics-dialog{
        max-height:100%!important;
        margin:0!important;
    }
}


/* =========================================================
   FARSKIDS — FINAL INTERACTION FIXES 2026-09-24
   ========================================================= */

/* Desktop sidebar: active item is red, including its icon. */
@media (min-width:1024px){
    .fk-app-sidebar a.fk-nav-active,
    .fk-app-sidebar a.fk-nav-active span,
    .fk-app-sidebar a.fk-nav-active i{
        color:#ff2d35!important;
    }
    .fk-app-sidebar a.fk-nav-active{
        background:rgba(255,45,53,.10)!important;
        box-shadow:inset -3px 0 0 #ff2d35!important;
    }
    .fk-app-sidebar a{min-height:40px!important;padding:7px 10px!important;}
}

/* Mobile bottom nav: the whole button is tappable, not only the icon. */
@media (max-width:1023px){
    .fixedside-bottom li{
        flex:1 1 0!important;
        min-width:0!important;
        min-height:52px!important;
        display:flex!important;
        align-items:stretch!important;
        justify-content:center!important;
        position:relative!important;
    }
    .fixedside-bottom li > a{
        width:100%!important;
        min-height:52px!important;
        padding:7px 4px!important;
        display:flex!important;
        align-items:center!important;
        justify-content:center!important;
        gap:3px!important;
        position:relative!important;
        z-index:10025!important;
        touch-action:manipulation!important;
        -webkit-tap-highlight-color:transparent!important;
    }
    .fixedside-bottom li > a.fk-mobile-active,
    .fixedside-bottom li > a.fk-mobile-active i,
    .fixedside-bottom li > a.fk-mobile-active span{
        color:#ff2d35!important;
        opacity:1!important;
    }
    .fixedside-bottom li > a.fk-mobile-active i{
        filter:drop-shadow(0 0 5px rgba(255,45,53,.30));
        transform:scale(1.08);
    }
    .fixedside-bottom li > a.fk-mobile-active:after{
        background:#ff2d35!important;
    }
    .fixedside-bottom li > a:focus,
    .fixedside-bottom li > a:active{
        background:transparent!important;
        outline:none!important;
    }
}

/* Artist biography accordion. */
.lyricsbox > .btn{cursor:pointer!important;user-select:none!important;}
.lyricsbox > .allinfo{overflow:hidden;}

/* Playlist page: no add action beside share. */
.single-playlists .fk-playlist-action-hint{display:none!important;}

/* FINAL UI CORRECTIONS — 2026-09-24 */
@media (min-width:1024px){
  .fk-app-sidebar a.fk-nav-active,
  .fk-app-sidebar a.fk-nav-active span,
  .fk-app-sidebar a.fk-nav-active i{
    color:#ff2d35!important;
  }
  .fk-app-sidebar a.fk-nav-active{
    background:rgba(255,45,53,.10)!important;
    box-shadow:none!important;
    outline:none!important;
    border:0!important;
  }
  .fk-app-sidebar a.fk-nav-active:hover{background:rgba(255,45,53,.14)!important;}
  .fk-app-sidebar a:focus,.fk-app-sidebar a:focus-visible{outline:none!important;box-shadow:none!important;}
}
@media (max-width:1023px){
  .fixedside-bottom li:last-child a span{white-space:nowrap!important;display:block!important;font-size:11px!important;}
}
/* Desktop: logo is owned by the sidebar, not the top header. */
@media (min-width:1024px){.fk-app-header .fk-mobile-brand{display:none!important;}}
/* Keep player cover a control surface, not a link that reloads/restarts audio. */
.player .fk-player-song,.player .fk-panel-current{cursor:pointer!important;}

/* Absolute final overrides */
@media (min-width:1024px){
  .fk-app-sidebar a.fk-nav-active,
  .fk-app-sidebar a.fk-nav-active:hover,
  .fk-app-sidebar a.fk-nav-active:focus,
  .fk-app-sidebar a.fk-nav-active:focus-visible{
    color:#ff2d35!important;
    background:transparent!important;
    box-shadow:none!important;
    outline:none!important;
    border:0!important;
  }
  .fk-app-sidebar a.fk-nav-active span,
  .fk-app-sidebar a.fk-nav-active i{color:#ff2d35!important;}
  #fk-app-header img[src*="/images/logo.svg"],
  #fk-app-header img[src*="/images/logo-mag.svg"]{display:none!important;}
}
@media (max-width:1023px){
  .fixedside-bottom li:last-child a span{white-space:nowrap!important;word-break:keep-all!important;overflow:visible!important;font-size:11px!important;}
}

/* v3.6 — stable standard SVG icons for mobile navigation */
.fixedside-bottom .fk-mobile-icon{
    width:20px!important;height:20px!important;min-width:20px!important;
    display:inline-flex!important;align-items:center!important;justify-content:center!important;
    margin:0!important;line-height:0!important;flex:0 0 20px!important;
}
.fixedside-bottom .fk-mobile-icon svg{
    width:19px!important;height:19px!important;display:block!important;
    fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;
    stroke-linecap:round!important;stroke-linejoin:round!important;
}
.fixedside-bottom li > a span:not(.fk-mobile-icon){
    white-space:nowrap!important;word-break:keep-all!important;overflow:visible!important;
}
@media(max-width:767px){
    .fixedside-bottom li > a{outline:0!important;box-shadow:none!important;-webkit-tap-highlight-color:transparent!important;}
    .fixedside-bottom li > a:focus,.fixedside-bottom li > a:focus-visible,.fixedside-bottom li > a:active{
        outline:0!important;box-shadow:none!important;background:transparent!important;
    }
}
/* Biography content is controlled by JS; never let utility .hidden block slideDown. */
.lyricsbox .allinfo{overflow:hidden;}

/* v3.8 — mobile navigation: no focus/active highlight; standard semantic icons */
@media (max-width:1023px){
  .fixedside-bottom li > a,
  .fixedside-bottom li > a:hover,
  .fixedside-bottom li > a:focus,
  .fixedside-bottom li > a:focus-visible,
  .fixedside-bottom li > a:active,
  .fixedside-bottom li > a.fk-mobile-active{
    background:transparent!important;
    outline:0!important;
    box-shadow:none!important;
    border:0!important;
    transform:none!important;
    -webkit-tap-highlight-color:transparent!important;
  }
  .fixedside-bottom li > a.fk-mobile-active:before,
  .fixedside-bottom li > a.fk-mobile-active:after,
  .fixedside-bottom li > a:before,
  .fixedside-bottom li > a:after{
    content:none!important;
    display:none!important;
  }
  .fixedside-bottom li > a.fk-mobile-active,
  .fixedside-bottom li > a.fk-mobile-active span:not(.fk-mobile-icon),
  .fixedside-bottom li > a.fk-mobile-active .fk-mobile-icon{
    color:#ff2d35!important;
  }
  .fixedside-bottom li > a .fk-mobile-icon{
    width:22px!important;height:22px!important;min-width:22px!important;
    flex:0 0 22px!important;
  }
  .fixedside-bottom li > a .fk-mobile-icon svg{
    width:21px!important;height:21px!important;
    fill:none!important;stroke:currentColor!important;
    stroke-width:1.9!important;stroke-linecap:round!important;stroke-linejoin:round!important;
  }
  .fixedside-bottom li > a.fk-mobile-active .fk-mobile-icon svg{
    filter:none!important;transform:none!important;
  }
}


/* v4.0 — final mobile nav tap artifact reset + homepage ad cleanup */
@media (max-width:1023px){
  .fixedside-bottom li > a,
  .fixedside-bottom li > a:hover,
  .fixedside-bottom li > a:active,
  .fixedside-bottom li > a:focus,
  .fixedside-bottom li > a:focus-visible,
  .fixedside-bottom li > a.fk-mobile-active,
  .fixedside-bottom li > a.fk-mobile-active:hover,
  .fixedside-bottom li > a.fk-mobile-active:active,
  .fixedside-bottom li > a.fk-mobile-active:focus{
    background:transparent!important;
    background-color:transparent!important;
    box-shadow:none!important;
    outline:0!important;
    border:0!important;
    -webkit-tap-highlight-color:transparent!important;
    transform:none!important;
  }
  .fixedside-bottom li > a::before,
  .fixedside-bottom li > a::after,
  .fixedside-bottom li > a.fk-mobile-active::before,
  .fixedside-bottom li > a.fk-mobile-active::after{
    content:none!important;
    display:none!important;
    width:0!important;height:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  .fixedside-bottom li > a.fk-mobile-active,
  .fixedside-bottom li > a.fk-mobile-active span:not(.fk-mobile-icon),
  .fixedside-bottom li > a.fk-mobile-active .fk-mobile-icon{
    color:#ff2d35!important;
  }
  .fixedside-bottom li > a.fk-mobile-active .fk-mobile-icon svg{
    color:#ff2d35!important;
    stroke:currentColor!important;
    filter:none!important;
  }
  .fixedside-bottom li > a:not(.fk-mobile-active){
    color:#a8a29e!important;
  }
  .fixedside-bottom li > a:not(.fk-mobile-active) .fk-mobile-icon{
    color:#a8a29e!important;
  }
}

/* =========================================================
   FARSKIDS — MOBILE/TABLET BOTTOM NAV RESPONSIVE STABILIZER
   Only fixes the bottom navigation alignment/responsiveness.
   ========================================================= */
@media (max-width:1023px){
    .fixedside-bottom{
        box-sizing:border-box!important;
        overflow:hidden!important;
        height:auto!important;
        min-height:72px!important;
        padding:7px 6px max(7px, env(safe-area-inset-bottom))!important;
        isolation:isolate!important;
    }

    .fixedside-bottom ul{
        box-sizing:border-box!important;
        width:100%!important;
        height:58px!important;
        min-height:58px!important;
        margin:0!important;
        padding:0!important;
        display:grid!important;
        grid-template-columns:repeat(5,minmax(0,1fr))!important;
        grid-template-rows:1fr!important;
        align-items:stretch!important;
        justify-items:stretch!important;
        gap:0!important;
        overflow:hidden!important;
    }

    .fixedside-bottom li{
        box-sizing:border-box!important;
        width:100%!important;
        min-width:0!important;
        max-width:none!important;
        height:58px!important;
        min-height:58px!important;
        margin:0!important;
        padding:0!important;
        display:flex!important;
        align-items:stretch!important;
        justify-content:center!important;
        overflow:hidden!important;
    }

    .fixedside-bottom li > a,
    .fixedside-bottom li > a:hover,
    .fixedside-bottom li > a:focus,
    .fixedside-bottom li > a:active,
    .fixedside-bottom li > a.fk-mobile-active{
        box-sizing:border-box!important;
        width:100%!important;
        min-width:0!important;
        max-width:100%!important;
        height:58px!important;
        min-height:58px!important;
        margin:0!important;
        padding:4px 2px!important;
        display:flex!important;
        flex-direction:column!important;
        flex-wrap:nowrap!important;
        align-items:center!important;
        justify-content:center!important;
        align-content:center!important;
        gap:3px!important;
        line-height:1!important;
        text-align:center!important;
        white-space:nowrap!important;
        overflow:hidden!important;
    }

    .fixedside-bottom li > a .fk-mobile-icon{
        box-sizing:border-box!important;
        width:22px!important;
        min-width:22px!important;
        max-width:22px!important;
        height:22px!important;
        min-height:22px!important;
        max-height:22px!important;
        flex:0 0 22px!important;
        display:flex!important;
        align-items:center!important;
        justify-content:center!important;
        margin:0!important;
        padding:0!important;
        line-height:0!important;
        transform:none!important;
    }

    .fixedside-bottom li > a .fk-mobile-icon svg{
        display:block!important;
        width:21px!important;
        height:21px!important;
        min-width:21px!important;
        min-height:21px!important;
        margin:0!important;
        padding:0!important;
        flex:0 0 21px!important;
        transform:none!important;
    }

    .fixedside-bottom li > a span:not(.fk-mobile-icon){
        box-sizing:border-box!important;
        display:block!important;
        width:100%!important;
        min-width:0!important;
        max-width:100%!important;
        height:18px!important;
        min-height:18px!important;
        max-height:18px!important;
        margin:0!important;
        padding:0!important;
        font-size:10px!important;
        line-height:18px!important;
        font-weight:500!important;
        white-space:nowrap!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
        word-break:keep-all!important;
        transform:none!important;
    }

    /* Prevent the search item/page from changing the nav geometry. */
    .fixedside-bottom li[data-fk-mobile-route="search"],
    .fixedside-bottom li[data-fk-mobile-route="search"] > a{
        min-width:0!important;
        max-width:100%!important;
        overflow:hidden!important;
    }

    /* Keep page content clear of the real fixed navigation height. */
    body{
        padding-bottom:calc(72px + env(safe-area-inset-bottom))!important;
        overflow-x:hidden!important;
    }
}

/* Extra protection for very narrow phones. */
@media (max-width:380px){
    .fixedside-bottom{
        min-height:68px!important;
        padding:5px 3px max(5px, env(safe-area-inset-bottom))!important;
    }
    .fixedside-bottom ul,
    .fixedside-bottom li,
    .fixedside-bottom li > a{
        height:58px!important;
        min-height:58px!important;
    }
    .fixedside-bottom li > a{
        padding-left:1px!important;
        padding-right:1px!important;
        gap:2px!important;
    }
    .fixedside-bottom li > a .fk-mobile-icon,
    .fixedside-bottom li > a .fk-mobile-icon svg{
        width:20px!important;
        min-width:20px!important;
        max-width:20px!important;
        height:20px!important;
        min-height:20px!important;
        max-height:20px!important;
    }
    .fixedside-bottom li > a span:not(.fk-mobile-icon){
        font-size:9px!important;
    }
}


/* ================================================================
   FARSKIDS — SEARCH PAGE RESPONSIVE CORE
   This is intentionally in the main stylesheet (not search.php)
   so the search layout is styled BEFORE the first mobile paint and
   also when the search page is injected through AJAX navigation.
   Scoped exclusively to .fk-search-page.
   ================================================================ */
.fk-search-page,
.fk-search-page *{
    box-sizing:border-box;
}

.fk-search-page{
    width:100%;
    min-width:0;
    max-width:100%;
    overflow-x:hidden;
}

.fk-search-page .fk-search-main,
.fk-search-page .fk-search-main > div,
.fk-search-page .fk-search-main > div > div,
.fk-search-page .tabcontent,
.fk-search-page .fk-music-subcontent{
    min-width:0;
    max-width:100%;
}

/* Search form: never let the input determine the page width. */
.fk-search-page .fk-live-search-form{
    display:flex !important;
    align-items:center !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
}

.fk-search-page .fk-live-search-form > label{
    flex:0 0 auto !important;
    margin-right:.65rem !important;
    margin-left:0 !important;
}

.fk-search-page .fk-search-input-wrap{
    position:relative !important;
    flex:1 1 0 !important;
    width:0 !important;
    min-width:0 !important;
    max-width:100% !important;
}

.fk-search-page .fk-live-search-form input{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    height:48px !important;
    margin:0 !important;
    padding:10px 12px 10px 44px !important;
    border:0 !important;
    outline:0 !important;
    font-size:clamp(14px,3.8vw,18px) !important;
    line-height:28px !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
}

.fk-search-page .fk-search-spinner{
    left:12px !important;
    right:auto !important;
}

/* Main search tabs: fixed 3-column geometry on every phone width. */
.fk-search-page .tabs{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:6px !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    overflow:hidden !important;
}

.fk-search-page .tabs span{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    margin:0 !important;
    padding:8px 5px !important;
    text-align:center !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    line-height:20px !important;
}

/* Music sub-tabs stay on one horizontal row and scroll inside themselves. */
.fk-search-page #fk-music-subtabs{
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:5px !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    margin:0 0 1rem !important;
    padding:0 0 .75rem !important;
    border-bottom:1px solid rgba(255,255,255,.10);
    overflow-x:auto !important;
    overflow-y:hidden !important;
    white-space:nowrap !important;
    scrollbar-width:none !important;
    -webkit-overflow-scrolling:touch !important;
    overscroll-behavior-x:contain !important;
    position:relative;
    z-index:2;
}

.fk-search-page #fk-music-subtabs::-webkit-scrollbar{
    display:none !important;
}

.fk-search-page #fk-music-subtabs .fk-music-subtab{
    flex:0 0 auto !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:auto !important;
    min-width:max-content !important;
    max-width:none !important;
    min-height:34px !important;
    margin:0 !important;
    padding:7px 10px !important;
    border:1px solid #991b1b !important;
    border-radius:9999px !important;
    background:transparent;
    color:#fff;
    font-size:11px !important;
    line-height:18px !important;
    white-space:nowrap !important;
}

.fk-search-page #fk-music-subtabs .fk-music-subtab.is-active{
    background:#991b1b !important;
    color:#fff !important;
}

/* Result rows: both text and stats are allowed to shrink. */
.fk-search-page .tabcontent > a,
.fk-search-page .fk-music-subcontent > a{
    display:flex !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    overflow:hidden !important;
}

.fk-search-page .tabcontent > a > div:first-child,
.fk-search-page .fk-music-subcontent > a > div:first-child{
    flex:1 1 auto !important;
    min-width:0 !important;
    max-width:100% !important;
    overflow:hidden !important;
}

.fk-search-page .tabcontent > a h3,
.fk-search-page .fk-music-subcontent > a h3{
    min-width:0 !important;
    max-width:100% !important;
    overflow:hidden !important;
}

.fk-search-page .tabcontent > a h3 > div,
.fk-search-page .fk-music-subcontent > a h3 > div{
    min-width:0 !important;
    max-width:100% !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
}

.fk-search-page .tabcontent > a > div:last-child,
.fk-search-page .fk-music-subcontent > a > div:last-child{
    flex:0 0 auto !important;
    max-width:42% !important;
    min-width:0 !important;
    white-space:nowrap !important;
}

.fk-search-page .tabcontent > a img,
.fk-search-page .fk-music-subcontent > a img{
    flex:0 0 auto !important;
    width:48px !important;
    height:48px !important;
    object-fit:cover !important;
}

.fk-search-page .fk-search-empty,
.fk-search-page .loadmore{
    min-width:0 !important;
    max-width:100% !important;
}

/* Tablet and phone page container. */
@media (max-width:1023px){
    .fk-search-page{
        display:block !important;
        width:100% !important;
        max-width:100% !important;
        margin:0 !important;
        padding:12px 0 0 !important;
    }

    .fk-search-page .fk-search-main{
        width:100% !important;
        max-width:100% !important;
        margin:0 !important;
        padding:0 14px !important;
    }
}

@media (max-width:640px){
    .fk-search-page{
        padding-top:8px !important;
    }

    .fk-search-page .fk-search-main{
        padding-right:10px !important;
        padding-left:10px !important;
    }

    .fk-search-page .fk-live-search-form{
        min-height:48px !important;
    }

    .fk-search-page .fk-live-search-form > label{
        margin-right:5px !important;
        padding:4px !important;
        font-size:21px !important;
    }

    .fk-search-page .fk-live-search-form input{
        height:46px !important;
        padding:8px 8px 8px 40px !important;
        font-size:14px !important;
    }

    .fk-search-page .tabs{
        gap:4px !important;
        margin-bottom:10px !important;
        padding-bottom:10px !important;
    }

    .fk-search-page .tabs span{
        padding:7px 3px !important;
        font-size:11px !important;
        line-height:18px !important;
    }

    .fk-search-page #fk-music-subtabs{
        gap:5px !important;
        margin-bottom:10px !important;
        padding-bottom:8px !important;
    }

    .fk-search-page #fk-music-subtabs .fk-music-subtab{
        min-height:34px !important;
        padding:7px 10px !important;
        font-size:11px !important;
    }

    .fk-search-page .tabcontent > a,
    .fk-search-page .fk-music-subcontent > a{
        gap:6px !important;
        padding:8px 5px !important;
    }

    .fk-search-page .tabcontent > a img,
    .fk-search-page .fk-music-subcontent > a img{
        width:44px !important;
        height:44px !important;
        margin-left:7px !important;
        border-radius:12px !important;
    }

    .fk-search-page .tabcontent > a > div:last-child,
    .fk-search-page .fk-music-subcontent > a > div:last-child{
        max-width:34% !important;
        margin-left:4px !important;
        gap:5px !important;
        font-size:10px !important;
    }

    .fk-search-page .loadmore{
        width:100% !important;
        max-width:100% !important;
        text-align:center !important;
        overflow:hidden !important;
    }
}

@media (max-width:380px){
    .fk-search-page .fk-search-main{
        padding-right:7px !important;
        padding-left:7px !important;
    }

    .fk-search-page .tabs span{
        padding-right:2px !important;
        padding-left:2px !important;
        font-size:10px !important;
    }

    .fk-search-page #fk-music-subtabs .fk-music-subtab{
        padding-right:8px !important;
        padding-left:8px !important;
        font-size:10px !important;
    }
}

/* First-paint protection: if AJAX/page scripts briefly hide the music tab,
   the page still gets a stable box model before JS starts working. */
.fk-search-page #music{
    min-width:0;
    max-width:100%;
}

.fk-search-page #fk-search-no-query,
.fk-search-page .fk-search-empty{
    overflow-wrap:anywhere;
}