/* ── Sections wrapper (page/single/archive inject) ── */
.oic-sections-wrap {
    width: 100%;
    overflow-x: clip;
}

/* ═══ OIC Section Builder — Frontend v1.1.599 ═══ */

/* منع شريط التمرير الأفقي */
body { overflow-x: clip; } /* clip بدل hidden يسمح بـ full width صحيح */

/* السكشن */
.oic-sb-sec { position:relative; overflow:hidden; isolation:isolate; }

/* خلفية صورة */
.oic-sb-bg-img { position:absolute; inset:0; background:no-repeat center/cover; z-index:0; }
.oic-sb-overlay { position:absolute; inset:0; z-index:0; pointer-events:none; }

/* خلفية فيديو */
.oic-sb-bg-vid, video.oic-sb-bg-vid { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; pointer-events:none; }
.oic-sb-bg-vid iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }

/* المحتوى الداخلي فوق الخلفية */
.oic-sb-inner { position:relative; z-index:2; }

/* ═══ Grid — بدون تعارض مع inline styles ═══ */
.oic-sb-grid--1:not([style*="grid-template"]) { grid-template-columns:1fr; }
.oic-sb-grid--2:not([style*="grid-template"]) { grid-template-columns:1fr 1fr; }
.oic-sb-grid--1-2:not([style*="grid-template"]) { grid-template-columns:1fr 2fr; }
.oic-sb-grid--2-1:not([style*="grid-template"]) { grid-template-columns:2fr 1fr; }
.oic-sb-grid--3:not([style*="grid-template"]) { grid-template-columns:repeat(3,1fr); }
.oic-sb-grid--4:not([style*="grid-template"]) { grid-template-columns:repeat(4,1fr); }

/* Responsive افتراضي — عمود واحد للتابلت والموبايل */
@media(max-width:1024px) {
    .oic-sb-grid--2, .oic-sb-grid--1-2, .oic-sb-grid--2-1,
    .oic-sb-grid--3, .oic-sb-grid--4 { grid-template-columns:1fr !important; }
}
@media(max-width:768px) {
    .oic-sb-grid--2, .oic-sb-grid--1-2, .oic-sb-grid--2-1,
    .oic-sb-grid--3, .oic-sb-grid--4 { grid-template-columns:1fr !important; }
}

/* ═══ الأعمدة ═══ */
.oic-sb-col { min-width:0; overflow:hidden; }
.oic-sb-html img { max-width:100%; height:auto; border-radius:var(--radius-sm,8px); }
.oic-sb-page { line-height:1.7; }
.oic-sb-col .oic-grid { gap:14px; }

/* إزالة padding مكرر */
.oic-sb-sec .oic-section { padding:0; }
.oic-sb-sec .oic-section .container { padding:0; max-width:none; }
.oic-sb-sec .oic-section-bg { padding:0; margin:0; border-radius:0; }

/* ═══ الكارد يتكيف مع المساحة تلقائياً ═══ */
.oic-sb-col * { max-width:100%; box-sizing:border-box; }
.oic-sb-col img { max-width:100%; height:auto; }
.oic-sb-col .oic-card,
.oic-sb-col .oic-list__item,
.oic-sb-col .oic-reg__item,
.oic-sb-col [class*="oic-"] {
    max-width:100%;
    overflow:hidden;
    word-wrap:break-word;
    overflow-wrap:break-word;
}

/* ═══ نمط البلوك ═══ */
.oic-sb-sec.block-bordered .oic-sb-inner { border:1px solid rgba(0,0,0,.08); border-radius:14px; padding:20px; }
.oic-sb-sec.block-glass .oic-sb-inner { background:rgba(255,255,255,.06) !important; backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border:1px solid rgba(255,255,255,.1); border-radius:14px; padding:20px; }
.oic-sb-sec.block-glow .oic-sb-inner { box-shadow:0 0 40px rgba(99,102,241,.25); border-radius:14px; padding:20px; }
.oic-sb-sec.block-shadow .oic-sb-inner { box-shadow:0 8px 30px rgba(0,0,0,.12); border-radius:14px; padding:20px; background:#fff; }

/* ═══ Animations — حركات الدخول ═══ */
/* → animation defined below */
.oic-anim.fade-up { transform:translateY(50px); }
.oic-anim.fade-down { transform:translateY(-50px); }
.oic-anim.fade-right { transform:translateX(-50px); }
.oic-anim.fade-left { transform:translateX(50px); }
.oic-anim.zoom-in { transform:scale(.85); }
.oic-anim.flip { transform:perspective(800px) rotateY(20deg); }
.oic-anim.is-visible { opacity:1 !important; transform:none !important; }
/* Fallback: إذا JS لم يعمل، أظهر بعد 2 ثانية */
@media(prefers-reduced-motion: reduce) { .oic-anim { opacity:1; transform:none; } }

/* ═══ Background Patterns — أنماط هندسية ═══ */
.oic-sb-sec.style-1{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%) !important;color:#fff !important}
.oic-sb-sec.style-1::before{content:'';position:absolute;top:-200px;left:-200px;width:600px;height:600px;background:radial-gradient(circle,rgba(255,255,255,.1) 0%,transparent 70%);border-radius:50%;z-index:0}
.oic-sb-sec.style-1::after{content:'';position:absolute;bottom:-100px;right:-100px;width:400px;height:400px;background:radial-gradient(circle,rgba(255,255,255,.08) 0%,transparent 70%);border-radius:50%;z-index:0}
.oic-sb-sec.style-2{background:linear-gradient(135deg,#f093fb 0%,#f5576c 100%) !important;color:#fff !important}
.oic-sb-sec.style-2::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(45deg,transparent 40%,rgba(255,255,255,.08) 40%,rgba(255,255,255,.08) 60%,transparent 60%);z-index:0}
.oic-sb-sec.style-3{background:linear-gradient(135deg,#4facfe 0%,#00f2fe 100%) !important;color:#fff !important}
.oic-sb-sec.style-3::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(45deg,transparent,transparent 20px,rgba(255,255,255,.05) 20px,rgba(255,255,255,.05) 40px);z-index:0}
.oic-sb-sec.style-4{background:linear-gradient(135deg,#43e97b 0%,#38f9d7 100%) !important;color:#1e293b !important}
.oic-sb-sec.style-5{background:linear-gradient(135deg,#fa709a 0%,#fee140 100%) !important;color:#1e293b !important}
.oic-sb-sec.style-5::before{content:'';position:absolute;top:10%;left:5%;width:200px;height:200px;background:rgba(255,255,255,.08);transform:rotate(45deg);z-index:0}
.oic-sb-sec.style-5::after{content:'';position:absolute;bottom:15%;right:10%;width:150px;height:150px;background:rgba(255,255,255,.06);border-radius:50%;z-index:0}
.oic-sb-sec.style-6{background:linear-gradient(135deg,#a18cd1 0%,#fbc2eb 100%) !important;color:#1e293b !important}
.oic-sb-sec.style-6::before{content:'';position:absolute;top:-50px;right:-50px;width:300px;height:300px;background:rgba(255,255,255,.1);border-radius:60% 40% 30% 70%/60% 30% 70% 40%;z-index:0}
.oic-sb-sec.style-7{background:linear-gradient(135deg,#ffecd2 0%,#fcb69f 100%) !important;color:#1e293b !important}
.oic-sb-sec.style-7::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(0,0,0,.05) 1px,transparent 1px);background-size:30px 30px;z-index:0}
.oic-sb-sec.style-8{background:linear-gradient(135deg,#a1c4fd 0%,#c2e9fb 100%) !important;color:#1e293b !important}
.oic-sb-sec.style-8::before{content:'';position:absolute;top:0;left:0;width:40%;height:100%;background:rgba(255,255,255,.1);clip-path:polygon(0 0,100% 0,70% 100%,0 100%);z-index:0}
.oic-sb-sec.style-9{background:linear-gradient(135deg,#d4fc79 0%,#96e6a1 100%) !important;color:#1e293b !important}
.oic-sb-sec.style-9::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:500px;height:500px;border:40px solid rgba(255,255,255,.06);border-radius:50%;z-index:0}
.oic-sb-sec.style-10{background:linear-gradient(135deg,#84fab0 0%,#8fd3f4 100%) !important;color:#1e293b !important}
.oic-sb-sec.style-10::before{content:'';position:absolute;top:50%;right:-100px;transform:translateY(-50%);width:300px;height:260px;background:rgba(255,255,255,.08);clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);z-index:0}
.oic-sb-sec.style-11{background:linear-gradient(135deg,#f6d365 0%,#fda085 100%) !important;color:#1e293b !important}
.oic-sb-sec.style-11::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent,transparent 30px,rgba(255,255,255,.04) 30px,rgba(255,255,255,.04) 60px);z-index:0}
.oic-sb-sec.style-12{background:linear-gradient(135deg,#fbc2eb 0%,#a6c1ee 100%) !important;color:#1e293b !important}
.oic-sb-sec.style-12::before{content:'';position:absolute;top:20%;left:10%;width:200px;height:200px;border:3px solid rgba(255,255,255,.15);border-radius:50%;z-index:0}
.oic-sb-sec.style-12::after{content:'';position:absolute;bottom:10%;right:15%;width:150px;height:150px;border:3px solid rgba(255,255,255,.1);border-radius:50%;z-index:0}
.oic-sb-sec.style-13{background:linear-gradient(135deg,#0c3483 0%,#a2b6df 100%) !important;color:#fff !important}
.oic-sb-sec.style-13::before{content:'';position:absolute;top:20%;left:15%;width:4px;height:4px;background:#fff;border-radius:50%;box-shadow:100px 50px 0 1px rgba(255,255,255,.3),250px 120px 0 0 rgba(255,255,255,.2),400px 30px 0 1px rgba(255,255,255,.4),150px 200px 0 0 rgba(255,255,255,.2);z-index:0}
.oic-sb-sec.style-14{background:linear-gradient(135deg,#e0c3fc 0%,#8ec5fc 100%) !important;color:#1e293b !important}
.oic-sb-sec.style-14::before{content:'';position:absolute;bottom:0;left:0;border-left:200px solid rgba(255,255,255,.08);border-top:300px solid transparent;z-index:0}
.oic-sb-sec.style-14::after{content:'';position:absolute;top:0;right:0;border-right:150px solid rgba(255,255,255,.06);border-bottom:250px solid transparent;z-index:0}
.oic-sb-sec.style-15{background:linear-gradient(135deg,#c471f5 0%,#fa71cd 100%) !important;color:#fff !important}
.oic-sb-sec.style-15::before{content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.15) 2px,transparent 2px);background-size:40px 40px;z-index:0}

/* ── OIC Section Builder: New Column Types ── */
.oic-sb-text { padding: 4px 0; }
.oic-sb-eyebrow { color: var(--c-primary, #2563eb); }
.oic-sb-title { color: inherit; }
.oic-sb-btns { display: flex; flex-wrap: wrap; gap: 10px; }

.oic-btn {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 10px 24px; border-radius: var(--radius-btn, 8px);
    font-weight: 600; font-size: 14px; text-decoration: none;
    transition: all 0.2s ease; cursor: pointer; border: 2px solid transparent;
}
.oic-btn--primary   { background: var(--c-primary, #2563eb); color: #fff; }
.oic-btn--primary:hover { opacity: 0.88; transform: translateY(-1px); }
.oic-btn--secondary { background: var(--c-secondary, #7c3aed); color: #fff; }
.oic-btn--secondary:hover { opacity: 0.88; transform: translateY(-1px); }
.oic-btn--outline   { background: transparent; color: var(--c-primary, #2563eb); border-color: var(--c-primary, #2563eb); }
.oic-btn--outline:hover { background: var(--c-primary, #2563eb); color: #fff; }
.oic-btn--ghost     { background: transparent; color: var(--c-text, #1e293b); }
.oic-btn--ghost:hover { background: rgba(0,0,0,.06); }

.oic-sb-youtube { border-radius: 8px; overflow: hidden; }
.oic-sb-icon { line-height: 1; }
.oic-sb-icon svg, .oic-sb-icon i { color: var(--c-primary, #2563eb); }

/* ── محاذاة محتوى العمود ── */
.oic-sb-col { --col-justify: flex-start; }
.oic-sb-col .oic-sb-btns,
.oic-sb-col .oic-btn,
.oic-sb-col .oic-sb-text .oic-sb-btns {
    justify-content: var(--col-justify);
}
/* توسيط النصوص والعناوين */
.oic-sb-col[style*="text-align:center"] .oic-sb-title,
.oic-sb-col[style*="text-align:center"] .oic-sb-eyebrow,
.oic-sb-col[style*="text-align:center"] .oic-sb-desc,
.oic-sb-col[style*="text-align:center"] .oic-sb-body { text-align: center; }
.oic-sb-col[style*="text-align:right"] .oic-sb-title,
.oic-sb-col[style*="text-align:right"] .oic-sb-eyebrow,
.oic-sb-col[style*="text-align:right"] .oic-sb-desc { text-align: right; }
.oic-sb-col[style*="text-align:left"] .oic-sb-title,
.oic-sb-col[style*="text-align:left"] .oic-sb-eyebrow,
.oic-sb-col[style*="text-align:left"] .oic-sb-desc { text-align: left; }

/* ── نمط فوق الخلفية — شفافية قابلة للتحكم ── */
/* --pattern-opacity deprecated — replaced by --pat-opacity in core.css oic-pat-* classes */

/* ── كارد مميز ── */
.oic-feature-card { transition: transform .3s ease, box-shadow .3s ease; }
.oic-feature-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(0,0,0,.15); }

/* ── الزر مفرغ وشفاف ── */
.oic-btn--outline {
    background: transparent !important;
    color: var(--c-primary, #2563eb) !important;
    border: 2px solid var(--c-primary, #2563eb) !important;
}
.oic-btn--outline:hover {
    background: var(--c-primary, #2563eb) !important;
    color: #fff !important;
}
.oic-btn--ghost {
    background: transparent !important;
    color: inherit !important;
    border: 2px solid rgba(255,255,255,.4) !important;
}
.oic-btn--ghost:hover {
    background: rgba(255,255,255,.15) !important;
}

/* ── حركة الفليب للكارد المميز ── */
.oic-feature-card.fc-flip {
    perspective: 1000px;
    background: transparent !important;
    padding: 0 !important;
}
.oic-feature-card.fc-flip .oic-fc-inner {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: inherit;
    transform-style: preserve-3d;
    transition: transform .6s cubic-bezier(.4,0,.2,1);
}
.oic-feature-card.fc-flip:hover .oic-fc-inner { transform: rotateY(180deg); }
.oic-feature-card.fc-flip.fc-flip-v:hover .oic-fc-inner { transform: rotateX(180deg); }
.oic-feature-card.fc-flip .oic-fc-front,
.oic-feature-card.fc-flip .oic-fc-back {
    position: absolute; inset: 0;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    border-radius: inherit;
    padding: 28px 20px;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.oic-feature-card.fc-flip .oic-fc-back {
    transform: rotateY(180deg);
    background: var(--c-primary, #2563eb);
    color: #fff;
}
.oic-feature-card.fc-flip.fc-flip-v .oic-fc-back { transform: rotateX(180deg); }

/* ═══ Repeater Card ═══ */
.oic-repeater { display:grid; }
.oic-repeater-card { box-sizing:border-box; transition:transform .3s, box-shadow .3s; }
.oic-repeater-card.oic-fc-hover--lift:hover  { transform:translateY(-4px); box-shadow:0 12px 28px rgba(0,0,0,.12); }
.oic-repeater-card.oic-fc-hover--shadow:hover { box-shadow:0 8px 24px rgba(0,0,0,.18); }
.oic-repeater-card.oic-fc-hover--glow:hover  { box-shadow:0 0 0 3px var(--c-primary,#2563eb); }



/* ═══════════════════════════════════════════════════════
   ADVANCED HOVER EFFECTS — feature card + repeater
   ═══════════════════════════════════════════════════════ */

/* ── lift ── */
.oic-feature-card.fc-hover--lift:hover,
.oic-repeater-card.oic-fc-hover--lift:hover {
    transform: translateY(-5px);
    box-shadow: 0 16px 40px rgba(0,0,0,.14);
}

/* ── shadow ── */
.oic-feature-card.fc-hover--shadow:hover,
.oic-repeater-card.oic-fc-hover--shadow:hover {
    box-shadow: 0 20px 50px rgba(0,0,0,.22);
}

/* ── scale ── */
.oic-feature-card.fc-hover--scale:hover,
.oic-repeater-card.oic-fc-hover--scale:hover {
    transform: scale(1.03);
    box-shadow: 0 12px 32px rgba(0,0,0,.12);
}

/* ── glow ── */
.oic-feature-card.fc-hover--glow:hover,
.oic-repeater-card.oic-fc-hover--glow:hover {
    box-shadow: 0 0 0 3px var(--c-primary,#2563eb), 0 8px 24px rgba(37,99,235,.25);
}

/* ── border ── */
.oic-feature-card.fc-hover--border,
.oic-repeater-card.oic-fc-hover--border {
    border: 2px solid transparent;
    transition: border-color .25s, transform .25s, box-shadow .25s;
}
.oic-feature-card.fc-hover--border:hover,
.oic-repeater-card.oic-fc-hover--border:hover {
    border-color: var(--c-primary,#2563eb);
}

/* ── sweep (color sweep from left) ── */
.oic-feature-card.fc-hover--sweep,
.oic-repeater-card.oic-fc-hover--sweep {
    position: relative;
    overflow: hidden;
    transition: color .3s;
}
.oic-feature-card.fc-hover--sweep::before,
.oic-repeater-card.oic-fc-hover--sweep::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--c-primary,#2563eb);
    transform: translateX(-101%);
    transition: transform .35s cubic-bezier(.4,0,.2,1);
    z-index: 0;
    border-radius: inherit;
}
.oic-feature-card.fc-hover--sweep:hover::before,
.oic-repeater-card.oic-fc-hover--sweep:hover::before {
    transform: translateX(0);
}
.oic-feature-card.fc-hover--sweep:hover,
.oic-repeater-card.oic-fc-hover--sweep:hover {
    color: #fff;
}
.oic-feature-card.fc-hover--sweep .oic-fc-content,
.oic-repeater-card.oic-fc-hover--sweep .oic-rp-content {
    position: relative;
    z-index: 2;
}

/* ── shimmer (moving light) ── */
.oic-feature-card.fc-hover--shimmer,
.oic-repeater-card.oic-fc-hover--shimmer {
    position: relative;
    overflow: hidden;
}
.oic-feature-card.fc-hover--shimmer::after,
.oic-repeater-card.oic-fc-hover--shimmer::after {
    content: '';
    position: absolute;
    top: -60%;
    left: -60%;
    width: 40%;
    height: 200%;
    background: linear-gradient(
        105deg,
        transparent 40%,
        rgba(255,255,255,.45) 50%,
        transparent 60%
    );
    transform: translateX(-100%) rotate(10deg);
    transition: transform 0s;
    z-index: 1;
    pointer-events: none;
}
.oic-feature-card.fc-hover--shimmer:hover::after,
.oic-repeater-card.oic-fc-hover--shimmer:hover::after {
    transform: translateX(400%) rotate(10deg);
    transition: transform .65s ease;
}

/* ── engraved (inset shadow) ── */
.oic-feature-card.fc-hover--engraved,
.oic-repeater-card.oic-fc-hover--engraved {
    transition: box-shadow .25s, transform .25s;
}
.oic-feature-card.fc-hover--engraved:hover,
.oic-repeater-card.oic-fc-hover--engraved:hover {
    box-shadow:
        inset 0 2px 6px rgba(0,0,0,.18),
        inset 0 -1px 3px rgba(255,255,255,.6),
        0 1px 0 rgba(255,255,255,.5);
    transform: translateY(1px);
}

/* ── transition base لكل الكروت ── */
.oic-feature-card,
.oic-repeater-card {
    transition: transform .28s cubic-bezier(.4,0,.2,1),
                box-shadow .28s cubic-bezier(.4,0,.2,1),
                border-color .28s,
                color .28s;
}

/* ═══ عرض السكشن — 3 أوضاع ═══
 *
 * contained: محصور بـ max-width داخل .site-main
 * wide:      عرض 100% من .site-main  
 * full:      في صفحات بدون سايدبار → 100vw
 *            في صفحات بها سايدبار  → 100% من .site-main (تلقائياً)
 *            القرار يُتخذ بـ PHP حسب oic_has_sidebar()
 * ═══════════════════════════════════════════════════════════════ */

/* contained: عرض محدد في منتصف الـ site-main */
.oic-sb-sec.sec-width--contained {
    width: 100%;
    max-width: var(--container-xl, 1280px);
    margin-inline: auto;
    box-sizing: border-box;
    overflow: clip;
}

/* wide: كامل عرض الـ site-main */
.oic-sb-sec.sec-width--wide {
    width: 100%;
    max-width: 100%;
}

/* full: يمتد لعرض الشاشة الكامل */
.oic-sb-sec.sec-width--full {
    width: 100%;
    max-width: 100%;
    overflow: clip;
}

/* full داخل مخطط مقيد (boxed/framed): يأخذ عرض الحاوية فقط */
.oic-frame-boxed .oic-sb-sec.sec-width--full,
.oic-frame-framed .oic-sb-sec.sec-width--full {
    width: 100% !important;
    max-width: 100% !important;
    left: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    position: relative !important;
}

/* full في صفحات بها سايدبار: يتصرف كـ wide */
.has-sidebar .oic-sb-sec.sec-width--full,
.layout-sr .oic-sb-sec.sec-width--full,
.layout-sl .oic-sb-sec.sec-width--full,
.layout-sm .oic-sb-sec.sec-width--full,
.layout-slr .oic-sb-sec.sec-width--full {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline-start: 0 !important;
    margin-inline-end: 0 !important;
}

/* body overflow للـ full-width */
body.has-fullwidth-section {
    overflow-x: clip;
}

/* ═══ محتوى الكارد المميز والبطاقات فوق طبقات الخلفية ═══ */
.oic-feature-card > *:not(.oic-sb-bg-img):not(.oic-sb-bg-vid):not(.oic-sb-overlay):not([class*="oic-pat"]) {
    position: relative;
    z-index: 1;
}
.oic-repeater-card > *:not(.oic-sb-bg-img):not(.oic-sb-bg-vid):not(.oic-sb-overlay):not([class*="oic-pat"]) {
    position: relative;
    z-index: 1;
}
/* الكارد الديناميكي (registry/cards.php) */
.oic-card-bg-wrap .oic-card > *:not(.oic-sb-bg-img):not(.oic-sb-bg-vid):not(.oic-sb-overlay) {
    position: relative;
    z-index: 1;
}
.oic-card-bg-wrap .oic-card {
    position: relative;
    overflow: hidden;
}

/* ── إخفاء حسب الجهاز ── */
@media (max-width: 767px) {
    .oic-hide-mobile { display: none !important; }
}
@media (min-width: 768px) and (max-width: 1024px) {
    .oic-hide-tablet { display: none !important; }
}

/* ── تأثيرات الدخول (Entrance Animations) ── */
.oic-anim {
    opacity: 0;
    transition: opacity .7s ease, transform .7s cubic-bezier(.25,.46,.45,.94);
}
.oic-anim.fade-up    { transform: translateY(40px); }
.oic-anim.fade-down  { transform: translateY(-40px); }
.oic-anim.fade-right { transform: translateX(-40px); }
.oic-anim.fade-left  { transform: translateX(40px); }
.oic-anim.zoom-in    { transform: scale(.82); }
.oic-anim.flip       { transform: perspective(800px) rotateY(20deg); }
.oic-anim.is-visible {
    opacity: 1 !important;
    transform: none !important;
}
@media (prefers-reduced-motion: reduce) {
    .oic-anim { opacity: 1 !important; transform: none !important; }
}


/* ═══════════════════════════════════════════════════════
   BREAKING NEWS — animated border for posts < 24h
   ═══════════════════════════════════════════════════════ */
@keyframes oic-breaking-border {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.oic-breaking {
    position: relative;
    overflow: hidden;
}

/* الإطار المتحرك عبر ::before */
.oic-breaking::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 2px;
    background: linear-gradient(
        90deg,
        var(--c-primary,#2563eb),
        #ef4444,
        #f59e0b,
        var(--c-primary,#2563eb)
    );
    background-size: 300% 300%;
    animation: oic-breaking-border 2.5s ease infinite;
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    z-index: 1;
    pointer-events: none;
}

/* بادج "عاجل" */
.oic-breaking-badge {
    position: absolute;
    top: 8px;
    right: 8px;
    background: #ef4444;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 20px;
    z-index: 2;
    letter-spacing: .5px;
    animation: oic-breaking-badge-pulse 1.8s ease-in-out infinite;
}
@keyframes oic-breaking-badge-pulse {
    0%, 100% { opacity: 1; }
    50%       { opacity: .6; }
}

/* نقطة حمراء متحركة جانب العنوان */
.oic-breaking-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    background: #ef4444;
    border-radius: 50%;
    margin-inline-start: 5px;
    vertical-align: middle;
    animation: oic-breaking-badge-pulse 1.2s ease-in-out infinite;
}