/* =========================================================
   Deysong Global Player v2 — استایل‌ها
   ========================================================= */

/* ---------- نوار اصلی ---------- */
.dey-player{
	position:fixed;
	left:0;right:0;bottom:0;
	z-index:99990;
	display:flex;
	align-items:center;
	gap:12px;
	padding:8px 16px;
	direction:rtl;
	font-family:inherit;
	color:#fff;
	background:rgba(20,22,30,.92);
	backdrop-filter:blur(16px);
	-webkit-backdrop-filter:blur(16px);
	border-top:1px solid rgba(255,255,255,.08);
	box-shadow:0 -8px 30px rgba(0,0,0,.35);
	transform:translateY(100%);
	transition:transform .35s cubic-bezier(.2,.8,.2,1);
}
.dey-player.is-visible{transform:translateY(0)}
.dey-player[hidden]{display:none!important}

body.dey-player-open{padding-bottom:74px}

/* ---------- کاور ---------- */
.dp-cover{
	position:relative;
	flex:0 0 48px;
	width:48px;height:48px;
	border-radius:10px;
	overflow:hidden;
	background:linear-gradient(135deg,#ee2b47,#7a1224);
	box-shadow:0 4px 14px rgba(238,43,71,.35);
}
.dp-cover img{width:100%;height:100%;object-fit:cover;display:block}
.dp-cover img:not([src]),.dp-cover img[src=""]{opacity:0}

/* اکولایزر */
.dp-eq{position:absolute;inset:0;display:none;align-items:flex-end;justify-content:center;gap:3px;background:rgba(0,0,0,.35)}
.dey-player.is-playing .dp-eq{display:flex}
.dp-eq i{width:3px;height:6px;background:#fff;border-radius:2px;animation:dpEq .9s ease-in-out infinite}
.dp-eq i:nth-child(2){animation-delay:.2s}
.dp-eq i:nth-child(3){animation-delay:.4s}
@keyframes dpEq{0%,100%{height:5px}50%{height:18px}}

/* ---------- لودر ---------- */
.dp-loader{
	display:none;
	position:absolute;
	top:50%;left:50%;
	width:20px;height:20px;
	margin:-10px 0 0 -10px;
	border:2px solid rgba(255,255,255,.3);
	border-top-color:#fff;
	border-radius:50%;
	animation:dpSpin .6s linear infinite;
}
@keyframes dpSpin{to{transform:rotate(360deg)}}

/* ---------- عنوان ---------- */
.dp-meta{display:flex;flex-direction:column;justify-content:center;min-width:0;flex:0 1 180px}
.dp-title{color:#fff;font-size:13px;font-weight:700;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dp-title:hover{color:#ff8095}
.dp-artist{color:#9aa0b3;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}

/* ---------- دکمه‌های کنترل ---------- */
.dp-controls{display:flex;align-items:center;gap:4px;flex:0 0 auto;direction:ltr}

.dey-player button{
	background:none;border:0;cursor:pointer;color:#cfd3e0;
	display:inline-flex;align-items:center;justify-content:center;
	padding:6px;border-radius:50%;transition:.2s;
}
.dey-player button:hover{color:#fff;background:rgba(255,255,255,.08)}
.dey-player button svg{fill:currentColor}

.dp-toggle{
	background:#ee2b47!important;color:#fff;
	width:42px;height:42px;
	box-shadow:0 4px 14px rgba(238,43,71,.4);
}
.dp-toggle:hover{background:#ff3653!important;transform:scale(1.05)}

/* ---------- دکمه‌های تکرار و شافل ---------- */
.dp-repeat,.dp-shuffle,.dp-list{
	position:relative;
}
.dp-repeat.is-active,.dp-shuffle.is-active,.dp-list.is-active{
	color:#ee2b47!important;
}
.dp-repeat-label{
	position:absolute;
	top:2px;right:2px;
	font-size:8px;font-weight:700;
	color:#ee2b47;
	line-height:1;
}

/* ---------- نوار پیشرفت ---------- */
.dp-progress{display:flex;align-items:center;gap:8px;flex:1 1 auto;min-width:100px;direction:ltr}
.dp-cur,.dp-dur{font-size:11px;color:#9aa0b3;font-variant-numeric:tabular-nums;flex:0 0 auto}

.dp-bar{
	position:relative;flex:1 1 auto;height:5px;border-radius:4px;
	background:rgba(255,255,255,.14);
	cursor:pointer;
}
.dp-buffered{position:absolute;left:0;top:0;height:100%;width:0;border-radius:4px;background:rgba(255,255,255,.18);pointer-events:none}
.dp-played{position:absolute;left:0;top:0;height:100%;width:0;border-radius:4px;background:linear-gradient(90deg,#ee2b47,#ff6a85);pointer-events:none}

.dp-seek{
	position:absolute;left:0;top:0;
	width:100%;height:100%;margin:0;
	background:none;cursor:pointer;
	-webkit-appearance:none;appearance:none;
	direction:ltr;
}
.dp-seek::-webkit-slider-thumb{
	-webkit-appearance:none;appearance:none;
	width:14px;height:14px;border-radius:50%;
	background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.4);
	opacity:0;transition:.2s;
}
.dp-seek::-moz-range-thumb{
	width:14px;height:14px;border:0;border-radius:50%;
	background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.4);
	opacity:0;
}
.dp-bar:hover .dp-seek::-webkit-slider-thumb{opacity:1}
.dp-bar:hover .dp-seek::-moz-range-thumb{opacity:1}

/* ---------- صدا و بستن ---------- */
.dp-extra{display:flex;align-items:center;gap:4px;flex:0 0 auto;direction:ltr}
.dp-vol{width:80px;height:4px;cursor:pointer;accent-color:#ee2b47}
.dp-close{color:#7a8095!important}

/* ---------- پنل لیست پخش ---------- */
.dp-playlist-panel{
	display:none;
	position:absolute;
	bottom:100%;
	left:0;right:0;
	max-height:350px;
	overflow-y:auto;
	background:rgba(20,22,30,.96);
	backdrop-filter:blur(16px);
	-webkit-backdrop-filter:blur(16px);
	border-top:1px solid rgba(255,255,255,.08);
	border-radius:14px 14px 0 0;
	box-shadow:0 -8px 30px rgba(0,0,0,.4);
	direction:rtl;
	z-index:99991;
}
.dp-playlist-panel.is-open{display:block}

.dp-pl-header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:12px 16px;
	border-bottom:1px solid rgba(255,255,255,.06);
	font-size:13px;font-weight:700;color:#fff;
}
.dp-pl-count{font-size:11px;color:#9aa0b3;font-weight:400}

.dp-pl-items{padding:4px 0}

.dp-pl-item{
	display:flex;
	align-items:center;
	gap:10px;
	padding:8px 16px;
	cursor:pointer;
	transition:background .15s;
}
.dp-pl-item:hover{background:rgba(255,255,255,.06)}
.dp-pl-item.is-active{background:rgba(238,43,71,.12)}
.dp-pl-item.is-active .dp-pl-title{color:#ee2b47}

.dp-pl-num{
	flex:0 0 24px;
	font-size:11px;color:#7a8095;
	text-align:center;
}
.dp-pl-item.is-active .dp-pl-num{color:#ee2b47}

.dp-pl-info{flex:1;min-width:0}
.dp-pl-title{
	display:block;
	font-size:12px;font-weight:600;color:#fff;
	white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.dp-pl-artist{
	display:block;
	font-size:10px;color:#7a8095;
	white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
	margin-top:1px;
}
.dp-pl-dur{flex:0 0 auto;font-size:10px;color:#7a8095}

/* ---------- دکمه‌های مینی ---------- */
.dey-mini-play{
	display:inline-flex;align-items:center;justify-content:center;
	width:34px;height:34px;border:0;border-radius:50%;cursor:pointer;
	background:#ee2b47;color:#fff;transition:.2s;
	box-shadow:0 3px 10px rgba(238,43,71,.35);
}
.dey-mini-play:hover{transform:scale(1.08);background:#ff3653}
.dey-mini-play svg{fill:#fff}
.dey-mini-play.is-active{background:#1db954;box-shadow:0 3px 10px rgba(29,185,84,.4)}

/* ---------- تم روشن ---------- */
.dey-player.is-light{background:rgba(255,255,255,.92);color:#222;border-top:1px solid rgba(0,0,0,.06)}
.dey-player.is-light .dp-title{color:#222}
.dey-player.is-light .dp-artist,.dey-player.is-light .dp-cur,.dey-player.is-light .dp-dur{color:#777}
.dey-player.is-light button{color:#555}

/* =========================================================
   واکنش‌گرا — موبایل
   ========================================================= */
@media (max-width:768px){
	.dey-player{
		gap:8px;
		padding:6px 10px;
		flex-wrap:wrap;
	}
	.dp-cover{width:42px;height:42px;flex:0 0 42px;border-radius:8px}
	.dp-meta{flex:1 1 auto;min-width:0}
	.dp-controls{gap:2px}
	.dp-controls button{padding:4px}
	.dp-toggle{width:38px;height:38px}
	.dp-extra{display:none}
	.dp-progress{
		order:10;
		flex:1 1 100%;
		min-width:100%;
		margin-top:4px;
	}
	body.dey-player-open{padding-bottom:90px}

	/* لیست پخش موبایل */
	.dp-playlist-panel{max-height:280px;border-radius:12px 12px 0 0}
}

@media (max-width:480px){
	.dey-player{padding:6px 8px;gap:6px}
	.dp-cover{width:38px;height:38px;flex:0 0 38px}
	.dp-meta{flex:1 1 60px}
	.dp-title{font-size:12px}
	.dp-artist{font-size:10px}
	.dp-cur,.dp-dur{font-size:10px}
}

@media (max-width:380px){
	.dp-cur,.dp-dur{display:none}
	.dp-prev,.dp-next{display:none}
	.dp-cover{width:34px;height:34px;flex:0 0 34px}
}
