/* استایل پایه */

/* ===================================================== */
/* اسکرول بار مدرن
/* ===================================================== */
::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

::-webkit-scrollbar-track {
	background: var(--bg-secondary);
	border-radius: 10px;
}

::-webkit-scrollbar-thumb {
	background: var(--primary);
	border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
	background: var(--primary-hover);
}

* {
	scrollbar-width: thin;
	scrollbar-color: var(--primary) var(--bg-secondary);
}

/* جلوگیری از اسکرول افقی در موبایل */
html {
	overflow-x: hidden;
	overflow-x: clip;
}

/* ===================================================== */
/* تایپوگرافی و فونت‌ها (بهینه برای سئو)
/* ===================================================== */
body {
	font-family: var(--font-iranyekan);
	direction: ltr;
	text-align: left;
	background: var(--bg-primary);
	color: var(--text-primary);
	min-height: 100vh;
	overflow-x: hidden;
}

/* افکت گرید پس‌زمینه (مثل کد نمونه) */
body::before {
	content: "";
	position: fixed;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background-image: radial-gradient(at 0% 0%, rgba(var(--primary-rgb), 0.1) 0, transparent 50%),
        radial-gradient(at 100% 100%, rgba(var(--accent-rgb), 0.1) 0, transparent 50%);
	background-attachment: fixed;
	pointer-events: none;
	z-index: 0;
}

/* اطمینان از قرارگیری محتوا روی پس‌زمینه */
.main-content-wrapper, .container, header, .card, .sidebar-container {
	position: relative;
	z-index: 1;
}

/* کارت‌های شیشه‌ای و مدرن (مثل کد نمونه) */
.card, .modern-comments, .comment-respond, .notifications-dropdown, .user-menu-dropdown {
	background: var(--glass);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border: 1px solid var(--glass-border);
	border-radius: 24px;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card:hover, .modern-comments:hover {
	transform: translateY(-3px);
	box-shadow: var(--shadow-lg);
	border-color: rgba(var(--primary-rgb), 0.3);
}

/* استاندارد کردن رنگ متن برای المنت‌های اصلی */

h1,h2,h3,h4,h5,h6,a,p,.seo-text,.singles-list span,.comment-author,.comment-metadata,.number_captcha span,.raditone-title h3,.raditone-title p,.section__header,.box-content,.txt,input,select,textarea {
	color: var(--text-primary);
}

input, select, textarea {
	background: var(--bg-primary);
	border: 1px solid var(--border-primary);
	border-radius: 16px;
	padding: 10px 16px;
	font-family: inherit;
}

input:focus, select:focus, textarea:focus {
	outline: none;
	border-color: var(--primary);
	box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.2);
}


/* ===================================================== */
/* اسپینر لودینگ
/* ===================================================== */
#page-loading {
	background: var(--bg-primary);
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
}

#page-loading .spinner {
	width: 50px;
	height: 50px;
	border: 3px solid var(--bg-secondary);
	border-top: 3px solid var(--primary);
	border-radius: 50%;
	animation: spin 1s linear infinite;
}

@keyframes spin {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(-360deg);
	}
}

/* ===================================================== */
/* لیاوت اصلی
/* ===================================================== */
.main-content-wrapper {
	min-height: calc(100vh - var(--header-height));
	margin-left: var(--sidebar-width);
	padding: 35px 30px 0 30px;
	margin-top: 30px;
}

@media (max-width: 1024px) {
	.main-content-wrapper {
		margin-left: 0;
		padding: 20px;
	}
}

.header-spacer {
	height: 10px;
	margin-right: var(--sidebar-width);
}

/* ===================================================== */
/* هدر یکپارچه (با الهام از SiNAVM)
/* ===================================================== */
.main-header {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	height: var(--header-height);
	background: var(--glass);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border-bottom: 1px solid var(--glass-border);
	z-index: 1000;
	box-shadow: var(--shadow);
}

.header-container {
	max-width: 100%;
	margin: 0 auto;
	height: 100%;
	padding: 0 1.5rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	padding-left: var(--sidebar-width);
}
/* زیرنویس منوی کشویی موبایل */
.rt-mobile-menu-sub {
	display: block;
	font-size: 12px;
	color: #888;
	margin-top: 2px;
	padding-left: 10px;
	line-height: 1.3;
	order: 3;
}

.rt-sidebar-nav .menu-with-subtitle
Specificity: (0,2,0)
 {
    display: flex;
    flex-direction: row;
    align-content: center;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

/* زیرنویس منوی پایین موبایل */
.rt-bottom-sub {
	display: block;
	font-size: 9px;
	color: #aaa;
	line-height: 1.2;
	margin-top: 1px;
	text-align: center;
}

/* تنظیمات Font Awesome Pro 6 */
.fa,
.fa-thin,
.fa-thin,
.fa-thin,
.fa-thin,
.fa-thin,
.fa-brands {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	display: var(--fa-display, inline-block);
	font-style: normal;
	font-variant: normal;
	line-height: 1;
	text-rendering: auto;
}

/* اندازه ثابت برای آیکون‌ها */
.header-icon i,
.user-menu-item i,
.sidebar-social-links i {
	font-size: 1.25rem;
	width: 1.25rem;
	height: 1.25rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* آیکون‌های منوی کاربر */
.user-menu-item i {
	margin-right: 0.75rem;
	font-size: 1.1rem;
}

/* لینک ورود */
.header-icon-login i {
	margin-right: 0.5rem;
	font-size: 1.1rem;
}

/* شبکه‌های اجتماعی در سایدبار */
.sidebar-social-links i {
	font-size: 1.1rem;
	transition: all 0.2s ease;
}

.sidebar-social-links a:hover i {
	transform: translateY(-2px);
}

/* تنظیمات حالت روشن برای آیکون‌ها */
.light .header-icon i,
.light .user-menu-item i {
	color: #475569;
}

/* آیکون‌های نوتیفیکیشن */
.notification-item .fa-thin {
	font-size: 1.375rem;
	margin-right: 0.75rem;
	color: var(--primary);
}

@media (max-width: 1024px) {
	.header-container {
		padding-left: 1.5rem;
	}
}

.header-left {
	gap: 2rem;
	flex: 0 0 auto;
}

.header-left,.logo-wrapper {
	display: flex;
	align-items: center;
}

.logo-wrapper {
	gap: 1rem;
	text-decoration: none;
}

.logo-image {
	height: 40px;
	width: auto;
	object-fit: contain;
}

.logo-text {
	font-size: 1.5rem;
	font-weight: 800;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.desktop-menu {
	margin-left: 30px;
}

.menu-list {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 25px;
}

.menu-list li {
	position: relative;
}

.menu-list a {
	display: flex;
	align-items: center;
	color: var(--text-secondary);
	text-decoration: none;
	font-size: 0.95rem;
	padding: 8px 0;
	transition: var(--transition);
	line-height: 2rem;
	gap: 6px;
}

.menu-list a:hover {
	color: var(--primary);
}

.menu-list .current-menu-item > a {
	color: var(--primary);
	font-weight: 500;
}

.menu-list .current-menu-item > a::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 2px;
	background: linear-gradient(-90deg, var(--primary), transparent);
}

.header-center {
	flex: 1;
	min-width: 0;
	max-width: 600px;
	margin: 0 1rem;
}

.header-right {
	gap: 0.75rem;
	flex: 0 0 auto;
}

.header-right,.header-icon {
	display: flex;
	align-items: center;
}

.header-icon {
	position: relative;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 16px;
	background: var(--glass);
	border: 1px solid var(--glass-border);
	color: var(--text-secondary);
	cursor: pointer;
	transition: all var(--transition);
	text-decoration: none;
}

.header-icon:hover {
	background: var(--primary-light);
	border-color: var(--primary);
	color: var(--primary);
	transform: translateY(-2px);
}

.icon-badge {
	position: absolute;
	top: -4px;
	left: -4px;
	min-width: 20px;
	height: 20px;
	background: var(--danger);
	font-size: 0.7rem;
	font-weight: 700;
	border-radius: 10px;
	justify-content: center;
	padding: 0 4px;
	border: 2px solid var(--bg-primary);
}

.icon-badge,.login-btn {
	color: white;
	display: flex;
	align-items: center;
}

.login-btn {
	gap: 0.5rem;
	padding: 0.75rem 1.5rem;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	text-decoration: none;
	font-weight: 500;
	border-radius: 16px;
	transition: all var(--transition);
	box-shadow: var(--shadow);
}

.login-btn:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-md);
	filter: brightness(1.05);
}

.mobile-menu-btn {
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 16px;
	background: var(--glass);
	border: 1px solid var(--glass-border);
	color: var(--text-secondary);
	cursor: pointer;
}

@media (max-width: 1024px) {
	.desktop-menu {
		display: none;
	}

	.mobile-menu-btn {
		display: flex;
	}
}

/* ===================================================== */
/* سایدبار دسکتاپ (بهبود یافته)
/* ===================================================== */
.desktop-sidebar {
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	width: var(--sidebar-width);
	background: var(--glass);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border-right: 1px solid var(--glass-border);
	z-index: 1001;
	transition: transform var(--transition-slow);
	overflow-y: auto;
}

.sidebar-container {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 0 0.5rem;
}

.sidebar-header {
	padding: 20px;
	text-align: center;
	border-bottom: 1px solid var(--glass-border);
	margin-bottom: 20px;
}

.sidebar-logo-wrapper {
	display: block;
	text-decoration: none;
	margin-bottom: 20px;
}

.sidebar-logo-image {
	max-height: 50px;
	width: auto;
	margin: 0 auto;
	display: block;
}

.sidebar-logo-text {
	font-size: 1.5rem;
	font-weight: bold;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.sidebar-navigation {
	flex: 1;
	padding: 0 3px;
	margin-bottom: 1.5rem;
}

.sidebar-menu-title {
	display: flex;
	align-items: center;
	text-align: center;
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 20px;
	color: var(--text-primary);
}

.sidebar-menu-title::before,
.sidebar-menu-title::after {
	content: "";
	flex: 1;
	height: 2px;
	background: linear-gradient(to left, var(--primary), transparent);
	margin: 0 15px 0 0;
}

.sidebar-menu-title::after {
	background: linear-gradient(to right, var(--primary), transparent);
	margin: 0 0 0 15px;
}

.sidebar-menu {
	list-style: none;
	padding: 0;
	margin: 0;
}

.sidebar-menu li {
	margin-bottom: 8px;
}

.sidebar-menu a {
	display: flex;
	align-items: center;
	padding: 12px 15px;
	color: var(--text-secondary);
	text-decoration: none;
	border-radius: 16px;
	transition: var(--transition);
	gap: 0.75rem;
}

.sidebar-menu a:hover {
	background: var(--primary-light);
	color: var(--secondary);
	transform: translateX(4px);
}

.sidebar-menu a:active {
	background: var(--primary-light);
	color: var(--secondary);
	transform: translateX(4px);
}

.sidebar-menu .current-menu-item > a {
	background: linear-gradient(-135deg, var(--primary-light), transparent);
	color: var(--primary);
	border-left: 2px solid var(--primary);
}

.sidebar-footer {
	margin-top: auto;
	padding: 1.5rem 0;
	border-top: 1px solid var(--glass-border);
	text-align: center;
	font-size: 0.85rem;
	color: var(--text-tertiary);
}

.sidebar-social-links {
	display: flex;
	justify-content: center;
	gap: 1rem;
	margin-bottom: 1rem;
}

.sidebar-social-links a {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: var(--glass);
	border: 1px solid var(--glass-border);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--text-secondary);
	transition: all 0.3s ease;
}

.sidebar-social-links a:hover {
	background: var(--primary);
	color: white;
	transform: translateY(-4px);
	box-shadow: 0 8px 20px rgba(var(--primary-rgb), 0.4);
}

.sidebar-player {
	padding-top: 1.5rem;
	border-top: 1px solid var(--glass-border);
}

/* Responsive Sidebar */
@media (max-width: 1024px) {
	.desktop-sidebar {
		transform: translateX(-100%);
		z-index: 1050;
	}

	.desktop-sidebar.open {
		transform: translateX(0);
	}

	.sidebar-overlay {
		position: fixed;
		inset: 0;
		background: rgba(0,0,0,0.7);
		backdrop-filter: blur(4px);
		z-index: 1040;
		display: none;
	}

	.sidebar-overlay.open {
		display: block;
	}
}

/* ===================================================== */
/* سیستم نوتیفیکیشن (مثل کد نمونه)
/* ===================================================== */
.notifications-wrapper {
	position: relative;
	display: inline-block;
}

#notifications-toggle {
	background: transparent;
	border: none;
	cursor: pointer;
	color: var(--text-secondary);
	transition: all 0.3s ease;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
}

#notifications-toggle:hover {
	background: var(--primary-light);
	color: var(--primary);
	transform: translateY(-1px);
}

.notifications-dropdown {
	position: absolute;
	top: calc(100% + 10px);
	right: 0;
	width: 380px;
	background: var(--bg-primary);
	backdrop-filter: blur(16px);
	border-radius: 24px;
	box-shadow: var(--shadow-xl);
	border: 1px solid var(--glass-border);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-10px);
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	z-index: 1001;
}

.notifications-wrapper:hover .notifications-dropdown,
.notifications-dropdown.active {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.notifications-header {
	padding: 18px 20px;
	border-bottom: 1px solid var(--glass-border);
	border-radius: 24px 24px 0 0;
}

.notifications-title {
	font-size: 1rem;
	font-weight: 600;
	color: var(--text-primary);
	display: flex;
	align-items: center;
	gap: 8px;
}

.notifications-count {
	display: inline-block;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	color: white;
	padding: 4px 10px;
	border-radius: 20px;
	font-size: 0.8rem;
	font-weight: 500;
	margin-top: 5px;
}

.notifications-list {
	max-height: 400px;
	overflow-y: auto;
}

.notification-item {
	display: flex;
	align-items: flex-start;
	padding: 16px 20px;
	border-bottom: 1px solid var(--glass-border);
	cursor: pointer;
	transition: all 0.2s ease;
}

.notification-item:hover {
	background: var(--primary-light);
	transform: translateX(-4px);
}

.notification-item.unread {
	background: rgba(var(--primary-rgb), 0.05);
	border-left: 3px solid var(--primary);
}

.notification-title {
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--text-primary);
	margin-bottom: 6px;
}

.notification-preview {
	font-size: 0.8rem;
	color: var(--text-tertiary);
	line-height: 1.5;
	margin-bottom: 8px;
}

.notification-time {
	font-size: 0.75rem;
	color: var(--text-tertiary);
	background: var(--glass);
	padding: 3px 8px;
	border-radius: 12px;
	display: inline-block;
}

.empty-notifications {
	text-align: center;
	padding: 2rem;
	color: var(--text-tertiary);
}

.notifications-footer {
	padding: 1rem;
	border-top: 1px solid var(--glass-border);
	text-align: center;
}

.view-all-link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: var(--primary);
	text-decoration: none;
	font-size: 0.9rem;
	font-weight: 500;
	padding: 8px 16px;
	border-radius: 12px;
	transition: all 0.2s ease;
}

.view-all-link:hover {
	background: var(--primary-light);
	color: var(--primary-hover);
}

/* مودال نوتیفیکیشن */
.notification-modal {
	position: fixed;
	inset: 0;
	z-index: 10000;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 1rem;
}

.notification-modal.active {
	display: flex;
}

.modal-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.7);
	backdrop-filter: blur(5px);
}

.modal-container {
	position: relative;
	width: 100%;
	max-width: 500px;
	background: var(--glass);
	backdrop-filter: blur(16px);
	border-radius: 28px;
	box-shadow: var(--shadow-2xl);
	border: 1px solid var(--glass-border);
	animation: slideInUp 0.3s ease-out;
	overflow: hidden;
	z-index: 1;
}

.modal-header {
	padding: 1.5rem;
	border-bottom: 1px solid var(--glass-border);
	position: relative;
}

.modal-title {
	font-size: 1.25rem;
	font-weight: 600;
	color: var(--text-primary);
}

.modal-close {
	position: absolute;
	right: 1.5rem;
	top: 1.5rem;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--glass);
	border: 1px solid var(--glass-border);
	color: var(--text-secondary);
	cursor: pointer;
	transition: all var(--transition);
	display: flex;
	align-items: center;
	justify-content: center;
}

.modal-close:hover {
	background: var(--danger);
	color: white;
	border-color: transparent;
}

.modal-content {
	padding: 1.5rem;
	max-height: 60vh;
	overflow-y: auto;
	line-height: 1.6;
	color: var(--text-secondary);
}

.modal-footer {
	padding: 1.5rem;
	border-top: 1px solid var(--glass-border);
	text-align: center;
}

.modal-close-btn {
	padding: 0.75rem 2rem;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	color: white;
	border: none;
	border-radius: 16px;
	font-weight: 500;
	cursor: pointer;
	transition: all var(--transition);
}

.modal-close-btn:hover {
	transform: scale(0.98);
}

/* ===================================================== */
/* منوی کاربری
/* ===================================================== */
.user-menu {
	position: relative;
}

.user-avatar-btn {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.5rem 1rem;
	background: var(--glass);
	border: 1px solid var(--glass-border);
	border-radius: 20px;
	cursor: pointer;
	transition: all var(--transition);
}

.user-avatar-btn:hover {
	background: var(--primary-light);
	border-color: var(--primary);
}

.user-avatar {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	object-fit: cover;
}

.user-name {
	font-size: 0.9rem;
	font-weight: 500;
	color: var(--text-primary);
}

.user-menu-dropdown {
	position: absolute;
	top: calc(100% + 10px);
	right: 0;
	width: 250px;
	background: var(--bg-primary);
	backdrop-filter: blur(16px);
	border: 1px solid var(--glass-border);
	border-radius: 20px;
	box-shadow: var(--shadow-xl);
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: all var(--transition);
	z-index: 9999;
}

.user-menu:hover .user-menu-dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.user-menu-list,.user-menu-item {
	padding: 0.75rem;
}

.user-menu-item {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	color: var(--text-secondary);
	text-decoration: none;
	border-radius: 12px;
	transition: all var(--transition);
}

.user-menu-item:hover {
	background: var(--primary-light);
	color: var(--primary);
	transform: translateX(4px);
}

/* ===================================================== */
/* Drawer موبایل
/* ===================================================== */
.drawer-toggle:checked + .drawer .drawer-content {
	transform: translateY(0);
}

.drawer-content {
	transform: translateY(100%);
	transition: transform 0.4s ease;
}

.drawer-backdrop {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.7);
	transition: opacity 0.3s ease;
}

.drawer-toggle:checked + .drawer .drawer-backdrop {
	opacity: 1;
}

/* ===================================================== */
/* انیمیشن‌های مدرن (جمع‌آوری شده)
/* ===================================================== */
@keyframes fadeIn {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@keyframes slideInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes slideInDown {
	from {
		opacity: 0;
		transform: translateY(-20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes slideInLeft {
	from {
		opacity: 0;
		transform: translateX(20px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes slideInRight {
	from {
		opacity: 0;
		transform: translateX(-20px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes fade-in-up {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes pulse {
	0% {
		box-shadow: 0 0 0 0 rgba(var(--primary-rgb), 0.7);
		transform: scale(1);
	}

	50% {
		transform: scale(1.05);
	}

	70% {
		box-shadow: 0 0 0 10px rgba(var(--primary-rgb), 0);
	}

	100% {
		box-shadow: 0 0 0 0 rgba(var(--primary-rgb), 0);
		transform: scale(1);
	}
}

@keyframes blink {
	0%, 100% {
		opacity: 1;
	}

	50% {
		opacity: 0.5;
	}
}

@keyframes follow-pulse {
	0% {
		box-shadow: 0 0 0 0 rgba(var(--primary-rgb), 0.7);
	}

	70% {
		box-shadow: 0 0 0 10px rgba(var(--primary-rgb), 0);
	}

	100% {
		box-shadow: 0 0 0 0 rgba(var(--primary-rgb), 0);
	}
}

@keyframes badge-bounce {
	0%, 100% {
		transform: scale(1);
	}

	50% {
		transform: scale(1.2);
	}
}

@keyframes ping {
	75%, 100% {
		transform: scale(2);
		opacity: 0;
	}
}

@keyframes wave {
	0%, 100% {
		height: 1px;
		opacity: 0.5;
	}

	50% {
		height: 12px;
		opacity: 1;
	}
}

@keyframes rotate {
	to {
		transform: rotate(-360deg);
	}
}

@keyframes shine {
	0% {
		right: -100%;
	}

	20% {
		right: 100%;
	}

	100% {
		right: 100%;
	}
}

/* کلاس‌های کاربردی انیمیشن */
.animate-fade-in-up {
	animation: fade-in-up 0.4s ease-out;
}

.animate-pulse {
	animation: pulse 2s infinite;
}

.animate-ping {
	animation: ping 1.5s cubic-bezier(0, 0, 0.2, 1) infinite;
}

/* ===================================================== */
/* دکمه‌های پخش و سبک‌های آهنگ
/* ===================================================== */
.play-track-btn {
	position: relative;
	overflow: hidden;
	transition: all 0.3s ease;
}

.play-track-btn::after {
	content: '';
	position: absolute;
	top: 50%;
	right: 50%;
	width: 0;
	height: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.3);
	transform: translate(50%, -50%);
	transition: width 0.6s, height 0.6s;
}

.play-track-btn:hover::after {
	width: 100%;
	height: 100%;
}

.play-track-btn.playing {
	animation: pulse 2s infinite;
}

#play-all-tracks {
	position: relative;
	z-index: 1;
}

/* ===================================================== */
/* ریل‌های پیش‌نمایش
/* ===================================================== */
#preview-rail, #current-rail {
	left: 0;
	right: auto !important;
}

/* ===================================================== */
/* سیستم فالو
/* ===================================================== */
.follow-pulse {
	animation: follow-pulse 2s infinite;
}

.follow-badge {
	position: absolute;
	top: -8px;
	left: -8px;
	background: var(--danger);
	color: white;
	border-radius: 50%;
	width: 20px;
	height: 20px;
	font-size: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	animation: badge-bounce 0.5s;
}

.follow-btn-advanced:hover .follow-icon {
	transform: rotate(-90deg);
	transition: transform 0.3s ease;
}

.follow-icon {
	transition: transform 0.3s ease;
}

/* ===================================================== */
/* اسکرول خودکار
/* ===================================================== */
.auto-scroll-container {
	overflow: hidden;
	position: relative;
}

.auto-scroll {
	display: flex;
	overflow-x: auto;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
}

.auto-scroll::-webkit-scrollbar {
	height: 6px;
}

.auto-scroll::-webkit-scrollbar-track {
	background: var(--bg-secondary);
	border-radius: 3px;
}

.auto-scroll::-webkit-scrollbar-thumb {
	background: var(--primary);
	border-radius: 3px;
}

.auto-scroll.paused {
	animation-play-state: paused;
}

/* ===================================================== */
/* سیستم گرید (جمع‌آوری شده)
/* ===================================================== */
.row--grid {
	display: flex;
	flex-wrap: wrap;
	margin: -15px;
}

.col-12, .col-md-6, .col-xl-4 {
	padding: 15px;
}

@media (min-width: 768px) {
	.col-md-6 {
		width: 50%;
	}
}

@media (min-width: 1200px) {
	.col-xl-4 {
		width: 33.333%;
	}
}

.featured-posts-grid {
	display: grid;
	gap: var(--gap, 20px);
	grid-template-columns: repeat(var(--cols, 4), 1fr);
	margin: 0;
	padding: 0;
}

.featured-posts-grid[data-columns="1"] {
	--cols: 1;
}

.featured-posts-grid[data-columns="2"] {
	--cols: 2;
}

.featured-posts-grid[data-columns="3"] {
	--cols: 3;
}

.featured-posts-grid[data-columns="4"] {
	--cols: 4;
}

.featured-posts-grid[data-columns="5"] {
	--cols: 5;
}

.featured-posts-grid[data-columns="6"] {
	--cols: 6;
}

.featured-post-item {
	padding: 0;
	margin: 0;
}

@supports (grid-template-columns: masonry) {
	.featured-posts-grid {
		grid-template-rows: masonry;
	}
}

.section--three-columns .row {
	display: flex;
	flex-wrap: wrap;
	margin-left: -15px;
	margin-right: -15px;
}

.section--three-columns .col-12 {
	padding-left: 15px;
	padding-right: 15px;
	width: 100%;
}

@media (min-width: 768px) {
	.section--three-columns .col-md-6 {
		flex: 0 0 50%;
		max-width: 50%;
	}
}

@media (min-width: 992px) {
	.section--three-columns .col-lg-4 {
		flex: 0 0 33.333333%;
		max-width: 33.333333%;
	}
}

/* ===================================================== */
/* استایل‌های اضافی و ریسپانسیو
/* ===================================================== */
@media (max-width: 768px) {
	.main-content-wrapper {
		padding: 20px 15px;
	}

	.modern-comments, .comment-respond {
		padding: 20px;
	}

	.comment-card {
		flex-direction: column;
		gap: 10px;
	}

	.comment-avatar {
		align-self: center;
	}

	.notifications-dropdown {
		width: 320px;
		left: -80px;
		right: auto;
	}
}

/* رسپانسیو برای نوتیفیکیشن در موبایل */
@media (max-width: 480px) {
	.notifications-dropdown {
		width: calc(100vw - 40px);
		left: -120px;
	}
}

/* کپچا */
.raditone-captcha-container {
	background: var(--bg-primary);
	border: 1px solid var(--border-primary);
	border-radius: 16px;
	padding: 10px;
}

/* توست نوتیفیکیشن (مثل کد نمونه) */
.rt-toast {
	position: fixed;
	bottom: 30px;
	right: 50%;
	transform: translateX(50%) translateY(20px);
	background: var(--glass);
	backdrop-filter: blur(16px);
	color: var(--text-primary);
	padding: 12px 28px;
	border-radius: 50px;
	z-index: 99999;
	opacity: 0;
	transition: all 0.3s ease;
	border: 1px solid var(--glass-border);
	font-weight: 500;
	box-shadow: var(--shadow-xl);
	white-space: nowrap;
}

.rt-toast.show {
	opacity: 1;
	transform: translateX(50%) translateY(0);
}

.rt-toast.success {
	background: rgba(34,197,94,0.95);
	color: white;
	border-color: #22c55e;
}

.rt-toast.error {
	background: rgba(239,68,68,0.95);
	color: white;
	border-color: #ef4444;
}

.rt-toast.info {
	background: rgba(59,130,246,0.95);
	color: white;
	border-color: #3b82f6;
}

/* صفحه اصلی - پست‌های محبوب */
.rt-top-posts {
	background: var(--glass);
	backdrop-filter: blur(8px);
	padding: 20px;
	border-radius: 24px;
	border: 1px solid var(--glass-border);
	margin: 20px 0;
	transition: transform 0.3s ease;
}

.rt-top-posts:hover {
	transform: translateY(-3px);
}

.rt-top-posts h3 {
	font-size: 1.2rem;
	margin-bottom: 15px;
	color: var(--text-primary);
	border-left: 3px solid var(--primary);
	padding-left: 12px;
}

.rt-top-posts ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.rt-top-posts li {
	padding: 10px 0;
	border-bottom: 1px solid var(--glass-border);
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.rt-top-posts li a {
	font-weight: 600;
	color: var(--primary);
	text-decoration: none;
	transition: color 0.2s;
}

.rt-top-posts li a:hover {
	color: var(--primary-hover);
	text-decoration: underline;
}

.rt-top-posts li span {
	font-size: 0.8rem;
	color: var(--text-tertiary);
	background: var(--glass);
	padding: 2px 8px;
	border-radius: 20px;
}

/* برچسب جدید (مثل کد نمونه) */
.new-badge {
	position: absolute;
	top: 8px;
	right: 8px;
	padding: 2px 8px;
	border-radius: 10px;
	font-size: 0.7rem;
	font-weight: 900;
	z-index: 1;
	white-space: nowrap;
	background: var(--gold);
	color: #000;
	box-shadow: 0 0 10px rgba(251, 191, 36, 0.4);
}

/* ===================================================== */
/* 1. Section Headers & Titles
/* ===================================================== */
.section__header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 15px 0;
	color: var(--text-primary);
}

h2.section__title,a.section__link {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

a.section__link {
	background: var(--bg-secondary);
	padding: 5px 12px;
	border-radius: 25px;
	font-size: 12px;
	color: var(--text-primary);
	text-decoration: none;
	transition: all var(--transition-fast);
}

a.section__link:hover {
	background: var(--primary);
	color: var(--text-dark-bg);
}

section {
	padding: 5px 20px;
}

.main__title {
	margin-bottom: 30px;
}

.main__title h2 {
	font-size: 24px;
	font-weight: 600;
	margin: 0;
	display: flex;
	align-items: center;
	gap: 10px;
}

.main__title h2 svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

.main__title h2 a {
	color: inherit;
	text-decoration: none;
	transition: color 0.3s;
}

.main__title h2 a:hover {
	color: var(--primary);
}

/* RTL Adjustments */
[dir="ltr"] .main__title h2 svg {
	margin-right: 0;
	margin-left: 10px;
}

/* ===================================================== */
/* 2. Single Items List
/* ===================================================== */
.main__list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.single-item {
	display: flex;
	align-items: center;
	padding: 15px 0;
	border-bottom: 1px solid var(--border-primary);
	transition: background-color 0.3s;
	gap: 12px;
}

.post-fav-button {
	position: absolute;
	top: 15px;
	left: 15px;
	font-size: 25px !important;
}

.header-single {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.single-item:hover {
	background-color: var(--bg-tertiary);
	border-radius: 12px;
	padding: 15px 12px;
	margin: 0 -12px;
}

.single-item__number {
	font-size: 18px;
	font-weight: 600;
	color: var(--text-tertiary);
	width: 40px;
	text-align: center;
}

.single-item__rate {
	display: flex;
	align-items: center;
	font-size: 14px;
	color: var(--primary);
	gap: 5px;
}

.single-item__rate svg {
	width: 16px;
	height: 16px;
	fill: currentColor;
}

.single-item__rate--red {
	color: var(--danger);
}

.single-item__cover {
	position: relative;
	display: block;
	width: 60px;
	height: 60px;
	border-radius: 12px;
	overflow: hidden;
	flex-shrink: 0;
	background: var(--bg-secondary);
}

.single-item__cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: filter 0.3s;
}

.single-item__cover svg {
	position: absolute;
	top: 50%;
	right: 50%;
	transform: translate(50%, -50%);
	width: 24px;
	height: 24px;
	fill: var(--text-dark-bg);
	opacity: 0;
	transition: opacity 0.3s;
	z-index: 1;
}

.single-item__cover:hover img {
	filter: brightness(0.7);
}

.single-item__cover:hover svg {
	opacity: 1;
}

.single-item__title {
	flex-grow: 1;
	min-width: 0;
}

.single-item__title h4 {
	margin: 0 0 5px;
	font-size: 16px;
	font-weight: 600;
}

.single-item__title h4 a {
	color: var(--text-primary);
	text-decoration: none;
	transition: color 0.2s;
}

.single-item__title h4 a:hover {
	color: var(--primary);
}

.single-item__title span {
	font-size: 14px;
	color: var(--text-tertiary);
}

.single-item__title span a {
	color: var(--text-tertiary);
	text-decoration: none;
}

.single-item__title span a:hover {
	color: var(--primary);
}

.single-item__time {
	font-size: 14px;
	color: var(--text-tertiary);
}

.single-item__time--live {
	background: var(--danger);
	color: var(--text-dark-bg);
	padding: 4px 12px;
	border-radius: 20px;
	font-size: 12px;
	font-weight: 600;
}

/* RTL Single Item */
[dir="ltr"] .single-item__rate svg {
	margin-right: 0;
	margin-left: 5px;
}

[dir="ltr"] .single-item__time {
	margin-left: 0;
	margin-right: 15px;
}

.singles-list .group {
	background: var(--bg-secondary);
	margin: 10px;
	border-left: 4px solid var(--border-secondary);
	border-radius: 12px;
	padding: 5px;
}

/* ===================================================== */
/* 7. Raditone Tracks Component (تطبیق داده شده با ساختار PHP)
/* ===================================================== */
.raditone-tracks {
	margin-top: 24px;
	margin-bottom: 24px;
	direction: ltr;
}

.raditone-tracks-container {
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 24px;
	overflow: hidden;
}

/* ===================================================== */
/* Tracks Header - هدر بخش ترک‌ها
/* ===================================================== */
.raditone-tracks-header {
	padding: 20px 24px;
	border-bottom: 1px solid var(--border-primary);
	background: linear-gradient(-135deg, var(--bg-tertiary), var(--bg-secondary));
}

@media (max-width: 640px) {
	.raditone-tracks-header {
		padding: 16px;
	}
}

.raditone-tracks-header-content {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

@media (min-width: 640px) {
	.raditone-tracks-header-content {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
}

.raditone-tracks-header-right {
	display: flex;
	align-items: center;
	gap: 12px;
}

.raditone-tracks-icon {
	width: 48px;
	height: 48px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-size: 20px;
}

@media (max-width: 640px) {
	.raditone-tracks-icon {
		width: 40px;
		height: 40px;
		font-size: 18px;
	}
}

.raditone-tracks-title-wrapper {
	flex: 1;
}

.raditone-tracks-title {
	font-size: 1.25rem;
	font-weight: 700;
	margin: 0;
	color: var(--text-primary);
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
}

@media (min-width: 640px) {
	.raditone-tracks-title {
		font-size: 1.5rem;
	}
}

.raditone-tracks-count {
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--primary);
	background: var(--primary-light);
	padding: 2px 10px;
	border-radius: 30px;
}

.raditone-tracks-artist {
	font-size: 0.8rem;
	color: var(--text-tertiary);
	margin: 4px 0 0 0;
	display: flex;
	align-items: center;
	gap: 5px;
}

/* ===================================================== */
/* Action Buttons - دکمه‌های اکشن هدر
/* ===================================================== */
.raditone-tracks-actions-header {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.raditone-tracks-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	border-radius: 40px;
	border: none;
	font-size: 0.875rem;
	font-weight: 600;
	color: white;
	cursor: pointer;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	min-height: 44px;
}

.raditone-tracks-btn:hover {
	transform: translateY(-2px);
	filter: brightness(1.05);
	box-shadow: var(--shadow-md);
}

.raditone-tracks-btn:active {
	transform: translateY(0);
}

.raditone-tracks-btn-primary {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
}

.raditone-tracks-btn-success {
	background: linear-gradient(-135deg, #10b981, #059669);
}

.raditone-tracks-btn-info {
	background: linear-gradient(-135deg, #3b82f6, #06b6d4);
}

.raditone-tracks-btn-text-mobile {
	display: none;
}

@media (max-width: 480px) {
	.raditone-tracks-btn-text {
		display: none;
	}

	.raditone-tracks-btn-text-mobile {
		display: inline;
	}

	.raditone-tracks-btn {
		padding: 8px 14px;
		gap: 6px;
	}
}

/* ===================================================== */
/* Track List - لیست ترک‌ها
/* ===================================================== */
.raditone-tracks-list {
	padding: 20px 24px;
}

@media (max-width: 640px) {
	.raditone-tracks-list {
		padding: 16px;
	}
}

/* آیتم هر ترک */
.raditone-tracks-item {
	margin-bottom: 12px;
	border: 1px solid var(--border-primary);
	border-radius: 20px;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	background-color: var(--bg-primary);
	cursor: pointer;
}

.raditone-tracks-item:hover {
	border-color: var(--primary);
	transform: translateY(-2px);
	box-shadow: var(--shadow-lg);
}

.raditone-tracks-item:active {
	transform: translateY(0);
}

.raditone-tracks-item-content {
	padding: 16px 20px;
}

@media (max-width: 640px) {
	.raditone-tracks-item-content {
		padding: 14px;
	}
}

.raditone-tracks-item-row {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

@media (min-width: 768px) {
	.raditone-tracks-item-row {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
}

/* ===================================================== */
/* Track Info - اطلاعات ترک
/* ===================================================== */
.raditone-tracks-info-wrapper {
	display: flex;
	align-items: center;
	gap: 16px;
	flex: 1;
	min-width: 0;
}

.raditone-tracks-number {
	width: 36px;
	text-align: center;
	font-size: 1rem;
	font-weight: 700;
	color: var(--primary);
	direction: ltr;
	background: var(--primary-light);
	padding: 4px 0;
	border-radius: 12px;
}

.raditone-tracks-info {
	flex: 1;
	min-width: 0;
}

.raditone-tracks-name {
	font-size: 1rem;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 6px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

@media (min-width: 640px) {
	.raditone-tracks-name {
		font-size: 1.1rem;
	}
}

.raditone-tracks-artist-small {
	font-size: 0.75rem;
	color: var(--text-tertiary);
	display: flex;
	align-items: center;
	gap: 6px;
}

.raditone-tracks-artist-small i {
	font-size: 0.7rem;
	color: var(--primary);
}

/* ===================================================== */
/* Track Actions - دکمه‌های اکشن ترک
/* ===================================================== */
.raditone-tracks-actions {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

@media (min-width: 640px) {
	.raditone-tracks-actions {
		flex-direction: row;
		align-items: center;
		flex-wrap: wrap;
	}
}

.raditone-tracks-actions-row {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

/* دکمه‌های گرد */
.raditone-tracks-action {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: none;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.3s ease;
	font-size: 18px;
	background: var(--bg-tertiary);
	color: var(--text-secondary);
}

.raditone-tracks-action:hover {
	transform: scale(1.1);
	background: var(--primary-light);
	color: var(--primary);
}

.raditone-tracks-action:active {
	transform: scale(0.95);
}

/* دکمه پخش */
.raditone-tracks-btn-play {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	color: white;
}

.raditone-tracks-btn-play:hover {
	background: linear-gradient(-135deg, var(--primary-hover), var(--accent));
	color: white;
}

.raditone-tracks-btn-play.playing {
	background: linear-gradient(-135deg, var(--danger), #f97316);
}

/* دکمه علاقه‌مندی فعال */
.raditone-tracks-favorite-active {
	background: rgba(239, 68, 68, 0.15);
	color: #ef4444;
}

.raditone-tracks-favorite-active:hover {
	background: rgba(239, 68, 68, 0.25);
	color: #ef4444;
}

/* ===================================================== */
/* Share Dropdown - منوی اشتراک‌گذاری
/* ===================================================== */
.raditone-tracks-share {
	position: relative;
}

.raditone-tracks-share-dropdown {
	position: absolute;
	bottom: 100%;
	right: 50%;
	transform: translateX(50%) translateY(-8px);
	margin-bottom: 8px;
	width: 160px;
	background: var(--bg-primary);
	border-radius: 16px;
	box-shadow: var(--shadow-xl);
	border: 1px solid var(--border-primary);
	z-index: 100;
	display: none;
	overflow: hidden;
}

.raditone-tracks-share-dropdown.raditone-tracks-show {
	display: block;
	animation: raditoneShareFadeIn 0.2s ease;
}

@keyframes raditoneShareFadeIn {
	from {
		opacity: 0;
		transform: translateX(50%) translateY(-4px);
	}

	to {
		opacity: 1;
		transform: translateX(50%) translateY(0);
	}
}

.raditone-tracks-share-option {
	width: 100%;
	padding: 12px 16px;
	display: flex;
	align-items: center;
	gap: 10px;
	border: none;
	background: none;
	font-size: 0.875rem;
	color: var(--text-primary);
	cursor: pointer;
	transition: all 0.2s ease;
	text-align: left;
}

.raditone-tracks-share-option:hover {
	background: var(--bg-tertiary);
}

.raditone-tracks-share-telegram i {
	color: #3b82f6;
}

.raditone-tracks-share-whatsapp i {
	color: #25D366;
}

.raditone-tracks-share-copy i {
	color: var(--primary);
}

/* RTL برای منوی اشتراک */
[dir="ltr"] .raditone-tracks-share-dropdown {
	right: auto;
	left: 50%;
	transform: translateX(-50%) translateY(-8px);
}

[dir="ltr"] .raditone-tracks-share-dropdown.raditone-tracks-show {
	transform: translateX(-50%) translateY(0);
}



/* ===================================================== */
/* Lyrics - متن ترانه
/* ===================================================== */
.raditone-tracks-lyrics-wrapper {
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px solid var(--border-primary);
}

.raditone-tracks-lyrics-toggle {
	background: none;
	border: none;
	color: var(--primary);
	font-weight: 600;
	font-size: 0.875rem;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	border-radius: 30px;
	transition: all 0.3s ease;
}

.raditone-tracks-lyrics-toggle:hover {
	background: var(--primary-light);
	color: var(--primary-hover);
}

.raditone-tracks-lyrics-content {
	margin-top: 16px;
	padding: 20px;
	background: var(--bg-tertiary);
	border-radius: 16px;
	white-space: pre-line;
	color: var(--text-secondary);
	font-size: 0.875rem;
	line-height: 1.8;
	border: 1px solid var(--border-primary);
}

@media (min-width: 640px) {
	.raditone-tracks-lyrics-content {
		padding: 24px;
		font-size: 1rem;
	}
}

/* ===================================================== */
/* Notification - نوتیفیکیشن
/* ===================================================== */
.raditone-tracks-notification {
	position: fixed;
	bottom: 100px;
	left: 20px;
	background: var(--glass);
	backdrop-filter: blur(20px);
	color: var(--text-primary);
	padding: 12px 20px;
	border-radius: 60px;
	box-shadow: var(--shadow-xl);
	z-index: 10001;
	max-width: 320px;
	border: 1px solid var(--glass-border);
	animation: raditoneTracksSlideIn 0.3s ease;
	font-size: 0.875rem;
	font-weight: 500;
}

[dir="ltr"] .raditone-tracks-notification {
	left: auto;
	right: 20px;
}

.raditone-tracks-notification-success {
	border-left: 3px solid #10b981;
}

.raditone-tracks-notification-error {
	border-left: 3px solid #ef4444;
}

.raditone-tracks-notification-info {
	border-left: 3px solid #3b82f6;
}

.raditone-tracks-notification-content {
	display: flex;
	align-items: center;
	gap: 10px;
}

@keyframes raditoneTracksSlideIn {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* ===================================================== */
/* Responsive - ریسپانسیو موبایل
/* ===================================================== */
@media (max-width: 768px) {
    
	.raditone-tracks-actions-row,.raditone-tracks-downloads {
		width: 100%;
		justify-content: space-between;
	}

	.raditone-tracks-download-btn {
		flex: 1;
	}
}

@media (max-width: 480px) {
	.raditone-tracks-number {
		width: 30px;
		font-size: 0.875rem;
	}

	.raditone-tracks-name {
		font-size: 0.9rem;
	}

	.raditone-tracks-action {
		width: 36px;
		height: 36px;
		font-size: 16px;
	}

	.raditone-tracks-btn-play {
		width: 40px;
		height: 40px;
	}
}

/* ===================================================== */
/* Accessibility - دسترسی‌پذیری
/* ===================================================== */
@media (prefers-reduced-motion: reduce) {
	.raditone-tracks-item,
    .raditone-tracks-btn,
    .raditone-tracks-action,
    .raditone-tracks-download-btn,
    .raditone-tracks-share-dropdown {
		transition: none !important;
		animation: none !important;
	}

	.raditone-tracks-item:hover {
		transform: none;
	}
}

/* فوکوس برای دسترسی صفحه کلید */
.raditone-tracks-btn:focus-visible,
.raditone-tracks-action:focus-visible,
.raditone-tracks-download-btn:focus-visible,
.raditone-tracks-lyrics-toggle:focus-visible {
	outline: 2px solid var(--primary);
	outline-offset: 2px;
	border-radius: 8px;
}

/* کلاس‌های کمکی */
.raditone-tracks-hidden {
	display: none !important;
}
/* ===================================================== */
/* 8. Responsive & RTL Adjustments
/* ===================================================== */
@media (max-width: 768px) {
	.taxonomy-cards-container {
		grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
		gap: 10px;
		padding: 10px;
	}

	.raditone-artistcards-container {
		grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
		gap: 15px;
		padding: 15px;
	}

	.raditone-tracks-header,
    .raditone-tracks-list {
		padding: 15px;
	}

	.raditone-tracks-item-content {
		padding: 12px 15px;
	}

	.raditone-tracks-download-texts {
		padding: 8px 12px;
		font-size: 12px;
		min-width: 80px;
	}

	.raditone-tracks-download-icon {
		width: 40px;
		height: 40px;
	}
}

@media (max-width: 480px) {
	.raditone-tracks-btn-text {
		display: none;
	}

	.raditone-tracks-btn {
		padding: 8px 12px;
	}

	.raditone-tracks-actions-row,.raditone-tracks-downloads {
		width: 100%;
		justify-content: space-between;
	}

	.raditone-tracks-download-btn {
		flex: 1;
	}
}

/* RTL Specific */
[dir="ltr"] .raditone-tracks-number {
	direction: ltr;
}

[dir="ltr"] .raditone-tracks-notification {
	left: auto;
	right: 20px;
}

/* ===================================================== */
/* 9. Utility & Animation Classes
/* ===================================================== */
.rt-thumbnail-placeholder {
	color: var(--text-primary);
}

@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes raditoneTracksSlideIn {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Animation Delays */
.animation-delay-100 {
	animation-delay: 0.1s;
}

.animation-delay-200 {
	animation-delay: 0.2s;
}

.animation-delay-300 {
	animation-delay: 0.3s;
}

.animation-delay-400 {
	animation-delay: 0.4s;
}

.animation-delay-500 {
	animation-delay: 0.5s;
}

/* Touch Optimization */
@media (hover: none) and (pointer: coarse) {
    
	.raditone-tracks-item:hover,.raditone-tracks-action:hover,.raditone-tracks-download-btn:hover,.raditone-tracks-btn:hover {
		transform: none;
	}

	.raditone-tracks-action:active,
    .raditone-tracks-download-btn:active,
    .raditone-tracks-btn:active {
		transform: scale(0.95);
	}
}

/* ===================================================== */
/* Video Player
/* ===================================================== */
.raditone-video-container {
	position: relative;
	width: 100%;
	max-width: 100%;
	background: #0a0a0a;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: var(--shadow-xl);
	margin-bottom: 2rem;
}

.video-wrapper {
	position: relative;
	padding-top: 56.25%;
    /* 16:9 Aspect Ratio */;
}

.raditone-video {
	top: 0;
	width: 100%;
	height: 100%;
	background: #000;
}

.raditone-video,.video-controls {
	position: absolute;
	right: 0;
}

.video-controls {
	bottom: 0;
	left: 0;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.85), transparent);
	padding: 12px 16px;
	display: flex;
	align-items: center;
	gap: 12px;
	opacity: 0;
	transition: opacity 0.3s ease;
	flex-wrap: wrap;
}

.video-wrapper:hover .video-controls {
	opacity: 1;
}

.ctrl-btn {
	background: none;
	border: none;
	color: #fff;
	font-size: 1.3rem;
	cursor: pointer;
	padding: 8px;
	border-radius: 50%;
	transition: all 0.2s ease;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	min-height: 40px;
}

.ctrl-btn:hover {
	background: rgba(255, 255, 255, 0.18);
	transform: scale(1.1);
}

.progress-container {
	flex: 1;
	height: 5px;
	background: rgba(255, 255, 255, 0.3);
	border-radius: 3px;
	cursor: pointer;
	position: relative;
	min-width: 100px;
}

.progress-filled {
	position: absolute;
	right: 0;
	top: 0;
	height: 100%;
	width: 0%;
	background: var(--primary);
	border-radius: 3px;
	transition: width 0.1s linear;
}

.time-display {
	color: #eee;
	font-size: 0.85rem;
	min-width: 100px;
	text-align: center;
	font-family: var(--font-iranyekan);
}

@media (max-width: 640px) {
	.time-display {
		font-size: 0.75rem;
		min-width: 85px;
	}
}

.quality-selector {
	position: relative;
}

.quality-dropdown {
	position: absolute;
	bottom: 100%;
	left: 0;
	background: rgba(15, 15, 15, 0.95);
	backdrop-filter: blur(10px);
	border-radius: 12px;
	padding: 6px 0;
	margin: 0 0 8px 0;
	list-style: none;
	min-width: 100px;
	box-shadow: var(--shadow-xl);
	display: none;
	z-index: 20;
}

.quality-dropdown li {
	padding: 10px 16px;
	color: white;
	cursor: pointer;
	transition: all 0.2s ease;
	font-size: 0.85rem;
	text-align: center;
}

.quality-dropdown li:hover,
.quality-dropdown li.active {
	background: var(--primary);
}

.quality-btn {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 0.85rem;
}

.video-loading {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.7);
	display: none;
	place-items: center;
	z-index: 20;
}

.video-loading.active {
	display: grid;
}

.video-loading::after {
	content: '';
	width: 48px;
	height: 48px;
	border: 4px solid var(--primary);
	border-top-color: transparent;
	border-radius: 50%;
	animation: rotate 1s linear infinite;
}

@keyframes rotate {
	to {
		transform: rotate(-360deg);
	}
}

.mobile-top-controls {
	display: none;
	position: absolute;
	top: 10px;
	right: 0;
	left: 0;
	padding: 0 12px;
	justify-content: space-between;
	z-index: 12;
}

.mobile-top-controls .ctrl-btn {
	background: rgba(0, 0, 0, 0.5);
	backdrop-filter: blur(5px);
	border-radius: 12px;
	padding: 8px 12px;
	font-size: 1rem;
}

.desktop-side-controls {
	display: flex;
	align-items: center;
	gap: 12px;
}

@media (max-width: 640px) {
	.desktop-side-controls {
		display: none !important;
	}

	.mobile-top-controls {
		display: flex;
	}

	.mobile-quality {
		margin-left: auto;
	}

	.mobile-fullscreen {
		margin-right: auto;
	}

	.quality-dropdown {
		left: auto;
		right: 0;
	}
}

/* ===================================================== */
/* Archive Page - Complete Modern Design
/* ===================================================== */

/* متغیرهای آرشیو */
.raditone-archive {
	--raditone-archive-col-mobile: 2;
	--raditone-archive-col-tablet: 3;
	--raditone-archive-col-desktop: 4;
	min-height: 100vh;
}

.raditone-archive section {
	padding: 0px !important;
}
/* ===================================================== */
/* هدر مدرن و ریسپانسیو
/* ===================================================== */

.raditone-archive-header {
	position: relative;
	background: linear-gradient(-135deg, 
        rgba(var(--primary-rgb), 0.08) 0%,
        rgba(var(--accent-rgb), 0.04) 100%
    );
	border-bottom: 1px solid rgba(var(--border-primary-rgb), 0.2);
	padding: 1rem 0;
}

@media (min-width: 640px) {
	.raditone-archive-header {
		padding: 1.2rem 0;
	}
}

@media (min-width: 1024px) {
	.raditone-archive-header {
		padding: 1.5rem 0;
	}
}

.raditone-container {
	width: 100%;
	margin: 0 auto;
	padding: 0 0;
}

@media (min-width: 640px) {
	.raditone-container {
		padding: 0 1.5rem;
	}
}

@media (min-width: 1024px) {
	.raditone-container {
		padding: 0 2rem;
	}
}

/* محتوای هدر */
.raditone-archive-header-content {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

@media (min-width: 768px) {
	.raditone-archive-header-content {
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		gap: 0.5rem;
	}
}

/* اطلاعات هدر */
.raditone-archive-header-info {
	flex: 1;
}

/* Breadcrumb */
.raditone-breadcrumb {
	margin-bottom: 0.75rem;
}

.raditone-breadcrumb-inner {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex-wrap: wrap;
	font-size: 0.75rem;
}

@media (min-width: 640px) {
	.raditone-breadcrumb-inner {
		font-size: 0.875rem;
		gap: 0.75rem;
	}
}

.raditone-breadcrumb-link {
	color: var(--text-secondary);
	text-decoration: none;
	transition: color 0.2s ease;
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
}

.raditone-breadcrumb-link:hover {
	color: var(--primary);
}

.raditone-breadcrumb-sep {
	font-size: 0.7rem;
	color: var(--text-tertiary);
}

.raditone-breadcrumb-current {
	color: var(--text-primary);
	font-weight: 500;
}

/* عنوان آرشیو */
.raditone-archive-title {
	font-size: 1.5rem;
	font-weight: 800;
	display: flex;
	align-items: center;
	gap: 0.6rem;
	flex-wrap: wrap;
	margin-bottom: 0.5rem;
}

@media (min-width: 480px) {
	.raditone-archive-title {
		font-size: 1.75rem;
	}
}

@media (min-width: 768px) {
	.raditone-archive-title {
		font-size: 2rem;
		gap: 0.8rem;
	}
}

.raditone-archive-title i {
	font-size: 1.3rem;
	color: var(--primary);
}

@media (min-width: 768px) {
	.raditone-archive-title i {
		font-size: 1.6rem;
	}
}

.raditone-archive-title-accent {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

/* توضیحات */
.raditone-archive-description-text {
	font-size: 0.85rem;
	color: var(--text-secondary);
	line-height: 1.5;
	margin-top: 0.25rem;
	max-width: 100%;
}

@media (min-width: 640px) {
	.raditone-archive-description-text {
		font-size: 0.9rem;
		max-width: 90%;
	}

	.raditone-archive section {
		padding: 1rem !important;
	}
}

@media (min-width: 768px) {
	.raditone-archive-description-text {
		font-size: 0.95rem;
		max-width: 80%;
	}

	.raditone-archive section {
		padding: 1rem !important;
	}
}

/* آمار */
.raditone-archive-stats {
	display: flex;
	gap: 0.6rem;
	flex-wrap: wrap;
}

@media (min-width: 640px) {
	.raditone-archive-stats {
		gap: 0.8rem;
	}
}

.raditone-archive-stat-card {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	background: var(--bg-tertiary);
	padding: 0.45rem 0.9rem;
	border-radius: 2rem;
	border: 1px solid var(--border-primary);
	transition: all 0.2s ease;
}

@media (min-width: 640px) {
	.raditone-archive-stat-card {
		padding: 0.55rem 1.1rem;
		gap: 0.6rem;
	}
}

.raditone-archive-stat-card i {
	font-size: 0.8rem;
	color: var(--primary);
}

@media (min-width: 640px) {
	.raditone-archive-stat-card i {
		font-size: 0.9rem;
	}
}

.raditone-archive-stat-value {
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--text-primary);
}

@media (min-width: 640px) {
	.raditone-archive-stat-value {
		font-size: 1rem;
	}
}

.raditone-archive-stat-label {
	font-size: 0.65rem;
	color: var(--text-tertiary);
	font-weight: 500;
}

@media (min-width: 640px) {
	.raditone-archive-stat-label {
		font-size: 0.7rem;
	}
}

/* ===================================================== */
/* فیلترها - ریسپانسیو
/* ===================================================== */
.raditone-archive-view-buttons {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.raditone-view-btn {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.5rem 0.9rem;
	border-radius: 0.75rem;
	border: 1px solid var(--border-primary);
	background: var(--bg-secondary);
	cursor: pointer;
	transition: all 0.2s ease;
	font-size: 0.8rem;
	color: var(--text-secondary);
}

@media (min-width: 640px) {
	.raditone-view-btn {
		padding: 0.6rem 1.2rem;
		gap: 0.6rem;
		font-size: 0.85rem;
	}
}

.raditone-view-btn i {
	font-size: 0.85rem;
}

.raditone-view-btn.active {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-color: transparent;
	color: white;
}

.raditone-archive-sort {
	position: relative;
	width: 100%;
}

@media (min-width: 640px) {
	.raditone-archive-sort {
		width: auto;
		min-width: 180px;
	}
}

.raditone-sort-select {
	width: 100%;
	appearance: none;
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 0.75rem;
	padding: 0.55rem 1rem 0.55rem 2rem;
	font-size: 0.8rem;
	outline: none;
	cursor: pointer;
	color: var(--text-primary);
}

@media (min-width: 640px) {
	.raditone-sort-select {
		width: auto;
		padding: 0.6rem 1rem 0.6rem 2.2rem;
		font-size: 0.85rem;
	}
}

.raditone-sort-icon {
	position: absolute;
	right: 0.75rem;
	top: 50%;
	transform: translateY(-50%);
	pointer-events: none;
	font-size: 0.8rem;
	color: var(--text-tertiary);
}

/* شمارنده */
.raditone-archive-counter {
	font-size: 0.75rem;
	color: var(--text-tertiary);
	margin-bottom: 1rem;
	text-align: right;
}

@media (min-width: 640px) {
	.raditone-archive-counter {
		font-size: 0.85rem;
		margin-bottom: 1.25rem;
	}
}

/* ===================================================== */
/* گرید پست‌ها
/* ===================================================== */

.raditone-archive-grid {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(var(--raditone-archive-col-mobile, 2), 1fr);
}

@media (min-width: 640px) {
	.raditone-archive-grid {
		gap: 1.25rem;
	}
}

@media (min-width: 768px) {
	.raditone-archive-grid {
		gap: 1.5rem;
		grid-template-columns: repeat(var(--raditone-archive-col-tablet, 3), 1fr);
	}
}

@media (min-width: 1024px) {
	.raditone-archive-grid {
		gap: 1.75rem;
		grid-template-columns: repeat(var(--raditone-archive-col-desktop, 4), 1fr);
	}
}

/* کارت پست */
.raditone-archive-card {
	position: relative;
	animation: raditone-fadeInUp 0.4s ease-out forwards;
	opacity: 0;
}

.raditone-archive-card:nth-child(1) {
	animation-delay: 0s;
}

.raditone-archive-card:nth-child(2) {
	animation-delay: 0.05s;
}

.raditone-archive-card:nth-child(3) {
	animation-delay: 0.1s;
}

.raditone-archive-card:nth-child(4) {
	animation-delay: 0.15s;
}

.raditone-archive-card:nth-child(5) {
	animation-delay: 0.2s;
}

.raditone-archive-card:nth-child(6) {
	animation-delay: 0.25s;
}

.raditone-archive-card-link {
	display: block;
	text-decoration: none;
	background: var(--bg-secondary);
	border-radius: 1rem;
	overflow: hidden;
	border: 1px solid var(--border-primary);
	transition: all 0.3s ease;
}

.raditone-archive-card-link:hover {
	transform: translateY(-4px);
	border-color: rgba(var(--primary-rgb), 0.3);
	box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
}

/* تصویر کارت */
.raditone-archive-card-image {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: linear-gradient(-135deg, var(--bg-tertiary), var(--bg-secondary));
}

.raditone-archive-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.raditone-archive-card-link:hover .raditone-archive-card-image img {
	transform: scale(1.05);
}

.raditone-archive-card-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(-135deg, var(--primary-light), rgba(var(--accent-rgb), 0.1));
}

.raditone-archive-card-placeholder i {
	font-size: 3rem;
	color: var(--primary);
	opacity: 0.5;
}

/* اورلی پلی */
.raditone-archive-card-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.4);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.raditone-archive-card-link:hover .raditone-archive-card-overlay {
	opacity: 1;
}

.raditone-archive-card-play {
	width: 45px;
	height: 45px;
	background: white;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.2s ease;
}

@media (min-width: 640px) {
	.raditone-archive-card-play {
		width: 50px;
		height: 50px;
	}
}

.raditone-archive-card-play i {
	font-size: 1.2rem;
	color: var(--primary);
	margin-left: 2px;
}

@media (min-width: 640px) {
	.raditone-archive-card-play i {
		font-size: 1.3rem;
	}
}

.raditone-archive-card-link:hover .raditone-archive-card-play {
	transform: scale(1.1);
}

/* محتوای کارت */
.raditone-archive-card-content {
	padding: 0.8rem;
}

@media (min-width: 640px) {
	.raditone-archive-card-content {
		padding: 1rem;
	}
}

.raditone-archive-card-title {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--text-primary);
	margin-bottom: 0.25rem;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

@media (min-width: 640px) {
	.raditone-archive-card-title {
		font-size: 0.95rem;
		margin-bottom: 0.3rem;
	}
}

.raditone-archive-card-artist {
	font-size: 0.7rem;
	color: var(--text-tertiary);
	display: flex;
	align-items: center;
	gap: 0.25rem;
}

@media (min-width: 640px) {
	.raditone-archive-card-artist {
		font-size: 0.75rem;
		gap: 0.3rem;
	}
}

.raditone-archive-card-artist i {
	font-size: 0.65rem;
}

/* ===================================================== */
/* حالت لیست
/* ===================================================== */

.raditone-archive-grid--list {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

@media (min-width: 640px) {
	.raditone-archive-grid--list {
		gap: 1rem;
	}
}

.raditone-archive-card--list {
	width: 100%;
}

.raditone-archive-card--list .raditone-archive-card-link {
	display: flex;
	flex-direction: row;
	gap: 0.75rem;
}

@media (min-width: 640px) {
	.raditone-archive-card--list .raditone-archive-card-link {
		gap: 1rem;
	}
}

.raditone-archive-card--list .raditone-archive-card-image {
	width: 60px;
	aspect-ratio: 1 / 1;
	flex-shrink: 0;
}

@media (min-width: 640px) {
	.raditone-archive-card--list .raditone-archive-card-image {
		width: 75px;
	}
}

.raditone-archive-card--list .raditone-archive-card-content {
	flex: 1;
	padding: 0.6rem 0 0.6rem 0.6rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

@media (min-width: 640px) {
	.raditone-archive-card--list .raditone-archive-card-content {
		padding: 0.8rem 0 0.8rem 0.8rem;
	}
}

.raditone-archive-card--list .raditone-archive-card-title {
	-webkit-line-clamp: 1;
}

.raditone-archive-card--list .raditone-archive-card-play {
	width: 35px;
	height: 35px;
}

.raditone-archive-card--list .raditone-archive-card-play i {
	font-size: 0.9rem;
}

/* ===================================================== */
/* لودینگ و پایان
/* ===================================================== */

.raditone-loading-indicator {
	text-align: center;
	padding: 2rem;
}

.raditone-spinner {
	width: 40px;
	height: 40px;
	border: 3px solid var(--border-primary);
	border-top-color: var(--primary);
	border-radius: 50%;
	animation: raditone-spin 0.8s linear infinite;
	margin: 0 auto 0.5rem;
}

@keyframes raditone-spin {
	to {
		transform: rotate(-360deg);
	}
}

.raditone-end-message {
	text-align: center;
	padding: 2rem;
}

.raditone-end-message-inner {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem 1rem;
	background: var(--bg-tertiary);
	border-radius: 2rem;
	font-size: 0.85rem;
	color: var(--text-tertiary);
}

.raditone-scroll-trigger {
	height: 20px;
	margin-top: 1rem;
}

/* ===================================================== */
/* انیمیشن‌ها
/* ===================================================== */

@keyframes raditone-fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* ===================================================== */
/* پلیر فوتر
/* ===================================================== */

.raditone-archive-player {
	position: fixed;
	bottom: 0;
	right: 0;
	left: 0;
	background: var(--bg-secondary);
	border-top: 1px solid var(--border-primary);
	backdrop-filter: blur(20px);
	z-index: 100;
	transform: translateY(100%);
	transition: transform 0.3s ease;
}

.raditone-archive-player.active {
	transform: translateY(0);
}

.raditone-player-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	padding: 0.75rem 1rem;
}

@media (min-width: 640px) {
	.raditone-player-inner {
		padding: 0.8rem 1.5rem;
		gap: 1rem;
	}
}

.raditone-player-info {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex: 1;
	min-width: 0;
}

.raditone-player-image {
	width: 45px;
	height: 45px;
	border-radius: 0.5rem;
	overflow: hidden;
	background: var(--bg-tertiary);
	flex-shrink: 0;
}

@media (min-width: 640px) {
	.raditone-player-image {
		width: 55px;
		height: 55px;
	}
}

.raditone-player-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.raditone-player-image-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(-135deg, var(--primary-light), rgba(var(--accent-rgb), 0.1));
}

.raditone-player-image-placeholder i {
	font-size: 1.2rem;
	color: var(--primary);
}

.raditone-player-text {
	flex: 1;
	min-width: 0;
}

.raditone-player-title {
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--text-primary);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

@media (min-width: 640px) {
	.raditone-player-title {
		font-size: 0.9rem;
	}
}

.raditone-player-artist {
	font-size: 0.65rem;
	color: var(--text-tertiary);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

@media (min-width: 640px) {
	.raditone-player-artist {
		font-size: 0.7rem;
	}
}

.raditone-player-controls {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

@media (min-width: 640px) {
	.raditone-player-controls {
		gap: 1rem;
	}
}

.raditone-player-btn {
	background: none;
	border: none;
	cursor: pointer;
	padding: 0.5rem;
	border-radius: 50%;
	transition: all 0.2s ease;
	color: var(--text-primary);
}

.raditone-player-btn:hover {
	background: var(--bg-tertiary);
	color: var(--primary);
}

.raditone-player-btn i {
	font-size: 1.1rem;
}

@media (min-width: 640px) {
	.raditone-player-btn i {
		font-size: 1.3rem;
	}
}

.raditone-player-close {
	background: none;
	border: none;
	cursor: pointer;
	padding: 0.5rem;
	border-radius: 50%;
	color: var(--text-tertiary);
	transition: all 0.2s ease;
}

.raditone-player-close:hover {
	background: var(--bg-tertiary);
	color: var(--danger);
}

.raditone-player-close i {
	font-size: 1rem;
}

.raditone-player-progress {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 3px;
	background: var(--border-primary);
}

.raditone-player-progress-bar {
	width: 0%;
	height: 100%;
	background: var(--bg-secondary);
	transition: width 0.1s linear;
}

/* ===================================================== */
/* Single Page & General
/* ===================================================== */
.raditone-quick-btn i, 
.raditone-share-btn i {
	font-size: 18px;
}

.header-content {
	display: flex;
	justify-content: space-between;
}

.main-bg {
	background: var(--bg-primary);
	border: 1px solid var(--border-secondary);
}

.main-bg,.main-bg .raditone-artist-name,.main-bg .raditone-track-meta {
	color: var(--text-primary);
}

.popup-body, 
.popup-footer {
	background: var(--bg-primary);
	border: 1px solid var(--border-primary) !important;
}

.popup-header {
	border: none !important;
}

.border-top {
	border-top: 1px solid var(--border-secondary);
}

.border {
	border: 1px solid var(--border-secondary) !important;
}

/* Quick Actions */
.raditone-quick-actions {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
	margin-top: 1rem;
	margin-bottom: 1rem;
}

.raditone-quick-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	padding: 1rem;
	border-radius: 1rem;
	background: var(--bg-primary);
	border: 1px solid var(--border-primary);
	font-weight: 500;
	color: var(--text-primary);
	cursor: pointer;
	transition: all var(--transition-fast);
}

.raditone-quick-btn:hover:not(:disabled) {
	background: var(--primary-light);
	border-color: var(--primary);
	transform: translateY(-2px);
	box-shadow: var(--shadow-md);
}

.raditone-quick-btn:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.raditone-quick-btn i {
	font-size: 1.25rem;
}

/* Share Grid */
.raditone-share-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.75rem;
}

.raditone-share-btn {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.5rem;
	padding: 1rem;
	border-radius: 1rem;
	background: var(--bg-primary);
	border: 1px solid var(--border-primary);
	color: var(--text-primary);
	cursor: pointer;
	transition: all var(--transition-fast);
}

.raditone-share-btn:hover {
	background: var(--bg-secondary);
	border-color: var(--border-secondary);
	transform: translateY(-2px);
	box-shadow: var(--shadow-md);
}

.raditone-share-btn span {
	font-size: 0.875rem;
	color: var(--text-secondary);
}

.raditone-share-btn i {
	font-size: 1.75rem;
}

/* Telegram icon -始终保持品牌色 */
.raditone-telegram i {
	color: #0088cc;
}

/* WhatsApp icon -始终保持品牌色 */
.raditone-whatsapp i {
	color: #25D366;
}

/* Copy icon -跟随主题 */
.raditone-copy i {
	color: var(--text-tertiary);
}

/* Responsive */
@media (max-width: 768px) {
	.raditone-quick-actions {
		gap: 0.75rem;
	}

	.raditone-quick-btn {
		padding: 0.75rem;
		font-size: 0.875rem;
	}

	.raditone-quick-btn i {
		font-size: 1rem;
	}

	.raditone-share-grid {
		gap: 0.5rem;
	}

	.raditone-share-btn {
		padding: 0.75rem;
	}

	.raditone-share-btn span {
		font-size: 0.75rem;
	}

	.raditone-share-btn i {
		font-size: 1.25rem;
	}
}

@media (max-width: 480px) {
	.raditone-quick-actions {
		gap: 0.5rem;
	}

	.raditone-quick-btn {
		padding: 0.6rem;
		font-size: 0.75rem;
		gap: 0.5rem;
	}

	.raditone-share-grid {
		gap: 0.4rem;
	}

	.raditone-share-btn {
		padding: 0.6rem;
	}

	.raditone-share-btn span {
		font-size: 0.7rem;
	}
}

.music-english-name {
	margin-bottom: 12px;
	margin-top: -10px;
}
/* ====== استایل‌های عمومی ====== */
.hiddenclass {
	display: none;
}

.spin {
	animation: spin 1s linear infinite;
}

@keyframes spin {
	to {
		transform: rotate(-360deg);
	}
}

@keyframes fadeOut {
	0% {
		opacity: 1;
	}

	70% {
		opacity: 1;
	}

	100% {
		opacity: 0;
		visibility: hidden;
	}
}

@keyframes modalSlideIn {
	from {
		opacity: 0;
		transform: translateY(-30px) scale(0.95);
	}

	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes modalFadeOut {
	from {
		opacity: 1;
	}

	to {
		opacity: 0;
	}
}

@keyframes raditoneFadeInUp {
	from {
		opacity: 0;
		transform: translateX(50%) translateY(10px);
	}

	to {
		opacity: 1;
		transform: translateX(50%) translateY(0);
	}
}

@keyframes rdSpin {
	to {
		transform: rotate(-360deg);
	}
}

.rd-spin {
	animation: rdSpin 1s linear infinite;
}

.raditone-no-lyrics {
	text-align: center;
	padding: 50px 20px 40px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
}

.raditone-no-lyrics-icon {
	font-size: 48px;
	color: #b2bec3;
	margin-bottom: 8px;
	opacity: 0.5;
}

.raditone-no-lyrics-text {
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--text-primary);
	margin: 0;
}

.raditone-no-lyrics-sub {
	font-size: 0.9rem;
	color: #636e72;
	margin: 0 0 10px 0;
}

.raditone-btn-primary {
	background: var(--primary, #6c5ce7) !important;
	color: #fff !important;
	padding: 12px 28px !important;
	border-radius: 12px !important;
	font-weight: 600 !important;
	transition: all 0.3s ease !important;
	border: none !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 10px !important;
	cursor: pointer !important;
}

.raditone-btn-primary:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(108, 92, 231, 0.3);
}

.raditone-btn-primary svg {
	width: 20px;
	height: 20px;
}
/* ====== مودال‌ها ====== */
.raditone-modal-overlay {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,0.75);
	z-index: 99999;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.raditone-modal-overlay[style*="display: flex"] {
	display: flex !important;
}

.raditone-modal-content {
	background: #1a1f2e;
	border-radius: 16px;
	max-width: 600px;
	width: 100%;
	max-height: 90vh;
	overflow-y: auto;
	box-shadow: 0 30px 60px rgba(0,0,0,0.6);
	animation: modalSlideIn 0.3s ease;
}

.raditone-modal-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 18px 24px;
	border-bottom: 1px solid rgba(255,255,255,0.08);
	background: rgba(255,255,255,0.03);
	border-radius: 16px 16px 0 0;
}

.raditone-modal-header h3 {
	margin: 0;
	font-size: 1.2rem;
	color: #fff;
	display: flex;
	align-items: center;
	gap: 10px;
}

.raditone-modal-header h3 svg {
	stroke: #3b5bdb;
}

.raditone-modal-close {
	background: none;
	border: none;
	color: #6c7a9a;
	cursor: pointer;
	transition: color 0.2s;
	line-height: 1;
}

.raditone-modal-close:hover {
	color: #fff;
}

.raditone-modal-body {
	padding: 24px;
}

.raditone-modal-body .form-group {
	margin-bottom: 18px;
}

.raditone-modal-body label {
	display: block;
	margin-bottom: 6px;
	font-weight: 500;
	color: #b0b8d1;
	font-size: 0.9rem;
}

.raditone-modal-body .required {
	color: #ff4757;
	margin-left: 2px;
}

.raditone-modal-body input[type="text"],
.raditone-modal-body input[type="email"],
.raditone-modal-body input[type="number"],
.raditone-modal-body textarea {
	width: 100%;
	padding: 10px 14px;
	background: rgba(255,255,255,0.06);
	border: 1px solid rgba(255,255,255,0.1);
	border-radius: 10px;
	color: #fff;
	font-size: 0.95rem;
	transition: border-color 0.2s;
	font-family: inherit;
}

.raditone-modal-body input:focus,
.raditone-modal-body textarea:focus {
	outline: none;
	border-color: #3b5bdb;
}

.raditone-modal-body textarea {
	resize: vertical;
	min-height: 100px;
}

.report-types-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px 16px;
	background: rgba(255,255,255,0.03);
	padding: 12px 16px;
	border-radius: 10px;
	border: 1px solid rgba(255,255,255,0.06);
}

.report-types-grid label {
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 400;
	font-size: 0.85rem;
	color: #b0b8d1;
	cursor: pointer;
}

.report-types-grid input[type="checkbox"] {
	width: 16px;
	height: 16px;
	accent-color: #3b5bdb;
	cursor: pointer;
}

.submit-report-btn,
.submit-lyrics-btn {
	width: 100%;
	padding: 12px;
	background: #3b5bdb;
	border: none;
	border-radius: 10px;
	color: #fff;
	font-size: 1rem;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.2s, transform 0.1s;
}

.submit-report-btn:hover,
.submit-lyrics-btn:hover {
	background: #2563eb;
}

.submit-report-btn:active,
.submit-lyrics-btn:active {
	transform: scale(0.97);
}

.submit-report-btn:disabled,
.submit-lyrics-btn:disabled {
	opacity: 0.7;
	cursor: not-allowed;
}

.form-message {
	margin: 12px 0;
	padding: 10px 14px;
	border-radius: 8px;
	font-size: 0.9rem;
}

.form-message .success-message {
	color: #2ecc71;
	background: rgba(46,204,113,0.1);
	padding: 10px 14px;
	border-radius: 8px;
}

.form-message .error-message {
	color: #ff4757;
	background: rgba(255,71,87,0.1);
	padding: 10px 14px;
	border-radius: 8px;
}

.error-message {
	color: #ff4757;
	font-size: 0.85rem;
	margin-top: 6px;
}

.raditone-captcha-container {
	background: rgba(255,255,255,0.04);
	padding: 14px 18px;
	border-radius: 10px;
	border: 1px solid rgba(255,255,255,0.06);
}

.raditone-captcha-container label {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 10px;
	font-weight: 500;
}

.number_captcha {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 1.3rem;
	font-weight: 600;
	color: #fff;
}

.number_captcha input {
	width: 80px !important;
	text-align: center;
	font-size: 1.2rem !important;
}

.number_captcha span {
	color: #b0b8d1;
}

.raditone-captcha-container small {
	display: block;
	margin-top: 8px;
	color: #6c7a9a;
	font-size: 0.8rem;
}

.captcha-loading {
	text-align: center;
	padding: 20px;
	color: #6c7a9a;
}

/* ====== مودال ویدیو ====== */
.video-modal {
	position: fixed;
	inset: 0;
	z-index: 999999;
	display: none;
	align-items: center;
	justify-content: center;
	background: rgba(0,0,0,0.85);
}

.video-modal[style*="display: flex"] {
	display: flex !important;
}

.video-modal-overlay {
	position: absolute;
	inset: 0;
	cursor: pointer;
}

.video-modal-container {
	position: relative;
	width: 90%;
	max-width: 900px;
	max-height: 90vh;
	background: #000;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 30px 60px rgba(0,0,0,0.8);
}

.video-modal-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 14px 20px;
	background: rgba(0,0,0,0.9);
	border-bottom: 1px solid rgba(255,255,255,0.08);
}

.video-modal-title {
	margin: 0;
	font-size: 1rem;
	color: #fff;
	display: flex;
	align-items: center;
	gap: 10px;
}

.video-modal-close {
	background: none;
	border: none;
	color: #6c7a9a;
	cursor: pointer;
	transition: color 0.2s;
}

.video-modal-close:hover {
	color: #fff;
}

.video-modal-body {
	padding: 20px;
	min-height: 200px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.video-loading, .video-error {
	text-align: center;
	color: #b0b8d1;
	padding: 40px 20px;
}

.video-loading svg, .video-error svg {
	width: 48px;
	height: 48px;
	stroke: #3b5bdb;
	margin-bottom: 16px;
}

.video-error button {
	margin-top: 16px;
	padding: 10px 24px;
	background: #3b5bdb;
	border: none;
	border-radius: 10px;
	color: #fff;
	cursor: pointer;
}

/* ====== استایل‌های دانلود ====== */
.raditone-downloads-wrapper {
	margin: 0 auto;
	direction: ltr;
}

.download-box {
	background: var(--bg-secondary, #f8fafc);
	border-radius: 20px;
	margin-bottom: 30px;
	overflow: hidden;
	border: 1px solid var(--border-primary, #e2e8f0);
	transition: all 0.3s ease;
}

.download-box:hover {
	border-color: var(--primary, #3b5bdb);
	box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
}

.box-header {
	display: flex;
	align-items: center;
	gap: 15px;
	padding: 18px 22px;
	background: var(--bg-tertiary, #f1f5f9);
	border-bottom: 2px solid var(--border-primary, #e2e8f0);
}

.box-icon {
	width: 48px;
	height: 48px;
	border-radius: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	color: #fff;
}

.box-icon svg {
	width: 24px;
	height: 24px;
	stroke: #fff;
}

.audio-icon {
	background: linear-gradient(-135deg, #3b5bdb, #2563eb);
}

.video-icon {
	background: linear-gradient(-135deg, #8b5cf6, #7c3aed);
}

.album-icon {
	background: linear-gradient(-135deg, #f59e0b, #d97706);
}

.box-title {
	flex: 1;
	display: flex;
	align-items: baseline;
	gap: 12px;
	flex-wrap: wrap;
}

.box-title h3 {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	color: var(--text-primary, #0f172a);
}

.format-count {
	font-size: 12px;
	padding: 4px 12px;
	background: rgba(59, 91, 219, 0.12);
	border-radius: 30px;
	color: var(--primary, #3b5bdb);
	font-weight: 500;
}

.download-list {
	padding: 12px;
}

.download-item {
	display: flex;
	align-items: center;
	gap: 15px;
	padding: 16px 20px;
	background: var(--bg-primary, #ffffff);
	border-radius: 16px;
	margin-bottom: 12px;
	text-decoration: none;
	transition: all 0.3s ease;
	position: relative;
	overflow: hidden;
	border: 1px solid var(--border-primary, #e2e8f0);
	cursor: pointer;
}

.download-item:last-child {
	margin-bottom: 0;
}

.download-item:hover {
	transform: translateX(8px);
	border-color: var(--primary, #3b5bdb);
	background: var(--bg-secondary, #f1f5f9);
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
}

.quality-badge {
	position: absolute;
	top: 0;
	left: 0;
	padding: 10px 5px;
	font-size: 11px;
	font-weight: 800;
	color: #fff;
	z-index: 2;
	border-radius: 0 0 14px 0;
	letter-spacing: 1px;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 28px;
	max-width: 80px;
	width: 100%;
	box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.2);
}

.badge-128 {
	background: linear-gradient(-135deg, #3b82f6, #1e40af);
}

.badge-320 {
	background: linear-gradient(-135deg, #8b5cf6, #6d28d9);
}

.badge-flac {
	background: linear-gradient(-135deg, #fbbf24, #d97706);
	color: #1a1a2e;
}

.badge-4k {
	background: linear-gradient(-135deg, #10b981, #047857);
}

.badge-1080 {
	background: linear-gradient(-135deg, #3b82f6, #1e40af);
}

.badge-720 {
	background: linear-gradient(-135deg, #06b6d4, #0e7490);
}

.item-icon {
	width: 52px;
	height: 52px;
	border-radius: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: all 0.3s ease;
	color: #fff;
}

.item-icon svg {
	width: 24px;
	height: 24px;
	stroke: #fff;
}

.download-item:hover .item-icon {
	transform: scale(1.05);
}

.raditone-gradient-primary {
	background: linear-gradient(-135deg, var(--primary), var(--primary-hover));
}

.raditone-gradient-secondary {
	background: linear-gradient(-135deg, var(--secondary), var(--secondary-hover));
}

.raditone-gradient-warning {
	background: linear-gradient(-135deg, var(--warning), var(--warning-hover));
}

.raditone-gradient-danger {
	background: linear-gradient(-135deg, var(--danger), var(--danger-hover));
}

.raditone-gradient-success {
	background: linear-gradient(-135deg, var(--success), var(--success-hover));
}

.raditone-gradient-info {
	background: linear-gradient(-135deg, var(--info, var(--primary)), var(--accent));
}

.item-info {
	flex: 1;
	min-width: 0;
}

.item-title {
	font-size: 15px;
	font-weight: 600;
	color: var(--text-primary, #0f172a);
	margin-bottom: 8px;
}

.item-meta {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

.item-meta span {
	font-size: 11px;
	padding: 4px 10px;
	border-radius: 20px;
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

.meta-quality {
	background: rgba(59, 91, 219, 0.12);
	color: var(--primary, #3b5bdb);
	font-weight: 500;
}

.meta-format {
	background: rgba(139, 92, 246, 0.12);
	color: #7c3aed;
}

.meta-size {
	background: var(--bg-tertiary, #f1f5f9);
	color: var(--text-secondary, #475569);
}

.item-action {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 24px;
	background: var(--primary, #3b5bdb);
	border-radius: 40px;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	transition: all 0.3s ease;
	flex-shrink: 0;
	box-shadow: 0 2px 8px rgba(59, 91, 219, 0.25);
}

.item-action svg {
	width: 18px;
	height: 18px;
	stroke: #fff;
	flex-shrink: 0;
}

.item-action svg:last-child {
	opacity: 0;
	transition: all 0.3s ease;
}

.download-item:hover .item-action {
	background: var(--primary-hover, #2563eb);
	gap: 15px;
	padding: 12px 28px;
	box-shadow: 0 4px 15px rgba(59, 91, 219, 0.35);
}

.download-item:hover .item-action svg:last-child {
	opacity: 1;
	transform: translateX(5px);
}

.empty-downloads {
	text-align: center;
	padding: 60px 30px;
	background: var(--bg-secondary, #f8fafc);
	border-radius: 24px;
	border: 1px solid var(--border-primary, #e2e8f0);
}

.empty-icon {
	width: 80px;
	height: 80px;
	margin: 0 auto 20px;
	background: var(--bg-tertiary, #f1f5f9);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.empty-icon svg {
	width: 40px;
	height: 40px;
	stroke: var(--text-tertiary, #94a3b8);
}

.empty-downloads h4 {
	margin: 0 0 10px;
	font-size: 20px;
	color: var(--text-primary, #0f172a);
}

.empty-downloads p {
	margin: 0;
	font-size: 14px;
	color: var(--text-secondary, #475569);
}

.empty-note {
	margin-top: 15px !important;
	font-size: 13px !important;
	color: var(--text-tertiary, #94a3b8) !important;
}

/* ====== استایل‌های متن ترانه ====== */
.raditone-lyrics-wrapper {
	margin: 0;
}

.raditone-lyrics-box {
	background: var(--bg-secondary, #f8fafc);
	border-radius: 24px;
	overflow: hidden;
	border: 1px solid var(--border-primary, #e2e8f0);
	transition: all 0.3s ease;
}

.raditone-lyrics-header {
	background: var(--bg-tertiary, #f1f5f9);
	padding: 18px 24px;
	border-bottom: 1px solid var(--border-primary, #e2e8f0);
}

.raditone-lyrics-header-content {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}

.raditone-lyrics-icon {
	width: 52px;
	height: 52px;
	background: linear-gradient(-135deg, #3b5bdb, #2563eb);
	border-radius: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.raditone-lyrics-icon svg {
	width: 24px;
	height: 24px;
	stroke: #fff;
}

.raditone-lyrics-info {
	flex: 1;
}

.raditone-lyrics-title {
	font-size: 1.1rem;
	font-weight: 800;
	color: var(--text-primary, #0f172a);
	display: flex;
	align-items: baseline;
	gap: 8px;
	flex-wrap: wrap;
}

.raditone-lyrics-artist {
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--text-tertiary, #94a3b8);
	background: var(--bg-primary, #ffffff);
	padding: 3px 10px;
	border-radius: 30px;
}

.raditone-lyrics-stats {
	font-size: 0.7rem;
	color: var(--text-tertiary, #94a3b8);
	margin-top: 4px;
	display: flex;
	align-items: center;
	gap: 5px;
}

.raditone-lyrics-stats svg {
	width: 14px;
	height: 14px;
	stroke: #3b5bdb;
}

.raditone-lyrics-buttons {
	display: flex;
	gap: 10px;
}

.raditone-lyrics-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 16px;
	background: var(--bg-primary, #ffffff);
	border: 1px solid var(--border-primary, #e2e8f0);
	border-radius: 40px;
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--text-primary, #0f172a);
	cursor: pointer;
	transition: all 0.3s ease;
}

.raditone-lyrics-btn svg {
	width: 16px;
	height: 16px;
	stroke: currentColor;
}

.raditone-lyrics-btn:hover {
	background: linear-gradient(-135deg, #3b5bdb, #2563eb);
	border-color: transparent;
	color: #fff;
	transform: translateY(-2px);
}

.raditone-lyrics-body {
	position: relative;
	max-height: 500px;
	overflow-y: auto;
	padding: 20px 24px;
	scroll-behavior: smooth;
}

.raditone-lyrics-body::-webkit-scrollbar {
	width: 5px;
}

.raditone-lyrics-body::-webkit-scrollbar-track {
	background: var(--bg-tertiary, #f1f5f9);
	border-radius: 10px;
}

.raditone-lyrics-body::-webkit-scrollbar-thumb {
	background: linear-gradient(-135deg, #3b5bdb, #2563eb);
	border-radius: 10px;
}

.raditone-lyrics-content {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.raditone-lyric-line {
	display: flex;
	align-items: baseline;
	gap: 12px;
	padding: 6px 0;
	border-radius: 12px;
	transition: all 0.2s ease;
}

.raditone-lyric-line:hover {
	background: rgba(59, 91, 219, 0.05);
	padding-left: 12px;
}

.raditone-line-num {
	width: 36px;
	flex-shrink: 0;
	font-size: 0.7rem;
	font-weight: 600;
	color: var(--text-tertiary, #94a3b8);
	opacity: 0.6;
	font-feature-settings: "tnum";
}

.raditone-lyric-line:hover .raditone-line-num {
	opacity: 1;
	color: #3b5bdb;
}

.raditone-line-text {
	flex: 1;
	font-size: 0.9rem;
	line-height: 1.8;
	color: var(--text-secondary, #475569);
	font-family: 'Vazir', 'Vazirmatn', 'IRANSans', sans-serif;
	letter-spacing: 0.2px;
}

.raditone-lyrics-ad {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 15px;
	margin: 18px 0;
	padding: 10px 20px;
	background: linear-gradient(-135deg, rgba(251, 191, 36, 0.08), rgba(245, 158, 11, 0.05));
	border-radius: 60px;
	border: 1px solid rgba(251, 191, 36, 0.25);
	box-shadow: 0 2px 10px rgba(251, 191, 36, 0.06);
}

.raditone-ad-line {
	flex: 1;
	height: 1px;
	background: linear-gradient(-90deg, transparent, rgba(251, 191, 36, 0.3), transparent);
}

.raditone-ad-text {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 0.75rem;
	font-weight: 600;
	color: #b45309;
	letter-spacing: 0.3px;
	white-space: nowrap;
}

.raditone-ad-text svg {
	width: 16px;
	height: 16px;
	stroke: #fbbf24;
	flex-shrink: 0;
}

.raditone-scroll-top {
	position: sticky;
	bottom: 20px;
	right: 100%;
	transform: translateX(50px);
	width: 42px;
	height: 42px;
	background: linear-gradient(-135deg, #3b5bdb, #2563eb);
	border: none;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s ease;
	box-shadow: 0 4px 12px rgba(59, 91, 219, 0.3);
	z-index: 10;
}

.raditone-scroll-top svg {
	width: 18px;
	height: 18px;
	stroke: #fff;
}

.raditone-scroll-top.show {
	opacity: 1;
	visibility: visible;
	transform: translateX(60px);
}

.raditone-scroll-top:hover {
	transform: translateX(60px) scale(1.08);
}

.raditone-lyrics-credit {
	padding: 12px 24px;
	background: rgba(59, 91, 219, 0.05);
	border-top: 1px solid var(--border-primary, #e2e8f0);
	font-size: 0.7rem;
	color: var(--text-tertiary, #94a3b8);
	display: flex;
	align-items: center;
	gap: 8px;
}

.raditone-lyrics-credit svg {
	width: 16px;
	height: 16px;
	stroke: #10b981;
}

/* ====== استایل‌های توضیحات ====== */
.raditone-description-content {
	margin: 0;
}

.raditone-empty-state {
	background: var(--bg-secondary, #f8fafc);
	border-radius: 24px;
	border: 1px solid var(--border-primary, #e2e8f0);
	text-align: center;
	padding: 50px 30px;
	margin: 0;
}

.raditone-empty-icon {
	width: 80px;
	height: 80px;
	background: linear-gradient(-135deg, rgba(59, 91, 219, 0.08), rgba(139, 92, 246, 0.04));
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 20px;
}

.raditone-empty-icon svg {
	width: 32px;
	height: 32px;
	stroke: #3b5bdb;
	opacity: 0.6;
}

.raditone-tags-section {
	margin-top: 24px;
	padding-top: 24px;
	border-top: 1px solid var(--border-primary, #e2e8f0);
}

.raditone-tags-header {
	display: flex;
	align-items: center;
	gap: 10px;
	font-weight: 600;
	color: var(--text-primary, #0f172a);
	font-size: 0.9rem;
	margin-bottom: 12px;
}

.raditone-tags-header svg {
	width: 18px;
	height: 18px;
	stroke: var(--primary, #3b5bdb);
}

.raditone-tags-count {
	font-size: 0.7rem;
	font-weight: 400;
	color: var(--text-tertiary, #94a3b8);
	background: var(--bg-tertiary, #f1f5f9);
	padding: 2px 10px;
	border-radius: 30px;
}

.raditone-tags-container {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.raditone-tag-item {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 5px 12px;
	background: var(--bg-tertiary, #f1f5f9);
	border-radius: 30px;
	font-size: 0.7rem;
	font-weight: 500;
	color: var(--text-secondary, #475569);
	text-decoration: none;
	transition: all 0.2s ease;
}

.raditone-tag-item:hover {
	background: var(--primary, #3b5bdb);
	color: #fff;
}

.raditone-tag-item svg {
	width: 12px;
	height: 12px;
	stroke: currentColor;
}

.raditone-tag-count {
	font-size: 0.6rem;
	background: rgba(0,0,0,0.08);
	padding: 1px 6px;
	border-radius: 20px;
}

.raditone-tag-item:hover .raditone-tag-count {
	background: rgba(255,255,255,0.2);
}

.raditone-show-more-tags {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 10px;
	padding: 6px 14px;
	background: none;
	border: 1px solid var(--border-primary, #e2e8f0);
	border-radius: 30px;
	font-size: 0.7rem;
	color: var(--text-secondary, #475569);
	cursor: pointer;
	transition: all 0.2s ease;
}

.raditone-show-more-tags:hover {
	background: var(--bg-tertiary, #f1f5f9);
}

.raditone-show-more-tags svg {
	width: 14px;
	height: 14px;
	stroke: currentColor;
	transition: transform 0.3s ease;
}

.raditone-show-more-tags.active svg {
	transform: rotate(-180deg);
}

.raditone-hidden-tags {
	display: none;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 10px;
}

.raditone-hidden-tags.show {
	display: flex;
}

.raditone-metadata-section {
	margin-top: 24px;
	padding-top: 24px;
	border-top: 1px solid var(--border-primary, #e2e8f0);
}

.raditone-metadata-header {
	display: flex;
	align-items: center;
	gap: 10px;
	font-weight: 600;
	color: var(--text-primary, #0f172a);
	font-size: 0.9rem;
	margin-bottom: 16px;
}

.raditone-metadata-header svg {
	width: 18px;
	height: 18px;
	stroke: var(--primary, #3b5bdb);
}

.raditone-metadata-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 12px;
}

.raditone-metadata-item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 16px;
	background: var(--bg-tertiary, #f1f5f9);
	border-radius: 14px;
	transition: all 0.2s ease;
}

.raditone-metadata-item:hover {
	background: var(--bg-secondary, #e2e8f0);
}

.raditone-metadata-icon {
	width: 36px;
	height: 36px;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	color: #fff;
}

.raditone-metadata-icon svg {
	width: 16px;
	height: 16px;
	stroke: #fff;
}

.raditone-icon-bg-purple {
	background: linear-gradient(-135deg, #8b5cf6, #7c3aed);
}

.raditone-icon-bg-primary {
	background: linear-gradient(-135deg, #3b5bdb, #2563eb);
}

.raditone-icon-bg-accent {
	background: linear-gradient(-135deg, #f59e0b, #d97706);
}

.raditone-icon-bg-secondary {
	background: linear-gradient(-135deg, #64748b, #475569);
}

.raditone-icon-bg-gold {
	background: linear-gradient(-135deg, #fbbf24, #f59e0b);
}

.raditone-icon-bg-success {
	background: linear-gradient(-135deg, #10b981, #059669);
}

.raditone-metadata-info {
	flex: 1;
}

.raditone-metadata-label {
	font-size: 0.65rem;
	font-weight: 500;
	color: var(--text-tertiary, #94a3b8);
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.raditone-metadata-value {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--text-primary, #0f172a);
}

.raditone-metadata-value a {
	color: var(--primary, #3b5bdb);
	text-decoration: none;
}

.raditone-metadata-value a:hover {
	text-decoration: underline;
}

.raditone-line-clamp-1 {
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ====== استایل‌های آلبوم ====== */
.raditone-album-tracks {
	margin: 0;
}

.raditone-tracks-header {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 18px 22px;
	background: var(--bg-tertiary, #f1f5f9);
	border-radius: 16px 16px 0 0;
	border-bottom: 1px solid var(--border-primary, #e2e8f0);
}

.raditone-header-icon {
	width: 44px;
	height: 44px;
	background: linear-gradient(-135deg, #3b5bdb, #2563eb);
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	color: #fff;
}

.raditone-header-icon svg {
	width: 22px;
	height: 22px;
	stroke: #fff;
}

.raditone-header-info {
	flex: 1;
}

.raditone-header-info h3 {
	margin: 0;
	font-size: 1rem;
	font-weight: 700;
	color: var(--text-primary, #0f172a);
}

.raditone-header-info p {
	margin: 0;
	font-size: 0.75rem;
	color: var(--text-tertiary, #94a3b8);
}

.raditone-header-actions {
	display: flex;
	gap: 10px;
}

.raditone-action-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 18px;
	background: var(--bg-primary, #ffffff);
	border: 1px solid var(--border-primary, #e2e8f0);
	border-radius: 40px;
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--text-primary, #0f172a);
	cursor: pointer;
	transition: all 0.3s ease;
}

.raditone-action-btn svg {
	width: 16px;
	height: 16px;
	stroke: currentColor;
}

.raditone-action-btn:hover {
	background: var(--primary, #3b5bdb);
	border-color: transparent;
	color: #fff;
	transform: translateY(-2px);
}

.raditone-tracks-list {
	padding: 12px;
}

.raditone-track-card {
	background: var(--bg-primary, #ffffff);
	border: 1px solid var(--border-primary, #e2e8f0);
	border-radius: 16px;
	padding: 14px 18px;
	margin-bottom: 12px;
	transition: all 0.3s ease;
	position: relative;
}

.raditone-track-card:last-child {
	margin-bottom: 0;
}

.raditone-track-card:hover {
	border-color: var(--primary, #3b5bdb);
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06);
}

.raditone-track-card.raditone-playing {
	border-color: var(--primary, #3b5bdb);
	background: rgba(59, 91, 219, 0.06);
	box-shadow: 0 0 0 2px rgba(59, 91, 219, 0.15);
}

.raditone-track-row {
	display: flex;
	align-items: center;
	gap: 16px;
}

.raditone-track-row-mobile {
	display: none;
}

.raditone-track-number {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
}

.raditone-number {
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--text-tertiary, #94a3b8);
	font-feature-settings: "tnum";
	min-width: 28px;
}

.raditone-play-btn {
	width: 32px;
	height: 32px;
	border: none;
	border-radius: 50%;
	background: var(--primary, #3b5bdb);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.3s ease;
}



.raditone-play-btn svg {
	width: 24px;
	height: 24px;
	fill: #fff;
}

.raditone-play-btn:hover {
	transform: scale(1.1);
	background: var(--primary-hover, #2563eb);
}

.raditone-track-info {
	flex: 1;
}

.raditone-track-title {
	margin: 0;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--text-primary, #0f172a);
}

.raditone-track-artist {
	font-size: 0.7rem;
	color: var(--text-tertiary, #94a3b8);
	display: flex;
	align-items: center;
	gap: 4px;
}

.raditone-track-artist svg {
	width: 12px;
	height: 12px;
	stroke: currentColor;
}

.raditone-track-actions {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-shrink: 0;
}

.raditone-action-icon {
	width: 32px;
	height: 32px;
	border: none;
	border-radius: 50%;
	background: var(--bg-tertiary, #f1f5f9);
	color: var(--text-secondary, #475569);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.3s ease;
}

.raditone-action-icon svg {
	width: 16px;
	height: 16px;
	stroke: currentColor;
}

.raditone-action-icon:hover {
	background: var(--primary, #3b5bdb);
	color: #fff;
	transform: scale(1.05);
}

.raditone-track-vote {
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px solid var(--border-primary, #e2e8f0);
	display: flex;
	justify-content: center;
}

/* ====== ریسپانسیو ====== */
@media (max-width: 768px) {
	.raditone-track-row {
		display: none;
	}

	.raditone-track-row-mobile {
		display: flex;
		flex-direction: column;
		gap: 8px;
	}

	.raditone-track-main-mobile {
		display: flex;
		align-items: center;
		gap: 12px;
		width: 100%;
	}

	.raditone-track-main-mobile .raditone-track-info {
		flex: 1;
	}

	.raditone-track-main-mobile .raditone-track-number {
		flex-shrink: 0;
	}

	.play-btn-mobile {
		flex-shrink: 0;
	}

	.raditone-play-btn-mobile {
		width: 36px;
		height: 36px;
		border: none;
		border-radius: 50%;
		background: var(--primary, #3b5bdb);
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		transition: all 0.3s ease;
	}

	.raditone-play-btn-mobile svg {
		width: 16px;
		height: 16px;
		fill: #fff;
	}

	.raditone-play-btn-mobile:hover {
		transform: scale(1.05);
		background: var(--primary-hover, #2563eb);
	}

	.raditone-track-actions {
		justify-content: flex-start;
		padding-left: 40px;
	}

	.raditone-track-card .raditone-play-btn {
		opacity: 1;
	}

	.raditone-tracks-header {
		flex-wrap: wrap;
		padding: 14px 16px;
	}

	.raditone-header-actions {
		width: 100%;
		justify-content: flex-start;
	}

	.raditone-metadata-grid {
		grid-template-columns: 1fr;
	}

	.report-types-grid {
		grid-template-columns: 1fr;
	}

	.raditone-modal-content {
		max-width: 100%;
		margin: 10px;
	}

	.raditone-modal-header h3 {
		font-size: 1rem;
	}

	.video-modal-container {
		width: 95%;
	}

	.download-item {
		flex-direction: column;
		align-items: stretch;
		text-align: center;
		padding: 20px 15px;
	}

	.item-icon {
		margin: 0 auto;
	}

	.item-info {
		text-align: center;
	}

	.item-meta {
		justify-content: center;
	}

	.item-action {
		justify-content: center;
		margin-top: 10px;
		width: 100%;
		padding: 14px 20px;
		font-size: 15px;
	}

	.item-action svg:last-child {
		opacity: 1;
	}

	.box-header {
		padding: 14px 18px;
	}

	.box-icon {
		width: 42px;
		height: 42px;
	}

	.box-icon svg {
		width: 20px;
		height: 20px;
	}

	.box-title h3 {
		font-size: 16px;
	}

	.quality-badge {
		padding: 8px 4px;
		min-width: 24px;
		font-size: 10px;
	}

	.raditone-lyrics-header {
		padding: 16px;
	}

	.raditone-lyrics-header-content {
		flex-direction: column;
		text-align: center;
	}

	.raditone-lyrics-icon {
		width: 44px;
		height: 44px;
	}

	.raditone-lyrics-icon svg {
		width: 20px;
		height: 20px;
	}

	.raditone-lyrics-title {
		justify-content: center;
	}

	.raditone-lyrics-buttons {
		width: 100%;
		justify-content: center;
	}

	.raditone-lyrics-body {
		padding: 16px;
	}

	.raditone-line-num {
		width: 30px;
		font-size: 0.65rem;
	}

	.raditone-line-text {
		font-size: 0.85rem;
	}

	.raditone-lyrics-ad {
		padding: 8px 12px;
		margin: 14px 0;
	}

	.raditone-ad-text {
		font-size: 0.65rem;
		white-space: normal;
		text-align: center;
		gap: 6px;
	}

	.raditone-ad-line {
		display: none;
	}

	.raditone-scroll-top {
		width: 38px;
		height: 38px;
	}

	.raditone-scroll-top.show {
		transform: translateX(45px);
	}
}

@media (max-width: 480px) {
	.item-title {
		font-size: 14px;
	}

	.item-meta span {
		font-size: 10px;
		padding: 3px 8px;
	}

	.quality-badge {
		padding: 6px 3px;
		min-width: 20px;
		font-size: 9px;
	}

	.raditone-lyrics-title {
		font-size: 0.95rem;
	}

	.raditone-line-text {
		font-size: 0.8rem;
		line-height: 1.6;
	}

	.raditone-lyrics-btn span {
		display: none;
	}

	.raditone-lyrics-btn {
		padding: 8px 12px;
	}

	.raditone-track-title {
		font-size: 0.8rem;
	}
}

/* ===================================================== */
/* Swiper Customization
/* ===================================================== */
.section--three-columns .swiper {
	margin-left: 0;
	margin-right: 0;
}

.swiper-button-prev {
	border-top-left-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
	left: 0 !important;
}

.swiper-button-prev,.swiper-button-next {
	background-color: var(--bg-primary);
	padding: 0 10px !important;
}

.swiper-button-next {
	border-top-right-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
	right: 0 !important;
}

.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after,.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after {
	font-size: 12px;
	color: var(--text-primary) !important;
}

/* ===================================================== */
/* Title Footer
/* ===================================================== */
.title-footer {
	background: linear-gradient(90deg, #000, transparent);
	padding: 5px 5px 10px 10px;
}

.title-footer h3, 
.title-footer p {
	color: var(--text-dark-bg) !important;
}

.footer-titile {
	text-align: center;
	display: flex;
	align-items: center;
	flex-direction: column;
}

/* ===================================================== */
/* Buttons
/* ===================================================== */
.btn-play {
	background: var(--bg-primary);
	color: var(--text-primary);
}

.raditone-playlist-button-wrapper button {
	font-size: 12px;
	padding: 5px;
	color: var(--text-primary);
}

/* ===================================================== */
/* Signer Header & Navigation
/* ===================================================== */
.signer-header {
	flex-direction: row;
	align-content: center;
	justify-content: space-between;
}

.signer-header,.nav-links {
	display: flex;
	align-items: center;
}

.nav-links {
	justify-content: center;
	gap: 5px;
}

.current .raditone-archive-page-number {
	background-color: var(--primary);
	color: white;
}

.raditone-modal-overlay {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,0.75);
	z-index: 99999;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.raditone-modal-overlay[style*="display: flex"] {
	display: flex !important;
}

.raditone-modal-content {
	background: var(--bg-primary);
	border-radius: 16px;
	max-width: 600px;
	width: 100%;
	max-height: 90vh;
	overflow-y: auto;
	box-shadow: 0 30px 60px rgba(0,0,0,0.6);
	animation: modalSlideIn 0.3s ease;
}

@keyframes modalSlideIn {
	from {
		opacity: 0;
		transform: translateY(-30px) scale(0.95);
	}

	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

.raditone-modal-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 18px 24px;
	border-bottom: 1px solid rgba(255,255,255,0.08);
	background: rgba(255,255,255,0.03);
	border-radius: 16px 16px 0 0;
}

.raditone-modal-header h3 {
	margin: 0;
	font-size: 1.2rem;
	color: #fff;
	display: flex;
	align-items: center;
	gap: 10px;
}

.raditone-modal-header h3 svg {
	stroke: var(--bg-primary);
}

.raditone-modal-close {
	background: none;
	border: none;
	color: #fff;
	cursor: pointer;
	transition: color 0.2s;
	line-height: 1;
}

.raditone-modal-close:hover {
	color: #fff;
}

.raditone-modal-body {
	padding: 24px;
}

.raditone-modal-body .form-group {
	margin-bottom: 18px;
}

.raditone-modal-body label {
	display: block;
	margin-bottom: 6px;
	font-weight: 500;
	color: #b0b8d1;
	font-size: 0.9rem;
}

.raditone-modal-body .required {
	color: #ff4757;
	margin-left: 2px;
}

.raditone-modal-body input[type="text"],
.raditone-modal-body input[type="email"],
.raditone-modal-body input[type="number"],
.raditone-modal-body textarea {
	width: 100%;
	padding: 10px 14px;
	background: rgba(255,255,255,0.06);
	border: 1px solid rgba(255,255,255,0.1);
	border-radius: 10px;
	color: #fff;
	font-size: 0.95rem;
	transition: border-color 0.2s;
	font-family: inherit;
}

.raditone-modal-body input:focus,
.raditone-modal-body textarea:focus {
	outline: none;
	border-color: var(--primary);
}

.raditone-modal-body textarea {
	resize: vertical;
	min-height: 100px;
}

.report-types-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px 16px;
	background: rgba(255,255,255,0.03);
	padding: 12px 16px;
	border-radius: 10px;
	border: 1px solid rgba(255,255,255,0.06);
}

.report-types-grid label {
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 400;
	font-size: 0.85rem;
	color: #b0b8d1;
	cursor: pointer;
}

.report-types-grid input[type="checkbox"] {
	width: 16px;
	height: 16px;
	accent-color: var(--primary);
	cursor: pointer;
}

.submit-report-btn,
.submit-lyrics-btn {
	width: 100%;
	padding: 12px;
	background: var(--primary);
	border: none;
	border-radius: 10px;
	color: #fff;
	font-size: 1rem;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.2s, transform 0.1s;
}

.submit-report-btn:hover,
.submit-lyrics-btn:hover {
	background: var(--primary);
}

.submit-report-btn:active,
.submit-lyrics-btn:active {
	transform: scale(0.97);
}

.submit-report-btn:disabled,
.submit-lyrics-btn:disabled {
	opacity: 0.7;
	cursor: not-allowed;
}

.form-message {
	margin: 12px 0;
	padding: 10px 14px;
	border-radius: 8px;
	font-size: 0.9rem;
}

.form-message .success-message {
	color: #2ecc71;
	background: rgba(46,204,113,0.1);
	padding: 10px 14px;
	border-radius: 8px;
}

.form-message .error-message {
	color: #ff4757;
	background: rgba(255,71,87,0.1);
	padding: 10px 14px;
	border-radius: 8px;
}

.error-message {
	color: #ff4757;
	font-size: 0.85rem;
	margin-top: 6px;
}

.raditone-captcha-container {
	background: rgba(255,255,255,0.04);
	padding: 14px 18px;
	border-radius: 10px;
	border: 1px solid rgba(255,255,255,0.06);
}

.raditone-captcha-container label {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 10px;
	font-weight: 500;
}

.number_captcha {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 1.3rem;
	font-weight: 600;
	color: #fff;
}

.number_captcha input {
	width: 80px !important;
	text-align: center;
	font-size: 1.2rem !important;
}

.number_captcha span {
	color: #b0b8d1;
}

.raditone-captcha-container small {
	display: block;
	margin-top: 8px;
	color: #6c7a9a;
	font-size: 0.8rem;
}

.captcha-loading {
	text-align: center;
	padding: 20px;
	color: #6c7a9a;
}

.video-modal {
	position: fixed;
	inset: 0;
	z-index: 999999;
	display: none;
	align-items: center;
	justify-content: center;
	background: rgba(0,0,0,0.85);
}

.video-modal[style*="display: flex"] {
	display: flex !important;
}

.video-modal-overlay {
	position: absolute;
	inset: 0;
	cursor: pointer;
}

.video-modal-container {
	position: relative;
	width: 90%;
	max-width: 900px;
	max-height: 90vh;
	background: #000;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 30px 60px rgba(0,0,0,0.8);
}

.video-modal-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 14px 20px;
	background: rgba(0,0,0,0.9);
	border-bottom: 1px solid rgba(255,255,255,0.08);
}

.video-modal-title {
	margin: 0;
	font-size: 1rem;
	color: #fff;
	display: flex;
	align-items: center;
	gap: 10px;
}

.video-modal-close {
	background: none;
	border: none;
	color: #6c7a9a;
	cursor: pointer;
	transition: color 0.2s;
}

.video-modal-close:hover {
	color: #fff;
}

.video-modal-body {
	padding: 20px;
	min-height: 200px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.video-loading, .video-error {
	text-align: center;
	color: #b0b8d1;
	padding: 40px 20px;
}

.video-loading svg, .video-error svg {
	width: 48px;
	height: 48px;
	stroke: #3b5bdb;
	margin-bottom: 16px;
}

.video-error button {
	margin-top: 16px;
	padding: 10px 24px;
	background: #3b5bdb;
	border: none;
	border-radius: 10px;
	color: #fff;
	cursor: pointer;
}

@keyframes modalFadeOut {
	from {
		opacity: 1;
	}

	to {
		opacity: 0;
	}
}

@media (max-width: 576px) {
	.raditone-modal-content {
		max-width: 100%;
		margin: 10px;
	}

	.report-types-grid {
		grid-template-columns: 1fr;
	}

	.raditone-modal-header h3 {
		font-size: 1rem;
	}

	.video-modal-container {
		width: 95%;
	}
}

/* ===================================================== */
/* Archive Section General
/* ===================================================== */

.main-archive,.section-archive {
	background: var(--bg-primary);
}

.section-archive {
	border: 1px solid var(--border-primary);
}

.section-archive h1,.box {
	color: var(--text-primary);
}

.box {
	background: var(--bg-primary);
	border: 1px solid var(--border-primary);
	text-align: center;
	border-radius: 16px;
	padding: 1rem;
}

.box-2 {
	color: var(--text-secondary);
	border: 1px solid var(--border-secondary);
}

.box-2,.box i {
	background: var(--bg-secondary);
}

.box i {
	padding: 12px;
	border-radius: 50%;
	width: 48px !important;
	height: 48px !important;
	font-size: 24px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.box .flex {
	justify-content: space-evenly;
}

.section-other {
	background: var(--bg-tertiary);
	border: 1px solid var(--border-secondary);
}

.content-center {
	justify-content: space-evenly;
}

/* ===================================================== */
/* Text Utilities
/* ===================================================== */
.line-clamp-2 {
	-webkit-line-clamp: 2;
}

.line-clamp-2,.line-clamp-1 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.line-clamp-1 {
	-webkit-line-clamp: 1;
}

.raditone-player-text {
	font-family: var(--font-iranyekan);
}

/* ===================================================== */
/* Backdrop Utilities
/* ===================================================== */
.backdrop-blur-sm {
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}

.backdrop-blur-md {
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}

/* ===================================================== */
/* Shadow Utilities
/* ===================================================== */
.shadow-purple-500\/50 {
	box-shadow: 0 10px 40px rgba(168, 85, 247, 0.3);
}

.hover\:shadow-purple-500\/50:hover {
	box-shadow: 0 20px 60px rgba(168, 85, 247, 0.4);
}

/* ===================================================== */
/* Scrollbar Utilities
/* ===================================================== */
.scrollbar-thin::-webkit-scrollbar {
	height: 6px;
	width: 6px;
}

.scrollbar-thin::-webkit-scrollbar-track {
	background: var(--bg-tertiary);
	border-radius: 4px;
}

.scrollbar-thin::-webkit-scrollbar-thumb {
	background: var(--primary);
	border-radius: 4px;
}

.scrollbar-thin::-webkit-scrollbar-thumb:hover {
	background: var(--primary-hover);
}

/* ===================================================== */
/* Miscellaneous
/* ===================================================== */
[itemscope] {
	position: relative;
}

.txt-count {
	position: absolute;
	background: var(--danger);
	color: white;
	padding: 2px 6px;
	border-radius: 12px;
	font-size: 0.7rem;
}

tr {
	transition: all 0.3s ease;
}

tr:hover {
	transform: translateX(4px);
	box-shadow: var(--shadow);
}

/* ===================================================== */
/* RTL Specific Adjustments
/* ===================================================== */
[dir="ltr"] .owl-carousel .owl-nav button.owl-prev {
	margin-left: 0;
	margin-right: -60px;
}

[dir="ltr"] .owl-carousel .owl-nav button.owl-next {
	margin-right: 0;
	margin-left: -60px;
}

[dir="ltr"] .owl-carousel .owl-nav {
	flex-direction: row-reverse;
}

[dir="ltr"] .single-item__rate svg {
	margin-right: 0;
	margin-left: 5px;
}

[dir="ltr"] .single-item__cover {
	margin: 0 0 0 15px;
}

[dir="ltr"] .single-item__time {
	margin-left: 0;
	margin-right: 15px;
}

[dir="ltr"] .main__title h2 svg {
	margin-right: 0;
	margin-left: 10px;
}

[dir="ltr"] .raditon-player__progress-fill,
[dir="ltr"] .raditon-player__volume-level {
	right: auto;
	left: 0;
}

[dir="ltr"] .raditon-fullscreen-controls {
	left: auto;
	right: 1.5rem;
}

[dir="ltr"] .raditon-player--fullscreen .raditon-player__volume {
	left: auto;
	right: 2rem;
}

[dir="ltr"] .raditone-archive-article-number {
	left: auto;
	right: 0.75rem;
}

/* ===================================================== */
/* Utility Classes
/* ===================================================== */
.raditone-hidden {
	display: none !important;
}

.raditone-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border-width: 0;
}


/* ===================================================== */
/* Footer - فوتر سایت
/* ===================================================== */
.site-footer {
	background-color: var(--bg-secondary);
	border-top: 1px solid var(--border-primary);
	padding: 3rem 0 1.5rem;
	margin-top: 4rem;
}

.footer-widgets {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 2rem;
	margin-bottom: 2rem;
}

.footer-widget-area {
	color: var(--text-secondary);
}

.footer-widget-area h3 {
	color: var(--text-primary);
	margin-bottom: 1rem;
	font-size: 1.125rem;
	font-weight: 700;
	position: relative;
	display: inline-block;
	padding-bottom: 0.5rem;
}

.footer-widget-area h3::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 40px;
	height: 2px;
	background: linear-gradient(-90deg, var(--primary), var(--accent));
	border-radius: 2px;
}

.footer-widget-area ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.footer-widget-area ul li {
	margin-bottom: 0.75rem;
}

.footer-widget-area ul li a {
	color: var(--text-secondary);
	text-decoration: none;
	transition: all 0.3s ease;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

.footer-widget-area ul li a:hover {
	color: var(--primary);
	transform: translateX(4px);
}

.footer-widget-area p {
	line-height: 1.6;
	margin-bottom: 1rem;
}

/* فوتر سوشال مدیا */
.footer-social {
	text-align: center;
	margin-bottom: 1.5rem;
}

.footer-social-title {
	color: var(--text-primary);
	margin-bottom: 1rem;
	font-size: 1.125rem;
	font-weight: 700;
}

.social-icons {
	display: flex;
	justify-content: center;
	gap: 1rem;
	flex-wrap: wrap;
}

.social-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: var(--bg-primary);
	border: 1px solid var(--border-primary);
	border-radius: 50%;
	color: var(--text-secondary);
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	text-decoration: none;
}

.social-icon:hover {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	color: white;
	border-color: transparent;
	transform: translateY(-4px);
	box-shadow: 0 8px 20px rgba(var(--primary-rgb), 0.3);
}

.social-icon svg {
	width: 20px;
	height: 20px;
	fill: currentColor;
}

/* بخش پایین فوتر */
.footer-bottom {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--border-primary);
}

@media (min-width: 768px) {
	.footer-bottom {
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}
}

.copyright {
	color: var(--text-tertiary);
	font-size: 0.875rem;
	text-align: center;
}

.copyright a {
	color: var(--primary);
	text-decoration: none;
	transition: color 0.3s ease;
}

.copyright a:hover {
	color: var(--primary-hover);
	text-decoration: underline;
}

.footer-links {
	display: flex;
	gap: 1.5rem;
	flex-wrap: wrap;
	justify-content: center;
}

.footer-links a {
	color: var(--text-secondary);
	text-decoration: none;
	font-size: 0.875rem;
	transition: all 0.3s ease;
	position: relative;
}

.footer-links a::after {
	content: '';
	position: absolute;
	bottom: -2px;
	right: 0;
	width: 0;
	height: 1px;
	background: var(--primary);
	transition: width 0.3s ease;
}

.footer-links a:hover {
	color: var(--primary);
}

.footer-links a:hover::after {
	width: 100%;
}

/* RTL فوتر */
[dir="ltr"] .footer-links a::after {
	right: auto;
	left: 0;
}

[dir="ltr"] .footer-widget-area ul li a:hover {
	transform: translateX(-4px);
}

/* ===================================================== */
/* Back to Top - دکمه بازگشت به بالا
/* ===================================================== */
.back-to-top {
	position: fixed;
	bottom: 2rem;
	right: 2rem;
	width: 50px;
	height: 50px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	color: white;
	border: none;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 4px 15px rgba(var(--primary-rgb), 0.3);
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	opacity: 0;
	visibility: hidden;
	z-index: 998;
}

.back-to-top.visible {
	opacity: 1;
	visibility: visible;
}

.back-to-top:hover {
	transform: translateY(-4px) scale(1.05);
	box-shadow: 0 8px 25px rgba(var(--primary-rgb), 0.4);
}

.back-to-top:active {
	transform: translateY(0) scale(0.95);
}

.back-to-top svg {
	width: 22px;
	height: 22px;
	fill: currentColor;
}

/* RTL دکمه بازگشت به بالا */
[dir="ltr"] .back-to-top {
	right: auto;
	left: 2rem;
}

@media (max-width: 768px) {
	.back-to-top {
		bottom: 1.5rem;
		right: 1.5rem;
		width: 45px;
		height: 45px;
	}

	[dir="ltr"] .back-to-top {
		right: auto;
		left: 1.5rem;
	}
}

/* ===================================================== */
/* Drawer - دریورها (مودال از پایین)
/* ===================================================== */
.drawer {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	z-index: 1050;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	visibility: hidden;
	pointer-events: none;
}

.drawer.active {
	visibility: visible;
	pointer-events: auto;
}

.drawer-backdrop {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.6);
	backdrop-filter: blur(8px);
	opacity: 0;
	transition: opacity 0.3s ease;
}

.drawer.active .drawer-backdrop {
	opacity: 1;
}

.drawer-content {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 600px;
	max-height: 85vh;
	background: var(--bg-primary);
	border-radius: 28px 28px 0 0;
	overflow: hidden;
	transform: translateY(100%);
	transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	box-shadow: var(--shadow-2xl);
	border-top: 1px solid var(--glass-border);
}

.drawer.active .drawer-content {
	transform: translateY(0);
}

.drawer-content > div {
	padding: 1.5rem;
	max-height: calc(85vh - 3rem);
	overflow-y: auto;
}

/* هدر دریور */
.drawer-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1rem 1.5rem;
	border-bottom: 1px solid var(--border-primary);
	background: var(--bg-primary);
	position: sticky;
	top: 0;
	z-index: 10;
}

.drawer-header h3 {
	margin: 0;
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--text-primary);
}

.drawer-close {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	color: var(--text-secondary);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
}

.drawer-close:hover {
	background: var(--danger);
	color: white;
	border-color: transparent;
	transform: rotate(-90deg);
}

/* RTL دریور */
[dir="ltr"] .drawer-content {
	border-radius: 28px 28px 0 0;
}

@media (max-width: 768px) {
	.drawer-content {
		max-width: 100%;
		max-height: 90vh;
	}

	.drawer-content > div {
		max-height: calc(90vh - 3rem);
		padding: 1rem;
	}
}

/* ===================================================== */
/* Bottom Player - پلیر پایین صفحه
/* ===================================================== */
#bottom-player {
	position: fixed;
	bottom: 0;
	right: 0;
	left: 0;
	background: var(--glass);
	backdrop-filter: blur(20px);
	border-top: 1px solid var(--glass-border);
	padding: 0.75rem 1rem;
	transform: translateY(100%);
	transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	z-index: 1000;
	box-shadow: var(--shadow-lg);
}

#bottom-player:not(.hidden) {
	transform: translateY(0);
}

/* ===================================================== */
/* Play States - حالت‌های پخش
/* ===================================================== */
.play-state {
	background: linear-gradient(-135deg, var(--success), #059669) !important;
	color: white !important;
}

.play-state:hover {
	filter: brightness(1.05);
	transform: scale(1.02);
}

.pause-state {
	background: linear-gradient(-135deg, var(--danger), #dc2626) !important;
	color: white !important;
}

.pause-state:hover {
	filter: brightness(1.05);
	transform: scale(1.02);
}

/* ===================================================== */
/* Live Search - جستجوی زنده
/* ===================================================== */

/* نتایج جستجو - دسکتاپ */
.search-results-dropdown {
	background: var(--search-bg);
	border: 1px solid var(--search-border);
	border-radius: 16px;
	box-shadow: var(--search-shadow);
}

.results-header {
	border-bottom: 1px solid var(--search-border);
	color: var(--search-text);
}

.results-title {
	color: var(--search-text);
}

.results-count {
	color: var(--search-muted-text);
	background: var(--search-muted);
}

/* آیتم‌های نتیجه */
.result-item {
	background: var(--search-card);
	border: 1px solid var(--search-card-border);
	transition: all var(--transition-fast);
}

.result-item:hover {
	transform: translateY(-2px);
	box-shadow: var(--search-shadow-hover);
	border-color: var(--search-primary);
}

.result-title {
	color: var(--search-text);
}

.result-subtitle {
	color: var(--search-muted-text);
}

.result-type {
	background: var(--search-muted);
	color: var(--search-muted-text);
}

/* دسته‌بندی نتایج */
.search-section {
	border-bottom: 1px solid var(--border-primary);
}

.search-section-header {
	border-bottom: 2px solid rgba(var(--primary-rgb), 0.3);
}

.section-title {
	color: var(--text-primary);
}

.section-count {
	background: var(--glass);
	color: var(--text-tertiary);
}

/* متن ترانه در نتایج */
.result-excerpt {
	color: var(--text-tertiary);
}

.result-excerpt .search-highlight {
	background: rgba(251, 191, 36, 0.2);
	color: var(--gold);
}

/* هایلایت متن جستجو (فقط در متن ترانه) */
.search-highlight {
	background: linear-gradient(-120deg, var(--gold) 0%, #f59e0b 100%);
	color: #000;
	padding: 0 3px;
	border-radius: 4px;
	font-weight: 500;
}

/* لودینگ */
.search-loading {
	color: var(--text-secondary);
}

.loading-spinner {
	border: 3px solid var(--border-primary);
	border-top-color: var(--primary);
}

/* دکمه مشاهده همه - موبایل */
.view-all-mobile {
	background: rgba(var(--primary-rgb), 0.1);
	color: var(--primary);
}

.view-all-mobile:hover {
	background: rgba(var(--primary-rgb), 0.2);
}

/* فیلدهای جستجو */
.search-input-field {
	background: var(--search-bg);
    /* border: 1px solid var(--search-border); */
	color: var(--search-text);
}

.search-input-field::placeholder {
	color: var(--search-placeholder);
}

.search-input-field:focus {
	border-color: var(--search-primary);
	box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.1);
}

/* فیلترها */
.inline-filter-select,
.mobile-filter-select {
	background: var(--filter-bg);
	border: 1px solid var(--filter-border);
	color: var(--filter-text);
}

/* مودال موبایل */
.mobile-search-panel {
	background: var(--bg-primary);
}

.mobile-search-input {
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	color: var(--text-primary);
}

.mobile-search-input::placeholder {
	color: var(--text-tertiary);
}

.panel-title {
	color: var(--text-primary);
}

/* پیشنهادات */
.suggestion-chip {
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	color: var(--text-secondary);
}

.suggestion-chip:hover {
	background: var(--primary-light);
	border-color: var(--primary);
	color: var(--primary);
}

/* حالت خالی */
.empty-state-icon {
	color: var(--text-tertiary);
}

.empty-state-title {
	color: var(--text-primary);
}

.empty-state-description {
	color: var(--text-tertiary);
}

/* خطا */
.search-error {
	color: var(--danger);
}

/* آیکون‌ها */
.voice-icon {
	stroke: var(--icon-color);
}

.voice-search-btn:hover .voice-icon {
	stroke: var(--icon-hover);
}

/* انیمیشن‌ها */
@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(10px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.result-item {
	animation: fadeInUp 0.3s ease forwards;
	opacity: 0;
}

@keyframes pulse {
	0%, 100% {
		transform: scale(1);
		opacity: 1;
	}

	50% {
		transform: scale(1.2);
		opacity: 0.7;
	}
}

.pulse-animation {
	width: 20px;
	height: 20px;
	background: var(--danger);
	border-radius: 50%;
	animation: pulse 1.5s ease-in-out infinite;
}

#header-search-results {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	left: 0;
	background: var(--glass);
	backdrop-filter: blur(16px);
	border: 1px solid var(--glass-border);
	border-radius: 20px;
	box-shadow: var(--shadow-xl);
	max-height: 400px;
	overflow-y: auto;
	z-index: 1001;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-10px);
	transition: all 0.3s ease;
}

#header-search-results.active {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* استایل آیتم‌های جستجو */
.search-result-item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 16px;
	border-bottom: 1px solid var(--glass-border);
	transition: all 0.2s ease;
	text-decoration: none;
	color: var(--text-primary);
}

.search-result-item:hover {
	background: var(--primary-light);
	transform: translateX(-4px);
}

.search-result-item img {
	width: 48px;
	height: 48px;
	border-radius: 10px;
	object-fit: cover;
}

.search-result-info h4 {
	margin: 0 0 4px 0;
	font-size: 14px;
	font-weight: 600;
}

.search-result-info p {
	margin: 0;
	font-size: 12px;
	color: var(--text-tertiary);
}

/* RTL جستجو */
[dir="ltr"] .search-result-item:hover {
	transform: translateX(4px);
}

/* استایل‌های دسته‌بندی نتایج */
.search-section {
	margin-bottom: 20px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	padding-bottom: 16px;
}

.search-section:last-child {
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 0;
}

.search-section-header {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
	padding: 0 8px 8px 8px;
	border-bottom: 2px solid rgba(59, 130, 246, 0.3);
}

.section-icon {
	font-size: 18px;
}

.section-title {
	font-size: 14px;
	font-weight: 600;
	margin: 0;
}

.section-count {
	font-size: 11px;
	color: #9ca3af;
	background: rgba(255, 255, 255, 0.1);
	padding: 2px 8px;
	border-radius: 20px;
}

.search-section-content {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

/* استایل متن ترانه در نتایج */
.result-excerpt {
	font-size: 12px;
	color: #9ca3af;
	margin-top: 4px;
	line-height: 1.5;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.result-excerpt .search-highlight {
	background: rgba(251, 191, 36, 0.2);
	color: #fbbf24;
	padding: 0 2px;
	border-radius: 3px;
}

/* هایلایت متن */
.search-highlight {
	background: linear-gradient(-120deg, #fbbf24 0%, #f59e0b 100%);
	color: #000;
	padding: 0 3px;
	border-radius: 4px;
	font-weight: 500;
}

/* ===================================================== */
/* Responsive Footer & Components
/* ===================================================== */
@media (max-width: 768px) {
	.site-footer {
		padding: 2rem 0 1rem;
		margin-top: 2rem;
	}

	.footer-widgets {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	.footer-bottom {
		flex-direction: column;
		text-align: center;
		gap: 0.75rem;
	}

	.footer-links {
		justify-content: center;
		gap: 1rem;
	}

	#header-search-results {
		max-height: 300px;
	}

	.search-result-item {
		padding: 10px 12px;
	}
}

/* ===================================================== */
/* Dark Mode - حالت تاریک برای فوتر و کامپوننت‌ها
/* ===================================================== */
/* Dark mode styles removed - only light mode */

/* ===================================================== */
/* Accessibility - دسترسی‌پذیری
/* ===================================================== */
@media (prefers-reduced-motion: reduce) {
	.back-to-top,
    .social-icon,
    #bottom-player,
    .drawer-content,
    .drawer-backdrop,
    .footer-links a::after,
    .search-result-item {
		transition: none !important;
		animation: none !important;
	}

	.back-to-top:hover {
		transform: none;
	}
}

:focus-visible {
	outline: 2px solid var(--primary);
	outline-offset: 2px;
	border-radius: 4px;
}

/* اسکرول بار برای دریور و جستجو */
.drawer-content > div::-webkit-scrollbar,
#header-search-results::-webkit-scrollbar {
	width: 6px;
}

.drawer-content > div::-webkit-scrollbar-track,
#header-search-results::-webkit-scrollbar-track {
	background: var(--bg-secondary);
	border-radius: 3px;
}

.drawer-content > div::-webkit-scrollbar-thumb,
#header-search-results::-webkit-scrollbar-thumb {
	background: var(--primary);
	border-radius: 3px;
}

.drawer-content > div::-webkit-scrollbar-thumb:hover,
#header-search-results::-webkit-scrollbar-thumb:hover {
	background: var(--primary-hover);
}

/* ===================================================== */
/* Print - حالت چاپ
/* ===================================================== */
@media print {
	.site-footer,
    .back-to-top,
    #bottom-player,
    .drawer,
    .footer-social,
    .back-to-top {
		display: none !important;
	}

	.footer-widget-area h3::after {
		display: none;
	}
}

/* ===================================================== */
/* Newsletter Form - فرم خبرنامه در فوتر (اختیاری)
/* ===================================================== */
.footer-newsletter {
	margin-top: 1rem;
}

.footer-newsletter .newsletter-form {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.footer-newsletter input {
	width: 100%;
	padding: 12px 16px;
	border: 1px solid var(--border-primary);
	border-radius: 12px;
	background: var(--bg-primary);
	color: var(--text-primary);
	font-family: inherit;
	transition: all 0.3s ease;
}

.footer-newsletter input:focus {
	outline: none;
	border-color: var(--primary);
	box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.1);
}

.footer-newsletter button {
	padding: 12px 20px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	color: white;
	border: none;
	border-radius: 12px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.3s ease;
}

.footer-newsletter button:hover {
	transform: translateY(-2px);
	filter: brightness(1.05);
}

/* ===================================================== */
/* Footer Widgets Additional Styles
/* ===================================================== */
.footer-widget-area .tagcloud {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 0.5rem;
}

.footer-widget-area .tagcloud a {
	display: inline-block;
	padding: 4px 12px;
	background: var(--bg-primary);
	border: 1px solid var(--border-primary);
	border-radius: 20px;
	font-size: 0.75rem;
	color: var(--text-secondary);
	text-decoration: none;
	transition: all 0.3s ease;
}

.footer-widget-area .tagcloud a:hover {
	background: var(--primary);
	color: white;
	border-color: transparent;
	transform: translateY(-2px);
}

/* RTL تگ کلود */
[dir="ltr"] .footer-widget-area .tagcloud a {
	margin-right: 0;
	margin-left: 0.5rem;
}


/* ===================================================== */
/* Content Styles - استایل‌های محتوای اصلی
/* ===================================================== */
.raditone-content {
	line-height: 1.7;
	color: var(--text-primary);
	word-wrap: break-word;
}

.raditone-content p {
	margin-bottom: 1.25rem;
}

.raditone-content h2,
.raditone-content h3,
.raditone-content h4,
.raditone-content h5,
.raditone-content h6 {
	font-weight: 700;
	margin-top: 1.75rem;
	margin-bottom: 1rem;
	color: var(--text-primary);
	line-height: 1.3;
}

.raditone-content h2 {
	font-size: 1.75rem;
	border-bottom: 2px solid var(--border-primary);
	padding-bottom: 0.6rem;
}

.raditone-content h3 {
	font-size: 1.5rem;
}

.raditone-content h4 {
	font-size: 1.25rem;
}

.raditone-content h5 {
	font-size: 1.1rem;
}

.raditone-content h6 {
	font-size: 1rem;
	color: var(--text-secondary);
}

/* لیست‌ها */
.raditone-content ul,
.raditone-content ol {
	padding-left: 1.75rem;
	margin-bottom: 1.25rem;
}

.raditone-content li {
	margin-bottom: 0.5rem;
}

.raditone-content ul {
	list-style-type: disc;
}

.raditone-content ol {
	list-style-type: decimal;
}

.raditone-content ul ul,
.raditone-content ol ul,
.raditone-content ul ol,
.raditone-content ol ol {
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
}

/* بلوک نقل قول */
.raditone-content blockquote {
	border-left: 4px solid var(--primary);
	padding: 1rem 1.5rem;
	margin: 1.75rem 0;
	background: var(--bg-secondary);
	border-radius: 16px;
	font-style: italic;
	color: var(--text-secondary);
	position: relative;
}

.raditone-content blockquote p {
	margin-bottom: 0;
}

.raditone-content blockquote::before {
	content: '"';
	font-size: 3rem;
	position: absolute;
	top: -0.5rem;
	left: 1rem;
	opacity: 0.1;
	font-family: serif;
}

/* کدها */
.raditone-content pre {
	padding: 1.25rem;
	border-radius: 16px;
	overflow-x: auto;
	margin: 1.5rem 0;
	line-height: 1.5;
	border: 1px solid var(--border-primary);
}

.raditone-content pre,.raditone-content code {
	background: var(--bg-secondary);
	font-size: 0.875rem;
}

.raditone-content code {
	padding: 0.2rem 0.5rem;
	border-radius: 8px;
	font-family: 'Courier New', monospace;
	color: var(--primary);
	border: 1px solid var(--border-primary);
}

.raditone-content pre code {
	background: transparent;
	padding: 0;
	border: none;
	color: var(--text-primary);
}

/* جداول */
.raditone-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 1.75rem 0;
	font-size: 0.95rem;
}

.raditone-content table th,
.raditone-content table td {
	padding: 0.85rem 1rem;
	border: 1px solid var(--border-primary);
	text-align: left;
}

.raditone-content table th {
	background: var(--bg-secondary);
	font-weight: 700;
	color: var(--text-primary);
}

.raditone-content table tr:nth-child(even) {
	background: rgba(var(--bg-secondary-rgb, 248, 250, 252), 0.5);
}

.raditone-content table tr:hover {
	background: var(--bg-tertiary);
}

/* تصاویر */
.raditone-content img {
	max-width: 100%;
	height: auto;
	border-radius: 16px;
	margin: 1.75rem auto;
	display: block;
}

.raditone-content .alignleft {
	float: right;
	margin: 0.5rem 1.5rem 1rem 0;
}

.raditone-content .alignright {
	float: left;
	margin: 0.5rem 0 1rem 1.5rem;
}

.raditone-content .aligncenter {
	display: block;
	margin-right: auto;
	margin-left: auto;
}

/* iframe و ویدیو */
.raditone-content iframe,
.raditone-content video {
	max-width: 100%;
	border-radius: 16px;
	margin: 1.75rem auto;
	display: block;
}

/* لینک‌ها */
.raditone-content a {
	color: var(--primary);
	text-underline-offset: 0.2em;
	transition: all 0.2s ease;
}

.raditone-content a:hover {
	color: var(--primary-hover);
	text-decoration-thickness: 2px;
}

/* ===================================================== */
/* WordPress Galleries - گالری وردپرس
/* ===================================================== */
.wp-caption {
	max-width: 100%;
	margin: 1.75rem auto;
	background: var(--bg-secondary);
	border-radius: 16px;
	overflow: hidden;
}

.wp-caption img {
	margin: 0;
	border-radius: 0;
}

.wp-caption-text {
	text-align: center;
	font-size: 0.85rem;
	color: var(--text-secondary);
	padding: 0.75rem;
	margin: 0;
}

.gallery {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 1rem;
	margin: 1.75rem 0;
}

.gallery-item {
	overflow: hidden;
	border-radius: 16px;
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
}

.gallery-item img {
	width: 100%;
	height: auto;
	margin: 0;
	transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.gallery-item:hover img {
	transform: scale(1.05);
}

.gallery-caption {
	padding: 0.6rem;
	font-size: 0.8rem;
	text-align: center;
	color: var(--text-tertiary);
	background: var(--bg-secondary);
}

/* ===================================================== */
/* Notice, Alert, Tip - نکات و هشدارها
/* ===================================================== */
.raditone-content .notice,
.raditone-content .alert,
.raditone-content .tip,
.raditone-content .warning,
.raditone-content .info {
	padding: 1rem 1.5rem;
	border-radius: 16px;
	margin: 1.5rem 0;
	border-left: 4px solid;
	line-height: 1.6;
}

.raditone-content .notice {
	background: rgba(59, 130, 246, 0.1);
	border-left-color: #3b82f6;
}

.raditone-content .alert,
.raditone-content .warning {
	background: rgba(239, 68, 68, 0.1);
	border-left-color: #ef4444;
}

.raditone-content .tip {
	background: rgba(34, 197, 94, 0.1);
	border-left-color: #22c55e;
}

.raditone-content .info {
	background: rgba(139, 92, 246, 0.1);
	border-left-color: #8b5cf6;
}

/* ===================================================== */
/* Tags - استایل برچسب‌ها
/* ===================================================== */
.flex-wrap.gap-2 a {
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 30px;
	padding: 0.375rem 1rem;
	font-size: 0.8rem;
	color: var(--text-secondary);
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

.flex-wrap.gap-2 a:hover {
	transform: translateY(-3px);
	background: var(--primary);
	color: white;
	border-color: var(--primary);
	box-shadow: 0 6px 14px rgba(var(--primary-rgb), 0.25);
}

/* برچسب‌های مخفی با انیمیشن */
.hidden-tag {
	animation: fadeInUp 0.3s ease forwards;
	opacity: 0;
	transform: translateY(10px);
}

@keyframes fadeInUp {
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* تأخیر برای انیمیشن هر برچسب */
.hidden-tag:nth-child(1) {
	animation-delay: 0.05s;
}

.hidden-tag:nth-child(2) {
	animation-delay: 0.1s;
}

.hidden-tag:nth-child(3) {
	animation-delay: 0.15s;
}

.hidden-tag:nth-child(4) {
	animation-delay: 0.2s;
}

.hidden-tag:nth-child(5) {
	animation-delay: 0.25s;
}

.hidden-tag:nth-child(6) {
	animation-delay: 0.3s;
}

.hidden-tag:nth-child(7) {
	animation-delay: 0.35s;
}

.hidden-tag:nth-child(8) {
	animation-delay: 0.4s;
}

.hidden-tag:nth-child(9) {
	animation-delay: 0.45s;
}

.hidden-tag:nth-child(10) {
	animation-delay: 0.5s;
}

.hidden-tag:nth-child(11) {
	animation-delay: 0.55s;
}

.hidden-tag:nth-child(12) {
	animation-delay: 0.6s;
}

/* دکمه‌های نمایش/مخفی کردن برچسب‌ها */
#show-all-tags-btn,
#hide-tags-btn {
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

#show-all-tags-btn:hover,
#hide-tags-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 14px rgba(0, 0, 0, 0.1);
}

.dark #show-all-tags-btn:hover,
.dark #hide-tags-btn:hover {
	box-shadow: 0 6px 14px rgba(0, 0, 0, 0.3);
}

/* ===================================================== */
/* Meta Data Cards - کارت‌های متادیتا
/* ===================================================== */
.grid.grid-cols-1 > * {
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.grid.grid-cols-1 > *:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12);
}

/* ===================================================== */
/* Responsive - ریسپانسیو
/* ===================================================== */
@media (max-width: 768px) {
	.raditone-content {
		font-size: 0.95rem;
		line-height: 1.65;
	}

	.raditone-content h2 {
		font-size: 1.4rem;
	}

	.raditone-content h3 {
		font-size: 1.25rem;
	}

	.raditone-content h4 {
		font-size: 1.1rem;
	}

	.raditone-content blockquote {
		padding: 0.75rem 1.25rem;
	}

	.raditone-content table th,
    .raditone-content table td {
		padding: 0.5rem;
		font-size: 0.85rem;
	}
    
    /* جدول در موبایل - اسکرول افقی */
	.raditone-content table {
		display: block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

@media (max-width: 640px) {
	.raditone-content {
		font-size: 0.9rem;
		line-height: 1.6;
	}

	.raditone-content h2 {
		font-size: 1.3rem;
	}

	.raditone-content h3 {
		font-size: 1.15rem;
	}

	.flex-wrap.gap-2 {
		gap: 0.5rem !important;
	}

	.flex-wrap.gap-2 a {
		font-size: 0.7rem;
		padding: 0.3rem 0.75rem;
	}

	#show-all-tags-btn,
    #hide-tags-btn {
		padding: 0.5rem 1rem;
		font-size: 0.85rem;
	}

	.hidden-tag {
		animation-duration: 0.2s;
	}

	.gallery {
		grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
		gap: 0.75rem;
	}
}

@media (min-width: 1024px) {
	.raditone-content {
		font-size: 1.05rem;
		line-height: 1.75;
	}
}

/* ===================================================== */
/* Desktop Large
/* ===================================================== */
@media (min-width: 1280px) {
	.raditone-content {
		font-size: 1.1rem;
		line-height: 1.8;
	}
}

/* ===================================================== */
/* Dark Mode Improvements - بهبود حالت تاریک
/* ===================================================== */
/* Dark mode styles removed - only light mode */

/* ===================================================== */
/* Accessibility - دسترسی‌پذیری
/* ===================================================== */
@media (prefers-reduced-motion: reduce) {
	.hidden-tag,
    .flex-wrap.gap-2 a,
    .grid.grid-cols-1 > *,
    #show-all-tags-btn,
    #hide-tags-btn,
    .gallery-item img {
		transition: none !important;
		animation: none !important;
	}

	.flex-wrap.gap-2 a:hover {
		transform: none;
	}
}

/* فوکوس برای دکمه‌ها */
#show-all-tags-btn:focus-visible,
#hide-tags-btn:focus-visible,
.flex-wrap.gap-2 a:focus-visible {
	outline: 2px solid var(--primary);
	outline-offset: 2px;
	border-radius: 8px;
}

/* ===================================================== */
/* Print Styles - حالت چاپ
/* ===================================================== */
@media print {
	.raditone-content {
		color: #000;
		font-size: 12pt;
		line-height: 1.5;
	}

	.raditone-content a {
		color: #000;
		text-decoration: underline;
	}

	.raditone-content blockquote {
		border-left: 2px solid #ccc;
		background: #f9f9f9;
	}

	.raditone-content pre,
    .raditone-content code {
		background: #f4f4f4;
		border: 1px solid #ddd;
	}

	.flex-wrap.gap-2 a {
		border: 1px solid #ccc;
		background: transparent;
		color: #000;
	}

	.flex-wrap.gap-2 a:hover {
		transform: none;
	}
}

/* ===================================================== */
/* Additional Improvements - بهبودهای اضافی
/* ===================================================== */
/* فاصله مناسب بین پاراگراف و تصاویر */
.raditone-content p + img,
.raditone-content img + p {
	margin-top: 1rem;
}

/* استایل برای فهرست مطالب (در صورت وجود) */
.raditone-content .toc {
	background: var(--bg-secondary);
	padding: 1rem 1.5rem;
	border-radius: 16px;
	margin: 1.5rem 0;
	border: 1px solid var(--border-primary);
}

.raditone-content .toc ul {
	margin-bottom: 0;
}

/* استایل برای یادداشت‌های کناری */
.raditone-content .footnote,
.raditone-content .note {
	font-size: 0.85rem;
	color: var(--text-tertiary);
	border-top: 1px solid var(--border-primary);
	padding-top: 0.75rem;
	margin-top: 0.75rem;
}

/* جداول با استایل زیبا */
.raditone-content table:not(.wp-calendar-table) {
	border-radius: 16px;
	overflow: hidden;
}

.raditone-content table:not(.wp-calendar-table) th {
	background: linear-gradient(-135deg, var(--bg-secondary), var(--bg-tertiary));
}

/* جداول وردپرس (تقویم) */
.wp-calendar-table {
	width: 100%;
	border-collapse: collapse;
}

.wp-calendar-table th,
.wp-calendar-table td {
	text-align: center;
	padding: 0.5rem;
}

/* RTL Support */
[dir="ltr"] .raditone-content blockquote {
	border-left: 4px solid var(--primary);
	border-right: none;
}

[dir="ltr"] .raditone-content .alignleft {
	float: left;
	margin: 0.5rem 0 1rem 1.5rem;
}

[dir="ltr"] .raditone-content .alignright {
	float: right;
	margin: 0.5rem 1.5rem 1rem 0;
}

/* ===================================================== */
/* Download Section - بخش دانلود با طراحی لیستی عمودی و شیک
/* ===================================================== */

.downloads-container {
	width: 100%;
	margin: 0 auto;
	padding: 1.5rem 0;
}

@media (min-width: 640px) {
	.downloads-container {
		padding: 2rem 0;
	}
}

.downloads-card {
	background: var(--bg-primary);
	border-radius: 1.5rem;
	overflow: hidden;
	border: 1px solid var(--border-primary);
	transition: all var(--transition);
}

/* ===================================================== */
/* Download Header - هدر بخش دانلود
/* ===================================================== */
.downloads-header {
	background: linear-gradient(-135deg, rgba(var(--primary-rgb), 0.08) 0%, rgba(var(--accent-rgb), 0.05) 100%);
	padding: 1.5rem 2rem;
	border-bottom: 1px solid var(--border-primary);
}

@media (max-width: 640px) {
	.downloads-header {
		padding: 1.25rem;
	}
}

.downloads-header-inner {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

@media (min-width: 640px) {
	.downloads-header-inner {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
}

.header-info {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.header-title h2 {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--text-primary);
	margin: 0;
}

@media (min-width: 640px) {
	.header-title h2 {
		font-size: 1.75rem;
	}
}

.header-title p {
	font-size: 0.875rem;
	color: var(--text-tertiary);
	margin-top: 0.25rem;
}

.header-badges {
	display: flex;
	gap: 0.5rem;
	flex-wrap: wrap;
}

.badge-count {
	font-size: 0.75rem;
	font-weight: 500;
	padding: 0.375rem 0.875rem;
	background: var(--bg-secondary);
	border-radius: 9999px;
	color: var(--text-secondary);
	border: 1px solid var(--border-primary);
}

.badge-count i {
	margin-right: 0.375rem;
	color: var(--primary);
}

/* ===================================================== */
/* Download Body - بدنه اصلی بخش دانلود
/* ===================================================== */
.downloads-body {
	padding: 1.5rem 2rem;
	display: flex;
	flex-direction: column;
	gap: 2rem;
}

@media (max-width: 640px) {
	.downloads-body {
		padding: 1.25rem;
		gap: 1.5rem;
	}
}

/* ===================================================== */
/* Download Section - هر بخش دانلود (مثلاً MP3, MP4)
/* ===================================================== */


/* ===================================================== */
/* Download List - لیست دانلودها به صورت عمودی و شیک
/* ===================================================== */
.download-list {
	display: flex;
	flex-direction: column;
	gap: 0.625rem;
}

.download-item {
	display: block;
	text-decoration: none;
}

.download-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.875rem 1.25rem;
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 1rem;
	transition: all var(--transition-fast);
	cursor: pointer;
}

.download-row:hover {
	border-color: var(--primary);
	transform: translateX(4px);
	box-shadow: var(--shadow-md);
}

.download-row:active {
	transform: scale(0.99);
}

/* RTL برای hover */
[dir="ltr"] .download-row:hover {
	transform: translateX(-4px);
}

/* سمت راست (اطلاعات فایل) */
.download-info {
	display: flex;
	align-items: center;
	gap: 1rem;
	flex: 1;
}

.download-icon {
	flex-shrink: 0;
}

.icon-circle {
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 0.75rem;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform var(--transition-fast);
}

.download-row:hover .icon-circle {
	transform: scale(1.05);
}

.icon-circle i {
	font-size: 1.125rem;
	color: white;
}

.download-details {
	flex: 1;
}

.download-label {
	font-weight: 600;
	font-size: 0.9375rem;
	color: var(--text-primary);
}

.download-meta {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-top: 0.25rem;
	flex-wrap: wrap;
}

.download-quality {
	background: var(--bg-tertiary);
	padding: 0.125rem 0.5rem;
	border-radius: 9999px;
}

.download-quality,.download-size,.download-format {
	font-size: 0.6875rem;
	color: var(--text-tertiary);
}

.download-format {
	background: var(--bg-tertiary);
	padding: 0.125rem 0.5rem;
	border-radius: 9999px;
}

/* سمت چپ (دکمه دانلود) */
.download-action {
	flex-shrink: 0;
}

.download-button {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem 1.25rem;
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	border-radius: 2rem;
	font-size: 0.8125rem;
	font-weight: 500;
	color: var(--text-secondary);
	transition: all var(--transition-fast);
	cursor: pointer;
}

.download-row:hover .download-button {
	background: var(--primary);
	border-color: var(--primary);
	color: white;
}

.download-button i {
	font-size: 0.875rem;
	transition: transform var(--transition-fast);
}

.download-row:hover .download-button i {
	transform: translateY(2px);
}

/* ===================================================== */
/* Gradient Colors - گرادیان‌های رنگی برای آیکون‌ها
/* ===================================================== */
.gradient-primary {
	background: linear-gradient(-135deg, var(--primary), var(--primary-hover));
}

.gradient-secondary {
	background: linear-gradient(-135deg, var(--accent), #7c3aed);
}

.gradient-warning {
	background: linear-gradient(-135deg, #f59e0b, #d97706);
}

.gradient-danger {
	background: linear-gradient(-135deg, #ef4444, #dc2626);
}

.gradient-success {
	background: linear-gradient(-135deg, #10b981, #059669);
}

.gradient-info {
	background: linear-gradient(-135deg, #06b6d4, #0891b2);
}

/* ===================================================== */
/* Video Player - پخش‌کننده ویدیو
/* ===================================================== */
.video-wrapper {
	border-radius: 1rem;
	overflow: hidden;
	background: #000;
	box-shadow: var(--shadow-2xl);
	margin-bottom: 0.5rem;
	position: relative;
}

.video-player {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: contain;
}

.video-controls-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	padding: 0.75rem;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.4));
	backdrop-filter: blur(4px);
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
}

.control-btn {
	background: transparent;
	border: none;
	color: white;
	padding: 0.5rem;
	border-radius: 9999px;
	cursor: pointer;
	transition: all var(--transition-fast);
	min-width: 2.5rem;
	min-height: 2.5rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.control-btn:hover {
	color: var(--primary);
	background: rgba(255, 255, 255, 0.1);
}

.time-display {
	font-size: 0.875rem;
	font-family: var(--font-iranyekan);
	background: rgba(0, 0, 0, 0.6);
	padding: 0.25rem 0.75rem;
	border-radius: 9999px;
	color: white;
}

@media (max-width: 640px) {
	.time-display {
		font-size: 0.6875rem;
	}
}

/* کیفیت ویدیو */
.quality-selector {
	position: relative;
}

.quality-btn {
	display: flex;
	align-items: center;
	gap: 0.25rem;
	background: rgba(255, 255, 255, 0.15);
	border: none;
	padding: 0.375rem 0.875rem;
	border-radius: 9999px;
	color: white;
	font-size: 0.875rem;
	cursor: pointer;
	transition: all var(--transition-fast);
}

.quality-btn:hover {
	background: rgba(255, 255, 255, 0.25);
}

.quality-dropdown {
	position: absolute;
	bottom: 100%;
	left: 0;
	margin-bottom: 0.5rem;
	background: var(--bg-primary);
	border-radius: 0.75rem;
	box-shadow: var(--shadow-xl);
	border: 1px solid var(--border-primary);
	display: none;
	z-index: 50;
	min-width: 7rem;
	overflow: hidden;
}

.quality-dropdown.show {
	display: block;
	animation: fadeScale 0.15s ease;
}

.quality-option {
	width: 100%;
	text-align: left;
	padding: 0.5rem 1rem;
	font-size: 0.875rem;
	color: var(--text-secondary);
	background: transparent;
	border: none;
	cursor: pointer;
	transition: all var(--transition-fast);
}

.quality-option:hover {
	background: var(--primary);
	color: white;
}

/* دسکتاپ: مخفی کردن کنترل‌ها تا زمانی که موس روی ویدیو باشد */
@media (min-width: 641px) {
	.video-controls-bar {
		opacity: 0;
		transition: opacity 0.3s ease;
	}

	.video-wrapper:hover .video-controls-bar {
		opacity: 1;
	}
}

/* ===================================================== */
/* Empty State - حالت خالی (بدون فایل دانلود)
/* ===================================================== */
.empty-state {
	text-align: center;
	padding: 3rem 2rem;
}

.empty-icon {
	width: 5rem;
	height: 5rem;
	border-radius: 9999px;
	background: var(--bg-tertiary);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 1.25rem;
}

.empty-icon i {
	font-size: 2rem;
	color: var(--text-tertiary);
}

.empty-title {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 0.5rem;
}

.empty-text {
	color: var(--text-tertiary);
	max-width: 28rem;
	margin: 0 auto;
}

/* ===================================================== */
/* Animations - انیمیشن‌ها
/* ===================================================== */
@keyframes fadeScale {
	from {
		opacity: 0;
		transform: scale(0.9);
	}

	to {
		opacity: 1;
		transform: scale(1);
	}
}

/* ===================================================== */
/* Responsive - ریسپانسیو برای موبایل
/* ===================================================== */
@media (max-width: 640px) {
	.download-row {
		flex-direction: column;
		align-items: stretch;
		padding: 1rem;
	}

	.download-info,.download-action,.download-button {
		width: 100%;
	}

	.download-button {
		justify-content: center;
	}

	.video-controls-bar {
		flex-wrap: wrap;
		gap: 0.5rem;
	}

	.control-btn {
		min-width: 2rem;
		min-height: 2rem;
		padding: 0.375rem;
	}

	.quality-btn {
		padding: 0.25rem 0.75rem;
		font-size: 0.75rem;
	}
}

/* ===================================================== */
/* Dark Mode - حالت تاریک برای بخش دانلود
/* ===================================================== */
/* Dark mode styles removed - only light mode */

/* ===================================================== */
/* Accessibility - دسترسی‌پذیری
/* ===================================================== */
@media (prefers-reduced-motion: reduce) {
	.download-row,
    .download-row:hover,
    .download-button,
    .download-button i,
    .icon-circle,
    .quality-dropdown {
		transition: none !important;
		animation: none !important;
		transform: none !important;
	}
}

.download-button:focus-visible,
.control-btn:focus-visible,
.quality-btn:focus-visible,
.quality-option:focus-visible {
	outline: 2px solid var(--primary);
	outline-offset: 2px;
	border-radius: 8px;
}

/* ===================================================== */
/* Print Styles - حالت چاپ
/* ===================================================== */
@media print {
	.downloads-card {
		box-shadow: none;
		border: 1px solid #ccc;
	}

	.download-button,
    .quality-selector,
    .video-controls-bar {
		display: none;
	}

	.download-row {
		break-inside: avoid;
		page-break-inside: avoid;
	}
}

/* ===================================================== */
/* RTL Support - پشتیبانی از زبان فارسی
/* ===================================================== */

[dir="ltr"] .badge-count i,[dir="ltr"] .section-count i {
	margin-right: 0;
	margin-left: 0.375rem;
}

[dir="ltr"] .quality-dropdown {
	left: auto;
	right: 0;
}

[dir="ltr"] .download-row:hover .download-button i {
	transform: translateY(2px);
}


/* ===================================================== */
/* Lyrics Section - بخش متن ترانه با پشتیبانی کامل از حالت شب/روز
/* ===================================================== */

.raditone-lyrics-section {
	background: var(--bg-primary);
	border-radius: 1.5rem;
	padding: 1.5rem;
	margin-bottom: 1.875rem;
	box-shadow: var(--shadow-md);
	transition: all var(--transition);
	border: 1px solid var(--border-primary);
}

.raditone-lyrics-section:hover {
	box-shadow: var(--shadow-lg);
	border-color: var(--border-secondary);
}

/* ===================================================== */
/* Section Header - هدر بخش
/* ===================================================== */
.raditone-section-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1.5rem;
	padding-bottom: 0.9375rem;
	border-bottom: 2px solid var(--border-primary);
	flex-wrap: wrap;
	gap: 0.9375rem;
}

.raditone-section-title {
	font-size: 1.5rem;
	font-weight: 700;
	margin: 0;
	display: flex;
	align-items: center;
	gap: 0.75rem;
	color: var(--text-primary);
}

@media (max-width: 640px) {
	.raditone-section-title {
		font-size: 1.25rem;
	}
}

.raditone-section-title i {
	color: var(--primary);
	font-size: 1.5rem;
}

.raditone-section-subtitle {
	font-size: 0.875rem;
	color: var(--text-tertiary);
	font-weight: 400;
	margin-left: 0.75rem;
	direction: ltr;
}

/* ===================================================== */
/* Lyrics Content - محتوای متن ترانه
/* ===================================================== */


/* ===================================================== */
/* Animations - انیمیشن‌های مدرن
/* ===================================================== */

/* انیمیشن برای کارت‌های گرید */
.post-card-grid {
	animation: fadeInUp 0.4s ease-out forwards;
	opacity: 0;
}

@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* انیمیشن برای کارت‌های لیست */
.post-card-list {
	animation: fadeInRight 0.4s ease-out forwards;
	opacity: 0;
}

@keyframes fadeInRight {
	from {
		opacity: 0;
		transform: translateX(20px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

/* RTL برای انیمیشن لیست */
[dir="ltr"] .post-card-list {
	animation: fadeInLeft 0.4s ease-out forwards;
}

@keyframes fadeInLeft {
	from {
		opacity: 0;
		transform: translateX(-20px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

/* تأخیرهای انیمیشن برای اسکرول */
.post-card-grid:nth-child(1) {
	animation-delay: 0.05s;
}

.post-card-grid:nth-child(2) {
	animation-delay: 0.1s;
}

.post-card-grid:nth-child(3) {
	animation-delay: 0.15s;
}

.post-card-grid:nth-child(4) {
	animation-delay: 0.2s;
}

.post-card-grid:nth-child(5) {
	animation-delay: 0.25s;
}

.post-card-grid:nth-child(6) {
	animation-delay: 0.3s;
}

.post-card-grid:nth-child(7) {
	animation-delay: 0.35s;
}

.post-card-grid:nth-child(8) {
	animation-delay: 0.4s;
}

.post-card-grid:nth-child(9) {
	animation-delay: 0.45s;
}

.post-card-grid:nth-child(10) {
	animation-delay: 0.5s;
}

.post-card-grid:nth-child(11) {
	animation-delay: 0.55s;
}

.post-card-grid:nth-child(12) {
	animation-delay: 0.6s;
}

/* ===================================================== */
/* Line Clamp Utilities - محدود کردن خطوط متن
/* ===================================================== */
.line-clamp-1 {
	-webkit-line-clamp: 1;
}

.line-clamp-1,.line-clamp-2 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.line-clamp-2 {
	-webkit-line-clamp: 2;
}

.line-clamp-3 {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ===================================================== */
/* List View Card - کارت حالت لیست
/* ===================================================== */
.list-view-card {
	background: linear-gradient(-135deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 250, 252, 0.98) 100%);
	border: 1px solid var(--border-primary);
	border-radius: 1rem;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	overflow: hidden;
	position: relative;
}

.dark .list-view-card {
	background: linear-gradient(-135deg, rgba(30, 41, 59, 0.98) 0%, rgba(15, 23, 42, 0.98) 100%);
	border-color: var(--border-primary);
}

.list-view-card:hover {
	transform: translateX(-6px);
	border-color: var(--primary);
	box-shadow: 0 12px 28px -8px rgba(59, 130, 246, 0.25);
}

.dark .list-view-card:hover {
	box-shadow: 0 12px 28px -8px rgba(59, 130, 246, 0.35);
}

/* RTL برای hover لیست */
[dir="ltr"] .list-view-card:hover {
	transform: translateX(6px);
}

/* تصویر در کارت لیست */
.list-view-card .w-20.h-20 {
	border-radius: 0.75rem;
	box-shadow: var(--shadow);
	width: 5rem;
	height: 5rem;
	object-fit: cover;
	transition: transform 0.3s ease;
}

.list-view-card:hover .w-20.h-20 {
	transform: scale(1.05);
}

/* عنوان در کارت لیست */
.list-view-card .track-title {
	font-weight: 700;
	font-size: 1rem;
	color: var(--text-primary);
	margin-bottom: 0.25rem;
	transition: color 0.2s ease;
}

.list-view-card:hover .track-title {
	color: var(--primary);
}

/* ===================================================== */
/* Grid View Card - کارت حالت گرید
/* ===================================================== */
.grid-view-card {
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 1rem;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	overflow: hidden;
	position: relative;
}

.grid-view-card:hover {
	transform: translateY(-6px);
	border-color: var(--primary);
	box-shadow: 0 20px 30px -12px rgba(0, 0, 0, 0.15);
}

.dark .grid-view-card:hover {
	box-shadow: 0 20px 30px -12px rgba(0, 0, 0, 0.35);
}

/* ===================================================== */
/* View Toggle Buttons - دکمه‌های تغییر دید
/* ===================================================== */
.view-toggle-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.5rem 1rem;
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 0.75rem;
	color: var(--text-secondary);
	font-size: 0.875rem;
	font-weight: 500;
	cursor: pointer;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.view-toggle-btn i {
	font-size: 1rem;
}

.view-toggle-btn.active {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	color: white;
	border-color: transparent;
	box-shadow: 0 4px 12px rgba(var(--primary-rgb), 0.3);
}

.view-toggle-btn:not(.active):hover {
	background: var(--bg-tertiary);
	border-color: var(--border-secondary);
	transform: translateY(-2px);
}

.dark .view-toggle-btn:not(.active):hover {
	background: rgba(51, 65, 85, 0.8);
}

.view-toggle-btn:active {
	transform: translateY(0);
}

/* گروه دکمه‌های تغییر دید */
.view-toggle-group {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	background: var(--bg-primary);
	padding: 0.25rem;
	border-radius: 1rem;
}

/* ===================================================== */
/* Custom Scrollbar - اسکرول بار سفارشی
/* ===================================================== */
/* WebKit Browsers (Chrome, Safari, Edge) */
::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

::-webkit-scrollbar-track {
	background: var(--bg-tertiary);
	border-radius: 10px;
}

::-webkit-scrollbar-thumb {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 10px;
	transition: all 0.3s ease;
}

::-webkit-scrollbar-thumb:hover {
	background: linear-gradient(-135deg, var(--accent), var(--primary));
}

/* Firefox */
* {
	scrollbar-width: thin;
	scrollbar-color: var(--primary) var(--bg-tertiary);
}

/* ===================================================== */
/* Responsive - ریسپانسیو کامل
/* ===================================================== */

/* موبایل (تا 640px) */
@media (max-width: 640px) {
    /* گرید */
	.grid {
		gap: 0.75rem !important;
	}
    
    /* کارت گرید در موبایل */
	.post-card-grid {
		animation-delay: 0s !important;
	}
    
    /* دکمه‌های تغییر دید */
	.view-toggle-btn {
		padding: 0.375rem 0.75rem;
		font-size: 0.75rem;
	}

	.view-toggle-btn i {
		font-size: 0.875rem;
	}
    
    /* کارت لیست در موبایل */
	.list-view-card {
		flex-direction: column;
	}

	.list-view-card .w-20.h-20 {
		width: 100%;
		height: 120px;
		border-radius: 0.75rem 0.75rem 0 0;
	}

	.list-view-card:hover,[dir="ltr"] .list-view-card:hover {
		transform: translateY(-4px);
	}
}

/* تبلت (641px تا 1024px) */
@media (min-width: 641px) and (max-width: 1024px) {
	.grid {
		gap: 1rem !important;
	}

	.post-card-grid {
		animation-delay: calc(var(--index, 0) * 0.05s);
	}

	.view-toggle-btn {
		padding: 0.5rem 0.875rem;
	}
}

/* دسکتاپ (بالای 1024px) */
@media (min-width: 1025px) {
	.grid {
		gap: 1.25rem !important;
	}

	.view-toggle-btn {
		padding: 0.625rem 1.125rem;
	}
}

/* ===================================================== */
/* Lazy Loading Animation - انیمیشن لودینگ
/* ===================================================== */
@keyframes shimmer {
	0% {
		background-position: 300% 0;
	}

	100% {
		background-position: -100% 0;
	}
}

.skeleton-loader {
	background: linear-gradient(-90deg, 
        var(--bg-secondary) 25%, 
        var(--bg-tertiary) 50%, 
        var(--bg-secondary) 75%);
	background-size: 200% 100%;
	animation: shimmer 1.5s infinite;
	border-radius: 0.5rem;
}

/* ===================================================== */
/* Hover Effects for Cards - افکت‌های hover پیشرفته
/* ===================================================== */
/* افکت زوم روی تصویر */
.card-image-zoom {
	overflow: hidden;
	border-radius: 0.75rem;
}

.card-image-zoom img {
	transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.card-image-zoom:hover img {
	transform: scale(1.08);
}

/* افکت درخشش روی کارت */
.card-glow-effect {
	position: relative;
	overflow: hidden;
}

.card-glow-effect::before {
	content: '';
	position: absolute;
	top: 0;
	right: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(-90deg, 
        transparent, 
        rgba(255, 255, 255, 0.1), 
        transparent);
	transition: right 0.6s ease;
	pointer-events: none;
}

.card-glow-effect:hover::before {
	right: 100%;
}

.dark .card-glow-effect::before {
	background: linear-gradient(-90deg, 
        transparent, 
        rgba(255, 255, 255, 0.05), 
        transparent);
}

/* ===================================================== */
/* Accessibility - دسترسی‌پذیری
/* ===================================================== */
@media (prefers-reduced-motion: reduce) {
	.post-card-grid,
    .post-card-list,
    .list-view-card,
    .grid-view-card,
    .view-toggle-btn,
    .card-image-zoom img,
    .card-glow-effect::before {
		transition: none !important;
		animation: none !important;
	}

	.list-view-card:hover,.grid-view-card:hover,.view-toggle-btn:hover {
		transform: none;
	}
}

/* فوکوس برای دسترسی صفحه کلید */
.view-toggle-btn:focus-visible,
.list-view-card:focus-visible,
.grid-view-card:focus-visible {
	outline: 2px solid var(--primary);
	outline-offset: 2px;
	border-radius: 12px;
}

/* ===================================================== */
/* Print Styles - حالت چاپ
/* ===================================================== */
@media print {
	.view-toggle-group,
    .view-toggle-btn {
		display: none;
	}

	.post-card-grid,
    .list-view-card {
		opacity: 1;
		animation: none;
		break-inside: avoid;
		page-break-inside: avoid;
	}

	.card-image-zoom img {
		transform: none;
	}
}

/* ===================================================== */
/* RTL Support Complete - پشتیبانی کامل از RTL
/* ===================================================== */
[dir="ltr"] .view-toggle-btn i {
	transform: scaleX(-1);
}

[dir="ltr"] .card-glow-effect::before {
	right: auto;
	left: -100%;
}

[dir="ltr"] .card-glow-effect:hover::before {
	right: auto;
	left: 100%;
}

/* ===================================================== */
/* Archive Page - آرشیو پست‌ها با طراحی شیشه‌ای
/* ===================================================== */

.raditone-archive-main {
	min-height: 100vh;
	background: var(--bg-primary);
	transition: background-color var(--transition);
}

/* ===================================================== */
/* Container
/* ===================================================== */
.raditone-container {
	margin: 0 auto;
	padding: 0 1rem;
}

@media (min-width: 640px) {
	.raditone-container {
		padding: 0 1.5rem;
	}
}

@media (min-width: 1024px) {
	.raditone-container {
		padding: 0 2rem;
	}
}

/* ===================================================== */
/* Archive Header - Responsive Design */
/* ===================================================== */

.raditone-archive-header {
	position: relative;
	background: linear-gradient(to left, 
        rgba(var(--primary-rgb), 0.1),
        rgba(var(--primary-rgb), 0.05),
        rgba(var(--accent-rgb), 0.05)
    );
	backdrop-filter: blur(10px);
	border-bottom: 1px solid rgba(var(--border-primary-rgb, 226, 232, 240), 0.3);
	padding: 1.5rem 0;
}

/* بهبود responsive container */
.raditone-container {
	width: 100%;
	margin: 0 auto;
	padding: 0 0;
}

/* محتوای هدر با فلکس در موبایل و دسکتاپ */
.raditone-archive-header-content {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-top: 0.5rem;
}

@media (min-width: 768px) {
	.raditone-archive-header {
		padding: 2rem;
	}

	.raditone-archive-header-content {
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		gap: 2rem;
		margin-top: 1rem;
	}
}

/* اطلاعات سمت راست هدر */
.raditone-archive-header-info {
	flex: 1;
}

/* عنوان آرشیو */
.raditone-archive-title {
	font-size: 1.5rem;
	font-weight: 800;
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 0.5rem;
	flex-wrap: wrap;
}

@media (min-width: 480px) {
	.raditone-archive-title {
		font-size: 1.8rem;
	}
}

@media (min-width: 768px) {
	.raditone-archive-title {
		font-size: 2rem;
		gap: 1rem;
	}
}

.raditone-archive-title i {
	font-size: 1.3rem;
	color: var(--primary);
}

/* توضیحات دسته‌بندی */
.raditone-archive-description-text {
	font-size: 0.85rem;
	color: var(--text-secondary);
	line-height: 1.5;
	margin-top: 0.5rem;
	max-width: 90%;
}

@media (min-width: 768px) {
	.raditone-archive-description-text {
		font-size: 0.95rem;
		max-width: 80%;
	}
}

/* استاتیک‌ها (آمار) */
.raditone-archive-stats {
	display: flex;
	gap: 0.75rem;
	margin-top: 0.5rem;
}

@media (min-width: 768px) {
	.raditone-archive-stats {
		gap: 1rem;
		margin-top: 0;
	}
}

.raditone-archive-stat-card {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	background-color: var(--bg-tertiary);
	padding: 0.5rem 0.9rem;
	border-radius: 2rem;
	border: 1px solid var(--border-primary);
	transition: all 0.2s ease;
}

@media (min-width: 640px) {
	.raditone-archive-stat-card {
		padding: 0.6rem 1.2rem;
		gap: 0.7rem;
	}
}

.raditone-archive-stat-card i {
	font-size: 0.9rem;
	color: var(--primary);
}

.raditone-archive-stat-value {
	font-size: 1rem;
	font-weight: 700;
	color: var(--text-primary);
	line-height: 1;
}

.raditone-archive-stat-label {
	font-size: 0.7rem;
	color: var(--text-tertiary);
	font-weight: 500;
}

@media (min-width: 640px) {
	.raditone-archive-stat-value {
		font-size: 1.1rem;
	}

	.raditone-archive-stat-label {
		font-size: 0.75rem;
	}
}

/* بهبود breadcrumb در موبایل */
.raditone-breadcrumb {
	margin-bottom: 0.75rem;
}

.raditone-breadcrumb-inner {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex-wrap: wrap;
	font-size: 0.75rem;
}

@media (min-width: 640px) {
	.raditone-breadcrumb-inner {
		font-size: 0.85rem;
		gap: 0.75rem;
	}
}

.raditone-breadcrumb-link {
	color: var(--text-secondary);
	text-decoration: none;
	transition: color 0.2s ease;
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
}

.raditone-breadcrumb-link:hover {
	color: var(--primary);
}

.raditone-breadcrumb-sep {
	font-size: 0.7rem;
	color: var(--text-tertiary);
}

.raditone-breadcrumb-current {
	color: var(--text-primary);
	font-weight: 500;
}

/* Header Content */
.raditone-archive-header-content {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

@media (min-width: 768px) {
	.raditone-archive-header-content {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
}

.raditone-archive-header-info {
	text-align: center;
}

@media (min-width: 768px) {
	.raditone-archive-header-info {
		text-align: left;
	}
}

@media (min-width: 768px) {
	.raditone-archive-title {
		font-size: 2rem;
		justify-content: flex-start;
	}
}

.raditone-archive-title i {
	font-size: 1.5rem;
	opacity: 0.9;
}

.raditone-archive-title-accent {
	color: rgba(255, 255, 255, 0.9);
	font-weight: 600;
}

.raditone-archive-description-text {
	color: rgba(255, 255, 255, 0.85);
	font-size: 0.875rem;
	max-width: 32rem;
	margin: 0 auto;
}

@media (min-width: 768px) {
	.raditone-archive-description-text {
		margin: 0;
	}
}

/* Stats Cards */
.raditone-archive-stats {
	display: flex;
	gap: 1rem;
	justify-content: center;
}

.raditone-archive-stat-card {
	background: rgba(255, 255, 255, 0.12);
	backdrop-filter: blur(10px);
	border-radius: 1rem;
	padding: 0.75rem 1.25rem;
	text-align: center;
	transition: all 0.3s ease;
	min-width: 90px;
}

.raditone-archive-stat-card:hover {
	background: rgba(255, 255, 255, 0.2);
	transform: translateY(-2px);
}

/* ===================================================== */
/* Archive Filters - Responsive */
/* ===================================================== */

.raditone-archive-filters-section {
	top: 70px;
	z-index: 40;
	background-color: var(--bg-primary);
	border-bottom: 1px solid var(--border-primary);
	padding: 1rem !important;
	margin-top: 1rem;
	margin-bottom: 1rem;
}

@media (min-width: 768px) {
	.raditone-archive-filters-section {
		padding: 1rem 0;
	}
}

.raditone-archive-filters {
	display: flex;
	flex-direction: row;
	gap: 0.5rem;
	align-items: center;
	justify-content: space-between;
}

@media (min-width: 640px) {
	.raditone-archive-filters {
		display: flex;
		flex-direction: row;
		gap: 0.5rem;
		align-items: center;
		justify-content: space-between;
	}
}

.raditone-archive-view-buttons {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.raditone-view-btn {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.5rem 0.9rem;
	border-radius: 0.75rem;
	border: 1px solid var(--border-primary);
	background-color: var(--bg-secondary);
	cursor: pointer;
	transition: all 0.2s ease;
	font-size: 0.8rem;
	color: var(--text-secondary);
}

@media (min-width: 640px) {
	.raditone-view-btn {
		padding: 0.6rem 1.2rem;
		gap: 0.6rem;
		font-size: 0.85rem;
	}
}

.raditone-view-btn i {
	font-size: 0.9rem;
}

.raditone-view-btn.active {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-color: transparent;
	color: var(--text-primary);
}

.raditone-archive-sort {
	position: relative;
	width: 50%;
}

@media (min-width: 640px) {
	.raditone-archive-sort {
		width: auto;
		min-width: 180px;
	}
}

.raditone-sort-select {
	width: 100%;
	appearance: none;
	background-color: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 0.75rem;
	padding: 0.6rem 1rem 0.6rem 2rem;
	font-size: 0.85rem;
	outline: none;
	cursor: pointer;
	color: var(--text-primary);
}

@media (min-width: 640px) {
	.raditone-sort-select {
		width: auto;
		padding: 0.6rem 1rem 0.6rem 2rem;
	}
}

.raditone-sort-icon {
	position: absolute;
	right: 0.75rem;
	top: 50%;
	transform: translateY(-50%);
	pointer-events: none;
	font-size: 0.8rem;
	color: var(--text-tertiary);
}

/* شمارنده پست‌ها در موبایل */
.raditone-archive-counter {
	font-size: 0.75rem;
	color: var(--text-tertiary);
	margin-bottom: 1rem;
	text-align: right;
	padding: 0 0.25rem;
}

@media (min-width: 640px) {
	.raditone-archive-counter {
		font-size: 0.85rem;
		margin-bottom: 1.5rem;
	}
}

/* Grid Layout */
.raditone-archive-grid--grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
}

@media (min-width: 640px) {
	.raditone-archive-grid--grid {
		gap: 1.25rem;
	}
}

@media (min-width: 768px) {
	.raditone-archive-grid--grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 1.5rem;
	}
}

@media (min-width: 1024px) {
	.raditone-archive-grid--grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (min-width: 1280px) {
	.raditone-archive-grid--grid {
		grid-template-columns: repeat(5, 1fr);
	}
}

/* List Layout */
.raditone-archive-grid--list {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

/* ===================================================== */
/* Archive Card - کارت پست
/* ===================================================== */
.raditone-archive-card {
	position: relative;
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 1rem;
	overflow: hidden;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.raditone-archive-card:hover {
	transform: translateY(-4px);
	border-color: var(--primary);
	box-shadow: var(--shadow-lg);
}

.raditone-archive-card-link {
	display: block;
	text-decoration: none;
}

/* Card Image */
.raditone-archive-card-image {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: linear-gradient(-135deg, var(--bg-tertiary), var(--bg-secondary));
}

.raditone-archive-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.raditone-archive-card:hover .raditone-archive-card-image img {
	transform: scale(1.08);
}

.raditone-archive-card-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(-135deg, var(--bg-tertiary), var(--bg-secondary));
}

.raditone-archive-card-placeholder i {
	font-size: 2.5rem;
	color: var(--text-tertiary);
}

/* Card Overlay */
.raditone-archive-card-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.2), transparent);
	opacity: 0;
	transition: opacity 0.3s ease;
	display: flex;
	align-items: center;
	justify-content: center;
}

.raditone-archive-card:hover .raditone-archive-card-overlay {
	opacity: 1;
}

.raditone-archive-card-play {
	width: 3rem;
	height: 3rem;
	background: rgba(255, 255, 255, 0.9);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transform: scale(0);
	transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.raditone-archive-card:hover .raditone-archive-card-play {
	transform: scale(1);
}

.raditone-archive-card-play i {
	font-size: 1.25rem;
	color: var(--primary);
}

/* Card Content */
.raditone-archive-card-content {
	padding: 0.75rem;
	text-align: center;
}

.raditone-archive-card-title {
	font-size: 0.875rem;
	font-weight: 700;
	color: var(--text-primary);
	margin: 0 0 0.25rem 0;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	transition: color 0.2s ease;
}

.raditone-archive-card:hover .raditone-archive-card-title {
	color: var(--primary);
}

.raditone-archive-card-artist {
	font-size: 0.75rem;
	color: var(--text-tertiary);
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.25rem;
}

.raditone-archive-card-artist i {
	font-size: 0.625rem;
}

/* Card Bar */
.raditone-archive-card-bar {
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
	height: 0.125rem;
	background: linear-gradient(-90deg, var(--primary), var(--accent));
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.4s ease;
}

.raditone-archive-card:hover .raditone-archive-card-bar {
	transform: scaleX(1);
}

.raditone-archive-card-bar--hidden {
	display: none;
}

/* ===================================================== */
/* List View Card Styles - حالت لیست
/* ===================================================== */
.raditone-archive-card--list {
	border-radius: 0.75rem;
}

.raditone-archive-card--list:hover {
	transform: translateX(-4px);
}

.raditone-archive-card-link--list {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 0.75rem;
}

.raditone-archive-card-image--list {
	width: 5rem;
	height: 5rem;
	min-width: 5rem;
	aspect-ratio: auto;
	border-radius: 0.75rem;
	overflow: hidden;
}

.raditone-archive-card-content--list {
	flex: 1;
	text-align: left;
	padding: 0;
}

.raditone-archive-card-title--list {
	font-size: 1rem;
}

/* RTL برای حالت لیست */
[dir="ltr"] .raditone-archive-card--list:hover {
	transform: translateX(4px);
}

/* ===================================================== */
/* Loading & End States
/* ===================================================== */
.raditone-scroll-trigger {
	height: 2.5rem;
}

.raditone-loading-indicator {
	text-align: center;
	padding: 2rem;
}

.raditone-loading-indicator p {
	margin-top: 0.75rem;
	font-size: 0.875rem;
	color: var(--text-tertiary);
}

.raditone-spinner {
	display: inline-block;
	width: 2rem;
	height: 2rem;
	border: 2px solid var(--border-primary);
	border-top-color: var(--primary);
	border-radius: 50%;
	animation: raditone-spin 1s linear infinite;
}

.raditone-spinner--large {
	width: 2.5rem;
	height: 2.5rem;
}

@keyframes raditone-spin {
	to {
		transform: rotate(-360deg);
	}
}

.raditone-end-message {
	text-align: center;
	padding: 2rem;
}

.raditone-end-message-inner {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem 1rem;
	background: var(--bg-secondary);
	border-radius: 2rem;
	font-size: 0.875rem;
	color: var(--text-tertiary);
}

.raditone-end-message-inner i {
	color: var(--success);
}

.raditone-archive-loading {
	grid-column: 1 / -1;
	text-align: center;
	padding: 3rem;
}

.raditone-archive-loading p {
	margin-top: 1rem;
	color: var(--text-tertiary);
}

/* ===================================================== */
/* Responsive
/* ===================================================== */
@media (max-width: 640px) {
	.raditone-archive-title {
		font-size: 1.25rem;
		flex-wrap: wrap;
	}

	.raditone-archive-title i {
		font-size: 1rem;
	}

	.raditone-archive-stat-card {
		padding: 0.5rem 1rem;
		min-width: 70px;
	}

	.raditone-archive-stat-value {
		font-size: 1.125rem;
	}

	.raditone-view-btn span {
		display: none;
	}

	.raditone-view-btn {
		padding: 0.5rem;
	}

	.raditone-view-btn i {
		font-size: 1.125rem;
	}

	.raditone-archive-counter {
		font-size: 0.75rem;
	}
}

/* ===================================================== */
/* Dark Mode - حالت تاریک
/* ===================================================== */
/* Dark mode styles removed - only light mode */

/* ===================================================== */
/* Accessibility
/* ===================================================== */
@media (prefers-reduced-motion: reduce) {
	.raditone-archive-card,
    .raditone-archive-card-image img,
    .raditone-archive-card-overlay,
    .raditone-archive-card-play,
    .raditone-archive-card-bar,
    .raditone-spinner {
		transition: none !important;
		animation: none !important;
	}

	.raditone-archive-card:hover,.raditone-archive-card:hover .raditone-archive-card-image img {
		transform: none;
	}
}

/* Focus Visible */
.raditone-view-btn:focus-visible,
.raditone-sort-select:focus-visible,
.raditone-archive-card-link:focus-visible {
	outline: 2px solid var(--primary);
	outline-offset: 2px;
	border-radius: 8px;
}

/* برای اطمینان از transition نرم */
:root,
body {
	transition: background-color 0.2s ease, color 0.2s ease;
}

/* کلاس موقت برای غیرفعال کردن transition در زمان تغییر تم */
#temp-no-transition,
#temp-no-transition * {
	transition: none !important;
}

/* اطمینان از نمایش صحیح آیکون‌ها */
#theme-toggle .light-icon,
#theme-toggle .dark-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

#theme-toggle .light-icon svg,
#theme-toggle .dark-icon svg {
	width: 22px;
	height: 22px;
}

/* ========== RADITONE ULTRA GLASS PLAYER - V4.0 ========== */

/* ========== ریشه و متغیرها ========== */
:root {
	--player-height: 90px;
	--mini-player-height: 65px;
	--radius-sm: 10px;
	--radius-md: 16px;
	--radius-lg: 24px;
	--radius-xl: 32px;
	--transition-fast: 0.2s ease;
	--transition-smooth: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	--shadow-sm: 0 4px 20px rgba(0, 0, 0, 0.1);
	--shadow-md: 0 8px 30px rgba(0, 0, 0, 0.15);
	--shadow-lg: 0 -8px 40px rgba(0, 0, 0, 0.2);
	--shadow-xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
	--blur-amount: 20px;
}

/* ========== اسکرول بار سفارشی ========== */
::-webkit-scrollbar {
	width: 4px;
}

::-webkit-scrollbar-track {
	background: var(--border-primary);
	border-radius: 10px;
}

::-webkit-scrollbar-thumb {
	background: linear-gradient(-135deg, #8b5cf6, #c084fc);
	border-radius: 10px;
}

/* ==============================================================
   استایل‌های کامل سیستم اعلانات رادیتون
   رسپانسیو کامل + پشتیبانی از موبایل
   ============================================================== */

/* ==================== متغیرهای CSS ==================== */
:root {
	--topbar-height: 60px;
	--topbar-height-mobile: 50px;
	--corner-width: 320px;
	--corner-width-mobile: 280px;
	--popup-z-index: 999999;
	--overlay-z-index: 999998;
	--animation-speed: 0.3s;
	--border-radius: 12px;
	--shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
	--shadow-heavy: 0 10px 40px rgba(0, 0, 0, 0.2);
}

/* ==================== رفع مشکلات نمایش ==================== */

/* رفع مشکل اعلان بالای سایت - جا باز کردن برای هدر */
body.raditone-topbar-active {
	padding-top: var(--topbar-height) !important;
	transition: padding-top 0.3s ease;
}

@media (max-width: 768px) {
	body.raditone-topbar-active {
		padding-top: var(--topbar-height-mobile) !important;
	}
}

/* اطمینان از بالاتر بودن اعلان از همه المان‌ها */
.raditone-topbar-notification {
	z-index: 9999999 !important;
 /* خیلی بالا */
	position: fixed !important;
}

.raditone-corner-notification {
	z-index: 9999998 !important;
 /* یک درجه پایین‌تر */
	position: fixed !important;
	isolation: isolate;
 /* ایزوله کردن از المان‌های دیگه */;
}

/* اطمینان از visibility گوشه‌ای */
.raditone-corner-notification.visible {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
}

/* رفع مشکل همپوشانی با المنتور و سایر افزونه‌ها */
.elementor-editor-active .raditone-topbar-notification,
.elementor-editor-active .raditone-corner-notification,
.fl-builder-edit .raditone-topbar-notification,
.fl-builder-edit .raditone-corner-notification {
	z-index: 9999999 !important;
}

/* ==================== استایل‌های عمومی ==================== */
.raditone-topbar-notification,
.raditone-corner-notification,
.raditone-popup-notification,
.raditone-popup-overlay {
	font-family: var(--font-iranyekan);
	box-sizing: border-box;
	direction: ltr;
}

/* ==================== اعلان بالای سایت ==================== */
.raditone-topbar-notification {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	width: 100%;
	min-height: var(--topbar-height);
	z-index: 10000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 20px;
	box-shadow: var(--shadow);
	transform: translateY(0);
	transition: transform var(--animation-speed) cubic-bezier(0.4, 0, 0.2, 1);
}

.raditone-topbar-notification.hidden {
	transform: translateY(-100%);
}

.raditone-topbar-notification.topbar-slide {
	animation: slideDown 0.5s ease;
}

.raditone-topbar-notification.topbar-fade {
	animation: fadeIn 0.5s ease;
}

.raditone-topbar-notification.topbar-bounce {
	animation: bounceDown 0.8s ease;
}

@keyframes slideDown {
	from {
		transform: translateY(-100%);
	}

	to {
		transform: translateY(0);
	}
}

@keyframes bounceDown {
	0% {
		transform: translateY(-100%);
	}

	50% {
		transform: translateY(10px);
	}

	70% {
		transform: translateY(-5px);
	}

	100% {
		transform: translateY(0);
	}
}

.topbar-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	max-width: 1200px;
	padding: 12px 0;
}

.topbar-content {
	flex: 1;
	padding: 0 15px;
	text-align: center;
	font-size: 15px;
	line-height: 1.5;
}

.topbar-content p,.topbar-close {
	margin: 0;
}

.topbar-close {
	background: rgba(255, 255, 255, 0.2);
	border: none;
	color: inherit;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all var(--animation-speed) ease;
	flex-shrink: 0;
	padding: 0;
}

.topbar-close:hover {
	background: rgba(255, 255, 255, 0.3);
	transform: rotate(-90deg);
}

.topbar-close.mobile-close {
	width: 40px;
	height: 40px;
	min-width: 40px;
	min-height: 40px;
}

.topbar-close.mobile-close svg {
	width: 24px;
	height: 24px;
}

/* ==================== اعلان گوشه‌ای ==================== */
.raditone-corner-notification {
	position: fixed;
	max-width: var(--corner-width);
	border-radius: var(--border-radius);
	background: white;
	box-shadow: var(--shadow-heavy);
	padding: 16px;
	margin: 15px;
	opacity: 0;
	visibility: hidden;
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	z-index: 99999;
	transform-origin: center;
}

.raditone-corner-notification.visible {
	opacity: 1;
	visibility: visible;
}

/* موقعیت‌های مختلف */
.raditone-corner-notification.position-top-left {
	top: 0;
	right: 0;
	transform: translate(20px, -20px) scale(0.9);
}

.raditone-corner-notification.position-top-right {
	top: 0;
	left: 0;
	transform: translate(-20px, -20px) scale(0.9);
}

.raditone-corner-notification.position-bottom-left {
	bottom: 0;
	right: 0;
	transform: translate(20px, 20px) scale(0.9);
}

.raditone-corner-notification.position-bottom-right {
	bottom: 0;
	left: 0;
	transform: translate(-20px, 20px) scale(0.9);
}

.raditone-corner-notification.position-top-center {
	top: 0;
	right: 50%;
	transform: translateX(50%) translateY(-20px) scale(0.9);
}

.raditone-corner-notification.position-bottom-center {
	bottom: 0;
	right: 50%;
	transform: translateX(50%) translateY(20px) scale(0.9);
}

.raditone-corner-notification.position-bottom-full {
	bottom: 0;
	right: 10px;
	left: 10px;
	max-width: none;
	width: calc(100% - 20px);
	transform: translateY(100%);
}

.raditone-corner-notification.visible.position-top-left,
.raditone-corner-notification.visible.position-top-right,
.raditone-corner-notification.visible.position-bottom-left,
.raditone-corner-notification.visible.position-bottom-right,
.raditone-corner-notification.visible.position-top-center,
.raditone-corner-notification.visible.position-bottom-center,
.raditone-corner-notification.visible.position-bottom-full {
	transform: translate(0, 0) scale(1);
}

/* استایل‌های مختلف */
.corner-badge {
	padding: 10px 20px;
	border-radius: 25px;
	font-size: 14px;
	font-weight: 500;
	background: linear-gradient(-135deg, #667eea, #764ba2);
	color: white;
}

.corner-bubble {
	border-radius: 20px 20px 5px 20px;
	padding: 15px 20px;
	position: relative;
	background: #f8f9fa;
	border: 1px solid #e9ecef;
}

.corner-bubble::before {
	content: '';
	position: absolute;
	bottom: -8px;
	left: 20px;
	width: 0;
	height: 0;
	border-right: 10px solid transparent;
	border-left: 10px solid transparent;
	border-top: 10px solid #f8f9fa;
}

.corner-card {
	border-radius: var(--border-radius);
	padding: 20px;
	border: 1px solid #e9ecef;
	background: white;
}

.corner-floating {
	animation: floatAnimation 3s ease-in-out infinite;
	background: linear-gradient(-135deg, #667eea, #764ba2);
	color: white;
}

@keyframes floatAnimation {
	0%, 100% {
		transform: translateY(0) scale(1);
	}

	50% {
		transform: translateY(-10px) scale(1.02);
	}
}

.corner-content {
	display: flex;
	align-items: center;
	gap: 12px;
}

.corner-icon {
	font-size: 22px;
	flex-shrink: 0;
	line-height: 1;
}

.corner-text {
	flex: 1;
	font-size: 15px;
	line-height: 1.5;
	color: #333;
}

.corner-floating .corner-text {
	color: white;
}

.corner-close {
	position: absolute;
	top: 8px;
	right: 8px;
	background: transparent;
	border: none;
	color: #6c757d;
	width: var(--close-size, 20px);
	height: var(--close-size, 20px);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	opacity: 0.6;
	transition: opacity var(--animation-speed);
	padding: 0;
	margin: 0;
	z-index: 2;
}

.corner-close:hover {
	opacity: 1;
}

.corner-floating .corner-close {
	color: rgba(255, 255, 255, 0.8);
}

.corner-floating .corner-close:hover {
	color: white;
}

.corner-progress {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: rgba(0, 0, 0, 0.1);
	border-radius: 0 0 var(--border-radius) var(--border-radius);
	overflow: hidden;
}

.corner-progress::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background: linear-gradient(-90deg, #667eea, #764ba2);
	animation: progressBar linear forwards;
}

@keyframes progressBar {
	from {
		transform: translateX(0);
	}

	to {
		transform: translateX(-100%);
	}
}

/* ==================== پاپ‌آپ ==================== */
.raditone-popup-overlay {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.75);
	backdrop-filter: blur(5px);
	z-index: var(--overlay-z-index);
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--animation-speed) ease;
	-webkit-backdrop-filter: blur(5px);
}

.raditone-popup-overlay.visible {
	opacity: 1;
	visibility: visible;
}

.raditone-popup-notification {
	position: fixed;
	top: 50%;
	right: 50%;
	transform: translate(50%, -50%) scale(0.9);
	background: white;
	border-radius: calc(var(--border-radius) + 4px);
	box-shadow: var(--shadow-heavy);
	z-index: var(--popup-z-index);
	opacity: 0;
	visibility: hidden;
	transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.raditone-popup-notification.visible {
	opacity: 1;
	visibility: visible;
	transform: translate(50%, -50%) scale(1);
}

/* سایزهای مختلف */
.raditone-popup-notification.popup-small {
	width: 90%;
	max-width: 400px;
	max-height: 80vh;
}

.raditone-popup-notification.popup-medium {
	width: 90%;
	max-width: 600px;
	max-height: 85vh;
}

.raditone-popup-notification.popup-large {
	width: 90%;
	max-width: 800px;
	max-height: 90vh;
}

.raditone-popup-notification.popup-full,
.raditone-popup-notification.popup-fullscreen {
	width: 95%;
	height: 95%;
	max-width: 1200px;
	max-height: 95vh;
}

.popup-header {
	padding: 20px 25px;
	border-bottom: 1px solid #e9ecef;
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: linear-gradient(-135deg, #667eea 0%, #764ba2 100%);
	color: white;
	flex-shrink: 0;
}

.popup-title {
	font-size: 1.5rem;
	font-weight: 600;
}

.popup-title,.popup-close {
	margin: 0;
	color: white;
}

.popup-close {
	background: rgba(255, 255, 255, 0.2);
	border: none;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all var(--animation-speed) ease;
	padding: 0;
	flex-shrink: 0;
}

.popup-close:hover {
	background: rgba(255, 255, 255, 0.3);
	transform: rotate(-90deg);
}

.popup-close.mobile-close {
	width: 48px;
	height: 48px;
}

.popup-close.mobile-close svg {
	width: 28px;
	height: 28px;
}

.popup-body {
	padding: 25px;
	overflow-y: auto;
	flex: 1;
	-webkit-overflow-scrolling: touch;
}

.popup-body::-webkit-scrollbar {
	width: 6px;
}

.popup-body::-webkit-scrollbar-track {
	background: #f1f1f1;
	border-radius: 3px;
}

.popup-body::-webkit-scrollbar-thumb {
	background: #c1c1c1;
	border-radius: 3px;
}

.popup-body::-webkit-scrollbar-thumb:hover {
	background: #a1a1a1;
}

.popup-footer {
	padding: 20px 25px;
	border-top: 1px solid #e9ecef;
	display: flex;
	gap: 12px;
	justify-content: flex-end;
	flex-shrink: 0;
}

.popup-action-btn,
.popup-dont-show {
	padding: 12px 24px;
	border-radius: 8px;
	border: none;
	cursor: pointer;
	font-weight: 500;
	font-size: 16px;
	transition: all var(--animation-speed) ease;
	font-family: inherit;
}

.btn-primary {
	background: linear-gradient(-135deg, #667eea 0%, #764ba2 100%);
	color: white;
}

.btn-primary:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(102, 126, 234, 0.4);
}

.btn-secondary {
	background: #6c757d;
	color: white;
}

.btn-secondary:hover {
	background: #5a6268;
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(108, 117, 125, 0.3);
}

.popup-swipe-indicator {
	position: absolute;
	top: 10px;
	right: 0;
	left: 0;
	text-align: center;
	color: #6c757d;
	font-size: 12px;
	opacity: 0.7;
	pointer-events: none;
	animation: pulse 2s infinite;
}

@keyframes pulse {
	0%, 100% {
		opacity: 0.7;
	}

	50% {
		opacity: 0.3;
	}
}

/* انیمیشن‌های پاپ‌آپ */
.raditone-popup-notification.popup-fade.visible {
	animation: popupFadeIn 0.4s ease;
}

@keyframes popupFadeIn {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

.raditone-popup-notification.popup-slide.visible {
	animation: popupSlideIn 0.4s ease;
}

@keyframes popupSlideIn {
	from {
		transform: translate(50%, -40%);
		opacity: 0;
	}

	to {
		transform: translate(50%, -50%);
		opacity: 1;
	}
}

.raditone-popup-notification.popup-zoom.visible {
	animation: popupZoomIn 0.4s ease;
}

@keyframes popupZoomIn {
	from {
		transform: translate(50%, -50%) scale(0.5);
		opacity: 0;
	}

	to {
		transform: translate(50%, -50%) scale(1);
		opacity: 1;
	}
}

.raditone-popup-notification.popup-bounce.visible {
	animation: popupBounceIn 0.6s ease;
}

@keyframes popupBounceIn {
	0% {
		transform: translate(50%, -50%) scale(0.3);
		opacity: 0;
	}

	50% {
		transform: translate(50%, -50%) scale(1.05);
	}

	70% {
		transform: translate(50%, -50%) scale(0.9);
	}

	100% {
		transform: translate(50%, -50%) scale(1);
		opacity: 1;
	}
}

.raditone-popup-notification.popup-flip.visible {
	animation: popupFlipIn 0.6s ease;
}

@keyframes popupFlipIn {
	from {
		transform: translate(50%, -50%) rotateY(-90deg);
		opacity: 0;
	}

	to {
		transform: translate(50%, -50%) rotateY(0);
		opacity: 1;
	}
}

/* ==================== رسپانسیو کامل ==================== */

/* تبلت (768px به پایین) */
@media (max-width: 768px) {
	:root {
		--topbar-height: var(--topbar-height-mobile);
		--corner-width: var(--corner-width-mobile);
	}

	.raditone-mini-fullscreen {
		display: flex !important;
	}

	.raditone-topbar-notification {
		padding: 0 15px;
		min-height: var(--topbar-height-mobile);
	}

	.topbar-inner {
		padding: 8px 0;
	}

	.topbar-content {
		font-size: 14px;
		padding: 0 10px;
	}

	.raditone-corner-notification {
		margin: 10px;
		padding: 14px;
	}

	.corner-content {
		gap: 10px;
	}

	.corner-icon {
		font-size: 20px;
	}

	.corner-text {
		font-size: 14px;
	}

	.popup-header {
		padding: 15px 20px;
	}

	.popup-title {
		font-size: 1.3rem;
	}

	.popup-body {
		padding: 20px;
	}

	.popup-footer {
		padding: 15px 20px;
		flex-direction: column;
	}

	.popup-action-btn,
    .popup-dont-show {
		width: 100%;
		padding: 14px;
		font-size: 15px;
	}

	.raditone-popup-notification.popup-small,
    .raditone-popup-notification.popup-medium,
    .raditone-popup-notification.popup-large {
		width: 95%;
		max-height: 85vh;
	}

	.raditone-popup-notification.popup-fullscreen {
		width: 100%;
		height: 100%;
		max-width: none;
		max-height: none;
		border-radius: 0;
	}

	.popup-swipe-indicator {
		font-size: 11px;
		top: 5px;
	}
}

/* موبایل (576px به پایین) */
@media (max-width: 576px) {
	.raditone-topbar-notification {
		padding: 0 10px;
	}

	.topbar-content {
		font-size: 13px;
	}

	.raditone-corner-notification {
		max-width: calc(100% - 20px);
	}

	.raditone-corner-notification.position-bottom-full {
		right: 5px;
		left: 5px;
		width: calc(100% - 10px);
		margin: 10px 5px;
	}

	.corner-bubble::before {
		display: none;
	}

	.corner-content {
		flex-direction: row;
		align-items: flex-start;
	}

	.popup-header {
		padding: 12px 15px;
	}

	.popup-title {
		font-size: 1.2rem;
	}

	.popup-body {
		padding: 15px;
		font-size: 14px;
	}

	.popup-footer {
		padding: 12px 15px;
		gap: 8px;
	}

	.raditone-popup-notification.popup-small,
    .raditone-popup-notification.popup-medium {
		width: 98%;
		max-height: 90vh;
	}
}

/* حالت‌های نمایش در موبایل */

.notification-topbar-mobile-hide .raditone-topbar-notification,.notification-corner-mobile-hide .raditone-corner-notification,.notification-popup-mobile-hide .raditone-popup-notification,.notification-popup-mobile-hide .raditone-popup-overlay,.notifications-mobile-hide-all .raditone-topbar-notification,.notifications-mobile-hide-all .raditone-corner-notification,.notifications-mobile-hide-all .raditone-popup-notification,.notifications-mobile-hide-all .raditone-popup-overlay {
	display: none !important;
}

/* ==================== پشتیبانی از لمسی ==================== */
@media (hover: none) and (pointer: coarse) {
    
	.topbar-close,.corner-close,.popup-close,.popup-action-btn,.popup-dont-show,.corner-close {
		min-height: 44px;
		min-width: 44px;
	}

	.raditone-popup-notification {
		-webkit-tap-highlight-color: transparent;
	}

	.popup-body a,
    .popup-body button {
		font-size: 16px;
 /* جلوگیری از زوم در iOS */;
	}
}

/* ==================== پشتیبانی از دستگاه‌های قدیمی ==================== */
@media (max-width: 320px) {
    
	.raditone-topbar-notification,.topbar-content {
		padding: 0 5px;
	}

	.topbar-content {
		font-size: 12px;
	}

	.topbar-close.mobile-close {
		width: 36px;
		height: 36px;
		min-width: 36px;
		min-height: 36px;
	}

	.raditone-corner-notification {
		margin: 5px;
		padding: 12px;
	}

	.popup-header,
    .popup-body,
    .popup-footer {
		padding: 10px;
	}
}

/* ==================== حالت‌های خاص ==================== */
.raditone-mobile .raditone-corner-notification.position-bottom-full {
	animation: slideUpMobile 0.4s ease;
}

@keyframes slideUpMobile {
	from {
		transform: translateY(100%);
	}

	to {
		transform: translateY(0);
	}
}

/* بارگذاری نرم */
.raditone-topbar-notification,
.raditone-corner-notification,
.raditone-popup-notification {
	will-change: transform, opacity;
	backface-visibility: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* حالت‌های دسکتاپ */
@media (min-width: 769px) {
	.raditone-corner-notification:hover {
		transform: translate(0, 0) scale(1.02);
		box-shadow: 0 15px 50px rgba(0, 0, 0, 0.25);
	}

	.raditone-corner-notification.position-bottom-full:hover {
		transform: translateY(0) scale(1.02);
	}
}

/* پشتیبانی از تاریکی (Dark Mode) - حذف شده، فقط light mode */



/*---------------------------------- Music Card 1 -----------------------------------*/
@property --hue {
	syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

@property --rotate {
	syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

@property --bg-y {
	syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

@property --bg-x {
	syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

@property --glow-translate-y {
	syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

@property --bg-size {
	syntax: "<number>";
  inherits: true;
  initial-value: 1;
}

@property --glow-opacity {
	syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

@property --glow-blur {
	syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

@property --glow-scale {
	syntax: "<number>";
  inherits: true;
  initial-value: 2;
}

@property --glow-radius {
	syntax: "<number>";
  inherits: true;
  initial-value: 2;
}

@property --white-shadow {
	syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

:root {
	--music-card-light-bg: var(--bg-primary);
	--music-card-dark-bg: var(--bg-secondary);
	--music-card-light-text: var(--text-secondary);
	--music-card-dark-text: var(--text-primary);
	--music-card-radius: 1rem;
	--music-card-width: 100%;
	--music-card-border-width: 2px;
	--music-card-bg-size: 1;
	--music-card-hue: 0;
	--music-card-hue-speed: 1;
	--music-card-rotate: 0;
	--music-card-animation-speed: 4s;
	--music-card-interaction-speed: 0.35s;
	--music-card-glow-scale: 1.5;
	--music-card-scale-factor: 1;
	--music-card-glow-blur: 6;
	--music-card-glow-opacity: 0;
	--music-card-glow-radius: 100;
	--music-card-glow-rotate-unit: 1deg;
	--music-card-shadow: var(--shadow);
	--music-card-shadow-hover: var(--shadow-lg);
}

.music-card-wrapper {
	width: var(--music-card-width);
	height: 350px;
	display: block;
	position: relative;
	z-index: 1;
	border-radius: var(--music-card-radius);
	cursor: pointer;
	text-decoration: none;
}

.card-container {
	position: relative;
	width: 100%;
	height: 100%;
}

/* استایل‌های بوردر روز */
.day-border {
	background: linear-gradient(
    -45deg,
    #667eea 0%,
    #764ba2 50%,
    #f093fb 100%
  );
	background-size: 200% 200%;
	animation: gradientDay 3s ease infinite;
	opacity: 1;
}

/* استایل‌های بوردر شب */
.day-border,.night-border {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	border-radius: var(--music-card-radius);
	padding: 2px;
	z-index: 1;
	transition: opacity 0.3s ease;
}

.night-border {
	background: linear-gradient(
    -45deg,
    #0f2027 0%,
    #203a43 50%,
    #2c5364 100%
  );
	background-size: 200% 200%;
	animation: gradientNight 4s ease infinite;
}

/* حالت تاریک - نمایش بوردر شب */
.night-border,.dark .day-border {
	opacity: 0;
}

.dark .night-border {
	opacity: 1;
}

@keyframes gradientDay {
	0% {
		background-position: 100% 50%;
	}

	50% {
		background-position: 0% 50%;
	}

	100% {
		background-position: 100% 50%;
	}
}

@keyframes gradientNight {
	0% {
		background-position: 100% 50%;
	}

	50% {
		background-position: 0% 50%;
	}

	100% {
		background-position: 100% 50%;
	}
}

.card-inner {
	background: var(--bg-primary);
	position: relative;
	width: 100%;
	height: 100%;
	border-radius: calc(var(--music-card-radius) * 0.9);
	display: flex;
	flex-direction: column;
	font-weight: 600;
	font-size: clamp(0.85rem, 1.5vw, 1rem);
	color: var(--text-primary);
	z-index: 2;
	overflow: hidden;
	transition: all var(--music-card-interaction-speed) cubic-bezier(0.4, 0, 0.2, 1);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08),
    0 4px 20px rgba(0, 0, 0, 0.04);
}

.dark .card-inner {
	background: var(--music-card-dark-bg);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15),
    0 4px 20px rgba(0, 0, 0, 0.08);
}

/* افکت hover اصلی */
.music-card-wrapper:hover .card-inner {
	transform: translateY(-8px);
	box-shadow: var(--music-card-shadow-hover);
}

.music-card-wrapper:hover .day-border {
	animation-duration: 1.5s;
	background-size: 400% 400%;
}

.dark .music-card-wrapper:hover .night-border {
	animation-duration: 2s;
	background-size: 400% 400%;
}

.cover-image {
	width: 100%;
	height: 65%;
	object-fit: cover;
	border-radius: calc(var(--music-card-radius) * 0.9) calc(var(--music-card-radius) * 0.9) 0 0;
	transition: all var(--music-card-interaction-speed) cubic-bezier(0.4, 0, 0.2, 1);
	filter: brightness(0.95) saturate(0.9);
}

.music-card-wrapper:hover .cover-image {
	transform: scale(1.03);
	filter: brightness(1.05) saturate(1.1);
}

.content-section {
	flex: 1;
	padding: 1rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: relative;
	z-index: 2;
}

.content-section,.dark .content-section {
	background: linear-gradient(to top, var(--bg-primary) 10%, var(--bg-secondary) 100%);
}

.music-info {
	margin-bottom: 0.5rem;
	position: relative;
	z-index: 2;
}

.track-title {
	color: var(--text-primary);
	font-size: 1.1rem;
	font-weight: 700;
	margin-bottom: 0.2rem;
	line-height: 1.3;
}

.track-title,.artist-name {
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	position: relative;
	z-index: 2;
}

.artist-name {
	color: var(--text-secondary);
	font-size: 0.9rem;
	font-weight: 500;
}

.card-footer {
	border-top: 1px solid var(--border-primary);
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: 0.5rem;
	margin-top: auto;
}

.card-footer,.music-style {
	position: relative;
	z-index: 2;
}

.music-style {
	background: var(--primary-light);
	color: var(--primary);
	font-size: 0.8rem;
	font-weight: 600;
	padding: 0.2rem 0.6rem;
	border-radius: 1rem;
	transition: all var(--music-card-interaction-speed) ease;
}

.music-card-wrapper:hover .music-style {
	transform: scale(1.05);
	box-shadow: 0 2px 8px rgba(var(--primary-rgb, 59, 130, 246), 0.3);
}

.post-date {
	color: var(--text-tertiary);
	font-size: 0.8rem;
	transition: all var(--music-card-interaction-speed) ease;
	position: relative;
	z-index: 2;
}

.music-card-wrapper:hover .post-date {
	color: var(--primary);
}

/* Responsive */
@media (max-width: 1200px) {
	.music-card-wrapper {
		height: 320px;
	}
}

@media (max-width: 992px) {
	.music-card-wrapper {
		height: 300px;
	}

	.track-title {
		font-size: 1rem;
	}

	.cover-image {
		height: 60%;
	}
}

@media (max-width: 768px) {
	.music-card-wrapper {
		height: 280px;
	}

	.track-title {
		font-size: 0.95rem;
	}

	.artist-name {
		font-size: 0.85rem;
	}

	.content-section {
		padding: 0.75rem;
	}
}

@media (max-width: 480px) {
	.music-card-wrapper {
		height: 260px;
	}

	.track-title {
		font-size: 0.9rem;
	}

	.artist-name {
		font-size: 0.8rem;
	}

	.music-style,
  .post-date {
		font-size: 0.75rem;
	}

	.cover-image {
		height: 55%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.day-border,
  .night-border,
  .music-card-wrapper:hover .day-border,
  .dark .music-card-wrapper:hover .night-border {
		animation: none;
	}

	.music-card-wrapper:hover .card-inner,
  .music-card-wrapper:hover .cover-image,
  .music-card-wrapper:hover .music-style {
		transform: none;
		transition: none;
	}
}
/*---------------------------------- Music Card 2 -----------------------------------*/

/*---------------------------------- Music Card 3 -----------------------------------*/
.vertical-music-card {
	background: linear-gradient(to top, var(--bg-primary) 10%, var(--bg-secondary) 100%);
}

.vertical-music-card .footer-content {
	color: var(--text-primary) !important;
}

.vertical-music-card .footer-content .icon {
	position: absolute;
	bottom: 0;
	right: 0;
}
/*---------------------------------- Music Card 4 -----------------------------------*/

/*---------------------------------- Music Card 5 -----------------------------------*/

/*---------------------------------- Taxonomy Card -----------------------------------*/
.taxonomy-card::before {
	padding: 4px !important;
}
/*---------------------------------- Radio Card 1 -----------------------------------*/
.radiocard-1 {
	background: var(--bg-primary);
	border: 1px solid var(--border-primary);
	border-radius: 10px;
	overflow: hidden;
	transition: all 0.2s ease;
	height: 100%;
	display: flex;
	flex-direction: column;
	position: relative;
}

.radiocard-1:hover {
	border-color: var(--primary);
	box-shadow: 0 5px 15px rgba(0,0,0,0.08);
	transform: translateY(-2px);
}

.radiocard-1.live {
	border-color: var(--danger);
}

.radiocard-1 .cover {
	height: 160px;
	position: relative;
	overflow: hidden;
}

.radiocard-1 .cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s ease;
}

.radiocard-1:hover .cover img {
	transform: scale(1.03);
}

.radiocard-1 .status-badge {
	position: absolute;
	top: 10px;
	left: 10px;
	color: white;
	padding: 4px 10px;
	border-radius: 4px;
	font-size: 12px;
	font-weight: 600;
	z-index: 2;
}

.radiocard-1 .status-badge,.radiocard-1.live .status-badge {
	background: var(--danger);
}

.radiocard-1:not(.live) .status-badge {
	background: var(--text-tertiary);
}

.radiocard-1 .play-btn {
	position: absolute;
	bottom: 15px;
	right: 15px;
	width: 36px;
	height: 36px;
	background: var(--primary);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-size: 14px;
	box-shadow: 0 3px 10px rgba(0,0,0,0.2);
	z-index: 2;
	cursor: pointer;
	transition: all 0.2s ease;
	border: none;
}

.radiocard-1 .play-btn:hover {
	background: var(--primary-hover);
	transform: scale(1.1);
}

.radiocard-1 .content {
	padding: 15px;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.radiocard-1 .title {
	font-size: 16px;
	font-weight: 600;
	margin: 0 0 10px 0;
	color: var(--text-primary);
	line-height: 1.4;
}

.radiocard-1 .meta {
	display: flex;
	gap: 15px;
	margin-bottom: 10px;
	font-size: 13px;
	color: var(--text-secondary);
}

.radiocard-1 .meta span {
	display: flex;
	align-items: center;
	gap: 5px;
}

.radiocard-1 .meta .dashicons {
	width: 16px;
	height: 16px;
	font-size: 16px;
}

.radiocard-1 .genre {
	margin-top: auto;
	padding: 6px 12px;
	background: var(--primary-light);
	color: var(--primary);
	border-radius: 6px;
	font-size: 13px;
	font-weight: 500;
	width: fit-content;
	border: 1px solid rgba(var(--primary-rgb), 0.2);
}

.radiocard-1 .listeners-count {
	position: absolute;
	top: 10px;
	right: 10px;
	background: rgba(0,0,0,0.7);
	color: white;
	padding: 4px 8px;
	border-radius: 4px;
	font-size: 12px;
	font-weight: 500;
	z-index: 2;
	display: flex;
	align-items: center;
	gap: 4px;
}

.radiocard-1 .listeners-count .dashicons {
	font-size: 12px;
	width: 12px;
	height: 12px;
}

@media (max-width: 768px) {
	.radiocard-1 .cover {
		height: 140px;
	}

	.radiocard-1 .content {
		padding: 12px;
	}

	.radiocard-1 .meta {
		flex-direction: column;
		gap: 8px;
	}
}
/*---------------------------------- Radio Card 2 -----------------------------------*/
.radiocard-2 {
	background: var(--bg-primary);
	border-radius: 16px;
	overflow: hidden;
	position: relative;
	height: 100%;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	box-shadow: 0 2px 8px rgba(0,0,0,0.06);
	border: 1px solid var(--border-primary);
}

.radiocard-2:hover {
	transform: translateY(-5px);
	box-shadow: 0 12px 24px rgba(var(--primary-rgb), 0.15);
	border-color: var(--primary);
}

.radiocard-2.live::after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 4px;
	background: linear-gradient(-90deg, var(--danger), #ff6b6b);
	z-index: 3;
}

.radiocard-2 .card-inner {
	height: 100%;
	display: flex;
	flex-direction: column;
}

.radiocard-2 .image-section {
	height: 180px;
	position: relative;
	overflow: hidden;
}

.radiocard-2 .image-section::before {
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
	height: 50%;
	background: linear-gradient(to top, var(--bg-primary), transparent);
	z-index: 1;
}

.radiocard-2 .cover-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.radiocard-2:hover .cover-image {
	transform: scale(1.08);
}

.radiocard-2 .live-indicator {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 2;
	display: flex;
	align-items: center;
	gap: 6px;
	background: rgba(0,0,0,0.7);
	backdrop-filter: blur(10px);
	padding: 6px 12px;
	border-radius: 20px;
	color: white;
	font-size: 12px;
	font-weight: 600;
}

.radiocard-2 .live-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--danger);
	animation: pulse 1.5s infinite;
}

@keyframes pulse {
	0%, 100% {
		opacity: 1;
	}

	50% {
		opacity: 0.5;
	}
}

.radiocard-2 .stats-overlay {
	position: absolute;
	bottom: 12px;
	right: 12px;
	left: 12px;
	z-index: 2;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.radiocard-2 .listener-count {
	background: rgba(var(--primary-rgb), 0.9);
	color: white;
	padding: 6px 12px;
	font-size: 12px;
	font-weight: 500;
	display: flex;
	align-items: center;
	gap: 5px;
}

.radiocard-2 .listener-count,.radiocard-2 .quality-tag {
	border-radius: 20px;
	backdrop-filter: blur(10px);
}

.radiocard-2 .quality-tag {
	background: rgba(255,255,255,0.9);
	color: var(--text-primary);
	padding: 6px 10px;
	font-size: 11px;
	font-weight: 600;
}

.dark .radiocard-2 .quality-tag {
	background: rgba(255,255,255,0.15);
	color: white;
}

.radiocard-2 .content-section {
	padding: 16px;
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.radiocard-2 .radio-title {
	font-size: 18px;
	font-weight: 700;
	color: var(--text-primary);
	margin: 0;
	line-height: 1.4;
}

.radiocard-2 .genre-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--primary-light);
	color: var(--primary);
	padding: 8px 14px;
	border-radius: 10px;
	font-size: 13px;
	font-weight: 500;
	width: fit-content;
	border: 1px solid rgba(var(--primary-rgb), 0.2);
}

.radiocard-2 .genre-chip .dashicons {
	width: 16px;
	height: 16px;
	font-size: 16px;
}

.radiocard-2 .action-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: auto;
	padding-top: 12px;
	border-top: 1px solid var(--border-primary);
}

.radiocard-2 .play-action {
	display: flex;
	align-items: center;
	gap: 8px;
	background: var(--primary);
	color: white;
	padding: 8px 16px;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.2s ease;
	border: none;
	text-decoration: none;
}

.radiocard-2 .play-action:hover {
	background: var(--primary-hover);
	transform: translateX(-3px);
}

.radiocard-2 .status-info {
	font-size: 12px;
	color: var(--text-secondary);
	display: flex;
	align-items: center;
	gap: 5px;
}

.radiocard-2 .status-info .dashicons {
	color: var(--primary);
}

/* حالت آفلاین */
.radiocard-2:not(.live) .live-indicator {
	background: rgba(0,0,0,0.5);
}

.radiocard-2:not(.live) .live-dot {
	background: var(--text-tertiary);
	animation: none;
}

.radiocard-2:not(.live) .play-action {
	background: var(--text-tertiary);
	cursor: not-allowed;
	opacity: 0.7;
}

.radiocard-2:not(.live) .play-action:hover {
	transform: none;
	background: var(--text-tertiary);
}

@media (max-width: 768px) {
	.radiocard-2 .image-section {
		height: 160px;
	}

	.radiocard-2 .content-section {
		padding: 14px;
	}

	.radiocard-2 .radio-title {
		font-size: 16px;
	}

	.action-bar {
		flex-direction: column;
		gap: 10px;
		align-items: stretch;
	}

	.radiocard-2 .play-action {
		justify-content: center;
	}
}
/*---------------------------------- Radio Card 3 -----------------------------------*/
.radiocard-3 {
	display: flex;
	background: var(--bg-primary);
	border-radius: 12px;
	overflow: hidden;
	border: 1px solid var(--border-primary);
	transition: all 0.3s ease;
	height: 140px;
	position: relative;
}

.radiocard-3:hover {
	border-color: var(--primary);
	box-shadow: 0 6px 20px rgba(var(--primary-rgb), 0.1);
	transform: translateY(-2px);
}

.radiocard-3.live::after {
	content: '';
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	width: 3px;
	background: var(--danger);
}

.radiocard-3 .image-container {
	width: 140px;
	min-width: 140px;
	position: relative;
	overflow: hidden;
}

.radiocard-3 .image-container img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.radiocard-3:hover .image-container img {
	transform: scale(1.05);
}

.radiocard-3 .live-indicator {
	position: absolute;
	top: 8px;
	right: 8px;
	background: var(--danger);
	color: white;
	padding: 3px 8px;
	border-radius: 4px;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.5px;
	text-transform: uppercase;
}

.radiocard-3 .play-overlay {
	position: absolute;
	inset: 0;
	background: rgba(var(--primary-rgb), 0.9);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.radiocard-3:hover .play-overlay {
	opacity: 1;
}

.radiocard-3 .play-button {
	width: 40px;
	height: 40px;
	background: white;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--primary);
	font-size: 14px;
	cursor: pointer;
	transition: transform 0.2s ease;
}

.radiocard-3 .play-button:hover {
	transform: scale(1.1);
}

.radiocard-3 .content {
	flex: 1;
	padding: 7px;
	flex-direction: column;
	background: var(--bg-primary);
}

.radiocard-3 .content,.radiocard-3 .top-section {
	display: flex;
	justify-content: space-between;
}

.radiocard-3 .top-section {
	align-items: flex-start;
	margin-bottom: 12px;
}

.radiocard-3 .title {
	font-size: 16px;
	font-weight: 600;
	color: var(--text-primary);
	margin: 0;
	line-height: 1.4;
	flex: 1;
	padding-left: 10px;
}

.radiocard-3 .genre {
	background: var(--primary-light);
	color: var(--primary);
	padding: 4px 10px;
	border-radius: 6px;
	font-size: 11px;
	font-weight: 600;
	white-space: nowrap;
}

.radiocard-3 .middle-section {
	display: flex;
	gap: 20px;
	margin-bottom: 12px;
}

.radiocard-3 .stat-item {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: var(--text-secondary);
}

.radiocard-3 .stat-item .icon {
	width: 14px;
	height: 14px;
	color: var(--primary);
}

.radiocard-3 .bottom-section {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: 12px;
	border-top: 1px solid var(--border-primary);
}

.radiocard-3 .quality {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	color: var(--text-tertiary);
}

.radiocard-3 .quality-value {
	color: var(--primary);
	font-weight: 600;
	font-size: 13px;
}

.radiocard-3 .action-link {
	color: var(--primary);
	text-decoration: none;
	font-size: 13px;
	font-weight: 500;
	display: flex;
	align-items: center;
	gap: 4px;
	transition: color 0.2s ease;
}

.radiocard-3 .action-link:hover {
	color: var(--primary-hover);
}

.radiocard-3 .action-link .icon {
	font-size: 12px;
	transition: transform 0.2s ease;
}

.radiocard-3 .action-link:hover .icon {
	transform: translateX(-3px);
}

@media (max-width: 768px) {
	.radiocard-3 {
		flex-direction: column;
		height: auto;
	}

	.radiocard-3 .image-container {
		width: 100%;
		height: 140px;
		min-width: auto;
	}

	.radiocard-3 .content {
		padding: 12px;
	}

	.radiocard-3 .middle-section {
		flex-direction: column;
		gap: 8px;
	}

	.radiocard-3.live::after {
		top: 0;
		right: 0;
		left: 0;
		width: auto;
		height: 3px;
	}
}
/*---------------------------------- Blog Card 1 -----------------------------------*/
.blogcard-1 {
	background: var(--bg-primary);
	border-radius: 16px;
	overflow: hidden;
	border: 1px solid var(--border-primary);
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	height: 100%;
	display: flex;
	flex-direction: column;
	position: relative;
}

.blogcard-1:hover {
	transform: translateY(-6px);
	box-shadow: 0 15px 35px rgba(0,0,0,0.1);
	border-color: var(--primary);
}

.blogcard-1.featured {
	border-right: 4px solid var(--danger);
}

.blogcard-1.hot::before {
	content: '🔥';
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 3;
	font-size: 18px;
	filter: drop-shadow(0 2px 4px rgba(0,0,0,0.3));
}

.blogcard-1 .header-section {
	position: relative;
	height: 200px;
	overflow: hidden;
}

.blogcard-1 .header-section::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, transparent 50%, var(--bg-primary) 90%);
	z-index: 1;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.blogcard-1:hover .header-section::before {
	opacity: 1;
}

.blogcard-1 .cover-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease;
}

.blogcard-1:hover .cover-image {
	transform: scale(1.08);
}

.blogcard-1 .type-badge {
	left: 15px;
	background: var(--primary);
	color: var(--text-dark-bg);
	padding: 6px 14px;
	border-radius: 20px;
	font-size: 12px;
	font-weight: 600;
	border: 1px solid rgba(255,255,255,0.2);
	display: flex;
	align-items: center;
	gap: 6px;
}

.blogcard-1 .type-badge,.blogcard-1 .category-tag {
	position: absolute;
	top: 15px;
	z-index: 2;
	backdrop-filter: blur(10px);
}

.blogcard-1 .category-tag {
	right: 15px;
	background: rgba(0,0,0,0.7);
	color: white;
	padding: 6px 12px;
	border-radius: 20px;
	font-size: 11px;
	font-weight: 500;
	border: 1px solid rgba(255,255,255,0.1);
}

.blogcard-1 .content-section {
	padding: 20px;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.blogcard-1 .title-wrapper {
	margin-bottom: 12px;
}

.blogcard-1 .title {
	font-size: 18px;
	font-weight: 700;
	color: var(--text-primary);
	margin: 0 0 10px 0;
	line-height: 1.4;
	transition: color 0.2s ease;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.blogcard-1:hover .title {
	color: var(--primary);
}

.blogcard-1 .excerpt {
	font-size: 14px;
	color: var(--text-secondary);
	line-height: 1.5;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.blogcard-1 .author-section {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 16px 0;
	padding: 12px 0;
	border-top: 1px solid var(--border-primary);
	border-bottom: 1px solid var(--border-primary);
}

.blogcard-1 .author-avatar {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-size: 16px;
	font-weight: 600;
}

.blogcard-1 .author-info {
	flex: 1;
}

.blogcard-1 .author-name {
	font-size: 14px;
	font-weight: 600;
	color: var(--text-primary);
	margin: 0 0 4px 0;
}

.blogcard-1 .post-meta {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 12px;
	color: var(--text-tertiary);
}

.blogcard-1 .meta-item {
	display: flex;
	align-items: center;
	gap: 4px;
}

.blogcard-1 .stats-section {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: auto;
}

.blogcard-1 .interaction-stats {
	display: flex;
	align-items: center;
	gap: 20px;
}

.blogcard-1 .stat {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: var(--text-secondary);
}

.blogcard-1 .stat i {
	font-size: 16px;
	color: var(--primary);
}

.blogcard-1 .read-more {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--primary);
	text-decoration: none;
	font-size: 14px;
	font-weight: 600;
	padding: 8px 16px;
	border-radius: 8px;
	background: var(--primary-light);
	border: 1px solid rgba(var(--primary-rgb), 0.2);
	transition: all 0.2s ease;
}

.blogcard-1 .read-more:hover {
	background: var(--primary);
	color: white;
	transform: translateX(3px);
}

.blogcard-1 .read-more i {
	font-size: 14px;
	transition: transform 0.2s ease;
}

.blogcard-1 .read-more:hover i {
	transform: translateX(3px);
}

.blogcard-1 .time-ago {
	left: 15px;
	background: var(--bg-secondary);
	border-radius: 12px;
	color: var(--text-tertiary);
	border: 1px solid var(--border-primary);
}

.blogcard-1 .time-ago,.blogcard-1 .reading-time-badge {
	position: absolute;
	bottom: 15px;
	padding: 4px 10px;
	font-size: 11px;
	z-index: 2;
}

.blogcard-1 .reading-time-badge {
	right: 15px;
	background: rgba(0,0,0,0.7);
	color: white;
	border-radius: 12px;
	font-weight: 500;
	backdrop-filter: blur(10px);
	border: 1px solid rgba(255,255,255,0.1);
	display: flex;
	align-items: center;
	gap: 4px;
}

@media (max-width: 768px) {
	.blogcard-1 .header-section {
		height: 180px;
	}

	.blogcard-1 .content-section {
		padding: 16px;
	}

	.blogcard-1 .title {
		font-size: 16px;
	}

	.blogcard-1 .stats-section {
		flex-direction: column;
		gap: 12px;
		align-items: flex-start;
	}

	.blogcard-1 .interaction-stats {
		width: 100%;
		justify-content: space-between;
	}
}
/*---------------------------------- Blog Card 2 -----------------------------------*/
.blogcard-2 {
	display: flex;
	background: var(--bg-primary);
	border-radius: 16px;
	overflow: hidden;
	border: 1px solid var(--border-primary);
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	height: 180px;
	position: relative;
}

.blogcard-2:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 30px rgba(0,0,0,0.1);
	border-color: var(--primary);
}

.blogcard-2.featured {
	border-right: 4px solid var(--danger);
}

.blogcard-2 .image-side {
	width: 180px;
	min-width: 180px;
	position: relative;
	overflow: hidden;
}

.blogcard-2 .image-side img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease;
}

.blogcard-2:hover .image-side img {
	transform: scale(1.08);
}

.blogcard-2 .image-side::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to left, var(--bg-primary) 0%, transparent 30%);
	z-index: 1;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.blogcard-2:hover .image-side::before {
	opacity: 0.3;
}

.blogcard-2 .category-badge {
	position: absolute;
	top: 12px;
	left: 12px;
	background: var(--primary);
	color: var(--text-dark-bg);
	padding: 4px 10px;
	border-radius: 6px;
	font-size: 11px;
	font-weight: 600;
	z-index: 2;
	display: flex;
	align-items: center;
	gap: 4px;
}

.blogcard-2 .content-side {
	flex: 1;
	padding: 20px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	position: relative;
	overflow: hidden;
}

.blogcard-2 .content-side::before {
	content: '';
	position: absolute;
	left: -10px;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: 60%;
	background: var(--border-primary);
	opacity: 0.5;
}

.blogcard-2 .header {
	margin-bottom: 12px;
}

.blogcard-2 .title {
	font-size: 16px;
	font-weight: 700;
	color: var(--text-primary);
	margin: 0 0 8px 0;
	line-height: 1.4;
	transition: color 0.2s ease;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.blogcard-2:hover .title {
	color: var(--primary);
}

.blogcard-2 .excerpt {
	font-size: 13px;
	color: var(--text-secondary);
	line-height: 1.5;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.blogcard-2 .meta-info {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 15px;
	padding-top: 15px;
	border-top: 1px solid var(--border-primary);
}

.blogcard-2 .meta-left {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 12px;
	color: var(--text-tertiary);
}

.blogcard-2 .meta-item {
	display: flex;
	align-items: center;
	gap: 4px;
}

.blogcard-2 .meta-item i {
	font-size: 14px;
	color: var(--primary);
}

.blogcard-2 .meta-right {
	display: flex;
	align-items: center;
	gap: 15px;
}

.blogcard-2 .interaction {
	display: flex;
	align-items: center;
	gap: 12px;
}

.blogcard-2 .interaction-item {
	display: flex;
	align-items: center;
	gap: 4px;
	font-size: 12px;
	color: var(--text-tertiary);
	transition: color 0.2s ease;
}

.blogcard-2 .interaction-item:hover {
	color: var(--primary);
}

.blogcard-2 .interaction-item i {
	font-size: 14px;
}

.blogcard-2 .read-more {
	color: var(--primary);
	text-decoration: none;
	font-size: 12px;
	font-weight: 600;
	display: flex;
	align-items: center;
	gap: 4px;
	transition: all 0.2s ease;
	padding: 4px 8px;
	border-radius: 4px;
	background: var(--primary-light);
}

.blogcard-2 .read-more:hover {
	background: var(--primary);
	color: var(--text-dark-bg);
}

.blogcard-2 .read-more i {
	font-size: 12px;
	transition: transform 0.2s ease;
}

.blogcard-2 .read-more:hover i {
	transform: translateX(3px);
}

.blogcard-2 .date-badge {
	bottom: 12px;
	left: 12px;
	background: var(--bg-secondary);
	padding: 2px 8px;
	border-radius: 4px;
	font-size: 10px;
	color: var(--text-tertiary);
	border: 1px solid var(--border-primary);
}

.blogcard-2 .date-badge,.blogcard-2 .view-count {
	position: absolute;
	display: flex;
	align-items: center;
	gap: 4px;
}

.blogcard-2 .view-count {
	top: 12px;
	right: 12px;
	background: rgba(0,0,0,0.7);
	color: white;
	padding: 4px 10px;
	border-radius: 20px;
	font-size: 11px;
	font-weight: 500;
	z-index: 2;
	backdrop-filter: blur(10px);
	border: 1px solid rgba(255,255,255,0.1);
}

.blogcard-2 .view-count i {
	font-size: 12px;
}

@media (max-width: 768px) {
	.blogcard-2 {
		flex-direction: column;
		height: auto;
	}

	.blogcard-2 .image-side {
		width: 100%;
		height: 160px;
		min-width: auto;
	}

	.blogcard-2 .content-side {
		padding: 16px;
	}

	.blogcard-2 .content-side::before {
		display: none;
	}

	.blogcard-2 .meta-info {
		flex-direction: column;
		gap: 12px;
		align-items: flex-start;
	}

	.blogcard-2 .meta-right {
		width: 100%;
		justify-content: space-between;
	}
}
/*---------------------------------- Blog Card 3 -----------------------------------*/
.blogcard-3 {
	background: var(--bg-primary);
	border-radius: 12px;
	overflow: hidden;
	border: 1px solid var(--border-primary);
	transition: all 0.25s ease;
	height: 100%;
	display: flex;
	flex-direction: column;
	position: relative;
}

.blogcard-3:hover {
	border-color: var(--primary);
	box-shadow: 0 8px 24px rgba(var(--primary-rgb), 0.08);
	transform: translateY(-3px);
}

.blogcard-3.featured {
	border: 2px solid var(--danger);
}

.blogcard-3 .type-indicator {
	position: absolute;
	top: 0;
	right: 0;
	width: 4px;
	height: 100%;
	background: var(--type-color, var(--primary));
	z-index: 2;
}

.blogcard-3 .compact-header {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--border-primary);
}

.blogcard-3 .author-avatar {
	width: 40px;
	height: 40px;
	min-width: 40px;
	border-radius: 50%;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-size: 16px;
	font-weight: 600;
	flex-shrink: 0;
}

.blogcard-3 .header-content {
	flex: 1;
	min-width: 0;
}

.blogcard-3 .author-name {
	font-size: 14px;
	font-weight: 600;
	color: var(--text-primary);
	margin: 0 0 4px 0;
}

.blogcard-3 .post-meta {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 12px;
	color: var(--text-tertiary);
}

.blogcard-3 .meta-item {
	display: flex;
	align-items: center;
	gap: 4px;
}

.blogcard-3 .meta-item i {
	font-size: 14px;
}

.blogcard-3 .category-badge {
	background: var(--primary-light);
	color: var(--primary);
	padding: 4px 10px;
	border-radius: 12px;
	font-size: 11px;
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	border: 1px solid rgba(var(--primary-rgb), 0.2);
}

.blogcard-3 .main-content {
	padding: 16px;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.blogcard-3 .title {
	font-size: 16px;
	font-weight: 700;
	color: var(--text-primary);
	margin: 0 0 8px 0;
	line-height: 1.4;
	transition: color 0.2s ease;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.blogcard-3:hover .title {
	color: var(--primary);
}

.blogcard-3 .excerpt {
	font-size: 13px;
	color: var(--text-secondary);
	line-height: 1.5;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.blogcard-3 .thumbnail-section {
	margin: 12px 0;
	height: 120px;
	border-radius: 8px;
	overflow: hidden;
	position: relative;
}

.blogcard-3 .thumbnail-section img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.blogcard-3:hover .thumbnail-section img {
	transform: scale(1.05);
}

.blogcard-3 .thumbnail-section::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, transparent 50%, rgba(0,0,0,0.2) 100%);
	opacity: 0;
	transition: opacity 0.3s ease;
}

.blogcard-3:hover .thumbnail-section::after {
	opacity: 1;
}

.blogcard-3 .compact-footer {
	margin-top: auto;
	padding-top: 12px;
	border-top: 1px solid var(--border-primary);
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.blogcard-3 .interaction-stats {
	display: flex;
	align-items: center;
	gap: 16px;
}

.blogcard-3 .stat-item {
	display: flex;
	align-items: center;
	gap: 4px;
	font-size: 12px;
	color: var(--text-secondary);
}

.blogcard-3 .stat-item i {
	font-size: 14px;
	color: var(--primary);
}

.blogcard-3 .read-action {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--primary);
	text-decoration: none;
	font-size: 12px;
	font-weight: 600;
	padding: 6px 12px;
	border-radius: 6px;
	background: var(--primary-light);
	border: 1px solid rgba(var(--primary-rgb), 0.2);
	transition: all 0.2s ease;
}

.blogcard-3 .read-action:hover {
	background: var(--primary);
	color: white;
}

.blogcard-3 .read-action i {
	font-size: 12px;
	transition: transform 0.2s ease;
}

.blogcard-3 .read-action:hover i {
	transform: translateX(2px);
}

.blogcard-3 .reading-time {
	position: absolute;
	bottom: 12px;
	left: 12px;
	background: rgba(0,0,0,0.7);
	color: white;
	padding: 4px 8px;
	border-radius: 12px;
	font-size: 11px;
	font-weight: 500;
	z-index: 2;
	backdrop-filter: blur(10px);
	border: 1px solid rgba(255,255,255,0.1);
	display: flex;
	align-items: center;
	gap: 4px;
}

@media (max-width: 768px) {
    
	.blogcard-3 .compact-header,.blogcard-3 .main-content {
		padding: 12px;
	}

	.blogcard-3 .title {
		font-size: 15px;
	}

	.blogcard-3 .thumbnail-section {
		height: 100px;
	}

	.blogcard-3 .compact-footer {
		flex-direction: column;
		gap: 10px;
		align-items: flex-start;
	}

	.blogcard-3 .interaction-stats {
		width: 100%;
		justify-content: space-between;
	}
}

/* دکمه گزارش */
.report-button {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 16px;
	border-radius: 30px;
	text-decoration: none;
	font-size: 14px;
	font-weight: 500;
	transition: all 0.2s;
	cursor: pointer;
}

.report-btn-modern {
	background: linear-gradient(-135deg, #ef4444, #dc2626);
	color: white;
	border: none;
}

.report-btn-classic {
	background: #334155;
	color: white;
}

.report-btn-outline {
	background: transparent;
	border: 2px solid #ef4444;
	color: #ef4444;
}

.report-btn-minimal {
	background: transparent;
	color: #ef4444;
}

.report-button:hover {
	transform: translateY(-2px);
	filter: brightness(1.05);
}

.report-icon {
	font-size: 16px;
}

.hiddenclass {
	display: none !important;
}
/*------------------------------- Header Style -------------------------------*/
/* ============================================================
   هدر یکپارچه ریسپانسیو - رادیتون
   فقط حالت روشن (Light Mode)
   ============================================================ */



/* ---------- سایدبار دسکتاپ ---------- */
.rt-desktop-sidebar {
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	width: var(--rt-sidebar-width);
	background: var(--rt-bg-primary);
	border-right: 1px solid var(--rt-border);
	z-index: 999;
	display: flex;
	flex-direction: column;
	padding: 20px 16px;
	overflow-y: auto;
	transition: all var(--rt-transition);
	margin-right: calc(var(--rt-sidebar-width) + 20px) !important;
}

.rt-sidebar-header {
	margin-bottom: 24px;
	text-align: center;
}

.rt-sidebar-logo img {
	max-height: 48px;
	width: auto;
}

.rt-sidebar-logo .rt-logo-light {
	display: block;
}

.rt-sidebar-logo .rt-logo-dark {
	display: none;
}

.rt-sidebar-nav {
	margin-bottom: 20px;
}

.rt-sidebar-title {
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--rt-text-tertiary);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin: 0 0 10px 0;
	padding-left: 8px;
}

.rt-sidebar-menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

.rt-sidebar-menu li {
	margin-bottom: 2px;
}

.rt-sidebar-menu a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 14px;
	border-radius: 10px;
	color: var(--rt-text-secondary);
	text-decoration: none;
	font-size: 0.9rem;
	transition: all var(--rt-transition);
}

.rt-sidebar-menu a:hover,
.rt-sidebar-menu a:active {
	background: var(--rt-primary-light);
	color: var(--rt-primary);
}

.rt-sidebar-footer {
	margin-top: auto;
	padding-top: 16px;
	border-top: 1px solid var(--rt-border);
}

.rt-social-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: center;
	margin-bottom: 12px;
}

.rt-social-icon {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--rt-text-secondary);
	transition: all var(--rt-transition);
	text-decoration: none;
}

.rt-social-icon:hover {
	background: var(--rt-primary-light);
	color: var(--rt-primary);
	transform: translateY(-2px);
}

.rt-social-icon img {
	width: 20px;
	height: 20px;
}

.rt-sidebar-copyright {
	text-align: center;
	font-size: 0.7rem;
	color: var(--rt-text-tertiary);
}

/* اعمال فاصله فقط در دسکتاپ (وقتی سایدبار وجود دارد) */
@media (min-width: 1024px) {
	main, main.premium-main, .singer-archive-main, .raditone-request-root {
		padding-left: calc(var(--rt-sidebar-width) + 20px) !important;
	}
}

/* در موبایل و تبلت که سایدبار مخفی است، فاصله را حذف کن */
@media (max-width: 1023px) {
	main, main.premium-main, .singer-archive-main, .raditone-request-root {
		padding-left: 0 !important;
	}
}
/* ---------- هدر اصلی ---------- */
.rt-main-header {
	position: fixed;
	top: 0;
	right: 0;
	left: var(--rt-sidebar-width);
	height: var(--rt-header-height);
	background: var(--rt-bg-primary);
	border-bottom: 1px solid var(--rt-border);
	z-index: 1000;
	transition: transform 0.3s ease, background var(--rt-transition);
	backdrop-filter: blur(12px);
}

.rt-main-header.rt-hidden {
	transform: translateY(-100%);
}

.rt-header-container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 100%;
	padding: 0 20px;
	max-width: 100%;
}

.rt-header-left {
	display: flex;
	align-items: center;
	gap: 12px;
	flex: 0 0 auto;
}

.rt-mobile-menu-toggle {
	display: none;
	background: none;
	border: none;
	color: var(--rt-text-primary);
	cursor: pointer;
	padding: 6px;
	border-radius: 8px;
	transition: background var(--rt-transition);
}

.rt-mobile-menu-toggle:hover {
	background: var(--rt-glass);
}

.rt-desktop-nav .rt-primary-menu {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 4px;
}

.rt-desktop-nav .rt-primary-menu a {
	padding: 8px 16px;
	border-radius: 8px;
	color: var(--rt-text-secondary);
	text-decoration: none;
	font-size: 0.9rem;
	transition: all var(--rt-transition);
}

.rt-desktop-nav .rt-primary-menu a:hover {
	background: var(--rt-primary-light);
	color: var(--rt-primary);
}

.rt-header-center {
	display: flex;
	align-items: center;
	gap: 16px;
	flex: 1;
	justify-content: center;
}

.rt-mobile-logo {
	display: none;
	align-items: center;
	text-decoration: none;
}

.rt-mobile-logo img {
	max-height: 36px;
	width: auto;
}

.rt-mobile-logo .rt-logo-light {
	display: block;
}

.rt-mobile-logo .rt-logo-dark {
	display: none;
}

.rt-search-wrapper {
	flex: 1;
	max-width: 500px;
}

.rt-header-right {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
}

.rt-theme-toggle,
.rt-notif-toggle {
	background: none;
	border: none;
	color: var(--rt-text-secondary);
	font-size: 1.2rem;
	cursor: pointer;
	padding: 8px;
	border-radius: 50%;
	transition: all var(--rt-transition);
	position: relative;
}

.rt-theme-toggle:hover,
.rt-notif-toggle:hover {
	background: var(--rt-glass);
	color: var(--rt-primary);
}

.rt-light-icon {
	display: inline-flex;
}

.rt-dark-icon {
	display: none;
}

.rt-badge {
	position: absolute;
	top: 0;
	left: 0;
	background: var(--rt-danger);
	color: #fff;
	font-size: 0.6rem;
	font-weight: 700;
	min-width: 18px;
	height: 18px;
	border-radius: 9px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 4px;
}

.rt-user-btn {
	display: flex;
	align-items: center;
	gap: 8px;
	background: none;
	border: none;
	cursor: pointer;
	padding: 4px 12px 4px 8px;
	border-radius: 30px;
	transition: all var(--rt-transition);
}

.rt-user-btn:hover {
	background: var(--rt-glass);
}

.rt-user-avatar {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	object-fit: cover;
}

.rt-user-name {
	color: var(--rt-text-tertiary);
	font-size: 0.85rem;
	font-weight: 500;
}

.rt-login-btn {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 10px;
	border-radius: 10px;
	background: var(--rt-primary);
	color: #fff;
	text-decoration: none;
	font-size: 0.85rem;
	transition: all var(--rt-transition);
}

.rt-login-btn:hover {
	background: var(--rt-primary-hover);
	transform: scale(1.02);
}

/* ---------- دراپ‌داون اطلاعیه ---------- */
.rt-notif-dropdown {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	width: 340px;
	max-height: 420px;
	background: var(--rt-bg-primary);
	border: 1px solid var(--rt-border);
	border-radius: var(--rt-radius);
	box-shadow: var(--rt-shadow);
	overflow: hidden;
	display: none;
	z-index: 1100;
}

.rt-notif-dropdown.active {
	display: block;
}

.rt-notif-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 12px 16px;
	border-bottom: 1px solid var(--rt-border);
	font-weight: 600;
}

.rt-notif-count {
	font-size: 0.75rem;
	color: var(--rt-primary);
}

.rt-notif-list {
	max-height: 300px;
	overflow-y: auto;
}

.rt-notif-item {
	display: flex;
	gap: 12px;
	padding: 12px 16px;
	border-bottom: 1px solid var(--rt-border);
	cursor: pointer;
	transition: background 0.2s;
}

.rt-notif-item:hover {
	background: var(--rt-glass);
}

.rt-notif-item.rt-unread {
	background: var(--rt-primary-light);
	border-left: 3px solid var(--rt-primary);
}

.rt-notif-item i {
	font-size: 1.2rem;
	color: var(--rt-primary);
	flex-shrink: 0;
	margin-top: 2px;
}

.rt-notif-text {
	flex: 1;
}

.rt-notif-text h5 {
	margin: 0 0 4px 0;
	font-size: 0.85rem;
	font-weight: 600;
}

.rt-notif-text p {
	margin: 0 0 4px 0;
	font-size: 0.75rem;
	color: var(--rt-text-tertiary);
}

.rt-notif-time {
	font-size: 0.65rem;
	color: var(--rt-text-tertiary);
}

.rt-notif-empty {
	padding: 30px 16px;
	text-align: center;
	color: var(--rt-text-tertiary);
}

.rt-notif-footer {
	padding: 10px 16px;
	border-top: 1px solid var(--rt-border);
	text-align: center;
}

.rt-notif-footer a {
	color: var(--rt-primary);
	text-decoration: none;
	font-size: 0.85rem;
}

/* ---------- دراپ‌داون کاربر ---------- */
.rt-user-dropdown {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	min-width: 200px;
	background: var(--rt-bg-primary);
	border: 1px solid var(--rt-border);
	border-radius: var(--rt-radius);
	box-shadow: var(--rt-shadow);
	display: none;
	z-index: 1100;
	padding: 8px 0;
}

.rt-user-dropdown.active {
	display: block;
}

.rt-user-dropdown a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 18px;
	color: var(--rt-text-secondary);
	text-decoration: none;
	font-size: 0.85rem;
	transition: all 0.2s;
}

.rt-user-dropdown a:hover {
	background: var(--rt-primary-light);
	color: var(--rt-primary);
}

/* ---------- مودال اطلاعیه ---------- */
.rt-notification-modal {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	z-index: 2000;
	display: flex;
	align-items: center;
	justify-content: center;
	visibility: hidden;
	opacity: 0;
	transition: all 0.3s ease;
}

.rt-notification-modal.active {
	visibility: visible;
	opacity: 1;
}

.rt-modal-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.6);
	backdrop-filter: blur(4px);
}

.rt-modal-container {
	position: relative;
	width: 90%;
	max-width: 420px;
	background: var(--rt-bg-primary);
	border-radius: var(--rt-radius);
	overflow: hidden;
	transform: scale(0.9);
	transition: transform 0.3s ease;
	z-index: 2001;
}

.rt-notification-modal.active .rt-modal-container {
	transform: scale(1);
}

.rt-modal-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 16px 20px;
	border-bottom: 1px solid var(--rt-border);
	background: var(--rt-bg-secondary);
}

.rt-modal-title {
	margin: 0;
	font-size: 1.1rem;
	font-weight: 600;
}

.rt-modal-close {
	background: none;
	border: none;
	font-size: 1.2rem;
	color: var(--rt-text-secondary);
	cursor: pointer;
}

.rt-modal-content {
	padding: 20px;
	max-height: 400px;
	overflow-y: auto;
	color: var(--rt-text-secondary);
	line-height: 1.7;
}

.rt-modal-footer {
	padding: 12px 20px;
	border-top: 1px solid var(--rt-border);
	text-align: center;
	background: var(--rt-bg-secondary);
}

.rt-modal-close-btn {
	background: none;
	border: none;
	color: var(--rt-primary);
	font-size: 0.9rem;
	cursor: pointer;
}

/* ---------- منوی موبایل (اسلاید) ---------- */
.rt-mobile-overlay {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1050;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.rt-mobile-overlay.active {
	display: block;
	opacity: 1;
}

.rt-mobile-sidebar {
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	width: 320px;
	background: var(--rt-bg-primary);
	z-index: 1060;
	transform: translateX(-100%);
	visibility: hidden;
	content-visibility: hidden;
	transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
		visibility 0.35s;
	display: flex;
	flex-direction: column;
	box-shadow: 8px 0 30px rgba(0, 0, 0, 0.2);
}

.rt-mobile-sidebar.active {
	transform: translateX(0);
	visibility: visible;
	content-visibility: visible;
}

.rt-mobile-profile {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px;
	border-bottom: 1px solid var(--rt-border);
	background: var(--rt-bg-secondary);
}

.rt-mobile-avatar {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	overflow: hidden;
	flex-shrink: 0;
	background: var(--rt-primary);
}

.rt-mobile-avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rt-mobile-userinfo {
	flex: 1;
}

.rt-mobile-username {
	font-weight: 600;
	font-size: 1rem;
	color: var(--rt-text-primary);
}

.rt-mobile-useremail {
	font-size: 0.75rem;
	color: var(--rt-text-tertiary);
}

.rt-mobile-logout {
	color: var(--rt-danger);
	font-size: 1.2rem;
	text-decoration: none;
	padding: 6px;
}

.rt-mobile-content {
	flex: 1;
	overflow-y: auto;
	padding: 16px;
}

.rt-mobile-pane {
	display: none;
	animation: rtFadeIn 0.3s ease;
}

.rt-mobile-pane.active {
	display: block;
}

@keyframes rtFadeIn {
	from {
		opacity: 0;
		transform: translateY(8px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.rt-mobile-menu,
.rt-mobile-cat-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.rt-mobile-menu li,
.rt-mobile-cat-list li {
	margin-bottom: 6px;
}

.rt-mobile-menu a,
.rt-mobile-cat-list a {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 14px;
	border-radius: 12px;
	color: var(--rt-text-secondary);
	text-decoration: none;
	font-size: 0.95rem;
	transition: all var(--rt-transition);
	flex-direction: row;
}

.rt-mobile-menu a:hover,
.rt-mobile-cat-list a:hover {
	background: var(--rt-primary-light);
	color: var(--rt-primary);
}

.rt-mobile-menu-text {
	order: 2;
	flex: 1;
	text-align: left;
}

.rt-mobile-menu .menu-icon {
	order: 1;
	font-size: 20px;
	width: 24px;
	text-align: center;
	color: var(--rt-primary);
}

.rt-mobile-cat-section {
	margin-bottom: 24px;
}

.rt-mobile-cat-title {
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--rt-text-tertiary);
	text-align: center;
	margin-bottom: 12px;
	position: relative;
}

.rt-mobile-cat-title::before {
	content: '';
	position: absolute;
	top: 50%;
	right: 0;
	width: 30%;
	height: 1px;
	background: linear-gradient(to right, var(--primary), transparent);
	transform: translateY(-50%);
}

.rt-mobile-cat-title::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	width: 30%;
	height: 1px;
	background: linear-gradient(to left, var(--primary), transparent);
	transform: translateY(-50%);
}

.rt-mobile-socials {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
	padding: 16px;
	border-top: 1px solid var(--rt-border);
	margin-top: auto;
}

.rt-mobile-socials a {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--rt-glass);
	color: var(--rt-text-secondary);
	font-size: 1.2rem;
	transition: all var(--rt-transition);
	text-decoration: none;
}

.rt-mobile-socials a:hover {
	background: var(--rt-primary-light);
	color: var(--rt-primary);
}

/* ---------- منوی پایین موبایل ---------- */
.rt-bottom-nav {
	position: fixed;
	bottom: 0;
	right: 0;
	left: 0;
	background: var(--rt-bg-primary);
	border-top: 1px solid var(--rt-border);
	z-index: 1050;
	padding: 8px 12px;
	padding-bottom: calc(8px + var(--rt-safe-bottom));
	display: none;
}

.rt-bottom-nav-inner {
	display: flex;
	justify-content: space-around;
	align-items: center;
}

.rt-bottom-item {
	display: flex;
	justify-content: center;
}

.rt-bottom-item a {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	padding: 6px 12px;
	border-radius: 30px;
	text-decoration: none;
	color: var(--rt-text-tertiary);
	font-size: 0.65rem;
	transition: all var(--rt-transition);
	position: relative;
}

.rt-bottom-item a:hover {
	color: var(--rt-primary);
}

.rt-bottom-item a i {
	font-size: 22px;
}

.rt-bottom-item.rt-center a {
	background: var(--rt-primary);
	color: #fff;
	border-radius: 50%;
	width: 56px;
	height: 56px;
	margin-top: -20px;
	box-shadow: 0 4px 16px rgba(59, 91, 219, 0.4);
}

.rt-bottom-item.rt-center a i {
	font-size: 28px;
}

.rt-bottom-item.rt-center a span {
	display: none;
}

.rt-bottom-badge {
	position: absolute;
	top: -2px;
	left: 50%;
	transform: translateX(-50%);
	background: var(--rt-danger);
	color: #fff;
	font-size: 0.6rem;
	font-weight: 700;
	min-width: 18px;
	height: 18px;
	border-radius: 9px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 4px;
}

/* ---------- اسپیس هدر ---------- */
.rt-header-spacer {
	height: var(--rt-header-height);
}

/* ---------- ریسپانسیو ---------- */
@media (max-width: 1024px) {
	.rt-desktop-sidebar {
		display: none;
	}

	.rt-main-header {
		left: 0;
	}

	.rt-header-container {
		padding: 0 16px;
	}

	.rt-mobile-menu-toggle {
		display: inline-flex;
	}

	.rt-mobile-logo {
		display: inline-flex;
	}

	.rt-desktop-nav {
		display: none;
	}

	.rt-notif-dropdown {
		left: auto !important;
		right: 10px !important;
		width: 300px;
	}

	.rt-bottom-nav {
		display: block;
	}

	.rt-header-spacer {
		height: var(--rt-header-height);
	}
}

@media (max-width: 640px) {
	.rt-search-wrapper {
		max-width: 160px;
	}

	.rt-header-container {
		padding: 0 10px;
	}

	.rt-login-btn span {
		display: none;
	}

	.rt-login-btn {
		padding: 10px;
	}

	.rt-notif-dropdown {
		width: 280px;
		left: -20px;
	}

	.rt-mobile-sidebar {
		width: 280px;
		left: 0;
	}

	.rt-mobile-sidebar.active {
		transform: translateX(0);
	}

	.rt-bottom-item a {
		font-size: 0.6rem;
		padding: 4px 8px;
	}

	.rt-bottom-item a i {
		font-size: 18px;
	}

	.rt-bottom-item.rt-center a {
		width: 48px;
		height: 48px;
		margin-top: -16px;
	}

	.rt-bottom-item.rt-center a i {
		font-size: 24px;
	}
}

@media (max-width: 400px) {
	.rt-search-wrapper {
		max-width: 120px;
	}

	.rt-header-right {
		gap: 4px;
	}

	.rt-theme-toggle,
    .rt-notif-toggle {
		padding: 6px;
		font-size: 1rem;
	}
}

/*------------------------------- Home Page Style -------------------------------*/
/* ============================================================
   استایل‌های کامل صفحه اصلی – نسخه نهایی
   ============================================================ */

/* ============================================================
   ۱. استایل‌های پایه و ریست
   ============================================================ */
.site-main {
	margin: 0 auto;
	padding: 20px 15px 40px;
}

/* ============================================================
   ۲. پست‌های ویژه (Featured)
   ============================================================ */
.featured-section {
	margin-bottom: 40px;
}

.featured-grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 12px;
}

.featured-item {
	position: relative;
	overflow: hidden;
	border-radius: 14px;
	aspect-ratio: 1 / 1;
	background: #f0f2f5;
}

.featured-card {
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
}

.featured-card img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.featured-card:hover img {
	transform: scale(1.08);
}

.featured-overlay {
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
	padding: 20px 18px 16px;
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0%, transparent 100%);
	color: #fff;
}

.featured-track {
	display: block;
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.2;
}

.featured-artist {
	display: block;
	font-size: 0.85rem;
	opacity: 0.8;
	margin-top: 2px;
}

/* ============================================================
   ۳. بخش‌های کروسل
   ============================================================ */
.carousel-section {
	padding: 30px 0 10px;
}

/* ============================================================
   هدر با دکمه‌های کنار مشاهده همه
   ============================================================ */
.section-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 20px;
	padding: 0 4px;
	flex-wrap: wrap;
	gap: 12px;
}

.section-nav-wrapper {
	display: flex;
	align-items: center;
	gap: 12px;
}

.owl-nav-custom {
	display: flex;
	align-items: center;
	gap: 6px;
}

.owl-nav-custom button {
	width: 34px;
	height: 34px;
	border-radius: 5px;
	border: 1px solid var(--border-primary);
	background: var(--bg-primary);
	color: var(--primary);
	font-size: 20px;
	cursor: pointer;
	transition: all 0.3s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
}

.owl-nav-custom button:hover {
	background: var(--primary);
	border-color: var(--primary);
	color: #fff;
}

.owl-nav-custom button:disabled {
	opacity: 0.3;
	cursor: not-allowed;
	pointer-events: none;
}

.owl-nav-custom button .owl-prev-icon,
.owl-nav-custom button .owl-next-icon {
	line-height: 1;
}

.section-view-all {
	font-size: 0.9rem;
	color: var(--primary);
	text-decoration: none;
	font-weight: 600;
	transition: all 0.3s ease;
	white-space: nowrap;
}

.section-view-all:hover {
	color: var(--primary);
}

/* تنظیم برای موبایل */
@media (max-width: 768px) {
	.section-header {
		flex-direction: column;
		align-items: flex-start !important;
		padding: 0;
	}

	.section-nav-wrapper {
		width: 100%;
		justify-content: flex-end;
		position: static;
	}

	.owl-nav-custom button {
		width: 30px;
		height: 30px;
		font-size: 16px;
	}
}

.section-title {
	font-size: 1.5rem;
	font-weight: 800;
	color: var(--text-primary);
	margin: 0;
	position: relative;
}

.section-title::after {
	content: '';
	position: absolute;
	bottom: -4px;
	left: 0;
	width: 40px;
	height: 3px;
	background: var(--primary);
	border-radius: 4px;
}

.section-view-all {
	font-size: 0.9rem;
	color: var(--primary);
	text-decoration: none;
	font-weight: 600;
	transition: all 0.3s ease;
}

.section-view-all:hover {
	color: var(--primary-hover);
	transform: translateX(4px);
}

/* ============================================================
   ۴. کروسل اختصاصی (بدون کتابخانه)
   ============================================================ */
.carousel-wrapper {
	position: relative;
	overflow: visible !important;
}

.carousel-scroll {
	overflow: hidden;
	cursor: grab;
	touch-action: pan-y;
	direction: ltr;
 /* مهم: برای کنترل یکدست ترجمه در RTL */;
}

.carousel-scroll:active {
	cursor: grabbing;
}

.carousel-track {
	display: flex;
	flex-direction: row;
	gap: 15px;
	transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	will-change: transform;
}

.carousel-slide {
	flex: 0 0 auto;
	width: calc(100% / 7 - 15px);
	min-width: 0;
}

/* دکمه‌های کروسل */
.carousel-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
	background: rgba(255, 255, 255, 0.9);
	border: 1px solid var(--border-color, #e2e8f0);
	border-radius: 50%;
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.3s ease;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
	opacity: 0.8;
	color: var(--text-primary);
	font-size: 24px;
	font-weight: 300;
	line-height: 1;
	user-select: none;
}

.carousel-arrow:hover {
	background: var(--primary);
	border-color: var(--primary);
	opacity: 1;
	transform: translateY(-50%) scale(1.08);
	color: var(--text-primary);
}

.carousel-arrow:disabled {
	opacity: 0.3;
	cursor: not-allowed;
	pointer-events: none;
	transform: translateY(-50%) scale(0.95);
}

.carousel-arrow--prev {
	right: -18px;
}

.carousel-arrow--next {
	left: -18px;
}

/* کارت‌های کروسل */
.card-item {
	display: block;
	text-decoration: none;
	color: var(--text-primary, #0f172a);
	transition: all 0.3s ease;
	border-radius: 14px;
	overflow: hidden;
	background: var(--bg-secondary);
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

.card-item:hover {
	transform: translateY(-6px);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
}

.card-image {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: var(--bg-secondary);
}

.card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.card-item:hover .card-image img {
	transform: scale(1.05);
}

.card-badge {
	position: absolute;
	bottom: 10px;
	left: 10px;
	background: rgba(0, 0, 0, 0.75);
	backdrop-filter: blur(6px);
	color: #fff;
	padding: 3px 14px;
	border-radius: 30px;
	font-size: 0.65rem;
	font-weight: 600;
	letter-spacing: 0.5px;
	text-transform: uppercase;
}

.card-info {
	padding: 12px 14px 14px;
}

.card-title {
	font-size: 0.95rem;
	font-weight: 700;
	margin: 0 0 4px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.card-artist {
	font-size: 0.8rem;
	color: var(--text-tertiary, #64748b);
}

/* ============================================================
   ۵. خوانندگان محبوب
   ============================================================ */
.singers-carousel .carousel-slide {
	width: calc(100% / 7);
}

.site-main .singer-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-decoration: none;
	color: var(--text-primary, #0f172a);
	transition: all 0.3s ease;
}

.site-main .singer-card:hover {
	transform: translateY(-8px);
}

.site-main .singer-avatar {
	width: 120px;
	height: 120px;
	border-radius: 50%;
	background-size: cover;
	background-position: center;
	background-color: #e2e8f0;
	border: 3px solid var(--border-color, #e2e8f0);
	transition: all 0.3s ease;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06);
}

.singer-card:hover .singer-avatar {
	border-color: var(--primary, #3b82f6);
	box-shadow: 0 8px 30px rgba(59, 130, 246, 0.25);
	transform: scale(1.05);
}

.singer-name {
	font-size: 0.9rem;
	font-weight: 700;
	margin-top: 10px;
	text-align: center;
	line-height: 1.3;
}

.singer-count {
	font-size: 0.7rem;
	color: var(--text-tertiary, #94a3b8);
	margin-top: 2px;
}

/* ============================================================
   ۶. کروسل پلی‌لیست‌ها (با کلاژ)
   ============================================================ */
.playlist-card-image {
	position: relative;
	overflow: hidden;
	aspect-ratio: 1 / 1;
	background: #f0f2f5;
}

.playlist-collage {
	display: flex;
	gap: 2px;
	width: 100%;
	height: 100%;
}

.playlist-collage .collage-img {
	width: 50%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.card-item:hover .collage-img {
	transform: scale(1.04);
	transition: transform 0.4s ease;
}

/* ============================================================
   ۷. گرید دسته‌بندی‌ها و سبک‌ها
   ============================================================ */
.site-main .grid-section {
	padding: 30px 0 10px;
}

.site-main .grid-items {
	display: grid;
	grid-template-columns: repeat(8, 1fr);
	gap: 14px;
}

.site-main .grid-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 20px;
	border-radius: 14px;
	background: var(--bg-secondary);
	border-bottom: 4px solid var(--primary, #3b82f6);
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
	text-decoration: none;
	color: var(--text-primary, #0f172a);
	transition: all 0.3s ease;
}

.site-main .grid-item:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
}

.site-main .grid-item-name {
	font-weight: 600;
	font-size: 0.95rem;
}

.site-main .grid-item-count {
	background: var(--primary, #3b82f6);
	color: #fff;
	padding: 2px 12px;
	border-radius: 30px;
	font-size: 0.75rem;
	font-weight: 700;
}

/* ============================================================
   ۸. موسیقی ایران زمین (زبان‌ها)
   ============================================================ */
.language-section {
	padding: 30px 0 10px;
}

.language-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

.language-column {
	background: var(--bg-secondary);
	border-radius: 16px;
	padding: 20px;
	box-shadow: 0 2px 16px rgba(0, 0, 0, 0.05);
	border: 1px solid var(--border-color, #e2e8f0);
	transition: all 0.3s ease;
}

.language-column:hover {
	box-shadow: 0 8px 35px rgba(0, 0, 0, 0.08);
}

.language-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom: 2px solid var(--border-color, #e2e8f0);
	padding-bottom: 12px;
	margin-bottom: 16px;
}

.language-title {
	font-size: 1.15rem;
	font-weight: 700;
	margin: 0;
	color: var(--text-primary, #0f172a);
}

.language-view-all {
	font-size: 0.8rem;
	color: var(--primary, #3b82f6);
	text-decoration: none;
	font-weight: 600;
}

.language-view-all:hover {
	color: var(--primary-hover, #2563eb);
}

.language-posts {
	list-style: none;
	padding: 0;
	margin: 0;
}

.language-post-item {
	border-bottom: 1px solid var(--border-color, #f1f5f9);
}

.language-post-item:last-child {
	border-bottom: none;
}

.language-post-link {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 0;
	text-decoration: none;
	color: var(--text-primary, #0f172a);
	transition: background 0.2s ease;
	border-radius: 8px;
}

.language-post-link:hover {
	background: var(--bg-secondary, #f8fafc);
}

.language-post-thumb {
	flex: 0 0 48px;
	width: 48px;
	height: 48px;
	border-radius: 10px;
	overflow: hidden;
	background: #f0f2f5;
}

.language-post-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.language-post-info {
	flex: 1;
	min-width: 0;
}

.language-post-title {
	font-size: 0.9rem;
	font-weight: 600;
	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.language-post-artist {
	font-size: 0.75rem;
	color: var(--text-tertiary, #64748b);
	display: block;
}

.language-post-meta {
	display: flex;
	gap: 14px;
	margin-top: 4px;
	font-size: 0.7rem;
	color: var(--text-tertiary, #94a3b8);
}

.language-post-meta span {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

.language-post-meta span svg {
	width: 14px;
	height: 14px;
	stroke: currentColor;
	flex-shrink: 0;
}

/* ============================================================
   ۹. تبلیغات
   ============================================================ */
.raditoneads-section {
	padding: 30px 0 10px;
}

.raditoneads-wrapper {
	background: #dee2e6;
	border-radius: 15px;
	padding: 7px 10px;
	border: 8px solid var(--primary);
}

.raditoneads-label {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 0.85rem;
	color: #fff;
	margin-bottom: 4px;
	width: 87px;
	background: var(--primary);
	padding: 10px;
	margin-top: -7px;
	margin-left: -10px;
	border-bottom-right-radius: 15px;
}

.yn-heading, .yn-content {
	font-family: var(--font-iranyekan) !important;
}

.raditoneads-label .label-icon {
	width: 14px;
	height: 14px;
	fill: currentColor;
}

.raditoneads-banner {
	width: 100%;
	border-radius: 16px;
	overflow: hidden;
}

.raditoneads-banner a {
	display: block;
}

.raditoneads-banner img {
	width: 100%;
	height: auto;
	display: block;
}

.raditoneads-disclaimer {
	font-size: 0.65rem;
	color: #fff;
	text-align: center;
	width: 80%;
	margin: 0 auto;
	background: var(--primary);
	margin-bottom: -7px;
	margin-top: 10px;
	border-top-left-radius: 7px;
	border-top-right-radius: 7px;
	padding: 5px 5px 0px;
}

/* ============================================================
   ۱۰. واکنش‌گرایی کامل (Responsive)
   ============================================================ */

/* تبلت و دسکتاپ کوچک */
@media (max-width: 1024px) {
	.featured-grid {
		grid-template-columns: repeat(4, 1fr);
	}

	.site-main .grid-items {
		grid-template-columns: repeat(4, 1fr);
	}

	.language-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.carousel-slide {
		width: calc(100% / 5 - 15px) !important;
	}

	.singers-carousel .carousel-slide {
		width: calc(100% / 5) !important;
	}
}

/* موبایل بزرگ */
@media (max-width: 768px) {
	.site-main {
		padding: 15px 16px 30px;
	}

	.featured-grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 8px;
	}

	.featured-overlay {
		padding: 12px 10px;
	}

	.featured-track {
		font-size: 0.85rem;
	}

	.featured-artist {
		font-size: 0.75rem;
	}

	.section-title {
		font-size: 1.2rem;
	}

	.carousel-slide {
		width: calc(100% / 3 - 15px) !important;
	}

	.singers-carousel .carousel-slide {
		width: calc(100% / 4) !important;
	}

	.carousel-arrow {
		width: 36px;
		height: 36px;
		font-size: 20px;
	}

	.carousel-arrow--prev {
		right: -10px;
	}

	.carousel-arrow--next {
		left: -10px;
	}

	.site-main .grid-items {
		grid-template-columns: repeat(3, 1fr);
		gap: 10px;
	}

	.grid-item {
		padding: 12px 14px;
	}

	.grid-item-name {
		font-size: 0.85rem;
	}

	.language-grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.language-column {
		padding: 16px;
	}

	.singer-avatar {
		width: 60px;
		height: 60px;
	}

	.singer-name {
		font-size: 0.8rem;
	}
}

/* موبایل کوچک */
@media (max-width: 480px) {
	.featured-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 6px;
	}

	.featured-overlay {
		padding: 8px 6px;
	}

	.featured-track {
		font-size: 0.7rem;
	}

	.featured-artist {
		font-size: 0.6rem;
	}

	.section-title {
		font-size: 1rem;
	}

	.section-view-all {
		font-size: 0.75rem;
	}

	.carousel-slide {
		width: calc(100% / 2 - 15px) !important;
	}

	.singers-carousel .carousel-slide {
		width: calc(100% / 3) !important;
	}

	.carousel-arrow {
		width: 30px;
		height: 30px;
		font-size: 16px;
		opacity: 0.6;
	}

	.carousel-arrow--prev {
		right: -8px;
	}

	.carousel-arrow--next {
		left: -8px;
	}

	.site-main .grid-items {
		grid-template-columns: repeat(2, 1fr);
		gap: 8px;
	}

	.grid-item {
		padding: 10px 12px;
		border-radius: 10px;
	}

	.grid-item-name {
		font-size: 0.8rem;
	}

	.grid-item-count {
		font-size: 0.65rem;
		padding: 1px 10px;
	}

	.singer-avatar {
		width: 50px;
		height: 50px;
	}

	.singer-name {
		font-size: 0.7rem;
		margin-top: 6px;
	}

	.card-title {
		font-size: 0.8rem;
	}

	.card-artist {
		font-size: 0.7rem;
	}

	.card-info {
		padding: 8px 10px 10px;
	}

	.language-post-thumb {
		flex: 0 0 36px;
		width: 36px;
		height: 36px;
	}

	.language-post-title {
		font-size: 0.8rem;
	}

	.language-post-artist {
		font-size: 0.65rem;
	}

	.language-post-meta {
		font-size: 0.6rem;
		gap: 8px;
	}

	.language-post-meta span svg {
		width: 12px;
		height: 12px;
	}
}
/*------------------------------- 404 Style -------------------------------*/
.r404-container {
	--r404-bg-primary: #f8fafc;
	--r404-bg-secondary: #ffffff;
	--r404-text-primary: #1e293b;
	--r404-text-secondary: #475569;
	--r404-text-tertiary: #94a3b8;
	--r404-primary: #6366f1;
	--r404-primary-hover: #4f46e5;
	--r404-accent: #8b5cf6;
	--r404-glass: rgba(255, 255, 255, 0.7);
	--r404-glass-border: rgba(148, 163, 184, 0.2);
	--r404-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06);
	--r404-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.08);
	--r404-shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.12);
	--r404-shadow-xl: 0 20px 60px rgba(0, 0, 0, 0.15);
	position: relative;
	font-family: var(--font-iranyekan);
	background: var(--r404-bg-primary);
	color: var(--r404-text-primary);
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	overflow-x: hidden;
	transition: background 0.3s ease,
    color 0.3s ease;
}

/* ذرات پس‌زمینه */
.r404-particles-container {
	position: fixed;
	inset: 0;
	pointer-events: none;
	z-index: 0;
	overflow: hidden;
}

.r404-particle {
	position: absolute;
	border-radius: 50%;
	background: var(--r404-primary);
	opacity: 0.06;
	animation: r404-floatUp linear infinite;
}

@keyframes r404-floatUp {
	0% {
		transform: translateY(100vh) scale(0);
		opacity: 0;
	}

	10% {
		opacity: 0.06;
	}

	90% {
		opacity: 0.06;
	}

	100% {
		transform: translateY(-10vh) scale(1);
		opacity: 0;
	}
}

/* کانتینر اصلی */
.r404-fullscreen {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 100vh;
	padding: 40px 24px;
	text-align: center;
	width: 100%;
	max-width: 700px;
}

/* لوگو */
.r404-site-logo {
	position: absolute;
	top: 32px;
	left: 32px;
	text-decoration: none;
	display: flex;
	align-items: center;
	gap: 10px;
	z-index: 10;
	transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.r404-site-logo:hover {
	transform: translateY(-3px);
}

.r404-site-logo-icon {
	width: 40px;
	height: 40px;
	background: linear-gradient(-135deg, var(--r404-primary), var(--r404-accent));
	border-radius: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-size: 1.2rem;
	font-weight: 700;
	box-shadow: 0 4px 12px rgba(99, 102, 241, 0.3);
}

.r404-site-logo-text {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--r404-text-primary);
}

/* تصویر 404 */
.r404-error-visual {
	position: relative;
	width: 100%;
	max-width: 500px;
	margin-bottom: 20px;
	animation: r404-fadeInScale 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes r404-fadeInScale {
	from {
		opacity: 0;
		transform: scale(0.8);
	}

	to {
		opacity: 1;
		transform: scale(1);
	}
}

.r404-error-gif-wrapper {
	position: relative;
	width: 100%;
	aspect-ratio: 1 / 1;
	max-height: 400px;
	margin: 0 auto;
}

.r404-error-number-float {
	position: absolute;
	top: 10%;
	right: 50%;
	transform: translateX(50%);
	font-size: clamp(100px, 15vw, 160px);
	font-weight: 900;
	background: linear-gradient(
    -135deg,
    var(--r404-text-primary) 0%,
    var(--r404-primary) 100%
  );
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	z-index: 1;
	letter-spacing: 16px;
	opacity: 0.25;
	animation: r404-numberPulse 3s ease-in-out infinite;
}

@keyframes r404-numberPulse {
	0%,
  100% {
		opacity: 0.2;
	}

	50% {
		opacity: 0.35;
	}
}

/* محتوای متنی */
.r404-error-content {
	animation: r404-fadeInUp 0.8s cubic-bezier(0.4, 0, 0.2, 1) 0.2s both;
	margin-top: -20px;
	z-index: 3;
	position: relative;
}

@keyframes r404-fadeInUp {
	from {
		opacity: 0;
		transform: translateY(30px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.r404-error-title {
	font-size: clamp(1.8rem, 4vw, 2.6rem);
	font-weight: 800;
	margin-bottom: 14px;
	color: var(--r404-text-primary);
	letter-spacing: -0.5px;
	line-height: 1.3;
}

.r404-error-title span {
	background: linear-gradient(-135deg, var(--r404-primary), var(--r404-accent));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.r404-error-message {
	font-size: clamp(0.95rem, 1.8vw, 1.1rem);
	line-height: 2;
	margin-bottom: 36px;
	color: var(--r404-text-secondary);
	max-width: 480px;
	margin-right: auto;
	margin-left: auto;
}

/* دکمه‌های اقدام */
.r404-error-actions {
	display: flex;
	gap: 16px;
	justify-content: center;
	flex-wrap: wrap;
	animation: r404-fadeInUp 0.8s cubic-bezier(0.4, 0, 0.2, 1) 0.4s both;
}

.r404-action-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 28px;
	border-radius: 50px;
	font-size: 0.95rem;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	border: none;
	font-family: inherit;
	position: relative;
	overflow: hidden;
}

.r404-action-btn.primary {
	background: linear-gradient(-135deg, var(--r404-primary), var(--r404-accent));
	color: white;
	box-shadow: 0 8px 24px rgba(99, 102, 241, 0.3);
}

.r404-action-btn.primary:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 32px rgba(99, 102, 241, 0.4);
}

.r404-action-btn.primary::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(
    -90deg,
    transparent,
    rgba(255, 255, 255, 0.2),
    transparent
  );
	transform: translateX(100%);
	transition: transform 0.6s;
}

.r404-action-btn.primary:hover::after {
	transform: translateX(-100%);
}

.r404-action-btn.secondary {
	background: var(--r404-glass);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border: 1px solid var(--r404-glass-border);
	color: var(--r404-text-primary);
}

.r404-action-btn.secondary:hover {
	transform: translateY(-3px);
	border-color: var(--r404-primary);
	box-shadow: var(--r404-shadow-lg);
	background: var(--r404-bg-secondary);
}

.r404-action-btn svg {
	width: 20px;
	height: 20px;
	flex-shrink: 0;
}

.r404-action-btn.primary svg {
	stroke: white;
}

.r404-action-btn.secondary svg {
	stroke: currentColor;
}

/* لودینگ اسپینر */
@keyframes r404-spin {
	to {
		transform: rotate(-360deg);
	}
}

.r404-action-btn.loading {
	pointer-events: none;
	opacity: 0.8;
}

.r404-action-btn.loading .r404-btn-icon-normal {
	display: none;
}

.r404-action-btn.loading .r404-btn-icon-spinner {
	display: inline-block;
	animation: r404-spin 0.8s linear infinite;
}

.r404-btn-icon-spinner {
	display: none;
}

/* فوتر */
.r404-site-footer {
	position: absolute;
	bottom: 32px;
	width: 100%;
	text-align: center;
	color: var(--r404-text-tertiary);
	font-size: 0.78rem;
	padding: 0 20px;
	z-index: 1;
	animation: r404-fadeInUp 0.8s cubic-bezier(0.4, 0, 0.2, 1) 0.8s both;
}

.r404-footer-links {
	display: flex;
	justify-content: center;
	gap: 24px;
	margin-top: 8px;
	flex-wrap: wrap;
}

.r404-footer-link {
	color: var(--r404-text-tertiary);
	text-decoration: none;
	transition: color 0.2s ease;
	font-size: 0.75rem;
}

.r404-footer-link:hover {
	color: var(--r404-primary);
}

/* ریسپانسیو */
@media (max-width: 768px) {
	.r404-site-logo {
		top: 20px;
		left: 20px;
	}

	.r404-site-logo-icon {
		width: 34px;
		height: 34px;
		font-size: 1rem;
	}

	.r404-site-logo-text {
		font-size: 0.95rem;
	}

	.r404-error-gif-wrapper {
		max-height: 280px;
	}

	.r404-error-actions {
		flex-direction: column;
		align-items: center;
		width: 100%;
	}

	.r404-action-btn {
		width: 100%;
		max-width: 320px;
		justify-content: center;
	}

	.r404-site-footer {
		bottom: 20px;
	}
}

@media (max-width: 480px) {
	.r404-error-gif-wrapper {
		max-height: 220px;
	}

	.r404-footer-links {
		gap: 14px;
	}
}

/*------------------------------- Event Archive Style -------------------------------*/

.raditone-event-archive {
	background: linear-gradient(to bottom, var(--bg-secondary), var(--bg-primary));
}

.raditone-event-header {
	background: linear-gradient(to bottom left, var(--bg-secondary), var(--bg-tertiary), var(--bg-secondary));
	border: 1px solid var(--border-primary);
	box-shadow: var(--shadow-lg);
}

.raditone-header-light-1 {
	background-color: var(--primary-light);
}

.raditone-header-light-2 {
	background-color: rgba(var(--accent-rgb), 0.2);
}

.raditone-header-badge {
	background: linear-gradient(to left, var(--primary), var(--accent));
	color: white;
}

.raditone-header-title {
	color: var(--text-primary);
}

.raditone-header-gradient {
	background: linear-gradient(to left, var(--primary), var(--accent));
	-webkit-background-clip: text;
	background-clip: text;
}

.raditone-header-subtitle {
	color: var(--text-secondary);
}

.raditone-stat-box {
	color: var(--text-primary);
}

.raditone-stat-number {
	font-size: 1.875rem;
	font-weight: 700;
	color: var(--primary);
}

@media (min-width: 768px) {
	.raditone-stat-number {
		font-size: 2.25rem;
	}
}

.raditone-stat-label {
	font-size: 0.875rem;
	color: var(--text-secondary);
	margin-top: 0.25rem;
}

.raditone-filter-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem 1rem;
	border-radius: 9999px;
	font-size: 0.875rem;
	font-weight: 500;
	transition: all 0.2s;
}

.raditone-filter-btn:active {
	transform: scale(0.95);
}

.raditone-filter-btn-primary {
	background-color: var(--primary);
	color: white;
	border: none;
}

.raditone-filter-btn-primary:hover {
	background-color: var(--primary-hover);
}

.raditone-filter-btn-outline {
	background-color: var(--bg-primary);
	border: 1px solid var(--border-primary);
	color: var(--text-primary);
}

.raditone-filter-btn-outline:hover {
	border-color: var(--accent);
	background-color: var(--primary-light);
}

.raditone-filter-btn-outline svg {
	color: var(--accent);
}

.raditone-filters-wrapper {
	background-color: var(--bg-primary);
	border: 1px solid var(--border-primary);
}

.raditone-search-input,
.raditone-date-input,
.raditone-location-select {
	background-color: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	color: var(--text-primary);
}

.raditone-search-input:focus,
.raditone-date-input:focus,
.raditone-location-select:focus {
	border-color: var(--accent);
	box-shadow: 0 0 0 2px rgba(var(--accent-rgb), 0.1);
	outline: none;
}

.raditone-search-icon,
.raditone-location-icon {
	color: var(--text-tertiary);
}

.raditone-event-card {
	background-color: var(--bg-primary);
	border: 1px solid var(--border-primary);
	box-shadow: var(--shadow-sm);
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.raditone-event-card:hover {
	transform: translateY(-0.25rem);
	box-shadow: var(--shadow-lg);
	border-color: var(--accent);
}

.raditone-card-fallback {
	background: linear-gradient(to bottom left, var(--bg-secondary), var(--bg-tertiary));
}

.raditone-card-fallback svg {
	color: var(--text-tertiary);
}

.raditone-card-overlay {
	background: linear-gradient(to top, rgba(0,0,0,0.6), rgba(0,0,0,0.2), transparent);
}

.raditone-date-box {
	background-color: rgba(var(--bg-primary-rgb), 0.9);
	backdrop-filter: blur(8px);
}

.raditone-date-day {
	color: var(--text-secondary);
}

.raditone-date-number {
	color: var(--text-primary);
}

.raditone-date-month {
	color: var(--text-tertiary);
}

.raditone-online-badge {
	background-color: var(--cyan);
	color: white;
}

.raditone-free-badge {
	background-color: var(--success);
	color: white;
}

.raditone-artist-avatar {
	background-color: var(--bg-primary);
	border: 2px solid var(--bg-primary);
	color: var(--accent);
	box-shadow: var(--shadow-sm);
}

.raditone-more-artists {
	background-color: var(--text-primary);
	color: var(--bg-primary);
	border: 2px solid var(--bg-primary);
}

.raditone-card-title {
	color: var(--text-primary);
	transition: color 0.3s;
}

.raditone-event-card:hover .raditone-card-title {
	color: var(--accent);
}

.raditone-event-status {
	color: var(--text-primary);
}

.raditone-status-upcoming {
	background-color: rgba(var(--primary-rgb), 0.2);
	color: var(--primary);
}

.raditone-status-ongoing {
	background-color: rgba(16, 185, 129, 0.2);
	color: var(--success);
}

.raditone-status-completed {
	background-color: rgba(100, 116, 139, 0.2);
	color: var(--text-tertiary);
}

.raditone-status-cancelled {
	background-color: rgba(239, 68, 68, 0.2);
	color: var(--danger);
}

.raditone-status-postponed {
	background-color: rgba(251, 191, 36, 0.2);
	color: var(--gold);
}

.raditone-card-excerpt {
	color: var(--text-secondary);
}

.raditone-event-meta {
	color: var(--text-secondary);
}

.raditone-meta-icon {
	color: var(--text-tertiary);
}

.raditone-city-name {
	color: var(--text-tertiary);
}

.raditone-details-btn {
	background-color: rgba(var(--accent-rgb), 0.1);
	color: var(--accent);
}

.raditone-details-btn:hover {
	background-color: var(--accent);
	color: white;
}

.raditone-details-btn svg {
	color: inherit;
}

.raditone-save-btn {
	color: var(--text-tertiary);
}

.raditone-save-btn:hover {
	color: var(--accent);
	background-color: rgba(var(--accent-rgb), 0.1);
}

.raditone-price-label {
	color: var(--text-secondary);
}

.raditone-free-price {
	color: var(--success);
}

.raditone-price-value {
	color: var(--text-primary);
}

.raditone-pagination-wrapper {
	background-color: var(--bg-primary);
	border: 1px solid var(--border-primary);
	box-shadow: var(--shadow-sm);
}

.raditone-pagination-page,
.raditone-pagination-prev,
.raditone-pagination-next {
	color: var(--text-primary);
}

.raditone-pagination-page:hover,
.raditone-pagination-prev:hover,
.raditone-pagination-next:hover {
	background-color: var(--bg-tertiary);
}

.raditone-pagination-page.current {
	background-color: var(--accent);
	color: white;
}

.raditone-empty-icon svg {
	color: var(--text-tertiary);
}

.raditone-empty-title {
	color: var(--text-primary);
}

.raditone-empty-description {
	color: var(--text-secondary);
}

.raditone-empty-action {
	background: linear-gradient(to left, var(--primary), var(--accent));
	color: white;
}

.raditone-empty-action:hover {
	background: linear-gradient(to left, var(--primary-hover), var(--accent));
}

.raditone-cta {
	background: linear-gradient(to left, var(--primary), var(--accent));
}

.raditone-cta-title {
	color: white;
}

.raditone-cta-description {
	color: rgba(255, 255, 255, 0.9);
}

.raditone-cta-btn-primary {
	background-color: white;
	color: var(--primary);
}

.raditone-cta-btn-primary:hover {
	background-color: var(--bg-secondary);
}

.raditone-cta-btn-secondary {
	background-color: rgba(255, 255, 255, 0.2);
	color: white;
}

.raditone-cta-btn-secondary:hover {
	background-color: rgba(255, 255, 255, 0.3);
}

.line-clamp-2 {
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

::-webkit-scrollbar {
	width: 8px;
}

::-webkit-scrollbar-track {
	background: var(--bg-tertiary);
}

::-webkit-scrollbar-thumb {
	background: var(--text-tertiary);
	border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
	background: var(--text-secondary);
}

@media (max-width: 768px) {
	.raditone-event-header {
		padding: 1.5rem;
	}

	.raditone-stat-box {
		min-width: 100px;
	}

	.raditone-filters-wrapper {
		padding: 1rem;
	}
}

@media (min-width: 1024px) {
	.raditone-event-card:hover {
		transform: translateY(-0.5rem);
	}
}

/*------------------------------- Event Single Style -------------------------------*/

.sevent-single-page {
	min-height: 100vh;
	background: var(--bg-primary);
	padding: 1.5rem 0;
}

.sevent-header-card {
	background: var(--bg-primary);
	border-color: var(--border-primary);
	transition: all 0.3s ease;
}

.sevent-header-card:hover {
	box-shadow: var(--shadow-2xl);
}

.sevent-header-top {
	border-bottom: 1px solid var(--border-primary);
}

.sevent-thumbnail {
	border-color: var(--bg-primary);
	transition: all 0.3s ease;
}

.sevent-thumbnail:hover {
	transform: scale(1.05);
}

.sevent-thumbnail-placeholder {
	border-color: var(--bg-primary);
}

.sevent-status-badge {
	transition: all 0.3s ease;
}

.sevent-status-badge:hover {
	transform: scale(1.1);
}

.sevent-status-upcoming {
	background: var(--success);
	color: white;
}

.sevent-status-ongoing {
	background: var(--primary);
	color: white;
}

.sevent-status-completed {
	background: var(--text-tertiary);
	color: white;
}

.sevent-status-cancelled {
	background: var(--danger);
	color: white;
}

.sevent-status-postponed {
	background: var(--gold);
	color: white;
}

.sevent-tag {
	transition: all 0.3s ease;
}

.sevent-tag:hover {
	transform: translateY(-1px);
}

.sevent-tag-online {
	background: var(--primary-light);
	color: var(--primary);
}

.sevent-tag-free {
	background: rgba(16, 185, 129, 0.15);
	color: var(--success);
}

.sevent-tag-type {
	background: rgba(var(--accent-rgb), 0.15);
	color: var(--accent);
}

.sevent-title {
	color: var(--text-primary);
}

.sevent-excerpt {
	color: var(--text-secondary);
}

.sevent-btn-primary {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	color: white;
	position: relative;
	overflow: hidden;
	transition: all 0.3s ease;
}

.sevent-btn-primary:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-xl);
}

.sevent-btn-primary::after {
	content: '';
	position: absolute;
	top: -50%;
	right: -50%;
	width: 200%;
	height: 200%;
	background: linear-gradient(
        to bottom left,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.1) 50%,
        rgba(255, 255, 255, 0) 100%
    );
	transform: rotate(-30deg);
	transition: all 0.6s;
}

.sevent-btn-primary:hover::after {
	right: 100%;
}

.sevent-btn-free {
	background: linear-gradient(-135deg, var(--success), #059669);
	color: white;
	border: none;
	cursor: pointer;
	transition: all 0.3s ease;
}

.sevent-btn-free:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-xl);
}

.sevent-btn-secondary {
	background: var(--bg-secondary);
	color: var(--text-primary);
	border: 1px solid var(--border-primary);
	cursor: pointer;
	transition: all 0.3s ease;
}

.sevent-btn-secondary:hover {
	transform: translateY(-1px);
	background: var(--bg-tertiary);
}

.sevent-info-card {
	background: var(--bg-primary);
	border-color: var(--border-primary);
	transition: all 0.3s ease;
	position: relative;
	overflow: hidden;
}

.sevent-info-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 4px;
	background: linear-gradient(-90deg, var(--primary), var(--accent));
	transform: translateX(100%);
	transition: transform 0.6s ease;
}

.sevent-info-card:hover::before {
	transform: translateX(0);
}

.sevent-info-card:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-lg);
}

.sevent-info-card-icon {
	background: var(--primary-light);
	color: var(--primary);
	transition: all 0.3s ease;
}

.sevent-info-card:hover .sevent-info-card-icon {
	transform: scale(1.1);
}

.sevent-info-card-title {
	color: var(--text-primary);
}

.sevent-info-value {
	color: var(--text-primary);
}

.sevent-info-subtext {
	color: var(--text-tertiary);
}

.sevent-online-text {
	color: var(--primary);
}

.sevent-artist-avatar {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-color: var(--bg-primary);
	transition: all 0.3s ease;
}

.sevent-artist-avatar:hover {
	transform: scale(1.2);
	z-index: 10;
}

.sevent-artist-more {
	background: var(--bg-tertiary);
	color: var(--text-secondary);
	border-color: var(--bg-primary);
}

.sevent-artists-count {
	color: var(--text-tertiary);
}

.sevent-organizer-card {
	background: var(--bg-primary);
	border-color: var(--border-primary);
	transition: all 0.3s ease;
}

.sevent-organizer-card:hover {
	box-shadow: var(--shadow-xl);
}

.sevent-section-title {
	color: var(--text-primary);
}

.sevent-organizer-avatar div {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	transition: all 0.3s ease;
}

.sevent-organizer-profile:hover .sevent-organizer-avatar div {
	transform: rotate(-5deg);
}

.sevent-organizer-name {
	color: var(--text-primary);
}

.sevent-organizer-role {
	color: var(--text-tertiary);
}

.sevent-contact-item {
	background: var(--bg-secondary);
	transition: all 0.3s ease;
}

.sevent-contact-item:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow);
}

.sevent-contact-icon {
	background: var(--primary-light);
	color: var(--primary);
	transition: all 0.3s ease;
}

.sevent-contact-item:hover .sevent-contact-icon {
	transform: scale(1.1);
}

.sevent-contact-title {
	color: var(--text-primary);
}

.sevent-contact-value {
	color: var(--text-secondary);
	text-decoration: none;
}

.sevent-contact-value:hover {
	color: var(--primary);
}

.sevent-tickets-section {
	background: var(--bg-primary);
	border-color: var(--border-primary);
}

.sevent-ticket-count {
	color: var(--text-tertiary);
}

.sevent-ticket-card {
	background: var(--bg-primary);
	border-color: var(--border-primary);
	transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	position: relative;
}

.sevent-ticket-card:hover {
	transform: translateY(-5px);
	box-shadow: var(--shadow-xl);
}

.sevent-ticket-popular {
	box-shadow: 0 0 0 2px var(--primary);
}

.sevent-popular-badge {
	background: linear-gradient(-135deg, #f97316, #ef4444);
	animation: sevent-pulse 2s infinite;
}

@keyframes sevent-pulse {
	0% {
		box-shadow: 0 0 0 0 rgba(249, 115, 22, 0.4);
	}

	70% {
		box-shadow: 0 0 0 10px rgba(249, 115, 22, 0);
	}

	100% {
		box-shadow: 0 0 0 0 rgba(249, 115, 22, 0);
	}
}

.sevent-ticket-name {
	color: var(--text-primary);
}

.sevent-free-badge {
	background: rgba(16, 185, 129, 0.15);
	color: var(--success);
}

.sevent-price-free {
	color: var(--success);
}

.sevent-price-amount {
	color: var(--text-primary);
}

.sevent-price-amount span {
	color: var(--text-tertiary);
}

.sevent-ticket-description {
	color: var(--text-secondary);
}

.sevent-stock-label {
	color: var(--text-tertiary);
}

.sevent-stock-count {
	color: var(--text-primary);
}

.sevent-progress-bar {
	background: var(--bg-tertiary);
}

.sevent-progress-fill {
	background: linear-gradient(-90deg, var(--primary), var(--accent));
	position: relative;
	overflow: hidden;
}

.sevent-progress-fill::after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(
        -90deg,
        transparent,
        rgba(255, 255, 255, 0.4),
        transparent
    );
	animation: sevent-shimmer 2s infinite;
}

@keyframes sevent-shimmer {
	0% {
		transform: translateX(100%);
	}

	100% {
		transform: translateX(-100%);
	}
}

.sevent-ticket-button {
	display: block;
	text-decoration: none;
	transition: all 0.3s ease;
	position: relative;
	overflow: hidden;
}

.sevent-ticket-button-free {
	background: var(--success);
	color: white;
}

.sevent-ticket-button-free:hover {
	background: #059669;
}

.sevent-ticket-button-paid {
	background: linear-gradient(-90deg, var(--primary), var(--accent));
	color: white;
}

.sevent-ticket-button-paid:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-md);
}

.sevent-ticket-button::after {
	content: '';
	position: absolute;
	top: 50%;
	right: 50%;
	width: 5px;
	height: 5px;
	background: rgba(255, 255, 255, 0.5);
	opacity: 0;
	border-radius: 100%;
	transform: scale(1, 1) translate(50%);
	transform-origin: 50% 50%;
}

.sevent-ticket-button:focus:not(:active)::after {
	animation: sevent-ripple 1s ease-out;
}

@keyframes sevent-ripple {
	0% {
		transform: scale(0, 0);
		opacity: 0.5;
	}

	20% {
		transform: scale(25, 25);
		opacity: 0.3;
	}

	100% {
		opacity: 0;
		transform: scale(40, 40);
	}
}

.sevent-content-section {
	background: var(--bg-primary);
	border-color: var(--border-primary);
}

.sevent-event-content {
	color: var(--text-secondary);
	line-height: 1.8;
}

.sevent-event-content h2 {
	color: var(--text-primary);
	font-size: 1.5rem;
	font-weight: 700;
	margin-top: 2rem;
	margin-bottom: 1rem;
}

.sevent-event-content h3 {
	color: var(--text-primary);
	font-size: 1.25rem;
	font-weight: 600;
	margin-top: 1.5rem;
	margin-bottom: 0.75rem;
}

.sevent-event-content p {
	margin-bottom: 1.5rem;
}

.sevent-event-content ul,
.sevent-event-content ol {
	margin-bottom: 1.5rem;
	padding-left: 1.5rem;
}

.sevent-event-content li {
	margin-bottom: 0.5rem;
}

.sevent-event-content ul li {
	position: relative;
}

.sevent-event-content ul li::before {
	content: '•';
	color: var(--primary);
	font-weight: bold;
	position: absolute;
	left: -1rem;
}

.sevent-countdown-card {
	background: var(--bg-primary);
	border-color: var(--border-primary);
}

.sevent-card-title {
	color: var(--text-primary);
}

.sevent-countdown-item {
	background: var(--bg-secondary);
	transition: all 0.3s ease;
}

.sevent-countdown-item:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow);
}

.sevent-countdown-number {
	color: var(--primary);
}

.sevent-countdown-label {
	color: var(--text-tertiary);
}

.sevent-countdown-date {
	color: var(--text-tertiary);
}

.sevent-map-card {
	background: var(--bg-primary);
	border-color: var(--border-primary);
}

.sevent-map-container {
	border-color: var(--border-primary);
}

.sevent-address-info {
	background: var(--bg-secondary);
}

.sevent-address-text {
	color: var(--text-secondary);
}

.sevent-related-events {
	background: var(--bg-primary);
	border-color: var(--border-primary);
}

.sevent-related-item {
	transition: all 0.3s ease;
	position: relative;
	text-decoration: none;
}

.sevent-related-item::before {
	content: '';
	position: absolute;
	left: -8px;
	top: 50%;
	transform: translateY(-50%) scale(0);
	width: 6px;
	height: 6px;
	background: var(--primary);
	border-radius: 50%;
	transition: transform 0.3s ease;
}

.sevent-related-item:hover {
	background: var(--bg-tertiary);
}

.sevent-related-item:hover::before {
	transform: translateY(-50%) scale(1);
}

.sevent-related-title {
	color: var(--text-primary);
}

.sevent-related-meta {
	color: var(--text-tertiary);
}

.sevent-no-events {
	color: var(--text-tertiary);
}

.sevent-info-card,
.sevent-ticket-card,
.sevent-organizer-card,
.sevent-contact-item,
.sevent-related-item {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

.sevent-animate-in {
	opacity: 1;
	transform: translateY(0);
}

.sevent-single-page::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

.sevent-single-page::-webkit-scrollbar-track {
	background: var(--bg-tertiary);
	border-radius: 4px;
}

.sevent-single-page::-webkit-scrollbar-thumb {
	background: var(--primary);
	border-radius: 4px;
	transition: background 0.3s ease;
}

.sevent-single-page::-webkit-scrollbar-thumb:hover {
	background: var(--primary-hover);
}

@media (max-width: 768px) {
	.sevent-header-top {
		padding: 1rem;
	}

	.sevent-info-cards {
		padding: 1rem;
	}

	.sevent-title {
		font-size: 1.25rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sevent-info-card,
    .sevent-ticket-card,
    .sevent-btn-primary,
    .sevent-btn-secondary,
    .sevent-artist-avatar,
    .sevent-contact-item,
    .sevent-countdown-item,
    .sevent-related-item {
		transition-duration: 0.01ms !important;
	}

	.sevent-info-card::before,
    .sevent-btn-primary::after,
    .sevent-progress-fill::after {
		animation-duration: 0.01ms !important;
	}
}

/*------------------------------- News Archive Style -------------------------------*/

.raditone-news-header {
	background: linear-gradient(-135deg, var(--bg-primary), var(--bg-secondary));
	border: 1px solid var(--border-primary);
	box-shadow: var(--shadow-lg);
	position: relative;
	overflow: hidden;
}

.raditone-news-light-1,
.raditone-news-light-2 {
	position: absolute;
	width: 300px;
	height: 300px;
	border-radius: 50%;
	filter: blur(80px);
	opacity: 0.15;
	pointer-events: none;
}

.raditone-news-light-1 {
	top: -100px;
	left: -100px;
	background: var(--primary);
}

.raditone-news-light-2 {
	bottom: -100px;
	right: -100px;
	background: var(--accent);
}

.raditone-news-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 16px;
	background: var(--primary-light);
	border-radius: 50px;
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--primary);
	margin-bottom: 16px;
}

.raditone-news-title {
	font-size: 2rem;
	font-weight: 800;
	margin: 0 0 8px;
	color: var(--text-primary);
}

.raditone-news-gradient {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	-webkit-background-clip: text;
	background-clip: text;
}

.raditone-news-subtitle {
	color: var(--text-tertiary);
	font-size: 0.9rem;
	margin: 0;
}

/* ========================================
   آمار
   ======================================== */
.raditone-news-stat-box {
	text-align: center;
	padding: 0 16px;
}

.raditone-news-stat-number {
	font-size: 2rem;
	font-weight: 800;
	color: var(--primary);
	line-height: 1.2;
}

@media (min-width: 768px) {
	.raditone-news-stat-number {
		font-size: 2.5rem;
	}
}

.raditone-news-stat-label {
	font-size: 0.75rem;
	color: var(--text-tertiary);
	margin-top: 4px;
}

/* ========================================
   فیلترهای سریع
   ======================================== */
.raditone-news-filter-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem 1.25rem;
	border-radius: 50px;
	font-size: 0.8rem;
	font-weight: 500;
	transition: all 0.2s ease;
	cursor: pointer;
	text-decoration: none;
}

.raditone-news-filter-btn:active {
	transform: scale(0.95);
}

.raditone-news-filter-btn-primary {
	background: var(--primary);
	color: white !important;
	border: none;
}

.raditone-news-filter-btn-primary:hover {
	background: var(--primary-hover);
	transform: translateY(-2px);
}

.raditone-news-filter-btn-outline {
	background: var(--glass);
	border: 1px solid var(--glass-border);
	color: var(--text-secondary);
}

.raditone-news-filter-btn-outline:hover {
	border-color: var(--primary);
	color: var(--primary);
	transform: translateY(-2px);
}

.raditone-news-filter-btn-outline i {
	color: var(--primary);
}

/* ========================================
   فیلترهای پیشرفته
   ======================================== */
.raditone-news-filters-wrapper {
	background: var(--glass);
	backdrop-filter: blur(12px);
	border: 1px solid var(--glass-border);
	border-radius: 20px;
	padding: 20px;
}

.raditone-news-search-input,
.raditone-news-date-select,
.raditone-news-category-select {
	width: 100%;
	padding: 12px 20px;
	background: var(--bg-primary);
	border: 1px solid var(--border-primary);
	border-radius: 50px;
	font-size: 0.85rem;
	color: var(--text-primary);
	transition: all 0.2s ease;
}

.raditone-news-search-input:focus,
.raditone-news-date-select:focus,
.raditone-news-category-select:focus {
	border-color: var(--primary);
	box-shadow: 0 0 0 3px var(--primary-light);
	outline: none;
}

.raditone-news-search-icon,
.raditone-news-date-icon,
.raditone-news-category-icon {
	position: absolute;
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--text-tertiary);
	pointer-events: none;
}

/* ========================================
   کارت مقاله
   ======================================== */
.raditone-news-card {
	background: var(--bg-primary);
	border: 1px solid var(--border-primary);
	border-radius: 20px;
	overflow: hidden;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	position: relative;
}

.raditone-news-card:hover {
	transform: translateY(-6px);
	border-color: var(--primary);
	box-shadow: var(--shadow-xl);
}

/* هدر کارت */
.raditone-news-card-header {
	position: relative;
	height: 220px;
	overflow: hidden;
}

.raditone-news-card-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.6), rgba(0,0,0,0.2), transparent);
}

.raditone-news-card-fallback {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(-135deg, var(--primary-light), var(--accent-light));
}

.raditone-news-card-fallback i {
	font-size: 3rem;
	color: var(--primary);
	opacity: 0.5;
}

/* بج‌های زمانی */
.raditone-news-time-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 12px;
	border-radius: 50px;
	font-size: 0.7rem;
	font-weight: 500;
	backdrop-filter: blur(8px);
	transition: all 0.3s;
}

.bg-green-500 {
	background: rgba(34, 197, 94, 0.9);
	color: white;
}

.bg-blue-500 {
	background: rgba(59, 130, 246, 0.9);
	color: white;
}

.bg-purple-500 {
	background: rgba(139, 92, 246, 0.9);
	color: white;
}

.bg-gray-500 {
	background: rgba(107, 114, 128, 0.9);
	color: white;
}

.raditone-news-time-badge.bg-green-500 {
	animation: pulse 2s infinite;
}

@keyframes pulse {
	0% {
		box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7);
	}

	70% {
		box-shadow: 0 0 0 10px rgba(34, 197, 94, 0);
	}

	100% {
		box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
	}
}

/* سایر بج‌ها */
.raditone-news-featured-badge,
.raditone-news-hot-badge,
.raditone-news-category-badge,
.raditone-news-reading-badge,
.raditone-news-views-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 12px;
	border-radius: 50px;
	font-size: 0.7rem;
	font-weight: 500;
	backdrop-filter: blur(8px);
}

.raditone-news-featured-badge {
	background: rgba(245, 158, 11, 0.9);
	color: white;
}

.raditone-news-hot-badge {
	background: rgba(239, 68, 68, 0.9);
	color: white;
}

.raditone-news-category-badge {
	background: rgba(139, 92, 246, 0.9);
	color: white;
}

.raditone-news-reading-badge {
	background: rgba(59, 130, 246, 0.9);
	color: white;
}

.raditone-news-views-badge {
	background: rgba(16, 185, 129, 0.9);
	color: white;
}

.raditone-news-type-badge {
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	color: var(--text-secondary);
	font-size: 0.65rem;
	padding: 4px 10px;
	border-radius: 50px;
}

/* تاریخ دقیق در حالت hover */
.raditone-news-exact-date {
	background: var(--glass);
	backdrop-filter: blur(12px);
	border: 1px solid var(--glass-border);
	border-radius: 16px;
	padding: 12px;
	text-align: center;
	transform: translateY(10px);
	transition: all 0.3s;
}

.raditone-news-card:hover .raditone-news-exact-date {
	transform: translateY(0);
}

.raditone-news-date-day {
	font-size: 0.7rem;
	color: var(--text-tertiary);
}

.raditone-news-date-number {
	font-size: 1.3rem;
	font-weight: 700;
	color: var(--text-primary);
}

.raditone-news-date-month {
	font-size: 0.65rem;
	color: var(--text-tertiary);
}

/* محتوای کارت */
.raditone-news-card-content {
	padding: 16px;
}

.raditone-news-card-title {
	font-size: 1rem;
	font-weight: 700;
	margin: 0 0 10px;
	line-height: 1.4;
	color: var(--text-primary);
	transition: color 0.2s;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.raditone-news-card:hover .raditone-news-card-title {
	color: var(--primary);
}

.raditone-news-card-excerpt {
	font-size: 0.75rem;
	line-height: 1.5;
	color: var(--text-secondary);
	margin-bottom: 16px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* اطلاعات مقاله */
.raditone-news-meta {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 0.7rem;
	color: var(--text-tertiary);
	margin-bottom: 8px;
}

.raditone-news-meta i {
	color: var(--text-tertiary);
	width: 16px;
}

.raditone-news-time-ago span span {
	color: var(--primary);
	font-weight: 500;
}

/* دکمه‌های کارت */
.raditone-news-card-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid var(--border-primary);
}

.raditone-news-read-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 18px;
	background: var(--primary-light);
	border-radius: 50px;
	font-size: 0.7rem;
	font-weight: 600;
	color: var(--primary);
	cursor: pointer;
	transition: all 0.2s;
	text-decoration: none;
}

.raditone-news-read-btn:hover {
	background: var(--primary);
	color: white;
	transform: translateY(-2px);
}

.raditone-news-card-actions {
	display: flex;
	align-items: center;
	gap: 8px;
}

.raditone-news-save-btn,
.raditone-news-share-btn {
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--glass);
	border: 1px solid var(--glass-border);
	color: var(--text-tertiary);
	cursor: pointer;
	transition: all 0.2s;
}

.raditone-news-save-btn:hover {
	background: var(--primary-light);
	color: var(--primary);
}

.raditone-news-share-btn:hover {
	background: rgba(59, 130, 246, 0.1);
	color: #3b82f6;
}

/* بازدیدها */
.raditone-news-views-info {
	text-align: right;
}

.raditone-news-views-label {
	font-size: 0.6rem;
	color: var(--text-tertiary);
}

.raditone-news-views-value {
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--text-primary);
}

/* ========================================
   صفحه‌بندی
   ======================================== */
.raditone-news-pagination-wrapper {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--glass);
	backdrop-filter: blur(8px);
	border: 1px solid var(--glass-border);
	border-radius: 60px;
	padding: 6px;
}

.raditone-news-pagination-page,
.raditone-news-pagination-prev,
.raditone-news-pagination-next {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 12px;
	border-radius: 40px;
	font-size: 0.85rem;
	font-weight: 500;
	color: var(--text-secondary);
	text-decoration: none;
	transition: all 0.2s;
}

.raditone-news-pagination-page:hover,
.raditone-news-pagination-prev:hover,
.raditone-news-pagination-next:hover {
	background: var(--primary-light);
	color: var(--primary);
}

.raditone-news-pagination-page.current {
	background: var(--primary);
	color: white;
}

.raditone-news-load-more {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 12px 32px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border: none;
	border-radius: 60px;
	font-size: 0.9rem;
	font-weight: 600;
	color: white;
	cursor: pointer;
	transition: all 0.3s;
}

.raditone-news-load-more:hover {
	transform: scale(1.02);
	box-shadow: var(--shadow-md);
}

/* ========================================
   حالت خالی
   ======================================== */
.raditone-news-empty-state {
	text-align: center;
	padding: 60px 20px;
	background: var(--glass);
	backdrop-filter: blur(16px);
	border: 1px solid var(--glass-border);
	border-radius: 28px;
}

.raditone-news-empty-icon i {
	font-size: 4rem;
	color: var(--primary);
	opacity: 0.5;
	margin-bottom: 16px;
}

.raditone-news-empty-title {
	font-size: 1.3rem;
	font-weight: 700;
	margin: 0 0 10px;
	color: var(--text-primary);
}

.raditone-news-empty-description {
	color: var(--text-tertiary);
	margin-bottom: 24px;
}

.raditone-news-empty-action {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 12px 28px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 60px;
	color: white;
	text-decoration: none;
	font-weight: 600;
	transition: all 0.3s;
}

.raditone-news-empty-action:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-md);
}

/* ========================================
   CTA
   ======================================== */
.raditone-news-cta {
	text-align: center;
	padding: 50px 30px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 28px;
	position: relative;
	overflow: hidden;
}

.raditone-news-cta::before {
	content: '';
	position: absolute;
	inset: 0;
	background: radial-gradient(circle at 30% 20%, rgba(255,255,255,0.15), transparent);
	pointer-events: none;
}

.raditone-news-cta-title {
	font-size: 1.5rem;
	font-weight: 800;
	margin: 0 0 12px;
	color: white;
}

.raditone-news-cta-description {
	color: rgba(255,255,255,0.85);
	margin-bottom: 28px;
	max-width: 500px;
	margin-right: auto;
	margin-left: auto;
}

.raditone-news-cta-actions {
	display: flex;
	gap: 16px;
	justify-content: center;
	flex-wrap: wrap;
}

.raditone-news-cta-btn-primary {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 12px 28px;
	background: white;
	border-radius: 60px;
	font-weight: 600;
	color: var(--primary);
	text-decoration: none;
	transition: all 0.3s;
}

.raditone-news-cta-btn-primary:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}

.raditone-news-cta-btn-secondary {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 12px 28px;
	background: rgba(255,255,255,0.2);
	backdrop-filter: blur(8px);
	border-radius: 60px;
	font-weight: 600;
	color: white;
	text-decoration: none;
	transition: all 0.3s;
}

.raditone-news-cta-btn-secondary:hover {
	background: rgba(255,255,255,0.3);
	transform: translateY(-2px);
}

/* ========================================
   انیمیشن‌ها
   ======================================== */
@keyframes raditone-fade-in {
	from {
		opacity: 0;
		transform: translateY(30px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.raditone-animate-fade-in {
	animation: raditone-fade-in 0.5s ease-out forwards;
}

.raditone-news-card:nth-child(1) {
	animation-delay: 0.05s;
}

.raditone-news-card:nth-child(2) {
	animation-delay: 0.1s;
}

.raditone-news-card:nth-child(3) {
	animation-delay: 0.15s;
}

.raditone-news-card:nth-child(4) {
	animation-delay: 0.2s;
}

.raditone-news-card:nth-child(5) {
	animation-delay: 0.25s;
}

.raditone-news-card:nth-child(6) {
	animation-delay: 0.3s;
}

.raditone-news-card:nth-child(7) {
	animation-delay: 0.35s;
}

.raditone-news-card:nth-child(8) {
	animation-delay: 0.4s;
}

/* ========================================
   ریسپانسیو
   ======================================== */
@media (max-width: 768px) {
	.raditone-news-header {
		padding: 20px;
	}

	.raditone-news-title {
		font-size: 1.5rem;
	}

	.raditone-news-stat-box {
		min-width: 80px;
	}

	.raditone-news-stat-number {
		font-size: 1.5rem;
	}

	.raditone-news-filters-wrapper {
		padding: 16px;
	}

	.raditone-news-card-header {
		height: 180px;
	}

	.raditone-news-cta {
		padding: 32px 20px;
	}

	.raditone-news-cta-title {
		font-size: 1.2rem;
	}
}

@media (max-width: 480px) {
	.raditone-news-card-header {
		height: 160px;
	}

	.raditone-news-card-title {
		font-size: 0.9rem;
	}

	.raditone-news-read-btn {
		padding: 6px 14px;
		font-size: 0.65rem;
	}
}

@media (min-width: 1024px) {
	.raditone-news-card:hover {
		transform: translateY(-8px);
	}
}

/* ========================================
   کلاس‌های کمکی
   ======================================== */
.line-clamp-2 {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}


/*------------------------------- News Single Style -------------------------------*/

.snews-container {
	margin: 0 auto;
	padding: 0 1rem;
}

/* ناوبری نان */
.snews-breadcrumb-nav {
	background: var(--bg-secondary);
	border-bottom-color: var(--border-primary);
}

.snews-breadcrumb-text {
	color: var(--text-secondary);
}

.snews-breadcrumb-link {
	color: var(--text-secondary);
	text-decoration: none;
	transition: color 0.3s ease;
}

.snews-breadcrumb-link:hover {
	color: var(--accent);
}

.snews-breadcrumb-sep {
	color: var(--text-tertiary);
}

.snews-breadcrumb-current {
	color: var(--text-primary);
}

/* صفحه اصلی */
.snews-main {
	background: var(--bg-primary);
}

/* دسته‌بندی */
.snews-category-tag {
	background: var(--bg-tertiary);
	color: var(--text-secondary);
	text-decoration: none;
}

.snews-category-tag:hover {
	background: rgba(139, 92, 246, 0.15);
	color: var(--accent);
}

/* عنوان مقاله */
.snews-article-title {
	color: var(--text-primary);
}

/* متا اطلاعات */
.snews-article-meta {
	color: var(--text-tertiary);
}

.snews-author-name {
	color: var(--text-secondary);
}

.snews-date {
	color: var(--text-tertiary);
}

/* تصویر شاخص */
.snews-featured-image {
	border: 1px solid var(--border-primary);
}

.snews-featured-img {
	max-height: 500px;
}

/* محتوای مقاله */
.snews-article-content {
	color: var(--text-secondary);
	line-height: 1.8;
}

.snews-article-content h2 {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--text-primary);
	margin: 2rem 0 1rem;
	padding-bottom: 0.5rem;
	border-bottom: 1px solid var(--border-primary);
}

.snews-article-content h3 {
	font-size: 1.25rem;
	font-weight: 600;
	color: var(--text-primary);
	margin: 1.5rem 0 1rem;
}

.snews-article-content h4 {
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--text-primary);
	margin: 1.25rem 0 0.75rem;
}

.snews-article-content p {
	margin-bottom: 1.5rem;
}

.snews-article-content ul,
.snews-article-content ol {
	margin: 1rem 0;
	padding-left: 2rem;
}

.snews-article-content li {
	margin-bottom: 0.5rem;
}

.snews-article-content blockquote {
	border-left: 3px solid var(--accent);
	padding: 1rem 2rem;
	margin: 2rem 0;
	background: var(--bg-secondary);
	border-radius: 0.5rem;
	font-style: italic;
	color: var(--text-tertiary);
}

.snews-article-content img {
	max-width: 100%;
	height: auto;
	border-radius: 0.5rem;
	margin: 2rem 0;
}

.snews-article-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 2rem 0;
}

.snews-article-content table th {
	background: var(--bg-tertiary);
	padding: 1rem;
	text-align: left;
	font-weight: 600;
	color: var(--text-primary);
	border-bottom: 2px solid var(--border-primary);
}

.snews-article-content table td {
	padding: 1rem;
	border-bottom: 1px solid var(--border-primary);
	color: var(--text-secondary);
}

.snews-article-content a {
	color: var(--primary);
	text-decoration: underline;
}

.snews-article-content a:hover {
	color: var(--accent);
}

/* بخش تگ‌ها */
.snews-tags-section {
	border-top-color: var(--border-primary);
}

.snews-tags-icon {
	color: var(--text-tertiary);
}

.snews-tags-title {
	color: var(--text-primary);
}

.snews-tag-item {
	background: var(--bg-tertiary);
	color: var(--text-secondary);
	text-decoration: none;
}

.snews-tag-item:hover {
	background: rgba(139, 92, 246, 0.15);
	color: var(--accent);
}

/* باکس نویسنده */
.snews-author-box {
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
}

.snews-author-box-name {
	color: var(--text-primary);
}

.snews-author-box-bio {
	color: var(--text-secondary);
}

.snews-author-box-link {
	color: var(--accent);
	text-decoration: none;
}

.snews-author-box-link:hover {
	color: var(--primary);
}

/* مقالات مرتبط */
.snews-related-section {
	border-top: 1px solid var(--border-primary);
	padding-top: 2rem;
}

.snews-related-title {
	color: var(--text-primary);
}

.snews-related-card {
	background: var(--bg-primary);
	border-color: var(--border-primary);
}

.snews-related-card:hover {
	box-shadow: var(--shadow-md);
}

.snews-related-card-title-link {
	color: var(--text-primary);
	text-decoration: none;
}

.snews-related-card-title-link:hover {
	color: var(--accent);
}

.snews-related-card-date {
	color: var(--text-tertiary);
}

/* بخش نظرات */
.snews-comments-title {
	color: var(--text-primary);
}

.panel-inner.comments-panel {
	padding: 15px;
}
/* ویجت جستجو */
.snews-search-input {
	background: var(--bg-primary);
	border-color: var(--border-primary);
	color: var(--text-primary);
}

.snews-search-input:focus {
	border-color: var(--accent);
	box-shadow: 0 0 0 2px rgba(139, 92, 246, 0.1);
}

.snews-search-input::placeholder {
	color: var(--text-tertiary);
}

.snews-search-submit {
	background: transparent;
	border: none;
	cursor: pointer;
	color: var(--text-tertiary);
}

/* عنوان ویجت */
.snews-widget-title {
	color: var(--text-primary);
}

/* آخرین مقالات */
.snews-recent-item {
	border-bottom: 1px solid var(--border-primary);
	padding-bottom: 1rem;
}

.snews-recent-item:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.snews-recent-title-link {
	color: var(--text-primary);
	text-decoration: none;
}

.snews-recent-title-link:hover {
	color: var(--accent);
}

.snews-recent-date {
	color: var(--text-tertiary);
}

.snews-recent-img {
	border: 1px solid var(--border-primary);
}

/* دسته‌بندی‌ها */
.snews-categories-link {
	background: var(--bg-secondary);
	text-decoration: none;
	transition: all 0.3s ease;
}

.snews-categories-link:hover {
	background: var(--bg-tertiary);
}

.snews-categories-name {
	color: var(--text-secondary);
}

.snews-categories-count {
	background: var(--bg-tertiary);
	color: var(--text-tertiary);
}

/* خبرنامه */
.snews-newsletter-widget {
	background: linear-gradient(-135deg, rgba(139, 92, 246, 0.1), rgba(236, 72, 153, 0.1));
	border: 1px solid var(--border-primary);
}

.snews-newsletter-title {
	color: var(--text-primary);
}

.snews-newsletter-text {
	color: var(--text-secondary);
}

.snews-newsletter-input {
	background: var(--bg-primary);
	border-color: var(--border-primary);
	color: var(--text-primary);
}

.snews-newsletter-input:focus {
	border-color: var(--accent);
	outline: none;
}

.snews-newsletter-input::placeholder {
	color: var(--text-tertiary);
}

.snews-newsletter-submit {
	background: var(--accent);
	color: white;
	border: none;
	cursor: pointer;
}

.snews-newsletter-submit:hover {
	background: var(--primary);
}

/* استایل‌های کامنت (برای comments_template) */
.commentlist {
	list-style: none;
	padding: 0;
}

.comment {
	padding: 1.5rem;
	border: 1px solid var(--border-primary);
	border-radius: 0.5rem;
	margin-bottom: 1rem;
	background: var(--bg-secondary);
}

.comment .children {
	margin-top: 1rem;
	margin-left: 2rem;
}

.comment-meta {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-bottom: 1rem;
}

.comment-author img {
	width: 48px;
	height: 48px;
	border-radius: 50%;
}

.comment-metadata {
	color: var(--text-tertiary);
	font-size: 0.875rem;
}

.comment-content {
	color: var(--text-secondary);
	line-height: 1.7;
}

.comment-reply-link {
	display: inline-block;
	padding: 0.5rem 1rem;
	background: var(--accent);
	color: white;
	border-radius: 0.375rem;
	font-size: 0.875rem;
	margin-top: 1rem;
	text-decoration: none;
	transition: background-color 0.2s;
}

.comment-reply-link:hover {
	background: var(--primary);
}

/* فرم کامنت */
.comment-form {
	background: var(--bg-secondary);
	padding: 2rem;
	border-radius: 0.5rem;
	border: 1px solid var(--border-primary);
}

.comment-form label {
	display: block;
	margin-bottom: 0.5rem;
	font-weight: 600;
	color: var(--text-primary);
}

.comment-form input,
.comment-form textarea {
	width: 100%;
	padding: 0.75rem;
	border: 1px solid var(--border-primary);
	border-radius: 0.375rem;
	margin-bottom: 1rem;
	background: var(--bg-primary);
	color: var(--text-primary);
	transition: border-color 0.2s;
}

.comment-form input:focus,
.comment-form textarea:focus {
	outline: none;
	border-color: var(--accent);
	box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.1);
}

.comment-form .submit {
	background: var(--accent);
	color: white;
	border: none;
	padding: 0.75rem 2rem;
	border-radius: 0.375rem;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 0.2s;
}

.comment-form .submit:hover {
	background: var(--primary);
}

.comments-header h3, .comment-reply-title {
	display: flex;
	gap: 5px;
	align-items: center;
}

/* خط‌بندی */
.line-clamp-2 {
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

/* انیمیشن */
@keyframes snews-fadeIn {
	from {
		opacity: 0;
		transform: translateY(10px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.snews-article-content {
	animation: snews-fadeIn 0.5s ease-out;
}

/* رسپانسیو */
@media (max-width: 768px) {
	.snews-container {
		padding: 0 1.5rem;
	}

	.snews-article-title {
		font-size: 1.75rem;
	}

	.snews-article-content {
		font-size: 1rem;
	}

	.snews-article-content h2 {
		font-size: 1.25rem;
	}

	.snews-article-content h3 {
		font-size: 1.125rem;
	}

	.comment .children {
		margin-left: 1rem;
	}

	.comment-form {
		padding: 1rem;
	}
}

/* کاهش حرکت */
@media (prefers-reduced-motion: reduce) {
	.snews-article-content {
		animation: none;
	}

	.snews-related-card,
    .snews-categories-link,
    .snews-tag-item {
		transition: none;
	}
}

/* اسکرول بار */
.snews-main::-webkit-scrollbar {
	width: 8px;
}

.snews-main::-webkit-scrollbar-track {
	background: var(--bg-tertiary);
	border-radius: 4px;
}

.snews-main::-webkit-scrollbar-thumb {
	background: var(--primary);
	border-radius: 4px;
}

.snews-main::-webkit-scrollbar-thumb:hover {
	background: var(--accent);
}

/* ============================================================
   استایل یکپارچه آرشیو (جایگزین Playlist Archive)
   ============================================================ */

/* ===== گرید اصلی ===== */
.rt-archive-grid {
	display: grid;
	grid-template-columns: repeat(var(--cols-desktop, 4), 1fr);
	gap: 24px;
	width: 100%;
}

/* ===== لینک کارت ===== */
.rt-archive-card-link {
	display: block;
	width: 100%;
	height: 100%;
	min-width: 0;
 /* جلوگیری از سرریز شدن در گرید */;
}

/* ===== کارت اصلی (هم‌ارتفاع) ===== */
.rt-archive-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	width: 100%;
	max-width: 100%;
	border-radius: 20px;
	background: #ffffff;
	padding: 5px;
	overflow: hidden;
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 20px 0px;
	transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.3s ease;
	border: 1px solid var(--border-primary);
	box-sizing: border-box;
}

.rt-archive-card:hover {
	transform: scale(1.05);
	box-shadow: rgba(0, 0, 0, 0.25) 0px 12px 30px 0px;
	border-color: var(--primary);
}

/* ===== بخش بالایی (تصویر) ===== */
.rt-archive-card-top1 {
	flex-shrink: 0;
	overflow: hidden;
}

.rt-archive-card-top {
	height: 150px;
	border-radius: 15px;
	display: flex;
	flex-direction: column;
	background-size: cover;
	background-position: center;
	background-color: var(--bg-tertiary);
	position: relative;
}

.header-amar {
	display: flex;
	justify-content: flex-end;
}

.rt-archive-card-top::after {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.35);
	z-index: 0;
}

/* ===== المان border (برش مورب) ===== */
.rt-archive-card-border {
	position: absolute;
	right: -3px;
	top: 0px;
	min-width: 80px;
	height: 30px;
	background-color: #ffffff !important;
	border-bottom-left-radius: 13px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: bold;
	font-size: 12px;
	padding: 0px 10px;
	z-index: 2;
}

.rt-archive-card-border::before {
	content: "";
	position: absolute;
	width: 20px;
	height: 20px;
	box-shadow: #ffffff 5px -5px 0px 5px;
	background: transparent;
	left: -20px;
	top: 0px;
	border-top-right-radius: 13px;
}

.rt-archive-card-border::before {
	content: "";
	position: absolute;
	width: 20px;
	height: 20px;
	box-shadow: #ffffff 5px -5px 0px 5px;
	background: transparent;
	bottom: -20px;
	right: 3px;
	border-top-right-radius: 13px;
}

/* ===== آیکون‌ها ===== */
.rt-archive-card-icons {
	position: absolute;
	top: 0;
	width: 100%;
	height: 30px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 7px 5px 0 15px;
	z-index: 4;
}

.rt-archive-card-logo {
	height: 100%;
	font-size: 12px;
	color: var(--text-primary);
	font-weight: 600;
	text-shadow: 0 1px 6px rgba(0,0,0,0.6);
}

.rt-archive-card-artist-area {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	color: #ffffff;
	font-size: 0.85rem;
	font-weight: 600;
	text-shadow: 0 1px 6px rgba(0,0,0,0.6);
	direction: ltr;
	overflow: hidden;
	max-width: 120px;
	flex: 1;
}

.rt-artist-single {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	text-align: left;
}

.rt-artist-rotator {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.rt-artist-item {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	white-space: nowrap;
	padding-left: 2px;
	text-align: left;
	opacity: 0;
	transition: opacity 0.5s ease;
}

/* ===== بخش پایینی (عنوان و آمار) ===== */
.rt-archive-card-bottom {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	margin-top: 15px;
	padding: 10px 5px 5px 5px;
	background: #ffffff;
	min-height: 100px;
}

/* ===== عنوان کارت (با سه‌نقطه) ===== */
.rt-archive-card-title {
	display: block;
	font-size: 17px;
	font-weight: 700;
	color: var(--text-primary);
	text-align: center;
	letter-spacing: 1px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 100%;
	padding: 0 8px;
	box-sizing: border-box;
	unicode-bidi: embed;
	line-height: 1.4;
	min-height: 24px;
}

/* ===== ردیف آمار ===== */
.rt-archive-card-row {
	display: flex;
	justify-content: space-between;
	margin-top: auto;
	padding-top: 10px;
}

.rt-archive-card-item {
	flex: 1;
	text-align: center;
	padding: 5px 2px;
	color: var(--text-tertiary);
}

.rt-archive-card-item:nth-child(2) {
	border-right: 1px solid var(--border-primary);
	border-left: 1px solid var(--border-primary);
}

.rt-archive-card-big-text {
	display: block;
	font-size: 12px;
	font-weight: 600;
	color: var(--text-primary);
	line-height: 1.4;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.rt-archive-card-big-text svg {
	width: 14px;
	height: 14px;
	vertical-align: middle;
	margin-right: 3px;
	stroke: var(--primary);
	fill: none;
	margin: 0 auto;
}

.rt-archive-card-regular-text {
	display: block;
	font-size: 9px;
	color: var(--text-tertiary);
	margin-top: 2px;
}

/* ===== استایل‌های کمکی ===== */
.rt-archive-stats {
	margin-bottom: 20px;
	padding: 8px 16px;
	background: var(--bg-tertiary);
	border-radius: 40px;
	display: inline-block;
	font-size: 0.8rem;
	color: var(--text-tertiary);
}

.rt-archive-pagination {
	margin-top: 40px;
	text-align: center;
}

.rt-archive-pagination .pagination {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--bg-tertiary);
	padding: 5px;
	border-radius: 50px;
	border: 1px solid var(--border-primary);
}

.rt-archive-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 36px;
	height: 36px;
	padding: 0 10px;
	border-radius: 40px;
	background: transparent;
	color: var(--text-secondary);
	font-size: 0.8rem;
	text-decoration: none;
}

.rt-archive-pagination .page-numbers.current {
	background: linear-gradient(-135deg, var(--primary), var(--secondary));
	color: white;
}

.rt-archive-pagination .page-numbers:hover:not(.current) {
	background: var(--primary-light);
	color: var(--primary);
}

/* ===== صفحه‌بندی قابل ایندکس (آرشیوهای AJAX / Infinite Scroll) =====
   لینک «بارگذاری بیشتر» با href واقعی تا خزنده‌های موتور جستجو بتوانند
   صفحات ۲ به بعد را کشف کنند. ظاهر آن با دکمه‌های بارگذاری بیشتر قالب هماهنگ است. */
.rt-pagination-crawlable {
	margin-top: 40px;
	display: flex;
	justify-content: center;
}

.rt-pagination-crawlable .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 28px;
	border-radius: 50px;
	background: var(--bg-tertiary);
	color: var(--text-secondary);
	border: 1px solid var(--border-primary);
	font-size: 0.9rem;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.rt-pagination-crawlable .page-numbers:hover,
.rt-pagination-crawlable .page-numbers:focus-visible {
	background: var(--primary);
	border-color: var(--primary);
	color: #fff;
}

/* ===== متن فقط برای صفحه‌خوان (H1 صفحات بدون عنوان بصری) =====
   به بصری‌کاربران نمایش داده نمی‌شود تا طرح صفحه تغییر نکند،
   اما ساختار هدینگ صفحه برای موتور جستجو و صفحه‌خوان‌ها درست می‌ماند. */
.rt-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* ===== پیام خالی ===== */
.rt-archive-empty {
	text-align: center;
	padding: 50px 20px;
	background: var(--bg-secondary);
	border-radius: 24px;
	border: 1px solid var(--border-primary);
}

.rt-archive-empty-icon {
	width: 70px;
	height: 70px;
	margin: 0 auto 20px;
	background: var(--bg-tertiary);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 2rem;
	color: var(--text-tertiary);
}

.rt-archive-empty-title {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 8px;
}

.rt-archive-empty-text {
	font-size: 0.8rem;
	color: var(--text-tertiary);
	margin-bottom: 20px;
}

/* ===== ریسپانسیو ===== */
@media (max-width: 992px) {
	.rt-archive-grid {
		grid-template-columns: repeat(var(--cols-tablet, 3), 1fr);
		gap: 18px;
	}
}

@media (max-width: 768px) {
	.rt-archive-grid {
		grid-template-columns: repeat(var(--cols-tablet, 3), 1fr);
		gap: 12px;
	}

	.rt-archive-card-title {
		font-size: 15px;
	}
}

@media (max-width: 480px) {
	.rt-archive-grid {
		grid-template-columns: repeat(var(--cols-mobile, 2), 1fr);
		gap: 8px;
	}

	.rt-archive-card-title {
		font-size: 13px;
	}
}

/*------------------------------- PlayList Single Style - Modern Light Design -------------------------------*/

.rpl-single {
	min-height: 100vh;
	background: var(--bg-secondary, #f8fafc);
	padding-bottom: 120px;
}

.rpl-single__container {
	margin: 0 auto;
	padding: 0 20px;
}

.rpl-single__hero {
	padding: 20px 0 40px;
}

.rpl-single__back {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--text-secondary, #475569);
	text-decoration: none;
	font-size: 0.85rem;
	font-weight: 500;
	margin-bottom: 24px;
	padding: 8px 18px;
	background: var(--bg-primary, #fff);
	border-radius: 12px;
	border: 1px solid var(--border-primary, #e5e7eb);
	cursor: pointer;
	transition: all 0.2s;
}

.rpl-single__back:hover {
	background: var(--bg-secondary, #f1f5f9);
	color: var(--primary, #3b82f6);
	border-color: var(--primary, #3b82f6);
}

.rpl-single__back svg {
	transition: transform 0.2s;
}

.rpl-single__back:hover svg {
	transform: translateX(3px);
}

.rpl-single__hero-inner {
	display: flex;
	gap: 32px;
	align-items: flex-start;
}

.rpl-single__cover {
	width: 240px;
	flex-shrink: 0;
	position: relative;
}

.rpl-single__cover-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4px;
	border-radius: 20px;
	overflow: hidden;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

.rpl-single__cover-cell {
	aspect-ratio: 1;
	overflow: hidden;
	background: var(--bg-tertiary, #e2e8f0);
	display: flex;
	align-items: center;
	justify-content: center;
}

.rpl-single__cover-cell img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rpl-single__cover-cell--empty svg {
	width: 28px;
	height: 28px;
	stroke: var(--text-tertiary, #94a3b8);
	opacity: 0.4;
}

.rpl-single__cover-badge {
	position: absolute;
	bottom: 12px;
	right: 12px;
	background: rgba(0, 0, 0, 0.7);
	backdrop-filter: blur(8px);
	padding: 6px 14px;
	border-radius: 10px;
	font-size: 0.7rem;
	font-weight: 600;
	color: #fff;
	display: flex;
	align-items: center;
	gap: 6px;
}

.rpl-single__cover-badge svg {
	width: 14px;
	height: 14px;
	stroke: currentColor;
}

.rpl-single__info {
	flex: 1;
	min-width: 0;
}

.rpl-single__title {
	font-size: 2rem;
	font-weight: 800;
	color: var(--text-primary, #0f172a);
	margin: 0 0 12px;
	line-height: 1.3;
}

.rpl-single__desc {
	color: var(--text-secondary, #64748b);
	font-size: 0.95rem;
	line-height: 1.7;
	margin-bottom: 24px;
}

.rpl-single__stats {
	display: flex;
	gap: 12px;
	margin-bottom: 24px;
	flex-wrap: wrap;
}

.rpl-single__stat {
	display: flex;
	align-items: center;
	gap: 6px;
	background: var(--bg-primary, #fff);
	padding: 8px 16px;
	border-radius: 12px;
	border: 1px solid var(--border-primary, #e5e7eb);
	font-size: 0.85rem;
}

.rpl-single__stat-icon {
	display: flex;
	align-items: center;
	color: var(--text-tertiary, #94a3b8);
}

.rpl-single__stat-icon svg {
	width: 14px;
	height: 14px;
	stroke: currentColor;
}

.rpl-single__stat-value {
	font-weight: 700;
	color: var(--text-primary, #0f172a);
}

.rpl-single__stat-label {
	color: var(--text-tertiary, #94a3b8);
	font-size: 0.8rem;
}

.rpl-single__actions {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}

.rpl-single__creator {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 8px 0 16px;
	flex-wrap: wrap;
}

.rpl-single__creator-label {
	color: var(--text-tertiary, #94a3b8);
	font-size: 0.85rem;
}

.rpl-single__creator-name {
	color: var(--primary, #3b82f6);
	font-size: 0.9rem;
	font-weight: 700;
	text-decoration: none;
}

.rpl-single__creator-name:hover {
	text-decoration: underline;
}

.rpl-single__official-badge {
	display: inline-flex;
	align-items: center;
	padding: 6px 14px;
	border-radius: 999px;
	font-size: 0.8rem;
	font-weight: 700;
	color: #fff;
	background: linear-gradient(-135deg, var(--primary, #3b82f6), var(--secondary, #8b5cf6));
}

.rpl-single__vote {
	display: inline-flex;
	align-items: center;
}

.rpl-single__vote .rt-vote-container {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	border-radius: 14px;
	border: 1px solid var(--border-primary, #e5e7eb);
	background: var(--bg-primary, #fff);
}

.rpl-single__btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 28px;
	border-radius: 14px;
	font-size: 0.9rem;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.2s;
	text-decoration: none;
	border: none;
}

.rpl-single__btn svg {
	width: 18px;
	height: 18px;
}

.rpl-single__btn--play {
	background: var(--primary, #3b82f6);
	color: #fff;
	box-shadow: 0 4px 16px rgba(59, 130, 246, 0.3);
}

.rpl-single__btn--play:hover {
	background: var(--primary-dark, #2563eb);
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(59, 130, 246, 0.4);
}

.rpl-single__btn--download {
	background: var(--bg-primary, #fff);
	color: var(--text-primary, #0f172a);
	border: 1px solid var(--border-primary, #e5e7eb);
}

.rpl-single__btn--download:hover {
	background: var(--bg-secondary, #f1f5f9);
	border-color: var(--primary, #3b82f6);
	color: var(--primary, #3b82f6);
	transform: translateY(-2px);
}

.rpl-zip-pending {
	opacity: 0.7;
	pointer-events: none;
}

.rpl-single__tracks {
	background: var(--bg-primary, #fff);
	border-radius: 20px;
	border: 1px solid var(--border-primary, #e5e7eb);
	overflow: hidden;
	margin-top: 32px;
}

.rpl-single__tracks-header {
	padding: 20px 24px;
	border-bottom: 1px solid var(--border-primary, #e5e7eb);
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.rpl-single__tracks-header h2 {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--text-primary, #0f172a);
	margin: 0;
}

.rpl-single__tracks-count {
	font-size: 0.8rem;
	color: var(--text-tertiary, #94a3b8);
	background: var(--bg-secondary, #f1f5f9);
	padding: 4px 12px;
	border-radius: 8px;
}

.rpl-single__tracks-list {
	padding: 4px 0;
}

.rpl-single__track {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 20px;
	transition: all 0.2s;
	cursor: pointer;
	border-bottom: 1px solid var(--border-light, #f1f5f9);
}

.rpl-single__track:last-child {
	border-bottom: none;
}

.rpl-single__track:hover {
	background: var(--bg-secondary, #f8fafc);
}

.rpl-single__track.active {
	background: var(--primary-light, rgba(59, 130, 246, 0.08));
	border-left: 3px solid var(--primary, #3b82f6);
}

.rpl-single__track-num {
	width: 32px;
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--text-tertiary, #94a3b8);
	text-align: center;
	flex-shrink: 0;
}

.rpl-single__track.active .rpl-single__track-num {
	color: var(--primary, #3b82f6);
}

.rpl-single__track-cover {
	width: 44px;
	height: 44px;
	flex-shrink: 0;
	border-radius: 10px;
	overflow: hidden;
	background: var(--bg-secondary, #f1f5f9);
	display: flex;
	align-items: center;
	justify-content: center;
}

.rpl-single__track-cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rpl-single__track-cover-icon {
	display: flex;
	align-items: center;
	justify-content: center;
}

.rpl-single__track-cover-icon svg {
	width: 20px;
	height: 20px;
	stroke: var(--text-tertiary, #94a3b8);
	opacity: 0.5;
}

.rpl-single__track-info {
	flex: 1;
	min-width: 0;
}

.rpl-single__track-title {
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--text-primary, #0f172a);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	display: flex;
	align-items: center;
	gap: 8px;
}

.rpl-single__track-artist {
	font-size: 0.78rem;
	color: var(--text-tertiary, #94a3b8);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.rpl-track-badge {
	display: inline-block;
	background: var(--gold, #f59e0b);
	color: #fff;
	font-size: 0.6rem;
	font-weight: 700;
	padding: 2px 8px;
	border-radius: 6px;
}

.rpl-single__track-duration {
	font-size: 0.78rem;
	color: var(--text-tertiary, #94a3b8);
	flex-shrink: 0;
}

.rpl-single__track-actions {
	display: flex;
	align-items: center;
	gap: 4px;
	flex-shrink: 0;
}

.rpl-single__track-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: transparent;
	border: none;
	color: var(--text-tertiary, #94a3b8);
	cursor: pointer;
	border-radius: 10px;
	transition: all 0.2s;
	text-decoration: none;
}

.rpl-single__track-btn svg {
	width: 16px;
	height: 16px;
}

.rpl-play-btn {
	color: var(--primary, #3b82f6);
}

.rpl-single__track-btn:hover {
	background: var(--primary-light, rgba(59, 130, 246, 0.1));
	color: var(--primary, #3b82f6);
}

.rpl-play-btn:hover {
	background: var(--primary, #3b82f6);
	color: #fff;
}

.rpl-track--album {
	background-color: color-mix(in srgb, var(--gold, #f59e0b) 4%, transparent);
	border-left: 3px solid var(--gold, #f59e0b);
}

.rpl-track--album:hover {
	background-color: color-mix(in srgb, var(--gold, #f59e0b) 8%, transparent);
}

.rpl-single__empty {
	text-align: center;
	padding: 60px 24px;
	color: var(--text-tertiary, #94a3b8);
}

.rpl-single__empty svg {
	width: 48px;
	height: 48px;
	stroke: var(--text-tertiary, #94a3b8);
	opacity: 0.3;
	margin-bottom: 12px;
}

.rpl-single__empty p {
	font-size: 0.95rem;
	margin: 0;
}

.rpl-single__comments {
	margin-top: 32px;
	margin-bottom: 48px;
}

@media (max-width: 768px) {
	.rpl-single {
		padding-bottom: 100px;
	}

	.rpl-single__container {
		padding: 0 16px;
	}

	.rpl-single__hero-inner {
		flex-direction: column;
		align-items: center;
		text-align: center;
	}

	.rpl-single__cover {
		width: 180px;
	}

	.rpl-single__title {
		font-size: 1.6rem;
	}

	.rpl-single__stats {
		justify-content: center;
	}

	.rpl-single__actions {
		justify-content: center;
	}

	.rpl-single__track {
		padding: 10px 16px;
		gap: 10px;
	}

	.rpl-single__track-num {
		width: 28px;
		font-size: 0.75rem;
	}

	.rpl-single__track-cover {
		width: 36px;
		height: 36px;
	}

	.rpl-single__track-title {
		font-size: 0.85rem;
	}

	.rpl-single__track-duration {
		display: none;
	}
}

@media (max-width: 480px) {
	.rpl-single__cover {
		width: 140px;
	}

	.rpl-single__title {
		font-size: 1.4rem;
	}

	.rpl-single__stats {
		gap: 8px;
	}

	.rpl-single__stat {
		padding: 6px 12px;
		font-size: 0.8rem;
	}

	.rpl-single__btn {
		padding: 10px 20px;
		font-size: 0.85rem;
	}
}

.rda-archive {
	min-height: 100vh;
	background: linear-gradient(-135deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);
}

.rda-container {
	margin: 0 auto;
	padding: 32px 24px 64px;
}

/* ===== هدر اصلی ===== */
.rda-header {
	position: relative;
	background: var(--glass);
	backdrop-filter: blur(20px);
	border: 1px solid var(--glass-border);
	border-radius: 36px;
	padding: 56px 48px;
	margin-bottom: 48px;
	overflow: hidden;
}

.rda-header-bg {
	position: absolute;
	top: -30%;
	left: -10%;
	width: 400px;
	height: 400px;
	background: radial-gradient(circle, rgba(var(--primary-rgb), 0.25) 0%, transparent 70%);
	border-radius: 50%;
	pointer-events: none;
}

.rda-header-bg2 {
	position: absolute;
	bottom: -30%;
	right: -10%;
	width: 350px;
	height: 350px;
	background: radial-gradient(circle, rgba(var(--accent-rgb), 0.2) 0%, transparent 70%);
	border-radius: 50%;
	pointer-events: none;
}

.rda-header-content {
	position: relative;
	z-index: 2;
}

.rda-badge {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: var(--primary-light);
	padding: 8px 20px;
	border-radius: 100px;
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--primary);
	margin-bottom: 28px;
	border: 1px solid rgba(var(--primary-rgb), 0.2);
}

.rda-title {
	font-size: 3.2rem;
	font-weight: 800;
	margin-bottom: 16px;
}

.rda-title-gradient {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	-webkit-background-clip: text;
	background-clip: text;
}

.rda-subtitle {
	font-size: 1rem;
	color: var(--text-secondary);
	margin-bottom: 40px;
}

/* آمار */
.rda-stats {
	display: flex;
	align-items: center;
	gap: 36px;
	margin-bottom: 40px;
	flex-wrap: wrap;
}

.rda-stat {
	text-align: center;
}

.rda-stat-number {
	font-size: 2.2rem;
	font-weight: 800;
	color: var(--primary);
	line-height: 1.2;
}

.rda-stat-label {
	font-size: 0.8rem;
	color: var(--text-tertiary);
}

.rda-stat-divider {
	width: 1px;
	height: 45px;
	background: var(--border-primary);
}

/* فیلترهای سریع */
.rda-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.rda-filter {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 22px;
	border-radius: 100px;
	font-size: 0.85rem;
	font-weight: 500;
	text-decoration: none;
	transition: all 0.25s cubic-bezier(0.2, 0, 0, 1);
	cursor: pointer;
}

.rda-filter i {
	font-size: 1rem;
}

.rda-filter-primary {
	background: linear-gradient(-135deg, var(--primary), var(--primary-hover));
	color: white;
	border: none;
	box-shadow: var(--shadow-md);
}

.rda-filter-primary:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(var(--primary-rgb), 0.35);
}

.rda-filter-outline {
	background: var(--glass);
	border: 1px solid var(--border-primary);
	color: var(--text-secondary);
}

.rda-filter-outline:hover {
	border-color: var(--primary);
	color: var(--primary);
	background: var(--primary-light);
	transform: translateY(-2px);
}

/* ===== فیلترهای پیشرفته ===== */
.rda-search-section {
	background: var(--glass);
	backdrop-filter: blur(12px);
	border: 1px solid var(--glass-border);
	border-radius: 24px;
	padding: 24px;
	margin-bottom: 48px;
}

.rda-search-grid {
	display: grid;
	grid-template-columns: 1fr 0.8fr 0.8fr;
	gap: 20px;
}

.rda-search-box,
.rda-select-box {
	position: relative;
	display: flex;
	align-items: center;
}

.rda-search-box i,
.rda-select-box i {
	position: absolute;
	left: 16px;
	font-size: 1rem;
	color: var(--text-tertiary);
}

.rda-search-input,
.rda-select {
	width: 100%;
	padding: 14px 18px 14px 48px;
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	border-radius: 18px;
	color: var(--text-primary);
	font-size: 0.9rem;
	font-family: inherit;
	transition: all 0.2s ease;
}

.rda-search-input:focus,
.rda-select:focus {
	outline: none;
	border-color: var(--primary);
	box-shadow: 0 0 0 3px var(--primary-light);
}

/* ===== گرید کارت‌ها ===== */
.rda-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 28px;
	margin-bottom: 56px;
}

/* کارت */
.rda-card {
	position: relative;
	background: var(--glass);
	backdrop-filter: blur(12px);
	border: 1px solid var(--glass-border);
	border-radius: 28px;
	overflow: hidden;
	transition: all 0.35s cubic-bezier(0.2, 0, 0, 1);
}

.rda-card:hover {
	transform: translateY(-8px);
	border-color: var(--primary);
	box-shadow: 0 25px 45px -15px rgba(0, 0, 0, 0.35);
}

.rda-card-inner {
	position: relative;
}

.rda-card-link {
	position: absolute;
	inset: 0;
	z-index: 1;
}

/* تصویر کارت */
.rda-card-image {
	position: relative;
	aspect-ratio: 1;
	overflow: hidden;
}

.rda-card-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s cubic-bezier(0.2, 0, 0, 1);
}

.rda-card:hover .rda-card-img {
	transform: scale(1.08);
}

.rda-card-fallback {
	width: 100%;
	height: 100%;
	background: linear-gradient(-135deg, var(--bg-tertiary), var(--border-primary));
	display: flex;
	align-items: center;
	justify-content: center;
}

.rda-card-fallback i {
	font-size: 64px;
	color: var(--text-tertiary);
}

.rda-card-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.2) 50%, transparent 100%);
	opacity: 0;
	transition: opacity 0.35s ease;
}

.rda-card:hover .rda-card-overlay {
	opacity: 1;
}

/* بج LIVE */
.rda-live-badge {
	position: absolute;
	top: 16px;
	left: 16px;
	display: flex;
	align-items: center;
	gap: 6px;
	background: linear-gradient(-135deg, var(--danger), #dc2626);
	padding: 5px 12px;
	border-radius: 100px;
	font-size: 0.7rem;
	font-weight: 700;
	color: white;
	z-index: 3;
	box-shadow: var(--shadow-md);
}

.rda-live-dot {
	width: 8px;
	height: 8px;
	background: white;
	border-radius: 50%;
	animation: rdaPulse 1.5s infinite;
}

@keyframes rdaPulse {
	0%, 100% {
		opacity: 1;
		transform: scale(1);
	}

	50% {
		opacity: 0.5;
		transform: scale(0.8);
	}
}

/* فرکانس */
.rda-frequency {
	position: absolute;
	bottom: 16px;
	left: 16px;
	display: flex;
	align-items: center;
	gap: 5px;
	background: rgba(0,0,0,0.65);
	backdrop-filter: blur(8px);
	padding: 5px 12px;
	border-radius: 100px;
	font-size: 0.7rem;
	font-weight: 500;
	color: white;
	z-index: 3;
}

.rda-frequency i {
	font-size: 0.7rem;
	color: var(--gold);
}

/* شنوندگان */
.rda-listeners {
	position: absolute;
	bottom: 16px;
	right: 16px;
	display: flex;
	align-items: center;
	gap: 6px;
	background: rgba(0,0,0,0.65);
	backdrop-filter: blur(8px);
	padding: 5px 12px;
	border-radius: 100px;
	font-size: 0.7rem;
	font-weight: 500;
	color: white;
	z-index: 3;
}

.rda-listeners i {
	font-size: 0.7rem;
	color: var(--cyan);
}

/* دکمه پخش */
.rda-play-btn {
	position: absolute;
	top: 50%;
	right: 50%;
	transform: translate(50%, -50%) scale(0.9);
	width: 60px;
	height: 60px;
	background: linear-gradient(-135deg, var(--primary), var(--primary-hover));
	border: none;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	opacity: 0;
	transition: all 0.3s cubic-bezier(0.2, 0, 0, 1);
	z-index: 4;
	box-shadow: 0 8px 25px rgba(0,0,0,0.3);
}

.rda-play-btn i {
	font-size: 1.5rem;
	color: white;
	margin-left: 3px;
}

.rda-card:hover .rda-play-btn {
	opacity: 1;
	transform: translate(50%, -50%) scale(1);
}

.rda-play-btn:hover {
	transform: translate(50%, -50%) scale(1.12);
	background: linear-gradient(-135deg, var(--primary-hover), var(--primary));
}

/* محتوای کارت */
.rda-card-content {
	padding: 18px;
}

.rda-card-header {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 10px;
	margin-bottom: 10px;
}

.rda-card-title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--text-primary);
	margin: 0;
	line-height: 1.4;
	flex: 1;
}

.rda-status {
	font-size: 0.65rem;
	font-weight: 600;
	padding: 3px 10px;
	border-radius: 100px;
	white-space: nowrap;
}

.rda-status-live {
	background: rgba(var(--success-rgb, 16, 185, 129), 0.15);
	color: var(--success);
}

.rda-status-offline {
	background: var(--bg-tertiary);
	color: var(--text-tertiary);
}

.rda-status-scheduled {
	background: rgba(var(--primary-rgb), 0.15);
	color: var(--primary);
}

.rda-status-archived {
	background: rgba(var(--accent-rgb), 0.15);
	color: var(--accent);
}

.rda-card-excerpt {
	font-size: 0.75rem;
	color: var(--text-secondary);
	line-height: 1.55;
	margin-bottom: 14px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.rda-card-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-bottom: 18px;
}

.rda-meta-item {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 0.7rem;
	color: var(--text-tertiary);
}

.rda-meta-item i {
	font-size: 0.7rem;
	color: var(--primary);
}

.rda-card-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: 14px;
	border-top: 1px solid var(--border-primary);
}

.rda-djs {
	display: flex;
	align-items: center;
}

.rda-dj-avatar {
	width: 30px;
	height: 30px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.7rem;
	font-weight: 600;
	color: white;
	border: 2px solid var(--bg-primary);
	margin-left: -8px;
}

.rda-dj-avatar:first-child {
	margin-left: 0;
}

.rda-dj-more {
	width: 30px;
	height: 30px;
	background: var(--bg-tertiary);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.65rem;
	font-weight: 600;
	color: var(--text-secondary);
	border: 2px solid var(--bg-primary);
	margin-left: -8px;
}

.rda-card-actions {
	display: flex;
	align-items: center;
	gap: 8px;
}

.rda-save-btn {
	width: 34px;
	height: 34px;
	background: var(--glass);
	border: 1px solid var(--border-primary);
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	color: var(--text-tertiary);
	transition: all 0.2s ease;
}

.rda-save-btn i {
	font-size: 1rem;
}

.rda-save-btn:hover {
	color: var(--primary);
	border-color: var(--primary);
	background: var(--primary-light);
}

.rda-details-btn {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 7px 14px;
	background: var(--primary-light);
	border-radius: 12px;
	font-size: 0.7rem;
	font-weight: 600;
	color: var(--primary);
	text-decoration: none;
	transition: all 0.2s ease;
}

.rda-details-btn i {
	font-size: 0.7rem;
	transition: transform 0.2s ease;
}

.rda-details-btn:hover {
	background: var(--primary);
	color: white;
}

.rda-details-btn:hover i {
	transform: translateX(3px);
}

/* ===== صفحه‌بندی ===== */
.rda-pagination {
	display: flex;
	justify-content: center;
	margin-top: 20px;
}

.rda-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: 0 5px;
	background: var(--glass);
	border: 1px solid var(--border-primary);
	border-radius: 14px;
	color: var(--text-secondary);
	font-size: 0.9rem;
	font-weight: 500;
	text-decoration: none;
	transition: all 0.2s ease;
}

.rda-pagination .page-numbers i {
	font-size: 0.9rem;
}

.rda-pagination .page-numbers:hover {
	border-color: var(--primary);
	color: var(--primary);
	transform: translateY(-2px);
}

.rda-pagination .page-numbers.current {
	background: linear-gradient(-135deg, var(--primary), var(--primary-hover));
	border-color: transparent;
	color: white;
}

.rda-pagination .prev,
.rda-pagination .next {
	width: auto;
	padding: 0 20px;
	gap: 8px;
}

/* ===== حالت خالی ===== */
.rda-empty {
	text-align: center;
	padding: 70px 30px;
	background: var(--glass);
	backdrop-filter: blur(12px);
	border: 1px solid var(--glass-border);
	border-radius: 40px;
}

.rda-empty-icon {
	width: 90px;
	height: 90px;
	margin: 0 auto 24px;
	background: var(--bg-tertiary);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.rda-empty-icon i {
	font-size: 48px;
	color: var(--text-tertiary);
}

.rda-empty-title {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 10px;
}

.rda-empty-desc {
	color: var(--text-secondary);
	margin-bottom: 30px;
}

.rda-empty-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 32px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 100px;
	color: white;
	text-decoration: none;
	font-weight: 600;
	transition: all 0.25s ease;
}

.rda-empty-btn i {
	font-size: 1rem;
}

.rda-empty-btn:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(var(--primary-rgb), 0.35);
}

/* ===== CTA ===== */
.rda-cta {
	margin-top: 64px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 40px;
	overflow: hidden;
}

.rda-cta-content {
	padding: 56px 48px;
	text-align: center;
}

.rda-cta-title {
	font-size: 2rem;
	font-weight: 700;
	color: white;
	margin-bottom: 16px;
}

.rda-cta-desc {
	color: rgba(255,255,255,0.9);
	margin-bottom: 32px;
	max-width: 550px;
	margin-right: auto;
	margin-left: auto;
}

.rda-cta-buttons {
	display: flex;
	gap: 18px;
	justify-content: center;
	flex-wrap: wrap;
}

.rda-cta-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 34px;
	border-radius: 100px;
	font-weight: 600;
	text-decoration: none;
	transition: all 0.25s ease;
}

.rda-cta-btn i {
	font-size: 1rem;
}

.rda-cta-btn-primary {
	background: white;
	color: var(--primary);
}

.rda-cta-btn-primary:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(0,0,0,0.2);
}

.rda-cta-btn-secondary {
	background: rgba(255,255,255,0.2);
	backdrop-filter: blur(8px);
	color: white;
}

.rda-cta-btn-secondary:hover {
	background: rgba(255,255,255,0.3);
	transform: translateY(-3px);
}

/* ===== رسپانسیو ===== */
@media (max-width: 1200px) {
	.rda-grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 24px;
	}
}

@media (max-width: 900px) {
	.rda-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.rda-search-grid {
		grid-template-columns: 1fr;
		gap: 15px;
	}

	.rda-header {
		padding: 40px 28px;
	}

	.rda-title {
		font-size: 2.2rem;
	}

	.rda-stats {
		gap: 20px;
	}

	.rda-stat-number {
		font-size: 1.8rem;
	}
}

@media (max-width: 600px) {
	.rda-container {
		padding: 20px 16px 48px;
	}

	.rda-grid {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.rda-filters {
		gap: 10px;
	}

	.rda-filter {
		padding: 7px 16px;
		font-size: 0.75rem;
	}

	.rda-cta-content {
		padding: 40px 24px;
	}

	.rda-cta-title {
		font-size: 1.5rem;
	}
}

/*------------------------------- Radio Single Style -------------------------------*/

/* استایل‌های اصلی صفحه */
.raditone-single-radio {
	background: linear-gradient(to bottom, var(--bg-secondary), var(--bg-primary));
}

/* هدر رادیو */
.raditone-radio-header {
	background: linear-gradient(to bottom left, var(--primary), var(--accent));
	border: 1px solid var(--primary);
}

.raditone-audio-waves div {
	background-color: var(--text-dark-bg);
}

/* تصویر رادیو */
.raditone-radio-image {
	border-color: rgba(var(--bg-primary-rgb), 0.2);
}

.raditone-radio-fallback {
	background: linear-gradient(to bottom left, var(--primary-light), var(--accent));
	border-color: rgba(var(--bg-primary-rgb), 0.2);
}

.raditone-radio-fallback svg {
	color: var(--text-dark-bg);
	opacity: 0.8;
}

/* برچسب‌های هدر */
.raditone-live-tag {
	background: linear-gradient(to left, var(--success), var(--primary));
	color: var(--text-dark-bg);
}

.raditone-offline-tag {
	background-color: var(--text-tertiary);
	color: var(--text-dark-bg);
}

.raditone-frequency-tag {
	background-color: rgba(var(--bg-primary-rgb), 0.2);
	backdrop-filter: blur(8px);
	color: var(--text-dark-bg);
}

.raditone-frequency-tag svg {
	color: var(--text-dark-bg);
}

/* عنوان و توضیحات */
.raditone-radio-title {
	color: var(--text-dark-bg);
}

.raditone-radio-excerpt {
	color: rgba(var(--text-tertiary-rgb), 0.9);
}

/* آمار رادیو */
.raditone-listeners-count,
.raditone-bitrate-value,
.raditone-genres-count {
	color: var(--text-dark-bg);
}

.raditone-listeners-label,
.raditone-bitrate-label,
.raditone-genres-label {
	color: rgba(var(--text-tertiary-rgb), 0.8);
}

/* دکمه‌های اکشن */
.raditone-play-now-btn {
	background: linear-gradient(to left, var(--success), var(--primary));
	color: var(--text-dark-bg);
}

.raditone-play-now-btn:hover {
	background: linear-gradient(to left, var(--success), var(--primary-hover));
}

.raditone-save-btn,
.raditone-share-btn {
	background-color: rgba(var(--bg-primary-rgb), 0.2);
	backdrop-filter: blur(8px);
	color: var(--text-dark-bg);
}

.raditone-save-btn:hover,
.raditone-share-btn:hover {
	background-color: rgba(var(--bg-primary-rgb), 0.3);
}

/* کانتینر پلیر */
.raditone-player-container {
	background-color: var(--bg-primary);
	border-color: var(--border-primary);
}

.raditone-player-title {
	color: var(--text-primary);
}

.raditone-player-title svg {
	color: var(--primary);
}

.raditone-player-status {
	background-color: var(--success);
	color: var(--text-dark-bg);
}

.raditone-player-status span {
	background-color: var(--text-dark-bg);
}

/* بدنه پلیر */
.raditone-player-body {
	background: linear-gradient(to left, var(--bg-secondary), var(--bg-tertiary));
}

.raditone-quality-label,
.raditone-format-label {
	color: var(--text-secondary);
}

.raditone-quality-value,
.raditone-format-value {
	color: var(--primary);
}

/* دکمه پخش/مکث */
.raditone-play-pause-btn {
	background: linear-gradient(to left, var(--primary), var(--accent));
	color: var(--text-dark-bg);
}

.raditone-play-pause-btn:hover {
	background: linear-gradient(to left, var(--primary-hover), var(--accent));
}

/* نوار پیشرفت */
.raditone-time-display {
	color: var(--text-secondary);
}

.raditone-progress-track {
	background-color: var(--bg-tertiary);
}

.raditone-progress-bar {
	background: linear-gradient(to left, var(--primary), var(--accent));
}

/* کنترل حجم */
.raditone-volume-controls svg {
	color: var(--text-tertiary);
}

.raditone-volume-controls input[type="range"] {
	accent-color: var(--primary);
}

.raditone-volume-percent {
	color: var(--text-secondary);
}

/* لینک استریم */
.raditone-stream-link {
	background-color: var(--bg-tertiary);
}

.raditone-stream-link-label {
	color: var(--text-secondary);
}

.raditone-copy-link-btn {
	color: var(--primary);
}

.raditone-copy-link-btn:hover {
	color: var(--primary-hover);
}

.raditone-stream-link-input {
	background-color: var(--bg-primary);
	border-color: var(--border-primary);
	color: var(--text-secondary);
}

/* کانتینرها */
.raditone-playlist-container,
.raditone-content-container,
.raditone-tech-info,
.raditone-genres-container,
.raditone-djs-container,
.raditone-schedule-container,
.raditone-related-container {
	background-color: var(--bg-primary);
	border-color: var(--border-primary);
}

/* تیترها */
.raditone-playlist-title,
.raditone-content-title,
.raditone-sidebar-title,
.raditone-related-title {
	color: var(--text-primary);
}

.raditone-playlist-title svg,
.raditone-content-title svg,
.raditone-sidebar-title svg {
	color: var(--primary);
}

.raditone-playlist-count {
	color: var(--text-secondary);
}

/* آیتم پلی‌لیست */
.raditone-playlist-item {
	background-color: var(--bg-tertiary);
}

.raditone-playlist-item:hover {
	background-color: var(--primary-light);
}

.raditone-playlist-number {
	background: linear-gradient(to left, var(--primary), var(--accent));
	color: var(--text-dark-bg);
}

.raditone-playlist-song-title {
	color: var(--text-primary);
}

.raditone-playlist-song-info {
	color: var(--text-secondary);
}

.raditone-playlist-album {
	color: var(--text-tertiary);
}

.raditone-playlist-duration {
	background-color: var(--bg-secondary);
	color: var(--text-secondary);
}

.raditone-playlist-play-btn {
	color: var(--text-tertiary);
}

.raditone-playlist-play-btn:hover {
	color: var(--primary);
	background-color: var(--bg-tertiary);
}

/* محتوای اصلی */
.raditone-main-content {
	color: var(--text-primary);
}

.raditone-main-content h2 {
	color: var(--text-primary);
}

.raditone-main-content h3 {
	color: var(--text-primary);
}

.raditone-main-content p {
	color: var(--text-secondary);
}

.raditone-main-content ul,
.raditone-main-content ol {
	color: var(--text-secondary);
}

/* تگ‌ها */
.raditone-tags-container {
	border-color: var(--border-primary);
}

.raditone-tag {
	background-color: var(--primary-light);
	color: var(--primary);
}

.raditone-tag:hover {
	background-color: var(--primary);
	color: var(--text-dark-bg);
}

/* آیتم‌های اطلاعات فنی */
.raditone-tech-label {
	color: var(--text-secondary);
}

.raditone-tech-value {
	color: var(--text-primary);
}

.raditone-status-value {
	color: var(--success);
}

/* آیتم‌های ژانر */
.raditone-genre-item {
	background-color: var(--primary-light);
}

.raditone-genre-item:hover {
	background-color: var(--primary);
}

.raditone-genre-name {
	color: var(--primary);
}

.raditone-genre-item:hover .raditone-genre-name {
	color: var(--text-dark-bg);
}

.raditone-genre-item svg {
	color: var(--text-tertiary);
}

.raditone-genre-item:hover svg {
	color: var(--text-dark-bg);
}

/* آیتم‌های دی‌جی */
.raditone-dj-item {
	background-color: var(--bg-tertiary);
}

.raditone-dj-item:hover {
	background-color: var(--primary-light);
}

.raditone-dj-avatar {
	background: linear-gradient(to left, var(--primary-light), var(--accent));
	color: var(--primary);
}

.raditone-dj-name {
	color: var(--text-primary);
}

.raditone-dj-role {
	color: var(--text-secondary);
}

/* آیتم‌های برنامه زمانی */
.raditone-schedule-item {
	background-color: var(--primary-light);
}

.raditone-schedule-day {
	color: var(--primary);
}

.raditone-schedule-time {
	color: var(--accent);
}

.raditone-schedule-program {
	color: var(--text-secondary);
}

/* رادیوهای مشابه */
.raditone-related-item {
	background-color: var(--bg-tertiary);
}

.raditone-related-item:hover {
	background-color: var(--primary-light);
}

.raditone-related-name {
	color: var(--text-primary);
}

.raditone-related-genre {
	color: var(--text-secondary);
}

.raditone-related-fallback {
	background: linear-gradient(to left, var(--primary-light), var(--accent));
}

.raditone-related-fallback svg {
	color: var(--primary);
}

.raditone-no-related {
	color: var(--text-secondary);
}

/* انیمیشن پالس */
@keyframes pulse {
	0%, 100% {
		opacity: 1;
	}

	50% {
		opacity: 0.7;
	}
}

/* انیمیشن امواج صوتی */
@keyframes audio-wave {
	0%, 100% {
		height: 10%;
	}

	50% {
		height: 100%;
	}
}

/*------------------------------- Category Archive Style -------------------------------*/

/* ========== استایل‌ها ========== */
.category-archive {
	background: var(--bg-primary);
	min-height: 100vh;
}

.category-container {
	max-width: 1600px;
	margin: 0 auto;
	padding: 0 24px;
}

@media (max-width: 640px) {
	.category-container {
		padding: 0 16px;
	}
}

/* هدر */
.category-hero {
	position: relative;
	margin-bottom: 48px;
	border-radius: 32px;
	overflow: hidden;
}

.category-hero-bg {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.category-hero-bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: brightness(0.6) blur(2px);
}

.category-hero-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(-135deg, 
        rgba(var(--primary-rgb), 0.85) 0%, 
        rgba(var(--accent-rgb), 0.85) 100%);
	z-index: 1;
}

.category-hero-content {
	position: relative;
	z-index: 2;
	padding: 60px 40px;
	text-align: center;
}

.category-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 20px;
	background: rgba(255,255,255,0.15);
	backdrop-filter: blur(10px);
	border-radius: 100px;
	font-size: 0.75rem;
	color: white;
	margin-bottom: 24px;
}

.category-hero-title {
	font-size: 3rem;
	font-weight: 800;
	color: white;
	margin-bottom: 16px;
}

.category-hero-desc {
	font-size: 1rem;
	color: rgba(255,255,255,0.9);
	max-width: 600px;
	margin: 0 auto 24px;
}

.category-stats {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 8px 20px;
	background: rgba(0,0,0,0.3);
	backdrop-filter: blur(10px);
	border-radius: 100px;
}

.category-stats-item {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 0.8rem;
	color: white;
}

@media (max-width: 768px) {
	.category-hero-content {
		padding: 40px 24px;
	}

	.category-hero-title {
		font-size: 2rem;
	}
}

/* نوار ابزار */
.category-toolbar {
	background: var(--bg-secondary);
	border-radius: 20px;
	padding: 16px 24px;
	margin-bottom: 32px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 16px;
	border: 1px solid var(--border-primary);
	top: var(--header-height);
	z-index: 50;
}

.view-toggle {
	display: flex;
	gap: 8px;
	background: var(--bg-tertiary);
	padding: 4px;
	border-radius: 50px;
}

.view-btn {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 16px;
	background: transparent;
	border: none;
	border-radius: 40px;
	color: var(--text-secondary);
	font-size: 0.8rem;
	cursor: pointer;
	transition: all 0.3s;
}

.view-btn.active {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	color: white;
}

.sort-select-wrapper {
	position: relative;
}

.sort-select-wrapper i {
	position: absolute;
	left: 14px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--text-tertiary);
	pointer-events: none;
}

.sort-select {
	padding: 8px 16px 8px 32px;
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	border-radius: 40px;
	color: var(--text-primary);
	font-size: 0.8rem;
	cursor: pointer;
	appearance: none;
}

.results-count {
	font-size: 0.8rem;
	color: var(--text-tertiary);
	background: var(--bg-tertiary);
	padding: 6px 14px;
	border-radius: 40px;
}

.results-count strong {
	color: var(--primary);
}

/* حالت لیست */
.posts-grid.list-view {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.posts-grid.list-view .post-card {
	display: flex;
	flex-direction: row;
}

.posts-grid.list-view .post-thumbnail {
	width: 200px;
	height: 200px;
	flex-shrink: 0;
}

.posts-grid.list-view .post-content {
	flex: 1;
}

@media (max-width: 768px) {
	.posts-grid.list-view .post-card {
		flex-direction: column;
	}

	.posts-grid.list-view .post-thumbnail {
		width: 100%;
		height: auto;
		aspect-ratio: 1;
	}
}

@media (max-width: 480px) {
	.posts-grid {
		gap: 12px;
	}

	.view-btn span {
		display: none;
	}

	.view-btn {
		padding: 8px 12px;
	}
}

/* کارت پست */
.post-card {
	background: var(--bg-secondary);
	border-radius: 20px;
	overflow: hidden;
	transition: all 0.3s;
	border: 1px solid var(--border-primary);
	animation: fadeInUp 0.4s ease forwards;
	opacity: 0;
	transform: translateY(20px);
}

@keyframes fadeInUp {
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.post-card:hover {
	transform: translateY(-6px);
	border-color: var(--primary);
	box-shadow: var(--shadow-xl);
}

.post-thumbnail {
	position: relative;
	overflow: hidden;
	aspect-ratio: 1;
	background: var(--bg-tertiary);
}

.post-thumbnail img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s;
}

.post-card:hover .post-thumbnail img {
	transform: scale(1.08);
}

.post-play-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,0.5);
	backdrop-filter: blur(8px);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.3s;
}

.post-card:hover .post-play-overlay {
	opacity: 1;
}

.play-btn {
	width: 48px;
	height: 48px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-size: 1rem;
	transform: scale(0.8);
	transition: transform 0.3s;
	cursor: pointer;
}

.post-card:hover .play-btn {
	transform: scale(1);
}

.category-badge-card {
	position: absolute;
	top: 12px;
	left: 12px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	padding: 4px 10px;
	border-radius: 50px;
	font-size: 0.65rem;
	font-weight: 600;
	color: white;
	display: flex;
	align-items: center;
	gap: 4px;
	z-index: 2;
}

.post-content {
	padding: 16px;
}

.post-track-name {
	margin: 0 0 8px;
	font-size: 0.95rem;
	font-weight: 700;
	line-height: 1.4;
}

.post-track-name a {
	color: var(--text-primary);
	text-decoration: none;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.post-track-name a:hover {
	color: var(--primary);
}

.post-artist-name {
	display: flex;
	align-items: center;
	gap: 6px;
	color: var(--text-tertiary);
	font-size: 0.75rem;
	margin-bottom: 12px;
}

.post-artist-name i {
	font-size: 0.7rem;
	color: var(--primary);
}

.post-meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: 12px;
	border-top: 1px solid var(--border-primary);
	font-size: 0.65rem;
}

.post-meta-left {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}

.post-date {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--text-tertiary);
}

.post-views {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--primary);
	font-weight: 600;
}

.post-comments {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--accent);
	font-weight: 600;
}

.read-more-btn {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--primary);
	text-decoration: none;
	font-weight: 600;
	font-size: 0.65rem;
	transition: gap 0.3s;
}

.read-more-btn:hover {
	gap: 8px;
}

/* دکمه بارگذاری بیشتر */
.load-more-container {
	text-align: center;
	margin: 20px 0 60px;
}

.load-more-btn {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 14px 32px;
	background: var(--bg-secondary);
	border: 2px solid var(--primary);
	border-radius: 50px;
	color: var(--primary);
	font-size: 0.9rem;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.3s;
}

.load-more-btn:hover {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	color: white;
	transform: translateY(-2px);
}

.load-more-btn.loading {
	opacity: 0.6;
	cursor: wait;
}

.load-more-btn.loading i {
	animation: spin 1s linear infinite;
}

@keyframes spin {
	to {
		transform: rotate(-360deg);
	}
}

.end-message {
	text-align: center;
	padding: 20px;
	color: var(--text-tertiary);
	font-size: 0.85rem;
	margin-bottom: 60px;
}

/* اسکلتون */
.skeleton-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 24px;
	margin-bottom: 48px;
}

@media (max-width: 1400px) {
	.skeleton-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 1100px) {
	.skeleton-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 768px) {
	.skeleton-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

.skeleton-card {
	background: var(--bg-secondary);
	border-radius: 20px;
	overflow: hidden;
	border: 1px solid var(--border-primary);
}

.skeleton-thumbnail {
	aspect-ratio: 1;
	background: linear-gradient(-90deg, 
        var(--bg-tertiary) 25%, 
        var(--bg-secondary) 50%, 
        var(--bg-tertiary) 75%);
	background-size: 200% 100%;
	animation: skeleton-loading 1.5s infinite;
}

.skeleton-content {
	padding: 16px;
}

.skeleton-title {
	height: 18px;
	background: var(--bg-tertiary);
	border-radius: 6px;
	margin-bottom: 10px;
	width: 85%;
	animation: skeleton-loading 1.5s infinite;
}

.skeleton-artist {
	height: 14px;
	background: var(--bg-tertiary);
	border-radius: 6px;
	margin-bottom: 15px;
	width: 60%;
	animation: skeleton-loading 1.5s infinite;
}

.skeleton-meta {
	height: 12px;
	background: var(--bg-tertiary);
	border-radius: 6px;
	width: 70%;
	animation: skeleton-loading 1.5s infinite;
}

@keyframes skeleton-loading {
	0% {
		background-position: -100% 0;
	}

	100% {
		background-position: 300% 0;
	}
}

.empty-state-category {
	text-align: center;
	padding: 80px 20px;
	background: var(--bg-secondary);
	border-radius: 32px;
	grid-column: 1/-1;
}

.empty-icon {
	width: 100px;
	height: 100px;
	margin: 0 auto 24px;
	background: linear-gradient(-135deg, var(--primary-light), var(--accent-light));
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.empty-icon i {
	font-size: 2.5rem;
	color: var(--primary);
}

.scroll-top-btn {
	position: fixed;
	bottom: 30px;
	left: 30px;
	width: 48px;
	height: 48px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s;
	z-index: 100;
}

.scroll-top-btn.visible {
	opacity: 1;
	visibility: visible;
}

@media (max-width: 768px) {
	.category-toolbar {
		flex-direction: column;
		align-items: stretch;
	}

	.category-toolbar-left, .category-toolbar-right {
		justify-content: space-between;
	}

	.scroll-top-btn {
		bottom: 20px;
		left: 20px;
		width: 42px;
		height: 42px;
	}
}

.category-toolbar-left {
	display: flex;
}

/*------------------------------- Comment Style -------------------------------*/

.raditone-comments-simple {
	margin: 30px 0;
}

.comment-respond {
	padding: 10px;
}
/* ===== هدر ===== */
.comments-simple-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 15px;
	margin-bottom: 25px;
	padding-bottom: 15px;
	border-bottom: 2px solid var(--border-primary);
}

.comments-simple-title {
	display: flex;
	align-items: center;
	gap: 10px;
}

.comments-simple-title i {
	font-size: 1.3rem;
	color: var(--primary);
}

.comments-simple-title h3 {
	margin: 0;
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--text-primary);
}

.comments-simple-filter {
	display: flex;
	gap: 5px;
	background: var(--bg-tertiary);
	padding: 3px;
	border-radius: 30px;
}

.filter-btn {
	padding: 5px 12px;
	background: transparent;
	border: none;
	border-radius: 30px;
	font-size: 0.7rem;
	color: var(--text-tertiary);
	cursor: pointer;
	transition: all 0.2s;
}

.filter-btn.active {
	background: var(--primary);
	color: white;
}

/* ===== لیست نظرات ===== */
.comments-simple-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.comments-simple-list .comment {
	margin-bottom: 20px;
}

/* کارت نظر */
.comment-simple-card {
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 16px;
	padding: 16px;
	transition: all 0.2s;
}

.comment-simple-card:hover {
	border-color: var(--primary);
}

/* نظرات تو در تو */
.comments-simple-list .children {
	list-style: none;
	padding-left: 40px;
	margin-top: 15px;
}

.comments-simple-list .children .comment-simple-card {
	background: var(--bg-tertiary);
}

/* هدر نظر */
.comment-simple-header {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 12px;
}

.comment-avatar img {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 2px solid var(--primary);
}

.comment-info {
	flex: 1;
}

.comment-author {
	font-weight: 600;
	color: var(--text-primary);
	font-size: 0.9rem;
	margin-bottom: 2px;
}

.comment-author a {
	color: var(--text-primary);
	text-decoration: none;
}

.comment-author a:hover {
	color: var(--primary);
}

.comment-meta {
	font-size: 0.65rem;
	color: var(--text-tertiary);
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

/* رنگ‌بندی نقش‌ها */
.comment-badge {
	font-size: 0.6rem;
	padding: 2px 8px;
	border-radius: 20px;
	margin-left: 8px;
	display: inline-block;
}

.comment-badge.admin-badge {
	background: linear-gradient(-135deg, #FFD700, #FFA500);
	color: #5D3A1A;
	box-shadow: 0 2px 4px rgba(255,215,0,0.3);
}

.comment-badge.editor-badge {
	background: linear-gradient(-135deg, #6C5CE7, #4834D4);
	color: white;
	box-shadow: 0 2px 4px rgba(108,92,231,0.3);
}

.comment-badge.author-badge {
	background: linear-gradient(-135deg, #00B894, #009432);
	color: white;
	box-shadow: 0 2px 4px rgba(0,184,148,0.3);
}

.comment-badge.vip-badge {
	background: linear-gradient(-135deg, #E84393, #D63031);
	color: white;
	box-shadow: 0 2px 4px rgba(232,67,147,0.3);
}

.comment-badge.postauthor-badge {
	background: linear-gradient(-135deg, #0984E3, #0652DD);
	color: white;
	box-shadow: 0 2px 4px rgba(9,132,227,0.3);
}

.comment-badge.moderator-badge {
	background: linear-gradient(-135deg, #F39C12, #E67E22);
	color: white;
	box-shadow: 0 2px 4px rgba(243,156,18,0.3);
}

/* محتوای نظر */
.comment-content {
	margin: 10px 0;
	padding-left: 12px;
	border-left: 2px solid var(--primary);
}

.comment-content p {
	margin: 0;
	font-size: 0.85rem;
	line-height: 1.6;
	color: var(--text-secondary);
}

/* نظر در انتظار */
.comment-awaiting-moderation {
	font-size: 0.7rem;
	color: var(--gold);
	display: flex;
	align-items: center;
	gap: 5px;
	margin-bottom: 8px;
}

/* دکمه پاسخ */
.comment-reply {
	margin-top: 10px;
	text-align: right;
}

.comment-reply-link {
	font-size: 0.7rem;
	color: var(--primary);
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

.comment-reply-link:hover {
	text-decoration: underline;
}

/* ===== صفحه‌بندی ===== */
.comment-navigation .nav-links {
	display: flex;
	justify-content: center;
	gap: 10px;
	margin-top: 20px;
}

.comment-navigation .nav-links a,
.comment-navigation .nav-links .page-numbers {
	padding: 6px 12px;
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	border-radius: 20px;
	font-size: 0.75rem;
	color: var(--text-secondary);
	text-decoration: none;
}

.comment-navigation .nav-links .current,
.comment-navigation .nav-links a:hover {
	background: var(--primary);
	border-color: var(--primary);
	color: white;
}

/* ===== بسته بودن ===== */
.comments-simple-closed {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 30px;
	background: var(--bg-tertiary);
	border-radius: 16px;
	color: var(--text-tertiary);
	font-size: 0.85rem;
}

.comments-simple-closed i {
	font-size: 1.2rem;
}

/* ===== فرم نظر ===== */
#comment-form-simple {
	margin-top: 30px;
	padding-top: 20px;
	border-top: 2px solid var(--border-primary);
}

#comment-form-simple .comment-reply-title {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 20px;
	font-size: 1rem;
	font-weight: 600;
	color: var(--text-primary);
}

#comment-form-simple .comment-reply-title i {
	color: var(--primary);
}

#comment-form-simple .comment-reply-title small {
	margin-left: auto;
}

#comment-form-simple .comment-reply-title a {
	font-size: 0.7rem;
	color: var(--danger);
	text-decoration: none;
}

.form-field {
	margin-bottom: 15px;
}

.form-field input,
.form-field textarea {
	width: 100%;
	padding: 12px;
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	border-radius: 12px;
	font-size: 0.85rem;
	color: var(--text-primary);
	font-family: inherit;
}

.form-field input:focus,
.form-field textarea:focus {
	outline: none;
	border-color: var(--primary);
}

.form-field textarea {
	resize: vertical;
	min-height: 100px;
}

.form-field.full {
	grid-column: span 2;
}

.logged-simple {
	padding: 10px;
	background: var(--bg-tertiary);
	border-radius: 12px;
	font-size: 0.8rem;
	margin-bottom: 15px;
	display: flex;
	align-items: center;
	gap: 8px;
}

.logged-simple a {
	color: var(--primary);
	text-decoration: none;
}

.comment-submit-btn {
	width: 100%;
	padding: 12px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border: none;
	border-radius: 40px;
	color: white;
	font-size: 0.9rem;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.2s;
}

.comment-submit-btn:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-primary);
}

/* هشدار سانسور */
.profanity-warning {
	background: rgba(220, 53, 69, 0.1);
	border: 1px solid #dc3545;
	border-radius: 8px;
	padding: 8px 12px;
	margin-bottom: 15px;
	font-size: 0.75rem;
	color: #dc3545;
	display: flex;
	align-items: center;
	gap: 8px;
}

/* ===== ریسپانسیو ===== */
@media (max-width: 640px) {
	.comments-simple-header {
		flex-direction: column;
		align-items: flex-start;
	}

	.comments-simple-list .children {
		padding-left: 20px;
	}

	.comment-simple-header {
		flex-wrap: wrap;
	}

	.comment-avatar img {
		width: 36px;
		height: 36px;
	}

	.comment-content p {
		font-size: 0.8rem;
	}
}

@media (max-width: 480px) {
	.comment-simple-card {
		padding: 12px;
	}
}

/*------------------------------- Search Style -------------------------------*/
    /* ---------- کامپوننت اصلی ---------- */
.header-search-wrapper {
	position: relative;
	width: 100%;
	max-width: 620px;
	margin: 0 auto;
}

    /* ---------- حالت دسکتاپ ---------- */
.search-container-group {
	position: relative;
}

.search-input-wrapper {
	display: flex;
	align-items: center;
	background: var(--search-input-bg);
	border: 2px solid var(--search-border);
	border-radius: var(--search-radius);
	padding: 0 4px 0 8px;
	transition: all 0.3s ease;
	box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.search-input-wrapper:focus-within {
	border-color: var(--search-accent);
	box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.15);
	background: var(--search-bg);
}

.search-input-field {
	flex: 1;
	height: 32px;
	padding: 0 16px;
	background: transparent;
	border: none;
	outline: none;
	font-size: 0.7rem;
	color: var(--search-text);
	font-weight: 400;
	letter-spacing: 0.3px;
	min-width: 0;
}

.search-input-field::placeholder {
	color: #94a3b8;
	font-weight: 300;
	font-size: 0.95rem;
}

.search-controls {
	display: flex;
	align-items: center;
	gap: 4px;
	flex-shrink: 0;
}

.control-btn {
	width: 20px;
	height: 20px;
	border: none;
	background: transparent;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.2rem;
	color: #94a3b8;
	transition: all 0.2s;
	cursor: pointer;
}

.control-btn:hover {
	background: rgba(99, 102, 241, 0.08);
	color: var(--search-accent);
}

.submit-btn {
	background: var(--search-accent);
	color: white;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	font-size: 1.1rem;
	transition: all 0.3s;
}

.submit-btn:hover {
	background: #4f46e5;
	transform: scale(1.05);
	box-shadow: 0 4px 12px rgba(99, 102, 241, 0.3);
}

.clear-btn {
	color: #94a3b8;
	font-size: 1rem;
}

.clear-btn.hidden {
	display: none;
}

    /* ---------- دکمه جستجوی صوتی ---------- */
.voice-search-btn {
	width: 40px;
	height: 40px;
	border: none;
	background: transparent;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.1rem;
	color: #94a3b8;
	transition: all 0.2s;
	cursor: pointer;
	position: relative;
}

.voice-search-btn:hover {
	background: rgba(239, 68, 68, 0.1);
	color: #ef4444;
}

.voice-search-btn .pulse-animation {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: #ef4444;
	animation: pulse 1.2s ease-in-out infinite;
}

@keyframes pulse {
	0% {
		transform: scale(0.8);
		opacity: 0.7;
	}

	50% {
		transform: scale(1.2);
		opacity: 0.4;
	}

	100% {
		transform: scale(0.8);
		opacity: 0.7;
	}
}

    /* ---------- Dropdown نتایج دسکتاپ ---------- */
.search-results-dropdown {
	position: absolute;
	top: calc(100% + 12px);
	right: 0;
	left: 0;
	background: var(--search-bg);
	border-radius: var(--search-radius);
	box-shadow: var(--search-shadow);
	border: 1px solid var(--search-border);
	padding: 0;
	max-height: 580px;
	overflow-y: auto;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-8px);
	transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
	z-index: 9999;
	backdrop-filter: blur(12px);
	background: rgba(255,255,255,0.92);
}

.no-results {
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-content: center;
	align-items: center;
}

[data-theme="dark"] .search-results-dropdown {
	background: rgba(30, 41, 59, 0.95);
	backdrop-filter: blur(12px);
}

.search-results-dropdown.show {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.results-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 16px 20px 8px 20px;
	border-bottom: 1px solid var(--search-border);
}

.results-title {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--search-section-title);
	letter-spacing: 0.5px;
	text-transform: uppercase;
}

.results-count {
	font-size: 0.8rem;
	color: #94a3b8;
	background: var(--search-input-bg);
	padding: 2px 12px;
	border-radius: 20px;
}

.results-container {
	padding: 8px 8px 4px 8px;
}

    /* ---------- بخش‌های نتایج ---------- */
.search-section {
	margin-bottom: 12px;
	padding: 0 4px;
}

.search-section-header {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 6px 12px;
	border-radius: 10px;
	background: var(--search-input-bg);
	margin-bottom: 6px;
	font-size: 0.8rem;
	font-weight: 500;
	color: var(--search-section-title);
}

.search-section-header .section-icon {
	font-size: 0.9rem;
	color: var(--search-accent);
}

.section-count {
	margin-left: auto;
	font-size: 0.7rem;
	background: var(--search-bg);
	padding: 0 10px;
	border-radius: 20px;
	color: #94a3b8;
}

.search-section-content {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

    /* ---------- آیتم نتیجه ---------- */
.result-item {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 10px 14px;
	border-radius: 14px;
	text-decoration: none;
	color: var(--search-text);
	transition: all 0.2s;
	animation: fadeSlideIn 0.25s ease forwards;
	opacity: 0;
	transform: translateY(8px);
	background: transparent;
	border: 1px solid transparent;
}

.result-item:hover {
	background: var(--search-result-hover);
	border-color: var(--search-border);
	transform: translateX(-4px);
}

.result-item .result-image {
	flex-shrink: 0;
	width: 52px;
	height: 52px;
	border-radius: 12px;
	overflow: hidden;
	background: var(--search-border);
	box-shadow: 0 2px 6px rgba(0,0,0,0.06);
}

.result-item .result-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.result-item .result-content {
	flex: 1;
	min-width: 0;
}

.result-item .result-title {
	font-weight: 600;
	font-size: 0.95rem;
	line-height: 1.3;
	color: var(--search-text);
	margin-bottom: 2px;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.result-item .result-subtitle {
	font-size: 0.8rem;
	color: #94a3b8;
	display: flex;
	align-items: center;
	gap: 6px;
	flex-wrap: wrap;
}

.result-item .result-subtitle span {
	white-space: nowrap;
}

.result-item .result-excerpt {
	font-size: 0.8rem;
	color: #64748b;
	margin-top: 4px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	line-height: 1.4;
	background: var(--search-input-bg);
	padding: 4px 10px;
	border-radius: 8px;
	border-left: 3px solid var(--search-accent);
}

.result-item .result-type {
	font-size: 0.7rem;
	color: #94a3b8;
	background: var(--search-input-bg);
	padding: 0 10px;
	border-radius: 20px;
	display: inline-block;
	margin-top: 2px;
	font-weight: 500;
}

.search-highlight {
	background: rgba(245, 158, 11, 0.25);
	color: #b45309;
	padding: 0 2px;
	border-radius: 4px;
	font-weight: 600;
}

[data-theme="dark"] .search-highlight {
	background: rgba(245, 158, 11, 0.15);
	color: #fbbf24;
}

    /* ---------- انیمیشن ورود ---------- */
@keyframes fadeSlideIn {
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

    /* ---------- لودینگ ---------- */
.search-loading {
	text-align: center;
	padding: 40px 20px;
}

.loading-spinner {
	width: 36px;
	height: 36px;
	border: 4px solid var(--search-border);
	border-top: 4px solid var(--search-accent);
	border-radius: 50%;
	animation: spin 0.8s linear infinite;
	margin: 0 auto 12px;
}

@keyframes spin {
	to {
		transform: rotate(-360deg);
	}
}

    /* ---------- پیام بدون نتیجه ---------- */
.no-results {
	text-align: center;
	padding: 40px 20px;
	color: var(--search-section-title);
}

.no-results i {
	font-size: 2.5rem;
	color: #94a3b8;
	margin-bottom: 12px;
	display: block;
}

.no-results p {
	margin: 6px 0;
	font-size: 0.95rem;
}

.no-results .hint {
	font-size: 0.8rem;
	color: #94a3b8;
}

    /* ---------- فوتر نتایج ---------- */
.results-footer {
	padding: 12px 20px;
	border-top: 1px solid var(--search-border);
	text-align: center;
}

.view-all-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--search-accent);
	font-weight: 600;
	font-size: 0.9rem;
	text-decoration: none;
	transition: all 0.2s;
}

.view-all-link:hover {
	gap: 12px;
	color: #4f46e5;
}

    /* ======================================================== */
    /* ========== حالت موبایل (رفع مشکلات اصلی) ============= */
    /* ======================================================== */
.mobile-search-toggle {
	background: transparent;
	border: none;
	color: var(--search-text);
	font-size: 1.4rem;
	padding: 8px;
	cursor: pointer;
	transition: all 0.2s;
	border-radius: 50%;
}

.mobile-search-toggle:hover {
	background: var(--search-result-hover);
}

.mobile-search-modal {
	position: fixed;
	inset: 0;
	z-index: 99999;
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	display: flex;
	flex-direction: column;
}

.mobile-search-modal.active {
	opacity: 1;
	visibility: visible;
}

.mobile-search-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,0.5);
	backdrop-filter: blur(4px);
}

    /* اصلاح پنل موبایل */
.mobile-search-panel {
	position: relative;
	background: var(--search-bg);
	height: 100%;
	max-height: 90vh;
	margin-top: auto;
	border-radius: 28px 28px 0 0;
	padding: 20px 20px 30px;
	display: flex;
	flex-direction: column;
	transform: translateY(100%);
	transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
	box-shadow: 0 -10px 40px rgba(0,0,0,0.15);
	min-height: 50vh;
 /* ارتفاع حداقل برای نمایش محتوا */;
}

.mobile-search-modal.active .mobile-search-panel {
	transform: translateY(0);
}

.mobile-panel-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 16px;
	flex-shrink: 0;
}

.panel-title {
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--search-text);
	margin: 0;
}

.panel-close-btn {
	background: transparent;
	border: none;
	font-size: 1.6rem;
	color: var(--search-section-title);
	cursor: pointer;
	padding: 4px;
	transition: all 0.2s;
}

.panel-close-btn:hover {
	color: var(--search-text);
	transform: rotate(-90deg);
}

.mobile-search-form {
	margin-bottom: 16px;
	flex-shrink: 0;
}

.mobile-input-wrapper {
	display: flex;
	align-items: center;
	background: var(--search-input-bg);
	border: 2px solid var(--search-border);
	border-radius: 16px;
	padding: 0 4px;
	transition: all 0.3s;
}

.mobile-input-wrapper:focus-within {
	border-color: var(--search-accent);
	box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.12);
}

.mobile-search-input {
	flex: 1;
	height: 52px;
	padding: 0 16px;
	background: transparent;
	border: none;
	outline: none;
	font-size: 1rem;
	color: var(--search-text);
}

.mobile-search-input::placeholder {
	color: #94a3b8;
}

.mobile-submit-btn {
	width: 44px;
	height: 44px;
	border: none;
	background: var(--search-accent);
	color: white;
	border-radius: 50%;
	font-size: 1.2rem;
	cursor: pointer;
	transition: all 0.2s;
	display: flex;
	align-items: center;
	justify-content: center;
}

.mobile-submit-btn:hover {
	background: #4f46e5;
	transform: scale(1.05);
}

    /* ---------- کانتینر نتایج موبایل (رفع مشکل اسکرول و نمایش) ---------- */
.mobile-results-container {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: 8px 4px 20px 4px;
	background: transparent;
	min-height: 120px;
 /* ارتفاع حداقل برای نمایش محتوا */
	max-height: 60vh;
  /* محدودیت ارتفاع برای اسکرول */
	position: relative;
}

    /* پس‌زمینه و استایل آیتم‌ها در موبایل */
.mobile-results-container .result-item {
	background: var(--search-input-bg);
	margin-bottom: 6px;
	border-radius: 14px;
	padding: 10px 14px;
	border: 1px solid var(--search-border);
	box-shadow: 0 2px 4px rgba(0,0,0,0.03);
}

.mobile-results-container .result-item:hover {
	background: var(--search-result-hover);
	transform: translateX(-4px);
}

.mobile-results-container .search-section {
	margin-bottom: 16px;
}

.mobile-results-container .search-section-header {
	background: var(--search-input-bg);
	padding: 8px 12px;
	border-radius: 12px;
	margin-bottom: 8px;
	border: 1px solid var(--search-border);
}

.mobile-results-container .view-all-mobile {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 14px;
	margin-top: 12px;
	background: var(--search-input-bg);
	border-radius: 16px;
	color: var(--search-accent);
	font-weight: 600;
	text-decoration: none;
	border: 1px solid var(--search-border);
	transition: all 0.2s;
}

.mobile-results-container .view-all-mobile:hover {
	background: var(--search-result-hover);
	gap: 12px;
}

.mobile-results-container .initial-state,
    .mobile-results-container .no-results,
    .mobile-results-container .search-loading {
	padding: 30px 20px;
	text-align: center;
	background: var(--search-input-bg);
	border-radius: 16px;
	margin-top: 10px;
	border: 1px solid var(--search-border);
}

.mobile-results-container .initial-state .empty-state-icon {
	font-size: 2.5rem;
	color: #94a3b8;
	opacity: 0.3;
	display: block;
	margin-bottom: 12px;
}

.mobile-results-container .initial-state .empty-state-title {
	font-size: 1.1rem;
	font-weight: 600;
	margin: 12px 0 4px;
	color: var(--search-text);
}

.mobile-results-container .initial-state .empty-state-description {
	font-size: 0.9rem;
	color: #94a3b8;
}

    /* اسکرول‌بار زیبا برای موبایل */
.mobile-results-container::-webkit-scrollbar {
	width: 4px;
}

.mobile-results-container::-webkit-scrollbar-track {
	background: transparent;
}

.mobile-results-container::-webkit-scrollbar-thumb {
	background: var(--search-border);
	border-radius: 10px;
}

[data-theme="dark"] .mobile-results-container::-webkit-scrollbar-thumb {
	background: #475569;
}

    /* ======================================================== */
    /* ========== واکنش‌گرایی ================================ */
    /* ======================================================== */
@media (max-width: 768px) {
	.header-search-wrapper {
		max-width: 100%;
	}

	.search-input-field {
		height: 46px;
		font-size: 0.9rem;
	}

	.submit-btn {
		width: 40px;
		height: 40px;
		font-size: 1rem;
	}

	.result-item .result-image {
		width: 44px;
		height: 44px;
	}

	.search-results-dropdown {
		max-height: 420px;
		top: calc(100% + 8px);
	}

	.mobile-search-panel {
		padding: 16px 16px 24px;
		max-height: 95vh;
		min-height: 40vh;
	}

	.mobile-results-container {
		max-height: 55vh;
		min-height: 100px;
	}
}

@media (max-width: 480px) {
	.search-input-field {
		height: 42px;
		font-size: 0.85rem;
		padding: 0 12px;
	}

	.control-btn {
		width: 34px;
		height: 34px;
		font-size: 1rem;
	}

	.submit-btn {
		width: 36px;
		height: 36px;
		font-size: 0.9rem;
	}

	.result-item {
		padding: 8px 10px;
		gap: 10px;
	}

	.result-item .result-image {
		width: 38px;
		height: 38px;
	}

	.result-item .result-title {
		font-size: 0.85rem;
	}

	.mobile-search-panel {
		padding: 12px 12px 20px;
	}

	.mobile-results-container {
		max-height: 50vh;
		min-height: 80px;
	}

	.mobile-results-container .result-item {
		padding: 8px 10px;
	}

	.search-section-header {
		font-size: 0.75rem;
		padding: 4px 10px;
	}
}
/* ========================================
   صفحه جستجو - رادیتون
   کلاس‌های منحصر به فرد با پیشوند raditone-search
   ======================================== */

/* انیمیشن‌ها */
@keyframes raditone-search-fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes raditone-search-spin {
	to {
		transform: rotate(-360deg);
	}
}

@keyframes raditone-search-slideIn {
	from {
		left: -100%;
	}

	to {
		left: 0;
	}
}

/* کانتینر اصلی */
.raditone-search-page {
	background: var(--bg-primary);
	min-height: 100vh;
}

/* ===== هدر جستجو ===== */
.raditone-search-header {
	background: linear-gradient(-135deg, var(--primary-light), var(--accent-light));
	padding: 40px 0 32px;
	text-align: center;
}

.raditone-search-title {
	font-size: 2rem;
	font-weight: 800;
	color: var(--text-primary);
	margin-bottom: 8px;
}

.raditone-search-subtitle {
	color: var(--text-tertiary);
	font-size: 0.9rem;
}

/* ===== باکس جستجو ===== */
.raditone-search-box-wrapper {
	max-width: 600px;
	margin: 20px auto 0;
}

.raditone-search-box {
	display: flex;
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 60px;
	overflow: hidden;
	transition: all 0.3s ease;
}

.raditone-search-box:focus-within {
	border-color: var(--primary);
	box-shadow: 0 0 0 3px var(--primary-light);
}

.raditone-search-input {
	flex: 1;
	padding: 14px 20px;
	background: transparent;
	border: none;
	color: var(--text-primary);
	font-size: 0.9rem;
}

.raditone-search-input:focus {
	outline: none;
}

.raditone-search-input::placeholder {
	color: var(--text-tertiary);
}

.raditone-search-btn {
	padding: 0 28px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border: none;
	color: white;
	cursor: pointer;
	transition: all 0.3s ease;
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 600;
}

.raditone-search-btn:hover {
	opacity: 0.9;
}

/* ===== دکمه فیلتر موبایل ===== */
.raditone-search-filter-mobile-btn {
	display: none;
	position: fixed;
	bottom: 90px;
	left: 20px;
	width: 50px;
	height: 50px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border: none;
	border-radius: 50%;
	color: white;
	cursor: pointer;
	box-shadow: var(--shadow-lg);
	z-index: 98;
	transition: all 0.3s ease;
}

.raditone-search-filter-mobile-btn i {
	font-size: 1.2rem;
}

.raditone-search-filter-mobile-btn:hover {
	transform: scale(1.08);
}

/* ===== پنل فیلتر موبایل (سایدبار) ===== */
.raditone-search-filter-overlay {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.7);
	backdrop-filter: blur(4px);
	z-index: 999;
	display: none;
}

.raditone-search-filter-overlay.open {
	display: block;
}

.raditone-search-filter-panel {
	position: fixed;
	top: 0;
	left: -100%;
	width: 85%;
	max-width: 320px;
	height: 100vh;
	background: var(--bg-secondary);
	box-shadow: var(--shadow-lg);
	z-index: 1000;
	transition: left 0.3s cubic-bezier(0.2, 0.9, 0.4, 1.1);
	display: flex;
	flex-direction: column;
}

.raditone-search-filter-panel.open {
	left: 0;
}

.raditone-search-filter-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 20px;
	border-bottom: 1px solid var(--border-primary);
	background: var(--bg-secondary);
}

.raditone-search-filter-header h3 {
	margin: 0;
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--text-primary);
}

.raditone-search-filter-header button {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--bg-tertiary);
	border: none;
	color: var(--text-secondary);
	cursor: pointer;
	transition: all 0.2s;
}

.raditone-search-filter-header button:hover {
	background: var(--danger);
	color: white;
}

.raditone-search-filter-body {
	flex: 1;
	overflow-y: auto;
	padding: 20px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.raditone-search-filter-footer {
	padding: 16px 20px;
	border-top: 1px solid var(--border-primary);
	display: flex;
	gap: 12px;
}

.raditone-search-filter-footer button {
	flex: 1;
	padding: 12px;
	border-radius: 40px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.2s;
}

.raditone-search-filter-apply {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border: none;
	color: white;
}

.raditone-search-filter-reset {
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	color: var(--text-secondary);
}

/* ===== فیلترها دسکتاپ ===== */
.raditone-search-filters {
	border-bottom: 1px solid var(--border-primary);
	background: var(--bg-secondary);
	padding: 12px 0;
	position: sticky;
	top: 70px;
	z-index: 99;
	backdrop-filter: blur(12px);
}

.raditone-search-filters-container {
	max-width: 1400px;
	margin: 0 auto;
	padding: 0 20px;
}

.raditone-search-filters-row {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
	justify-content: center;
}

.raditone-search-select {
	padding: 10px 36px 10px 16px;
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	border-radius: 40px;
	color: var(--text-primary);
	font-size: 0.85rem;
	appearance: none;
	cursor: pointer;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	transition: all 0.2s;
}

.raditone-search-select:hover {
	border-color: var(--primary);
}

.raditone-search-select:focus {
	outline: none;
	border-color: var(--primary);
}

.raditone-search-btn-filter {
	padding: 10px 24px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border: none;
	border-radius: 40px;
	color: white;
	font-size: 0.85rem;
	font-weight: 500;
	cursor: pointer;
	transition: all 0.3s ease;
}

.raditone-search-btn-filter:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-primary);
}

.raditone-search-btn-reset {
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	color: var(--text-secondary);
}

.raditone-search-btn-reset:hover {
	background: var(--danger);
	border-color: var(--danger);
	color: white;
	transform: translateY(-2px);
}

/* ===== نتایج ===== */
.raditone-search-results {
	max-width: 1400px;
	margin: 0 auto;
	padding: 32px 20px;
}

.raditone-search-results-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 28px;
	flex-wrap: wrap;
	gap: 16px;
}

.raditone-search-count {
	font-size: 0.9rem;
	color: var(--text-tertiary);
}

.raditone-search-count span {
	color: var(--primary);
	font-weight: 700;
	font-size: 1.2rem;
}

.raditone-search-view-toggle {
	display: flex;
	gap: 8px;
	background: var(--bg-tertiary);
	padding: 4px;
	border-radius: 50px;
}

.raditone-search-view-btn {
	padding: 8px 20px;
	background: transparent;
	border: none;
	border-radius: 50px;
	color: var(--text-secondary);
	cursor: pointer;
	transition: all 0.3s ease;
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 0.85rem;
	font-weight: 500;
}

.raditone-search-view-btn.active {
	background: var(--primary);
	color: white;
}

/* ===== حالت گرید ===== */
.raditone-search-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 24px;
}

@media (max-width: 1200px) {
	.raditone-search-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 992px) {
	.raditone-search-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 768px) {
	.raditone-search-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
	}
}

@media (max-width: 480px) {
	.raditone-search-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 12px;
	}
}

/* کارت نتایج */
.raditone-search-card {
	background: var(--bg-secondary);
	border-radius: 20px;
	overflow: hidden;
	transition: all 0.3s cubic-bezier(0.2, 0.9, 0.4, 1.1);
	border: 1px solid var(--border-primary);
	text-decoration: none;
	display: block;
	animation: raditone-search-fadeInUp 0.4s ease forwards;
}

.raditone-search-card:hover {
	transform: translateY(-6px);
	border-color: var(--primary);
	box-shadow: var(--shadow-lg);
}

.raditone-search-card-image {
	position: relative;
	aspect-ratio: 1;
	overflow: hidden;
}

.raditone-search-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.raditone-search-card:hover .raditone-search-card-image img {
	transform: scale(1.08);
}

.raditone-search-card-badge {
	position: absolute;
	top: 12px;
	left: 12px;
	background: rgba(0,0,0,0.7);
	backdrop-filter: blur(4px);
	padding: 4px 12px;
	border-radius: 30px;
	font-size: 0.7rem;
	color: white;
	display: flex;
	align-items: center;
	gap: 6px;
	z-index: 2;
}

.raditone-search-card-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,0.5);
	backdrop-filter: blur(4px);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.3s ease;
	z-index: 3;
}

.raditone-search-card:hover .raditone-search-card-overlay {
	opacity: 1;
}

.raditone-search-card-play {
	width: 44px;
	height: 44px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transform: scale(0.8);
	transition: all 0.3s ease;
}

.raditone-search-card:hover .raditone-search-card-play {
	transform: scale(1);
}

.raditone-search-card-play i {
	color: white;
	font-size: 1.1rem;
}

.raditone-search-card-content {
	padding: 14px;
}

.raditone-search-card-title {
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 6px;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.raditone-search-card-artist {
	font-size: 0.7rem;
	color: var(--text-tertiary);
	display: flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 8px;
}

.raditone-search-card-artist i {
	font-size: 0.6rem;
	color: var(--primary);
}

.raditone-search-card-meta {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 0.6rem;
	color: var(--text-tertiary);
	padding-top: 8px;
	border-top: 1px solid var(--border-primary);
}

/* ===== حالت لیست ===== */
.raditone-search-list {
	display: none;
	flex-direction: column;
	gap: 12px;
}

.raditone-search-list.active {
	display: flex;
}

.raditone-search-list-item {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 14px;
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 16px;
	transition: all 0.3s ease;
	text-decoration: none;
}

.raditone-search-list-item:hover {
	border-color: var(--primary);
	transform: translateX(5px);
	box-shadow: var(--shadow-md);
}

.raditone-search-list-image {
	width: 60px;
	height: 60px;
	border-radius: 12px;
	overflow: hidden;
	flex-shrink: 0;
}

.raditone-search-list-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.raditone-search-list-content {
	flex: 1;
	min-width: 0;
}

.raditone-search-list-title {
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 4px;
}

.raditone-search-list-artist {
	font-size: 0.7rem;
	color: var(--text-tertiary);
	display: flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 6px;
}

.raditone-search-list-meta {
	display: flex;
	gap: 12px;
	font-size: 0.6rem;
	color: var(--text-tertiary);
}

.raditone-search-list-play {
	width: 34px;
	height: 34px;
	background: var(--primary-light);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--primary);
	transition: all 0.3s ease;
	flex-shrink: 0;
}

.raditone-search-list-item:hover .raditone-search-list-play {
	background: var(--primary);
	color: white;
	transform: scale(1.1);
}

/* ===== لودینگ و حالت خالی ===== */
.raditone-search-loading {
	text-align: center;
	padding: 60px 20px;
}

.raditone-search-spinner {
	width: 45px;
	height: 45px;
	border: 3px solid var(--border-primary);
	border-top-color: var(--primary);
	border-radius: 50%;
	animation: raditone-search-spin 0.8s linear infinite;
	margin: 0 auto 16px;
}

.raditone-search-empty {
	text-align: center;
	padding: 60px 20px;
}

.raditone-search-empty-icon {
	width: 70px;
	height: 70px;
	margin: 0 auto 20px;
	background: var(--bg-tertiary);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.8rem;
	color: var(--text-tertiary);
}

.raditone-search-empty-title {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 8px;
}

.raditone-search-empty-text {
	color: var(--text-tertiary);
	font-size: 0.8rem;
}

/* اسکرول بی‌نهایت */
.raditone-search-scroll-trigger {
	height: 20px;
	margin-top: 30px;
}

/* ===== ریسپانسیو موبایل ===== */
@media (max-width: 768px) {
    /* مخفی کردن فیلترهای دسکتاپ */
	.raditone-search-filters {
		display: none;
	}
    
    /* نمایش دکمه فیلتر موبایل */
	.raditone-search-filter-mobile-btn {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.raditone-search-header {
		padding: 30px 0 24px;
	}

	.raditone-search-title {
		font-size: 1.5rem;
	}

	.raditone-search-box .raditone-search-btn span {
		display: none;
	}

	.raditone-search-box .raditone-search-btn {
		padding: 0 20px;
	}

	.raditone-search-results {
		padding: 20px 16px;
	}

	.raditone-search-view-btn span {
		display: none;
	}

	.raditone-search-view-btn {
		padding: 8px 14px;
	}
}

@media (max-width: 480px) {
	.raditone-search-card-content {
		padding: 10px;
	}

	.raditone-search-card-title {
		font-size: 0.75rem;
	}

	.raditone-search-card-artist {
		font-size: 0.6rem;
	}

	.raditone-search-list-item {
		gap: 12px;
		padding: 12px;
	}

	.raditone-search-list-image {
		width: 50px;
		height: 50px;
	}

	.raditone-search-list-title {
		font-size: 0.75rem;
	}

	.raditone-search-list-artist {
		font-size: 0.6rem;
	}
}

/*------------------------------- index Style -------------------------------*/

/* ========================================
   استایل‌های صفحه اصلی - فقط بهبود گرافیک
   ======================================== */

/* کانتینر اصلی - عرض 100% با padding استاندارد */
.fullscreen-container {
	width: 100%;
	max-width: 100%;
	padding: 0 20px;
	margin: 0 auto;
	box-sizing: border-box;
}

@media (min-width: 1400px) {
	.fullscreen-container {
		padding: 0 40px;
	}
}

/* بهبود بخش‌ها */
.section {
	padding: 50px 0;
	border-bottom: 1px solid var(--border-primary);
}

.section:last-child {
	border-bottom: none;
}

/* هدر بخش‌ها */
.section__header {
	margin-bottom: 30px;
}

.section__title {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--text-primary);
	display: flex;
	align-items: center;
	gap: 10px;
}

.section__title i {
	color: var(--primary);
}

.section__link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 20px;
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	border-radius: 40px;
	color: var(--text-secondary);
	font-size: 0.85rem;
	font-weight: 500;
	text-decoration: none;
	transition: all 0.3s ease;
}

.section__link:hover {
	background: var(--primary);
	border-color: var(--primary);
	color: white;
	transform: translateX(4px);
}

/* دکمه‌های Swiper */
.swiper-button-next,
.swiper-button-prev {
	width: 44px;
	height: 44px;
	background: var(--glass);
	backdrop-filter: blur(8px);
	border-radius: 50%;
	color: var(--text-primary);
	border: 1px solid var(--glass-border);
	transition: all 0.3s ease;
}

.swiper-button-next:after,
.swiper-button-prev:after {
	font-size: 18px;
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
	background: var(--primary);
	color: white;
}

.swiper-pagination-bullet {
	background: var(--text-tertiary);
	opacity: 0.5;
}

.swiper-pagination-bullet-active {
	background: var(--primary);
	opacity: 1;
}

/* کارت خالی */
.empty-state {
	text-align: center;
	padding: 50px 20px;
	background: var(--bg-tertiary);
	border-radius: 24px;
}

.empty-state-icon {
	width: 80px;
	height: 80px;
	margin: 0 auto 16px;
	background: var(--bg-secondary);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 2rem;
	color: var(--text-tertiary);
}

.empty-state p {
	color: var(--text-tertiary);
}

/* بخش سه ستون */
.three-columns-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
}

@media (max-width: 992px) {
	.three-columns-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px) {
	.three-columns-grid {
		grid-template-columns: 1fr;
	}
}

/* کارت هر ستون */
.column-card {
	background: var(--glass);
	backdrop-filter: blur(12px);
	border: 1px solid var(--glass-border);
	border-radius: 24px;
	padding: 20px;
	transition: all 0.3s ease;
}

.column-card:hover {
	border-color: var(--primary);
}

.column-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	margin-bottom: 20px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--border-primary);
}

.column-title {
	display: flex;
	align-items: center;
	gap: 10px;
}

.column-title i {
	width: 36px;
	height: 36px;
	background: var(--primary-light);
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--primary);
	font-size: 1rem;
}

.column-title h3 {
	margin: 0;
	font-size: 1rem;
	font-weight: 700;
	color: var(--text-primary);
}

.column-link {
	font-size: 0.7rem;
	color: var(--primary);
	text-decoration: none;
	display: flex;
	align-items: center;
	gap: 4px;
}

/* لیست عمودی */
.vertical-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.vertical-item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px;
	background: var(--bg-tertiary);
	border-radius: 14px;
	transition: all 0.3s ease;
}

.vertical-item:hover {
	transform: translateX(4px);
	background: var(--primary-light);
}

.vertical-number {
	width: 30px;
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--primary);
	font-family: var(--font-iranyekan);
}

.vertical-cover {
	position: relative;
	width: 48px;
	height: 48px;
	flex-shrink: 0;
}

.vertical-cover img {
	width: 100%;
	height: 100%;
	border-radius: 10px;
	object-fit: cover;
}

.vertical-play {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border-radius: 10px;
	background: rgba(0,0,0,0.6);
	border: none;
	color: white;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	opacity: 0;
	transition: opacity 0.3s;
}

.vertical-cover:hover .vertical-play {
	opacity: 1;
}

.live-badge {
	position: absolute;
	top: 4px;
	right: 4px;
	background: var(--danger);
	color: white;
	font-size: 0.55rem;
	padding: 2px 6px;
	border-radius: 6px;
}

.vertical-info {
	flex: 1;
}

.vertical-info h4 {
	margin: 0 0 4px;
	font-size: 0.85rem;
	font-weight: 600;
}

.vertical-info h4 a {
	color: var(--text-primary);
	text-decoration: none;
}

.vertical-info h4 a:hover {
	color: var(--primary);
}

.vertical-info span {
	font-size: 0.7rem;
	color: var(--text-tertiary);
}

.vertical-duration {
	font-size: 0.7rem;
	color: var(--text-tertiary);
	font-family: var(--font-iranyekan);
}

.column-empty {
	text-align: center;
	padding: 30px;
	color: var(--text-tertiary);
}

/* خبرنامه */
.newsletter-section {
	position: relative;
	padding: 80px 0;
	overflow: hidden;
}

.newsletter-bg {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.newsletter-bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.newsletter-bg-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(-135deg, rgba(0,0,0,0.7), rgba(0,0,0,0.5));
}

.newsletter-content {
	position: relative;
	z-index: 1;
	max-width: 600px;
	margin: 0 auto;
	text-align: center;
}

.newsletter-icon {
	width: 80px;
	height: 80px;
	margin: 0 auto 20px;
	background: var(--glass);
	backdrop-filter: blur(12px);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 2rem;
	color: white;
	border: 1px solid var(--glass-border);
}

.newsletter-content h2 {
	font-size: 2rem;
	font-weight: 700;
	color: white;
	margin-bottom: 16px;
}

.newsletter-content p {
	color: rgba(255,255,255,0.8);
	margin-bottom: 30px;
}

.newsletter-form {
	display: flex;
	flex-direction: column;
	gap: 16px;
	max-width: 450px;
	margin: 0 auto;
}

.newsletter-input-wrapper {
	position: relative;
}

.newsletter-input-wrapper i {
	position: absolute;
	left: 16px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--text-tertiary);
}

.newsletter-input-wrapper input {
	width: 100%;
	padding: 14px 16px 14px 48px;
	background: rgba(255,255,255,0.15);
	backdrop-filter: blur(8px);
	border: 1px solid rgba(255,255,255,0.2);
	border-radius: 60px;
	color: white;
	font-size: 0.9rem;
}

.newsletter-input-wrapper input::placeholder {
	color: rgba(255,255,255,0.6);
}

.newsletter-input-wrapper input:focus {
	outline: none;
	border-color: var(--primary);
}

.newsletter-form button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 14px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border: none;
	border-radius: 60px;
	color: white;
	font-size: 0.9rem;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.3s;
}

.newsletter-form button:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-primary);
}

.newsletter-note {
	font-size: 0.7rem;
	color: rgba(255,255,255,0.6);
	margin-top: 20px;
}

.newsletter-note a {
	color: var(--primary);
	text-decoration: none;
}

/* بخش SEO */
.seo-section {
	padding: 60px 0;
	text-align: center;
	background: var(--bg-tertiary);
}

.seo-container {
	max-width: 800px;
	margin: 0 auto;
}

.seo-section h2 {
	font-size: 2rem;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 24px;
}

.seo-content {
	color: var(--text-secondary);
	line-height: 1.8;
	font-size: 1rem;
}

.seo-link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-top: 30px;
	padding: 12px 28px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 60px;
	color: white;
	text-decoration: none;
	font-weight: 600;
	transition: all 0.3s;
}

.seo-link:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-primary);
}

/* ریسپانسیو */
@media (max-width: 768px) {
	.section {
		padding: 40px 0;
	}

	.section__title {
		font-size: 1.2rem;
	}

	.newsletter-content h2,
    .seo-section h2 {
		font-size: 1.5rem;
	}

	.swiper-button-next,
    .swiper-button-prev {
		display: none;
	}
}

@media (max-width: 480px) {
	.fullscreen-container {
		padding: 0 16px;
	}

	.section__header {
		flex-direction: column;
		align-items: flex-start;
	}
}

/*------------------------------- Payment Callback Style -------------------------------*/

.payment-callback-container {
	max-width: 600px;
	margin: 50px auto;
	padding: 30px;
	background: #fff;
	border-radius: 20px;
	box-shadow: 0 10px 40px rgba(0,0,0,0.1);
	text-align: center;
	direction: ltr;
}

.payment-callback-container h2 {
	margin-bottom: 20px;
	font-size: 24px;
}

.payment-success {
	background: #d4edda;
	color: #155724;
	padding: 20px;
	border-radius: 12px;
	margin: 20px 0;
	border-left: 4px solid #28a745;
	text-align: left;
}

.payment-error {
	background: #f8d7da;
	color: #721c24;
	padding: 20px;
	border-radius: 12px;
	margin: 20px 0;
	border-left: 4px solid #dc3545;
	text-align: left;
}

.payment-pending {
	background: #fff3cd;
	color: #856404;
	padding: 20px;
	border-radius: 12px;
	margin: 20px 0;
	border-left: 4px solid #ffc107;
	text-align: left;
}

.payment-info {
	background: #e7f3ff;
	color: #004085;
	padding: 15px;
	border-radius: 12px;
	margin: 15px 0;
	text-align: left;
}

.ref-id {
	font-family: var(--font-iranyekan);
	font-size: 16px;
	background: #f1f1f1;
	padding: 5px 10px;
	border-radius: 6px;
	display: inline-block;
}

.action-buttons {
	display: flex;
	gap: 15px;
	justify-content: center;
	margin-top: 30px;
	flex-wrap: wrap;
}

.action-buttons a {
	display: inline-block;
	padding: 12px 25px;
	background: #4CAF50;
	color: white;
	text-decoration: none;
	border-radius: 10px;
	transition: all 0.3s;
}

.action-buttons a:hover {
	background: #45a049;
	transform: translateY(-2px);
}

.action-buttons a.back {
	background: #6c757d;
}

.action-buttons a.back:hover {
	background: #5a6268;
}

.loader {
	display: inline-block;
	width: 40px;
	height: 40px;
	border: 4px solid #f3f3f3;
	border-top: 4px solid #4CAF50;
	border-radius: 50%;
	animation: spin 1s linear infinite;
	margin: 20px auto;
}

@keyframes spin {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(-360deg);
	}
}

@media (max-width: 768px) {
	.payment-callback-container {
		margin: 20px;
		padding: 20px;
	}

	.action-buttons a {
		padding: 10px 20px;
		font-size: 14px;
	}
}

/*------------------------------- Request Music Style -------------------------------*/

/* ========================================
   raditone-request - کلاس‌های منحصر به فرد
   ======================================== */
.raditone-request-root {
	--primary: #3b5bdb;
	--primary-light: rgba(59, 91, 219, 0.1);
	--accent: #8b5cf6;
	--success: #10b981;
	--danger: #ef4444;
	--warning: #f59e0b;
}

/* افکت سایه نئونی ضعیف */
.raditone-request-neon-text {
	text-shadow: 0 0 2px rgba(59, 91, 219, 0.3), 0 0 4px rgba(59, 91, 219, 0.2);
}

.raditone-request-neon-warning {
	text-shadow: 0 0 2px rgba(245, 158, 11, 0.4), 0 0 4px rgba(245, 158, 11, 0.2);
}

.raditone-request-neon-success {
	text-shadow: 0 0 2px rgba(16, 185, 129, 0.4), 0 0 4px rgba(16, 185, 129, 0.2);
}

/* هدر */
.raditone-request-header {
	position: relative;
	background: linear-gradient(-135deg, #1a1a2e 0%, #16213e 100%);
	padding: 60px 20px 100px;
	text-align: center;
	overflow: hidden;
}

.raditone-request-header::before {
	content: '';
	position: absolute;
	top: -50%;
	right: -50%;
	width: 200%;
	height: 200%;
	background: radial-gradient(circle, rgba(59,91,219,0.15) 0%, transparent 70%);
	animation: raditone-request-rotate 25s linear infinite;
}

@keyframes raditone-request-rotate {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(-360deg);
	}
}

.raditone-request-header-icon {
	width: 85px;
	height: 85px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 20px;
	box-shadow: 0 0 30px rgba(59,91,219,0.5);
	animation: raditone-request-float 3s ease-in-out infinite;
	position: relative;
	z-index: 2;
}

@keyframes raditone-request-float {
	0%, 100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(-8px);
	}
}

.raditone-request-header-icon i {
	font-size: 38px;
	color: white;
}

.raditone-request-header h1 {
	font-size: 2.5rem;
	font-weight: 800;
	background: linear-gradient(-135deg, #fff, var(--primary), var(--accent));
	-webkit-background-clip: text;
	margin-bottom: 12px;
	position: relative;
	z-index: 2;
}

.raditone-request-header-subtitle {
	color: rgba(255,255,255,0.8);
	font-size: 1rem;
	position: relative;
	z-index: 2;
}

/* کارت‌های انتخابگر */
.raditone-request-choice-cards {
	position: relative;
	z-index: 10;
	margin-top: -50px;
	padding: 0 20px;
}

.raditone-request-choice-container {
	display: flex;
	justify-content: center;
	gap: 30px;
	max-width: 900px;
	margin: 0 auto;
}

.raditone-request-choice-card {
	flex: 1;
	background: var(--bg-secondary);
	backdrop-filter: blur(10px);
	border-radius: 24px;
	padding: 35px 25px;
	text-align: center;
	text-decoration: none;
	transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	border: 1px solid rgba(59,91,219,0.25);
	box-shadow: var(--shadow-md);
}

.raditone-request-choice-card:hover {
	transform: translateY(-8px);
	box-shadow: var(--shadow-xl);
	border-color: var(--primary);
}

.raditone-request-choice-icon {
	width: 70px;
	height: 70px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 20px;
	transition: all 0.3s;
}

.raditone-request-choice-card:hover .raditone-request-choice-icon {
	transform: rotateY(-180deg);
}

.raditone-request-choice-icon i {
	font-size: 30px;
	color: white;
}

.raditone-request-choice-card h3 {
	font-size: 1.4rem;
	font-weight: 700;
	margin-bottom: 10px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	-webkit-background-clip: text;
}

.raditone-request-choice-card p {
	color: var(--text-secondary);
	font-size: 0.85rem;
	margin-bottom: 15px;
	line-height: 1.5;
}

.raditone-request-choice-arrow {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--primary);
	font-size: 0.8rem;
	font-weight: 600;
	transition: all 0.3s;
}

.raditone-request-choice-card:hover .raditone-request-choice-arrow {
	gap: 12px;
}

/* بخش هدر */
.raditone-request-section-header {
	text-align: center;
	margin: 50px 0 35px;
}

.raditone-request-section-header h2 {
	font-size: 2rem;
	font-weight: 700;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	-webkit-background-clip: text;
	display: inline-block;
	position: relative;
}

.raditone-request-section-header h2::after {
	content: '';
	display: block;
	width: 60px;
	height: 3px;
	background: linear-gradient(-90deg, var(--primary), var(--accent));
	margin: 12px auto 0;
	border-radius: 3px;
}

.raditone-request-section-header p {
	color: var(--text-muted);
	margin-top: 15px;
	font-size: 0.9rem;
}

/* کارت‌های تقدیم */
.raditone-request-cards-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 30px;
	padding: 0 20px;
}

.raditone-request-card {
	background: var(--bg-secondary);
	border-radius: 20px;
	overflow: hidden;
	border: 1px solid var(--border-primary);
	transition: all 0.3s;
}

.raditone-request-card:hover {
	transform: translateY(-5px);
	box-shadow: var(--shadow-lg);
	border-color: var(--primary);
}

.raditone-request-card img {
	width: 100%;
	height: 200px;
	object-fit: cover;
}

.raditone-request-card-info {
	padding: 20px;
}

.raditone-request-card-info h3 {
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 5px;
}

.raditone-request-card-info .raditone-request-artist {
	color: var(--primary);
	font-size: 0.85rem;
	margin-bottom: 12px;
}

.raditone-request-play-btn {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border: none;
	padding: 8px 20px;
	border-radius: 30px;
	color: white;
	cursor: pointer;
	font-size: 0.8rem;
	font-weight: 600;
	transition: all 0.3s;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.raditone-request-play-btn:hover {
	transform: scale(1.02);
	opacity: 0.9;
}

/* کارت‌های درخواست */
.raditone-request-requests-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: 25px;
	padding: 0 20px;
}

.raditone-request-request-card {
	background: var(--bg-secondary);
	border-radius: 18px;
	padding: 20px;
	border: 1px solid var(--border-primary);
	transition: all 0.3s;
}

.raditone-request-request-card:hover {
	transform: translateY(-4px);
	border-color: var(--primary);
	box-shadow: var(--shadow-md);
}

.raditone-request-request-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 15px;
}

.raditone-request-request-icon {
	width: 45px;
	height: 45px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.raditone-request-request-icon i {
	font-size: 22px;
	color: white;
}

.raditone-request-request-badge {
	background: var(--success);
	color: white;
	padding: 4px 12px;
	border-radius: 20px;
	font-size: 0.7rem;
	font-weight: 600;
}

.raditone-request-request-card h3 {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 5px;
}

.raditone-request-request-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	color: white;
	padding: 8px 18px;
	border-radius: 30px;
	text-decoration: none;
	font-size: 0.8rem;
	font-weight: 600;
	margin-top: 12px;
	transition: all 0.3s;
}

.raditone-request-request-link:hover {
	gap: 12px;
	opacity: 0.9;
}

/* مودال */
.raditone-request-modal {
	display: none;
	position: fixed;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	z-index: 99999;
}

.raditone-request-modal.show {
	display: block;
}

.raditone-request-modal-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.75);
	backdrop-filter: blur(8px);
}

.raditone-request-modal-container {
	position: absolute;
	top: 50%;
	right: 50%;
	transform: translate(50%, -50%);
	width: 90%;
	max-width: 560px;
	max-height: 85vh;
	overflow-y: auto;
	background: var(--bg-primary);
	border-radius: 28px;
	box-shadow: 0 25px 50px rgba(0,0,0,0.3);
	border: 1px solid var(--border-primary);
}

.raditone-request-modal-header {
	padding: 24px 28px;
	text-align: center;
	border-bottom: 1px solid var(--border-primary);
	position: relative;
}

.raditone-request-modal-icon {
	width: 60px;
	height: 60px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 15px;
}

.raditone-request-modal-icon i {
	font-size: 28px;
	color: white;
}

.raditone-request-modal-header h3 {
	font-size: 1.4rem;
	font-weight: 700;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	-webkit-background-clip: text;
}

.raditone-request-modal-close {
	position: absolute;
	top: 18px;
	right: 18px;
	width: 34px;
	height: 34px;
	background: var(--bg-tertiary);
	border: none;
	border-radius: 10px;
	color: var(--text-secondary);
	cursor: pointer;
	transition: all 0.2s;
}

.raditone-request-modal-close:hover {
	background: var(--danger);
	color: white;
	transform: rotate(-90deg);
}

.raditone-request-modal-body {
	padding: 28px;
}

/* فرم */
.raditone-request-form-grid {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.raditone-request-form-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
}

.raditone-request-form-group {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.raditone-request-form-group label {
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--text-secondary);
	display: flex;
	align-items: center;
	gap: 6px;
}

.raditone-request-form-group label i {
	color: var(--primary);
	font-size: 0.85rem;
	width: 18px;
}

.raditone-request-form-group input,
.raditone-request-form-group select,
.raditone-request-form-group textarea {
	width: 100%;
	padding: 12px 14px;
	background: var(--bg-secondary);
	border: 1.5px solid var(--border-primary);
	border-radius: 14px;
	font-size: 0.9rem;
	color: var(--text-primary);
	transition: all 0.2s;
	font-family: inherit;
}

.raditone-request-form-group input:focus,
.raditone-request-form-group select:focus,
.raditone-request-form-group textarea:focus {
	border-color: var(--primary);
	outline: none;
	box-shadow: 0 0 0 3px var(--primary-light);
}

.raditone-request-form-divider {
	position: relative;
	text-align: center;
	margin: 10px 0 5px;
}

.raditone-request-form-divider::before {
	content: '';
	position: absolute;
	top: 50%;
	right: 0;
	left: 0;
	height: 1px;
	background: var(--border-primary);
}

.raditone-request-form-divider span {
	position: relative;
	background: var(--bg-primary);
	padding: 0 15px;
	color: var(--primary);
	font-size: 0.75rem;
	font-weight: 600;
}


/* استایل دکمه پخش هماهنگ با پلیر */
.raditone-request-play-btn {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border: none;
	padding: 8px 18px;
	border-radius: 30px;
	color: white;
	cursor: pointer;
	font-size: 0.8rem;
	font-weight: 500;
	transition: all 0.3s ease;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 8px;
}

.raditone-request-play-btn:hover {
	transform: scale(1.02);
	box-shadow: 0 4px 12px rgba(59, 91, 219, 0.3);
}

.raditone-request-play-btn i {
	font-size: 0.75rem;
}

/* دکمه ارسال */
.raditone-request-submit-btn {
	width: 100%;
	padding: 14px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border: none;
	border-radius: 40px;
	color: white;
	font-size: 1rem;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.3s;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: 10px;
}

.raditone-request-submit-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(59,91,219,0.3);
}

.raditone-request-submit-btn.loading {
	opacity: 0.7;
	cursor: not-allowed;
}

/* نتایج جستجو */
.raditone-request-search-results {
	margin: 15px 0 5px;
	border-radius: 16px;
	overflow: hidden;
	border: 1px solid var(--border-primary);
	background: var(--bg-secondary);
}

.raditone-request-search-results.hidden {
	display: none;
}

.raditone-request-search-header {
	padding: 12px 16px;
	background: var(--primary-light);
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--primary);
	border-bottom: 1px solid var(--border-primary);
}

.raditone-request-search-list {
	max-height: 320px;
	overflow-y: auto;
}

.raditone-request-search-item {
	padding: 14px 16px;
	border-bottom: 1px solid var(--border-primary);
	transition: all 0.2s;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
}

.raditone-request-search-item:last-child {
	border-bottom: none;
}

.raditone-request-search-item:hover {
	background: var(--primary-light);
}

.raditone-request-search-item-info {
	flex: 1;
}

.raditone-request-search-title {
	font-weight: 700;
	color: var(--text-primary);
	font-size: 0.9rem;
	margin-bottom: 4px;
}

.raditone-request-search-artist {
	font-size: 0.75rem;
	color: var(--text-muted);
}

.raditone-request-search-similarity {
	display: inline-block;
	padding: 3px 10px;
	background: var(--primary-light);
	color: var(--primary);
	border-radius: 20px;
	font-size: 0.7rem;
	font-weight: 600;
	margin-left: 10px;
}

.raditone-request-search-actions {
	display: flex;
	gap: 8px;
	flex-shrink: 0;
}

.raditone-request-search-select {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	color: white;
	padding: 6px 16px;
	border-radius: 25px;
	font-size: 0.7rem;
	font-weight: 600;
	cursor: pointer;
	border: none;
	transition: all 0.2s;
}

.raditone-request-search-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 16px;
	background: var(--bg-tertiary);
	color: var(--text-primary);
	border: 1px solid var(--border-primary);
	border-radius: 25px;
	text-decoration: none;
	font-size: 0.7rem;
	font-weight: 600;
	transition: all 0.2s;
}

.raditone-request-search-link:hover {
	background: var(--primary);
	color: white;
	border-color: var(--primary);
}

/* دکمه خیر */
.raditone-request-close-search-btn {
	margin-top: 5px;
}

.raditone-request-close-search {
	width: 100%;
	padding: 12px;
	border-radius: 14px;
	border: 1.5px solid var(--primary);
	background: transparent;
	color: var(--primary);
	font-size: 0.85rem;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.3s;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

.raditone-request-close-search:hover {
	background: var(--primary);
	color: white;
	transform: translateY(-2px);
	box-shadow: 0 0 10px rgba(59, 91, 219, 0.4);
}

/* صفحه‌بندی */
.raditone-request-pagination {
	display: flex;
	justify-content: center;
	margin: 40px 0;
	gap: 8px;
	flex-wrap: wrap;
}

.raditone-request-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 12px;
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 10px;
	color: var(--text-primary);
	text-decoration: none;
	transition: all 0.2s;
}

.raditone-request-pagination .page-numbers.current {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-color: transparent;
	color: white;
}

.raditone-request-pagination .page-numbers:hover:not(.current) {
	border-color: var(--primary);
	transform: translateY(-2px);
}

/* حالت خالی */
.raditone-request-empty-state {
	text-align: center;
	padding: 50px 20px;
	background: var(--bg-secondary);
	border-radius: 24px;
	border: 1px dashed var(--border-primary);
}

.raditone-request-empty-state i {
	font-size: 48px;
	color: var(--primary);
	margin-bottom: 15px;
	display: block;
	opacity: 0.6;
}

/* ریسپانسیو */
@media (max-width: 768px) {
	.raditone-request-choice-container {
		flex-direction: column;
		gap: 20px;
	}

	.raditone-request-form-row {
		grid-template-columns: 1fr;
		gap: 15px;
	}


	.raditone-request-cards-grid {
		grid-template-columns: 1fr;
	}

	.raditone-request-requests-grid {
		grid-template-columns: 1fr;
	}

	.raditone-request-modal-container {
		width: 95%;
	}

	.raditone-request-modal-body {
		padding: 20px;
	}

	.raditone-request-header h1 {
		font-size: 1.8rem;
	}

	.raditone-request-section-header h2 {
		font-size: 1.5rem;
	}

	.raditone-request-search-actions {
		flex-direction: column;
		align-items: stretch;
	}

	.raditone-request-search-item {
		flex-direction: column;
		align-items: stretch;
	}
}

/*------------------------------- Single Style -------------------------------*/
/* ============================================================
   استایل‌های صفحه تکی (single) - نسخه یکپارچه
   کاملاً ریسپانسیو و با جزئیات کامل
   ============================================================ */

/* ---------- کانتینر اصلی ---------- */
.rt-single-page {
	max-width: 1400px;
	margin: 0 auto;
	padding: 24px 32px 48px;
	display: flex;
	flex-direction: column;
	gap: 32px;
	color: var(--rt-text-tertiary);
	direction: ltr;
	font-family: var(--font-iranyekan);
	background: transparent;
}

.rt-single-page * {
	box-sizing: border-box;
}

/* ---------- مسیریابی ---------- */
.rt-single-page__breadcrumb {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px 10px;
	font-size: 0.9rem;
	color: var(--rt-text-tertiary);
	padding: 8px 0 4px;
	border-bottom: 1px solid var(--rt-glass-border);
}

.rt-breadcrumb-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--rt-text-tertiary);
	text-decoration: none;
	transition: color var(--rt-transition);
}

.rt-breadcrumb-link:hover {
	color: var(--rt-primary);
}

.rt-breadcrumb-sep {
	font-size: 0.7rem;
	color: var(--rt-text-tertiary);
}

.rt-breadcrumb-current {
	color: var(--rt-text-tertiary);
	font-weight: 600;
}

/* ---------- هیرو ---------- */
.rt-single-page__hero {
	position: relative;
	background: var(--rt-glass);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border: 1px solid var(--rt-glass-border);
	border-radius: var(--rt-radius);
	padding: 32px 36px;
	overflow: hidden;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

.rt-hero-glow {
	position: absolute;
	inset: 0;
	background: radial-gradient(circle at 30% 0%, rgba(59, 91, 219, 0.2), transparent 70%);
	pointer-events: none;
}

.rt-hero-container {
	display: flex;
	gap: 36px;
	align-items: flex-start;
	position: relative;
	z-index: 1;
}

.info-stats span {
	display: flex;
	align-items: center;
	gap: 10px;
}

/* ---------- کاور ---------- */
.rt-hero-cover {
	flex: 0 0 240px;
	position: relative;
}

.rt-cover-frame {
	position: relative;
	border-radius: var(--rt-radius);
	overflow: hidden;
	box-shadow: var(--rt-shadow);
	aspect-ratio: 1;
	background: #1a1f2e;
}

.rt-cover-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.rt-cover-frame:hover .rt-cover-image {
	transform: scale(1.05);
}

.rt-cover-overlay {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, 0.4);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	opacity: 0;
	transition: opacity var(--rt-transition);
}

.rt-cover-frame:hover .rt-cover-overlay {
	opacity: 1;
}

.rt-overlay-play {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.7);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: 2px solid rgba(255, 255, 255, 0.3);
	color: #fff;
	font-size: 1.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all var(--rt-transition);
}

.rt-overlay-play:hover {
	background: var(--rt-primary);
	border-color: var(--rt-primary);
	transform: scale(1.08);
}

.rt-overlay-play:active {
	transform: scale(0.92);
}

/* دکمه‌های کنار کاور */
.rt-cover-actions {
	display: flex;
	justify-content: center;
	gap: 18px;
	margin-top: 16px;
}

.rt-cover-actions .rt-fav-wrapper {
	font-size: 28px;
	line-height: 1;
}

.rt-cover-actions .rt-playlist-trigger {
	font-size: 28px;
	line-height: 1;
}

.rt-cover-actions .rt-fav-wrapper .rt-fav-btn {
	background: transparent !important;
}

/* ---------- اطلاعات ---------- */
.rt-hero-info {
	flex: 1;
	min-width: 0;
}

.rt-info-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 18px;
	border-radius: 50px;
	background: var(--rt-primary-light);
	border: 1px solid var(--rt-primary);
	color: var(--rt-primary);
	font-size: 0.85rem;
	font-weight: 500;
	margin-bottom: 14px;
}

.rt-info-title {
	font-size: 2.6rem;
	font-weight: 900;
	margin: 0 0 4px 0;
	background: linear-gradient(-135deg, #ffffff 50%, var(--rt-primary));
	-webkit-background-clip: text;
	background-clip: text;
	line-height: 1.2;
}

.rt-coming-soon-badge {
	font-size: 0.8rem;
	background: var(--rt-danger);
	color: #fff;
	padding: 2px 14px;
	border-radius: 50px;
	-webkit-text-fill-color: #fff;
	vertical-align: middle;
	margin-left: 8px;
	display: inline-block;
}

.rt-music-english-name {
	font-size: 1rem;
	color: var(--rt-text-secondary);
	margin-bottom: 8px;
	font-weight: 400;
}

.rt-info-artist {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 1.05rem;
	color: var(--rt-text-secondary);
	flex-wrap: wrap;
	margin-bottom: 16px;
}

.rt-artist-link {
	color: var(--rt-accent);
	text-decoration: none;
	transition: color var(--rt-transition);
	position: relative;
}

.rt-artist-link::after {
	content: '';
	position: absolute;
	bottom: -2px;
	right: 0;
	width: 0;
	height: 2px;
	background: var(--rt-accent);
	transition: width var(--rt-transition);
}

.rt-artist-link:hover::after {
	width: 100%;
}

.rt-artist-link:hover {
	color: var(--rt-primary);
}

.rt-sep {
	color: var(--rt-text-tertiary);
	font-weight: 300;
}

.rt-info-stats {
	display: flex;
	flex-wrap: wrap;
	gap: 16px 28px;
	font-size: 0.9rem;
	color: var(--rt-text-secondary);
	margin-bottom: 18px;
}

.rt-info-stats span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--rt-glass);
	padding: 4px 14px;
	border-radius: 50px;
	border: 1px solid var(--rt-glass-border);
}

.rt-info-stats i {
	color: var(--rt-primary);
}

.rt-info-vote {
	margin-bottom: 18px;
}

.rt-info-vote .rt-vote-container {
	background: var(--rt-glass);
	border-radius: 50px;
	padding: 6px 16px;
	display: inline-flex;
	align-items: center;
	gap: 12px;
}

/* ===== دکمه‌های لایک/دیسلایک ===== */
.rt-vote-container {
	display: inline-flex;
	gap: 8px;
	align-items: center;
}

.rt-vote-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 14px;
	border-radius: 999px;
	background: var(--melo-surface-soft, rgba(255,255,255,0.05));
	border: 1px solid var(--melo-line-soft, rgba(255,255,255,0.1));
	color: var(--melo-text-dim, #a9afb8);
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
	transition: all 0.25s ease;
	font-family: inherit;
	position: relative;
}

.rt-vote-btn:hover {
	border-color: rgba(var(--melo-gold-1-rgb, 16,185,129), 0.4);
	color: var(--melo-text, #fff7ed);
}

.rt-vote-btn svg {
	width: 20px;
	height: 20px;
	flex-shrink: 0;
	transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.rt-vote-btn.active {
	background: rgba(var(--melo-like-rgb, 34,197,94), 0.15);
	border-color: rgba(var(--melo-like-rgb, 34,197,94), 0.5);
	color: var(--melo-like, #22c55e);
}

.rt-vote-btn.active svg {
	fill: currentColor;
	transform: scale(1.08);
}

.rt-vote-btn.dislike.active {
	background: rgba(var(--melo-dislike-rgb, 239,68,68), 0.15);
	border-color: rgba(var(--melo-dislike-rgb, 239,68,68), 0.5);
	color: var(--melo-dislike, #ef4444);
}

.rt-vote-btn .rt-count {
	min-width: 12px;
	text-align: center;
	font-variant-numeric: tabular-nums;
}

/* ---------- دکمه‌های اکشن ---------- */
.rt-info-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
}

.rt-action-primary,
.rt-action-secondary {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 26px;
	border-radius: 60px;
	border: none;
	font-size: 0.95rem;
	font-weight: 600;
	cursor: pointer;
	transition: all var(--rt-transition);
	text-decoration: none;
	background: transparent;
	font-family: inherit;
	line-height: 1.4;
}

.rt-action-primary {
	background: var(--rt-primary);
	color: #fff;
	box-shadow: 0 4px 16px rgba(59, 91, 219, 0.3);
}

.rt-action-primary:hover {
	background: var(--rt-primary-hover);
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(59, 91, 219, 0.4);
}

.rt-action-primary:active {
	transform: scale(0.96);
}

.rt-action-video {
	background: #e74c3c;
	box-shadow: 0 4px 16px rgba(231, 76, 60, 0.3);
}

.rt-action-video:hover {
	background: #c0392b;
	box-shadow: 0 8px 24px rgba(231, 76, 60, 0.4);
}

.rt-video-quality-badge {
	background: rgba(0, 0, 0, 0.3);
	padding: 2px 12px;
	border-radius: 50px;
	font-size: 0.7rem;
	font-weight: 500;
	margin-left: 4px;
}

.rt-action-secondary {
	background: var(--rt-glass);
	border: 1px solid var(--rt-glass-border);
	color: var(--rt-text-secondary);
}

.rt-action-secondary:hover {
	background: var(--rt-primary-light);
	border-color: var(--rt-primary);
	color: var(--rt-primary);
	transform: translateY(-2px);
}

.rt-action-secondary:active {
	transform: scale(0.96);
}

.rt-action-secondary i {
	font-size: 1.1rem;
}

/* دکمه گزارش - استایل اختصاصی */
.rt-report-wrapper {
	display: inline-flex;
	align-items: center;
}

.rt-report-wrapper .report-button-minimal {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 18px;
	border-radius: 60px;
	border: 1px solid var(--rt-glass-border);
	background: var(--rt-glass);
	color: var(--rt-text-secondary);
	font-size: 0.9rem;
	font-weight: 500;
	cursor: pointer;
	transition: all var(--rt-transition);
	font-family: inherit;
}

.rt-report-wrapper .report-button-minimal:hover {
	background: rgba(255, 71, 87, 0.15);
	border-color: var(--rt-danger);
	color: var(--rt-danger);
	transform: translateY(-2px);
}

.rt-report-wrapper .report-button-minimal i {
	font-size: 1rem;
}

/* ---------- تب‌ها ---------- */
.rt-single-page__tabs-wrapper {
	background: var(--rt-glass);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border: 1px solid var(--rt-glass-border);
	border-radius: var(--rt-radius);
	padding: 6px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}

.rt-tabs-container {
	display: flex;
	gap: 4px;
	overflow-x: auto;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.rt-tabs-container::-webkit-scrollbar {
	display: none;
}

.rt-tab-btn {
	flex: 1;
	min-width: 85px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	padding: 12px 8px;
	background: transparent;
	border: none;
	border-radius: 12px;
	color: var(--rt-text-tertiary);
	font-size: 0.8rem;
	font-weight: 500;
	cursor: pointer;
	transition: all var(--rt-transition);
	white-space: nowrap;
	font-family: inherit;
}

.rt-tab-btn i {
	font-size: 1.2rem;
	transition: transform var(--rt-transition);
}

.rt-tab-btn.active {
	background: var(--rt-primary);
	color: #fff;
	box-shadow: 0 4px 16px rgba(59, 91, 219, 0.35);
}

.rt-tab-btn.active i {
	transform: scale(1.1);
}

.rt-tab-btn:active {
	transform: scale(0.95);
}

/* ---------- محتوای تب‌ها ---------- */
.rt-single-page__contents {
	background: var(--rt-glass);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border: 1px solid var(--rt-glass-border);
	border-radius: var(--rt-radius);
	overflow: hidden;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}

.rt-content-panel {
	display: none;
	animation: rtFadeIn 0.35s ease;
}

.rt-content-panel.active {
	display: block;
}

@keyframes rtFadeIn {
	from {
		opacity: 0;
		transform: translateY(10px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.rt-panel-inner {
	padding: 28px 32px;
}

.rt-empty-panel {
	text-align: center;
	padding: 48px 20px;
	color: var(--rt-text-tertiary);
}

.rt-empty-panel i {
	font-size: 3rem;
	display: block;
	margin-bottom: 16px;
	opacity: 0.5;
}

.rt-empty-panel p {
	font-size: 1rem;
}

/* ---------- لیست ترک‌های آلبوم ---------- */
.rt-album-tracks-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.rt-album-track-item {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 12px 16px;
	background: var(--rt-glass);
	border-radius: 12px;
	border: 1px solid var(--rt-glass-border);
	transition: all var(--rt-transition);
}

.rt-album-track-item:hover {
	border-color: var(--rt-primary);
	background: rgba(59, 91, 219, 0.05);
}

.rt-track-cover {
	flex: 0 0 52px;
	position: relative;
	border-radius: 8px;
	overflow: hidden;
	aspect-ratio: 1;
	background: #1a1f2e;
}

.rt-track-cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.rt-track-play {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.5);
	border: none;
	color: #fff;
	font-size: 1.1rem;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity var(--rt-transition);
	cursor: pointer;
}

.rt-track-cover:hover .rt-track-play {
	opacity: 1;
}

.rt-track-play:hover {
	background: rgba(59, 91, 219, 0.7);
}

.rt-track-info {
	flex: 1;
	min-width: 0;
}

.rt-track-info h4 {
	margin: 0 0 2px 0;
	font-size: 1rem;
	font-weight: 600;
	color: var(--rt-text-tertiary);
}

.rt-track-info p {
	margin: 0;
	font-size: 0.8rem;
	color: var(--rt-text-tertiary);
}

.rt-track-duration {
	font-size: 0.85rem;
	color: var(--rt-text-tertiary);
	padding: 0 8px;
}

.rt-track-actions {
	display: flex;
	gap: 10px;
}

.rt-track-actions button {
	background: transparent;
	border: none;
	color: var(--rt-text-tertiary);
	font-size: 1.2rem;
	cursor: pointer;
	transition: color var(--rt-transition);
	padding: 4px;
}

.rt-track-actions button:hover {
	color: var(--rt-danger);
}

.rt-track-actions button:active {
	transform: scale(0.9);
}

/* ---------- بخش نظرات ---------- */
.rt-comments-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 20px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--rt-glass-border);
}

.rt-comments-header h3 {
	margin: 0;
	font-size: 1.2rem;
	font-weight: 700;
	display: flex;
	align-items: center;
	gap: 10px;
}

.rt-comments-header p {
	margin: 0;
	font-size: 0.9rem;
	color: var(--rt-text-tertiary);
}

/* ---------- بخش‌های مرتبط ---------- */
.rt-single-page__section {
	margin-top: 8px;
}

.rt-section-header {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-bottom: 20px;
	flex-wrap: wrap;
}

.rt-section-header h2 {
	margin: 0;
	font-size: 1.4rem;
	font-weight: 700;
	display: flex;
	align-items: center;
	gap: 12px;
	color: var(--rt-text-tertiary);
}

.rt-section-header h2 i {
	color: var(--rt-primary);
}

.rt-section-more {
	margin-left: auto;
	font-size: 0.9rem;
	color: var(--rt-accent);
	text-decoration: none;
	padding: 6px 18px;
	border-radius: 50px;
	background: rgba(255, 107, 107, 0.12);
	transition: all var(--rt-transition);
	font-weight: 500;
}

.rt-section-more:hover {
	background: var(--rt-accent);
	color: #fff;
	transform: translateY(-2px);
}

.rt-section-more i {
	margin-left: 4px;
}

/* ---------- اسلایدر ---------- */
.rt-section-slider {
	position: relative;
	display: flex;
	align-items: center;
}

.rt-slider-track {
	display: flex;
	gap: 18px;
	overflow-x: auto;
	scroll-behavior: smooth;
	padding: 6px 4px 16px;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.rt-slider-track::-webkit-scrollbar {
	display: none;
}

.rt-track-card {
	flex: 0 0 170px;
	background: var(--rt-glass);
	border: 1px solid var(--rt-glass-border);
	border-radius: 14px;
	overflow: hidden;
	transition: all var(--rt-transition);
}

.rt-track-card:hover {
	transform: translateY(-8px);
	border-color: var(--rt-primary);
	box-shadow: 0 12px 36px rgba(59, 91, 219, 0.25);
}

.rt-track-card a {
	text-decoration: none;
	color: inherit;
	display: block;
}

.rt-card-image {
	position: relative;
	aspect-ratio: 1;
	overflow: hidden;
	background: #1a1f2e;
}

.rt-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.rt-track-card:hover .rt-card-image img {
	transform: scale(1.08);
}

.rt-card-play {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.45);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity var(--rt-transition);
}

.rt-track-card:hover .rt-card-play {
	opacity: 1;
}

.rt-card-play i {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.7);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 1.1rem;
	transform: scale(0.8);
	transition: transform var(--rt-transition);
}

.rt-track-card:hover .rt-card-play i {
	transform: scale(1);
}

.rt-card-info {
	padding: 12px 14px;
}

.rt-card-info h4 {
	margin: 0 0 4px 0;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--rt-text-tertiary);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.rt-card-info p {
	margin: 0;
	font-size: 0.75rem;
	color: var(--rt-text-tertiary);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* فلش‌های اسلایدر */
.rt-slider-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 5;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--rt-glass);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: 1px solid var(--rt-glass-border);
	color: var(--rt-text-primary);
	font-size: 1.1rem;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all var(--rt-transition);
}

.rt-slider-arrow:hover {
	background: var(--rt-primary);
	border-color: var(--rt-primary);
	transform: translateY(-50%) scale(1.05);
}

.rt-slider-arrow:active {
	transform: translateY(-50%) scale(0.92);
}

.rt-slider-arrow.prev {
	right: -6px;
}

.rt-slider-arrow.next {
	left: -6px;
}

/* ---------- مودال ویدیو ---------- */
.rt-video-modal {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 10000;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, 0.75);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	padding: 24px;
}

.rt-video-overlay {
	position: absolute;
	inset: 0;
	cursor: pointer;
}

.rt-video-container {
	position: relative;
	max-width: 920px;
	width: 100%;
	background: #0b0e1a;
	border-radius: var(--rt-radius);
	overflow: hidden;
	box-shadow: 0 40px 80px rgba(0, 0, 0, 0.6);
	animation: rtModalIn 0.35s ease;
}

@keyframes rtModalIn {
	from {
		opacity: 0;
		transform: scale(0.92);
	}

	to {
		opacity: 1;
		transform: scale(1);
	}
}

.rt-video-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 24px;
	background: var(--rt-glass);
	border-bottom: 1px solid var(--rt-glass-border);
}

.rt-video-header h3 {
	margin: 0;
	font-size: 1.1rem;
	display: flex;
	align-items: center;
	gap: 12px;
	color: var(--rt-text-tertiary);
}

.rt-video-close {
	background: transparent;
	border: none;
	color: var(--rt-text-tertiary);
	font-size: 1.5rem;
	cursor: pointer;
	transition: color var(--rt-transition);
	padding: 4px 8px;
}

.rt-video-close:hover {
	color: #fff;
}

.rt-video-body {
	padding: 24px;
	min-height: 220px;
}

.rt-video-loading,
.rt-video-error {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 16px;
	padding: 50px 20px;
	color: var(--rt-text-tertiary);
}

.rt-video-loading i {
	font-size: 3rem;
	color: var(--rt-primary);
}

.rt-video-error i {
	font-size: 3rem;
	color: var(--rt-danger);
}

.rt-video-error button {
	padding: 10px 30px;
	border-radius: 50px;
	border: none;
	background: var(--rt-primary);
	color: #fff;
	cursor: pointer;
	font-size: 0.95rem;
	transition: background var(--rt-transition);
}

.rt-video-error button:hover {
	background: var(--rt-primary-hover);
}

/* ---------- ریسپانسیو ---------- */
@media (max-width: 1200px) {
	.rt-single-page {
		padding: 20px 24px 40px;
	}

	.rt-hero-cover {
		flex: 0 0 200px;
	}

	.rt-info-title {
		font-size: 2.2rem;
	}
}

@media (max-width: 992px) {
	.rt-hero-container {
		gap: 28px;
	}

	.rt-hero-cover {
		flex: 0 0 180px;
	}

	.rt-info-title {
		font-size: 2rem;
	}

	.rt-info-stats {
		gap: 12px 20px;
		font-size: 0.85rem;
	}
}

@media (max-width: 820px) {
	.rt-single-page {
		padding: 16px;
		gap: 24px;
	}

	.rt-single-page__hero {
		padding: 24px 20px;
	}

	.rt-hero-container {
		flex-direction: column;
		align-items: center;
		text-align: center;
	}

	.rt-hero-cover {
		flex: 0 0 200px;
		width: 200px;
	}

	.rt-cover-actions {
		display: none;
	}

	.rt-info-badge {
		margin: 0 auto 12px;
	}

	.rt-info-stats {
		justify-content: center;
	}

	.rt-info-actions {
		justify-content: center;
	}

	.rt-tab-btn {
		min-width: 70px;
		font-size: 0.7rem;
		padding: 10px 6px;
	}

	.rt-tab-btn i {
		font-size: 1rem;
	}

	.rt-panel-inner {
		padding: 20px;
	}

	.rt-action-primary,
    .rt-action-secondary {
		padding: 8px 18px;
		font-size: 0.85rem;
	}

	.rt-track-card {
		flex: 0 0 150px;
	}

	.rt-slider-arrow {
		width: 34px;
		height: 34px;
		font-size: 0.9rem;
	}

	.rt-slider-arrow.prev {
		right: -4px;
	}

	.rt-slider-arrow.next {
		left: -4px;
	}
}

@media (max-width: 576px) {
	.rt-single-page {
		padding: 12px;
		gap: 20px;
	}

	.rt-single-page__hero {
		padding: 18px 14px;
		border-radius: 12px;
	}

	.rt-hero-cover {
		flex: 0 0 160px;
		width: 160px;
	}

	.rt-info-title {
		font-size: 1.6rem;
	}

	.rt-info-stats {
		gap: 8px 14px;
		font-size: 0.75rem;
	}

	.rt-info-stats span {
		padding: 2px 10px;
	}

	.rt-info-actions {
		gap: 8px;
	}

	.rt-action-primary,
    .rt-action-secondary {
		padding: 6px 14px;
		font-size: 0.8rem;
		gap: 6px;
	}

	.rt-action-primary i,
    .rt-action-secondary i {
		font-size: 0.9rem;
	}

	.rt-tab-btn {
		min-width: 56px;
		padding: 8px 4px;
		font-size: 0.6rem;
		gap: 2px;
	}

	.rt-tab-btn i {
		font-size: 0.9rem;
	}

	.rt-panel-inner {
		padding: 14px;
	}

	.rt-album-track-item {
		flex-wrap: wrap;
		gap: 8px;
		padding: 10px 12px;
	}

	.rt-track-cover {
		flex: 0 0 44px;
	}

	.rt-track-info h4 {
		font-size: 0.85rem;
	}

	.rt-track-duration {
		font-size: 0.75rem;
	}

	.rt-track-actions {
		margin-left: auto;
	}

	.rt-track-card {
		flex: 0 0 130px;
	}

	.rt-card-info h4 {
		font-size: 0.8rem;
	}

	.rt-slider-arrow {
		width: 28px;
		height: 28px;
		font-size: 0.75rem;
	}

	.rt-slider-arrow.prev {
		right: -2px;
	}

	.rt-slider-arrow.next {
		left: -2px;
	}

	.rt-video-container {
		border-radius: 12px;
	}

	.rt-video-header {
		padding: 12px 16px;
	}

	.rt-video-header h3 {
		font-size: 0.95rem;
	}

	.rt-video-body {
		padding: 12px;
		min-height: 160px;
	}

	.rt-report-wrapper .report-button-minimal {
		padding: 6px 14px;
		font-size: 0.8rem;
	}

	.rt-section-header h2 {
		font-size: 1.1rem;
	}

	.rt-section-more {
		font-size: 0.75rem;
		padding: 4px 12px;
	}
}
/* مودال ارسال متن ترانه */
.raditone-modal-lyrics {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.75);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	z-index: 9999999;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.raditone-modal-lyrics.active {
	display: flex;
}

.raditone-modal-container {
	width: 100%;
	max-width: 480px;
	max-height: 88vh;
	background: var(--bg-primary);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border-radius: 24px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	border: 1px solid var(--glass-border);
	box-shadow: 0 24px 64px -12px rgba(0, 0, 0, 0.4);
	animation: raditoneModalIn 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes raditoneModalIn {
	from {
		opacity: 0;
		transform: scale(0.92) translateY(20px);
	}

	to {
		opacity: 1;
		transform: scale(1) translateY(0);
	}
}

.raditone-modal-header {
	padding: 18px 22px;
	background: linear-gradient(-135deg, var(--primary), #2563eb);
	color: white;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 12px;
	flex-shrink: 0;
}

.raditone-modal-header h3 {
	margin: 0;
	font-size: 1.05rem;
	font-weight: 700;
}

.raditone-modal-header p {
	margin: 3px 0 0;
	font-size: 0.72rem;
	opacity: 0.85;
}

.raditone-modal-close {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.2);
	border: 1px solid rgba(255, 255, 255, 0.3);
	color: white;
	font-size: 1.1rem;
	cursor: pointer;
	transition: all 0.25s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.raditone-modal-close:hover {
	background: rgba(255, 255, 255, 0.35);
	transform: rotate(-90deg);
}

.raditone-modal-body {
	padding: 22px;
	overflow-y: auto;
	flex: 1;
}

.raditone-modal-body .form-group {
	margin-bottom: 16px;
}

.raditone-modal-body label {
	display: block;
	margin-bottom: 6px;
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--text-primary);
}

.raditone-modal-body label .required {
	color: var(--danger);
	margin-left: 2px;
}

.raditone-modal-body input,
.raditone-modal-body textarea {
	width: 100%;
	padding: 11px 14px;
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	border-radius: 12px;
	color: var(--text-primary);
	font-size: 0.85rem;
	font-family: inherit;
	box-sizing: border-box;
	transition: all 0.2s ease;
}

.raditone-modal-body input:focus,
.raditone-modal-body textarea:focus {
	outline: none;
	border-color: var(--primary);
	box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.raditone-modal-body textarea {
	resize: vertical;
	min-height: 120px;
}

.raditone-captcha {
	background: var(--bg-tertiary);
	padding: 14px 16px;
	border-radius: 14px;
	margin-bottom: 18px;
	border: 1px solid var(--border-primary);
}

.raditone-captcha label {
	margin-bottom: 10px;
}

.raditone-captcha-numbers {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}

.raditone-captcha-numbers span {
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--primary);
}

.raditone-captcha-numbers input {
	width: 70px;
	padding: 8px;
	background: var(--bg-primary);
	border: 1px solid var(--border-primary);
	border-radius: 10px;
	text-align: center;
	font-size: 1rem;
	font-weight: 600;
}

.raditone-modal-submit {
	width: 100%;
	padding: 13px;
	background: linear-gradient(-135deg, var(--primary), #2563eb) !important;
	border: none;
	border-radius: 50px;
	color: white;
	font-size: 0.9rem;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	font-family: inherit;
	box-shadow: 0 4px 16px rgba(59, 130, 246, 0.3);
}

.raditone-modal-submit:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(59, 130, 246, 0.4);
}

.raditone-modal-submit:disabled {
	opacity: 0.7;
	cursor: not-allowed;
}

.raditone-modal-footer {
	padding: 10px 18px;
	background: var(--bg-tertiary);
	border-top: 1px solid var(--border-primary);
	font-size: 0.7rem;
	color: var(--text-tertiary);
	text-align: center;
	flex-shrink: 0;
}

/* مودال گزارش */
.raditone-report-modal {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.75);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	z-index: 999999999;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.raditone-report-modal.active {
	display: flex;
}

.raditone-report-container {
	width: 100%;
	max-width: 480px;
	max-height: 88vh;
	background: var(--bg-primary);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border-radius: 24px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	border: 1px solid var(--glass-border);
	box-shadow: 0 24px 64px -12px rgba(0, 0, 0, 0.4);
	animation: raditoneModalIn 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.raditone-report-header {
	padding: 16px 20px;
	background: var(--primary);
	color: var(--text-primary);
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-shrink: 0;
}

.raditone-report-header h3 {
	margin: 0;
	font-size: 1.05rem;
	font-weight: 700;
}

.raditone-report-close {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: va(--bg-primary);
	border: 1px solid var(--border-primary);
	color: var(--text-primary);
	cursor: pointer;
	transition: all 0.25s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.1rem;
}

.raditone-report-close:hover {
	background: rgba(255, 255, 255, 0.35);
	transform: rotate(-90deg);
}

.raditone-report-body {
	padding: 20px;
	overflow-y: auto;
	flex: 1;
}

.raditone-report-info {
	background: rgba(59, 130, 246, 0.08);
	padding: 12px 14px;
	border-radius: 12px;
	margin-bottom: 18px;
	font-size: 0.8rem;
	color: var(--primary);
	border-left: 3px solid var(--primary);
	line-height: 1.6;
}

.report-section-label {
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--text-primary);
	margin-bottom: 10px;
	display: block;
}

.raditone-report-option {
	display: flex;
	align-items: center;
	padding: 10px 14px;
	margin: 4px 0;
	background: var(--bg-tertiary);
	border-radius: 12px;
	cursor: pointer;
	transition: all 0.2s ease;
	border: 1px solid transparent;
}

.raditone-report-option:hover {
	background: var(--primary-light);
	border-color: var(--primary);
}

.raditone-report-option input[type="checkbox"] {
	margin-right: 10px;
	width: 18px;
	height: 18px;
	cursor: pointer;
	accent-color: var(--primary);
	flex-shrink: 0;
}

.raditone-report-option label {
	flex: 1;
	cursor: pointer;
	color: var(--text-secondary);
	font-size: 0.83rem;
	margin: 0;
}

.raditone-report-textarea,
.raditone-report-input {
	width: 100%;
	padding: 11px 14px;
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	border-radius: 12px;
	color: var(--text-primary);
	font-size: 0.85rem;
	margin: 10px 0;
	resize: vertical;
	font-family: inherit;
	box-sizing: border-box;
	transition: all 0.2s ease;
}

.raditone-report-textarea:focus,
.raditone-report-input:focus {
	outline: none;
	border-color: var(--primary);
	box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.raditone-report-submit {
	width: 100%;
	padding: 13px;
	background: var(--raditone-secondary) !important;
	border: none;
	border-radius: 50px;
	color: var(--text-primary);
	font-size: 0.9rem;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	font-family: inherit;
	box-shadow: 0 4px 16px rgba(239, 68, 68, 0.3);
	margin-top: 8px;
}

.raditone-report-submit:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(239, 68, 68, 0.4);
}

.raditone-report-submit:disabled {
	opacity: 0.7;
	cursor: not-allowed;
}

/* توست نوتیفیکیشن شکیل */
.raditone-toast {
	position: fixed;
	bottom: 32px;
	right: 50%;
	transform: translateX(50%) translateY(120px);
	background: var(--bg-secondary);
	color: var(--text-primary);
	padding: 12px 22px;
	border-radius: 50px;
	font-size: 0.85rem;
	font-weight: 500;
	z-index: 10000000;
	opacity: 0;
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	border: 1px solid var(--glass-border);
	box-shadow: 0 12px 32px -8px rgba(0, 0, 0, 0.3);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	white-space: nowrap;
	display: flex;
	align-items: center;
	gap: 8px;
}

.raditone-toast.show {
	transform: translateX(50%) translateY(0);
	opacity: 1;
}

.raditone-toast.success i {
	color: var(--success);
}

.raditone-toast.error i {
	color: var(--danger);
}

/* ریسپانسیو */
@media (max-width: 640px) {
	.raditone-modal-container,
    .raditone-report-container {
		max-height: 92vh;
		width: 94%;
		border-radius: 20px;
	}

	.raditone-modal-header,
    .raditone-report-header {
		padding: 14px 16px;
	}

	.raditone-modal-body,
    .raditone-report-body {
		padding: 16px;
	}

	.raditone-toast {
		white-space: normal;
		max-width: 90%;
		text-align: center;
		font-size: 0.78rem;
		padding: 10px 16px;
		bottom: 24px;
	}
}

/*------------------------------- Album Tracks Style -------------------------------*/
/* ============================================
   استایل مدرن لیست ترک‌های آلبوم
   ============================================ */

.raditone-album-tracks {
	margin-top: 40px;
	border-radius: 28px;
	overflow: hidden;
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	box-shadow: 0 10px 30px -15px rgba(0, 0, 0, 0.1);
}

/* ========== هدر ========== */
.raditone-tracks-header {
	position: relative;
	background: linear-gradient(-135deg, rgba(59, 130, 246, 0.1), rgba(139, 92, 246, 0.05));
	padding: 20px 24px;
	border-bottom: 1px solid var(--border-primary);
	overflow: hidden;
}

.raditone-header-gradient {
	position: absolute;
	top: -50%;
	left: -50%;
	width: 200px;
	height: 200px;
	background: radial-gradient(circle, rgba(59, 130, 246, 0.15), transparent 70%);
	border-radius: 50%;
}

.raditone-header-content {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
	width: 100%;
}

.raditone-header-icon {
	width: 52px;
	height: 52px;
	background: linear-gradient(-135deg, #3b82f6, #8b5cf6);
	border-radius: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.raditone-header-icon i {
	font-size: 1.6rem;
	color: white;
}

.raditone-header-info {
	flex: 1;
}

.raditone-header-info h3 {
	margin: 0 0 4px 0;
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--text-primary);
}

.raditone-header-info p {
	margin: 0;
	font-size: 0.75rem;
	color: var(--text-tertiary);
}

.raditone-header-actions {
	display: flex;
	gap: 12px;
}

.raditone-action-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 18px;
	background: transparent;
	border: 1px solid var(--border-primary);
	border-radius: 40px;
	font-size: 0.8rem;
	font-weight: 500;
	color: var(--text-primary);
	cursor: pointer;
	transition: all 0.3s ease;
}

.raditone-action-btn:hover {
	background: linear-gradient(-135deg, #3b82f6, #8b5cf6);
	border-color: transparent;
	color: white;
	transform: translateY(-2px);
}

.raditone-action-btn i {
	font-size: 0.85rem;
}

/* ========== لیست ترک‌ها ========== */
.raditone-tracks-list {
	padding: 8px 0;
}

.raditone-track-card {
	padding: 12px 20px;
	border-bottom: 1px solid var(--border-primary);
	transition: all 0.3s ease;
	position: relative;
}

.raditone-track-card:hover {
	background: rgba(59, 130, 246, 0.03);
}

.raditone-track-card.raditone-playing {
	background: linear-gradient(-90deg, rgba(59, 130, 246, 0.08), transparent);
	border-right: 3px solid #3b82f6;
}

/* نسخه موبایل (پیش‌فرض) */
.raditone-track-row-mobile {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
}

.raditone-track-main-mobile {
	display: flex;
	align-items: center;
	gap: 14px;
	flex: 1;
}

/* نسخه دسکتاپ (مخفی در موبایل) */
.raditone-track-row {
	display: none;
}

/* شماره ترک */
.raditone-track-number {
	position: relative;
	width: 48px;
	flex-shrink: 0;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	background: var(--primary);
	color: #fff;
	padding: 5px;
	margin-left: -10px;
}

.raditone-number {
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--text-tertiary);
	font-feature-settings: "tnum";
}

.raditone-play-btn {
	width: 64px;
    height: 45px;
    background: var(--primary) !important;
    border: none;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transform: scale(0.8);
    transition: all 0.25s ease;
    color: white !important;
}

.raditone-track-number:hover .raditone-number {
	opacity: 0;
}

.raditone-track-number:hover .raditone-play-btn {
	opacity: 1;
	transform: scale(1);
}

/* اطلاعات ترک */
.raditone-track-info {
	flex: 1;
}

.raditone-track-title {
	margin: 0 0 4px 0;
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--text-primary);
	transition: color 0.2s ease;
}

.raditone-track-card:hover .raditone-track-title {
	color: #3b82f6;
}

.raditone-track-artist {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 0.7rem;
	color: var(--text-tertiary);
}

.raditone-track-artist i {
	font-size: 0.65rem;
}

/* دکمه‌های اکشن */
.raditone-track-actions {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
}

.raditone-action-icon {
	width: 34px;
	height: 34px;
	background: transparent;
	border: none;
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	color: var(--text-tertiary);
	transition: all 0.2s ease;
}

.raditone-action-icon:hover {
	background: rgba(59, 130, 246, 0.1);
	color: #3b82f6;
	transform: scale(1.05);
}

/* رای گیری */
.raditone-track-vote {
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid var(--border-primary);
	display: flex;
	justify-content: flex-end;
}

.play-btn-mobile {
	display: none;
}

@media (max-width: 768px) {
	.play-btn-mobile {
		display: block;
	}

	.raditone-track-vote {
		margin-top: 12px;
		padding-top: 12px;
		border-top: 1px solid var(--border-primary);
		display: flex;
		justify-content: center;
	}
}

/* ========== دکمه علاقه‌مندی ========== */
.raditone-fav-wrapper {
	display: inline-flex;
}

.raditone-fav-wrapper [class*="fav-btn"] {
	width: 34px;
	height: 34px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 12px;
	transition: all 0.2s ease;
}

/* ========== Dropdown منو ========== */
.raditone-dropdown-wrapper {
	position: relative;
}

.raditone-dropdown-menu {
	position: absolute;
	top: 100%;
	right: 0;
	min-width: 160px;
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 16px;
	padding: 8px;
	z-index: 100;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-8px);
	transition: all 0.2s ease;
	box-shadow: 0 15px 35px -12px rgba(0, 0, 0, 0.2);
}

.raditone-dropdown-menu.raditone-show {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.raditone-more-option {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 8px 12px;
	background: transparent;
	border: none;
	border-radius: 12px;
	font-size: 0.75rem;
	color: var(--text-primary);
	cursor: pointer;
	transition: all 0.2s ease;
	text-align: left;
}

.raditone-more-option:hover {
	background: rgba(59, 130, 246, 0.1);
	color: #3b82f6;
}

.raditone-more-option i {
	width: 18px;
	font-size: 0.85rem;
}

/* ========== مودال متن ترانه ========== */
.raditone-lyrics-modal {
	display: none;
	position: fixed;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.8);
	backdrop-filter: blur(8px);
	z-index: 10000;
	align-items: center;
	justify-content: center;
}

.raditone-lyrics-modal.raditone-show {
	display: flex;
}

.raditone-lyrics-modal-content {
	width: 90%;
	max-width: 600px;
	max-height: 80vh;
	background: var(--bg-secondary);
	border-radius: 28px;
	overflow: hidden;
	border: 1px solid var(--border-primary);
	box-shadow: 0 30px 50px -20px rgba(0, 0, 0, 0.5);
}

.raditone-lyrics-modal-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 18px 24px;
	background: linear-gradient(-135deg, rgba(59, 130, 246, 0.1), rgba(139, 92, 246, 0.05));
	border-bottom: 1px solid var(--border-primary);
}

.raditone-lyrics-modal-header h3 {
	margin: 0;
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--text-primary);
}

.raditone-lyrics-modal-close {
	width: 36px;
	height: 36px;
	background: transparent;
	border: none;
	border-radius: 12px;
	font-size: 1.5rem;
	cursor: pointer;
	color: var(--text-tertiary);
	transition: all 0.2s ease;
}

.raditone-lyrics-modal-close:hover {
	background: rgba(239, 68, 68, 0.1);
	color: #ef4444;
}

.raditone-lyrics-modal-body {
	padding: 24px;
	font-size: 0.85rem;
	line-height: 1.8;
	color: var(--text-secondary);
	max-height: 60vh;
	overflow-y: auto;
	white-space: pre-wrap;
	font-family: var(--font-iranyekan);
}

/* ========== مودال دانلود و اشتراک ========== */
.rd-modal-overlay {
	position: fixed;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.75);
	backdrop-filter: blur(8px);
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s ease;
}

.rd-modal-overlay.rd-active {
	opacity: 1;
	visibility: visible;
}

.rd-modal {
	width: 90%;
	max-width: 450px;
	background: var(--bg-secondary);
	border-radius: 28px;
	overflow: hidden;
	border: 1px solid var(--border-primary);
	transform: scale(0.95);
	transition: transform 0.3s ease;
}

.rd-modal-overlay.rd-active .rd-modal {
	transform: scale(1);
}

.rd-modal-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 18px 24px;
	background: linear-gradient(-135deg, rgba(59, 130, 246, 0.1), rgba(139, 92, 246, 0.05));
	border-bottom: 1px solid var(--border-primary);
}

.rd-modal-header h3 {
	margin: 0;
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--text-primary);
}

.rd-modal-header h3 i {
	margin-right: 8px;
	color: #3b82f6;
}

.rd-modal-close {
	width: 36px;
	height: 36px;
	background: transparent;
	border: none;
	border-radius: 12px;
	font-size: 1.3rem;
	cursor: pointer;
	color: var(--text-tertiary);
	transition: all 0.2s ease;
}

.rd-modal-close:hover {
	background: rgba(239, 68, 68, 0.1);
	color: #ef4444;
}

.rd-modal-body {
	padding: 24px;
}

.rd-download-options {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.rd-download-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 12px 18px;
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	border-radius: 18px;
	text-decoration: none;
	color: var(--text-primary);
	transition: all 0.2s ease;
}

.rd-download-item:hover {
	border-color: #3b82f6;
	transform: translateX(4px);
}

.rd-download-item i:first-child {
	font-size: 1.1rem;
}

.rd-download-item i:first-child.fa-crown {
	color: #fbbf24;
}

.rd-download-item i:first-child.fa-star {
	color: #3b82f6;
}

.rd-download-item i:last-child {
	opacity: 0;
	transition: opacity 0.2s ease;
}

.rd-download-item:hover i:last-child {
	opacity: 1;
}

.rd-share-options {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.rd-share-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 12px 18px;
	background: transparent;
	border: 1px solid var(--border-primary);
	border-radius: 18px;
	font-size: 0.85rem;
	color: var(--text-primary);
	cursor: pointer;
	transition: all 0.2s ease;
}

.rd-share-item:hover {
	border-color: #3b82f6;
	background: rgba(59, 130, 246, 0.05);
	transform: translateX(4px);
}

.rd-share-item i:first-child {
	font-size: 1.2rem;
}

.rd-share-item i.fa-telegram {
	color: #26A5E4;
}

.rd-share-item i.fa-whatsapp {
	color: #25D366;
}

.rd-no-download {
	text-align: center;
	padding: 30px;
	color: var(--text-tertiary);
}

.raditone-header-icon svg {
	color: #fff;
}

/* ========== ریسپانسیو ========== */
@media (min-width: 768px) {
	.raditone-track-row-mobile {
		display: none;
	}

	.raditone-track-row {
		display: flex;
		align-items: center;
		gap: 16px;
	}

	.raditone-track-actions {
		gap: 6px;
	}
}

@media (max-width: 767px) {
	.raditone-tracks-header {
		padding: 16px;
	}

	.raditone-header-content {
		width: 100%;
	}

	.raditone-header-icon {
		width: 44px;
		height: 44px;
	}

	.raditone-header-icon i {
		font-size: 1.3rem;
	}

	.raditone-header-actions {
		width: 50%;
		justify-content: center;
		display: flex;
		flex-direction: column;
		align-items: end;
	}

	.raditone-action-btn {
		padding: 6px 14px;
		font-size: 0.75rem;
	}

	.raditone-track-card {
		padding: 12px;
	}

	.raditone-track-main-mobile {
		gap: 10px;
	}

	.raditone-track-number {
		width: 40px;
	}

	.raditone-track-title {
		font-size: 0.85rem;
	}

	.raditone-track-actions {
		gap: 4px;
	}

	.raditone-action-icon {
		width: 30px;
		height: 30px;
	}
}

@media (max-width: 480px) {
	.raditone-track-actions {
		width: 100%;
		justify-content: space-around;
		padding-top: 8px;
	}

	.raditone-track-main-mobile {
		flex-wrap: wrap;
	}
}

/* ========================================
   مودال دانلود و اشتراک (برعکس تم)
   ======================================== */

/* مودال دانلود */
.rd-modal-overlay {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.75);
	backdrop-filter: blur(8px);
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s ease;
}

.rd-modal-overlay.rd-active {
	opacity: 1;
	visibility: visible;
}

.rd-modal {
	width: 90%;
	max-width: 400px;
	background: var(--bg-secondary);
	border-radius: 28px;
	box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
	transform: scale(0.95);
	transition: transform 0.3s ease;
	overflow: hidden;
}

.rd-modal-overlay.rd-active .rd-modal {
	transform: scale(1);
}

/* حالت همیشه روشن برای مودال دانلود (برعکس تم) */
.rd-modal {
	background: #1e1e2e;
	color: #eef5ff;
	box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.3);
}

.rd-modal-header {
	padding: 20px 24px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.rd-modal-header h3 {
	margin: 0;
	font-size: 1.2rem;
	font-weight: 700;
	display: flex;
	align-items: center;
	gap: 10px;
	color: #eef5ff;
}

.rd-modal-header h3 i {
	font-size: 1.2rem;
}

.rd-modal-close {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.1);
	border: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.3rem;
	color: #eef5ff;
	transition: all 0.2s;
}

.rd-modal-close:hover {
	transform: rotate(-90deg);
	background: rgba(255, 255, 255, 0.2);
}

.rd-modal-body {
	padding: 20px 24px 24px;
}

/* گزینه‌های دانلود */
.rd-download-options,
.rd-share-options {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.rd-download-item,
.rd-share-item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	border-radius: 16px;
	text-decoration: none;
	font-size: 0.95rem;
	font-weight: 500;
	transition: all 0.2s;
	cursor: pointer;
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.1);
	color: #eef5ff;
}

.rd-download-item:hover,
.rd-share-item:hover {
	transform: translateY(-2px);
	background: rgba(255, 255, 255, 0.12);
	border-color: var(--primary, #3b82f6);
}

.rd-download-item i,
.rd-share-item i {
	width: 28px;
	font-size: 1.2rem;
}

.rd-download-item span,
.rd-share-item span {
	flex: 1;
}

.rd-download-size {
	font-size: 0.7rem;
	opacity: 0.7;
}

/* responsive */
@media (max-width: 480px) {
	.rd-modal {
		width: 95%;
		border-radius: 24px;
	}

	.rd-modal-header {
		padding: 16px 20px;
	}

	.rd-modal-body {
		padding: 16px 20px 20px;
	}

	.rd-download-item,
    .rd-share-item {
		padding: 12px 14px;
		font-size: 0.85rem;
	}
}

/* اضافه کنید به CSS */
.rd-no-download {
	text-align: center;
	padding: 30px 20px;
	opacity: 0.7;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}

.rd-no-download i {
	font-size: 2rem;
}

/*------------------------------- Content Style -------------------------------*/

/* ===== Description Section ===== */
.raditone-description-section {
	padding: 20px;
	margin-bottom: 8px;
}

.raditone-description-text {
	color: var(--text-secondary);
	line-height: 1.7;
	font-size: 0.9rem;
}

.raditone-description-text p {
	margin-bottom: 12px;
}

.raditone-section-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.raditone-right-header {
	display: flex;
}

.raditone-right-header .raditone-header-icon {
	margin-right: 10px;
	align-items: center;
}

/* ========================================
   استایل شیک برای جداول داخل محتوا
   ======================================== */
.raditone-content table {
	width: 100%;
	margin: 24px 0;
	border-collapse: separate;
	border-spacing: 0;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: var(--shadow-sm);
	direction: ltr;
}

.raditone-content thead tr {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
}

.raditone-content th {
	padding: 14px 16px;
	text-align: left;
	font-weight: 600;
	font-size: 0.85rem;
	color: white;
	border: none;
}

.raditone-content td {
	padding: 12px 16px;
	text-align: left;
	font-size: 0.85rem;
	border-bottom: 1px solid var(--border-primary);
	background: var(--bg-secondary);
	color: var(--text-primary);
}

.raditone-content tr:last-child td {
	border-bottom: none;
}

.raditone-content tbody tr:hover td {
	background: var(--primary-light);
}

/* جدول با حاشیه */
.raditone-content table:has(th) {
	border: 1px solid var(--border-primary);
}

/* جدول زیبا با استریپ */
.raditone-content tbody tr:nth-child(even) td {
	background: var(--bg-tertiary);
}

.raditone-content tbody tr:nth-child(even):hover td {
	background: var(--primary-light);
}

/* جدول کوچک (responsive) */
@media (max-width: 640px) {
	.raditone-content table,
    .raditone-content thead,
    .raditone-content tbody,
    .raditone-content th,
    .raditone-content td,
    .raditone-content tr {
		display: block;
	}

	.raditone-content thead tr {
		display: none;
	}

	.raditone-content tr {
		margin-bottom: 16px;
		border: 1px solid var(--border-primary);
		border-radius: 12px;
		overflow: hidden;
	}

	.raditone-content td {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 12px 16px;
		text-align: left;
		border-bottom: 1px solid var(--border-primary);
	}

	.raditone-content td:last-child {
		border-bottom: none;
	}

	.raditone-content td:before {
		content: attr(data-label);
		font-weight: 600;
		color: var(--primary);
		margin-right: 16px;
		font-size: 0.75rem;
	}
}

/* ===== Empty State ===== */
.raditone-empty-state {
	text-align: center;
	padding: 40px 20px;
}

.raditone-empty-icon {
	width: 70px;
	height: 70px;
	margin: 0 auto 16px;
	border-radius: 35px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.8rem;
	background: var(--bg-tertiary);
	color: var(--text-tertiary);
}

.raditone-empty-state h4 {
	margin: 0 0 8px 0;
	font-size: 1rem;
	color: var(--text-primary);
}

.raditone-empty-state p {
	margin: 0;
	font-size: 0.8rem;
	color: var(--text-tertiary);
}

/* ===== Tags Section ===== */
.raditone-tags-section {
	margin-top: 24px;
	padding-top: 20px;
	border-top: 1px solid var(--border-primary);
}

.raditone-tags-header {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 16px;
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--text-secondary);
}

.raditone-tags-count {
	margin-left: auto;
	font-size: 0.7rem;
	font-weight: normal;
	padding: 2px 10px;
	background: var(--bg-tertiary);
	border-radius: 50px;
	color: var(--text-tertiary);
}

.raditone-tags-container {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 12px;
}

.raditone-tag-item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 14px;
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	border-radius: 50px;
	color: var(--text-secondary);
	font-size: 0.75rem;
	text-decoration: none;
	transition: all var(--transition-fast);
}

.raditone-tag-item i {
	font-size: 0.7rem;
	color: var(--gold);
}

.raditone-tag-item:hover {
	background: var(--primary);
	border-color: var(--primary);
	color: white;
	transform: translateY(-2px);
}

.raditone-tag-item:hover i {
	color: white;
}

.raditone-tag-count {
	background: var(--glass);
	padding: 2px 6px;
	border-radius: 20px;
	font-size: 0.65rem;
}

.raditone-show-more-tags {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 16px;
	background: transparent;
	border: 1px dashed var(--primary);
	border-radius: 50px;
	color: var(--primary);
	font-size: 0.75rem;
	cursor: pointer;
	transition: all var(--transition);
}

.raditone-show-more-tags:hover {
	background: var(--primary-light);
}

.raditone-show-more-tags.active .fa-chevron-down {
	transform: rotate(-180deg);
}

.raditone-hidden-tags {
	display: none;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid var(--border-primary);
}

.raditone-hidden-tags.show {
	display: flex;
}

/* ===== Metadata Section ===== */
.raditone-metadata-section {
	margin-top: 24px;
	padding-top: 20px;
	border-top: 1px solid var(--border-primary);
}

.raditone-metadata-header {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 16px;
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--text-secondary);
}

.raditone-metadata-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 12px;
}

.raditone-metadata-item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px;
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	border-radius: 16px;
	transition: all var(--transition);
}

.raditone-metadata-item:hover {
	transform: translateY(-2px);
	border-color: var(--primary);
}

.raditone-metadata-icon {
	width: 40px;
	height: 40px;
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1rem;
}

.raditone-metadata-info {
	flex: 1;
	min-width: 0;
}

.raditone-metadata-label {
	font-size: 0.65rem;
	color: var(--text-tertiary);
	margin-bottom: 2px;
}

.raditone-metadata-value {
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--text-primary);
}

.raditone-category-link {
	color: var(--primary);
	text-decoration: none;
	transition: color var(--transition-fast);
}

.raditone-category-link:hover {
	color: var(--primary-hover);
	text-decoration: underline;
}

/* آیکون‌های رنگی */
.raditone-icon-gold {
	color: var(--gold);
}

.raditone-icon-cyan {
	color: var(--cyan);
}

.raditone-icon-bg-primary {
	background: var(--primary-light);
	color: var(--primary);
}

.raditone-icon-bg-secondary {
	background: var(--secondary-light);
	color: var(--secondary);
}

.raditone-icon-bg-accent {
	background: var(--accent-light);
	color: var(--accent);
}

.raditone-icon-bg-purple {
	background: var(--purple-light);
	color: var(--purple);
}

.raditone-icon-bg-gold {
	background: var(--gold-light);
	color: var(--gold);
}

.raditone-icon-bg-success {
	background: var(--success-light);
	color: var(--success);
}

.raditone-icon-bg-danger {
	background: var(--danger-light);
	color: var(--danger);
}

.raditone-icon-bg-tertiary {
	background: var(--bg-tertiary);
	color: var(--text-tertiary);
}

.raditone-line-clamp-1 {
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ریسپانسیو */
@media (max-width: 480px) {
	.raditone-description-section {
		padding: 16px;
	}

	.raditone-metadata-grid {
		grid-template-columns: 1fr;
		gap: 10px;
	}

	.raditone-metadata-item {
		padding: 10px;
	}

	.raditone-tags-container {
		gap: 8px;
	}

	.raditone-tag-item {
		padding: 4px 12px;
		font-size: 0.7rem;
	}
}

/*------------------------------- Download Style -------------------------------*/

/* ========================================
   بخش دانلود - طراحی مدرن و مینیمال
   کلاس‌های منحصربه‌فرد raditone-
   ======================================== */
.raditone-downloads-section {
	background: var(--glass);
	backdrop-filter: blur(12px);
	border: 1px solid var(--glass-border);
	border-radius: 28px;
	overflow: hidden;
	font-family: var(--font-iranyekan);
}

/* هدر بخش */
.raditone-downloads-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 20px 28px;
	background: linear-gradient(-135deg, rgba(59,130,246,0.08), rgba(139,92,246,0.04));
	border-bottom: 1px solid var(--border-primary);
	flex-wrap: wrap;
	gap: 16px;
}

.raditone-downloads-header-top {
	display: flex;
	align-items: center;
	gap: 16px;
}

.raditone-downloads-header-icon {
	width: 52px;
	height: 52px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--text-primary);
	box-shadow: 0 8px 16px -4px rgba(59,130,246,0.3);
}

.raditone-downloads-header-icon svg {
	width: 28px;
	height: 28px;
}

.raditone-downloads-header-info h2 {
	margin: 0;
	font-size: 1.3rem;
	font-weight: 700;
	color: var(--text-primary);
	letter-spacing: -0.3px;
}

.raditone-downloads-header-info p {
	margin: 4px 0 0;
	font-size: 0.8rem;
	color: var(--text-tertiary);
}

.raditone-downloads-header-badges {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.raditone-badge {
	padding: 6px 16px;
	border-radius: 50px;
	font-size: 0.75rem;
	font-weight: 500;
	display: flex;
	align-items: center;
	gap: 6px;
	backdrop-filter: blur(8px);
}

.raditone-badge-audio {
	background: rgba(59,130,246,0.15);
	color: var(--primary);
}

.raditone-badge-video {
	background: rgba(139,92,246,0.15);
	color: var(--accent);
}

.raditone-badge-album {
	background: rgba(245,158,11,0.15);
	color: var(--gold);
}

/* بخش ویدیو */
.raditone-video-player-section {
	padding: 24px 28px;
	border-bottom: 1px solid var(--border-primary);
}

.raditone-video-section-header {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 20px;
}

.raditone-video-icon {
	width: 44px;
	height: 44px;
	background: rgba(139,92,246,0.15);
	border-radius: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.3rem;
	color: var(--accent);
}

.raditone-video-section-header h3 {
	margin: 0;
	font-size: 1rem;
	font-weight: 700;
	color: var(--text-primary);
}

.raditone-video-section-header p {
	margin: 4px 0 0;
	font-size: 0.75rem;
	color: var(--text-tertiary);
}

.raditone-video-wrapper {
	position: relative;
	background: #000;
	border-radius: 20px;
	overflow: hidden;
	box-shadow: 0 12px 24px -8px rgba(0,0,0,0.3);
}

.raditone-video-player {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.raditone-video-controls {
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.8), transparent);
	padding: 16px 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.raditone-video-wrapper:hover .raditone-video-controls {
	opacity: 1;
}

.raditone-video-controls-left,
.raditone-video-controls-right {
	display: flex;
	align-items: center;
	gap: 12px;
}

.raditone-control-btn {
	background: transparent;
	border: none;
	color: white;
	font-size: 1rem;
	cursor: pointer;
	padding: 8px;
	border-radius: 50%;
	transition: all 0.2s ease;
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.raditone-control-btn:hover {
	background: rgba(255,255,255,0.2);
	transform: scale(1.05);
}

.raditone-time-display {
	font-size: 0.8rem;
	color: white;
	font-family: var(--font-iranyekan);
}

.raditone-quality-selector {
	position: relative;
}

.raditone-quality-btn {
	background: rgba(255,255,255,0.2);
	border: none;
	color: white;
	padding: 6px 12px;
	border-radius: 30px;
	font-size: 0.75rem;
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 6px;
	backdrop-filter: blur(4px);
}

.raditone-quality-dropdown {
	position: absolute;
	bottom: 100%;
	left: 0;
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 12px;
	padding: 8px;
	display: none;
	flex-direction: column;
	gap: 4px;
	margin-bottom: 8px;
	min-width: 100px;
	box-shadow: 0 8px 24px rgba(0,0,0,0.2);
}

.raditone-quality-dropdown.raditone-show {
	display: flex;
}

.raditone-quality-option {
	background: transparent;
	border: none;
	padding: 8px 12px;
	color: var(--text-secondary);
	font-size: 0.75rem;
	cursor: pointer;
	border-radius: 8px;
	text-align: left;
	transition: all 0.2s ease;
}

.raditone-quality-option:hover {
	background: rgba(59,130,246,0.1);
	color: var(--primary);
}

/* گروه‌های دانلود */
.raditone-download-group {
	padding: 20px 28px;
	border-bottom: 1px solid var(--border-primary);
}

.raditone-download-group:last-child {
	border-bottom: none;
}

.raditone-group-header {
	display: flex;
	gap: 14px;
	margin-bottom: 20px;
	flex-wrap: nowrap;
	flex-direction: row;
	align-items: center;
}

.raditone-group-icon {
	width: 44px;
	height: 44px;
	border-radius: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.2rem;
}

.raditone-audio-icon {
	background: rgba(59,130,246,0.15);
	color: var(--primary);
}

.raditone-video-icon {
	background: rgba(139,92,246,0.15);
	color: var(--accent);
}

.raditone-album-icon {
	background: rgba(245,158,11,0.15);
	color: var(--gold);
}

.raditone-group-header h3 {
	margin: 0;
	font-size: 1rem;
	font-weight: 700;
	color: var(--text-primary);
}

.raditone-group-header p {
	margin: 2px 0 0;
	font-size: 0.7rem;
	color: var(--text-tertiary);
}

.raditone-group-count {
	margin-left: auto;
	background: var(--bg-tertiary);
	padding: 4px 12px;
	border-radius: 50px;
	font-size: 0.7rem;
	color: var(--text-tertiary);
	display: flex;
	align-items: center;
	gap: 6px;
	/* display: none; */;
}

/* لیست دانلود */
.raditone-download-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.raditone-download-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 14px 20px;
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 16px;
	text-decoration: none;
	transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
	position: relative;
	overflow: hidden;
	background: var(--bg-hover);
}

.raditone-download-row::before {
	content: '';
	position: absolute;
	right: 0;
	top: 0;
	height: 100%;
	width: 3px;
	background: var(--primary);
	border-radius: 4px 0 0 4px;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.raditone-download-row:hover {
	border-color: var(--primary);
	transform: translateX(4px);
	box-shadow: 0 4px 16px rgba(59,130,246,0.1);
}

.raditone-download-row:hover::before {
	opacity: 1;
}

.raditone-download-row-left {
	display: flex;
	align-items: center;
	gap: 16px;
	flex: 1;
	min-width: 0;
}

.raditone-download-row-icon {
	width: 46px;
	height: 46px;
	border-radius: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.1rem;
	color: white;
	flex-shrink: 0;
	box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

/* گرادینت‌های آیکون */
.raditone-gradient-primary {
	background: linear-gradient(-135deg, var(--primary), var(--primary-hover));
}

.raditone-gradient-secondary {
	background: linear-gradient(-135deg, var(--secondary), var(--secondary-hover));
}

.raditone-gradient-warning {
	background: linear-gradient(-135deg, var(--warning), var(--warning-hover));
}

.raditone-gradient-danger {
	background: linear-gradient(-135deg, var(--danger), var(--danger-hover));
}

.raditone-gradient-success {
	background: linear-gradient(-135deg, var(--success), var(--success-hover));
}

.raditone-gradient-info {
	background: linear-gradient(-135deg, var(--info, var(--primary)), var(--accent));
}

.raditone-download-row-info {
	flex: 1;
	min-width: 0;
}

.raditone-download-row-title {
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--text-primary);
	margin-bottom: 6px;
}

.raditone-download-row-meta {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.raditone-meta-badge {
	font-size: 0.7rem;
	padding: 3px 10px;
	border-radius: 30px;
	font-weight: 500;
	white-space: nowrap;
}

.raditone-meta-quality {
	background: rgba(59,130,246,0.1);
	color: var(--primary);
}

.raditone-meta-format {
	background: rgba(139,92,246,0.1);
	color: var(--accent);
}

.raditone-meta-size {
	background: var(--glass);
	color: var(--text-tertiary);
}

.raditone-download-row-action {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 18px;
	background: rgba(59,130,246,0.1);
	border-radius: 40px;
	color: var(--primary);
	font-size: 0.8rem;
	font-weight: 600;
	transition: all 0.3s ease;
	flex-shrink: 0;
	border: 1px solid transparent;
}

.raditone-download-row-action i {
	font-size: 0.9rem;
	transition: transform 0.3s ease;
}

.raditone-download-row:hover .raditone-download-row-action {
	background: var(--primary);
	color: white;
	border-color: var(--primary);
	box-shadow: 0 4px 12px rgba(59,130,246,0.3);
}

.raditone-download-row:hover .raditone-download-row-action i {
	transform: translateY(-2px);
}

/* حالت خالی */
.raditone-empty-downloads {
	text-align: center;
	padding: 50px 28px;
}

.raditone-empty-icon {
	width: 80px;
	height: 80px;
	margin: 0 auto 20px;
	background: var(--bg-tertiary);
	border-radius: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 2rem;
	color: var(--text-tertiary);
	border: 2px dashed var(--border-primary);
}

.raditone-empty-downloads h3 {
	margin: 0 0 8px;
	font-size: 1.1rem;
	color: var(--text-primary);
}

.raditone-empty-downloads p {
	margin: 0;
	font-size: 0.85rem;
	color: var(--text-tertiary);
	line-height: 1.8;
}

/* ریسپانسیو */
@media (max-width: 640px) {
	.raditone-downloads-header {
		padding: 10px 5px;
		flex-direction: column;
		gap: 12px;
	}

	.raditone-downloads-header-icon {
		width: 42px;
		height: 42px;
	}

	.raditone-downloads-header-info h2 {
		font-size: 1.1rem;
	}

	.raditone-video-player-section,
    .raditone-download-group {
		padding: 16px 18px;
	}

	.raditone-download-row {
		padding: 12px 14px;
	}

	.raditone-download-row-icon {
		width: 40px;
		height: 40px;
		font-size: 1rem;
	}

	.raditone-download-row-title {
		font-size: 0.8rem;
	}

	.raditone-download-row-action {
		padding: 6px 14px;
	}

	.raditone-download-row-action span {
		display: none;
	}

	.raditone-video-controls {
		padding: 12px;
	}

	.raditone-control-btn {
		width: 30px;
		height: 30px;
	}
}

/*------------------------------- Lyric Style -------------------------------*/
/* ============================================
   استایل مدرن بخش متن ترانه
   ============================================ */

.raditone-lyrics-wrapper {
	margin: 30px 0;
}

.raditone-lyrics-box {
	background: var(--bg-secondary);
	border-radius: 28px;
	overflow: hidden;
	border: 1px solid var(--border-primary);
	box-shadow: 0 15px 35px -15px rgba(0, 0, 0, 0.15);
	transition: all 0.3s ease;
}

/* ========== هدر ========== */
.raditone-lyrics-header {
	background: linear-gradient(-135deg, rgba(59, 130, 246, 0.08), rgba(139, 92, 246, 0.05));
	padding: 20px 24px;
	border-bottom: 1px solid var(--border-primary);
}

.raditone-lyrics-header-content {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}

.raditone-lyrics-icon {
	width: 52px;
	height: 52px;
	background: linear-gradient(-135deg, #3b82f6, #8b5cf6) !important;
	border-radius: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 8px 20px -8px rgba(59, 130, 246, 0.4);
}

.raditone-lyrics-icon i {
	font-size: 1.5rem;
	color: white;
}

.raditone-lyrics-info {
	flex: 1;
}

.raditone-lyrics-title {
	font-size: 1.1rem;
	font-weight: 800;
	color: var(--text-primary);
	display: flex;
	align-items: baseline;
	gap: 8px;
	flex-wrap: wrap;
}

.raditone-lyrics-artist {
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--text-tertiary);
	background: var(--bg-tertiary);
	padding: 3px 10px;
	border-radius: 30px;
}

.raditone-lyrics-stats {
	font-size: 0.7rem;
	color: var(--text-tertiary);
	margin-top: 6px;
	display: flex;
	align-items: center;
	gap: 5px;
}

.raditone-lyrics-stats i {
	font-size: 0.65rem;
	color: #3b82f6;
}

/* دکمه‌ها */
.raditone-lyrics-buttons {
	display: flex;
	gap: 10px;
}

.raditone-lyrics-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 16px;
	background: transparent;
	border: 1px solid var(--border-primary);
	border-radius: 40px;
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--text-primary);
	cursor: pointer;
	transition: all 0.3s ease;
}

.raditone-lyrics-btn:hover {
	background: linear-gradient(-135deg, #3b82f6, #8b5cf6);
	border-color: transparent;
	color: white;
	transform: translateY(-2px);
}

.raditone-lyrics-btn i {
	font-size: 0.85rem;
}

/* ========== محتوای متن ========== */
.raditone-lyrics-body {
	position: relative;
	max-height: 500px;
	overflow-y: auto;
	padding: 20px 24px;
	scroll-behavior: smooth;
}

/* اسکرول بار سفارشی */
.raditone-lyrics-body::-webkit-scrollbar {
	width: 5px;
}

.raditone-lyrics-body::-webkit-scrollbar-track {
	background: var(--bg-tertiary);
	border-radius: 10px;
}

.raditone-lyrics-body::-webkit-scrollbar-thumb {
	background: linear-gradient(-135deg, #3b82f6, #8b5cf6);
	border-radius: 10px;
}

.raditone-lyrics-content {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

/* خطوط متن */
.raditone-lyric-line {
	display: flex;
	align-items: baseline;
	gap: 12px;
	padding: 6px 0;
	border-radius: 12px;
	transition: all 0.2s ease;
}

.raditone-lyric-line:hover {
	background: rgba(59, 130, 246, 0.04);
	padding-left: 12px;
}

.raditone-line-num {
	width: 36px;
	flex-shrink: 0;
	font-size: 0.7rem;
	font-weight: 600;
	color: var(--text-tertiary);
	font-feature-settings: "tnum";
	opacity: 0.6;
}

.raditone-lyric-line:hover .raditone-line-num {
	opacity: 1;
	color: #3b82f6;
}

.raditone-line-text {
	flex: 1;
	font-size: 0.9rem;
	line-height: 1.7;
	color: var(--text-secondary);
	font-family: var(--font-iranyekan);
	letter-spacing: 0.2px;
}

/* ========== تبلیغات طلایی بین متن (حفظ شده با بهبود) ========== */
.raditone-lyrics-ad {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 15px;
	margin: 20px 0;
	padding: 12px 20px;
	background: linear-gradient(-135deg, 
        rgba(255, 215, 0, 0.08), 
        rgba(255, 165, 0, 0.05),
        rgba(255, 215, 0, 0.08)
    );
	border-radius: 60px;
	border: 1px solid rgba(255, 215, 0, 0.3);
	box-shadow: 0 4px 15px rgba(255, 215, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(4px);
}

.raditone-ad-line {
	flex: 1;
	height: 1px;
	background: linear-gradient(-90deg, transparent, rgba(255, 215, 0, 0.5), transparent);
}

.raditone-ad-text {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 0.75rem;
	font-weight: 600;
	color: #fbbf24;
	text-shadow: 0 0 8px rgba(255, 215, 0, 0.3);
	letter-spacing: 0.5px;
	white-space: nowrap;
	background: linear-gradient(-135deg, #fbbf24, #f59e0b);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.raditone-ad-text i {
	color: #fbbf24;
	font-size: 0.85rem;
	background: none;
	-webkit-background-clip: unset;
	background-clip: unset;
	color: #fbbf24;
}

/* انیمیشن آیکون‌های تبلیغ */
.raditone-ad-text i.fa-headphones {
	animation: raditonePulse 2s infinite;
}

.raditone-ad-text i.fa-music {
	animation: raditonePulse 2s infinite 0.3s;
}

@keyframes raditonePulse {
	0%, 100% {
		opacity: 0.7;
		transform: scale(1);
	}

	50% {
		opacity: 1;
		transform: scale(1.1);
	}
}

/* ========== دکمه اسکرول به بالا ========== */
.raditone-scroll-top {
	position: sticky;
	bottom: 20px;
	right: 100%;
	transform: translateX(50px);
	width: 42px;
	height: 42px;
	background: linear-gradient(-135deg, #3b82f6, #8b5cf6);
	border: none;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s ease;
	box-shadow: 0 6px 15px rgba(59, 130, 246, 0.3);
	z-index: 10;
}

.raditone-scroll-top.show {
	opacity: 1;
	visibility: visible;
	transform: translateX(60px);
}

.raditone-scroll-top:hover {
	transform: translateX(60px) scale(1.08);
}

.raditone-scroll-top i {
	color: white;
	font-size: 1.1rem;
}

/* ========== کریдит ارسال کننده ========== */
.raditone-lyrics-credit {
	padding: 12px 24px;
	background: rgba(59, 130, 246, 0.05);
	border-top: 1px solid var(--border-primary);
	font-size: 0.7rem;
	color: var(--text-tertiary);
	display: flex;
	align-items: center;
	gap: 8px;
}

.raditone-lyrics-credit i {
	color: #10b981;
	font-size: 0.8rem;
}

/* ========== حالت خالی ========== */
.raditone-lyrics-empty {
	background: var(--bg-secondary);
	border-radius: 28px;
	border: 1px solid var(--border-primary);
	text-align: center;
	padding: 50px 30px;
	margin: 30px 0;
}

.raditone-empty-icon {
	width: 80px;
	height: 80px;
	background: linear-gradient(-135deg, rgba(59, 130, 246, 0.1), rgba(139, 92, 246, 0.05));
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 20px;
}

.raditone-empty-icon i {
	font-size: 2.5rem;
	color: #3b82f6;
	opacity: 0.6;
}

.raditone-empty-content h4 {
	margin: 0 0 8px 0;
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--text-primary);
}

.raditone-empty-content p {
	margin: 0 0 20px 0;
	font-size: 0.8rem;
	color: var(--text-tertiary);
}

.raditone-empty-submit {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 24px;
	background: linear-gradient(-135deg, #3b82f6, #8b5cf6) !important;
	border: none;
	border-radius: 40px;
	font-size: 0.8rem;
	font-weight: 500;
	color: white;
	cursor: pointer;
	transition: all 0.3s ease;
}

.raditone-empty-submit:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 20px -8px rgba(59, 130, 246, 0.5);
}

/* ========== ریسپانسیو ========== */
@media (max-width: 768px) {
	.raditone-lyrics-header {
		padding: 16px;
	}

	.raditone-lyrics-header-content {
		flex-direction: column;
		text-align: center;
	}

	.raditone-lyrics-icon {
		width: 44px;
		height: 44px;
	}

	.raditone-lyrics-icon i {
		font-size: 1.2rem;
	}

	.raditone-lyrics-title {
		justify-content: center;
	}

	.raditone-lyrics-buttons {
		width: 100%;
		justify-content: center;
	}

	.raditone-lyrics-body {
		padding: 16px;
	}

	.raditone-line-num {
		width: 30px;
		font-size: 0.65rem;
	}

	.raditone-line-text {
		font-size: 0.85rem;
	}

	.raditone-lyrics-ad {
		padding: 8px 12px;
		margin: 15px 0;
	}

	.raditone-ad-text {
		font-size: 0.65rem;
		white-space: normal;
		text-align: center;
		gap: 6px;
	}

	.raditone-ad-line {
		display: none;
	}

	.raditone-scroll-top {
		width: 38px;
		height: 38px;
	}

	.raditone-scroll-top.show {
		transform: translateX(45px);
	}

	.raditone-scroll-top:hover {
		transform: translateX(45px) scale(1.05);
	}
}

@media (max-width: 480px) {
	.raditone-lyrics-title {
		font-size: 0.95rem;
	}

	.raditone-line-text {
		font-size: 0.8rem;
		line-height: 1.6;
	}

	.raditone-lyrics-btn span {
		display: none;
	}

	.raditone-lyrics-btn {
		padding: 8px 12px;
	}
}

/*------------------------------- Single Desktop Style -------------------------------*/

.premium-music-page {
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
}

.premium-main {
	width: 100%;
	margin: 0 auto;
	padding: 0 40px;
}

@media (max-width: 768px) {
	.premium-main {
		padding: 0 20px;
	}
}

/* هیرو */
.premium-hero {
	padding: 40px 0 48px;
}

.hero-container {
	display: flex;
	gap: 40px;
	align-items: flex-end;
}

@media (max-width: 768px) {
	.hero-container {
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
}

/* کاور */
.hero-cover {
	flex-shrink: 0;
	width: 300px;
}

@media (max-width: 768px) {
	.hero-cover {
		width: 300px;
	}
}

.cover-frame {
	position: relative;
	aspect-ratio: 1;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: var(--shadow-xl, 0 20px 25px -12px rgba(0,0,0,0.15));
}

.cover-frame img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.cover-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.3);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.3s;
}

.cover-frame:hover .cover-overlay {
	opacity: 1;
}

.overlay-play {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--primary, #3b5bdb);
	border: none;
	color: white;
	font-size: 1.3rem;
	cursor: pointer;
	transition: all 0.2s;
	display: flex;
	align-items: center;
	justify-content: center;
}

.overlay-play:hover {
	transform: scale(1.1);
	background: var(--primary-hover, #2563eb);
}

/* اطلاعات */
.hero-info {
	flex: 1;
}

.info-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: var(--primary-light, rgba(59,130,246,0.15));
	padding: 5px 12px;
	border-radius: 50px;
	font-size: 0.7rem;
	color: var(--primary, #3b5bdb);
	margin-bottom: 16px;
}

.info-title {
	font-size: 2.5rem;
	font-weight: 800;
	margin: 0 0 12px;
	line-height: 1.2;
	color: var(--text-primary, #0f172a);
}

@media (max-width: 768px) {
	.info-title {
		font-size: 1.8rem;
	}

	main {
		margin-top: 5px;
	}
}

.info-artist {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
	color: var(--text-tertiary, #64748b);
}

.info-artist a {
	color: var(--accent, #8b5cf6);
	text-decoration: none;
	font-weight: 500;
}

.info-artist a:hover {
	color: var(--primary, #3b5bdb);
}

.info-stats {
	display: flex;
	gap: 20px;
	margin-bottom: 20px;
	font-size: 0.8rem;
	color: var(--text-tertiary, #64748b);
}

.info-stats i {
	margin-right: 6px;
}

/* دکمه‌های اکشن */
.info-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
}

.action-primary {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 28px;
	background: var(--primary, #3b5bdb);
	border: none;
	border-radius: 40px;
	color: white;
	font-size: 0.85rem;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.2s;
}

.action-primary:hover {
	background: var(--primary-hover, #2563eb);
	transform: scale(1.02);
}

.action-fav {
	display: flex;
	align-items: center;
}

.action-fav .rt-fav-btn {
	display: flex;
	align-items: center;
	padding: 0 10px;
	height: 42px;
	background: var(--glass, rgba(0,0,0,0.03));
	border: 1px solid var(--glass-border, rgba(0,0,0,0.08));
	border-radius: 40px;
	color: var(--text-secondary, #334155);
	cursor: pointer;
	transition: background-color 0.2s, border-color 0.2s, color 0.2s, transform 0.2s;
	font-size: 0.8rem;
	text-decoration: none;
}

.action-fav .rt-fav-btn:hover {
	background: var(--primary-light, rgba(59,130,246,0.15));
	border-color: var(--primary, #3b5bdb);
	color: var(--primary, #3b5bdb);
	transform: translateY(-2px);
}

.action-secondary {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 0 18px;
	height: 42px;
	background: var(--glass, rgba(0,0,0,0.03));
	border: 1px solid var(--glass-border, rgba(0,0,0,0.08));
	border-radius: 40px;
	color: var(--text-secondary, #334155);
	cursor: pointer;
	transition: background-color 0.2s, border-color 0.2s, color 0.2s, transform 0.2s;
	font-size: 0.8rem;
	text-decoration: none;
	background-color: transparent;
}

.action-secondary:hover {
	background: var(--primary-light, rgba(59,130,246,0.15));
	border-color: var(--primary, #3b5bdb);
	color: var(--primary, #3b5bdb);
	transform: translateY(-2px);
}

/* ===== دکمه‌های اکشن - چیدمان رسپانسیو ===== */
.info-actions {
	gap: 10px;
}
.info-actions .action-primary,
.info-actions .action-secondary,
.info-actions .action-fav .rt-fav-btn {
	min-height: 40px;
}
.info-actions .action-primary {
	padding: 10px 22px;
}
.action-fav .rt-fav-btn,
.info-actions .action-secondary {
	height: 42px;
}
@media (max-width: 1024px) {
	.info-actions {
		gap: 10px;
	}
	.info-actions .action-primary {
		padding: 10px 18px;
	}
}
@media (max-width: 640px) {
	.info-actions {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
		width: 100%;
		justify-content: stretch;
	}
	.info-actions .action-primary {
		grid-column: span 2;
		justify-content: center;
		width: 100%;
	}
	.info-actions .action-secondary,
	.info-actions .action-fav,
	.info-actions .action-fav .rt-fav-btn,
	.info-actions .raditone-playlist-button,
	.info-actions .report-simple-btn {
		width: 100%;
		justify-content: center;
	}
	.info-actions .action-secondary {
		padding: 0 10px;
		font-size: 0.78rem;
	}
}

/* ===== مودال اشتراک‌گذاری سفارشی ===== */
.rd-share-overlay {
	position: fixed;
	inset: 0;
	z-index: 100000;
	background: rgba(10, 16, 32, 0.6);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	animation: rdShareFade .25s ease;
}
.rd-share-dialog {
	width: 100%;
	max-width: 440px;
	background: #ffffff;
	border-radius: 22px;
	overflow: hidden;
	box-shadow: 0 24px 70px rgba(0, 0, 0, 0.35);
	animation: rdShareUp .35s cubic-bezier(.2, .8, .2, 1);
	color: #0f172a;
}
.rd-share-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px 22px;
	border-bottom: 1px solid rgba(15, 23, 42, .08);
	background: linear-gradient(-135deg, #f1f5f9, #e2e8f0);
}
.rd-share-title {
	display: flex;
	align-items: center;
	gap: 10px;
	font-weight: 700;
	font-size: 1rem;
	color: #0f172a;
}
.rd-share-title svg {
	color: var(--primary, #3b5bdb);
}
.rd-share-close {
	width: 36px;
	height: 36px;
	border: none;
	border-radius: 50%;
	background: rgba(15, 23, 42, .06);
	color: #0f172a;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all .2s;
	padding: 0;
}
.rd-share-close:hover {
	background: rgba(15, 23, 42, .14);
	transform: rotate(-90deg);
}
.rd-share-body {
	padding: 22px;
}
.rd-share-thumb {
	position: relative;
	height: 150px;
	border-radius: 14px;
	overflow: hidden;
	margin-bottom: 14px;
	background: linear-gradient(-135deg, #3b5bdb, #8b5cf6);
}
.rd-share-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: .92;
}
.rd-share-thumb:empty {
	display: none;
}
.rd-share-msg {
	font-weight: 700;
	font-size: .95rem;
	color: #0f172a;
	margin-bottom: 6px;
	text-align: center;
	line-height: 1.6;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.rd-share-text {
	color: #64748b;
	font-size: .72rem;
	text-align: center;
	margin-bottom: 16px;
	direction: ltr;
	word-break: break-all;
}
.rd-share-target {
	display: flex;
	gap: 8px;
	margin-bottom: 18px;
}
.rd-share-target input {
	flex: 1;
	border: 1px solid rgba(15, 23, 42, .14);
	border-radius: 10px;
	padding: 10px 12px;
	font-size: .78rem;
	direction: ltr;
	text-align: right;
	color: #0f172a;
	background: #f8fafc;
	outline: none;
	min-width: 0;
}
.rd-share-target input:focus {
	border-color: var(--primary, #3b5bdb);
	background: #fff;
}
.rd-share-copy {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	border: none;
	border-radius: 10px;
	padding: 0 16px;
	background: var(--primary, #3b5bdb);
	color: #fff;
	font-size: .78rem;
	font-weight: 600;
	cursor: pointer;
	white-space: nowrap;
	transition: all .2s;
}
.rd-share-copy:hover {
	background: var(--primary-hover, #2563eb);
}
.rd-share-social {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 10px;
	margin-bottom: 16px;
}
.rd-share-soc {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	border: 1px solid rgba(15, 23, 42, .1);
	border-radius: 14px;
	padding: 12px 4px;
	background: #fff;
	color: #0f172a;
	cursor: pointer;
	transition: all .2s;
	font-size: .68rem;
	font-weight: 600;
}
.rd-share-soc:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, .12);
	border-color: transparent;
	color: #fff;
}
.rd-share-soc svg {
	width: 24px;
	height: 24px;
}
.rd-soc-whatsapp:hover { background: #25d366; }
.rd-soc-telegram:hover { background: #229ed9; }
.rd-soc-twitter:hover { background: #0f1419; }
.rd-soc-facebook:hover { background: #1877f2; }
.rd-soc-linkedin:hover { background: #0a66c2; }
.rd-share-native {
	width: 100%;
}
.rd-share-native-btn {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	border: 1px dashed rgba(15, 23, 42, .2);
	border-radius: 12px;
	padding: 12px;
	background: #f8fafc;
	color: #0f172a;
	font-size: .8rem;
	font-weight: 600;
	cursor: pointer;
	transition: all .2s;
}
.rd-share-native-btn:hover {
	background: var(--primary-light, rgba(59,130,246,0.12));
	border-color: var(--primary, #3b5bdb);
	color: var(--primary, #3b5bdb);
}
@media (max-width: 420px) {
	.rd-share-social {
		grid-template-columns: repeat(3, 1fr);
	}
}
@keyframes rdShareFade {
	from { opacity: 0; }
	to { opacity: 1; }
}
@keyframes rdShareUp {
	from { opacity: 0; transform: scale(.92) translateY(18px); }
	to { opacity: 1; transform: scale(1) translateY(0); }
}
@media (prefers-color-scheme: dark) {
	.rd-share-dialog {
		background: #1e293b;
		color: #e2e8f0;
	}
	.rd-share-head {
		background: linear-gradient(-135deg, #16213e, #1e293b);
		border-bottom-color: rgba(255,255,255,.08);
	}
	.rd-share-title { color: #e2e8f0; }
	.rd-share-close { background: rgba(255,255,255,.08); color: #e2e8f0; }
	.rd-share-close:hover { background: rgba(255,255,255,.16); }
	.rd-share-thumb { background: linear-gradient(-135deg, #3b5bdb, #8b5cf6); }
	.rd-share-msg { color: #e2e8f0; }
	.rd-share-text { color: #94a3b8; }
	.rd-share-target input { background: #0f172a; border-color: rgba(255,255,255,.12); color: #e2e8f0; }
	.rd-share-soc { background: #16213e; border-color: rgba(255,255,255,.1); color: #e2e8f0; }
	.rd-share-native-btn { background: #0f172a; border-color: rgba(255,255,255,.16); color: #e2e8f0; }
	.rd-share-native-btn:hover { background: var(--primary-light, rgba(59,130,246,.18)); }
}


/* تب‌بندی */
.premium-tabs-wrapper {
	border-bottom: 1px solid var(--border-primary, #e2e8f0);
	margin-top: 20px;
}

.tabs-container {
	display: flex;
	gap: 28px;
	flex-wrap: wrap;
}

.rt-vote-btn {
	width: 120px;
	height: 50px;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

@media (max-width: 768px) {
	.tabs-container {
		gap: 16px;
		overflow-x: auto;
		flex-wrap: nowrap;
		justify-content: space-around;
	}

	.tab-btn i {
		font-size: 1rem;
	}

	.tab-btn {
		flex-direction: column;
	}

	.info-vote {
		position: relative !important;
		right: 0 !important;
	}

	.rt-vote-btn {
		width: 120px;
		height: 50px;
		border-radius: 10px;
	}

	.info-artist {
		justify-content: center;
	}

	.info-stats span {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		gap: 16px;
		border-radius: 15px;
		border: 1px solid var(--border-secondary);
		padding: 8px;
		width: 100%;
	}

	.info-stats {
		gap: 8px;
		justify-content: center;
	}

	.info-stats span i {
		font-size: 25px;
	}

	.info-actions {
		justify-content: center;
	}
}

button.raditone-action-btn.raditone-play-all, button.raditone-play-btn-mobile {
	background: var(--primary);
	color: #fff;
}

button.raditone-play-btn-mobile {
	BORDER-RADIUS: 25px;
	padding: 8px;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 64px;
}

.raditone-track-card {
	padding: 12px;
	position: relative;
 /* برای قرارگیری شبه‌عنصر */
	border-left: none;
  /* حذف border اصلی */;
}

.raditone-track-card::after {
	content: '';
	position: absolute;
	left: 0;
	top: 10%;
          /* از ۱۰٪ ارتفاع شروع کن */
	height: 80%;
       /* ارتفاع ۸۰٪ */
	width: 3px;
        /* ضخامت خط */
	background-color: var(--primary);
 /* رنگ مانند border */
	border-radius: 2px;
 /* اختیاری برای گرد کردن لبه‌ها */;
}

.tab-btn {
	background: none;
	border: none;
	color: var(--text-tertiary, #64748b);
	font-size: 0.85rem;
	font-weight: 600;
	padding: 12px 0;
	cursor: pointer;
	transition: all 0.2s;
	display: flex;
	align-items: center;
	gap: 8px;
	position: relative;
	white-space: nowrap;
}

.tab-btn:hover {
	color: var(--text-primary, #0f172a);
}

.tab-btn.active {
	color: var(--primary, #3b5bdb);
}

.tab-btn.active::after {
	content: '';
	position: absolute;
	bottom: -1px;
	left: 0;
	right: 0;
	height: 2px;
	background: var(--primary, #3b5bdb);
	border-radius: 2px;
}

/* محتوا */
.premium-contents {
	padding: 32px 0;
}

.content-panel {
	display: none;
	animation: fadeIn 0.3s;
}

.content-panel.active {
	display: block;
}

@keyframes fadeIn {
	from {
		opacity: 0;
		transform: translateY(10px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.panel-inner {
	background: var(--glass, rgba(0,0,0,0.03));
	border: 1px solid var(--glass-border, rgba(0,0,0,0.08));
	border-radius: 20px;
	padding: 28px;
}

@media (max-width: 768px) {
	.panel-inner {
		padding: 20px;
	}
}

.lyrics-panel {
	line-height: 1.8;
	text-align: center;
	font-family: var(--font-iranyekan);
}

.empty-panel {
	text-align: center;
	padding: 50px 20px;
	color: var(--text-tertiary, #64748b);
}

.empty-panel i {
	font-size: 2.5rem;
	margin-bottom: 12px;
	opacity: 0.5;
}

.comments-panel {
	background: transparent;
	border: none;
	padding: 0;
}

.comments-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 24px;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--border-primary, #e2e8f0);
}

.comments-header h3 {
	margin: 0;
	font-size: 1rem;
}

.album-tracks-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.album-track-item {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 12px;
	border-radius: 12px;
	transition: all 0.2s;
	background: var(--glass, rgba(0,0,0,0.02));
	border-bottom: 1px solid var(--glass-border, rgba(0,0,0,0.05));
}

.album-track-item:hover {
	background: var(--primary-light, rgba(59,130,246,0.08));
	transform: translateX(4px);
}

.track-cover {
	position: relative;
	width: 50px;
	height: 50px;
	border-radius: 8px;
	overflow: hidden;
	flex-shrink: 0;
}

.track-cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.track-play {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.5);
	border: none;
	color: white;
	cursor: pointer;
	opacity: 0;
	transition: opacity 0.2s;
	display: flex;
	align-items: center;
	justify-content: center;
}

.track-cover:hover .track-play {
	opacity: 1;
}

.track-info {
	flex: 1;
}

.track-info h4 {
	margin: 0 0 4px;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--text-primary, #0f172a);
}

.track-info p {
	margin: 0;
	font-size: 0.7rem;
	color: var(--text-tertiary, #64748b);
}

.track-duration {
	font-size: 0.75rem;
	color: var(--text-tertiary, #64748b);
	font-family: var(--font-iranyekan);
}

.track-actions {
	display: flex;
	gap: 8px;
}

.track-fav {
	background: none;
	border: none;
	color: var(--text-tertiary, #64748b);
	cursor: pointer;
	transition: all 0.2s;
	font-size: 1rem;
}

.track-fav:hover {
	color: var(--danger, #ef4444);
}

/* اسلایدر */
.premium-section {
	margin-top: 48px;
	padding-bottom: 48px;
}

.section-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
}

.section-header h2 {
	font-size: 1.2rem;
	font-weight: 700;
	margin: 0;
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--text-primary, #0f172a);
}

.section-more {
	color: var(--text-tertiary, #64748b);
	text-decoration: none;
	font-size: 0.75rem;
	transition: color 0.2s;
}

.section-more:hover {
	color: var(--primary, #3b5bdb);
}

.section-slider {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	overflow: overlay;
}

.slider-track {
	display: flex;
	transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
	will-change: transform;
	gap: 10px;
}

.slider-track::-webkit-scrollbar {
	display: none;
}

.slider-arrow {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--glass, rgba(0,0,0,0.03));
	backdrop-filter: blur(8px);
	border: 1px solid var(--glass-border, rgba(0,0,0,0.08));
	color: var(--text-primary, #0f172a);
	cursor: pointer;
	transition: all 0.2s;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.slider-arrow:hover {
	background: var(--primary, #3b5bdb);
	border-color: var(--primary, #3b5bdb);
	color: white;
}

.track-card {
	flex-shrink: 0;
	width: 170px;
	transition: all 0.3s;
}

.track-card:hover {
	transform: translateY(-6px);
}

.track-card a {
	text-decoration: none;
	display: block;
}

.card-image {
	position: relative;
	aspect-ratio: 1;
	border-radius: 12px;
	overflow: hidden;
	margin-bottom: 10px;
}

.card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s;
}

.track-card:hover .card-image img {
	transform: scale(1.05);
}

.card-play {
	position: absolute;
	bottom: 10px;
	left: 10px;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--primary, #3b5bdb);
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	opacity: 0;
	transform: translateY(8px);
	transition: all 0.2s;
}

.track-card:hover .card-play {
	opacity: 1;
	transform: translateY(0);
}

.card-info h4 {
	margin: 0 0 4px;
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--text-primary, #0f172a);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.card-info p {
	margin: 0;
	font-size: 0.65rem;
	color: var(--text-tertiary, #64748b);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* استایل‌های اسلایدر */
.section-slider {
	position: relative;
	display: flex;
	align-items: center;
	gap: 10px;
}

.slider-track::-webkit-scrollbar {
	height: 5px;
}

.slider-track::-webkit-scrollbar-track {
	background: #f1f1f1;
	border-radius: 10px;
}

.slider-track::-webkit-scrollbar-thumb {
	background: #888;
	border-radius: 10px;
}

.slider-arrow {
	background: var(--primary, #3b5bdb);
	border: none;
	width: 35px;
	height: 35px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.3s ease;
	z-index: 10;
}

.slider-arrow svg {
	stroke: #fff;
}

.slider-arrow:hover {
	background: var(--primary-dark, #2c4cd4);
	transform: scale(1.05);
}

.slider-arrow i {
	color: white;
	font-size: 14px;
}

.track-card {
	flex: 0 0 auto;
	width: 160px;
	transition: transform 0.3s ease;
}

.track-card:hover {
	transform: translateY(-5px);
}

.card-image {
	position: relative;
	border-radius: 12px;
	overflow: hidden;
	aspect-ratio: 1;
}

.card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.card-play {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.track-card:hover .card-play {
	opacity: 1;
}

.card-play i {
	color: white;
	font-size: 30px;
}

.card-info {
	padding: 10px 5px;
	text-align: center;
}

.card-info h4 {
	font-size: 14px;
	margin: 0 0 5px 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.card-info p {
	font-size: 12px;
	margin: 0;
	color: #666;
}

.section-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
}

.section-more {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	background: var(--primary, #3b5bdb);
	color: white;
	padding: 8px 16px;
	border-radius: 20px;
	text-decoration: none;
	font-size: 13px;
	transition: all 0.3s ease;
}

.section-more:hover {
	background: var(--primary-dark, #2c4cd4);
	transform: translateX(3px);
}

.hiddenclass {
	display: none !important;
}


/*------------------------------- Player Style -------------------------------*/


/*------------------------------- Modal Video Player Style -------------------------------*/
/* مودال ویدیو */
.video-modal {
	display: none;
	position: fixed;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	z-index: 999999;
	align-items: center;
	justify-content: center;
	animation: modalFadeIn 0.3s ease;
}

@keyframes modalFadeIn {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@keyframes modalFadeOut {
	from {
		opacity: 1;
	}

	to {
		opacity: 0;
	}
}

.video-modal-overlay {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.95);
	backdrop-filter: blur(10px);
}

.video-modal-container {
	position: relative;
	width: 90%;
	max-width: 1200px;
	max-height: 90vh;
	background: #000;
	border-radius: 16px;
	overflow: hidden;
	z-index: 2;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

.video-modal-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 15px 20px;
	background: rgba(0, 0, 0, 0.8);
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.video-modal-title {
	margin: 0;
	font-size: 16px;
	color: white;
	display: flex;
	align-items: center;
	gap: 10px;
}

.video-modal-close {
	background: none;
	border: none;
	color: white;
	font-size: 20px;
	cursor: pointer;
	padding: 5px;
	transition: all 0.3s ease;
}

.video-modal-close:hover {
	transform: rotate(-90deg);
	color: var(--primary, #e94560);
}

.video-modal-body {
	padding: 20px;
	max-height: calc(90vh - 60px);
	overflow-y: auto;
}

.video-loading,
.video-error {
	text-align: center;
	padding: 60px 20px;
	color: white;
}

.video-loading i,
.video-error i {
	font-size: 48px;
	margin-bottom: 15px;
	display: block;
}

.video-error button {
	margin-top: 15px;
	padding: 8px 20px;
	background: var(--primary, #e94560);
	border: none;
	border-radius: 25px;
	color: white;
	cursor: pointer;
}

/* ریسپانسیو */
@media (max-width: 768px) {
	.video-modal-container {
		width: 95%;
		max-height: 95vh;
	}

	.video-modal-header {
		padding: 10px 15px;
	}

	.video-modal-body {
		padding: 10px;
	}
}

/* دکمه پخش ویدیو */
.rt-mobile-single-page__video-section {
	padding: 0 16px;
}

.rt-mobile-single-page__video-btn {
	position: relative;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 10px 20px;
	background: linear-gradient(-135deg, #8b5cf6, #6d28d9);
	border: none;
	border-radius: 60px;
	color: white;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	overflow: hidden;
	transition: all 0.3s ease;
	box-shadow: 0 4px 15px rgba(139, 92, 246, 0.3);
}

.rt-mobile-single-page__video-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(139, 92, 246, 0.4);
}

.rt-mobile-single-page__video-btn:active {
	transform: translateY(0);
}

.rt-mobile-single-page__video-ripple {
	position: absolute;
	top: 50%;
	right: 50%;
	width: 0;
	height: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.3);
	transform: translate(50%, -50%);
	transition: width 0.6s, height 0.6s;
}

.rt-mobile-single-page__video-btn:active .rt-mobile-single-page__video-ripple {
	width: 300px;
	height: 300px;
}

.rt-mobile-single-page__video-btn i {
	font-size: 18px;
}

.rt-mobile-single-page__video-quality-badge {
	position: absolute;
	right: 16px;
	top: 50%;
	transform: translateY(-50%);
	background: rgba(0, 0, 0, 0.3);
	padding: 4px 10px;
	border-radius: 30px;
	font-size: 11px;
	font-weight: 500;
	backdrop-filter: blur(4px);
}

.raditone-video-info-content {
	display: flex !important;
	gap: 12px;
	align-items: center;
	align-content: center;
}

/* ریسپانسیو موبایل */
@media (max-width: 768px) {
	.rt-mobile-single-page__video-btn {
		padding: 12px 16px;
		font-size: 14px;
	}

	.rt-mobile-single-page__video-section {
		margin-top: 12px;
	}

	.rt-mobile-single-page__video-quality-badge {
		position: static;
		transform: none;
		margin-left: auto;
	}
}
/*------------------------------- َArchive Style -------------------------------*/
/* ============================================================
   گالری سبک‌های موسیقی - نسخه ۶ ستونه
   کاملاً ریسپانسیو و راست‌چین
   ============================================================ */

/* ---------- جهت راست‌چین ---------- */
.music-gallery {
	direction: ltr;
	text-align: left;
	background: var(--bg-primary);
	min-height: 100vh;
}

/* ---------- هدر کارت ---------- */
.gallery-hero {
	position: relative;
	padding: 28px 24px 32px;
	background: var(--bg-secondary);
	border-radius: 20px;
	border: 1px solid var(--border-primary);
	box-shadow: var(--shadow-sm);
	margin-top: 20px;
	transition: box-shadow 0.3s ease;
}

.gallery-hero:hover {
	box-shadow: var(--shadow-md);
}

.hero-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 4px 18px 4px 16px;
	background: var(--primary-light);
	border-radius: 100px;
	font-size: 0.7rem;
	font-weight: 600;
	color: var(--primary);
	letter-spacing: 0.3px;
	margin-bottom: 12px;
}

.hero-badge svg {
	width: 16px;
	height: 16px;
	stroke: var(--primary);
}

.hero-title {
	font-size: 2rem;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 4px;
	letter-spacing: -0.3px;
}

.hero-title span {
	background: var(--primary-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.hero-sub {
	font-size: 0.9rem;
	color: var(--text-tertiary);
	margin-bottom: 0;
}

/* ---------- آمار ---------- */
.hero-stats {
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
	margin-top: 18px;
}

.stat-item {
	display: flex;
	align-items: center;
	gap: 10px;
}

.stat-item svg {
	width: 20px;
	height: 20px;
	stroke: var(--text-tertiary);
	flex-shrink: 0;
}

.stat-number {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--text-primary);
	line-height: 1.2;
}

.stat-label {
	font-size: 0.65rem;
	color: var(--text-tertiary);
	margin-left: 2px;
}

.stat-divider {
	width: 1px;
	height: 28px;
	background: var(--border-primary);
}

/* ---------- نوار جستجو (sticky) ---------- */
.gallery-search-bar {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--bg-primary);
	border-bottom: 1px solid var(--border-primary);
	padding: 14px 0;
	backdrop-filter: blur(6px);
	background: var(bg-primary);
}

.search-wrapper {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	align-items: center;
}

.search-group {
	flex: 1;
	min-width: 200px;
	position: relative;
}

.search-group .search-icon {
	position: absolute;
	right: 16px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--text-tertiary);
	width: 18px;
	height: 18px;
	stroke: currentColor;
	pointer-events: none;
}

.search-input-modern {
	width: 100%;
	padding: 10px 44px 10px 18px;
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	border-radius: 40px;
	color: var(--text-primary);
	font-size: 0.8rem;
	transition: all 0.25s ease;
}

.search-input-modern:focus {
	outline: none;
	border-color: var(--primary);
	box-shadow: 0 0 0 3px var(--primary-light);
}

.clear-search-btn {
	position: absolute;
	right: 44px;
	top: 50%;
	transform: translateY(-50%);
	background: none;
	border: none;
	color: var(--text-tertiary);
	cursor: pointer;
	padding: 4px;
	display: none;
	transition: color 0.2s;
}

.clear-search-btn:hover {
	color: var(--danger);
}

.clear-search-btn svg {
	width: 18px;
	height: 18px;
	stroke: currentColor;
}

.clear-search-btn.visible {
	display: block;
}

.sort-group {
	position: relative;
	min-width: 170px;
}

.sort-group .sort-icon {
	position: absolute;
	left: 16px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--text-tertiary);
	width: 18px;
	height: 18px;
	stroke: currentColor;
	pointer-events: none;
}

.sort-select-modern {
	width: 100%;
	padding: 10px 16px 10px 40px;
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	border-radius: 40px;
	color: var(--text-primary);
	font-size: 0.8rem;
	appearance: none;
	cursor: pointer;
	transition: all 0.25s ease;
}

.sort-select-modern:focus {
	outline: none;
	border-color: var(--primary);
}

/* ---------- گرید کارت‌ها ---------- */
.gallery-grid {
	padding: 32px 0 48px;
}

.results-info {
	text-align: center;
	margin-bottom: 24px;
	font-size: 0.75rem;
	color: var(--text-tertiary);
}

.results-info strong {
	color: var(--text-primary);
	font-weight: 600;
}

/* ============================================================
   گرید ۶ ستونی در دسکتاپ - ریسپانسیو کامل
   ============================================================ */
.grid-modern {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;
}

/* ---------- کارت حرفه‌ای ---------- */
.genre-card {
	position: relative;
	background: var(--bg-secondary);
	border-radius: 16px;
	overflow: hidden;
	border: 1px solid var(--border-primary);
	transition: all 0.3s cubic-bezier(0.2, 0.9, 0.4, 1);
	cursor: pointer;
	box-shadow: 0 1px 2px rgba(0,0,0,0.02);
}

.genre-card:hover {
	transform: translateY(-6px);
	border-color: var(--primary);
	box-shadow: var(--shadow-lg);
}

/* تصویر */
.genre-card-media {
	position: relative;
	aspect-ratio: 16/10;
	overflow: hidden;
	background: var(--bg-tertiary);
}

.genre-card-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.genre-card:hover .genre-card-img {
	transform: scale(1.05);
}

.genre-card-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background: var(--primary-light);
}

.genre-card-placeholder svg {
	width: 44px;
	height: 44px;
	stroke: var(--primary);
	opacity: 0.4;
}

/* اوورلی پلی */
.genre-card-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,0.2);
	backdrop-filter: blur(2px);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.35s ease;
}

.genre-card:hover .genre-card-overlay {
	opacity: 1;
}

.play-circle {
	width: 48px;
	height: 48px;
	background: var(--primary-gradient);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transform: scale(0.8);
	transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
	box-shadow: var(--shadow-md);
}

.play-circle svg {
	width: 22px;
	height: 22px;
	fill: #fff;
	margin-left: 2px;
}

.genre-card:hover .play-circle {
	transform: scale(1);
}

/* بج تعداد */
.count-badge {
	position: absolute;
	top: 12px;
	right: 12px;
	background: rgba(0,0,0,0.55);
	backdrop-filter: blur(4px);
	padding: 3px 12px 3px 10px;
	border-radius: 30px;
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 0.6rem;
	font-weight: 600;
	color: #fff;
	z-index: 2;
	direction: ltr;
}

.count-badge svg {
	width: 12px;
	height: 12px;
	stroke: var(--gold);
}

/* محتوای کارت */
.genre-card-content {
	padding: 14px 16px 12px;
}

.genre-title {
	margin: 0 0 4px 0;
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--text-primary);
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.genre-title .title-arrow {
	width: 14px;
	height: 14px;
	stroke: var(--primary);
	opacity: 0;
	transform: translateX(-6px);
	transition: all 0.3s ease;
}

.genre-card:hover .title-arrow {
	opacity: 1;
	transform: translateX(0);
}

.genre-desc {
	font-size: 0.7rem;
	color: var(--text-tertiary);
	line-height: 1.5;
	margin-bottom: 10px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 1.2em;
}

/* فوتر کارت */
.genre-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: 10px;
	border-top: 1px solid var(--border-primary);
}

.genre-artists {
	display: flex;
	align-items: center;
	gap: 8px;
}

.artist-icon {
	width: 26px;
	height: 26px;
	background: var(--primary-light);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.artist-icon svg {
	width: 12px;
	height: 12px;
	stroke: var(--primary);
}

.artist-info {
	display: flex;
	flex-direction: column;
	line-height: 1.2;
}

.artist-count {
	font-size: 0.75rem;
	font-weight: 700;
	color: var(--text-primary);
}

.artist-label {
	font-size: 0.55rem;
	color: var(--text-tertiary);
	text-transform: uppercase;
	letter-spacing: 0.3px;
}

.genre-link {
	font-size: 0.65rem;
	color: var(--primary);
	text-decoration: none;
	display: flex;
	align-items: center;
	gap: 4px;
	opacity: 0;
	transform: translateX(-6px);
	transition: all 0.3s ease;
	font-weight: 500;
}

.genre-link svg {
	width: 12px;
	height: 12px;
	stroke: currentColor;
}

.genre-card:hover .genre-link {
	opacity: 1;
	transform: translateX(0);
}

/* خط زیرین */
.genre-card-line {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 2.5px;
	background: var(--primary-gradient);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.4s ease;
}

.genre-card:hover .genre-card-line {
	transform: scaleX(1);
}

/* ---------- دکمه بارگذاری بیشتر ---------- */
.load-more-modern {
	text-align: center;
	margin-top: 36px;
}

.load-more-btn-modern {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 32px;
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 40px;
	color: var(--text-secondary);
	font-size: 0.8rem;
	font-weight: 500;
	cursor: pointer;
	transition: all 0.3s ease;
}

.load-more-btn-modern svg {
	width: 18px;
	height: 18px;
	stroke: currentColor;
}

.load-more-btn-modern:hover {
	background: var(--primary);
	border-color: var(--primary);
	color: #fff;
	transform: translateY(-2px);
	box-shadow: var(--shadow-primary);
}

.load-more-btn-modern:hover svg {
	stroke: #fff;
}

/* ---------- حالت خالی ---------- */
.empty-modern {
	text-align: center;
	padding: 60px 20px;
	grid-column: 1 / -1;
}

.empty-icon {
	width: 80px;
	height: 80px;
	margin: 0 auto 16px;
	background: var(--primary-light);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.empty-icon svg {
	width: 44px;
	height: 44px;
	stroke: var(--primary);
}

.empty-title {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 4px;
}

.empty-text {
	font-size: 0.85rem;
	color: var(--text-tertiary);
	margin-bottom: 20px;
}

/* ---------- لودینگ ---------- */
.loading-modern {
	text-align: center;
	padding: 40px 20px;
	grid-column: 1 / -1;
}

.loading-spinner-modern {
	width: 36px;
	height: 36px;
	margin: 0 auto 12px;
	border: 2.5px solid var(--border-primary);
	border-top-color: var(--primary);
	border-radius: 50%;
	animation: spin 0.7s linear infinite;
}

@keyframes spin {
	to {
		transform: rotate(-360deg);
	}
}

/* ---------- انیمیشن ورود ---------- */
@keyframes fadeUp {
	from {
		opacity: 0;
		transform: translateY(14px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.genre-card {
	animation: fadeUp 0.4s ease forwards;
	opacity: 0;
}

/* ============================================================
   ریسپانسیو کامل - ۶ → ۴ → ۳ → ۲ → ۱
   ============================================================ */

/* تبلت بزرگ (تا 1400px) - ۴ ستون */
@media (max-width: 1400px) {
	.grid-modern {
		grid-template-columns: repeat(4, 1fr);
		gap: 18px;
	}
}

/* تبلت متوسط (تا 1024px) - ۳ ستون */
@media (max-width: 1024px) {
	.grid-modern {
		grid-template-columns: repeat(3, 1fr);
		gap: 16px;
	}
}

/* تبلت کوچک / موبایل بزرگ (تا 768px) - ۲ ستون */
@media (max-width: 768px) {
	.grid-modern {
		grid-template-columns: repeat(2, 1fr);
		gap: 14px;
	}

	.gallery-hero {
		padding: 20px 16px 24px;
		margin-top: 14px;
		border-radius: 16px;
	}

	.hero-title {
		font-size: 1.7rem;
	}

	.hero-stats {
		gap: 14px;
		margin-top: 14px;
	}

	.stat-number {
		font-size: 1.1rem;
	}

	.stat-item svg {
		width: 18px;
		height: 18px;
	}

	.stat-divider {
		height: 24px;
	}
}

/* موبایل (تا 576px) - ۲ ستون (کمتر) */
@media (max-width: 576px) {
	.grid-modern {
		grid-template-columns: repeat(2, 1fr);
		gap: 12px;
	}

	.gallery-hero {
		padding: 16px 12px 20px;
		border-radius: 14px;
	}

	.hero-title {
		font-size: 1.4rem;
	}

	.hero-sub {
		font-size: 0.8rem;
	}

	.hero-stats {
		gap: 10px;
		margin-top: 12px;
	}

	.stat-item {
		gap: 6px;
	}

	.stat-item svg {
		width: 16px;
		height: 16px;
	}

	.stat-number {
		font-size: 0.95rem;
	}

	.stat-label {
		font-size: 0.6rem;
	}

	.stat-divider {
		height: 20px;
	}

	.search-wrapper {
		flex-direction: column;
		gap: 10px;
	}

	.search-group,
    .sort-group {
		width: 100%;
		min-width: unset;
	}

	.gallery-search-bar {
		padding: 12px 0;
	}

	.genre-card-media {
		aspect-ratio: 16/10;
	}

	.genre-card-content {
		padding: 12px 14px 10px;
	}

	.genre-title {
		font-size: 0.85rem;
	}

	.genre-desc {
		font-size: 0.65rem;
	}

	.count-badge {
		top: 8px;
		right: 8px;
		padding: 2px 10px 2px 8px;
		font-size: 0.55rem;
	}

	.play-circle {
		width: 40px;
		height: 40px;
	}

	.play-circle svg {
		width: 18px;
		height: 18px;
	}

	.load-more-btn-modern {
		padding: 8px 24px;
		font-size: 0.75rem;
	}
}

/* موبایل بسیار کوچک (تا 400px) - ۲ ستون با تنظیمات بیشتر */
@media (max-width: 400px) {
	.grid-modern {
		gap: 10px;
	}

	.hero-title {
		font-size: 1.2rem;
	}

	.stat-item svg {
		width: 14px;
		height: 14px;
	}

	.stat-number {
		font-size: 0.85rem;
	}

	.stat-label {
		font-size: 0.55rem;
	}

	.hero-stats {
		gap: 8px;
	}

	.stat-divider {
		display: none;
	}

	.genre-card-content {
		padding: 10px 10px 8px;
	}

	.genre-title {
		font-size: 0.75rem;
	}

	.artist-count {
		font-size: 0.65rem;
	}

	.artist-label {
		font-size: 0.5rem;
	}

	.artist-icon {
		width: 22px;
		height: 22px;
	}

	.artist-icon svg {
		width: 10px;
		height: 10px;
	}

	.count-badge {
		top: 6px;
		right: 6px;
		padding: 2px 6px;
		font-size: 0.5rem;
	}

	.count-badge svg {
		width: 10px;
		height: 10px;
	}

	.play-circle {
		width: 36px;
		height: 36px;
	}

	.play-circle svg {
		width: 16px;
		height: 16px;
	}
}

/* ---------- بهبود تعامل لمسی ---------- */
@media (hover: none) {
	.genre-card:active {
		transform: scale(0.97);
	}

	.genre-card-overlay {
		opacity: 0.5;
	}

	.play-circle {
		transform: scale(0.9);
	}
}

/* ============================================================
   استایل‌های اختصاصی آرشیو خوانندگان - گرافیک حرفه‌ای
   ============================================================ */

.raditone-singer-archive .raditone-singer-card {
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: 1.25rem;
	overflow: hidden;
	transition: all 0.4s cubic-bezier(0.2, 0.9, 0.4, 1.1);
	position: relative;
	box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.raditone-singer-archive .raditone-singer-card:hover {
	transform: translateY(-8px);
	border-color: var(--primary);
	box-shadow: 0 16px 40px -12px rgba(var(--primary-rgb, 59,130,246), 0.35);
}

.raditone-singer-archive .raditone-singer-image {
	position: relative;
	height: 200px;
	overflow: hidden;
	width: 100%;
	background: var(--bg-tertiary);
}

.raditone-singer-archive .raditone-singer-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s cubic-bezier(0.2, 0.9, 0.4, 1.1);
}

.raditone-singer-archive .raditone-singer-card:hover .raditone-singer-image img {
	transform: scale(1.08);
}

/* اوورلی */
.raditone-singer-archive .raditone-singer-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,0.3);
	backdrop-filter: blur(2px);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.4s ease;
	z-index: 2;
}

.raditone-singer-archive .raditone-singer-card:hover .raditone-singer-overlay {
	opacity: 1;
}

.raditone-singer-archive .raditone-singer-play-btn {
	width: 52px;
	height: 52px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transform: scale(0.8);
	transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
	box-shadow: 0 8px 24px rgba(0,0,0,0.3);
}

.raditone-singer-archive .raditone-singer-card:hover .raditone-singer-play-btn {
	transform: scale(1);
}

.raditone-singer-archive .raditone-singer-play-btn svg {
	width: 22px;
	height: 22px;
	fill: white;
	margin-left: 2px;
}

/* بج تعداد */
.raditone-singer-archive .raditone-singer-count-badge {
	position: absolute;
	bottom: 12px;
	left: 12px;
	background: rgba(0,0,0,0.65);
	backdrop-filter: blur(8px);
	padding: 4px 12px;
	border-radius: 30px;
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 0.7rem;
	font-weight: 600;
	color: white;
	z-index: 3;
	border: 1px solid rgba(255,255,255,0.1);
}

.raditone-singer-archive .raditone-singer-count-badge svg {
	width: 12px;
	height: 12px;
	stroke: #fbbf24;
}

/* محتوای کارت */
.raditone-singer-archive .raditone-singer-content {
	padding: 16px 18px 18px;
	text-align: center;
}

.raditone-singer-archive .raditone-singer-name {
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 4px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.raditone-singer-archive .raditone-singer-style {
	font-size: 0.7rem;
	color: var(--text-tertiary);
	margin-bottom: 14px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	background: var(--bg-tertiary);
	padding: 2px 12px;
	border-radius: 20px;
	display: inline-block;
}

.raditone-singer-archive .raditone-singer-action {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 18px;
	border-radius: 30px;
	font-size: 0.8rem;
	font-weight: 500;
	background: var(--bg-tertiary);
	color: var(--text-secondary);
	transition: all 0.3s cubic-bezier(0.2, 0.9, 0.4, 1.1);
	cursor: pointer;
}

.raditone-singer-archive .raditone-singer-card:hover .raditone-singer-action {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	color: white;
	transform: translateY(-2px);
	box-shadow: 0 4px 16px rgba(var(--primary-rgb), 0.3);
}

.raditone-singer-archive .raditone-singer-action svg {
	width: 14px;
	height: 14px;
	stroke: currentColor;
	transition: transform 0.3s ease;
}

.raditone-singer-archive .raditone-singer-card:hover .raditone-singer-action svg {
	transform: translateX(4px);
}

/* انیمیشن ورود */
.raditone-singer-archive article {
	opacity: 0;
	transform: translateY(20px);
	transition: all 0.4s cubic-bezier(0.2, 0.9, 0.4, 1.1);
}

.raditone-singer-archive article.animated {
	opacity: 1;
	transform: translateY(0);
}

/* ریسپانسیو کامل - ۶ ستون دسکتاپ تا ۲ ستون موبایل */
@media (max-width: 1200px) {
	.raditone-singer-archive #singers-grid {
		grid-template-columns: repeat(5, 1fr);
	}
}

@media (max-width: 1024px) {
	.raditone-singer-archive #singers-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 768px) {
	.raditone-singer-archive #singers-grid {
		grid-template-columns: repeat(3, 1fr);
	}

	.raditone-singer-archive .raditone-singer-image {
		height: 170px;
	}
}

@media (max-width: 576px) {
	.raditone-singer-archive #singers-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 14px;
	}

	.raditone-singer-archive .raditone-singer-image {
		height: 150px;
	}

	.raditone-singer-archive .raditone-singer-name {
		font-size: 0.9rem;
	}

	.raditone-singer-archive .raditone-singer-content {
		padding: 12px 14px 14px;
	}
}

@media (max-width: 400px) {
	.raditone-singer-archive #singers-grid {
		gap: 10px;
	}

	.raditone-singer-archive .raditone-singer-image {
		height: 130px;
	}

	.raditone-singer-archive .raditone-singer-name {
		font-size: 0.8rem;
	}

	.raditone-singer-archive .raditone-singer-action {
		font-size: 0.7rem;
		padding: 4px 12px;
	}
}

.amar-archive {
	display: flex;
	flex-direction: row;
	align-content: center;
	align-items: center;
	gap: 5px;
}

.amar-archive svg {
	stroke: var(--primary);
	width: 2rem;
	height: 2rem;
}

.post-meta.post-meta-pic {
	position: absolute;
	bottom: 12px;
	background: linear-gradient(-135deg, var(--primary), var(--accent));
	padding: 4px 10px;
	font-size: 0.65rem;
	font-weight: 600;
	color: white;
	display: flex;
	align-items: center;
	gap: 4px;
	z-index: 2;
}
/*------------------------------- Captcha Style -------------------------------*/
/**
 * استایل‌های کپچا - هماهنگ با تنظیمات قالب
 */

.rt-captcha {
	margin-bottom: 20px;
	padding: 15px;
	background: var(--bg-secondary, #f8fafc);
	border-radius: 12px;
	border: 1px solid var(--border, #e2e8f0);
}

.rt-captcha .captcha-display {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	flex-wrap: wrap;
}

.rt-captcha .captcha-code {
	font-family: 'Courier New', monospace;
	font-size: 24px;
	font-weight: bold;
	letter-spacing: 5px;
	background: var(--bg-tertiary, #f1f5f9);
	padding: 10px 15px;
	border-radius: 8px;
	display: inline-block;
	direction: ltr;
}

.rt-captcha .captcha-question {
	font-size: 18px;
	font-weight: bold;
	background: var(--bg-tertiary, #f1f5f9);
	padding: 10px 20px;
	border-radius: 8px;
	display: inline-block;
	direction: ltr;
}

.rt-captcha .captcha-image {
	border-radius: 8px;
	height: 50px;
	border: 1px solid var(--border, #e2e8f0);
}

.rt-captcha .captcha-refresh {
	background: var(--bg-tertiary, #f1f5f9);
	border: 1px solid var(--border, #e2e8f0);
	border-radius: 8px;
	padding: 8px 12px;
	cursor: pointer;
	transition: all 0.2s ease;
	color: var(--text-secondary, #475569);
}

.rt-captcha .captcha-refresh:hover {
	background: var(--primary, #6366f1);
	border-color: var(--primary, #6366f1);
	color: white;
	transform: rotate(-180deg);
}

.rt-captcha .captcha-input {
	width: 100%;
	padding: 12px 15px;
	border: 2px solid var(--border, #e2e8f0);
	border-radius: 8px;
	font-size: 14px;
	transition: all 0.2s ease;
	background: var(--bg-primary, #ffffff);
	color: var(--text-primary, #1e293b);
	text-align: center;
	direction: ltr;
}

.rt-captcha .captcha-input:focus {
	outline: none;
	border-color: var(--primary, #6366f1);
	box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
}

.rt-captcha .captcha-loading {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 10px;
	color: var(--text-secondary, #64748b);
}

.rt-captcha .captcha-loading i {
	animation: spin 1s linear infinite;
}

@keyframes spin {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(-360deg);
	}
}

/* حالت تاریک */
.dark .rt-captcha {
	background: rgba(255, 255, 255, 0.05);
	border-color: rgba(255, 255, 255, 0.1);
}

.dark .rt-captcha .captcha-code,
.dark .rt-captcha .captcha-question {
	background: rgba(255, 255, 255, 0.08);
	color: var(--text-primary, #f1f5f9);
}

.dark .rt-captcha .captcha-refresh {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.1);
	color: var(--text-secondary, #cbd5e1);
}

.dark .rt-captcha .captcha-input {
	background: rgba(255, 255, 255, 0.05);
	border-color: rgba(255, 255, 255, 0.1);
	color: var(--text-primary, #f1f5f9);
}

/* ریسپانسیو */
@media (max-width: 480px) {
	.rt-captcha .captcha-code {
		font-size: 18px;
		letter-spacing: 3px;
	}

	.rt-captcha .captcha-question {
		font-size: 14px;
	}
}
/*------------------------------- Other Style -------------------------------*/
.section-header h2 i {
	color: var(--primary);
}

.coming-soon-badge {
	background: #ff6b6b;
	color: #fff;
	font-size: 0.7rem;
	font-weight: bold;
	padding: 4px 12px;
	border-radius: 30px;
	margin-left: 10px;
	display: inline-block;
	vertical-align: middle;
	animation: pulse 1.5s infinite;
}

@keyframes pulse {
	0% {
		opacity: 1;
	}

	50% {
		opacity: 0.5;
	}

	100% {
		opacity: 1;
	}
}

button.report-trigger-btn.report-simple-btn.minimal {
	display: flex;
	gap: 10px;
	align-items: center;
}

.sort-select-wrapper {
	display: flex;
	align-items: center;
	border: 1px solid var(--border-glow);
	border-radius: 25px;
	align-content: center;
}

.sort-select-wrapper svg {
	position: absolute;
	right: 5px;
	left: auto !important;
	color: var(--primary);
	pointer-events: none;
	z-index: 1;
	width: 16px;
	height: 16px;
	stroke: currentColor;
}

select#sortSelect {
	text-align: left;
	padding-left: 10px;
	border: 0;
}

button {
	display: flex;
	gap: 5px;
}

.rt-sidebar-menu a svg, .rt-desktop-nav a svg, .rt-bottom-nav svg {
	width: 1.5rem;
	height: 1.5rem;
}

/*------------------------------- Archive Card Style -------------------------------*/
.rt-category-wrapper {
	background: var(--bg-primary);
	color: var(--text-primary);
	min-height: 100vh;
}

.rt-category-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;
	margin-top: 24px;
}

@media (max-width: 1200px) {
	.rt-category-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 768px) {
	.rt-category-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 14px;
	}
}

@media (max-width: 480px) {
	.rt-category-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
	}
}

        /* کارت اصلی */
.rt-category-card {
	position: relative;
	background: var(--bg-primary);
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 2px 12px -2px rgba(0,0,0,0.08);
	transition: all 0.3s ease;
	border: 1px solid var(--border-color);
	display: flex;
	flex-direction: column;
	height: 100%;
}

.rt-category-card:hover {
	box-shadow: 0 8px 30px rgba(0,0,0,0.12);
	transform: translateY(-3px);
	border-color: var(--primary);
}

        /* حاشیه مورب */
.rt-category-card-border {
	position: absolute;
	inset: 0;
	border-radius: 14px;
	pointer-events: none;
	padding: 1.5px;
	z-index: 5;
	background: linear-gradient(to bottom right, var(--primary) 0%, transparent 40%), linear-gradient(to top left, var(--secondary) 0%, transparent 40%);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
}

.rt-category-card:hover .rt-category-card-border {
	opacity: 1;
}

.rt-category-card-inner {
	display: flex;
	flex-direction: column;
	height: 100%;
	position: relative;
	z-index: 1;
}

        /* لینک کلی کارت */
.rt-category-card-link {
	display: block;
	text-decoration: none;
	color: inherit;
}

.rt-category-card-link:hover {
	text-decoration: none;
}

        /* تصویر */
.rt-category-card-image {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: var(--bg-secondary);
}

.rt-category-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s ease;
}

.rt-category-card:hover .rt-category-card-image img {
	transform: scale(1.05);
}

.rt-category-card-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(-135deg, var(--primary-light), var(--secondary-light));
	color: var(--primary);
}

.rt-category-card-placeholder svg {
	width: 48px;
	height: 48px;
	stroke: var(--primary);
}

.rt-category-card-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.3) 0%, transparent 60%);
	pointer-events: none;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.rt-category-card:hover .rt-category-card-overlay {
	opacity: 1;
}

.rt-category-card-play {
	width: 52px;
	height: 52px;
	background: linear-gradient(-135deg, var(--primary), var(--secondary));
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	transform: scale(0.85);
	transition: transform 0.3s ease;
}

.rt-category-card-play svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

.rt-category-card:hover .rt-category-card-play {
	transform: scale(1);
}

        /* محتوا */
.rt-category-card-content {
	padding: 12px 14px 6px;
	text-align: center;
	flex: 1;
}

.rt-category-card-title {
	font-size: 15px;
	font-weight: 700;
	color: var(--text-primary);
	line-height: 1.4;
	margin: 0 0 2px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	max-height: 2.8em;
	word-break: break-word;
}

.rt-category-card-title a {
	color: inherit;
	text-decoration: none;
}

.rt-category-card-title a:hover {
	color: var(--primary);
}

.rt-category-card-artist {
	font-size: 12px;
	color: var(--text-tertiary);
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
}

.rt-category-card-artist svg {
	width: 14px;
	height: 14px;
	stroke: var(--text-tertiary);
}

        /* آمار */
.rt-category-card-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4px;
	padding: 10px 12px 14px;
	border-top: 1px solid var(--border-color);
	background: var(--bg-secondary);
}

.rt-category-card-stat {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 4px 0;
	border-radius: 6px;
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	transition: background 0.2s;
}

.rt-category-card:hover .rt-category-card-stat {
	border-color: var(--primary-light);
}

.rt-category-stat-icon {
	color: var(--text-tertiary);
	margin-bottom: 2px;
	display: inline-flex;
	align-items: center;
}

.rt-category-stat-icon svg {
	width: 14px;
	height: 14px;
	stroke: var(--primary);
}

.rt-category-stat-number {
	font-size: 14px;
	font-weight: 700;
	color: var(--primary);
	line-height: 1.2;
	text-align: center;
}

.rt-category-stat-label {
	font-size: 9px;
	color: var(--text-tertiary);
	font-weight: 500;
	letter-spacing: 0.02em;
}

        /* هدر */
.header-amar .amar-archive {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 8px 16px;
	background: var(--bg-secondary);
	border-radius: 12px;
	border: 1px solid var(--border-color);
}

.header-amar .amar-archive svg {
	color: var(--primary);
	width: 32px;
	height: 32px;
	margin-bottom: 4px;
}

        /* خالی */
.rt-category-empty {
	grid-column: 1 / -1;
	text-align: center;
	padding: 60px 20px;
}

.rt-category-empty-icon {
	font-size: 48px;
	color: var(--text-tertiary);
	margin-bottom: 16px;
}

.rt-category-empty-title {
	font-size: 22px;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 8px;
}

.rt-category-empty-text {
	color: var(--text-secondary);
}

        /* شمارنده */
.rt-category-stats {
	font-size: 14px;
	color: var(--text-secondary);
	padding: 6px 0;
}

.rt-category-stats-number {
	font-weight: 700;
	color: var(--text-primary);
}

        /* ===== صفحه‌بندی ===== */
.rt-category-pagination {
	margin-top: 40px;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 6px;
}

.rt-category-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border-radius: 8px;
	background: var(--bg-secondary);
	border: 1px solid var(--border-color);
	color: var(--text-secondary);
	font-weight: 600;
	font-size: 14px;
	transition: all 0.2s;
	text-decoration: none;
}

.rt-category-pagination .page-numbers.current {
	background: var(--primary);
	color: #fff;
	border-color: var(--primary);
}

.rt-category-pagination .page-numbers:hover:not(.current) {
	background: var(--primary-light);
	border-color: var(--primary);
	color: var(--primary);
}

.rt-category-pagination .page-numbers.prev,
        .rt-category-pagination .page-numbers.next {
	font-size: 0;
	padding: 0 8px;
}

.rt-category-pagination .page-numbers.prev svg,
        .rt-category-pagination .page-numbers.next svg {
	width: 20px;
	height: 20px;
	stroke: currentColor;
}

        /* انیمیشن fade-in */
.rt-category-card {
	opacity: 0;
	animation: fadeInUp 0.4s ease forwards;
}

@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.rt-category-card:nth-child(1) {
	animation-delay: 0.01s;
}

.rt-category-card:nth-child(2) {
	animation-delay: 0.02s;
}

.rt-category-card:nth-child(3) {
	animation-delay: 0.03s;
}

.rt-category-card:nth-child(4) {
	animation-delay: 0.04s;
}

.rt-category-card:nth-child(5) {
	animation-delay: 0.05s;
}

.rt-category-card:nth-child(6) {
	animation-delay: 0.06s;
}
        /* ... تا ۳۶ */

        /* ریسپانسیو */
@media (max-width: 480px) {
	.rt-category-card-title {
		font-size: 13px;
	}

	.rt-category-card-artist {
		font-size: 11px;
	}

	.rt-category-stat-number {
		font-size: 12px;
	}

	.rt-category-stat-label {
		font-size: 8px;
	}

	.rt-category-card-content {
		padding: 8px 10px 4px;
	}

	.rt-category-card-stats {
		padding: 6px 8px 10px;
		gap: 4px;
	}

	.rt-category-card-play {
		width: 44px;
		height: 44px;
	}

	.rt-category-card-play svg {
		width: 18px;
		height: 18px;
	}
}

.rt-news-archive {
	background: var(--bg-primary);
	color: var(--text-primary);
}

.rt-news-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;
	margin-top: 24px;
}

@media (max-width: 1200px) {
	.rt-news-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 768px) {
	.rt-news-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 14px;
	}
}

@media (max-width: 480px) {
	.rt-news-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
	}
}

        /* کارت اصلی */
.rt-news-card {
	position: relative;
	background: var(--bg-primary);
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 2px 12px -2px rgba(0,0,0,0.08);
	transition: all 0.3s ease;
	border: 1px solid var(--border-color);
	display: flex;
	flex-direction: column;
	height: 100%;
}

.rt-news-card:hover {
	box-shadow: 0 8px 30px rgba(0,0,0,0.12);
	transform: translateY(-3px);
	border-color: var(--primary);
}

        /* حاشیه‌های مورب محو‌شونده */
.rt-news-card-border {
	position: absolute;
	inset: 0;
	border-radius: 14px;
	pointer-events: none;
	padding: 1.5px;
	z-index: 5;
	background: linear-gradient(to bottom right, var(--primary) 0%, transparent 40%), linear-gradient(to top left, var(--secondary) 0%, transparent 40%);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
}

.rt-news-card:hover .rt-news-card-border {
	opacity: 1;
}

.rt-news-card-inner {
	display: flex;
	flex-direction: column;
	height: 100%;
	position: relative;
	z-index: 1;
}

        /* بخش تصویر */
.rt-news-card-image {
	position: relative;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--bg-secondary);
}

.rt-news-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s ease;
}

.rt-news-card:hover .rt-news-card-image img {
	transform: scale(1.05);
}

.rt-news-card-image-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.3) 0%, transparent 60%);
	pointer-events: none;
	z-index: 2;
}

        /* برچسب‌ها */
.rt-news-card-badges {
	position: absolute;
	top: 10px;
	left: 10px;
	display: flex;
	flex-direction: column;
	gap: 6px;
	z-index: 3;
}

.rt-news-card-badge {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 4px 10px;
	border-radius: 20px;
	font-size: 10px;
	font-weight: 600;
	color: #fff;
	box-shadow: 0 2px 8px rgba(0,0,0,0.2);
	backdrop-filter: blur(4px);
}

.rt-news-card-badge.featured {
	background: #f59e0b;
}

.rt-news-card-badge.hot {
	background: #ef4444;
}

.rt-news-card-badge svg {
	width: 12px;
	height: 12px;
	stroke: currentColor;
}

        /* زمان مطالعه */
.rt-news-card-reading-time {
	position: absolute;
	bottom: 10px;
	right: 10px;
	z-index: 3;
}

.rt-news-card-reading-time span {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 4px 10px;
	border-radius: 20px;
	font-size: 10px;
	font-weight: 500;
	color: #fff;
	background: rgba(0,0,0,0.6);
	backdrop-filter: blur(4px);
}

.rt-news-card-reading-time span svg {
	width: 12px;
	height: 12px;
	stroke: currentColor;
}

        /* بخش محتوا */
.rt-news-card-content {
	padding: 12px 14px 6px;
	flex: 1;
}

.rt-news-card-category {
	font-size: 11px;
	font-weight: 500;
	color: var(--primary);
	margin-bottom: 4px;
	display: flex;
	align-items: center;
	gap: 4px;
}

.rt-news-card-category svg {
	width: 14px;
	height: 14px;
	stroke: currentColor;
}

.rt-news-card-title {
	font-size: 15px;
	font-weight: 700;
	color: var(--text-primary);
	line-height: 1.4;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	max-height: 2.8em;
	word-break: break-word;
}

        /* بخش آمار */
.rt-news-card-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4px;
	padding: 10px 12px 14px;
	border-top: 1px solid var(--border-color);
	background: var(--bg-secondary);
}

.rt-news-card-stat {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 4px 0;
	border-radius: 6px;
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	transition: background 0.2s;
}

.rt-news-card:hover .rt-news-card-stat {
	border-color: var(--primary-light);
}

.rt-news-card-stat-icon {
	color: var(--text-tertiary);
	margin-bottom: 2px;
	display: inline-flex;
	align-items: center;
}

.rt-news-card-stat-icon svg {
	width: 16px;
	height: 16px;
	stroke: var(--primary);
}

.rt-news-card-stat-number {
	font-size: 14px;
	font-weight: 700;
	color: var(--primary);
	line-height: 1.2;
	text-align: center;
}

.rt-news-card-stat-label {
	font-size: 9px;
	color: var(--text-tertiary);
	font-weight: 500;
	letter-spacing: 0.02em;
}

        /* لینک کارت */
.rt-news-card-link {
	text-decoration: none;
	display: block;
	color: inherit;
}

.rt-news-card-link:hover {
	text-decoration: none;
}

        /* هدر آمار */
.header-amar .amar-archive {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 8px 16px;
	background: var(--bg-secondary);
	border-radius: 12px;
	border: 1px solid var(--border-color);
}

.header-amar .amar-archive svg {
	color: var(--primary);
	width: 32px;
	height: 32px;
	margin-bottom: 4px;
}

        /* استایل خالی */
.rt-news-empty {
	grid-column: 1 / -1;
	text-align: center;
	padding: 60px 20px;
}

.rt-news-empty-icon {
	font-size: 48px;
	color: var(--text-tertiary);
	margin-bottom: 16px;
}

.rt-news-empty-title {
	font-size: 22px;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 8px;
}

.rt-news-empty-text {
	color: var(--text-secondary);
}

        /* ===== صفحه‌بندی (Pagination) ===== */
.rt-news-pagination {
	margin-top: 40px;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 6px;
}

.rt-news-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border-radius: 8px;
	background: var(--bg-secondary);
	border: 1px solid var(--border-color);
	color: var(--text-secondary);
	font-weight: 600;
	font-size: 14px;
	transition: all 0.2s;
	text-decoration: none;
}

.rt-news-pagination .page-numbers.current {
	background: var(--primary);
	color: #fff;
	border-color: var(--primary);
}

.rt-news-pagination .page-numbers:hover:not(.current) {
	background: var(--primary-light);
	border-color: var(--primary);
	color: var(--primary);
}

.rt-news-pagination .page-numbers.prev,
        .rt-news-pagination .page-numbers.next {
	font-size: 0;
	padding: 0 8px;
}

.rt-news-pagination .page-numbers.prev svg,
        .rt-news-pagination .page-numbers.next svg {
	width: 20px;
	height: 20px;
	stroke: currentColor;
}

        /* شمارنده نتایج */
.rt-news-stats {
	font-size: 14px;
	color: var(--text-secondary);
	margin-bottom: 8px;
	padding: 6px 0;
}

.rt-news-stats-number {
	font-weight: 700;
	color: var(--text-primary);
}

        /* انیمیشن fade-in برای کارت‌ها */
.rt-news-card {
	opacity: 0;
	animation: fadeInUp 0.4s ease forwards;
}

@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.rt-news-card:nth-child(1) {
	animation-delay: 0.01s;
}

.rt-news-card:nth-child(2) {
	animation-delay: 0.02s;
}

.rt-news-card:nth-child(3) {
	animation-delay: 0.03s;
}

.rt-news-card:nth-child(4) {
	animation-delay: 0.04s;
}

.rt-news-card:nth-child(5) {
	animation-delay: 0.05s;
}

.rt-news-card:nth-child(6) {
	animation-delay: 0.06s;
}

.rt-news-card:nth-child(7) {
	animation-delay: 0.07s;
}

.rt-news-card:nth-child(8) {
	animation-delay: 0.08s;
}

.rt-news-card:nth-child(9) {
	animation-delay: 0.09s;
}

.rt-news-card:nth-child(10) {
	animation-delay: 0.10s;
}

.rt-news-card:nth-child(11) {
	animation-delay: 0.11s;
}

.rt-news-card:nth-child(12) {
	animation-delay: 0.12s;
}

.rt-news-card:nth-child(13) {
	animation-delay: 0.13s;
}

.rt-news-card:nth-child(14) {
	animation-delay: 0.14s;
}

.rt-news-card:nth-child(15) {
	animation-delay: 0.15s;
}

.rt-news-card:nth-child(16) {
	animation-delay: 0.16s;
}

.rt-news-card:nth-child(17) {
	animation-delay: 0.17s;
}

.rt-news-card:nth-child(18) {
	animation-delay: 0.18s;
}

.rt-news-card:nth-child(19) {
	animation-delay: 0.19s;
}

.rt-news-card:nth-child(20) {
	animation-delay: 0.20s;
}

.rt-news-card:nth-child(21) {
	animation-delay: 0.21s;
}

.rt-news-card:nth-child(22) {
	animation-delay: 0.22s;
}

.rt-news-card:nth-child(23) {
	animation-delay: 0.23s;
}

.rt-news-card:nth-child(24) {
	animation-delay: 0.24s;
}

.rt-news-card:nth-child(25) {
	animation-delay: 0.25s;
}

.rt-news-card:nth-child(26) {
	animation-delay: 0.26s;
}

.rt-news-card:nth-child(27) {
	animation-delay: 0.27s;
}

.rt-news-card:nth-child(28) {
	animation-delay: 0.28s;
}

.rt-news-card:nth-child(29) {
	animation-delay: 0.29s;
}

.rt-news-card:nth-child(30) {
	animation-delay: 0.30s;
}

.rt-news-card:nth-child(31) {
	animation-delay: 0.31s;
}

.rt-news-card:nth-child(32) {
	animation-delay: 0.32s;
}

.rt-news-card:nth-child(33) {
	animation-delay: 0.33s;
}

.rt-news-card:nth-child(34) {
	animation-delay: 0.34s;
}

.rt-news-card:nth-child(35) {
	animation-delay: 0.35s;
}

.rt-news-card:nth-child(36) {
	animation-delay: 0.36s;
}

        /* ریسپانسیو کارت‌ها */
@media (max-width: 480px) {
	.rt-news-card-title {
		font-size: 13px;
	}

	.rt-news-card-category {
		font-size: 10px;
	}

	.rt-news-card-stat-number {
		font-size: 12px;
	}

	.rt-news-card-stat-label {
		font-size: 8px;
	}

	.rt-news-card-content {
		padding: 8px 10px 4px;
	}

	.rt-news-card-stats {
		padding: 6px 8px 10px;
		gap: 4px;
	}

	.rt-news-card-badge {
		font-size: 8px;
		padding: 2px 8px;
	}

	.rt-news-card-reading-time span {
		font-size: 8px;
		padding: 2px 8px;
	}
}

.rt-playlist-archive {
	background: var(--bg-primary);
	color: var(--text-primary);
}

/* ===== آرشیو نویسندگان ===== */
.rt-author-archive {
	background: var(--bg-primary);
	color: var(--text-primary);
}

.rt-author-profile {
	position: relative;
	overflow: hidden;
	border-radius: 20px;
}

.rt-author-profile-border {
	position: absolute;
	inset: 0;
	border-radius: 20px;
	pointer-events: none;
	padding: 1.5px;
	z-index: 0;
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
}

.rt-author-profile-inner {
	position: relative;
	z-index: 1;
	padding: 28px 28px 22px;
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.rt-author-profile-main {
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
}

.rt-author-avatar {
	flex-shrink: 0;
	width: 96px;
	height: 96px;
	border-radius: 50%;
	overflow: hidden;
	background: var(--bg-secondary);
	border: 2px solid transparent;
	background-clip: padding-box;
	background-image: linear-gradient(var(--bg-secondary), var(--bg-secondary)), linear-gradient(-135deg, var(--primary), var(--secondary));
	background-origin: border-box;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.rt-author-avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.rt-author-avatar-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--primary);
}

.rt-author-profile-info {
	flex: 1;
	min-width: 200px;
}

.rt-author-profile-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 12px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 8px;
	color: white;
	background: linear-gradient(-135deg, var(--primary), var(--secondary));
}

.rt-author-profile-badge svg {
	width: 13px;
	height: 13px;
}

.rt-author-profile-name {
	margin: 0 0 6px;
	font-size: 26px;
	font-weight: 800;
	color: var(--text-primary);
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}

.rt-author-profile-desc {
	margin: 0;
	font-size: 14px;
	color: var(--text-tertiary);
}

.rt-author-stats {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	padding-top: 18px;
	border-top: 1px solid var(--border);
}

.rt-author-stat {
	flex: 1;
	min-width: 120px;
	text-align: center;
	padding: 12px 16px;
	border-radius: 14px;
	background: var(--bg-primary);
	border: 1px solid var(--border);
}

.rt-author-stat > svg {
	width: 20px;
	height: 20px;
	color: var(--primary);
	margin-bottom: 6px;
}

.rt-author-stat-number {
	font-size: 18px;
	font-weight: 800;
	color: var(--text-primary);
}

.rt-author-stat-label {
	font-size: 12px;
	color: var(--text-tertiary);
	margin-top: 2px;
}

@media (max-width: 768px) {
	.rt-author-profile-inner {
		padding: 20px;
	}
	.rt-author-profile-main {
		flex-direction: column;
		text-align: center;
	}
	.rt-author-profile-info {
		min-width: 0;
	}
	.rt-author-profile-name {
		justify-content: center;
	}
}

.rt-playlist-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;
	margin-top: 24px;
}

@media (max-width: 1200px) {
	.rt-playlist-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 768px) {
	.rt-playlist-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 14px;
	}
}

@media (max-width: 480px) {
	.rt-playlist-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
	}
}

        /* کارت اصلی */
.rt-playlist-card {
	position: relative;
	background: var(--bg-primary);
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 2px 12px -2px rgba(0,0,0,0.08);
	transition: all 0.3s ease;
	border: 1px solid var(--border-color);
	display: flex;
	flex-direction: column;
	height: 100%;
}

.rt-playlist-card:hover {
	box-shadow: 0 8px 30px rgba(0,0,0,0.12);
	transform: translateY(-3px);
	border-color: var(--primary);
}

        /* حاشیه‌های مورب محو‌شونده (fading borders) */
.rt-playlist-card-border {
	position: absolute;
	inset: 0;
	border-radius: 14px;
	pointer-events: none;
	padding: 1.5px;
	z-index: 5;
	background: linear-gradient(to bottom right, var(--primary) 0%, transparent 40%), linear-gradient(to top left, var(--secondary) 0%, transparent 40%);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
}
        /* در حالت hover شدت بیشتری به حاشیه بدهیم */
.rt-playlist-card:hover .rt-playlist-card-border {
	opacity: 1;
}

.rt-playlist-card-inner {
	display: flex;
	flex-direction: column;
	height: 100%;
	position: relative;
	z-index: 1;
}

        /* بخش تصویر */
.rt-playlist-card-image {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: var(--bg-secondary);
}

.rt-playlist-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s ease;
}

.rt-playlist-card:hover .rt-playlist-card-image img {
	transform: scale(1.05);
}

.rt-playlist-card-image-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 48px;
	color: white;
}

.rt-playlist-card-image-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.15) 0%, transparent 60%);
	pointer-events: none;
	z-index: 2;
}

        /* بخش محتوا */
.rt-playlist-card-content {
	padding: 12px 14px 6px;
	text-align: center;
	flex: 1;
}

.rt-playlist-card-title {
	font-size: 15px;
	font-weight: 700;
	color: var(--text-primary);
	line-height: 1.4;
	margin: 0 0 2px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	max-height: 2.8em;
	word-break: break-word;
}

.rt-playlist-card-artist {
	font-size: 13px;
	color: var(--text-tertiary);
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.rt-playlist-card-duration {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	margin-top: 6px;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: 11px;
	color: var(--text-tertiary);
	background: var(--bg-secondary);
	border: 1px solid var(--border-color);
	white-space: nowrap;
}

.rt-playlist-card-duration-icon {
	display: inline-flex;
	color: var(--primary);
}

.rt-playlist-card-duration-icon svg {
	width: 12px;
	height: 12px;
}

        /* بخش آمار */
.rt-playlist-card-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4px;
	padding: 10px 12px 14px;
	border-top: 1px solid var(--border-color);
	background: var(--bg-secondary);
}

.rt-playlist-card-stat {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 4px 0;
	border-radius: 6px;
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	transition: background 0.2s;
}

.rt-playlist-card:hover .rt-playlist-card-stat {
	border-color: var(--primary-light);
}

.rt-playlist-card-stat-icon {
	color: var(--text-tertiary);
	margin-bottom: 2px;
	display: inline-flex;
	align-items: center;
}

.rt-playlist-card-stat-icon svg {
	width: 18px;
	height: 18px;
	stroke: var(--primary);
}

.rt-playlist-card-stat-number {
	font-size: 16px;
	font-weight: 700;
	color: var(--primary);
	line-height: 1.2;
}

.rt-playlist-card-stat-label {
	font-size: 10px;
	color: var(--text-tertiary);
	font-weight: 500;
	letter-spacing: 0.02em;
}

        /* لینک کارت */
.rt-playlist-card-link {
	text-decoration: none;
	display: block;
	color: inherit;
}

.rt-playlist-card-link:hover {
	text-decoration: none;
}

        /* هدر آمار */
.header-amar .amar-archive {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 8px 16px;
	background: var(--bg-secondary);
	border-radius: 12px;
	border: 1px solid var(--border-color);
}

.header-amar .amar-archive svg {
	color: var(--primary);
	width: 32px;
	height: 32px;
	margin-bottom: 4px;
}

        /* استایل خالی */
.rt-playlist-empty {
	grid-column: 1 / -1;
	text-align: center;
	padding: 60px 20px;
}

.rt-playlist-empty-icon {
	font-size: 48px;
	color: var(--text-tertiary);
	margin-bottom: 16px;
}

.rt-playlist-empty-title {
	font-size: 22px;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 8px;
}

.rt-playlist-empty-text {
	color: var(--text-secondary);
}

        /* صفحه‌بندی */
.rt-playlist-pagination {
	margin-top: 40px;
	display: flex;
	justify-content: center;
}

.rt-playlist-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 8px;
	margin: 0 4px;
	background: var(--bg-secondary);
	border: 1px solid var(--border-color);
	color: var(--text-secondary);
	font-weight: 600;
	transition: all 0.2s;
}

.rt-playlist-pagination .page-numbers.current {
	background: var(--primary);
	color: #fff;
	border-color: var(--primary);
}

.rt-playlist-pagination .page-numbers:hover:not(.current) {
	background: var(--primary-light);
	border-color: var(--primary);
}

.rt-playlist-pagination .page-numbers.prev,
        .rt-playlist-pagination .page-numbers.next {
	font-size: 0;
	padding: 0;
}

.rt-playlist-pagination .page-numbers.prev svg,
        .rt-playlist-pagination .page-numbers.next svg {
	width: 20px;
	height: 20px;
	stroke: currentColor;
}

        /* اسکرول لود بیشتر */
.rt-load-more-trigger {
	height: 1px;
	margin-top: 30px;
	visibility: hidden;
}

.rt-loading-spinner {
	text-align: center;
	padding: 30px 0;
	color: var(--text-tertiary);
	font-size: 14px;
}

.rt-loading-spinner svg {
	display: inline-block;
	animation: spin 1s linear infinite;
	width: 24px;
	height: 24px;
	margin-left: 8px;
	vertical-align: middle;
}

@keyframes spin {
	100% {
		transform: rotate(-360deg);
	}
}

        /* ریسپانسیو برای کارت‌ها در سایزهای کوچک */
@media (max-width: 480px) {
	.rt-playlist-card-title {
		font-size: 13px;
	}

	.rt-playlist-card-artist {
		font-size: 11px;
	}

	.rt-playlist-card-stat-number {
		font-size: 14px;
	}

	.rt-playlist-card-stat-label {
		font-size: 9px;
	}

	.rt-playlist-card-content {
		padding: 8px 10px 4px;
	}

	.rt-playlist-card-stats {
		padding: 6px 8px 10px;
		gap: 4px;
	}
}

        /* استایل شمارنده نتایج */
.rt-playlist-stats {
	font-size: 14px;
	color: var(--text-secondary);
	margin-bottom: 8px;
	padding: 6px 0;
}

.rt-playlist-stats-number {
	font-weight: 700;
	color: var(--text-primary);
}

.rt-radio-card:hover .rt-radio-play-btn {
	opacity: 1;
	transform: translate(50%, -50%) scale(1);
}

.rt-radio-card:hover .rt-radio-card-image img {
	transform: scale(1.05);
}

@keyframes radioPulse {
	0%, 100% {
		opacity: 1;
		transform: scale(1);
	}

	50% {
		opacity: 0.5;
		transform: scale(0.8);
	}
}

.rt-radio-live-dot {
	width: 8px;
	height: 8px;
	background: white;
	border-radius: 50%;
	display: inline-block;
	animation: radioPulse 1.5s infinite;
}

        /* ============================================================
           استایل‌های کارت رادیو (شبیه نمونه Uiverse)
           با حاشیه مورب و استفاده از متغیرهای CSS قالب
           ============================================================ */
.rt-radio-archive {
	background: var(--bg-primary);
	color: var(--text-primary);
}

.rt-radio-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;
	margin-top: 24px;
}

@media (max-width: 1200px) {
	.rt-radio-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 768px) {
	.rt-radio-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 14px;
	}
}

@media (max-width: 480px) {
	.rt-radio-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
	}
}

        /* کارت اصلی */
.rt-radio-card {
	position: relative;
	background: var(--bg-primary);
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 2px 12px -2px rgba(0,0,0,0.08);
	transition: all 0.3s ease;
	border: 1px solid var(--border-color);
	display: flex;
	flex-direction: column;
	height: 100%;
}

.rt-radio-card:hover {
	box-shadow: 0 8px 30px rgba(0,0,0,0.12);
	transform: translateY(-3px);
	border-color: var(--primary);
}

        /* حاشیه‌های مورب */
.rt-radio-card-border {
	position: absolute;
	inset: 0;
	border-radius: 14px;
	pointer-events: none;
	padding: 1.5px;
	z-index: 5;
	background: linear-gradient(to bottom right, var(--primary) 0%, transparent 40%), linear-gradient(to top left, var(--secondary) 0%, transparent 40%);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
}

.rt-radio-card:hover .rt-radio-card-border {
	opacity: 1;
}

.rt-radio-card-inner {
	display: flex;
	flex-direction: column;
	height: 100%;
	position: relative;
	z-index: 1;
}

        /* بخش تصویر */
.rt-radio-card-image {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: var(--bg-secondary);
}

.rt-radio-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s ease;
}

.rt-radio-card-image-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.35) 0%, transparent 60%);
	pointer-events: none;
	z-index: 2;
}

        /* برچسب‌های روی تصویر */
.rt-radio-live-badge {
	position: absolute;
	top: 12px;
	left: 12px;
	display: flex;
	align-items: center;
	gap: 6px;
	background: linear-gradient(-135deg, #ef4444, #dc2626);
	padding: 4px 12px;
	border-radius: 20px;
	font-size: 10px;
	font-weight: 700;
	color: #fff;
	z-index: 3;
	box-shadow: 0 4px 12px rgba(0,0,0,0.3);
	backdrop-filter: blur(4px);
}

.rt-radio-frequency {
	position: absolute;
	bottom: 12px;
	left: 12px;
	display: flex;
	align-items: center;
	gap: 4px;
	background: rgba(0,0,0,0.6);
	padding: 4px 10px;
	border-radius: 20px;
	font-size: 10px;
	color: #fff;
	z-index: 3;
	backdrop-filter: blur(4px);
}

.rt-radio-frequency svg {
	width: 14px;
	height: 14px;
	stroke: currentColor;
}

.rt-radio-listeners {
	position: absolute;
	bottom: 12px;
	right: 12px;
	display: flex;
	align-items: center;
	gap: 4px;
	background: rgba(0,0,0,0.6);
	padding: 4px 10px;
	border-radius: 20px;
	font-size: 10px;
	color: #fff;
	z-index: 3;
	backdrop-filter: blur(4px);
}

.rt-radio-listeners svg {
	width: 14px;
	height: 14px;
	stroke: currentColor;
}

        /* دکمه پخش */
.rt-radio-play-btn {
	position: absolute;
	top: 50%;
	right: 50%;
	transform: translate(50%, -50%) scale(0.85);
	width: 56px;
	height: 56px;
	background: linear-gradient(-135deg, var(--primary), var(--secondary));
	border: none;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	opacity: 0;
	transition: all 0.3s ease;
	z-index: 4;
	box-shadow: 0 8px 25px rgba(0,0,0,0.3);
	color: #fff;
}

.rt-radio-play-btn svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

        /* بخش محتوا */
.rt-radio-card-content {
	padding: 14px 14px 6px;
	flex: 1;
}

.rt-radio-card-header {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 10px;
	margin-bottom: 6px;
}

.rt-radio-card-title {
	font-size: 15px;
	font-weight: 700;
	color: var(--text-primary);
	line-height: 1.4;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	max-height: 2.8em;
	word-break: break-word;
	flex: 1;
}

.rt-radio-status {
	font-size: 10px;
	font-weight: 600;
	padding: 2px 10px;
	border-radius: 20px;
	white-space: nowrap;
}

.rt-radio-card-excerpt {
	font-size: 12px;
	color: var(--text-secondary);
	margin: 6px 0 0;
	line-height: 1.5;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

        /* بخش آمار */
.rt-radio-card-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4px;
	padding: 10px 12px 14px;
	border-top: 1px solid var(--border-color);
	background: var(--bg-secondary);
}

.rt-radio-card-stat {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 4px 0;
	border-radius: 6px;
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	transition: background 0.2s;
}

.rt-radio-card:hover .rt-radio-card-stat {
	border-color: var(--primary-light);
}

.rt-radio-card-stat-icon {
	color: var(--text-tertiary);
	margin-bottom: 2px;
	display: inline-flex;
	align-items: center;
}

.rt-radio-card-stat-icon svg {
	width: 16px;
	height: 16px;
	stroke: var(--primary);
}

.rt-radio-card-stat-number {
	font-size: 14px;
	font-weight: 700;
	color: var(--primary);
	line-height: 1.2;
	text-align: center;
}

.rt-radio-card-stat-label {
	font-size: 9px;
	color: var(--text-tertiary);
	font-weight: 500;
	letter-spacing: 0.02em;
}

        /* لینک کارت */
.rt-radio-card-link {
	text-decoration: none;
	display: block;
	color: inherit;
}

.rt-radio-card-link:hover {
	text-decoration: none;
}

        /* هدر آمار */
.header-amar .amar-archive {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 8px 16px;
	background: var(--bg-secondary);
	border-radius: 12px;
	border: 1px solid var(--border-color);
}

.header-amar .amar-archive svg {
	color: var(--primary);
	width: 32px;
	height: 32px;
	margin-bottom: 4px;
}

        /* استایل خالی */
.rt-radio-empty {
	grid-column: 1 / -1;
	text-align: center;
	padding: 60px 20px;
}

.rt-radio-empty-icon {
	font-size: 48px;
	color: var(--text-tertiary);
	margin-bottom: 16px;
}

.rt-radio-empty-title {
	font-size: 22px;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 8px;
}

.rt-radio-empty-text {
	color: var(--text-secondary);
}

        /* صفحه‌بندی */
.rt-radio-pagination {
	margin-top: 40px;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 6px;
}

.rt-radio-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border-radius: 8px;
	background: var(--bg-secondary);
	border: 1px solid var(--border-color);
	color: var(--text-secondary);
	font-weight: 600;
	font-size: 14px;
	transition: all 0.2s;
	text-decoration: none;
}

.rt-radio-pagination .page-numbers.current {
	background: var(--primary);
	color: #fff;
	border-color: var(--primary);
}

.rt-radio-pagination .page-numbers:hover:not(.current) {
	background: var(--primary-light);
	border-color: var(--primary);
	color: var(--primary);
}

.rt-radio-pagination .page-numbers.prev,
        .rt-radio-pagination .page-numbers.next {
	font-size: 0;
	padding: 0 8px;
}

.rt-radio-pagination .page-numbers.prev svg,
        .rt-radio-pagination .page-numbers.next svg {
	width: 20px;
	height: 20px;
	stroke: currentColor;
}

        /* شمارنده نتایج */
.rt-radio-stats {
	font-size: 14px;
	color: var(--text-secondary);
	margin-bottom: 8px;
	padding: 6px 0;
}

.rt-radio-stats-number {
	font-weight: 700;
	color: var(--text-primary);
}

        /* فیلترها */
.rt-radio-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	padding: 16px 20px;
	background: var(--bg-secondary);
	border-radius: 16px;
	border: 1px solid var(--border-primary);
	margin-bottom: 20px;
}

.rt-radio-filter-item {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 1 1 180px;
}

.rt-radio-filter-item svg {
	color: var(--text-tertiary);
	width: 18px;
	height: 18px;
	flex-shrink: 0;
}

.rt-radio-filter-item input,
        .rt-radio-filter-item select {
	width: 100%;
	padding: 10px 14px;
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	border-radius: 12px;
	color: var(--text-primary);
	font-size: 0.85rem;
	outline: none;
	transition: border-color 0.2s;
}

.rt-radio-filter-item input:focus,
        .rt-radio-filter-item select:focus {
	border-color: var(--primary);
}

.rt-radio-filter-item select {
	appearance: none;
	cursor: pointer;
}

        /* انیمیشن fade-in */
.rt-radio-card {
	opacity: 0;
	animation: fadeInUp 0.4s ease forwards;
}

@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.rt-radio-card:nth-child(1) {
	animation-delay: 0.01s;
}

.rt-radio-card:nth-child(2) {
	animation-delay: 0.02s;
}

.rt-radio-card:nth-child(3) {
	animation-delay: 0.03s;
}

.rt-radio-card:nth-child(4) {
	animation-delay: 0.04s;
}

.rt-radio-card:nth-child(5) {
	animation-delay: 0.05s;
}

.rt-radio-card:nth-child(6) {
	animation-delay: 0.06s;
}
        /* ... up to 36 */

        /* ریسپانسیو */
@media (max-width: 480px) {
	.rt-radio-card-title {
		font-size: 13px;
	}

	.rt-radio-card-stat-number {
		font-size: 12px;
	}

	.rt-radio-card-stat-label {
		font-size: 8px;
	}

	.rt-radio-card-content {
		padding: 8px 10px 4px;
	}

	.rt-radio-card-stats {
		padding: 6px 8px 10px;
		gap: 4px;
	}

	.rt-radio-live-badge {
		font-size: 8px;
		padding: 2px 8px;
	}

	.rt-radio-frequency, .rt-radio-listeners {
		font-size: 8px;
		padding: 2px 8px;
	}

	.rt-radio-play-btn {
		width: 44px;
		height: 44px;
	}

	.rt-radio-play-btn svg {
		width: 18px;
		height: 18px;
	}
}

        /* ============================================================
           استایل‌های کارت آرشیو تقدیم‌ها و درخواست‌ها
           با حاشیه مورب و استفاده از متغیرهای CSS قالب
           ============================================================ */
.rt-archive-wrapper {
	background: var(--bg-primary);
	color: var(--text-primary);
	min-height: 100vh;
}

.rt-archive-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;
	margin-top: 24px;
}

@media (max-width: 1200px) {
	.rt-archive-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 768px) {
	.rt-archive-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 14px;
	}
}

@media (max-width: 480px) {
	.rt-archive-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
	}
}

        /* کارت اصلی */
.rt-archive-card {
	position: relative;
	background: var(--bg-primary);
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 2px 12px -2px rgba(0,0,0,0.08);
	transition: all 0.3s ease;
	border: 1px solid var(--border-color);
	display: flex;
	flex-direction: column;
	height: 100%;
}

.rt-archive-card:hover {
	box-shadow: 0 8px 30px rgba(0,0,0,0.12);
	transform: translateY(-3px);
	border-color: var(--primary);
}

        /* حاشیه مورب */
.rt-archive-card-border {
	position: absolute;
	inset: 0;
	border-radius: 14px;
	pointer-events: none;
	padding: 1.5px;
	z-index: 5;
	background: linear-gradient(to bottom right, var(--primary) 0%, transparent 40%), linear-gradient(to top left, var(--secondary) 0%, transparent 40%);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
}

.rt-archive-card:hover .rt-archive-card-border {
	opacity: 1;
}

.rt-archive-card-inner {
	display: flex;
	flex-direction: column;
	height: 100%;
	position: relative;
	z-index: 1;
}

        /* تصویر */
.rt-archive-card-image {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: var(--bg-secondary);
}

.rt-archive-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s ease;
}

.rt-archive-card:hover .rt-archive-card-image img {
	transform: scale(1.05);
}

.rt-archive-card-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(-135deg, var(--primary-light), var(--secondary-light));
	color: var(--primary);
}

.rt-archive-card-placeholder svg {
	width: 48px;
	height: 48px;
	stroke: var(--primary);
}

.rt-archive-card-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.4) 0%, transparent 60%);
	pointer-events: none;
	z-index: 2;
}

        /* دکمه پخش */
.rt-archive-card-play {
	position: absolute;
	top: 50%;
	right: 50%;
	transform: translate(50%, -50%) scale(0.85);
	width: 56px;
	height: 56px;
	background: linear-gradient(-135deg, var(--primary), var(--secondary));
	border: none;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	opacity: 0;
	transition: all 0.3s ease;
	z-index: 4;
	box-shadow: 0 8px 25px rgba(0,0,0,0.3);
	color: #fff;
	pointer-events: auto;
}

.rt-archive-card-play svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

.rt-archive-card:hover .rt-archive-card-play {
	opacity: 1;
	transform: translate(50%, -50%) scale(1);
}

        /* برچسب روی تصویر */
.rt-archive-card-badge {
	position: absolute;
	top: 12px;
	left: 12px;
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 4px 12px;
	border-radius: 20px;
	font-size: 10px;
	font-weight: 700;
	color: #fff;
	z-index: 3;
	box-shadow: 0 4px 12px rgba(0,0,0,0.2);
	backdrop-filter: blur(4px);
}

.rt-archive-card-badge.dedication {
	background: linear-gradient(-135deg, #f59e0b, #f97316);
}

.rt-archive-card-badge.request {
	background: linear-gradient(-135deg, #8b5cf6, #6d28d9);
}

.rt-archive-card-badge svg {
	width: 12px;
	height: 12px;
	stroke: currentColor;
}

        /* محتوا */
.rt-archive-card-content {
	padding: 14px 14px 6px;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.rt-archive-card-title {
	font-size: 15px;
	font-weight: 700;
	color: var(--text-primary);
	line-height: 1.4;
	margin: 0 0 2px;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.rt-archive-card-title a {
	color: inherit;
	text-decoration: none;
}

.rt-archive-card-title a:hover {
	color: var(--primary);
}

.rt-archive-card-artist {
	font-size: 12px;
	color: var(--text-tertiary);
	margin: 0 0 10px;
	display: flex;
	align-items: center;
	gap: 4px;
}

.rt-archive-card-artist svg {
	width: 14px;
	height: 14px;
	stroke: var(--text-tertiary);
}

        /* متا */
.rt-archive-card-meta {
	background: var(--bg-tertiary);
	border-radius: 10px;
	padding: 10px 12px;
	margin-bottom: 10px;
	flex: 1;
}

.rt-archive-meta-item {
	font-size: 11px;
	color: var(--text-secondary);
	display: flex;
	align-items: center;
	gap: 4px;
	margin-bottom: 4px;
}

.rt-archive-meta-item:last-child {
	margin-bottom: 0;
}

.rt-archive-meta-item svg {
	width: 14px;
	height: 14px;
	stroke: var(--text-tertiary);
	flex-shrink: 0;
}

.rt-archive-meta-item strong {
	color: var(--text-primary);
}

.rt-archive-meta-item.occasion {
	color: var(--primary);
}

.rt-archive-meta-item.occasion svg {
	stroke: var(--primary);
}

.rt-archive-meta-item.message {
	color: var(--text-tertiary);
	font-style: italic;
	padding-top: 6px;
	margin-top: 4px;
	border-top: 1px dashed var(--border-color);
}

        /* آمار */
.rt-archive-card-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4px;
	padding: 10px 0 12px;
	border-top: 1px solid var(--border-color);
}

.rt-archive-card-stat {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 4px 0;
	border-radius: 6px;
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	transition: background 0.2s;
}

.rt-archive-card:hover .rt-archive-card-stat {
	border-color: var(--primary-light);
}

.rt-archive-stat-icon {
	color: var(--text-tertiary);
	display: inline-flex;
	align-items: center;
}

.rt-archive-stat-icon svg {
	width: 14px;
	height: 14px;
	stroke: var(--primary);
}

.rt-archive-stat-number {
	font-size: 14px;
	font-weight: 700;
	color: var(--primary);
	line-height: 1.2;
}

.rt-archive-stat-label {
	font-size: 9px;
	color: var(--text-tertiary);
	font-weight: 500;
	letter-spacing: 0.02em;
}

        /* هدر */
.header-amar .amar-archive {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 8px 16px;
	background: var(--bg-secondary);
	border-radius: 12px;
	border: 1px solid var(--border-color);
}

.header-amar .amar-archive svg {
	color: var(--primary);
	width: 32px;
	height: 32px;
	margin-bottom: 4px;
}

        /* تب‌ها */
.rt-archive-tabs {
	display: flex;
	gap: 8px;
	margin-top: 16px;
	border-bottom: 2px solid var(--border-color);
	padding-bottom: 0;
}

.rt-archive-tab {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px 24px;
	background: transparent;
	border: none;
	border-bottom: 3px solid transparent;
	font-size: 15px;
	font-weight: 600;
	color: var(--text-secondary);
	cursor: pointer;
	transition: all 0.3s ease;
	border-radius: 0;
}

.rt-archive-tab:hover {
	color: var(--primary);
}

.rt-archive-tab.active {
	color: var(--primary);
	border-bottom-color: var(--primary);
}

.rt-archive-tab svg {
	width: 20px;
	height: 20px;
	stroke: currentColor;
}

.rt-archive-tab-badge {
	background: var(--bg-tertiary);
	padding: 2px 10px;
	border-radius: 20px;
	font-size: 12px;
	font-weight: 600;
}

        /* خالی */
.rt-archive-empty {
	grid-column: 1 / -1;
	text-align: center;
	padding: 60px 20px;
}

.rt-archive-empty-icon {
	font-size: 48px;
	color: var(--text-tertiary);
	margin-bottom: 16px;
}

.rt-archive-empty-title {
	font-size: 22px;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 8px;
}

.rt-archive-empty-text {
	color: var(--text-secondary);
}

        /* لود بیشتر */
.rt-load-more-trigger {
	height: 1px;
	margin-top: 30px;
	visibility: hidden;
}

.rt-loading-spinner {
	text-align: center;
	padding: 30px 0;
	color: var(--text-tertiary);
	font-size: 14px;
}

.rt-loading-spinner svg {
	display: inline-block;
	animation: spin 1s linear infinite;
	width: 24px;
	height: 24px;
	margin-left: 8px;
	vertical-align: middle;
}

@keyframes spin {
	100% {
		transform: rotate(-360deg);
	}
}

.rt-end-message {
	text-align: center;
	padding: 30px 0;
}

.rt-end-message-inner {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 24px;
	background: var(--bg-tertiary);
	border-radius: 30px;
	color: var(--text-secondary);
	font-size: 14px;
}

.rt-end-message-inner svg {
	width: 20px;
	height: 20px;
	stroke: var(--success);
}

        /* شمارنده */
.rt-archive-stats {
	font-size: 14px;
	color: var(--text-secondary);
	padding: 6px 0;
}

.rt-archive-stats-number {
	font-weight: 700;
	color: var(--text-primary);
}

        /* انیمیشن fade-in */
.rt-archive-card {
	opacity: 0;
	animation: fadeInUp 0.4s ease forwards;
}

@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.rt-archive-card:nth-child(1) {
	animation-delay: 0.01s;
}

.rt-archive-card:nth-child(2) {
	animation-delay: 0.02s;
}
        /* ... تا ۳۶ */

        /* ریسپانسیو */
@media (max-width: 480px) {
	.rt-archive-card-title {
		font-size: 13px;
	}

	.rt-archive-card-artist {
		font-size: 11px;
	}

	.rt-archive-stat-number {
		font-size: 12px;
	}

	.rt-archive-stat-label {
		font-size: 8px;
	}

	.rt-archive-card-content {
		padding: 8px 10px 4px;
	}

	.rt-archive-card-stats {
		padding: 6px 0 8px;
		gap: 4px;
	}

	.rt-archive-card-meta {
		padding: 6px 8px;
	}

	.rt-archive-meta-item {
		font-size: 10px;
	}

	.rt-archive-card-play {
		width: 44px;
		height: 44px;
	}

	.rt-archive-card-play svg {
		width: 18px;
		height: 18px;
	}

	.rt-archive-card-badge {
		font-size: 8px;
		padding: 2px 8px;
	}

	.rt-archive-tab {
		padding: 8px 12px;
		font-size: 13px;
	}
}

        /* ============================================
   استایل صفحه تکی - بدون شیشه‌ای
   ============================================ */

.raditone-page-main {
	background: var(--bg-primary);
	min-height: 100vh;
}

.raditone-page-card {
	max-width: 900px;
	margin: 0 auto;
	background: var(--bg-secondary);
	border-radius: 24px;
	overflow: hidden;
	border: 1px solid var(--border-primary);
	box-shadow: 0 10px 30px -15px rgba(0, 0, 0, 0.1);
}

/* هدر صفحه */
.raditone-page-header {
	text-align: center;
	padding: 40px 30px 20px;
	border-bottom: 1px solid var(--border-primary);
}

.raditone-page-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: linear-gradient(-135deg, #3b82f6, #8b5cf6);
	padding: 5px 16px;
	border-radius: 50px;
	font-size: 0.75rem;
	font-weight: 600;
	color: white;
	margin-bottom: 20px;
}

.raditone-page-badge svg {
	width: 16px;
	height: 16px;
	stroke: white;
	fill: none;
}

.raditone-page-title {
	font-size: 2rem;
	font-weight: 800;
	margin: 0 0 15px;
	color: var(--text-primary);
}

.raditone-page-meta {
	display: flex;
	justify-content: center;
	gap: 20px;
	flex-wrap: wrap;
	font-size: 0.75rem;
	color: var(--text-tertiary);
}

.raditone-page-meta svg {
	width: 14px;
	height: 14px;
	stroke: currentColor;
	fill: none;
	margin-right: 5px;
	vertical-align: middle;
}

.raditone-page-edit a {
	color: var(--text-tertiary);
	text-decoration: none;
}

.raditone-page-edit a:hover {
	color: #3b82f6;
}

/* تصویر شاخص */
.raditone-page-thumbnail {
	margin: 20px 30px;
	border-radius: 20px;
	overflow: hidden;
}

.raditone-page-img {
	width: 100%;
	height: auto;
	border-radius: 20px;
}

/* محتوای صفحه */
.raditone-page-content {
	padding: 30px;
	line-height: 1.8;
}

.raditone-page-content p {
	margin-bottom: 1.2em;
	color: var(--text-secondary);
	text-align: justify;
	line-height: 2rem;
}

.raditone-page-content h1,
.raditone-page-content h2,
.raditone-page-content h3,
.raditone-page-content h4 {
	margin: 1.5em 0 0.5em;
	color: var(--text-primary);
}

.raditone-page-content h2 {
	font-size: 1.5rem;
	border-left: 3px solid #3b82f6;
	padding-left: 15px;
}

.raditone-page-content ul,
.raditone-page-content ol {
	margin: 15px 0;
	padding-left: 25px;
}

.raditone-page-content li {
	margin: 8px 0;
}

.raditone-page-content a {
	color: #3b82f6;
	text-decoration: none;
}

.raditone-page-content a:hover {
	text-decoration: underline;
}

.raditone-page-content img {
	max-width: 100%;
	height: auto;
	border-radius: 12px;
	margin: 20px 0;
}

.raditone-page-content blockquote {
	margin: 20px 0;
	padding: 15px 25px;
	background: var(--bg-tertiary);
	border-left: 3px solid #3b82f6;
	border-radius: 16px;
	font-style: italic;
}

/* کامنت‌ها */
.comments-area {
	max-width: 900px;
	margin: 30px auto 0;
	background: var(--bg-secondary);
	border-radius: 20px;
	border: 1px solid var(--border-primary);
	padding: 25px;
}

/* ریسپانسیو */
@media (max-width: 768px) {
	.raditone-page-header {
		padding: 30px 20px 15px;
	}

	.raditone-page-title {
		font-size: 1.5rem;
	}

	.raditone-page-content {
		padding: 20px;
	}

	.raditone-page-thumbnail {
		margin: 15px 20px;
	}
}

@media (max-width: 480px) {
	.raditone-page-title {
		font-size: 1.3rem;
	}

	.raditone-page-content {
		padding: 15px;
	}

	.raditone-page-content h2 {
		font-size: 1.2rem;
	}
}

/* ============================================================ */
/* استایل‌های صفحه جستجو (هماهنگ با header-search)              */
/* ============================================================ */

.raditone-search-page {
	padding-top: 40px;
	padding-bottom: 80px;
	background: var(--search-bg, #ffffff);
	color: var(--search-text, #1a1a2e);
}

[data-theme="dark"] .raditone-search-page {
	background: #0f172a;
	color: #f1f5f9;
}

/* هدر */
.raditone-search-header {
	text-align: center;
	padding: 20px 0 40px;
	border-bottom: 1px solid var(--search-border, #e2e8f0);
	margin-bottom: 40px;
}

.raditone-search-title {
	font-size: 2.2rem;
	font-weight: 700;
	margin-bottom: 8px;
	color: var(--search-text, #1a1a2e);
}

.raditone-search-subtitle {
	font-size: 1rem;
	color: #94a3b8;
	margin-bottom: 24px;
}

.raditone-search-box-wrapper {
	max-width: 560px;
	margin: 0 auto;
}

.raditone-search-box {
	display: flex;
	align-items: center;
	background: var(--search-input-bg, #f8fafc);
	border: 2px solid var(--search-border, #e2e8f0);
	border-radius: 50px;
	padding: 4px 20px 4px 4px;
	transition: all 0.3s;
}

.raditone-search-box:focus-within {
	border-color: var(--search-accent, #6366f1);
	box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.15);
	background: var(--search-bg, #ffffff);
}

.raditone-search-input {
	flex: 1;
	height: 50px;
	background: transparent;
	border: none;
	outline: none;
	font-size: 1rem;
	color: var(--search-text, #1a1a2e);
	padding: 0 8px;
}

.raditone-search-input::placeholder {
	color: #94a3b8;
}

.raditone-search-btn {
	height: 46px;
	padding: 0 28px;
	background: var(--search-accent, #6366f1);
	color: white;
	border: none;
	border-radius: 50px;
	font-weight: 600;
	display: flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
	transition: all 0.3s;
	white-space: nowrap;
}

.raditone-search-btn:hover {
	background: #4f46e5;
	transform: scale(1.02);
	box-shadow: 0 4px 16px rgba(99, 102, 241, 0.3);
}

/* نتایج هدر */
.raditone-search-results {
	max-width: 1400px;
	margin: 0 auto;
	padding: 0 20px;
}

.raditone-search-results-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 12px 0 20px;
	border-bottom: 1px solid var(--search-border, #e2e8f0);
	margin-bottom: 24px;
}

.raditone-search-count {
	font-size: 0.95rem;
	color: var(--search-section-title, #475569);
}

.raditone-search-count span {
	font-weight: 700;
	color: var(--search-text, #1a1a2e);
}

/* ============================================================ */
/* گرید اصلی – ستون‌های متغیر با استفاده از CSS Grid            */
/* ============================================================ */
.raditone-search-results-container {
	display: grid;
	grid-template-columns: repeat(8, 1fr);
	gap: 16px;
	margin-bottom: 40px;
}

/* بخش هر گروه (پست‌تایپ، تاکسونومی، دسته‌بندی) */
.raditone-search-group {
	grid-column: 1 / -1;
	margin-bottom: 12px;
}

.raditone-search-group-header {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 16px;
	background: var(--search-input-bg, #f8fafc);
	border-radius: 12px;
	margin-bottom: 12px;
	border: 1px solid var(--search-border, #e2e8f0);
	font-weight: 600;
	font-size: 1rem;
	color: var(--search-section-title, #475569);
}

.raditone-search-group-header i {
	color: var(--search-accent, #6366f1);
	font-size: 1.1rem;
}

.raditone-search-group-header .count {
	margin-left: auto;
	font-weight: 400;
	font-size: 0.8rem;
	background: var(--search-bg, #ffffff);
	padding: 0 12px;
	border-radius: 20px;
	color: #94a3b8;
}

/* کانتینر آیتم‌های هر گروه – خودش هم گرید */
.raditone-search-group-items {
	display: grid;
	grid-template-columns: repeat(8, 1fr);
	gap: 16px;
}

/* آیتم نتیجه */
.result-item {
	display: flex;
	flex-direction: column;
	border-radius: 14px;
	overflow: hidden;
	background: var(--search-bg, #ffffff);
	border: 1px solid var(--search-border, #e2e8f0);
	text-decoration: none;
	color: var(--search-text, #1a1a2e);
	transition: all 0.25s ease;
	animation: fadeSlideIn 0.3s ease forwards;
	opacity: 0;
	transform: translateY(10px);
}

.result-item:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 30px rgba(0,0,0,0.08);
	border-color: var(--search-accent, #6366f1);
}

.result-item .result-image {
	position: relative;
	width: 100%;
	padding-top: 100%;
 /* مربع */
	overflow: hidden;
	background: var(--search-border, #e2e8f0);
}

.result-item .result-image img {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s;
}

.result-item:hover .result-image img {
	transform: scale(1.05);
}

.result-item .result-content {
	padding: 12px 14px 14px;
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.result-item .result-title {
	font-weight: 600;
	font-size: 0.9rem;
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	color: var(--search-text, #1a1a2e);
}

.result-item .result-subtitle {
	font-size: 0.8rem;
	color: #94a3b8;
	display: flex;
	align-items: center;
	gap: 6px;
	flex-wrap: wrap;
}

.result-item .result-subtitle span {
	white-space: nowrap;
}

.result-item .result-excerpt {
	font-size: 0.75rem;
	color: #64748b;
	margin-top: 4px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	line-height: 1.4;
	background: var(--search-input-bg, #f8fafc);
	padding: 4px 8px;
	border-radius: 6px;
	border-left: 3px solid var(--search-accent, #6366f1);
}

.result-item .result-type {
	font-size: 0.7rem;
	color: #94a3b8;
	background: var(--search-input-bg, #f8fafc);
	padding: 0 10px;
	border-radius: 20px;
	display: inline-block;
	margin-top: 4px;
	font-weight: 500;
	align-self: flex-start;
}

/* هایلایت */
.search-highlight {
	background: rgba(245, 158, 11, 0.25);
	color: #b45309;
	padding: 0 2px;
	border-radius: 4px;
	font-weight: 600;
}

[data-theme="dark"] .search-highlight {
	background: rgba(245, 158, 11, 0.15);
	color: #fbbf24;
}

/* ============================================================ */
/* واکنش‌گرایی گرید                                             */
/* ============================================================ */
@media (max-width: 1200px) {
	.raditone-search-results-container,
    .raditone-search-group-items {
		grid-template-columns: repeat(6, 1fr);
	}
}

@media (max-width: 992px) {
	.raditone-search-results-container,
    .raditone-search-group-items {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 576px) {
	.raditone-search-results-container,
    .raditone-search-group-items {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
	}

	.raditone-search-box {
		padding: 4px 12px 4px 4px;
	}

	.raditone-search-btn span {
		display: none;
	}

	.raditone-search-btn {
		padding: 0 18px;
		font-size: 1.1rem;
	}

	.raditone-search-title {
		font-size: 1.6rem;
	}
}

/* ============================================================ */
/* لودینگ، خالی، اسکرول                                         */
/* ============================================================ */
.raditone-search-empty,
.raditone-search-loading {
	grid-column: 1 / -1;
	text-align: center;
	padding: 60px 20px;
	color: var(--search-section-title, #475569);
}

.raditone-search-empty-icon {
	font-size: 3rem;
	color: #94a3b8;
	opacity: 0.3;
	margin-bottom: 16px;
}

.raditone-search-empty-title {
	font-size: 1.2rem;
	font-weight: 600;
	margin-bottom: 8px;
	color: var(--search-text, #1a1a2e);
}

.raditone-search-spinner {
	width: 40px;
	height: 40px;
	border: 4px solid var(--search-border, #e2e8f0);
	border-top: 4px solid var(--search-accent, #6366f1);
	border-radius: 50%;
	animation: spin 0.8s linear infinite;
	margin: 0 auto 16px;
}

@keyframes spin {
	to {
		transform: rotate(-360deg);
	}
}

.raditone-search-scroll-trigger {
	grid-column: 1 / -1;
	height: 10px;
	visibility: hidden;
}

@keyframes fadeSlideIn {
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

 /* ============================================================
           استایل‌های کارت زبان/کشور (شبیه نمونه Uiverse)
           با حاشیه مورب و استفاده از متغیرهای CSS قالب
           ============================================================ */
.rt-lang-wrapper {
	background: var(--bg-primary);
	color: var(--text-primary);
	min-height: 100vh;
}
        
        /* ===== هدر ===== */
.rt-lang-header {
	position: relative;
	overflow: hidden;
	padding: 30px 0 20px;
	background: var(--bg-secondary);
	border-bottom: 1px solid var(--border-color);
}

.rt-lang-header-bg {
	position: absolute;
	inset: 0;
	z-index: 1;
	opacity: 0.08;
}

.rt-lang-header-bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rt-lang-header-content {
	position: relative;
	z-index: 2;
}

.rt-lang-breadcrumb {
	display: flex;
	align-items: center;
	gap: 8px;
	justify-content: center;
	margin-bottom: 16px;
	font-size: 13px;
	color: var(--text-secondary);
}

.rt-lang-breadcrumb a {
	color: var(--text-secondary);
	text-decoration: none;
	transition: color 0.2s;
}

.rt-lang-breadcrumb a:hover {
	color: var(--primary);
}

.rt-lang-breadcrumb svg {
	width: 14px;
	height: 14px;
	stroke: currentColor;
}

.rt-lang-header-main {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.rt-lang-icon-wrap {
	width: 64px;
	height: 64px;
	border-radius: 16px;
	background: linear-gradient(-135deg, var(--primary), var(--secondary));
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 12px;
	color: #fff;
}

.rt-lang-icon-wrap svg {
	width: 32px;
	height: 32px;
	stroke: currentColor;
}

.rt-lang-title {
	font-size: clamp(1.8rem, 4vw, 2.8rem);
	font-weight: 800;
	color: var(--text-primary);
	margin-bottom: 4px;
}

.rt-lang-subtitle {
	color: var(--text-tertiary);
	font-size: 0.95rem;
}

.rt-lang-header-actions {
	margin-top: 16px;
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	justify-content: center;
}

.rt-lang-play-all-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 24px;
	background: linear-gradient(-135deg, var(--primary), var(--secondary));
	color: #fff;
	border: none;
	border-radius: 30px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.3s ease;
	box-shadow: 0 4px 15px rgba(99, 102, 241, 0.3);
}

.rt-lang-play-all-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(99, 102, 241, 0.4);
}

.rt-lang-play-all-btn svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

.rt-lang-stats-header {
	display: flex;
	align-items: center;
	gap: 6px;
	color: var(--text-tertiary);
	font-size: 14px;
}

.rt-lang-stats-header svg {
	width: 18px;
	height: 18px;
	stroke: currentColor;
}
        
        /* ===== تولبار ===== */
.rt-lang-toolbar {
	background: var(--bg-secondary);
	border-radius: 20px;
	padding: 12px 18px;
	margin-bottom: 24px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	border: 1px solid var(--border-color);
	box-shadow: 0 4px 16px rgba(0,0,0,0.04);
}

.rt-lang-toolbar-left,
        .rt-lang-toolbar-right {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}

.rt-lang-view-toggle {
	display: flex;
	gap: 4px;
	background: var(--bg-tertiary);
	padding: 4px;
	border-radius: 60px;
	border: 1px solid var(--border-color);
}

.rt-lang-view-btn {
	background: transparent;
	border: none;
	padding: 6px 14px;
	border-radius: 60px;
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 500;
	color: var(--text-secondary);
	transition: all 0.3s ease;
}

.rt-lang-view-btn svg {
	width: 16px;
	height: 16px;
	stroke: currentColor;
}

.rt-lang-view-btn.active {
	background: var(--primary);
	color: #fff;
	box-shadow: 0 4px 12px rgba(99, 102, 241, 0.3);
}

.rt-lang-view-btn.active svg {
	stroke: #fff;
}

.rt-lang-search-wrap {
	position: relative;
	display: flex;
	align-items: center;
}

.rt-lang-search-wrap svg {
	position: absolute;
	left: 12px;
	width: 16px;
	height: 16px;
	stroke: var(--text-tertiary);
}

.rt-lang-search-input {
	padding: 8px 14px 8px 36px;
	border: 2px solid var(--border-color);
	border-radius: 60px;
	background: var(--bg-primary);
	font-size: 13px;
	color: var(--text-primary);
	outline: none;
	transition: border-color 0.3s ease;
	width: 180px;
}

.rt-lang-search-input:focus {
	border-color: var(--primary);
}

.rt-lang-search-input::placeholder {
	color: var(--text-tertiary);
}

.rt-lang-sort-wrap {
	position: relative;
	display: flex;
	align-items: center;
	gap: 6px;
}

.rt-lang-sort-wrap svg {
	width: 16px;
	height: 16px;
	stroke: var(--text-secondary);
}

.rt-lang-sort-select {
	padding: 8px 14px 8px 32px;
	border: 2px solid var(--border-color);
	border-radius: 60px;
	background: var(--bg-primary);
	font-size: 13px;
	font-weight: 500;
	color: var(--text-primary);
	cursor: pointer;
	transition: all 0.3s ease;
	appearance: none;
	outline: none;
}

.rt-lang-sort-select:hover,
        .rt-lang-sort-select:focus {
	border-color: var(--primary);
}

.rt-lang-results {
	font-size: 13px;
	color: var(--text-secondary);
}

.rt-lang-results strong {
	color: var(--text-primary);
}
        
        /* ===== گرید کارت‌ها ===== */
.rt-lang-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;
	margin-top: 8px;
}

@media (max-width: 1200px) {
	.rt-lang-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 768px) {
	.rt-lang-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 14px;
	}
}

@media (max-width: 480px) {
	.rt-lang-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
	}
}
        
        /* ===== حالت لیست ===== */
.rt-lang-grid.list-view {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.rt-lang-grid.list-view .rt-lang-card {
	display: none;
}

.rt-lang-grid.list-view .rt-lang-list-item {
	display: flex !important;
}

.rt-lang-grid:not(.list-view) .rt-lang-list-item {
	display: none !important;
}
        
        /* ===== کارت اصلی (گرید) ===== */
.rt-lang-card {
	position: relative;
	background: var(--bg-primary);
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 2px 12px -2px rgba(0,0,0,0.08);
	transition: all 0.3s ease;
	border: 1px solid var(--border-color);
	display: flex;
	flex-direction: column;
	height: 100%;
}

.rt-lang-card:hover {
	box-shadow: 0 8px 30px rgba(0,0,0,0.12);
	transform: translateY(-3px);
	border-color: var(--primary);
}
        
        /* حاشیه مورب */
.rt-lang-card-border {
	position: absolute;
	inset: 0;
	border-radius: 14px;
	pointer-events: none;
	padding: 1.5px;
	z-index: 5;
	background: linear-gradient(to bottom right, var(--primary) 0%, transparent 40%), linear-gradient(to top left, var(--secondary) 0%, transparent 40%);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
}

.rt-lang-card:hover .rt-lang-card-border {
	opacity: 1;
}

.rt-lang-card-inner {
	display: flex;
	flex-direction: column;
	height: 100%;
	position: relative;
	z-index: 1;
}

.rt-lang-card-link {
	display: block;
	text-decoration: none;
	color: inherit;
}

.rt-lang-card-link:hover {
	text-decoration: none;
}
        
        /* تصویر */
.rt-lang-card-image {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: var(--bg-secondary);
}

.rt-lang-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s ease;
}

.rt-lang-card:hover .rt-lang-card-image img {
	transform: scale(1.05);
}

.rt-lang-card-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(-135deg, var(--primary-light), var(--secondary-light));
	color: var(--primary);
}

.rt-lang-card-placeholder svg {
	width: 48px;
	height: 48px;
	stroke: var(--primary);
}

.rt-lang-card-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.3) 0%, transparent 60%);
	pointer-events: none;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.rt-lang-card:hover .rt-lang-card-overlay {
	opacity: 1;
}

.rt-lang-card-play {
	width: 52px;
	height: 52px;
	background: linear-gradient(-135deg, var(--primary), var(--secondary));
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	transform: scale(0.85);
	transition: transform 0.3s ease;
}

.rt-lang-card-play svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

.rt-lang-card:hover .rt-lang-card-play {
	transform: scale(1);
}
        
        /* برچسب ویژه */
.rt-lang-badge {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 3;
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 4px 10px;
	border-radius: 16px;
	font-size: 10px;
	font-weight: 600;
	color: #fff;
	backdrop-filter: blur(4px);
}

.rt-lang-badge.featured {
	background: linear-gradient(-135deg, #f59e0b, #f97316);
	box-shadow: 0 2px 10px rgba(245, 158, 11, 0.3);
}

.rt-lang-badge svg {
	width: 12px;
	height: 12px;
	stroke: currentColor;
	fill: none;
}
        
        /* محتوا */
.rt-lang-card-content {
	padding: 12px 14px 6px;
	text-align: center;
	flex: 1;
}

.rt-lang-card-title {
	font-size: 15px;
	font-weight: 700;
	color: var(--text-primary);
	line-height: 1.4;
	margin: 0 0 2px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	max-height: 2.8em;
	word-break: break-word;
}

.rt-lang-card-title a {
	color: inherit;
	text-decoration: none;
}

.rt-lang-card-title a:hover {
	color: var(--primary);
}

.rt-lang-card-artist {
	font-size: 12px;
	color: var(--text-tertiary);
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
}

.rt-lang-card-artist svg {
	width: 14px;
	height: 14px;
	stroke: var(--text-tertiary);
}
        
        /* آمار */
.rt-lang-card-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4px;
	padding: 10px 12px 14px;
	border-top: 1px solid var(--border-color);
	background: var(--bg-secondary);
}

.rt-lang-card-stat {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 4px 0;
	border-radius: 6px;
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	transition: background 0.2s;
}

.rt-lang-card:hover .rt-lang-card-stat {
	border-color: var(--primary-light);
}

.rt-lang-stat-icon {
	color: var(--text-tertiary);
	margin-bottom: 2px;
	display: inline-flex;
	align-items: center;
}

.rt-lang-stat-icon svg {
	width: 14px;
	height: 14px;
	stroke: var(--primary);
}

.rt-lang-stat-number {
	font-size: 14px;
	font-weight: 700;
	color: var(--primary);
	line-height: 1.2;
	text-align: center;
}

.rt-lang-stat-label {
	font-size: 9px;
	color: var(--text-tertiary);
	font-weight: 500;
	letter-spacing: 0.02em;
}
        
        /* ===== آیتم لیست ===== */
.rt-lang-list-item {
	display: flex !important;
	align-items: center;
	gap: 14px;
	padding: 10px 14px;
	background: var(--bg-secondary);
	border-radius: 12px;
	border: 1px solid var(--border-color);
	transition: all 0.3s ease;
}

.rt-lang-list-item:hover {
	border-color: var(--primary-light);
	background: var(--bg-primary);
}

.rt-lang-list-number {
	font-size: 13px;
	font-weight: 600;
	color: var(--text-tertiary);
	min-width: 28px;
	text-align: center;
}

.rt-lang-list-thumb {
	position: relative;
	width: 48px;
	height: 48px;
	border-radius: 8px;
	overflow: hidden;
	flex-shrink: 0;
	background: var(--bg-tertiary);
}

.rt-lang-list-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rt-lang-list-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(-135deg, var(--primary-light), var(--secondary-light));
	color: var(--primary);
}

.rt-lang-list-placeholder svg {
	width: 20px;
	height: 20px;
	stroke: currentColor;
}

.rt-lang-list-featured {
	position: absolute;
	top: -4px;
	left: -4px;
	width: 18px;
	height: 18px;
	background: linear-gradient(-135deg, #f59e0b, #f97316);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 2px 6px rgba(245, 158, 11, 0.3);
}

.rt-lang-list-featured svg {
	width: 10px;
	height: 10px;
	stroke: #fff;
	fill: none;
}

.rt-lang-list-info {
	flex: 1;
	min-width: 0;
}

.rt-lang-list-title {
	font-size: 14px;
	font-weight: 600;
	color: var(--text-primary);
	text-decoration: none;
	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: color 0.2s;
}

.rt-lang-list-title:hover {
	color: var(--primary);
}

.rt-lang-list-artist {
	font-size: 12px;
	color: var(--text-tertiary);
	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.rt-lang-list-play {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--primary);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	transition: all 0.3s ease;
	flex-shrink: 0;
}

.rt-lang-list-play:hover {
	transform: scale(1.08);
	box-shadow: 0 4px 15px rgba(99, 102, 241, 0.3);
}

.rt-lang-list-play svg {
	width: 16px;
	height: 16px;
	fill: currentColor;
}
        
        /* ===== صفحه‌بندی ===== */
.rt-lang-pagination {
	margin-top: 40px;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 6px;
}

.rt-lang-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border-radius: 8px;
	background: var(--bg-secondary);
	border: 1px solid var(--border-color);
	color: var(--text-secondary);
	font-weight: 600;
	font-size: 14px;
	transition: all 0.2s;
	text-decoration: none;
}

.rt-lang-pagination .page-numbers.current {
	background: var(--primary);
	color: #fff;
	border-color: var(--primary);
}

.rt-lang-pagination .page-numbers:hover:not(.current) {
	background: var(--primary-light);
	border-color: var(--primary);
	color: var(--primary);
}

.rt-lang-pagination .page-numbers.prev,
        .rt-lang-pagination .page-numbers.next {
	font-size: 0;
	padding: 0 8px;
}

.rt-lang-pagination .page-numbers.prev svg,
        .rt-lang-pagination .page-numbers.next svg {
	width: 20px;
	height: 20px;
	stroke: currentColor;
}
        
        /* ===== خالی ===== */
.rt-lang-empty {
	grid-column: 1 / -1;
	text-align: center;
	padding: 60px 20px;
}

.rt-lang-empty-icon {
	font-size: 48px;
	color: var(--text-tertiary);
	margin-bottom: 16px;
}

.rt-lang-empty-title {
	font-size: 22px;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 8px;
}

.rt-lang-empty-text {
	color: var(--text-secondary);
}
        
        /* ===== شمارنده ===== */
.rt-lang-stats {
	font-size: 14px;
	color: var(--text-secondary);
	padding: 6px 0;
}

.rt-lang-stats-number {
	font-weight: 700;
	color: var(--text-primary);
}
        
        /* ===== انیمیشن fade-in ===== */
.rt-lang-card {
	opacity: 0;
	animation: fadeInUp 0.4s ease forwards;
}

@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.rt-lang-card:nth-child(1) {
	animation-delay: 0.01s;
}

.rt-lang-card:nth-child(2) {
	animation-delay: 0.02s;
}

.rt-lang-card:nth-child(3) {
	animation-delay: 0.03s;
}

.rt-lang-card:nth-child(4) {
	animation-delay: 0.04s;
}

.rt-lang-card:nth-child(5) {
	animation-delay: 0.05s;
}

.rt-lang-card:nth-child(6) {
	animation-delay: 0.06s;
}
        /* ... تا ۳۶ */
        
.rt-lang-list-item {
	opacity: 0;
	animation: fadeInUp 0.3s ease forwards;
}

.rt-lang-list-item:nth-child(1) {
	animation-delay: 0.01s;
}

.rt-lang-list-item:nth-child(2) {
	animation-delay: 0.02s;
}

.rt-lang-list-item:nth-child(3) {
	animation-delay: 0.03s;
}
        /* ... */
        
        /* ===== ریسپانسیو ===== */
@media (max-width: 480px) {
	.rt-lang-card-title {
		font-size: 13px;
	}

	.rt-lang-card-artist {
		font-size: 11px;
	}

	.rt-lang-stat-number {
		font-size: 12px;
	}

	.rt-lang-stat-label {
		font-size: 8px;
	}

	.rt-lang-card-content {
		padding: 8px 10px 4px;
	}

	.rt-lang-card-stats {
		padding: 6px 8px 10px;
		gap: 4px;
	}

	.rt-lang-card-play {
		width: 44px;
		height: 44px;
	}

	.rt-lang-card-play svg {
		width: 18px;
		height: 18px;
	}

	.rt-lang-toolbar {
		flex-direction: column;
		align-items: stretch;
		padding: 12px 14px;
		gap: 10px;
	}

	.rt-lang-toolbar-left, .rt-lang-toolbar-right {
		justify-content: space-between;
		flex-wrap: wrap;
	}

	.rt-lang-view-btn span {
		display: none;
	}

	.rt-lang-view-btn {
		padding: 6px 12px;
	}

	.rt-lang-search-input {
		width: 140px;
		font-size: 12px;
		padding: 6px 10px 6px 30px;
	}

	.rt-lang-sort-select {
		font-size: 12px;
		padding: 6px 10px 6px 28px;
	}

	.rt-lang-header {
		padding: 20px 0 16px;
	}

	.rt-lang-title {
		font-size: 1.5rem;
	}

	.rt-lang-list-item {
		padding: 8px 10px;
		gap: 10px;
	}

	.rt-lang-list-title {
		font-size: 12px;
	}

	.rt-lang-list-artist {
		font-size: 10px;
	}

	.rt-lang-list-thumb {
		width: 40px;
		height: 40px;
	}

	.rt-lang-list-play {
		width: 30px;
		height: 30px;
	}

	.rt-lang-list-play svg {
		width: 14px;
		height: 14px;
	}
}

         /* ============================================================
           استایل‌های کارت خواننده
           ============================================================ */
.rt-singer-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;
	margin-top: 16px;
}

@media (max-width: 1200px) {
	.rt-singer-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 768px) {
	.rt-singer-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 14px;
	}
}

@media (max-width: 480px) {
	.rt-singer-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
	}
}

.rt-singer-card {
	position: relative;
	background: var(--bg-primary);
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 2px 12px -2px rgba(0,0,0,0.08);
	transition: all 0.3s ease;
	border: 1px solid var(--border-color);
	display: flex;
	flex-direction: column;
	height: 100%;
}

.rt-singer-card:hover {
	box-shadow: 0 8px 30px rgba(0,0,0,0.12);
	transform: translateY(-3px);
	border-color: var(--primary);
}

.rt-singer-card-border {
	position: absolute;
	inset: 0;
	border-radius: 14px;
	pointer-events: none;
	padding: 1.5px;
	z-index: 5;
	background: linear-gradient(to bottom right, var(--primary) 0%, transparent 40%), linear-gradient(to top left, var(--secondary) 0%, transparent 40%);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
}

.rt-singer-card:hover .rt-singer-card-border {
	opacity: 1;
}

.rt-singer-card-inner {
	display: flex;
	flex-direction: column;
	height: 100%;
	position: relative;
	z-index: 1;
}

.rt-singer-card-link {
	display: block;
	text-decoration: none;
	color: inherit;
}

.rt-singer-card-link:hover {
	text-decoration: none;
}

.rt-singer-card-image {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: var(--bg-secondary);
}

.rt-singer-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s ease;
}

.rt-singer-card:hover .rt-singer-card-image img {
	transform: scale(1.05);
}

.rt-singer-card-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.3) 0%, transparent 60%);
	pointer-events: none;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.rt-singer-card:hover .rt-singer-card-overlay {
	opacity: 1;
}

.rt-singer-card-play {
	width: 52px;
	height: 52px;
	background: linear-gradient(-135deg, var(--primary), var(--secondary));
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	transform: scale(0.85);
	transition: transform 0.3s ease;
	border: none;
	cursor: pointer;
}

.rt-singer-card-play svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

.rt-singer-card:hover .rt-singer-card-play {
	transform: scale(1);
}

.rt-singer-card-date {
	position: absolute;
	bottom: 10px;
	left: 10px;
	z-index: 3;
	padding: 4px 10px;
	border-radius: 12px;
	background: rgba(0,0,0,0.6);
	color: #fff;
	font-size: 10px;
	font-weight: 500;
	backdrop-filter: blur(4px);
}

.rt-singer-card-content {
	padding: 12px 14px 6px;
	text-align: center;
	flex: 1;
}

.rt-singer-card-title {
	font-size: 15px;
	font-weight: 700;
	color: var(--text-primary);
	line-height: 1.4;
	margin: 0 0 2px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	max-height: 2.8em;
	word-break: break-word;
}

.rt-singer-card-title a {
	color: inherit;
	text-decoration: none;
}

.rt-singer-card-title a:hover {
	color: var(--primary);
}

.rt-singer-card-artist {
	font-size: 12px;
	color: var(--text-tertiary);
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
}

.rt-singer-card-artist svg {
	width: 14px;
	height: 14px;
	stroke: var(--text-tertiary);
}

.rt-singer-card-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4px;
	padding: 10px 12px 14px;
	border-top: 1px solid var(--border-color);
	background: var(--bg-secondary);
}

.rt-singer-card-stat {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 4px 0;
	border-radius: 6px;
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	transition: background 0.2s;
}

.rt-singer-card:hover .rt-singer-card-stat {
	border-color: var(--primary-light);
}

.rt-singer-stat-icon {
	color: var(--text-tertiary);
	margin-bottom: 2px;
	display: inline-flex;
	align-items: center;
}

.rt-singer-stat-icon svg {
	width: 14px;
	height: 14px;
	stroke: var(--primary);
}

.rt-singer-stat-number {
	font-size: 14px;
	font-weight: 700;
	color: var(--primary);
	line-height: 1.2;
	text-align: center;
}

.rt-singer-stat-label {
	font-size: 9px;
	color: var(--text-tertiary);
	font-weight: 500;
	letter-spacing: 0.02em;
}

        /* ===== صفحه‌بندی ===== */
.rt-singer-pagination {
	margin-top: 40px;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 6px;
}

.rt-singer-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border-radius: 8px;
	background: var(--bg-secondary);
	border: 1px solid var(--border-color);
	color: var(--text-secondary);
	font-weight: 600;
	font-size: 14px;
	transition: all 0.2s;
	text-decoration: none;
}

.rt-singer-pagination .page-numbers.current {
	background: var(--primary);
	color: #fff;
	border-color: var(--primary);
}

.rt-singer-pagination .page-numbers:hover:not(.current) {
	background: var(--primary-light);
	border-color: var(--primary);
	color: var(--primary);
}

.rt-singer-pagination .page-numbers.prev,
        .rt-singer-pagination .page-numbers.next {
	font-size: 0;
	padding: 0 8px;
}

.rt-singer-pagination .page-numbers.prev svg,
        .rt-singer-pagination .page-numbers.next svg {
	width: 20px;
	height: 20px;
	stroke: currentColor;
}

        /* ===== بیوگرافی با افکت محو ===== */
.rt-singer-bio-wrapper {
	position: relative;
	max-height: 120px;
	overflow: hidden;
	transition: max-height 0.6s ease;
}

.rt-singer-bio-wrapper.expanded {
	max-height: 2000px;
}

.rt-singer-bio-wrapper .rt-singer-bio-fade {
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
	height: 60px;
	background: linear-gradient(to top, var(--bg-secondary), transparent);
	pointer-events: none;
	transition: opacity 0.4s ease;
}

.rt-singer-bio-wrapper.expanded .rt-singer-bio-fade {
	opacity: 0;
}

.singer-toggle-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	gap: 15px;
	margin-top: 20px;
}

.rt-singer-bio-toggle {
	flex-shrink: 0;
	cursor: pointer;
	color: var(--primary);
	font-weight: 600;
	font-size: 14px;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-top: 4px;
	transition: color 0.2s;
	background: none;
	border: none;
	justify-content: center;
}

.line {
	flex: 1;
	height: 2px;
	background: var(--primary);
}

.line-left {
	background: linear-gradient(to left, var(--primary), transparent);
}

.line-right {
	background: linear-gradient(to right, var(--primary), transparent);
}

.rt-singer-bio-toggle:hover {
	color: var(--primary-hover);
}

.rt-singer-bio-toggle svg {
	display: none;
	width: 16px;
	height: 16px;
	stroke: currentColor;
	transition: transform 0.3s ease;
}

.rt-singer-bio-toggle.expanded svg {
	transform: rotate(-180deg);
}

        /* ===== انیمیشن fade-in ===== */
.rt-singer-card {
	opacity: 0;
	animation: fadeInUp 0.4s ease forwards;
}

@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.rt-singer-card:nth-child(1) {
	animation-delay: 0.01s;
}

.rt-singer-card:nth-child(2) {
	animation-delay: 0.02s;
}

.rt-singer-card:nth-child(3) {
	animation-delay: 0.03s;
}

.rt-singer-card:nth-child(4) {
	animation-delay: 0.04s;
}

.rt-singer-card:nth-child(5) {
	animation-delay: 0.05s;
}

.rt-singer-card:nth-child(6) {
	animation-delay: 0.06s;
}

        /* ===== تب‌ها ===== */
.rt-singer-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	padding: 4px;
	background: var(--bg-secondary);
	border-radius: 14px;
	border: 1px solid var(--border-color);
}

.rt-singer-tab {
	padding: 10px 20px;
	border-radius: 10px;
	font-size: 14px;
	font-weight: 600;
	color: var(--text-secondary);
	cursor: pointer;
	transition: all 0.3s ease;
	background: transparent;
	border: none;
	display: flex;
	align-items: center;
	gap: 6px;
}

.rt-singer-tab:hover {
	color: var(--text-primary);
	background: var(--bg-tertiary);
}

.rt-singer-tab.active {
	background: var(--primary);
	color: #fff;
	box-shadow: 0 4px 15px rgba(99, 102, 241, 0.3);
}

.rt-singer-tab svg {
	width: 18px;
	height: 18px;
	stroke: currentColor;
}

.rt-singer-tab .rt-singer-tab-badge {
	background: var(--bg-tertiary);
	padding: 1px 8px;
	border-radius: 12px;
	font-size: 11px;
	font-weight: 600;
}

.rt-singer-tab.active .rt-singer-tab-badge {
	background: rgba(255,255,255,0.2);
	color: #fff;
}

.rt-singer-empty {
	grid-column: 1 / -1;
	text-align: center;
	padding: 60px 20px;
	color: var(--text-tertiary);
}

@media (max-width: 480px) {
	.rt-singer-card-title {
		font-size: 13px;
	}

	.rt-singer-card-artist {
		font-size: 11px;
	}

	.rt-singer-stat-number {
		font-size: 12px;
	}

	.rt-singer-stat-label {
		font-size: 8px;
	}

	.rt-singer-card-content {
		padding: 8px 10px 4px;
	}

	.rt-singer-card-stats {
		padding: 6px 8px 10px;
		gap: 4px;
	}

	.rt-singer-card-play {
		width: 44px;
		height: 44px;
	}

	.rt-singer-card-play svg {
		width: 18px;
		height: 18px;
	}

	.rt-singer-tab {
		font-size: 12px;
		padding: 6px 12px;
	}

}

        /* ============================================================
           استایل‌های کارت سبک (شبیه نمونه Uiverse)
           با حاشیه مورب و استفاده از متغیرهای CSS قالب
           ============================================================ */
.rt-style-wrapper {
	background: var(--bg-primary);
	color: var(--text-primary);
	min-height: 100vh;
}

.rt-style-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;
	margin-top: 24px;
}

@media (max-width: 1200px) {
	.rt-style-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 768px) {
	.rt-style-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 14px;
	}
}

@media (max-width: 480px) {
	.rt-style-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
	}
}

        /* ===== حالت لیست ===== */
.rt-style-grid.list-view {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.rt-style-grid.list-view .rt-style-card {
	display: none;
}

.rt-style-grid.list-view .rt-style-list-item {
	display: flex !important;
}

.rt-style-grid:not(.list-view) .rt-style-list-item {
	display: none !important;
}

        /* ===== کارت اصلی ===== */
.rt-style-card {
	position: relative;
	background: var(--bg-primary);
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 2px 12px -2px rgba(0,0,0,0.08);
	transition: all 0.3s ease;
	border: 1px solid var(--border-color);
	display: flex;
	flex-direction: column;
	height: 100%;
}

.rt-style-card:hover {
	box-shadow: 0 8px 30px rgba(0,0,0,0.12);
	transform: translateY(-3px);
	border-color: var(--primary);
}

.rt-style-card-border {
	position: absolute;
	inset: 0;
	border-radius: 14px;
	pointer-events: none;
	padding: 1.5px;
	z-index: 5;
	background: linear-gradient(to bottom right, var(--primary) 0%, transparent 40%), linear-gradient(to top left, var(--secondary) 0%, transparent 40%);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
}

.rt-style-card:hover .rt-style-card-border {
	opacity: 1;
}

.rt-style-card-inner {
	display: flex;
	flex-direction: column;
	height: 100%;
	position: relative;
	z-index: 1;
}

.rt-style-card-link {
	display: block;
	text-decoration: none;
	color: inherit;
}

.rt-style-card-link:hover {
	text-decoration: none;
}

.rt-style-card-image {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: var(--bg-secondary);
}

.rt-style-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s ease;
}

.rt-style-card:hover .rt-style-card-image img {
	transform: scale(1.05);
}

.rt-style-card-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(-135deg, var(--primary-light), var(--secondary-light));
	color: var(--primary);
}

.rt-style-card-placeholder svg {
	width: 48px;
	height: 48px;
	stroke: var(--primary);
}

.rt-style-card-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.3) 0%, transparent 60%);
	pointer-events: none;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.rt-style-card:hover .rt-style-card-overlay {
	opacity: 1;
}

.rt-style-card-play {
	width: 52px;
	height: 52px;
	background: linear-gradient(-135deg, var(--primary), var(--secondary));
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	transform: scale(0.85);
	transition: transform 0.3s ease;
}

.rt-style-card-play svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

.rt-style-card:hover .rt-style-card-play {
	transform: scale(1);
}

.rt-style-badge {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 3;
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 4px 10px;
	border-radius: 16px;
	font-size: 10px;
	font-weight: 600;
	color: #fff;
	backdrop-filter: blur(4px);
}

.rt-style-badge.featured {
	background: linear-gradient(-135deg, #f59e0b, #f97316);
	box-shadow: 0 2px 10px rgba(245, 158, 11, 0.3);
}

.rt-style-badge svg {
	width: 12px;
	height: 12px;
	stroke: currentColor;
	fill: none;
}

.rt-style-card-content {
	padding: 12px 14px 6px;
	text-align: center;
	flex: 1;
}

.rt-style-card-title {
	font-size: 15px;
	font-weight: 700;
	color: var(--text-primary);
	line-height: 1.4;
	margin: 0 0 2px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	max-height: 2.8em;
	word-break: break-word;
}

.rt-style-card-title a {
	color: inherit;
	text-decoration: none;
}

.rt-style-card-title a:hover {
	color: var(--primary);
}

.rt-style-card-artist {
	font-size: 12px;
	color: var(--text-tertiary);
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
}

.rt-style-card-artist svg {
	width: 14px;
	height: 14px;
	stroke: var(--text-tertiary);
}

.rt-style-card-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4px;
	padding: 10px 12px 14px;
	border-top: 1px solid var(--border-color);
	background: var(--bg-secondary);
}

.rt-style-card-stat {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 4px 0;
	border-radius: 6px;
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	transition: background 0.2s;
}

.rt-style-card:hover .rt-style-card-stat {
	border-color: var(--primary-light);
}

.rt-style-stat-icon {
	color: var(--text-tertiary);
	margin-bottom: 2px;
	display: inline-flex;
	align-items: center;
}

.rt-style-stat-icon svg {
	width: 14px;
	height: 14px;
	stroke: var(--primary);
}

.rt-style-stat-number {
	font-size: 14px;
	font-weight: 700;
	color: var(--primary);
	line-height: 1.2;
	text-align: center;
}

.rt-style-stat-label {
	font-size: 9px;
	color: var(--text-tertiary);
	font-weight: 500;
	letter-spacing: 0.02em;
}

        /* ===== آیتم لیست ===== */
.rt-style-list-item {
	display: flex !important;
	align-items: center;
	gap: 14px;
	padding: 10px 14px;
	background: var(--bg-secondary);
	border-radius: 12px;
	border: 1px solid var(--border-color);
	transition: all 0.3s ease;
}

.rt-style-list-item:hover {
	border-color: var(--primary-light);
	background: var(--bg-primary);
}

.rt-style-list-number {
	font-size: 13px;
	font-weight: 600;
	color: var(--text-tertiary);
	min-width: 28px;
	text-align: center;
}

.rt-style-list-thumb {
	position: relative;
	width: 48px;
	height: 48px;
	border-radius: 8px;
	overflow: hidden;
	flex-shrink: 0;
	background: var(--bg-tertiary);
}

.rt-style-list-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rt-style-list-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(-135deg, var(--primary-light), var(--secondary-light));
	color: var(--primary);
}

.rt-style-list-placeholder svg {
	width: 20px;
	height: 20px;
	stroke: currentColor;
}

.rt-style-list-featured {
	position: absolute;
	top: -4px;
	left: -4px;
	width: 18px;
	height: 18px;
	background: linear-gradient(-135deg, #f59e0b, #f97316);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 2px 6px rgba(245, 158, 11, 0.3);
}

.rt-style-list-featured svg {
	width: 10px;
	height: 10px;
	stroke: #fff;
	fill: none;
}

.rt-style-list-info {
	flex: 1;
	min-width: 0;
}

.rt-style-list-title {
	font-size: 14px;
	font-weight: 600;
	color: var(--text-primary);
	text-decoration: none;
	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: color 0.2s;
}

.rt-style-list-title:hover {
	color: var(--primary);
}

.rt-style-list-artist {
	font-size: 12px;
	color: var(--text-tertiary);
	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.rt-style-list-play {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--primary);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	transition: all 0.3s ease;
	flex-shrink: 0;
}

.rt-style-list-play:hover {
	transform: scale(1.08);
	box-shadow: 0 4px 15px rgba(99, 102, 241, 0.3);
}

.rt-style-list-play svg {
	width: 16px;
	height: 16px;
	fill: currentColor;
}

        /* ===== صفحه‌بندی ===== */
.rt-style-pagination {
	margin-top: 40px;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 6px;
}

.rt-style-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border-radius: 8px;
	background: var(--bg-secondary);
	border: 1px solid var(--border-color);
	color: var(--text-secondary);
	font-weight: 600;
	font-size: 14px;
	transition: all 0.2s;
	text-decoration: none;
}

.rt-style-pagination .page-numbers.current {
	background: var(--primary);
	color: #fff;
	border-color: var(--primary);
}

.rt-style-pagination .page-numbers:hover:not(.current) {
	background: var(--primary-light);
	border-color: var(--primary);
	color: var(--primary);
}

.rt-style-pagination .page-numbers.prev,
        .rt-style-pagination .page-numbers.next {
	font-size: 0;
	padding: 0 8px;
}

.rt-style-pagination .page-numbers.prev svg,
        .rt-style-pagination .page-numbers.next svg {
	width: 20px;
	height: 20px;
	stroke: currentColor;
}

        /* ===== خالی ===== */
.rt-style-empty {
	grid-column: 1 / -1;
	text-align: center;
	padding: 60px 20px;
}

.rt-style-empty-icon {
	font-size: 48px;
	color: var(--text-tertiary);
	margin-bottom: 16px;
}

.rt-style-empty-title {
	font-size: 22px;
	font-weight: 700;
	color: var(--text-primary);
	margin-bottom: 8px;
}

.rt-style-empty-text {
	color: var(--text-secondary);
}

        /* ===== هدر ===== */
.rt-style-header {
	position: relative;
	overflow: hidden;
	padding: 30px 0 20px;
	background: var(--bg-secondary);
	border-bottom: 1px solid var(--border-color);
}

.rt-style-header-bg {
	position: absolute;
	inset: 0;
	z-index: 1;
	opacity: 0.08;
}

.rt-style-header-bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rt-style-header-content {
	position: relative;
	z-index: 2;
}

.rt-style-breadcrumb {
	display: flex;
	align-items: center;
	gap: 8px;
	justify-content: center;
	margin-bottom: 16px;
	font-size: 13px;
	color: var(--text-secondary);
}

.rt-style-breadcrumb a {
	color: var(--text-secondary);
	text-decoration: none;
	transition: color 0.2s;
}

.rt-style-breadcrumb a:hover {
	color: var(--primary);
}

.rt-style-breadcrumb svg {
	width: 14px;
	height: 14px;
	stroke: currentColor;
}

.rt-style-header-main {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.rt-style-icon-wrap {
	width: 64px;
	height: 64px;
	border-radius: 16px;
	background: linear-gradient(-135deg, var(--primary), var(--secondary));
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 12px;
	color: #fff;
}

.rt-style-icon-wrap svg {
	width: 32px;
	height: 32px;
	stroke: currentColor;
}

.rt-style-title {
	font-size: clamp(1.8rem, 4vw, 2.8rem);
	font-weight: 800;
	color: var(--text-primary);
	margin-bottom: 4px;
}

.rt-style-subtitle {
	color: var(--text-tertiary);
	font-size: 0.95rem;
	max-width: 600px;
	margin: 0 auto;
}

.rt-style-header-actions {
	margin-top: 16px;
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	justify-content: center;
}

.rt-style-play-all-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 24px;
	background: linear-gradient(-135deg, var(--primary), var(--secondary));
	color: #fff;
	border: none;
	border-radius: 30px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.3s ease;
	box-shadow: 0 4px 15px rgba(99, 102, 241, 0.3);
}

.rt-style-play-all-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(99, 102, 241, 0.4);
}

.rt-style-play-all-btn svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

.rt-style-stats-header {
	display: flex;
	align-items: center;
	gap: 6px;
	color: var(--text-tertiary);
	font-size: 14px;
}

.rt-style-stats-header svg {
	width: 18px;
	height: 18px;
	stroke: currentColor;
}

        /* ===== تولبار ===== */
.rt-style-toolbar {
	background: var(--bg-secondary);
	border-radius: 20px;
	padding: 12px 18px;
	margin-bottom: 24px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	border: 1px solid var(--border-color);
	box-shadow: 0 4px 16px rgba(0,0,0,0.04);
}

.rt-style-toolbar-left,
        .rt-style-toolbar-right {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}

.rt-style-view-toggle {
	display: flex;
	gap: 4px;
	background: var(--bg-tertiary);
	padding: 4px;
	border-radius: 60px;
	border: 1px solid var(--border-color);
}

.rt-style-view-btn {
	background: transparent;
	border: none;
	padding: 6px 14px;
	border-radius: 60px;
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 500;
	color: var(--text-secondary);
	transition: all 0.3s ease;
}

.rt-style-view-btn svg {
	width: 16px;
	height: 16px;
	stroke: currentColor;
}

.rt-style-view-btn.active {
	background: var(--primary);
	color: #fff;
	box-shadow: 0 4px 12px rgba(99, 102, 241, 0.3);
}

.rt-style-view-btn.active svg {
	stroke: #fff;
}

.rt-style-search-wrap {
	position: relative;
	display: flex;
	align-items: center;
}

.rt-style-search-wrap svg {
	position: absolute;
	left: 12px;
	width: 16px;
	height: 16px;
	stroke: var(--text-tertiary);
}

.rt-style-search-input {
	padding: 8px 14px 8px 36px;
	border: 2px solid var(--border-color);
	border-radius: 60px;
	background: var(--bg-primary);
	font-size: 13px;
	color: var(--text-primary);
	outline: none;
	transition: border-color 0.3s ease;
	width: 180px;
}

.rt-style-search-input:focus {
	border-color: var(--primary);
}

.rt-style-search-input::placeholder {
	color: var(--text-tertiary);
}

.rt-style-sort-wrap {
	position: relative;
	display: flex;
	align-items: center;
	gap: 6px;
}

.rt-style-sort-wrap svg {
	width: 16px;
	height: 16px;
	stroke: var(--text-secondary);
}

.rt-style-sort-select {
	padding: 8px 14px 8px 32px;
	border: 2px solid var(--border-color);
	border-radius: 60px;
	background: var(--bg-primary);
	font-size: 13px;
	font-weight: 500;
	color: var(--text-primary);
	cursor: pointer;
	transition: all 0.3s ease;
	appearance: none;
	outline: none;
}

.rt-style-sort-select:hover,
        .rt-style-sort-select:focus {
	border-color: var(--primary);
}

.rt-style-results {
	font-size: 13px;
	color: var(--text-secondary);
}

.rt-style-results strong {
	color: var(--text-primary);
}

        /* ===== انیمیشن fade-in ===== */
.rt-style-card {
	opacity: 0;
	animation: fadeInUp 0.4s ease forwards;
}

@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.rt-style-card:nth-child(1) {
	animation-delay: 0.01s;
}

.rt-style-card:nth-child(2) {
	animation-delay: 0.02s;
}

.rt-style-card:nth-child(3) {
	animation-delay: 0.03s;
}

.rt-style-card:nth-child(4) {
	animation-delay: 0.04s;
}

.rt-style-card:nth-child(5) {
	animation-delay: 0.05s;
}

.rt-style-card:nth-child(6) {
	animation-delay: 0.06s;
}
        /* ... تا ۳۶ */

.rt-style-list-item {
	opacity: 0;
	animation: fadeInUp 0.3s ease forwards;
}

.rt-style-list-item:nth-child(1) {
	animation-delay: 0.01s;
}

.rt-style-list-item:nth-child(2) {
	animation-delay: 0.02s;
}

.rt-style-list-item:nth-child(3) {
	animation-delay: 0.03s;
}

.rt-style-list-item:nth-child(4) {
	animation-delay: 0.04s;
}

.rt-style-list-item:nth-child(5) {
	animation-delay: 0.05s;
}

.rt-style-list-item:nth-child(6) {
	animation-delay: 0.06s;
}

        /* ===== ریسپانسیو ===== */
@media (max-width: 480px) {
	.rt-style-card-title {
		font-size: 13px;
	}

	.rt-style-card-artist {
		font-size: 11px;
	}

	.rt-style-stat-number {
		font-size: 12px;
	}

	.rt-style-stat-label {
		font-size: 8px;
	}

	.rt-style-card-content {
		padding: 8px 10px 4px;
	}

	.rt-style-card-stats {
		padding: 6px 8px 10px;
		gap: 4px;
	}

	.rt-style-card-play {
		width: 44px;
		height: 44px;
	}

	.rt-style-card-play svg {
		width: 18px;
		height: 18px;
	}

	.rt-style-toolbar {
		flex-direction: column;
		align-items: stretch;
		padding: 12px 14px;
		gap: 10px;
	}

	.rt-style-toolbar-left, .rt-style-toolbar-right {
		justify-content: space-between;
		flex-wrap: wrap;
	}

	.rt-style-view-btn span {
		display: none;
	}

	.rt-style-view-btn {
		padding: 6px 12px;
	}

	.rt-style-search-input {
		width: 140px;
		font-size: 12px;
		padding: 6px 10px 6px 30px;
	}

	.rt-style-sort-select {
		font-size: 12px;
		padding: 6px 10px 6px 28px;
	}

	.rt-style-header {
		padding: 20px 0 16px;
	}

	.rt-style-title {
		font-size: 1.5rem;
	}

	.rt-style-list-item {
		padding: 8px 10px;
		gap: 10px;
	}

	.rt-style-list-title {
		font-size: 12px;
	}

	.rt-style-list-artist {
		font-size: 10px;
	}

	.rt-style-list-thumb {
		width: 40px;
		height: 40px;
	}

	.rt-style-list-play {
		width: 30px;
		height: 30px;
	}

	.rt-style-list-play svg {
		width: 14px;
		height: 14px;
	}
}

        /* ============================================================
           استایل‌های کارت خواننده (شبیه نمونه Uiverse)
           با حاشیه مورب و استفاده از متغیرهای CSS قالب
           ============================================================ */
.rt-singer-archive-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;
	margin-top: 24px;
}

@media (max-width: 1200px) {
	.rt-singer-archive-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 768px) {
	.rt-singer-archive-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 14px;
	}
}

@media (max-width: 480px) {
	.rt-singer-archive-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
	}
}

        /* کارت اصلی */
.rt-singer-archive-card {
	position: relative;
	background: var(--bg-primary);
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 2px 12px -2px rgba(0,0,0,0.08);
	transition: all 0.3s ease;
	border: 1px solid var(--border-color);
	display: flex;
	flex-direction: column;
	height: 100%;
}

.rt-singer-archive-card:hover {
	box-shadow: 0 8px 30px rgba(0,0,0,0.12);
	transform: translateY(-3px);
	border-color: var(--primary);
}

.rt-singer-archive-card-border {
	position: absolute;
	inset: 0;
	border-radius: 14px;
	pointer-events: none;
	padding: 1.5px;
	z-index: 5;
	background: linear-gradient(to bottom right, var(--primary) 0%, transparent 40%), linear-gradient(to top left, var(--secondary) 0%, transparent 40%);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
}

.rt-singer-archive-card:hover .rt-singer-archive-card-border {
	opacity: 1;
}

.rt-singer-archive-card-inner {
	display: flex;
	flex-direction: column;
	height: 100%;
	position: relative;
	z-index: 1;
}

.rt-singer-archive-card-link {
	display: block;
	text-decoration: none;
	color: inherit;
}

.rt-singer-archive-card-link:hover {
	text-decoration: none;
}

.rt-singer-archive-card-image {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: var(--bg-secondary);
}

.rt-singer-archive-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s ease;
}

.rt-singer-archive-card:hover .rt-singer-archive-card-image img {
	transform: scale(1.05);
}

.rt-singer-archive-card-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.3) 0%, transparent 60%);
	pointer-events: none;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.rt-singer-archive-card:hover .rt-singer-archive-card-overlay {
	opacity: 1;
}

.rt-singer-archive-card-play {
	width: 52px;
	height: 52px;
	background: linear-gradient(-135deg, var(--primary), var(--secondary));
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	transform: scale(0.85);
	transition: transform 0.3s ease;
}

.rt-singer-archive-card-play svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

.rt-singer-archive-card:hover .rt-singer-archive-card-play {
	transform: scale(1);
}

.rt-singer-archive-card-badge {
	position: absolute;
	bottom: 10px;
	left: 10px;
	z-index: 3;
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 4px 10px;
	border-radius: 16px;
	background: rgba(0,0,0,0.65);
	color: #fff;
	font-size: 10px;
	font-weight: 500;
	backdrop-filter: blur(4px);
}

.rt-singer-archive-card-badge svg {
	width: 12px;
	height: 12px;
	stroke: currentColor;
}

.rt-singer-archive-card-content {
	padding: 12px 14px 6px;
	text-align: center;
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.rt-singer-archive-card-title {
	font-size: 15px;
	font-weight: 700;
	color: var(--text-primary);
	line-height: 1.4;
	margin: 0 0 2px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	max-height: 2.8em;
	word-break: break-word;
}

.rt-singer-archive-card-artist {
	font-size: 12px;
	color: var(--text-tertiary);
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.rt-singer-archive-card-action {
	margin-top: 8px;
	padding-top: 8px;
	border-top: 1px solid var(--border-color);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 600;
	color: var(--primary);
	transition: all 0.2s;
}

.rt-singer-archive-card-action svg {
	stroke: var(--primary);
	transition: transform 0.2s;
}

.rt-singer-archive-card:hover .rt-singer-archive-card-action svg {
	transform: translateX(3px);
}

        /* ===== صفحه‌بندی ===== */
.rt-singer-archive-pagination {
	margin-top: 40px;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 6px;
}

.rt-singer-archive-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border-radius: 8px;
	background: var(--bg-secondary);
	border: 1px solid var(--border-color);
	color: var(--text-secondary);
	font-weight: 600;
	font-size: 14px;
	transition: all 0.2s;
	text-decoration: none;
}

.rt-singer-archive-pagination .page-numbers.current {
	background: var(--primary);
	color: #fff;
	border-color: var(--primary);
}

.rt-singer-archive-pagination .page-numbers:hover:not(.current) {
	background: var(--primary-light);
	border-color: var(--primary);
	color: var(--primary);
}

.rt-singer-archive-pagination .page-numbers.prev,
        .rt-singer-archive-pagination .page-numbers.next {
	font-size: 0;
	padding: 0 8px;
}

.rt-singer-archive-pagination .page-numbers.prev svg,
        .rt-singer-archive-pagination .page-numbers.next svg {
	width: 20px;
	height: 20px;
	stroke: currentColor;
}

        /* ===== هدر و فیلترها ===== */
.header-amar .amar-archive {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 8px 16px;
	background: var(--bg-secondary);
	border-radius: 12px;
	border: 1px solid var(--border-color);
}

.header-amar .amar-archive svg {
	color: var(--primary);
	width: 28px;
	height: 28px;
	margin-bottom: 4px;
}

.rt-singer-archive-filters {
	display: grid;
	grid-template-columns: 1fr 0.8fr 0.8fr;
	gap: 16px;
}

@media (max-width: 768px) {
	.rt-singer-archive-filters {
		grid-template-columns: 1fr;
		gap: 12px;
	}
}

.rt-singer-archive-filter-item {
	position: relative;
	display: flex;
	align-items: center;
}

.rt-singer-archive-filter-item svg {
	position: absolute;
	left: 14px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--text-tertiary);
	width: 18px;
	height: 18px;
	pointer-events: none;
}

.rt-singer-archive-filter-item input,
        .rt-singer-archive-filter-item select {
	width: 100%;
	padding: 10px 14px 10px 42px;
	background: var(--bg-tertiary);
	border: 1px solid var(--border-color);
	border-radius: 12px;
	color: var(--text-primary);
	font-size: 0.85rem;
	outline: none;
	transition: border-color 0.2s;
	appearance: none;
}

.rt-singer-archive-filter-item input:focus,
        .rt-singer-archive-filter-item select:focus {
	border-color: var(--primary);
}

        /* ===== انیمیشن fade-in ===== */
.rt-singer-archive-card {
	opacity: 0;
	animation: fadeInUp 0.4s ease forwards;
}

@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.rt-singer-archive-card:nth-child(1) {
	animation-delay: 0.01s;
}

.rt-singer-archive-card:nth-child(2) {
	animation-delay: 0.02s;
}

.rt-singer-archive-card:nth-child(3) {
	animation-delay: 0.03s;
}

.rt-singer-archive-card:nth-child(4) {
	animation-delay: 0.04s;
}

.rt-singer-archive-card:nth-child(5) {
	animation-delay: 0.05s;
}

.rt-singer-archive-card:nth-child(6) {
	animation-delay: 0.06s;
}

.rt-singer-archive-card:nth-child(7) {
	animation-delay: 0.07s;
}

.rt-singer-archive-card:nth-child(8) {
	animation-delay: 0.08s;
}

.rt-singer-archive-card:nth-child(9) {
	animation-delay: 0.09s;
}

.rt-singer-archive-card:nth-child(10) {
	animation-delay: 0.10s;
}

.rt-singer-archive-card:nth-child(11) {
	animation-delay: 0.11s;
}

.rt-singer-archive-card:nth-child(12) {
	animation-delay: 0.12s;
}

.rt-singer-archive-card:nth-child(13) {
	animation-delay: 0.13s;
}

.rt-singer-archive-card:nth-child(14) {
	animation-delay: 0.14s;
}

.rt-singer-archive-card:nth-child(15) {
	animation-delay: 0.15s;
}

.rt-singer-archive-card:nth-child(16) {
	animation-delay: 0.16s;
}

.rt-singer-archive-card:nth-child(17) {
	animation-delay: 0.17s;
}

.rt-singer-archive-card:nth-child(18) {
	animation-delay: 0.18s;
}

.rt-singer-archive-card:nth-child(19) {
	animation-delay: 0.19s;
}

.rt-singer-archive-card:nth-child(20) {
	animation-delay: 0.20s;
}

.rt-singer-archive-card:nth-child(21) {
	animation-delay: 0.21s;
}

.rt-singer-archive-card:nth-child(22) {
	animation-delay: 0.22s;
}

.rt-singer-archive-card:nth-child(23) {
	animation-delay: 0.23s;
}

.rt-singer-archive-card:nth-child(24) {
	animation-delay: 0.24s;
}

.rt-singer-archive-card:nth-child(25) {
	animation-delay: 0.25s;
}

.rt-singer-archive-card:nth-child(26) {
	animation-delay: 0.26s;
}

.rt-singer-archive-card:nth-child(27) {
	animation-delay: 0.27s;
}

.rt-singer-archive-card:nth-child(28) {
	animation-delay: 0.28s;
}

.rt-singer-archive-card:nth-child(29) {
	animation-delay: 0.29s;
}

.rt-singer-archive-card:nth-child(30) {
	animation-delay: 0.30s;
}

.rt-singer-archive-card:nth-child(31) {
	animation-delay: 0.31s;
}

.rt-singer-archive-card:nth-child(32) {
	animation-delay: 0.32s;
}

.rt-singer-archive-card:nth-child(33) {
	animation-delay: 0.33s;
}

.rt-singer-archive-card:nth-child(34) {
	animation-delay: 0.34s;
}

.rt-singer-archive-card:nth-child(35) {
	animation-delay: 0.35s;
}

.rt-singer-archive-card:nth-child(36) {
	animation-delay: 0.36s;
}

@media (max-width: 480px) {
	.rt-singer-archive-card-title {
		font-size: 13px;
	}

	.rt-singer-archive-card-artist {
		font-size: 11px;
	}

	.rt-singer-archive-card-action {
		font-size: 11px;
	}

	.rt-singer-archive-card-play {
		width: 44px;
		height: 44px;
	}

	.rt-singer-archive-card-play svg {
		width: 18px;
		height: 18px;
	}

	.rt-singer-archive-card-content {
		padding: 8px 10px 4px;
	}

	.rt-singer-archive-card-badge {
		font-size: 9px;
		padding: 3px 8px;
	}
}

/* ==========================================================================
   بهینه‌سازی گرافیک نتایج جستجوی هدر — نسخه ارتقا یافته
   (با اسکوپ به دراپ‌داون جستجو — بدون تأثیر بر صفحه نتایج)
   ========================================================================== */
.search-results-dropdown {
	scrollbar-width: thin;
	scrollbar-color: rgba(148,163,184,0.5) transparent;
}
.search-results-dropdown::-webkit-scrollbar {
	width: 6px;
}
.search-results-dropdown::-webkit-scrollbar-thumb {
	background: rgba(148,163,184,0.4);
	border-radius: 6px;
}

.search-results-dropdown .search-section-header,
.mobile-results-container .search-section-header {
	position: sticky;
	top: 0;
	z-index: 2;
	backdrop-filter: blur(6px);
	background: var(--search-input-bg, rgba(241,245,249,0.95));
	box-shadow: 0 1px 0 var(--search-border, rgba(0,0,0,0.06));
}

.search-results-dropdown .search-section-header .svg-icon,
.mobile-results-container .search-section-header .svg-icon {
	display: inline-flex;
	width: 26px;
	height: 26px;
	align-items: center;
	justify-content: center;
	border-radius: 8px;
	background: var(--search-accent, #6366f1);
	color: #fff;
	flex-shrink: 0;
}
.search-results-dropdown .search-section-header .svg-icon svg,
.mobile-results-container .search-section-header .svg-icon svg {
	width: 14px;
	height: 14px;
}

/* آیتم نتیجه — دراپ‌داون هدر */
.search-results-dropdown .result-item,
.mobile-results-container .result-item {
	position: relative;
	display: inline-grid;
	grid-template-columns: 56px 1fr auto;
	align-items: center;
	gap: 12px;
	width: 100%;
	padding: 8px 10px;
	margin-bottom: 4px;
	overflow: hidden;
}
.search-results-dropdown .result-item:hover,
.mobile-results-container .result-item:hover {
	background: var(--search-result-hover, rgba(99,102,241,0.08));
	border-color: var(--search-accent, rgba(99,102,241,0.3));
	transform: translateX(-4px);
}
.search-results-dropdown .result-item .result-image,
.mobile-results-container .result-item .result-image {
	position: relative;
	width: 56px;
	height: 56px;
	border-radius: 14px;
	box-shadow: 0 4px 12px rgba(0,0,0,0.12);
	overflow: hidden;
}
.search-results-dropdown .result-item .result-image::after,
.mobile-results-container .result-item .result-image::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.15), transparent 55%);
	opacity: 0;
	transition: opacity 0.2s;
}
.search-results-dropdown .result-item:hover .result-image::after,
.mobile-results-container .result-item:hover .result-image::after {
	opacity: 1;
}
.search-results-dropdown .result-item .result-image img,
.mobile-results-container .result-item .result-image img {
	transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
.search-results-dropdown .result-item:hover .result-image img,
.mobile-results-container .result-item:hover .result-image img {
	transform: scale(1.08);
}
.search-results-dropdown .result-item .result-title,
.mobile-results-container .result-item .result-title {
	font-size: 0.95rem;
	font-weight: 600;
}
.search-results-dropdown .result-item .result-subtitle,
.mobile-results-container .result-item .result-subtitle {
	margin-top: 1px;
}
.search-results-dropdown .result-item .result-type,
.mobile-results-container .result-item .result-type {
	margin-top: 3px;
	padding: 2px 10px;
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.2px;
	background: var(--search-input-bg, #f1f5f9);
	color: var(--search-section-title, #475569);
	border: 1px solid var(--search-border, #e5e7eb);
	border-radius: 20px;
	justify-self: end;
	white-space: nowrap;
}

/* هایلایت بهتر */
.search-results-dropdown .search-highlight,
.mobile-results-container .search-highlight {
	background: linear-gradient(-180deg, transparent 55%, rgba(245,158,11,0.35) 55%);
	color: inherit;
	font-weight: 700;
	padding: 0;
	border-radius: 0;
}

/* فوتر مشاهده همه */
.view-all-link {
	width: 100%;
	justify-content: center;
	padding: 10px;
	border-radius: 12px;
	font-weight: 600;
	background: var(--search-input-bg, #f1f5f9);
	transition: all 0.2s;
}
.view-all-link:hover {
	background: var(--search-accent, #6366f1);
	color: #fff !important;
}
.view-all-link:hover svg {
	transform: translateX(3px);
}
.view-all-link svg {
	transition: transform 0.2s;
}

/* بارگذاری سریع‌تر — بدون تاخیر انیمیشن سنگین */
.search-results-dropdown .result-item,
.mobile-results-container .result-item {
	animation-duration: 0.18s;
}

@media (prefers-reduced-motion: reduce) {
	.search-results-dropdown .result-item,
	.mobile-results-container .result-item {
		animation: none;
		opacity: 1 !important;
		transform: none !important;
	}
}

/* ==========================================================================
   تب‌بندی آرشیو پلی‌لیست‌ها (رسمی / کاربران)
   ========================================================================== */
.rt-playlist-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}
.rt-playlist-tab {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 20px;
	border-radius: 999px;
	background: var(--bg-secondary, #ffffff);
	border: 1px solid var(--border-primary, #e5e7eb);
	color: var(--text-secondary, #4b5563);
	font-size: 0.85rem;
	font-weight: 600;
	text-decoration: none;
	transition: all 0.25s cubic-bezier(0.2, 0.9, 0.4, 1.1);
	cursor: pointer;
	box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}
.rt-playlist-tab:hover {
	transform: translateY(-2px);
	border-color: var(--primary, #6366f1);
	color: var(--primary, #6366f1);
	box-shadow: 0 6px 16px rgba(0,0,0,0.08);
}
.rt-playlist-tab.active {
	background: linear-gradient(-135deg, var(--primary, #6366f1), var(--secondary, #8b5cf6));
	color: #fff;
	border-color: transparent;
	box-shadow: 0 6px 18px rgba(99,102,241,0.35);
}
.rt-playlist-tab-count {
	font-size: 0.7rem;
	padding: 1px 10px;
	border-radius: 20px;
	background: rgba(0,0,0,0.06);
	color: inherit;
}
.rt-playlist-tab.active .rt-playlist-tab-count {
	background: rgba(255,255,255,0.25);
}
@media (max-width: 480px) {
	.rt-playlist-tabs {
		gap: 8px;
	}
	.rt-playlist-tab {
		padding: 8px 14px;
		font-size: 0.78rem;
	}
}

/* ============================================================
   بهبود چیدمان تب دانلودها و ترک‌های آلبوم
   (اوورراید‌های رسپانسیو و مرتب‌سازی)
   ============================================================ */
.download-box {
	border-radius: 18px;
}
.box-header {
	padding: 16px 18px;
}
.download-list {
	padding: 12px 10px;
}
.download-item {
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	padding: 14px 14px;
}
.download-item .item-meta {
	flex: 1;
	min-width: 0;
}
.download-item:hover {
	transform: none;
	translate: 0 -2px;
}
.download-item .item-action {
	flex-shrink: 0;
}
@media (max-width: 640px) {
	.download-item {
		flex-wrap: wrap;
		row-gap: 10px;
	}
	.download-item .item-meta {
		flex: 1 1 60%;
	}
	.download-item .item-action {
		width: 100%;
		justify-content: flex-end;
	}
	.box-header {
		flex-wrap: wrap;
	}
}

/* ترک‌های آلبوم */
.raditone-album-tracks {
	margin-top: 28px;
	border-radius: 20px;
}
.raditone-tracks-header {
	padding: 16px 18px;
}
.raditone-track-card {
	scroll-margin-top: 90px;
}
.raditone-track-row-mobile,
.raditone-track-row {
	row-gap: 8px;
}
.raditone-track-main-mobile,
.raditone-track-main {
	min-width: 0;
}
.raditone-track-actions {
	flex-wrap: wrap;
	justify-content: flex-end;
}
.raditone-track-actions .raditone-action-icon {
	width: 32px;
	height: 32px;
}
@media (max-width: 640px) {
	.raditone-track-row-mobile {
		gap: 8px;
	}
	.raditone-track-actions {
		gap: 6px;
	}
	.raditone-track-actions .raditone-action-icon {
		width: 30px;
		height: 30px;
	}
}
@media (max-width: 420px) {
	.raditone-track-main-mobile {
		flex-wrap: wrap;
	}
}

/* ============================================================
   جستجوی تمام‌صفحه لایو - اوورلی دسکتاپ
   (جایگزین dropdown سنتی)
   ============================================================ */
.search-results-dropdown {
	position: fixed;
	inset: 0;
	top: 0;
	right: 0;
	left: 0;
	max-height: none;
	overflow: hidden;
	background: rgba(10, 16, 32, 0.5);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	border: none;
	border-radius: 0;
	box-shadow: none;
	transform: none;
	z-index: 100000;
	display: flex;
	align-items: stretch;
	justify-content: center;
	padding: 0;
	opacity: 0;
	visibility: hidden;
}
.search-results-dropdown.show {
	transform: none;
}
.search-results-dropdown .rd-search-backdrop {
	position: absolute;
	inset: 0;
	cursor: pointer;
}
.search-results-dropdown .rd-search-panel {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: 860px;
	height: 100%;
	margin: 0;
	display: flex;
	flex-direction: column;
	background: var(--search-bg, #ffffff);
	box-shadow: 18px 0 50px rgba(0, 0, 0, 0.25);
	border-right: 1px solid rgba(255, 255, 255, 0.08);
	animation: rdSearchPanelIn .3s cubic-bezier(.2, .8, .2, 1);
}
@keyframes rdSearchPanelIn {
	from { opacity: 0; transform: translateX(24px); }
	to { opacity: 1; transform: translateX(0); }
}
.search-results-dropdown .results-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 22px 26px 18px;
	border-bottom: 1px solid var(--search-border);
	flex-shrink: 0;
}
.search-results-dropdown .rd-search-head-title {
	display: flex;
	align-items: center;
	gap: 14px;
}
.search-results-dropdown .results-title {
	font-size: 1.05rem;
	font-weight: 700;
}
.search-results-dropdown .results-count {
	font-size: 0.8rem;
	padding: 5px 12px;
	border-radius: 30px;
}
.search-results-dropdown .rd-search-head-title + #rdSearchClose,
.search-results-dropdown button#rdSearchClose {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: none;
	border-radius: 50%;
	background: var(--search-input-bg, rgba(0,0,0,0.05));
	color: var(--search-text, #334155);
	cursor: pointer;
	flex-shrink: 0;
	transition: all 0.2s;
	padding: 0;
}
.search-results-dropdown button#rdSearchClose:hover {
	background: rgba(59, 91, 219, 0.12);
	color: var(--primary, #3b5bdb);
	transform: rotate(-90deg);
}
.search-results-dropdown .results-container {
	flex: 1;
	overflow-y: auto;
	padding: 8px 20px 20px;
	max-height: none;
}
.search-results-dropdown .results-footer {
	flex-shrink: 0;
	border-top: 1px solid var(--search-border);
	padding: 14px 26px;
}
@media (max-width: 768px) {
	.search-results-dropdown {
		background: rgba(10, 16, 32, 0.4);
	}
	.search-results-dropdown .rd-search-backdrop {
		display: none;
	}
	.search-results-dropdown .rd-search-panel {
		max-width: 100%;
		animation: none;
	}
	.search-results-dropdown .results-container {
		padding: 8px 14px 20px;
	}
	.search-results-dropdown .results-header {
		padding: 18px 16px 14px;
	}
}
[data-theme="dark"] .search-results-dropdown .rd-search-panel,
[data-theme="dark"] .search-results-dropdown {
	background: #0f172a;
}

/* =========================================
   Download Panel v2 (from sample design)
   ========================================= */

#panel-downloads .rt-dl-v2 {
	width: 100%;
	margin: 0 auto;
}

#panel-downloads .rt-dl-v2 .download-header {
	text-align: center;
	margin-bottom: 30px;
}

#panel-downloads .rt-dl-v2 .download-header-icon {
	width: 72px;
	height: 72px;
	margin: 0 auto 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 22px;
	background: linear-gradient(-135deg, var(--primary), var(--secondary));
	color: #fff;
	box-shadow: 0 15px 35px rgba(var(--primary-rgb), .22);
}

#panel-downloads .rt-dl-v2 .download-header-icon svg {
	width: 38px;
	height: 38px;
}

#panel-downloads .rt-dl-v2 .download-header h1 {
	font-size: clamp(25px, 3vw, 38px);
	font-weight: 800;
	color: var(--text-primary);
	margin-bottom: 5px;
}

#panel-downloads .rt-dl-v2 .download-header h1 span {
	color: var(--primary);
}

#panel-downloads .rt-dl-v2 .download-header p {
	color: var(--text-secondary);
	font-size: 15px;
}

#panel-downloads .rt-dl-v2 .download-section {
	display: flex;
	align-items: stretch;
	min-height: 250px;
	margin-bottom: 25px;
	border: 1px solid var(--border);
	border-radius: 25px;
	overflow: hidden;
	background: var(--bg-primary);
	box-shadow: 0 12px 40px rgba(var(--primary-rgb), .10);
	transition: transform .3s ease, box-shadow .3s ease;
}

#panel-downloads .rt-dl-v2 .download-section:hover {
	transform: translateY(-3px);
	box-shadow: 0 20px 55px rgba(var(--primary-rgb), .14);
}

#panel-downloads .rt-dl-v2 .section-info {
	width: 38%;
	min-width: 320px;
	padding: 35px;
	display: flex;
	align-items: center;
	position: relative;
	overflow: hidden;
}

#panel-downloads .rt-dl-v2 .section-info::before,
#panel-downloads .rt-dl-v2 .section-info::after {
	content: "";
	position: absolute;
	border-radius: 50%;
	background: rgba(255,255,255,.30);
}

#panel-downloads .rt-dl-v2 .section-info::before {
	width: 260px;
	height: 260px;
	top: -120px;
	left: -80px;
}

#panel-downloads .rt-dl-v2 .section-info::after {
	width: 200px;
	height: 100px;
	bottom: -50px;
	right: 30px;
	border-radius: 50%;
	background: rgba(255,255,255,.25);
}

#panel-downloads .rt-dl-v2 .single-track .section-info {
	background: linear-gradient(-135deg, var(--primary-light), rgba(var(--primary-rgb), .05));
}

#panel-downloads .rt-dl-v2 .album .section-info {
	background: linear-gradient(-135deg, var(--secondary-light), rgba(var(--secondary-rgb), .05));
}

#panel-downloads .rt-dl-v2 .music-video .section-info {
	background: linear-gradient(-135deg, var(--accent-light), rgba(var(--accent-rgb), .05));
}

#panel-downloads .rt-dl-v2 .info-content {
	display: flex;
	align-items: center;
	gap: 25px;
	position: relative;
	z-index: 2;
}

#panel-downloads .rt-dl-v2 .section-icon {
	width: 120px;
	height: 120px;
	flex: 0 0 120px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	color: white;
	box-shadow: 0 15px 35px rgba(0,0,0,.12);
}

#panel-downloads .rt-dl-v2 .section-icon svg {
	width: 58px;
	height: 58px;
}

#panel-downloads .rt-dl-v2 .single-track .section-icon {
	background: var(--primary-gradient);
}

#panel-downloads .rt-dl-v2 .album .section-icon {
	background: var(--secondary-gradient);
}

#panel-downloads .rt-dl-v2 .music-video .section-icon {
	background: var(--accent-gradient);
}

#panel-downloads .rt-dl-v2 .info-text h2 {
	font-size: 31px;
	font-weight: 800;
	margin-bottom: 5px;
	color: var(--text-primary);
}

#panel-downloads .rt-dl-v2 .info-text p {
	color: var(--text-secondary);
	font-size: 14px;
}

#panel-downloads .rt-dl-v2 .waveform {
	display: flex;
	align-items: center;
	gap: 4px;
	margin-top: 20px;
}

#panel-downloads .rt-dl-v2 .waveform span {
	width: 4px;
	border-radius: 10px;
	background: currentColor;
	opacity: .65;
}

#panel-downloads .rt-dl-v2 .waveform span:nth-child(1) { height: 10px; }
#panel-downloads .rt-dl-v2 .waveform span:nth-child(2) { height: 20px; }
#panel-downloads .rt-dl-v2 .waveform span:nth-child(3) { height: 35px; }
#panel-downloads .rt-dl-v2 .waveform span:nth-child(4) { height: 17px; }
#panel-downloads .rt-dl-v2 .waveform span:nth-child(5) { height: 42px; }
#panel-downloads .rt-dl-v2 .waveform span:nth-child(6) { height: 25px; }
#panel-downloads .rt-dl-v2 .waveform span:nth-child(7) { height: 13px; }
#panel-downloads .rt-dl-v2 .waveform span:nth-child(8) { height: 32px; }
#panel-downloads .rt-dl-v2 .waveform span:nth-child(9) { height: 19px; }
#panel-downloads .rt-dl-v2 .waveform span:nth-child(10) { height: 9px; }

#panel-downloads .rt-dl-v2 .single-track .waveform { color: var(--primary); }
#panel-downloads .rt-dl-v2 .album .waveform { color: var(--secondary); }
#panel-downloads .rt-dl-v2 .music-video .waveform { color: var(--accent); }

#panel-downloads .rt-dl-v2 .section-downloads {
	width: 62%;
	padding: 30px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	background: var(--bg-secondary);
}

#panel-downloads .rt-dl-v2 .download-title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 18px;
}

#panel-downloads .rt-dl-v2 .download-title strong {
	font-size: 15px;
	color: var(--text-primary);
	font-weight: 700;
}

#panel-downloads .rt-dl-v2 .download-title span {
	font-size: 13px;
	color: var(--text-tertiary);
}

#panel-downloads .rt-dl-v2 .download-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

#panel-downloads .rt-dl-v2 .download-item {
	min-height: 88px;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px;
	border-radius: 17px;
	border: 1px solid var(--border);
	background: var(--bg-primary);
	transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
	text-decoration: none;
}

#panel-downloads .rt-dl-v2 .download-item:hover {
	transform: translateY(-3px);
	border-color: rgba(var(--primary-rgb), .50);
	box-shadow: 0 10px 25px rgba(var(--primary-rgb), .12);
}

#panel-downloads .rt-dl-v2 .quality {
	width: 55px;
	height: 55px;
	flex: 0 0 55px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 13px;
	color: white;
	font-size: 14px;
	font-weight: 800;
	text-align: center;
	line-height: 1.1;
}

#panel-downloads .rt-dl-v2 .single-track .quality {
	background: var(--primary-gradient);
}

#panel-downloads .rt-dl-v2 .single-track .download-item:nth-child(2) .quality {
	background: linear-gradient(-135deg, var(--primary), var(--accent));
}

#panel-downloads .rt-dl-v2 .single-track .download-item:nth-child(3) .quality {
	background: var(--secondary-gradient);
}

#panel-downloads .rt-dl-v2 .single-track .download-item:nth-child(4) .quality {
	background: linear-gradient(-135deg, var(--success), var(--success-hover));
}

#panel-downloads .rt-dl-v2 .album .quality {
	background: var(--secondary-gradient);
}

#panel-downloads .rt-dl-v2 .album .download-item:nth-child(3) .quality {
	background: linear-gradient(-135deg, var(--secondary), var(--accent));
}

#panel-downloads .rt-dl-v2 .album .download-item:nth-child(4) .quality {
	background: linear-gradient(-135deg, var(--success), var(--success-hover));
}

#panel-downloads .rt-dl-v2 .music-video .quality {
	background: var(--accent-gradient);
}

#panel-downloads .rt-dl-v2 .music-video .download-item:nth-child(2) .quality {
	background: linear-gradient(-135deg, var(--secondary), var(--accent));
}

#panel-downloads .rt-dl-v2 .music-video .download-item:nth-child(3) .quality {
	background: linear-gradient(-135deg, var(--success), var(--success-hover));
}

#panel-downloads .rt-dl-v2 .music-video .download-item:nth-child(4) .quality {
	background: linear-gradient(-135deg, var(--warning), var(--warning-hover));
}

#panel-downloads .rt-dl-v2 .download-info {
	flex: 1;
	min-width: 0;
}

#panel-downloads .rt-dl-v2 .download-info strong {
	display: block;
	color: var(--text-primary);
	font-size: 16px;
	font-weight: 800;
	white-space: nowrap;
}

#panel-downloads .rt-dl-v2 .download-info small {
	display: block;
	margin-top: 2px;
	color: var(--text-tertiary);
	font-size: 11px;
}

#panel-downloads .rt-dl-v2 .file-size {
	margin-top: 3px;
	display: block;
	color: var(--text-secondary);
	font-size: 12px;
	font-weight: 600;
}

#panel-downloads .rt-dl-v2 .download-button {
	width: 43px;
	height: 43px;
	flex: 0 0 43px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	color: white;
	transition: transform .2s ease, box-shadow .2s ease;
}

#panel-downloads .rt-dl-v2 .download-button svg {
	width: 20px;
	height: 20px;
}

#panel-downloads .rt-dl-v2 .download-button:hover {
	transform: scale(1.1);
}

#panel-downloads .rt-dl-v2 .single-track .download-button {
	background: var(--primary);
	box-shadow: 0 7px 18px rgba(var(--primary-rgb), .25);
}

#panel-downloads .rt-dl-v2 .album .download-button {
	background: var(--secondary);
	box-shadow: 0 7px 18px rgba(var(--secondary-rgb), .22);
}

#panel-downloads .rt-dl-v2 .music-video .download-button {
	background: var(--accent);
	box-shadow: 0 7px 18px rgba(var(--accent-rgb), .22);
}

#panel-downloads .rt-dl-v2 .download-features {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin-top: 30px;
	border: 1px solid var(--border);
	background: var(--bg-primary);
	border-radius: 20px;
	padding: 20px;
}

#panel-downloads .rt-dl-v2 .feature {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 13px;
	padding: 5px 20px;
	border-right: 1px solid var(--border);
	text-align: left;
}

#panel-downloads .rt-dl-v2 .feature:last-child {
	border-right: 0;
}

#panel-downloads .rt-dl-v2 .feature-icon {
	width: 45px;
	height: 45px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 13px;
	background: var(--primary-light);
	color: var(--primary);
}

#panel-downloads .rt-dl-v2 .feature-icon svg {
	width: 24px;
	height: 24px;
}

#panel-downloads .rt-dl-v2 .feature strong {
	display: block;
	color: var(--text-primary);
	font-size: 14px;
}

#panel-downloads .rt-dl-v2 .feature span {
	display: block;
	color: var(--text-tertiary);
	font-size: 11px;
}

@media (max-width: 1000px) {
	#panel-downloads .rt-dl-v2 .download-section {
		flex-direction: column;
	}

	#panel-downloads .rt-dl-v2 .section-info,
	#panel-downloads .rt-dl-v2 .section-downloads {
		width: 100%;
	}

	#panel-downloads .rt-dl-v2 .section-info {
		min-width: 0;
	}
}

@media (max-width: 600px) {
	#panel-downloads .rt-dl-v2 .download-header {
		margin-bottom: 20px;
	}

	#panel-downloads .rt-dl-v2 .download-header-icon {
		width: 60px;
		height: 60px;
		border-radius: 18px;
	}

	#panel-downloads .rt-dl-v2 .download-header-icon svg {
		width: 32px;
		height: 32px;
	}

	#panel-downloads .rt-dl-v2 .download-header h1 {
		font-size: 24px;
	}

	#panel-downloads .rt-dl-v2 .download-header p {
		font-size: 12px;
	}

	#panel-downloads .rt-dl-v2 .section-info {
		padding: 20px;
	}

	#panel-downloads .rt-dl-v2 .info-content {
		gap: 15px;
	}

	#panel-downloads .rt-dl-v2 .section-icon {
		width: 72px;
		height: 72px;
		flex-basis: 72px;
	}

	#panel-downloads .rt-dl-v2 .section-icon svg {
		width: 36px;
		height: 36px;
	}

	#panel-downloads .rt-dl-v2 .info-text h2 {
		font-size: 21px;
	}

	#panel-downloads .rt-dl-v2 .info-text p {
		font-size: 11px;
	}

	#panel-downloads .rt-dl-v2 .waveform {
		margin-top: 10px;
	}

	#panel-downloads .rt-dl-v2 .section-downloads {
		padding: 15px;
	}

	#panel-downloads .rt-dl-v2 .download-grid {
		grid-template-columns: 1fr;
		gap: 9px;
	}

	#panel-downloads .rt-dl-v2 .download-item {
		min-height: 72px;
		padding: 9px;
		border-radius: 14px;
	}

	#panel-downloads .rt-dl-v2 .quality {
		width: 50px;
		height: 50px;
		flex-basis: 50px;
	}

	#panel-downloads .rt-dl-v2 .download-info strong {
		font-size: 14px;
	}

	#panel-downloads .rt-dl-v2 .download-button {
		width: 39px;
		height: 39px;
		flex-basis: 39px;
	}

	#panel-downloads .rt-dl-v2 .download-features {
		grid-template-columns: 1fr;
		gap: 10px;
		padding: 15px;
	}

	#panel-downloads .rt-dl-v2 .feature {
		justify-content: flex-start;
		border-right: 0;
		border-bottom: 1px solid var(--border);
		padding: 10px 5px;
		text-align: left;
	}

#panel-downloads .rt-dl-v2 .feature:last-child {
		border-bottom: 0;
	}
}

/* ============================================================
   اسلایدرهای owl داخل صفحه تکی (بیشتر از / آهنگ‌های مشابه)
   ============================================================ */
.rt-owl-section {
	position: relative;
}

.rt-owl-section .owl-carousel .item {
	padding: 4px 2px;
}

.rt-owl-section .owl-carousel .track-card {
	width: auto;
	flex-shrink: 0;
}

.rt-owl-section .owl-carousel .track-card a {
	text-decoration: none;
	color: inherit;
}

.rt-owl-section .owl-carousel .owl-stage-outer {
	overflow: hidden;
	border-radius: 12px;
}

.rt-owl-section .owl-nav-custom button:disabled,
.rt-owl-section .owl-nav-custom button.disabled {
	opacity: 0.3;
	cursor: not-allowed;
	pointer-events: none;
}

/* ==========================================================================
   Sample Hero & Cover Components (LTR Mirror)
   ========================================================================== */
.cover-wrapper {
	position: relative;
	width: 16rem;
	height: 16rem;
	flex-shrink: 0;
	--hm-cover: url('data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7');
}

@media (min-width: 640px) {
	.cover-wrapper {
		width: 18rem;
		height: 18rem;
	}
}

.cover-wrapper::before,
.cover-wrapper::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: 1rem;
	background: var(--hm-cover) center / cover no-repeat;
	transition: transform 0.5s var(--ease, cubic-bezier(0.4, 0, 0.2, 1)), opacity 0.5s var(--ease, cubic-bezier(0.4, 0, 0.2, 1));
	z-index: 0;
}

.cover-wrapper::before {
	transform: rotate(-7deg) scale(0.95);
	opacity: 0.5;
}

.cover-wrapper::after {
	transform: rotate(7deg) scale(0.95);
	opacity: 0.5;
}

.cover-wrapper > img {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 1rem;
	display: block;
	transition: transform 0.5s var(--ease, cubic-bezier(0.4, 0, 0.2, 1));
}

.cover-wrapper:hover::before {
	transform: rotate(-10deg) scale(0.98);
	opacity: 0.7;
}

.cover-wrapper:hover::after {
	transform: rotate(10deg) scale(0.98);
	opacity: 0.7;
}

.cover-wrapper:hover > img {
	transform: scale(1.02);
}

.cover-wrapper > span,
.cover-wrapper .rt-hero-badge {
	right: auto !important;
	left: 0.75rem !important;
}

.rt-ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
	flex-shrink: 0;
}

.rt-ico svg {
	display: block;
}

.musica-card {
	background: var(--bg-primary, #ffffff);
	border: 1px solid var(--bg-tertiary, #f1f5f9);
	border-radius: 1.5rem;
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}

.dark .musica-card {
	background: #0f172a;
	border-color: #293548;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

.bg-musica-50 { background-color: rgba(var(--primary-rgb, 59 130 246), 0.08); }
.bg-musica-100 { background-color: rgba(var(--primary-rgb, 59 130 246), 0.16); }
.bg-musica-500 { background-color: var(--primary); }
.text-musica-500 { color: var(--primary); }
.text-musica-600 { color: var(--primary); }
.border-musica-100 { border-color: rgba(var(--primary-rgb, 59 130 246), 0.2); }
.border-musica-200 { border-color: rgba(var(--primary-rgb, 59 130 246), 0.35); }
.hover\:bg-musica-100:hover { background-color: rgba(var(--primary-rgb, 59 130 246), 0.16); }
.hover\:bg-musica-600:hover { background-color: var(--primary-hover, var(--primary)); }
.hover\:bg-musica-500:hover { background-color: var(--primary); }
.shadow-musica-500\/20 { box-shadow: 0 4px 14px rgba(var(--primary-rgb, 59 130 246), 0.28); }

.bg-slate-50 { background-color: var(--bg-secondary, #f8fafc); }
.bg-slate-100 { background-color: var(--bg-tertiary, #f1f5f9); }
.bg-slate-200 { background-color: var(--border-color, #e2e8f0); }
.bg-slate-700 { background-color: #334155; }
.bg-slate-800 { background-color: #1e293b; }
.bg-white { background-color: var(--bg-primary, #ffffff); }
.text-slate-200 { color: #e2e8f0; }
.text-slate-300 { color: #cbd5e1; }
.text-slate-400 { color: var(--rt-text-tertiary, var(--text-secondary, #64748b)); }
.text-slate-500 { color: var(--text-secondary, #475569); }
.text-slate-600 { color: var(--text-secondary, #475569); }
.text-slate-700 { color: var(--text-secondary, #475569); }
.text-slate-800 { color: var(--text-primary, #0f172a); }
.text-slate-900 { color: var(--text-primary, #0f172a); }
.border-slate-100 { border-color: var(--bg-tertiary, #f1f5f9); }
.border-slate-200 { border-color: var(--border-color, #e2e8f0); }
.border-slate-200\/80 { border-color: var(--border-color, #e2e8f0); }
.border-slate-600 { border-color: #475569; }
.border-slate-700 { border-color: #293548; }
.hover\:bg-slate-100:hover { background-color: var(--bg-tertiary, #f1f5f9); }
.hover\:bg-slate-200:hover { background-color: var(--border-color, #e2e8f0); }
.hover\:text-white:hover { color: #ffffff; }

.dark .bg-slate-50 { background-color: #1e293b; }
.dark .bg-slate-100 { background-color: #1e293b; }
.dark .bg-slate-200 { background-color: #293548; }
.dark .bg-white { background-color: #293548; }
.dark .text-slate-400 { color: #94a3b8; }
.dark .text-slate-500 { color: #94a3b8; }
.dark .text-slate-600 { color: #cbd5e1; }
.dark .text-slate-700 { color: #e2e8f0; }
.dark .text-slate-800 { color: #e2e8f0; }
.dark .text-slate-900 { color: #e2e8f0; }
.dark .border-slate-100 { border-color: #1e293b; }
.dark .border-slate-200 { border-color: #293548; }
.dark .border-slate-200\/80 { border-color: #293548; }
.dark .hover\:bg-slate-100:hover { background-color: #293548; }
.dark .hover\:bg-slate-200:hover { background-color: #334155; }

.bg-musica-50\/70 { background-color: rgba(var(--primary-rgb, 59 130 246), 0.07); }
.bg-slate-800\/40 { background-color: rgba(30, 41, 59, 0.04); }
.bg-slate-50\/80 { background-color: var(--bg-secondary, #f8fafc); }
.dark .bg-slate-800\/40 { background-color: rgba(30, 41, 59, 0.4); }

.group { position: relative; }
.group:hover .group-hover\:text-musica-500 { color: var(--primary); }
.group:hover .group-hover\:translate-y-0\.5 { transform: translateY(2px); }
.group:hover .group-hover\:scale-105 { transform: scale(1.05); }

.font-black { font-weight: 900; }
.font-extrabold { font-weight: 800; }
.text-\[10px\] { font-size: 10px; line-height: 1.4; }
.text-\[11px\] { font-size: 11px; line-height: 1.5; }
.leading-8 { line-height: 2rem; }
.leading-relaxed { line-height: 1.625; }
.text-center { text-align: center; }
.whitespace-nowrap { white-space: nowrap; }

.p-3\.5 { padding: 0.875rem; }
.py-2\.5 { padding-top: 0.625rem; padding-bottom: 0.625rem; }
.py-1\.5 { padding-top: 0.375rem; padding-bottom: 0.375rem; }
.py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
.px-2\.5 { padding-left: 0.625rem; padding-right: 0.625rem; }
.px-3\.5 { padding-left: 0.875rem; padding-right: 0.875rem; }
.gap-2\.5 { gap: 0.625rem; }
.gap-3\.5 { gap: 0.875rem; }
.space-y-2\.5 > * + * { margin-top: 0.625rem; }
.space-y-2 > * + * { margin-top: 0.5rem; }
.space-y-4 > * + * { margin-top: 1rem; }
.space-y-5 > * + * { margin-top: 1.25rem; }
.space-y-6 > * + * { margin-top: 1.5rem; }
.mt-0\.5 { margin-top: 0.125rem; }
.mt-1 { margin-top: 0.25rem; }
.mb-2 { margin-bottom: 0.5rem; }
.pb-2 { padding-bottom: 0.5rem; }
.w-9 { width: 2.25rem; }
.h-9 { height: 2.25rem; }
.w-11 { width: 2.75rem; }
.h-11 { height: 2.75rem; }
.overflow-x-auto { overflow-x: auto; }
.self-end { align-self: flex-end; }

.border { border-width: 1px; border-style: solid; }
.border-b { border-bottom-width: 1px; border-bottom-style: solid; }

@media (min-width: 640px) {
	.sm\:flex-row { flex-direction: row; }
	.sm\:items-center { align-items: center; }
	.sm\:justify-start { justify-content: flex-start; }
	.sm\:self-auto { align-self: auto; }
	.sm\:p-8 { padding: 2rem; }
	.sm\:text-2xl { font-size: 1.5rem; line-height: 2rem; }
	.sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.sm\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 768px) {
	.md\:flex-row { flex-direction: row; }
	.md\:items-start { align-items: flex-start; }
	.md\:text-right { text-align: left !important; }
	.md\:text-start { text-align: left !important; }
}

@media (min-width: 1024px) {
	.lg\:gap-8 { gap: 2rem; }
	.lg\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
}

.rt-pill-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	padding: 0.25rem 0.625rem;
	font-size: 11px;
	line-height: 1.6;
	border-radius: 0.5rem;
	background-color: var(--bg-primary, #ffffff);
	color: var(--text-secondary, #475569);
	border: 1px solid var(--border-color, #e2e8f0);
	font-weight: 700;
	cursor: pointer;
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.dark .rt-pill-btn {
	background-color: #293548;
	color: #cbd5e1;
	border-color: #293548;
}

.rt-pill-btn svg { width: 14px; height: 14px; }
.rt-pill-btn:hover {
	background-color: var(--primary);
	border-color: var(--primary);
	color: #ffffff;
}

.rt-pill-ico { padding: 0.25rem 0.5rem; }
.rt-trackplay svg,
.rt-trackplay .rt-ico svg { width: 15px; height: 15px; }

.raditone-track-card.raditone-playing {
	background-color: rgba(var(--primary-rgb, 59 130 246), 0.08) !important;
	border: 1px solid rgba(var(--primary-rgb, 59 130 246), 0.35) !important;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.dark .raditone-track-card.raditone-playing {
	background-color: rgba(var(--primary-rgb, 59 130 246), 0.14) !important;
	border-color: rgba(var(--primary-rgb, 59 130 246), 0.4) !important;
}

/* ردیف دانلود در LTR */
.rt-dl-card {
	background: var(--bg-primary, #ffffff);
	border: 1px solid var(--bg-tertiary, #f1f5f9);
	border-radius: 1.5rem;
	padding: 1.5rem;
	text-align: left;
	direction: ltr;
}

.dark .rt-dl-card {
	background: #0f172a;
	border-color: #293548;
}

.rt-dl-head {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--bg-tertiary, #f1f5f9);
	font-weight: 700;
	font-size: 0.95rem;
	color: var(--text-primary, #0f172a);
	margin-bottom: 1.25rem;
	text-align: left;
}

.dark .rt-dl-head {
	border-bottom-color: #293548;
	color: #e2e8f0;
}

.rt-dl-group-title {
	font-size: 0.75rem;
	font-weight: 800;
	color: var(--rt-text-tertiary, var(--text-secondary, #64748b));
	margin: 1.25rem 0 0.75rem;
	text-align: left;
}

.dark .rt-dl-group-title { color: #94a3b8; }

.rt-dl-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
}

@media (min-width: 640px) {
	.rt-dl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.rt-dl-item {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	padding: 1rem;
	border-radius: 1rem;
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	text-decoration: none;
	direction: ltr;
	text-align: left;
	transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.rt-dl-item * { text-align: left; }

.dark .rt-dl-item {
	background: #1e293b;
	border-color: #293548;
}

.rt-dl-item:hover {
	background: #f1f5f9;
	transform: translateY(-1px);
}

.dark .rt-dl-item:hover { background: #334155; }

.rt-dl-item.is-primary {
	background: rgba(79, 70, 229, 0.07);
	border-color: rgba(79, 70, 229, 0.3);
}

.rt-dl-item.is-primary:hover {
	background: rgba(79, 70, 229, 0.14);
}

.rt-dl-item-main {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	gap: 0.875rem;
	min-width: 0;
	text-align: left;
}

.rt-dl-badge {
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 0.75rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 0.75rem;
	font-weight: 900;
	flex-shrink: 0;
	background: #e2e8f0;
	color: #334155;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}

.dark .rt-dl-badge {
	background: #334155;
	color: #e2e8f0;
}

.rt-dl-item.is-primary .rt-dl-badge {
	background: var(--primary, #4f46e5);
	color: #ffffff;
	box-shadow: 0 4px 12px rgba(79, 70, 229, 0.35);
}

.rt-dl-title {
	font-size: 0.75rem;
	font-weight: 800;
	color: var(--text-primary, #0f172a);
	transition: color 0.2s ease;
	text-align: left;
}

.rt-dl-item:hover .rt-dl-title { color: var(--primary, #4f46e5); }
.dark .rt-dl-title { color: #e2e8f0; }

.rt-dl-sub {
	font-size: 11px;
	color: var(--rt-text-tertiary, var(--text-secondary, #94a3b8));
	margin-top: 0.125rem;
	text-align: left;
}

.dark .rt-dl-sub { color: #94a3b8; }

.rt-dl-icon {
	color: var(--primary, #4f46e5);
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.2s ease, color 0.2s ease;
}

.rt-dl-item:not(.is-primary) .rt-dl-icon { color: #94a3b8; }
.dark .rt-dl-icon { color: #94a3b8; }
.rt-dl-item.is-primary .rt-dl-icon { color: var(--primary, #4f46e5); }
.rt-dl-item:hover .rt-dl-icon {
	color: var(--primary, #4f46e5);
	transform: translateY(2px);
}
.rt-dl-icon svg { width: 1.5rem; height: 1.5rem; }

/* ============================================================
   چیدمان چپ‌چین کارت ویژه و کارت‌های هیرو صفحه اصلی در حالت LTR
   ============================================================ */
[dir="ltr"] .featured-card,
body.rt-direction-ltr .featured-card,
[dir="ltr"] .featured-meta,
body.rt-direction-ltr .featured-meta {
    text-align: left !important;
    direction: ltr !important;
    align-items: flex-start !important;
}

[dir="ltr"] .featured-title,
body.rt-direction-ltr .featured-title,
[dir="ltr"] .featured-artist,
body.rt-direction-ltr .featured-artist {
    text-align: left !important;
    direction: ltr !important;
}

[dir="ltr"] .featured-play-badge,
body.rt-direction-ltr .featured-play-badge {
    left: auto !important;
    right: 10px !important;
}

[dir="ltr"] .rt-hero-side-card,
body.rt-direction-ltr .rt-hero-side-card,
[dir="ltr"] .rt-hero-side-card__body,
body.rt-direction-ltr .rt-hero-side-card__body,
[dir="ltr"] .rt-hero-side-card__title,
body.rt-direction-ltr .rt-hero-side-card__title,
[dir="ltr"] .rt-hero-side-card__desc,
body.rt-direction-ltr .rt-hero-side-card__desc {
    text-align: left !important;
    direction: ltr !important;
}


/* ============================================================
   استایل‌های محتوای صریح و رده‌بندی سنی (۱۹+)
   ============================================================ */
/* مثلث شیشه‌ای هشدار محتوای صریح (۱۹+) روی تمامی کارت‌های سایت */
.rt-card-badge-explicit,
.rt-card-badge-explicit--glass,
.rt-card-badge-explicit--featured,
.rt-card-badge-explicit--carousel {
    position: absolute !important;
    top: 8px !important;
    z-index: 10 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    padding: 0 !important;
    border-radius: 9px !important;
    background: rgba(220, 38, 38, 0.55) !important;
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.7), rgba(185, 28, 28, 0.45)) !important;
    -webkit-backdrop-filter: blur(8px) saturate(180%) !important;
    backdrop-filter: blur(8px) saturate(180%) !important;
    border: 1px solid rgba(255, 255, 255, 0.45) !important;
    box-shadow: 0 4px 12px rgba(220, 38, 38, 0.4), inset 0 1px 1px rgba(255, 255, 255, 0.5) !important;
    color: #ffffff !important;
    pointer-events: auto !important;
    cursor: default !important;
    transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}

.rt-card-badge-explicit:hover,
.rt-card-badge-explicit--glass:hover,
.rt-card-badge-explicit--featured:hover,
.rt-card-badge-explicit--carousel:hover {
    transform: scale(1.1) !important;
    box-shadow: 0 6px 18px rgba(220, 38, 38, 0.55), inset 0 1px 1px rgba(255, 255, 255, 0.6) !important;
}

.rt-card-badge-explicit svg,
.rt-card-badge-explicit--glass svg,
.rt-card-badge-explicit--featured svg,
.rt-card-badge-explicit--carousel svg {
    width: 15px !important;
    height: 15px !important;
    stroke: #ffffff !important;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.45)) !important;
    flex-shrink: 0 !important;
}

/* راست‌چین (RTL): گوشه بالا سمت چپ */
[dir="rtl"] .rt-card-badge-explicit,
[dir="rtl"] .rt-card-badge-explicit--glass,
[dir="rtl"] .rt-card-badge-explicit--featured,
[dir="rtl"] .rt-card-badge-explicit--carousel,
html[dir="rtl"] .rt-card-badge-explicit,
html[dir="rtl"] .rt-card-badge-explicit--glass,
html[dir="rtl"] .rt-card-badge-explicit--featured,
html[dir="rtl"] .rt-card-badge-explicit--carousel,
body.rtl .rt-card-badge-explicit,
body.rtl .rt-card-badge-explicit--glass,
body.rtl .rt-card-badge-explicit--featured,
body.rtl .rt-card-badge-explicit--carousel {
    left: 8px !important;
    right: auto !important;
}

/* چپ‌چین (LTR): گوشه بالا سمت راست */
[dir="ltr"] .rt-card-badge-explicit,
[dir="ltr"] .rt-card-badge-explicit--glass,
[dir="ltr"] .rt-card-badge-explicit--featured,
[dir="ltr"] .rt-card-badge-explicit--carousel,
html[dir="ltr"] .rt-card-badge-explicit,
html[dir="ltr"] .rt-card-badge-explicit--glass,
html[dir="ltr"] .rt-card-badge-explicit--featured,
html[dir="ltr"] .rt-card-badge-explicit--carousel,
body:not(.rtl) .rt-card-badge-explicit,
body:not(.rtl) .rt-card-badge-explicit--glass,
body:not(.rtl) .rt-card-badge-explicit--featured,
body:not(.rtl) .rt-card-badge-explicit--carousel {
    right: 8px !important;
    left: auto !important;
}

.rt-track-row__explicit {
    display: inline-block;
    background: #ef4444;
    color: #ffffff;
    font-size: 10px;
    font-weight: 800;
    padding: 1px 5px;
    border-radius: 4px;
    margin-right: 6px;
    line-height: 1.2;
    vertical-align: middle;
}
html[dir="ltr"] .rt-track-row__explicit {
    margin-right: 0;
    margin-left: 6px;
}

.rt-archive-card-wrapper.rt-post-explicit .rt-archive-card-border {
    border-color: rgba(239, 68, 68, 0.5) !important;
}
.rt-archive-card-wrapper.rt-post-explicit:hover .rt-archive-card {
    box-shadow: 0 10px 28px rgba(239, 68, 68, 0.25) !important;
}

/* باکس هشدار محتوای صریح و گرافیک نسخه موبایل */
.rt-explicit-warning-alert {
    display: flex;
    align-items: center;
    gap: 14px;
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(220, 38, 38, 0.04));
    border: 1.5px solid rgba(239, 68, 68, 0.35);
    border-radius: 16px;
    padding: 14px 16px;
    margin: 12px 0 16px;
    position: relative;
    overflow: hidden;
    width: 100%;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    box-shadow: 0 4px 18px rgba(239, 68, 68, 0.12);
}
.dark .rt-explicit-warning-alert,
[data-theme="dark"] .rt-explicit-warning-alert {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.18), rgba(185, 28, 28, 0.1));
    border-color: rgba(239, 68, 68, 0.48);
}
.rt-explicit-warning-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: linear-gradient(135deg, #ef4444, #dc2626);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 4px 14px rgba(239, 68, 68, 0.4);
}
.rt-explicit-warning-icon svg {
    width: 22px;
    height: 22px;
    stroke: currentColor;
}
.rt-explicit-warning-body {
    flex: 1;
    min-width: 0;
    text-align: right;
}
html[dir="ltr"] .rt-explicit-warning-body,
[dir="ltr"] .rt-explicit-warning-body {
    text-align: left;
}
.rt-explicit-warning-title {
    font-size: 13.5px;
    font-weight: 800;
    color: #dc2626;
    margin-bottom: 3px;
    line-height: 1.4;
}
.dark .rt-explicit-warning-title,
[data-theme="dark"] .rt-explicit-warning-title {
    color: #f87171;
}
.rt-explicit-warning-text {
    font-size: 11.5px;
    line-height: 1.6;
    color: var(--text-secondary, #64748b);
}
.dark .rt-explicit-warning-text,
[data-theme="dark"] .rt-explicit-warning-text {
    color: #cbd5e1;
}
.rt-explicit-warning-tag {
    font-size: 15px;
    font-weight: 900;
    color: #ef4444;
    background: rgba(239, 68, 68, 0.12);
    border: 1px dashed rgba(239, 68, 68, 0.5);
    padding: 3px 10px;
    border-radius: 10px;
    letter-spacing: 0.5px;
    flex-shrink: 0;
    align-self: center;
}

@media (max-width: 640px) {
    .rt-explicit-warning-alert {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 12px;
        padding: 12px 14px;
        background: linear-gradient(135deg, rgba(239, 68, 68, 0.14), rgba(185, 28, 28, 0.06));
        border: 1.5px solid rgba(239, 68, 68, 0.45);
        border-radius: 14px;
    }
    .rt-explicit-warning-icon {
        width: 36px;
        height: 36px;
        border-radius: 10px;
    }
    .rt-explicit-warning-icon svg {
        width: 20px;
        height: 20px;
    }
    .rt-explicit-warning-title {
        font-size: 12.5px;
        font-weight: 800;
    }
    .rt-explicit-warning-text {
        font-size: 11px;
        line-height: 1.5;
    }
    .rt-explicit-warning-tag {
        font-size: 13px;
        padding: 2px 8px;
    }
}

/* مخفی‌سازی دکمه‌های ناوبری قبلی/بعدی در کاروسل‌های سایت */
.owl-nav-custom,
.carousel-section .owl-nav,
.rt-owl-section .owl-nav,
.section-nav-wrapper .owl-nav-custom {
    display: none !important;
}

/* ============================================================
   بنر شیک و مدرن آثار و نسخه‌های مرتبط (موزیک ویدیو، ریمیکس و...)
   ============================================================ */
.rt-connected-releases-wrapper {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    margin-top: 14px;
}

.rt-connected-banner {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    background: linear-gradient(135deg, rgba(var(--primary-rgb, 59, 130, 246), 0.08) 0%, rgba(139, 92, 246, 0.06) 100%);
    border: 1.5px solid rgba(var(--primary-rgb, 59, 130, 246), 0.28);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 4px 20px -2px rgba(var(--primary-rgb, 59, 130, 246), 0.12);
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.dark .rt-connected-banner,
[data-theme="dark"] .rt-connected-banner {
    background: linear-gradient(135deg, rgba(var(--primary-rgb, 59, 130, 246), 0.14) 0%, rgba(139, 92, 246, 0.1) 100%);
    border-color: rgba(var(--primary-rgb, 59, 130, 246), 0.38);
    box-shadow: 0 6px 24px -2px rgba(0, 0, 0, 0.35);
}

.rt-connected-banner:hover {
    border-color: rgba(var(--primary-rgb, 59, 130, 246), 0.6);
    transform: translateY(-2px);
    box-shadow: 0 8px 28px -2px rgba(var(--primary-rgb, 59, 130, 246), 0.22);
}

.rt-connected-banner__glow {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(circle at 10% 20%, rgba(var(--primary-rgb, 59, 130, 246), 0.15) 0%, transparent 60%);
    opacity: 0.7;
}

.rt-connected-banner__inner {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    width: 100%;
}

.rt-connected-banner__thumb-wrap {
    position: relative;
    flex-shrink: 0;
    width: 52px;
    height: 52px;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
    display: block;
}

.rt-connected-banner__thumb {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.35s ease;
}

.rt-connected-banner:hover .rt-connected-banner__thumb {
    transform: scale(1.08);
}

.rt-connected-banner__play-ico {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.35);
    color: #ffffff;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.rt-connected-banner:hover .rt-connected-banner__play-ico {
    opacity: 1;
}

.rt-connected-banner__content {
    flex: 1;
    min-width: 0;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.rt-connected-banner__badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: fit-content;
    padding: 2px 9px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.4;
    letter-spacing: 0.3px;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.rt-connected-banner__pulse {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    display: inline-block;
    animation: rtPulseGlow 1.8s infinite ease-in-out;
}

.rt-connected-banner__title-link {
    text-decoration: none;
    color: inherit;
    display: block;
}

.rt-connected-banner__title {
    margin: 0;
    font-size: 13.5px;
    font-weight: 800;
    color: var(--text-primary, #0f172a);
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color 0.2s ease;
}

.dark .rt-connected-banner__title,
[data-theme="dark"] .rt-connected-banner__title {
    color: #ffffff;
}

.rt-connected-banner__title-link:hover .rt-connected-banner__title {
    color: var(--primary, #3b82f6);
}

.rt-connected-banner__artist {
    font-weight: 600;
    color: var(--text-secondary, #64748b);
}

.rt-connected-banner__note {
    margin: 0;
    font-size: 11px;
    line-height: 1.5;
    color: var(--text-secondary, #64748b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rt-connected-banner__action {
    flex-shrink: 0;
}

.rt-connected-banner__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 18px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 800;
    color: #ffffff !important;
    text-decoration: none !important;
    background: linear-gradient(135deg, var(--primary, #3b82f6), var(--secondary, #8b5cf6));
    box-shadow: 0 4px 14px rgba(var(--primary-rgb, 59, 130, 246), 0.35);
    transition: all 0.25s ease;
    white-space: nowrap;
}

.rt-connected-banner__btn:hover {
    transform: translateY(-1px) scale(1.02);
    box-shadow: 0 6px 18px rgba(var(--primary-rgb, 59, 130, 246), 0.5);
}

.rt-connected-banner__arrow {
    transition: transform 0.25s ease;
}

.rt-connected-banner__btn:hover .rt-connected-banner__arrow {
    transform: translateX(3px);
}

@media (max-width: 640px) {
    .rt-connected-banner__inner {
        flex-wrap: wrap;
        padding: 12px 14px;
        gap: 10px;
    }
    .rt-connected-banner__thumb-wrap {
        width: 46px;
        height: 46px;
    }
    .rt-connected-banner__title {
        font-size: 12.5px;
    }
    .rt-connected-banner__note {
        font-size: 10.5px;
    }
    .rt-connected-banner__action {
        width: 100%;
        margin-top: 2px;
    }
    .rt-connected-banner__btn {
        width: 100%;
        justify-content: center;
        padding: 8px 14px;
        font-size: 11.5px;
    }
}
