/* =========================================================
   Latest Episodes Desktop Container
========================================================= */

#javo-home-latest-episodes {

	direction:rtl;

	width:95%;

	margin:18px auto;

	padding:24px;

	box-sizing:border-box;


	border-radius:25px;

}


/* =========================================================
   Root Component
========================================================= */

#javo-home-following-latest.javo-home-following-latest {

	display:grid;

	gap:24px;

	width:100%;

	min-width:0;

}


/* =========================================================
   Header
========================================================= */

#javo-home-following-latest
.javo-home-following-intro {

	display:flex;

	align-items:center;

	min-width:0;

	padding-inline:4px 24px;

	border-inline-start:1px solid rgba(30,58,138,.09);

}



#javo-home-following-latest
.javo-home-following-title {

	margin:0;

	color:#344054;

	font-size:20px;

	font-weight:750;

	line-height:1.65;

	text-align:right;

}



/* description */

#javo-home-following-latest
.javo-home-following-description {

	margin:4px 0 0;

	color:#ffffff;

	font-size: 18px;font-weight: 800;line-height: 1.5;

}



/* =========================================================
   Main Layout
========================================================= */

#javo-home-following-latest
.javo-home-following-layout {

	display:grid;

	grid-template-columns:

	minmax(140px,.15fr)

	minmax(0,.85fr);


	align-items:center;

	gap:24px;

	min-width:0;

}



/* =========================================================
   Horizontal Rail
========================================================= */


#javo-home-following-latest
.javo-home-following-feed {

	min-width:0;

	overflow:hidden;

}



#javo-home-following-latest
.javo-home-following-scroll {


	display:flex;


	width:100%;


	min-width:0;


	padding:4px 2px 10px;


	overflow-x:auto;

	overflow-y:hidden;


	direction:rtl;


	gap:18px;


	scroll-behavior:smooth;


	scroll-snap-type:x proximity;

}



/* =========================================================
   Horizontal Scrollbar
========================================================= */

#javo-home-following-latest
.javo-home-following-scroll {

	scrollbar-width:thin;

	scrollbar-color:
		rgba(30,58,138,.32)
		rgba(30,58,138,.07);

	scrollbar-gutter:stable;

}


/* Scrollbar */

#javo-home-following-latest
.javo-home-following-scroll::-webkit-scrollbar {

	height:4px;

}


/* Track */

#javo-home-following-latest
.javo-home-following-scroll::-webkit-scrollbar-track {

	background:rgba(30,58,138,.07);

	border-radius:999px;

}


/* Moving Thumb */

#javo-home-following-latest
.javo-home-following-scroll::-webkit-scrollbar-thumb {

	background:rgba(30,58,138,.32);

	border-radius:999px;

}


/* Hover */

#javo-home-following-latest
.javo-home-following-scroll::-webkit-scrollbar-thumb:hover {

	background:rgba(30,58,138,.48);

}



/* =========================================================
   Cards Rail
========================================================= */


#javo-home-following-latest
.javo-home-following-list {


	display:flex;


	flex-flow:row nowrap;


	align-items:center;


	gap:18px;


	width:max-content;


	min-width:max-content;


	direction:rtl;

}



/* =========================================================
   Premium Episode Card
   Same as Trending Card
========================================================= */


#javo-home-following-latest
.javo-home-following-card.javo-episode-card {


	position:relative;


	display:block;


	flex:0 0 214px;


	width:214px;


	height:214px;


	min-width:214px;


	min-height:214px;


	max-width:214px;


	max-height:214px;


	aspect-ratio:1 / 1;


	margin:0;


	padding:0;


	overflow:visible;


	box-sizing:border-box;


	background:transparent;


	border:0;


	border-radius:35px;


	box-shadow:none;


	scroll-snap-align:start;


	transition:transform 180ms ease;

}



#javo-home-following-latest
.javo-home-following-card.javo-episode-card:hover {

	transform:translateY(-2px);

}



/* =========================================================
   Card Inner
========================================================= */


#javo-home-following-latest
.javo-home-following-card-inner {


	position:relative;


	display:flex;


	flex-direction:column;


	align-items:stretch;


	width:100%;


	height:100%;


}



/* =========================================================
   Artwork
========================================================= */


#javo-home-following-latest
.javo-home-following-cover,
#javo-home-following-latest
.javo-home-following-cover img {


	display:block;


	width:144px;


	height:144px;


	border-radius:16px;

}



#javo-home-following-latest
.javo-home-following-cover {


	flex:0 0 144px;


	margin:0 auto;


	overflow:hidden;


	background:none;

}


#javo-home-following-latest
.javo-home-following-cover img {


	object-fit:cover;


	max-width:none;

}



/* =========================================================
   Content
========================================================= */


#javo-home-following-latest
.javo-home-following-content {


	display:flex;


	flex-direction:column;


	align-items:stretch;


	min-width:0;


	margin-top:10px;


	padding-inline:8px;


	overflow:hidden;

}



#javo-home-following-latest
.javo-home-following-channel-name {


	width:100%;


	overflow:hidden;


	white-space:nowrap;


	text-overflow:ellipsis;


	color:#B3E7FF;


	font-size:12px;


	font-weight:500;


	line-height:1.4;


	text-align:center;
	display: none;

}




#javo-home-following-latest
.javo-home-following-episode-title {


	display:-webkit-box;


	margin:3px 0 0;


	width:100%;


	color:#ffffff;


	font-family:"Vazirmatn",sans-serif;


	font-size:13.5px;


	font-weight:700;


	line-height:1.4;


	text-align:center;


	overflow:hidden;


	-webkit-box-orient:vertical;


	-webkit-line-clamp:2;

}



/* =========================================================
   Controls
========================================================= */


#javo-home-following-latest
.javo-home-following-control-panel {


	display:contents;

}



#javo-home-following-latest
.javo-home-following-duration {
	position:absolute;
	top:8px;
	left:calc((100% - 144px)/2 + 8px);
	padding:5px 10px;
	background: rgba(248, 248, 248, 0.741); 
    border: 1px solid rgba(255, 255, 255, 0.8);
	font-size:10px;
	border-radius:999px;
}

/* =========================================================
   Play Button
========================================================= */

#javo-home-following-latest
.javo-home-following-play {

	position:absolute;

	top:112px;

	right:calc((100% - 144px) / 2 - 8px);

	z-index:10;


	display:flex;

	align-items:center;

	justify-content:center;


	width:40px;

	height:40px;

	min-width:40px;

	min-height:40px;


	padding:0;

	margin:0;


	color:#B3E7FF;


	background:#1e3a8a;


	border:0;

	border-radius:50%;


	box-shadow:
		0 6px 16px rgba(30,58,138,.35);


	cursor:pointer;


	pointer-events:auto;


	overflow:hidden;


	transition:
		background-color .18s ease,
		transform .18s ease;

}



#javo-home-following-latest
.javo-home-following-play:hover {

	background:#2449a5;

	transform:scale(1.04);

}



/* =========================================================
   Play Icon Center
========================================================= */

#javo-home-following-latest
.javo-home-following-play-icon {


	position:absolute;

	inset:0;


	display:flex;

	align-items:center;

	justify-content:center;


	width:100%;

	height:100%;

}



#javo-home-following-latest
.javo-home-following-play-icon svg {


	display:block;


	width:12px;

	height:12px;


	fill:currentColor;


	transform:translateX(1px);

}



/* =========================================================
   Playing State
========================================================= */

#javo-home-following-latest
.javo-home-following-card.is-playing
.javo-home-following-play {


	color:#ffffff;

	background:#1e3a8a;

}



/* Hide Play */

#javo-home-following-latest
.javo-home-following-card.is-playing
.javo-home-following-play-icon,

#javo-home-following-latest
.javo-home-following-play.is-paused:not(.is-completed)
.javo-home-following-play-icon {


	display:none;

}



/* =========================================================
   Wave Icon
========================================================= */

#javo-home-following-latest
.javo-home-following-wave {


	display:none;


	position:absolute;

	inset:0;


	align-items:center;

	justify-content:center;


	width:100%;

	height:100%;


	color:#ffffff;

}



#javo-home-following-latest
.javo-home-following-card.is-playing
.javo-home-following-wave,

#javo-home-following-latest
.javo-home-following-play.is-paused:not(.is-completed)
.javo-home-following-wave {


	display:flex;

}



/* Wave SVG */

#javo-home-following-latest
.javo-home-following-wave svg {


	display:block;


	width:14px;

	height:12px;


	fill:currentColor;

}



/* =========================================================
   Wave Animation
========================================================= */

#javo-home-following-latest
.javo-home-following-wave-bar {


	transform-box:fill-box;

	transform-origin:center;


}



#javo-home-following-latest
.javo-home-following-card.is-playing
.javo-home-following-wave-bar,

#javo-home-following-latest
.javo-home-following-play.is-paused:not(.is-completed)
.javo-home-following-wave-bar {

	animation-name:javo-following-wave;
	animation-duration:700ms;
	animation-timing-function:ease-in-out;
	animation-iteration-count:infinite;
	animation-direction:alternate;
	animation-play-state:paused;

}



#javo-home-following-latest
.javo-home-following-play.is-playing
.javo-home-following-wave-bar {

	animation-play-state:running;

}



#javo-home-following-latest
.javo-home-following-play.is-paused
.javo-home-following-wave-bar {

	animation-play-state:paused;

}



#javo-home-following-latest
.javo-home-following-wave-bar-1 {

	animation-delay:0ms;

}


#javo-home-following-latest
.javo-home-following-wave-bar-2 {

	animation-delay:-140ms;

}


#javo-home-following-latest
.javo-home-following-wave-bar-3 {

	animation-delay:-280ms;

}


#javo-home-following-latest
.javo-home-following-wave-bar-4 {

	animation-delay:-420ms;

}


#javo-home-following-latest
.javo-home-following-wave-bar-5 {

	animation-delay:-560ms;

}



@keyframes javo-following-wave {


	from {

		transform:scaleY(.35);

		opacity:.55;

	}


	to {

		transform:scaleY(1);

		opacity:1;

	}

}



@media (prefers-reduced-motion: reduce) {

	#javo-home-following-latest
	.javo-home-following-wave-bar {

		animation:none !important;

	}

}



/* =========================================================
   Completed Check State
========================================================= */


/* Default Hidden */

#javo-home-latest-episodes
.javo-state-wrapper-completed {


	display:none;


	align-items:center;

	justify-content:center;


	width:100%;

	height:100%;

}



/* Completed Only */

#javo-home-latest-episodes
.javo-home-following-play.is-completed
.javo-state-wrapper-completed {
	display:flex;
}



/* Hide Other States */

#javo-home-latest-episodes
.javo-home-following-play.is-completed
.javo-state-wrapper-unplayed,

#javo-home-latest-episodes
.javo-home-following-play.is-completed
.javo-state-wrapper-listening {
	display:none;
}

/* Check SVG */
#javo-home-latest-episodes
.javo-state-wrapper-completed svg {
	display:block;
	width:14px;
	height:14px;
	fill:none;
	stroke:currentColor;
	stroke-width:3;
	stroke-linecap:round;
	stroke-linejoin:round;

}
/* =========================================================
   JaVo Following Latest - Mobile Premium Layout
========================================================= */


/* ===============================
   Mobile Base
================================ */

@media (max-width:768px){


/* Main Section */

#javo-home-latest-episodes {
	width:100%;
    margin:16px 0;
    padding:0 10px;
    box-sizing:border-box;
    background:transparent;
    border:0;
    border-radius:0;

}



/* Root */

#javo-home-following-latest.javo-home-following-latest {

	gap:14px;

}



/* =========================================================
   Section Header
========================================================= */


#javo-home-following-latest
.javo-home-following-intro {
	 display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
    width:100%;
    margin-bottom:8px;
    padding:0 8px;
    box-sizing:border-box;
    border:0;

}



/* Section Title */

#javo-home-following-latest
.javo-home-following-title {


	margin:0;


	font-size:18px;


	font-weight:800;


	color:#ffffff;


	line-height:1.5;


}



/* View All */

#javo-home-following-latest
.javo-home-following-description {
	position:relative;
	margin:0;
	padding-left:18px;
	color:#ffffff;
	font-size: 18px;font-weight: 800;line-height: 1.5;
	white-space:nowrap;
}

/* =========================================================
   Layout
========================================================= */
#javo-home-following-latest
.javo-home-following-layout {
	display:block;
	width:100%;
}
/* =========================================================
   Horizontal Cards
========================================================= */


#javo-home-following-latest
.javo-home-following-scroll {
	width:100%;
	overflow-x:auto;
	padding:8px 0 8px;
	gap:14px;
	scroll-padding-inline:12px;
    border-radius: 15px;
}



#javo-home-following-latest
.javo-home-following-list {


	gap:14px;


}



/* =========================================================
   Card
========================================================= */


#javo-home-following-latest
.javo-home-following-card.javo-episode-card {


	flex:0 0 165px;


	width:165px;


	height:190px;


	min-width:165px;


	max-width:165px;


	border-radius:22px;


	transition:none;


}



/* Inner */

#javo-home-following-latest
.javo-home-following-card-inner {


	width:100%;


	height:100%;


}



/* =========================================================
   Cover
========================================================= */


#javo-home-following-latest
.javo-home-following-cover,


#javo-home-following-latest
.javo-home-following-cover img {


	width:120px;


	height:120px;


	border-radius:16px;


}



#javo-home-following-latest
.javo-home-following-cover {


	margin:0 auto;


}



/* =========================================================
   Content
========================================================= */


#javo-home-following-latest
.javo-home-following-content {


	margin-top:8px;


	padding:0 4px;


}



#javo-home-following-latest
.javo-home-following-channel-name {


	font-size:10.5px;


	line-height:1.5;


}



#javo-home-following-latest
.javo-home-following-episode-title {


	margin-top:3px;


	font-size:12px;


	line-height:1.55;


	-webkit-line-clamp:2;


}



/* =========================================================
   Duration Badge
========================================================= */


#javo-home-following-latest
.javo-home-following-duration {


	top:7px;


	left:calc((100% - 120px) / 2 + 6px);


	padding:4px 8px;


	font-size:9px;


	backdrop-filter:none;


	-webkit-backdrop-filter:none;


}



/* =========================================================
   Play Button - Desktop Style Position
========================================================= */


#javo-home-following-latest
.javo-home-following-play {


	top:94px;


	right:calc((100% - 120px) / 2 - 8px);


	width:38px;


	height:38px;


	min-width:38px;


	min-height:38px;


}



#javo-home-following-latest
.javo-home-following-play-icon svg {


	width:11px;


	height:11px;


}



/* Remove hover */

#javo-home-following-latest
.javo-home-following-card.javo-episode-card:hover {


	transform:none;


}



}



/* =========================================================
   Small Mobile
========================================================= */


@media(max-width:360px){


#javo-home-following-latest
.javo-home-following-card.javo-episode-card {


	flex-basis:150px;


	width:150px;


	min-width:150px;


	height:175px;


}



#javo-home-following-latest
.javo-home-following-cover,


#javo-home-following-latest
.javo-home-following-cover img {


	width:108px;


	height:108px;


}



#javo-home-following-latest
.javo-home-following-play {


	top:82px;


	right:calc((100% - 108px) / 2 - 8px);


}



#javo-home-following-latest
.javo-home-following-title {


	font-size:16px;


}


}
