/**
 * تصميم القائمة المفتوحة نفسها (بدل تظليل النظام الأزرق) للمتصفحات الداعمة
 * يستخدم appearance: base-select (كروم/إيدج الحديثة)، والمتصفحات الأخرى تبقى على الشكل الأصلي.
 * يُطبق على قوائم الإضافة وقوائم ووردبريس.
 */

@supports (appearance: base-select) {
	.tnt select.tnt-input:not([multiple]),
	.wp-admin .wrap select:not([multiple]) { appearance: base-select; }

	/* سهم المتصفح المدمج مخفي لأننا نرسم سهمنا الخاص */
	.tnt select.tnt-input::picker-icon,
	.wp-admin .wrap select::picker-icon { display: none; }

	.tnt select.tnt-input::picker(select),
	.wp-admin .wrap select::picker(select) {
		appearance: base-select;
		border: 1px solid var(--tnt-border); border-radius: var(--tnt-radius);
		background: var(--tnt-surface); box-shadow: var(--tnt-shadow-lg);
		padding: 6px; margin-block: 6px; max-height: 320px;
		font-family: var(--tnt-font);
	}
	.tnt select.tnt-input option,
	.wp-admin .wrap select option {
		padding: 9px 12px; border-radius: 8px; font-size: 14px; color: var(--tnt-text); cursor: pointer;
	}
	.tnt select.tnt-input option:hover,
	.wp-admin .wrap select option:hover,
	.tnt select.tnt-input option:focus-visible,
	.wp-admin .wrap select option:focus-visible { background: var(--tnt-gold-50); color: var(--tnt-navy-900); outline: none; }
	.tnt select.tnt-input option:checked,
	.wp-admin .wrap select option:checked { background: var(--tnt-primary-50); color: var(--tnt-navy-900); font-weight: 700; }
	/* علامة الاختيار بلون ذهبي */
	.tnt select.tnt-input option::checkmark,
	.wp-admin .wrap select option::checkmark { color: var(--tnt-gold-600); }
}