/* ============================================================
   iCoreUX Ad System — ad-system-v4.css
   Version 4.3 — 2026-09-26 (النسخة النهائية المعتمدة)

   تنسيقات الإعلانات الموحّدة لكل منصات iCoreUX:
   - Inline wraps (728x90, 300x250)
   - Sidebar يمين (> 1500px) — 160x600 + 160x300
   - Mobile bar (< 900px) — 320x50
   - Slide-in (زاوية) — 300x250

   ملاحظة: نستخدم visibility:hidden بدل display:none
   لأن display:none يمنع CSS transitions تماماً.
   ============================================================ */

/* ── 1) Inline wraps ── */
.ica-v4-inline-wrap {
  display: flex;
  justify-content: center;
  margin: 1.5rem auto;
  max-width: 100%;
  padding: 0 1rem;
  box-sizing: border-box;
}

.ica-v4-slot {
  background: transparent;
  overflow: hidden;
  border-radius: 8px;
  position: relative;
}

/* ── 2) Sidebar (يمين — sticky) ── */
.ica-v4-sidebar {
  visibility: hidden;
  pointer-events: none;
  position: fixed;
  top: 120px;
  right: 20px;
  width: 160px;
  z-index: 100;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.ica-v4-slot-sidebar-top { width: 160px; height: 600px; }
.ica-v4-slot-sidebar-bot { width: 160px; height: 300px; }

@media (min-width: 1500px) {
  .ica-v4-sidebar {
    visibility: visible;
    pointer-events: auto;
  }
}

/* ── 3) إخفاء على icoreux.com ── */
body.ica-host-icoreux .ica-v4-sidebar,
body.ica-host-icoreux .ica-v4-mobile-bar,
body.ica-host-icoreux .ica-v4-slide,
body.ica-host-icoreux .ica-v4-inline-wrap { display: none !important; }

/* ── 4) Mobile Bar (أسفل — جوال) ── */
.ica-v4-mobile-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 999;
  background: rgba(0, 0, 0, 0.85);
  padding: 6px 40px 6px 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  visibility: hidden;
  pointer-events: none;
  transform: translateY(100%);
  opacity: 0;
  transition: transform 0.3s ease, opacity 0.3s ease, visibility 0.3s ease;
}

.ica-v4-mobile-bar.ica-v4-mobile-visible {
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  opacity: 1;
}

.ica-v4-mobile-bar .ica-v4-close {
  position: absolute;
  top: 50%;
  margin-top: -14px;
  right: 8px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
  border: none;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s ease;
}

.ica-v4-mobile-bar .ica-v4-close:hover {
  background: rgba(255, 255, 255, 0.35);
}

@media (min-width: 900px) {
  .ica-v4-mobile-bar { display: none !important; }
}

/* ── 5) Slide-in (زاوية أسفل يسار) ── */
.ica-v4-slide {
  position: fixed;
  bottom: 20px;
  left: 20px;
  width: 300px;
  height: 250px;
  z-index: 998;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 12px;
  padding: 0;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
  overflow: hidden;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(20px);
  opacity: 0;
  transition: transform 0.4s ease, opacity 0.4s ease, visibility 0.4s ease;
}

.ica-v4-slide.ica-v4-slide-visible {
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  opacity: 1;
}

.ica-v4-slide .ica-v4-close {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  border: none;
  font-size: 14px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  z-index: 2;
  transition: background 0.2s ease;
}

.ica-v4-slide .ica-v4-close:hover {
  background: rgba(0, 0, 0, 0.9);
}

.ica-v4-slide .ica-v4-slot {
  width: 300px;
  height: 250px;
}

@media (max-width: 480px) {
  .ica-v4-slide {
    left: 50%;
    bottom: 80px;
    transform: translateX(-50%) translateY(20px);
  }
  .ica-v4-slide.ica-v4-slide-visible {
    transform: translateX(-50%) translateY(0);
  }
}

/* ── 6) Light theme ── */
body.light-theme .ica-v4-mobile-bar {
  background: rgba(255, 255, 255, 0.95);
}
body.light-theme .ica-v4-mobile-bar .ica-v4-close {
  background: rgba(0, 0, 0, 0.15);
  color: #000;
}
body.light-theme .ica-v4-mobile-bar .ica-v4-close:hover {
  background: rgba(0, 0, 0, 0.3);
}
body.light-theme .ica-v4-slide {
  background: rgba(255, 255, 255, 0.95);
}

/* ── 7) إخفاء عند الطباعة ── */
@media print {
  .ica-v4-sidebar,
  .ica-v4-mobile-bar,
  .ica-v4-slide,
  .ica-v4-inline-wrap,
  .ica-v4-slot { display: none !important; }
}

/* ── 8) منع كسر المحتوى ── */
.ica-v4-inline-wrap + * { margin-top: 0.5rem; }
* + .ica-v4-inline-wrap { margin-top: 0.5rem; }

/* ── 9) ضبط 728x90 على الشاشات الصغيرة ── */
@media (max-width: 900px) {
  .ica-v4-inline-wrap .ica-v4-slot[data-size="728x90"] {
    max-width: 100%;
    height: auto;
  }
}