/* ACC_BADGE Frontend Styles v1.0 — عرض الشارات على الواجهة (محلي 100% · حركات CSS-only) */
/* المتغيّرات inline من Renderer (--acc-badge-bg/--acc-badge-fg) مع قيم احتياطية. لا CDN. */

.acc-badge-group {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 6px;
    vertical-align: middle;
}

.acc-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.6;
    border-radius: 6px;
    background: var(--acc-badge-bg, #e8f0fe);
    color: var(--acc-badge-fg, #1967d2);
}
.acc-badge__text { white-space: nowrap; }

/* ── الأشكال ─────────────────────────────────────── */
.acc-badge--circle       { border-radius: 50%; width: 44px; height: 44px; justify-content: center; padding: 0; }
.acc-badge--rectangle    { border-radius: 0; }
.acc-badge--rounded      { border-radius: 6px; }
.acc-badge--hexagon      { clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%); padding: 6px 14px; }
.acc-badge--price_tag    { border-radius: 4px 12px 12px 4px; }
.acc-badge--ribbon_corner{ position: absolute; inset-block-start: 0; inset-inline-start: 0; border-radius: 0 0 6px 0; }
.acc-badge--diamond      { transform: rotate(45deg); }
.acc-badge--diamond .acc-badge__text { transform: rotate(-45deg); }

/* ── شارة الثقة ──────────────────────────────────── */
.acc-badge-trust {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    font-size: 12px;
    border-radius: 6px;
    background: #f8f9fa;
    color: #1e293b;
}
.acc-badge-trust__icon { display: inline-flex; width: 16px; height: 16px; }
.acc-badge-trust__icon svg { width: 100%; height: 100%; }

/* ── العدّاد التنازلي ────────────────────────────── */
.acc-badge-countdown { font-variant-numeric: tabular-nums; margin-inline-start: 4px; }

/* ── Slot الـ BNPL (حاوية SDK رسمي — فارغة) ───────── */
.acc-badge-bnpl-slot { display: block; min-height: 1px; }

/* ── الحركات (CSS-only) ──────────────────────────── */
@keyframes acc-badge-pulse  { 0%,100% { transform: scale(1); } 50% { transform: scale(1.06); } }
@keyframes acc-badge-glow   { 0%,100% { box-shadow: 0 0 0 rgba(0,0,0,0); } 50% { box-shadow: 0 0 8px currentColor; } }
@keyframes acc-badge-shake  { 0%,100% { transform: translateX(0); } 25% { transform: translateX(-2px); } 75% { transform: translateX(2px); } }
@keyframes acc-badge-bounce { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
@keyframes acc-badge-shimmer{ 0% { opacity: .75; } 50% { opacity: 1; } 100% { opacity: .75; } }
@keyframes acc-badge-fade   { from { opacity: 0; } to { opacity: 1; } }
@keyframes acc-badge-spin   { to { transform: rotate(360deg); } }
@keyframes acc-badge-dot    { 0%,100% { opacity: 1; } 50% { opacity: .3; } }

.acc-badge--anim-pulse    { animation: acc-badge-pulse 1.6s ease-in-out infinite; }
.acc-badge--anim-glow     { animation: acc-badge-glow 1.8s ease-in-out infinite; }
.acc-badge--anim-shake    { animation: acc-badge-shake 1.2s ease-in-out infinite; }
.acc-badge--anim-bounce   { animation: acc-badge-bounce 1.4s ease-in-out infinite; }
.acc-badge--anim-shimmer  { animation: acc-badge-shimmer 1.8s linear infinite; }
.acc-badge--anim-fade_in  { animation: acc-badge-fade .5s ease-in; }
.acc-badge--anim-live_dot::before {
    content: ""; width: 7px; height: 7px; border-radius: 50%;
    background: currentColor; animation: acc-badge-dot 1s ease-in-out infinite;
}
.acc-badge--anim-spin_border { position: relative; }

/* ── احترام تفضيل تقليل الحركة (يشمل معاينة المصمّم لأنها تحمّل هذا الملف) ── */
@media (prefers-reduced-motion: reduce) {
    .acc-badge[class*="acc-badge--anim-"],
    .acc-badge--anim-live_dot::before {
        animation: none !important;
    }
}