/* =================================================================================================
   ☰ توثيق احترافي — Professional Documentation
   =================================================================================================
   اسم الملف     : base.css
   وظيفة الملف   : إعدادات HTML وBody الأساسية — المتغيرات انتقلت إلى modules/shared/variables.css (Phase 9).
   الأقسام داخله :
   - HTML — تمرير ناعم
   - BODY — الخلفية والتوهجات وحماية التمرير الأفقي
   تاريخ التوثيق : 2026-06-05 (الخامس من يونيو 2026)
   ملاحظة        : لم يُحذف أو يُختصر أي سطر من الكود الأصلي — أُضيفت الشروحات فقط.
   ================================================================================================= */


/* =================================================================================================
   FILE NAME: base.css
   PROJECT: TRADIR AI / Leaders Of Trading
   TYPE: Global Stylesheet (Base Theme)
   -------------------------------------------------------------------------------------------------
   العربية:
   هذا الملف مسؤول عن إعداد المتغيرات الأساسية الخاصة بالألوان والتصميم العام للموقع.
   كما يحتوي على إعدادات عامة يتم تطبيقها على جميع صفحات الموقع.

   الصفحات التي تستخدم هذا الملف:
   - الصفحة الرئيسية
   - صفحة تسجيل الدخول
   - لوحة التحكم
   - صفحة التحليل
   - صفحة الدعم
   - جميع الصفحات المشتركة

   English:
   This file defines the global design system, color variables,
   and general styling rules shared across the entire website.

   Used by:
   - Home Page
   - Login Page
   - Dashboard
   - Analysis Pages
   - Support Pages
   - All Shared Components
================================================================================================= */


/* CSS variables (--bg-1, --bg-2, --bg-3, --cyan, --cyan-2, --gold, --text-soft, --border)
   moved to modules/shared/variables.css — must load before this file. */


/* ── GLOBAL RESET ── */
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 80px;
  margin: 0;
  padding: 0;
  background: var(--bg-1);
}



/* =================================================================================================
   BODY MAIN LAYOUT
   إعدادات الصفحة الرئيسية
   -------------------------------------------------------------------------------------------------
   العربية:
   هذا القسم مسؤول عن:
   - خلفية الموقع بالكامل
   - التدرجات اللونية
   - الألوان المتوهجة
   - منع ظهور شريط تمرير أفقي
   - تحديد اللون الافتراضي للنصوص

   English:
   Controls:
   - Global page background
   - Glow effects
   - Gradient layers
   - Text color
   - Horizontal overflow protection
================================================================================================= */
body {
  margin: 0;
  padding: 0;
  width: 100%;

  background:

    /* ----------------------------------------------------------------------------
       Glow #1
       توهج مركزي علوي
       ----------------------------------------------------------------------------
       Arabic:
       يضيف تأثير ضوئي في أعلى الصفحة.

       English:
       Creates a soft cyan glow at the top center.
    ---------------------------------------------------------------------------- */
    radial-gradient(
      circle at 50% -10%,
      rgba(0,255,240,.16),
      transparent 30%
    ),

    /* ----------------------------------------------------------------------------
       Glow #2
       توهج يسار الصفحة
    ---------------------------------------------------------------------------- */
    radial-gradient(
      circle at 15% 20%,
      rgba(53,217,255,.10),
      transparent 25%
    ),

    /* ----------------------------------------------------------------------------
       Glow #3
       توهج يمين الصفحة
    ---------------------------------------------------------------------------- */
    radial-gradient(
      circle at 85% 18%,
      rgba(53,217,255,.08),
      transparent 22%
    ),

    /* ----------------------------------------------------------------------------
       Main Gradient Background
       الخلفية الرئيسية للموقع
    ---------------------------------------------------------------------------- */
    linear-gradient(
      180deg,
      var(--bg-3) 0%,
      var(--bg-2) 35%,
      var(--bg-1) 100%
    );



  /* ---------------------------------------------------------------------------------------------
     TEXT COLOR
     لون النص الافتراضي
  --------------------------------------------------------------------------------------------- */
  color: white;



  /* ---------------------------------------------------------------------------------------------
     PAGE HEIGHT
     ارتفاع الصفحة
  --------------------------------------------------------------------------------------------- */

  /* يجعل الصفحة تغطي كامل ارتفاع الشاشة */
  min-height: 100vh;

  /* dvh (Dynamic Viewport Height) — يحل مشكلة قفز الارتفاع عند ظهور/اختفاء
     شريط عنوان المتصفح على الجوال (Android Chrome / iOS Safari). المتصفحات
     التي لا تدعمه تتجاهل السطر وتبقى على القيمة أعلاه بلا أي تغيير. */
  min-height: 100dvh;



  /* ---------------------------------------------------------------------------------------------
     OVERFLOW PROTECTION
     حماية من التمرير الأفقي
  --------------------------------------------------------------------------------------------- */

  /* يمنع ظهور Scroll أفقي بسبب العناصر المتحركة */
  overflow-x: hidden;



  /* ---------------------------------------------------------------------------------------------
     POSITIONING
     إعداد التموضع
  --------------------------------------------------------------------------------------------- */

  /* يسمح للعناصر المطلقة بالتموضع نسبةً للصفحة */
  position: relative;
}

/* ── CONTAINER ── */
.container {
  width: min(calc(100% - 40px), 1800px);
  margin: 0 auto;
  position: relative;
  z-index: 2;
}