/* SuRa — شعارات طرق الدفع (متوافق مع دليل هوية مدى للتجارة الإلكترونية)
   الاستخدام: <div class="pay-logos" data-theme="light|dark"></div> ثم payment-logos.js يملؤها.
   الترتيب في الـ DOM: مدى أولاً دائماً → في الصفحات RTL تظهر أقصى اليمين، وفي LTR أقصى اليسار. */
.pay-logos{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.pay-logos.center{justify-content:center}
.pay-logos .pay-logo{display:inline-flex;align-items:center;height:28px}
.pay-logos .pay-logo img{height:100%;width:auto;display:block}
.pay-logos .pay-logo.mada{height:30px;min-width:60px}          /* ≥ 60px عرض — الحد الأدنى في الدليل */
.pay-logos .pay-logo.tabby{font-weight:800;font-size:17px;letter-spacing:.2px;color:#3bbba4;font-family:inherit;line-height:1}
.pay-logos[data-theme="dark"] .pay-logo.tabby{color:#5fd3c0}
.pay-logos.sm .pay-logo{height:20px}
.pay-logos.sm .pay-logo.mada{height:22px}
.pay-logos.sm{gap:12px}
/* شعار داخل خيار دفع (radio) */
.pay-opt-logo{height:22px;width:auto;vertical-align:middle;margin-inline-start:6px}
.pay-opt-logo.mada{height:24px}