/* ===== Guardian · الثيم القوي (فضي + أزرق كهربائي) ===== */
:root {
  --g1: #60a5fa; --g2: #3b82f6; --g3: #1e3a8a; --silver: #e2e8f0; --silver2: #94a3b8;
  --glow: 0 0 0 1px rgba(96,165,250,.18), 0 24px 60px -30px rgba(59,130,246,.55);
}
/* خلفية: شفق أزرق متحرك + شبكة خفيفة */
body {
  background:
    radial-gradient(900px 600px at 80% -10%, rgba(59,130,246,.22), transparent 60%),
    radial-gradient(700px 500px at -10% 110%, rgba(30,58,138,.35), transparent 60%),
    #05070d !important;
  background-attachment: fixed;
}
body::after {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background: repeating-linear-gradient(115deg, transparent 0 120px, rgba(96,165,250,.025) 120px 121px);
  animation: drift 40s linear infinite;
}
@keyframes drift { to { background-position: 600px 0; } }

/* بطاقات زجاجية بحدّ متدرج */
.card, .srv, .stat-big {
  background: linear-gradient(160deg, rgba(20,28,46,.78), rgba(10,14,26,.72)) !important;
  border: 1px solid rgba(148,163,184,.14) !important;
  box-shadow: var(--glow);
  backdrop-filter: blur(14px) saturate(140%);
  border-radius: 20px !important;
}
.card:hover, .srv:hover { border-color: rgba(96,165,250,.4) !important; }

/* أزرار */
.btn {
  border-radius: 14px !important; font-weight: 800 !important; letter-spacing: .2px;
  border: 1px solid rgba(148,163,184,.25) !important;
}
.btn.primary, .btn:not(.ghost):not(.danger) {
  background: linear-gradient(135deg, #f1f5f9 0%, #60a5fa 45%, #1d4ed8 100%) !important;
  color: #04060c !important; border-color: transparent !important;
}
.btn.ghost { background: rgba(148,163,184,.08) !important; color: var(--silver) !important; }
.btn.danger { background: linear-gradient(135deg,#fb7185,#be123c) !important; color:#fff !important; border-color: transparent !important; }

/* حقول الإدخال */
input, select, textarea {
  background: rgba(2,6,16,.6) !important; border: 1px solid rgba(148,163,184,.2) !important;
  border-radius: 12px !important; color: var(--silver) !important;
}
input:focus, select:focus, textarea:focus { outline: none !important; border-color: var(--g1) !important; box-shadow: 0 0 0 3px rgba(96,165,250,.25) !important; }

/* عناوين بتدرج فضي */
.card h3, .page-title, .home-hero h1 {
  background: linear-gradient(180deg, #ffffff, #cbd5e1 60%, #64748b);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* شارات */
.badge { border-radius: 99px !important; font-weight: 700; }

/* جداول */
table th { color: var(--silver2) !important; text-transform: none; letter-spacing: .3px; }
table tr:hover td { background: rgba(96,165,250,.05) !important; }

/* مفاتيح */
.switch input:checked + span, .toggle input:checked + span {
  background: linear-gradient(90deg, #60a5fa, #1d4ed8) !important;
}

/* سكرول */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: linear-gradient(#60a5fa55,#1d4ed855); border-radius: 99px; border: 3px solid transparent; background-clip: padding-box; }
::-webkit-scrollbar-track { background: transparent; }

/* حركة ناعمة للظهور */
.view, .card { animation: rise .5s cubic-bezier(.2,.8,.2,1) both; }
@keyframes rise { from { opacity: 0; transform: translateY(10px) } to { opacity: 1; transform: none } }
@media (prefers-reduced-motion: reduce) {
  body::after, .view, .card { animation: none !important; }
}

/* ===== حالات الأزرار والحركات الإضافية ===== */
.btn { transition: transform .18s ease, box-shadow .25s ease, filter .2s ease, opacity .2s; }
.btn:not(:disabled):hover { transform: translateY(-2px); }
.btn:not(:disabled):active { transform: translateY(0) scale(.98); }
.btn.is-busy, .btn:disabled {
  opacity: .75; cursor: wait; transform: none !important;
  background-image: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.35) 50%, transparent 70%) !important;
  background-size: 200% 100%; animation: btnshine 1.2s linear infinite;
}
@keyframes btnshine { to { background-position: -200% 0; } }

/* هيكل تحميل بدل نص "جاري التحميل" */
.loading {
  height: 80px; border-radius: 16px; position: relative; overflow: hidden;
  background: rgba(148,163,184,.06);
}
.loading::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(100deg, transparent 30%, rgba(96,165,250,.18) 50%, transparent 70%);
  background-size: 200% 100%; animation: btnshine 1.4s linear infinite;
}

/* نبض لنقطة الحالة */
.status i, .dot-live { animation: pulse 2s ease-in-out infinite; }
@keyframes pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(96,165,250,.6) } 50% { box-shadow: 0 0 0 6px rgba(96,165,250,0) } }

/* ظهور متتابع للبطاقات */
.cards-grid > *:nth-child(1){animation-delay:.02s} .cards-grid > *:nth-child(2){animation-delay:.08s}
.cards-grid > *:nth-child(3){animation-delay:.14s} .cards-grid > *:nth-child(4){animation-delay:.2s}
.cards-grid > *:nth-child(5){animation-delay:.26s} .cards-grid > *:nth-child(6){animation-delay:.32s}

/* أزرار التبويب: خط تحت متحرك */
.tab-groups a { position: relative; }
.tab-groups a::after {
  content: ""; position: absolute; inset-inline: 14px; bottom: 3px; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, transparent, #93c5fd, transparent);
  transform: scaleX(0); transition: transform .3s ease;
}
.tab-groups a:hover::after { transform: scaleX(1); }

/* ===== الإصدار الأسطوري: بدون مربعات، ألوان موحدة، حركات وتموجات ===== */
:root {
  --violet: #3b82f6; --cyan: #22d3ee; --gold: #93c5fd; --gold2: #e2e8f0; --red: #fb7185; --green: #5eead4;
}
/* إلغاء كل الخطوط الشبكية والمربعات الخلفية */
body, body::after { background-image: none !important; }
body::after { display: none !important; }

/* خلفية: أورورا متحركة بثلاث كرات ضوئية */
body::before {
  content: ""; position: fixed; inset: -25%; z-index: -1; pointer-events: none;
  background:
    radial-gradient(40% 40% at 25% 30%, rgba(59,130,246,.35), transparent 70%),
    radial-gradient(35% 35% at 75% 25%, rgba(34,211,238,.22), transparent 70%),
    radial-gradient(45% 45% at 60% 85%, rgba(30,58,138,.40), transparent 70%);
  filter: blur(40px); animation: aurora 22s ease-in-out infinite alternate;
}
@keyframes aurora {
  0% { transform: translate3d(-2%, -1%, 0) scale(1); }
  50% { transform: translate3d(2%, 2%, 0) scale(1.06); }
  100% { transform: translate3d(-1%, 3%, 0) scale(1.02); }
}

/* بطاقات بزوايا ناعمة وحافة متوهجة متحركة */
.card, .srv, .stat-big { border-radius: 24px !important; position: relative; isolation: isolate; }
.card::after {
  content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1px; pointer-events: none;
  background: conic-gradient(from var(--ang, 0deg), transparent 0deg, rgba(147,197,253,.55) 60deg, transparent 120deg, transparent 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  opacity: 0; transition: opacity .4s;
  animation: spinring 6s linear infinite;
}
.card:hover::after { opacity: 1; }
@property --ang { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
@keyframes spinring { to { --ang: 360deg; } }

/* الهيدر: لمعة فضية تمر */
.top::after { height: 2px !important; }

/* تموّج عند الضغط (Ripple) */
.ripple-host { position: relative; overflow: hidden; }
.ripple {
  position: absolute; border-radius: 50%; pointer-events: none; transform: scale(0);
  background: radial-gradient(circle, rgba(255,255,255,.55), rgba(96,165,250,.15) 60%, transparent 70%);
  animation: ripple .7s ease-out forwards;
}
@keyframes ripple { to { transform: scale(1); opacity: 0; } }

/* عناوين الأقسام: تدرج فضي أزرق متحرك */
.card h3 {
  background: linear-gradient(90deg, #f8fafc, #93c5fd, #e2e8f0, #3b82f6, #f8fafc);
  background-size: 300% 100%; -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: shimmer 8s linear infinite;
}

/* الشعار (البنر) يطفو بنبض */
.home-banner { animation: float 7s ease-in-out infinite; }
@keyframes float { 50% { transform: translateY(-6px) } }

/* أزرار أساسية بتوهج متنفس */
.btn.primary, .btn:not(.ghost):not(.danger) { animation: breathe 3.2s ease-in-out infinite; }
@keyframes breathe { 0%,100% { box-shadow: 0 0 0 0 rgba(96,165,250,.0) } 50% { box-shadow: 0 0 26px 0 rgba(96,165,250,.45) } }

@media (prefers-reduced-motion: reduce) {
  body::before, .card::after, .card h3, .home-banner, .btn.primary, .ripple { animation: none !important; }
}

/* ===== شكل ناعم بالكامل: ما فيه زوايا حادة ===== */
.card, .srv, .stat-big, .kpi, .mod-card, .wf-class-card, .tab-group, .home-banner, .preview, .embed,
.hero, .login, .login-card, .modal, .toast, .dropdown, .tip {
  border-radius: 26px !important;
}
.btn, .btn.small, .tab-groups a, .side a, .side button, .nav a, .srv-pill {
  border-radius: 999px !important;
}
input, select, textarea, .search, .field input, .field select {
  border-radius: 16px !important;
}
.ic, .tab-groups .ico, .side a .ic { border-radius: 50% !important; }
.avatar { border-radius: 50% !important; }
.badge, .pill, .pill-new, .wf-word, .chip { border-radius: 999px !important; }
table, .list-item { border-radius: 16px; }
.bar, .bar > div, progress { border-radius: 999px !important; }
.switch i, .switch i::after { border-radius: 999px !important; }
.swatch { border-radius: 50% !important; }
.iconbtn, .menu-btn, .logo, .logo-img { border-radius: 50% !important; }
img.logo-img { border-radius: 0 !important; }

/* ===== الإصدار المتحرك: شلت الشبكة وبريق الأقطار، وأضفت حركات حيّة ===== */
body::before, body::after { background-image: none !important; }
/* نجوم متحركة بدل الشبكة */
body::after {
  display: block !important; content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background-image:
    radial-gradient(2px 2px at 12% 18%, rgba(226,232,240,.8), transparent),
    radial-gradient(1.5px 1.5px at 33% 72%, rgba(147,197,253,.9), transparent),
    radial-gradient(2px 2px at 58% 34%, rgba(226,232,240,.6), transparent),
    radial-gradient(1.5px 1.5px at 81% 62%, rgba(96,165,250,.9), transparent),
    radial-gradient(2px 2px at 92% 14%, rgba(226,232,240,.7), transparent),
    radial-gradient(1px 1px at 44% 88%, rgba(147,197,253,.8), transparent);
  background-size: 100% 100%;
  animation: twinkle 5s ease-in-out infinite alternate;
}
@keyframes twinkle { from { opacity: .35 } to { opacity: 1 } }

/* إزالة الخط المائل اللامع من بطاقات الإحصاء، واستبداله ببريق يمر عند المرور */
.stat::after, .kpi::after { display: none !important; }
.stat, .kpi, .stat-big { overflow: hidden; }
.stat:hover::before, .kpi:hover::before, .stat-big:hover::before {
  content: ""; position: absolute; top: 0; bottom: 0; width: 40%; left: -60%; pointer-events: none;
  background: linear-gradient(100deg, transparent, rgba(147,197,253,.22), transparent);
  animation: sheen 1.1s ease forwards;
}
@keyframes sheen { to { left: 130%; } }

/* أشرطة التقدم تكبر عند الظهور */
.bar > div { transform-origin: right center; animation: grow 1.2s cubic-bezier(.2,.8,.2,1) both; }
@keyframes grow { from { transform: scaleX(0) } to { transform: scaleX(1) } }

/* الشرائح (checks) تظهر بالتتابع وتتوهج عند المرور */
.checks > * { animation: rise .5s cubic-bezier(.2,.8,.2,1) both; transition: transform .25s, box-shadow .3s, border-color .3s; }
.checks > *:nth-child(2){animation-delay:.05s} .checks > *:nth-child(3){animation-delay:.1s}
.checks > *:nth-child(4){animation-delay:.15s} .checks > *:nth-child(5){animation-delay:.2s}
.checks > *:nth-child(6){animation-delay:.25s} .checks > *:nth-child(7){animation-delay:.3s}
.checks > *:hover { transform: translateY(-2px) scale(1.02); box-shadow: 0 0 22px -6px rgba(96,165,250,.7); }

/* أيقونات الإحصاء تطفو */
.stat-ico, .kpi .ico, .stats-row .ico { animation: float 5s ease-in-out infinite; }
.stats-row > *:nth-child(2) .ico, .stats-row > *:nth-child(2) .stat-ico { animation-delay: .4s; }
.stats-row > *:nth-child(3) .ico, .stats-row > *:nth-child(3) .stat-ico { animation-delay: .8s; }

/* أرقام كبيرة بتوهج نابض خفيف */
.stat b, .kpi .val, .stat-big b { text-shadow: 0 0 22px rgba(96,165,250,.35); animation: glow 4s ease-in-out infinite; }
@keyframes glow { 50% { text-shadow: 0 0 34px rgba(147,197,253,.6) } }

/* الأزرار الكبيرة بجزيئات لامعة عند التحويم */
.btn:not(:disabled):hover { filter: brightness(1.12) saturate(1.1); }
