/* ============================================================
   Power Bot v6 — «أوبسيديان آيرس»
   طبقة الهوية البصرية الجديدة: خطوط + مسافات + زجاج + عمق
   تُحمَّل بعد كل ملفات CSS الأخرى وتصقل كل الموقع والداشبورد
   ============================================================ */

:root {
  /* لوحة v6 */
  --ir: #8f6fff;            /* الآيرس الكهربائي */
  --ir-l: #b8a4ff;
  --ir-d: #5b3fd6;
  --ir-hi: #d6ccff;
  --cy: #67e8f9;            /* لمسة سماوية ثانوية — تُستخدم باعتدال */
  --ink: #04060b;           /* أعمق أسود مزرق */
  --glass: rgba(255, 255, 255, 0.045);
  --glass-2: rgba(255, 255, 255, 0.028);
  --glass-brd: rgba(255, 255, 255, 0.085);
  --glass-brd-ir: rgba(143, 111, 255, 0.32);
  --glow: 0 0 0 1px rgba(143,111,255,.18), 0 20px 60px -18px rgba(143,111,255,.35);
  --sp-1: 8px; --sp-2: 14px; --sp-3: 22px; --sp-4: 34px; --sp-5: 54px; --sp-6: 86px;
  --r-s: 12px; --r-m: 18px; --r-l: 26px;
}

/* ============ التايبوغرافي ============ */
html { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body {
  font-family: 'Readex Pro', 'Segoe UI', Tahoma, sans-serif !important;
  letter-spacing: .1px;
}
h1, h2, h3, h4, .logo, .dash-title, .page-head h2, .v5-phero h1,
.v5-sec-head h2, .hero h1, .brand {
  font-family: 'Alexandria', 'Readex Pro', sans-serif !important;
  letter-spacing: -.4px;
}
p { line-height: 2.05; }

::selection { background: var(--ir); color: #0e0a1f; }

/* ============ الجو العام — عمق فضائي موحد ============ */
body::before {
  content: '';
  position: fixed; inset: 0; z-index: -3; pointer-events: none;
  background:
    radial-gradient(ellipse 60% 42% at 78% -8%, rgba(143,111,255,.10), transparent 60%),
    radial-gradient(ellipse 50% 38% at 12% 8%, rgba(91,63,214,.08), transparent 60%),
    radial-gradient(ellipse 70% 50% at 50% 110%, rgba(103,232,249,.035), transparent 65%);
}
/* حبيبات ضوضاء خفيفة تعطي ملمس مات فاخر */
body::after {
  content: '';
  position: fixed; inset: 0; z-index: -2; pointer-events: none; opacity: .5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.02 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ============ سكرول بار v6 ============ */
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: #080911; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #2b2547, #1d1930);
  border-radius: 99px; border: 2px solid #080911;
}
::-webkit-scrollbar-thumb:hover { background: var(--ir-d); }

/* ============ الزجاج — ترقية شاملة ============ */
.card, .bento .b, .feature-card, .plan-card, .faq-item,
.stat-card, .panel, .mod-card, .guild-card, .ov-card,
.wlx-card, .usx-card {
  background:
    linear-gradient(168deg, rgba(255,255,255,.055), rgba(255,255,255,.012) 42%),
    rgba(13, 14, 24, .72) !important;
  backdrop-filter: blur(18px) saturate(1.35);
  -webkit-backdrop-filter: blur(18px) saturate(1.35);
  border: 1px solid var(--glass-brd) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 10px 40px -12px rgba(0,0,0,.6);
}
.card:hover, .bento .b:hover, .feature-card:hover, .plan-card:hover,
.mod-card:hover, .guild-card:hover {
  border-color: var(--glass-brd-ir) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.09),
    var(--glow);
}

/* النافبار الكبسولة + نافبار الداشبورد */
.v5-nav, nav {
  backdrop-filter: blur(26px) saturate(1.5) !important;
  -webkit-backdrop-filter: blur(26px) saturate(1.5) !important;
}
.v5-nav {
  background: rgba(9, 10, 18, .58) !important;
  border-color: var(--glass-brd) !important;
  box-shadow: 0 18px 55px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.06) !important;
}

/* ============ المسافات — تنفّس أوسع ============ */
.v5-sec { padding-top: var(--sp-6); padding-bottom: var(--sp-6); }
.v5-sec-head { margin-bottom: var(--sp-5); }
.v5-phero { padding-top: 165px; padding-bottom: var(--sp-5); }
.bento { gap: 20px; }
.bento .b { padding: 30px; border-radius: var(--r-l); }
.container { padding-left: 24px; padding-right: 24px; }

/* ============ الأزرار ============ */
.v5-btn, .btn, button.primary {
  border-radius: 15px;
  transition: transform .22s cubic-bezier(.34,1.56,.64,1), box-shadow .25s, filter .2s;
}
.v5-btn.gold, .btn-gold, .btn-primary {
  background: linear-gradient(135deg, var(--ir-l), var(--ir) 45%, var(--ir-d)) !important;
  color: #0e0a1f !important;
  box-shadow: 0 8px 30px rgba(143,111,255,.38), inset 0 1px 0 rgba(255,255,255,.4) !important;
}
.v5-btn.gold:hover, .btn-gold:hover, .btn-primary:hover {
  filter: brightness(1.08);
  box-shadow: 0 14px 46px rgba(143,111,255,.55), inset 0 1px 0 rgba(255,255,255,.45) !important;
}

/* ============ فوكس واضح — وصولية + شعور دقة ============ */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--ir) !important;
  outline-offset: 2px;
  border-radius: 6px;
}

/* ============ الحقول (موقع + داشبورد) ============ */
input[type="text"], input[type="number"], input[type="url"], input[type="search"],
input[type="password"], select, textarea {
  background: rgba(255,255,255,.035);
  border: 1px solid var(--glass-brd);
  border-radius: var(--r-s);
  transition: border-color .2s, box-shadow .2s, background .2s;
}
input:focus, select:focus, textarea:focus {
  border-color: var(--glass-brd-ir) !important;
  box-shadow: 0 0 0 3px rgba(143,111,255,.14) !important;
  background: rgba(143,111,255,.04);
}

/* ============ الداشبورد — صقل خاص ============ */
.sidebar {
  background: rgba(9, 10, 18, .82) !important;
  backdrop-filter: blur(22px) saturate(1.4);
  -webkit-backdrop-filter: blur(22px) saturate(1.4);
  border-left: 1px solid var(--glass-brd) !important;
}
.side-item.active {
  background: linear-gradient(90deg, rgba(143,111,255,.16), rgba(143,111,255,.05)) !important;
  box-shadow: inset 2px 0 0 var(--ir);
}
.switch input:checked + .slider {
  background: linear-gradient(135deg, var(--ir-l), var(--ir)) !important;
  box-shadow: 0 0 14px rgba(143,111,255,.45);
}
/* .save-bar حاوية تمركز شفافة — التنسيق على الأزرار داخلها فقط */
.save-bar .btn {
  box-shadow: 0 14px 45px rgba(0,0,0,.55), 0 0 24px rgba(143,111,255,.18);
}
.field input, .field select, .field textarea { border-radius: var(--r-s); }

/* الكيكرز — لمسة سماوية مميزة للهوية الجديدة */
.v5-kicker, .kicker {
  background: linear-gradient(90deg, var(--cy), var(--ir-l));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}

/* الجداول */
table { border-collapse: separate; border-spacing: 0; }
th { font-family: 'Alexandria', sans-serif; letter-spacing: .3px; }
tr:hover td { background: rgba(143,111,255,.045); }

/* شارات/بادجات */
.badge, .tag, .pill {
  border-radius: 999px;
  border: 1px solid var(--glass-brd-ir);
  background: rgba(143,111,255,.09);
}

/* حركة الدخول العامة — ناعمة وقصيرة */
@media (prefers-reduced-motion: no-preference) {
  .card, .bento .b, .feature-card { will-change: transform; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
