/* IPTV Expert Manager — Customer Portal (RTL, theme-inheriting) */

.iptvem-portal {
	direction: rtl;
	max-width: 760px;
	margin: 0 auto;
	/* متغيرات قابلة للوراثة من الثيم مع قيم احتياطية */
	--iptvem-accent: var( --wp--preset--color--primary, #2271b1 );
	--iptvem-wa: #25d366;
	--iptvem-radius: 14px;
	--iptvem-border: rgba( 0, 0, 0, .1 );
	--iptvem-muted: rgba( 0, 0, 0, .55 );
	font-size: 16px;
}
.iptvem-portal * { box-sizing: border-box; }

/* ===== الرأس ===== */
.iptvem-portal-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	margin-bottom: 22px;
	padding-bottom: 16px;
	border-bottom: 1px solid var( --iptvem-border );
}
.iptvem-greeting { display: flex; flex-direction: column; gap: 2px; }
.iptvem-hello { color: var( --iptvem-muted ); font-size: .85em; }
.iptvem-name { font-size: 1.35em; font-weight: 700; }
.iptvem-head-actions { display: flex; gap: 8px; align-items: center; }

/* ===== الأزرار ===== */
.iptvem-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 9px 18px;
	border-radius: 999px;
	font-weight: 600;
	font-size: .9em;
	text-decoration: none;
	cursor: pointer;
	border: 1px solid transparent;
	transition: transform .12s, box-shadow .12s, background .12s;
	line-height: 1.4;
}
.iptvem-btn:hover { transform: translateY( -1px ); }
.iptvem-btn-wa { background: var( --iptvem-wa ); color: #fff; }
.iptvem-btn-wa:hover { box-shadow: 0 6px 16px rgba( 37, 211, 102, .35 ); color: #fff; }
.iptvem-btn-primary { background: var( --iptvem-accent ); color: #fff; }
.iptvem-btn-ghost {
	background: transparent;
	border-color: var( --iptvem-border );
	color: inherit;
}
.iptvem-wa-icon { font-size: 1.1em; }

/* ===== عناوين الأقسام ===== */
.iptvem-section-title {
	font-size: 1.05em;
	font-weight: 700;
	margin: 26px 0 14px;
	display: flex;
	align-items: center;
	gap: 10px;
}
.iptvem-section-title::before {
	content: "";
	width: 4px;
	height: 18px;
	background: var( --iptvem-accent );
	border-radius: 4px;
}
.iptvem-muted-title { color: var( --iptvem-muted ); }
.iptvem-muted-title::before { background: var( --iptvem-muted ); }

/* ===== البطاقات ===== */
.iptvem-cards {
	display: grid;
	grid-template-columns: repeat( auto-fill, minmax( 320px, 1fr ) );
	gap: 16px;
}
.iptvem-card {
	border: 1px solid var( --iptvem-border );
	border-radius: var( --iptvem-radius );
	padding: 18px;
	background: rgba( 255, 255, 255, .6 );
	backdrop-filter: saturate( 1.1 );
	position: relative;
	overflow: hidden;
}
.iptvem-card::before {
	content: "";
	position: absolute;
	inset-block: 0;
	inset-inline-start: 0;
	width: 5px;
}
.iptvem-status-active::before { background: #00a32a; }
.iptvem-status-expiring::before { background: #dba617; }
.iptvem-status-expired::before { background: #d63638; }
.iptvem-status-cancelled::before,
.iptvem-status-archived::before { background: #8c8f94; }
.iptvem-cards-muted .iptvem-card { opacity: .82; }

.iptvem-card-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 14px;
	gap: 10px;
}
.iptvem-type { font-size: 1.15em; font-weight: 700; }

.iptvem-badge {
	display: inline-block;
	padding: 4px 12px;
	border-radius: 999px;
	font-size: .78em;
	font-weight: 700;
	white-space: nowrap;
}
.iptvem-badge-active { background: #d3f5dd; color: #00701c; }
.iptvem-badge-expiring { background: #fcf2d6; color: #8a6400; }
.iptvem-badge-expired { background: #fcdede; color: #a8000b; }
.iptvem-badge-cancelled,
.iptvem-badge-archived { background: #e8e8e9; color: #50575e; }

.iptvem-row {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 7px 0;
	font-size: .92em;
	border-bottom: 1px dashed var( --iptvem-border );
}
.iptvem-row:last-child { border-bottom: none; }
.iptvem-k { color: var( --iptvem-muted ); }
.iptvem-v { font-weight: 600; text-align: left; direction: ltr; word-break: break-all; }

/* ===== بيانات الدخول ===== */
.iptvem-secret {
	margin-top: 14px;
	border-top: 1px solid var( --iptvem-border );
	padding-top: 12px;
}
.iptvem-secret-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-weight: 700;
	font-size: .9em;
}
.iptvem-toggle {
	background: var( --iptvem-accent );
	color: #fff;
	border: none;
	border-radius: 999px;
	padding: 4px 14px;
	font-size: .82em;
	cursor: pointer;
	font-weight: 600;
}
.iptvem-secret-body { margin-top: 10px; }
.iptvem-secret-row .iptvem-v {
	cursor: pointer;
	background: rgba( 0, 0, 0, .04 );
	padding: 3px 8px;
	border-radius: 6px;
	position: relative;
}
.iptvem-copy:hover { background: rgba( 0, 0, 0, .08 ); }
.iptvem-copy::after {
	content: "📋";
	margin-inline-start: 6px;
	font-size: .85em;
	opacity: .6;
}

/* ===== فارغ / دعوة الدخول ===== */
.iptvem-empty, .iptvem-login-card {
	text-align: center;
	padding: 40px 20px;
	border: 1px dashed var( --iptvem-border );
	border-radius: var( --iptvem-radius );
}
.iptvem-login-card h3 { margin-top: 0; font-size: 1.4em; }
.iptvem-login-card .iptvem-btn { margin: 10px 0; }

.iptvem-portal-foot { margin-top: 26px; text-align: center; }
.iptvem-help-line { color: var( --iptvem-muted ); font-size: .9em; }
.iptvem-help-line a { color: var( --iptvem-wa ); font-weight: 700; text-decoration: none; }

/* ===== توست ===== */
.iptvem-ptoast {
	position: fixed;
	bottom: 24px;
	left: 50%;
	transform: translateX( -50% ) translateY( 16px );
	background: #1d2327;
	color: #fff;
	padding: 11px 20px;
	border-radius: 8px;
	z-index: 99999;
	opacity: 0;
	transition: all .3s;
	font-size: .9em;
}
.iptvem-ptoast.show { opacity: 1; transform: translateX( -50% ) translateY( 0 ); }

/* ===== استجابة الجوال ===== */
@media screen and ( max-width: 600px ) {
	.iptvem-portal { font-size: 15px; }
	.iptvem-cards { grid-template-columns: 1fr; }
	.iptvem-portal-head { flex-direction: column; align-items: flex-start; }
	.iptvem-head-actions { width: 100%; }
	.iptvem-head-actions .iptvem-btn { flex: 1; justify-content: center; }
	.iptvem-card { padding: 16px; }
}

@media ( prefers-reduced-motion: reduce ) {
	.iptvem-btn, .iptvem-ptoast { transition: none; }
	.iptvem-btn:hover { transform: none; }
}
