/* ================================================
   NUX-T ERP unified styles (Teaser + Full Page)
   ================================================ */

.section-pad {
  padding-block: clamp(2rem, 6vw, 5rem);
}

/* ====== بنية أساسية ====== */
.erp-hero, .erp-overview, .erp-modules, .erp-flows,
.erp-integrations, .erp-security, .erp-faq, .nx-erp-mini {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.erp-hero {
  background:
    radial-gradient(900px 400px at 85% -10%, rgba(40,120,255,.06), transparent 55%),
    radial-gradient(700px 400px at 10% -5%, rgba(210,60,140,.05), transparent 55%);
}

/* aurora effect */
.erp-aurora.a, .erp-aurora.b {
  position: absolute;
  inset: auto;
  pointer-events: none;
  filter: blur(30px) saturate(120%);
  z-index: 0;
}
.erp-aurora.a {
  top: -10%; left: -5%;
  width: 45%; height: 45%;
  background: radial-gradient(55% 60% at 40% 40%, rgba(77,163,255,.14), transparent 60%);
}
.erp-aurora.b {
  bottom: -8%; right: -5%;
  width: 40%; height: 40%;
  background: radial-gradient(50% 50% at 60% 60%, rgba(255,160,210,.12), transparent 60%);
}

/* ====== Badges ====== */
.nx-badge {
  display:inline-block;
  padding:.4rem .9rem;
  border-radius:999px;
  font-weight:700;
  background:rgba(255,255,255,.6);
  border:1px solid rgba(0,0,0,.1);
  backdrop-filter:blur(5px);
}

/* ====== Titles ====== */
.erp-title, .section-title {
  font-weight:900;
  line-height:1.12;
  margin:.35rem 0 .6rem;
}
.erp-title { font-size:clamp(1.5rem,3vw,2.3rem); }
.section-title { font-size:clamp(1.3rem,2.6vw,1.8rem); }

/* ====== Sub & Lead ====== */
.erp-sub, .erp-lead {
  color:#555;
  font-size:clamp(1rem,2vw,1.1rem);
}

/* ====== Hero Preview ====== */
.erp-preview {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
}

.erp-phone {
  width:230px;
  aspect-ratio:9/19.5;
  border-radius:26px;
  overflow:hidden;
  box-shadow:0 20px 48px rgba(0,0,0,.12);
  background:linear-gradient(180deg,#0e1116,#181c24);
}

/* ✅ تحسين عرض الصورة داخل الموبايل */
.erp-phone img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  background: #f9fafb;
  padding: 8px;
}

.erp-laptop {
  width:clamp(340px,42vw,540px);
  aspect-ratio:16/10;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.16);
}

/* ✅ تحسين عرض الصورة داخل اللابتوب */
.erp-laptop img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  background: #f9fafb;
  padding: 8px;
}

/* ====== Mini teaser (home) ====== */
.nx-erp-mini {
  background:
    radial-gradient(500px 300px at 85% -10%, rgba(40,120,255,.06), transparent 55%),
    radial-gradient(500px 300px at 10% 110%, rgba(210,60,140,.05), transparent 55%);
}

.erp-mini-gallery {
  position:relative;
  border-radius:20px;
  overflow:hidden;
  aspect-ratio:1/1;
  box-shadow:0 12px 36px rgba(0,0,0,.12);
}

/* ✅ تصغير الصور وعرضها كاملة بشكل أنيق */
.erp-mini-gallery img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  background: #f9fafb;
  padding: 10px;
  border-radius: 10px;
  opacity: 0;
  transform: scale(1);
  transition: opacity 1s ease, transform 1.2s ease;
}
.erp-mini-gallery img.active {
  opacity: 1;
  transform: scale(1.02);
}

/* ====== Chips & Points ====== */
.erp-points, .erp-chips {
  display:flex;
  flex-wrap:wrap;
  gap:12px 20px;
  list-style:none;
  margin:1rem 0 0;
  padding:0;
}
.erp-points li, .erp-chips .chip {
  display:flex; align-items:center; gap:.45rem;
  font-weight:600;
  border-radius:999px;
  padding:.4rem .8rem;
  border:1px solid rgba(0,0,0,.1);
  background:#fff;
  box-shadow:0 10px 24px rgba(0,0,0,.08);
}
.erp-points i, .erp-chips i {
  color:#4da3ff;
  font-size:1.1rem;
}

/* ====== Highlights ====== */
.erp-highlights {
  display:grid;
  gap:14px;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
}
.hl {
  background:var(--color-bg,#fff);
  border:1px solid rgba(0,0,0,.1);
  border-radius:16px;
  padding:16px;
  display:flex; gap:12px; align-items:flex-start;
  box-shadow:0 12px 36px rgba(0,0,0,.1);
  transition:transform .3s ease, box-shadow .3s ease;
}
.hl:hover {
  transform:translateY(-4px);
  box-shadow:0 20px 48px rgba(0,0,0,.15);
}
.hl i { font-size:22px; color:#4da3ff; }

/* ====== Modules ====== */
.modules-grid {
  display:grid;
  gap:16px;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
}
.mod {
  background:#fff;
  border:1px solid rgba(0,0,0,.1);
  border-radius:16px;
  padding:16px;
  box-shadow:0 12px 34px rgba(0,0,0,.1);
  transition:transform .3s ease, border-color .3s ease;
}
.mod:hover {
  transform:translateY(-4px);
  border-color:rgba(59,130,246,.35);
}
.mod i { font-size:26px; color:#4da3ff; }

/* ====== Flows ====== */
.flow-card {
  background:#fff;
  border-radius:18px;
  border:1px solid rgba(0,0,0,.08);
  padding:16px 18px;
  box-shadow:0 12px 36px rgba(0,0,0,.1);
}
.flow-card h6 { font-weight:800; margin-bottom:.6rem; }
.flow-card ol {
  padding-inline-start:1.2rem;
  color:#555;
}

/* ====== Integrations ====== */
.logos {
  display:flex; flex-wrap:wrap; justify-content:center;
  gap:24px; align-items:center;
}
.logos img {
  height:42px; opacity:.85;
  transition:opacity .3s ease, transform .3s ease;
}
.logos img:hover { opacity:1; transform:scale(1.08); }

/* ====== Security ====== */
.erp-bullets {
  list-style:none;
  padding:0; margin:0;
  display:grid; gap:10px;
}
.erp-bullets li { display:flex; align-items:center; gap:.6rem; }
.erp-bullets i { color:#4da3ff; font-size:1.2rem; }

/* ====== FAQ ====== */
.erp-faq .accordion-button { font-weight:600; }
.erp-faq .accordion-item {
  background:rgba(255,255,255,.8);
  border:1px solid rgba(0,0,0,.06);
  border-radius:14px !important;
  box-shadow:0 8px 22px rgba(0,0,0,.08);
  margin-bottom:10px;
}

/* ====== Reveal animation ====== */
.reveal { opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in-view { opacity:1; transform:none; }

/* ====== Dark Mode ====== */
html[data-bs-theme="dark"] body {
  background:#0e1116;
  color:#e5e7eb;
}
html[data-bs-theme="dark"] .hl,
html[data-bs-theme="dark"] .mod,
html[data-bs-theme="dark"] .flow-card,
html[data-bs-theme="dark"] .accordion-item {
  background:#1e232b;
  border-color:rgba(255,255,255,.08);
}
html[data-bs-theme="dark"] .erp-title,
html[data-bs-theme="dark"] .section-title { color:#f3f4f6; }
html[data-bs-theme="dark"] .erp-sub,
html[data-bs-theme="dark"] .erp-lead { color:#aeb4c4; }

/* ====== RTL ====== */
[dir="rtl"] .hl, [dir="rtl"] .mod, [dir="rtl"] .flow-card, [dir="rtl"] .erp-bullets {
  text-align:right;
}
[dir="rtl"] .erp-points li, [dir="rtl"] .erp-chips .chip {
  flex-direction:row-reverse;
}