c/**
 * VIO Podcast Player — Styles
 * https://vioweb.ir
 */

/* ============================
   کارت بیرونی
   ============================ */

.vio-podcast-player {
	background: #ede8ff;
	border: 1.5px solid #d8ccff;
	border-radius: 16px;
	padding: 18px 20px;
	font-family: inherit;
	direction: rtl;
	box-sizing: border-box;
	font-family: 'IRANYekanFN';
}

/* ============================
   ردیف هدر (عنوان + آیکون میک)
   ============================ */

.vio-podcast-header {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	margin-bottom: 14px;
}

.vio-podcast-header-icon {
	color: #7b52d3;
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
}

.vio-podcast-header-icon svg {
	width: 22px;
	height: 22px;
}

.vio-podcast-header-text {
	font-size: 15px;
	font-weight: 700;
	color: #1a1a2e;
	text-align: right;
		font-family: 'IRANYekanFN';

}

.vio-podcast-player {
    	background: #ede8ff;
	border: 1.5px solid #d8ccff;
	border-radius: 16px;
	padding: 18px 20px;
	font-family: inherit;
	direction: rtl;
	box-sizing: border-box;
	font-family: 'IRANYekanFN';
    border: 1px solid rgba(113, 73, 186, 0.32);
    border-radius: 24px; 
    padding: 15px;
    background-color: rgba(113, 73, 186, 0.1);
}

/* ============================
   ردیف پلیر (نوار سفید)
   ============================ */

.vio-podcast-bar {
	display: flex;
	align-items: center;
	background: #ffffff;
	border-radius: 40px;
	padding: 10px 14px;
	gap: 10px;
	box-shadow: 0 2px 10px rgba(0,0,0,0.06);
}

/* ============================
   دکمه پلی/پاز
   ============================ */

.vio-podcast-play-pause {
	flex-shrink: 0;
	background: none !important;
	border: none !important;
	padding: 0 !important;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.15s ease, opacity 0.15s ease;
	line-height: 1;
}

.vio-podcast-play-pause:hover { opacity: 0.75; transform: scale(1.1); }
.vio-podcast-play-pause:active { transform: scale(0.93); }

.vio-podcast-play-pause svg {
	width: 22px;
	height: 22px;
	color: #7b52d3;
}

/* ============================
   نمایش زمان
   ============================ */

.vio-podcast-time-display {
	flex-shrink: 0;
	font-size: 13px;
	font-weight: 600;
	color: #444444;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
	min-width: 80px;
}

/* ============================
   نوار پیشرفت
   ============================ */

.vio-podcast-progress-bar {
	flex: 1;
	cursor: pointer;
	padding: 8px 0;
	min-width: 0;
}

.vio-podcast-progress-track {
	position: relative;
	height: 5px;
	background: #cccccc;
	border-radius: 5px;
}

.vio-podcast-progress-fill {
	position: absolute;
	right: 0;
	top: 0;
	height: 100%;
	width: 0%;
	background: #f5a623;
	border-radius: 5px;
	transition: width 0.1s linear;
}

.vio-podcast-progress-thumb {
	position: absolute;
	top: 50%;
	right: 0%;
	transform: translate(50%, -50%);
	width: 16px;
	height: 16px;
	background: #f5a623;
	border-radius: 50%;
	box-shadow: 0 2px 6px rgba(245,166,35,0.5);
	transition: right 0.1s linear;
}

/* ============================
   آیکون صدا
   ============================ */

.vio-podcast-mute {
	flex-shrink: 0;
	background: none !important;
	border: none !important;
	padding: 0 4px !important;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	transition: opacity 0.2s ease;
}

.vio-podcast-mute:hover { opacity: 0.7; }

.vio-podcast-mute svg {
	width: 20px;
	height: 20px;
	color: #555555;
}

/* ============================
   خط جداکننده
   ============================ */

.vio-podcast-divider {
	width: 1px;
	height: 28px;
	background: #dddddd;
	flex-shrink: 0;
}

/* ============================
   دکمه دانلود
   ============================ */

.vio-podcast-download {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, #f5c842, #f08518);
	color: #ffffff !important;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none !important;
	border-radius: 30px;
	padding: 8px 20px;
	white-space: nowrap;
	transition: opacity 0.2s ease, transform 0.15s ease;
	box-shadow: 0 3px 12px rgba(240,133,24,0.35);
}

.vio-podcast-download:hover {
	opacity: 0.9;
	transform: scale(1.03);
}

/* ============================
   خطای ادمین
   ============================ */

.vio-podcast-error {
	padding: 12px 16px;
	background: #fff3cd;
	border: 1px solid #ffc107;
	border-radius: 8px;
	font-size: 14px;
	color: #856404;
}

/* ============================
   ریسپانسیو موبایل
   ============================ */

@media (max-width: 520px) {
	.vio-podcast-bar { padding: 8px 10px; gap: 6px; }
	.vio-podcast-time-display { font-size: 11px; min-width: 65px; }
	.vio-podcast-download { padding: 7px 13px; font-size: 13px; }
}