/* ========== Projecthon Design System (RTL) ========== */

/* Color tokens */
:root{
  --bg:#0f1129;           /* الخلفية */
  --bg-2:#111538;         /* طبقة أغمق */
  --card:#171b3f;         /* خلفية البطاقات */
  --stroke:#242757;       /* حدود/فواصل */
  --text:#eef1ff;         /* نص أساسي */
  --muted:#b8bfe6;        /* نص ثانوي */

  --accent-1:#ad45be;     /* بنفسجي */
  --accent-2:#35b6ce;     /* سماوي */
  --accent-3:#a9d18e;     /* أخضر باستيلي */

  --danger:#ef476f;
  --success:#22c55e;
  --warning:#f59e0b;
}

/* Base */
html,body{
  height:100%;
}
body{
  direction: rtl;
  background: var(--bg);
  color: var(--text);
  font-family: 'Tajawal',system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,"Noto Sans","Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
}

/* Links */
a{ color: var(--accent-2); }
a:hover{ color: #5fd0e3; }

/* Container helpers */
.section{
  padding: 64px 0;
}
.section-alt{
  padding: 64px 0;
  background: var(--bg-2);
}

/* Navbar */
.app-navbar{
  background: linear-gradient(90deg,#14183a, var(--bg) 70%);
  border-bottom:1px solid var(--stroke);
}
.app-navbar .nav-link{
  color:#fff !important;
  opacity:.8;
  padding-inline: .75rem;
}
.app-navbar .nav-link:hover{ opacity:1; }
.app-navbar .nav-link.active{
  opacity:1;
  border-bottom:2px solid var(--accent-2);
}

/* Hero */
.hero{
  background:
    radial-gradient(1000px 400px at 85% -20%, rgba(173,69,190,.25), transparent 60%),
    radial-gradient(800px 300px at 20% -10%, rgba(53,182,206,.25), transparent 60%),
    linear-gradient(180deg,#111538,var(--bg));
  color: #eef1ff;
  text-align: center;
  padding: 96px 0;
}
.hero .lead{ color: var(--muted); }

/* Cards */
.card{
  background: var(--card);
  border: 1px solid var(--stroke);
  border-radius: 16px;
  box-shadow: 0 6px 16px rgba(0,0,0,.15);
  color: var(--text);
}
.card-ghost{
  background: transparent;
  border: 1px dashed var(--stroke);
}

/* Buttons */
.btn-primary{
  background: var(--accent-1);
  border-color: var(--accent-1);
}
.btn-primary:hover{ filter: brightness(1.08); }

.btn-outline-primary{
  color: var(--accent-2);
  border-color: var(--accent-2);
}
.btn-outline-primary:hover{
  background: var(--accent-2);
  color: #fff;
}

.btn-success{
  background: var(--accent-3);
  border-color: var(--accent-3);
  color:#0c1b1b;
}
.btn-danger{
  background: var(--danger);
  border-color: var(--danger);
}

/* Forms */
.form-control, .form-select, .form-check-input, .input-group-text{
  background: #0e1433;
  color: var(--text);
  border:1px solid var(--stroke);
}
.form-control::placeholder{ color:#9aa3d9; }
.form-control:focus, .form-select:focus{
  border-color: var(--accent-2);
  box-shadow: 0 0 0 .2rem rgba(53,182,206,.15);
}

/* Table */
.table{
  --bs-table-bg: var(--card);
  --bs-table-border-color: var(--stroke);
  color: var(--text);
  border-radius: 12px;
  overflow: hidden;
}
.table thead th{
  background: #131945;
  color:#dfe5ff;
  border-bottom: 1px solid var(--stroke);
}

/* Badges / Pills */
.badge-soft{
  background: rgba(53,182,206,.15);
  color: #8ce5f4;
  border:1px solid rgba(53,182,206,.25);
}
.badge-soft-success{
  background: rgba(169,209,142,.15);
  color: #c8efb8;
  border:1px solid rgba(169,209,142,.25);
}
.badge-soft-danger{
  background: rgba(239,71,111,.15);
  color: #ffc1cf;
  border:1px solid rgba(239,71,111,.25);
}

/* Section Titles with gradient ink */
.title-ink{
  background: linear-gradient(90deg,var(--accent-1),var(--accent-2));
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
}

/* Footer */
.app-footer{
  background: var(--bg);
  border-top:1px solid var(--stroke);
  color: var(--muted);
}

/* Utility */
.shadow-soft{ box-shadow: 0 10px 30px rgba(0,0,0,.25); }
.round-12{ border-radius:12px; }
.round-16{ border-radius:16px; }
.hr-soft{ border-color: var(--stroke); opacity:.35; }

/* Login/Forms grid helpers (تخطيط الشاشات بدون تعديل الـViews) */
.auth-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap:20px;
}
@media (min-width:992px){
  .auth-grid{ grid-template-columns: 1fr 1fr; }
}
.auth-card{ padding:20px; }

/* Hero CTA buttons spacing */
.hero-cta{ gap:12px; }

/* Public cards (قائمة المبادرات) */
.project-card .meta{ color: var(--muted); font-size:.9rem; }

/* Alerts on dark */
.alert{
  border-radius: 12px;
  border: 1px solid var(--stroke);
}
.alert-info{ background: rgba(53,182,206,.12); color:#c9f5ff; border-color:rgba(53,182,206,.25); }
.alert-warning{ background: rgba(255,193,7,.12); color:#ffe6a3; border-color:rgba(255,193,7,.25); }

/* ====== تحسين التباين العام ====== */
:root{
  --bg:#0c1027;
  --panel:#12173a;
  --panel-2:#0f1330;
  --text:#e9ecff;
  --text-dim:#c7cbea;
  --brand:#2dd4bf;           /* فيروزي */
  --brand-2:#9d4edd;         /* بنفسجي */
  --muted:#8e95c6;
  --danger:#ef4444;
  --ok:#22c55e;
  --ring:rgba(45,212,191,.35);
}

body{ color:var(--text); background:var(--bg); }
a{ color:var(--brand); }
.muted{ color:var(--muted)!important; }

/* ====== الهيرو والنصوص الباهتة في (عن بروجكثون) ====== */
.lead{ color:#eef1ff !important; line-height:1.9; }

/* ====== بطاقات عامة ====== */
.card{
  background:linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
  border:1px solid rgba(255,255,255,.06);
  border-radius:16px; padding:18px 18px;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
}

/* عناوين الأقسام */
.section-title{ color:#cbd5ff; font-weight:800; letter-spacing:.5px; }

/* ====== أزرار واضحة ====== */
.btn{ 
  background:var(--brand-2); color:#fff; border:0; 
  padding:10px 16px; border-radius:10px; font-weight:700;
  box-shadow:0 0 0 0 rgba(0,0,0,0); transition:.18s;
}
.btn:hover{ transform:translateY(-1px); filter:brightness(1.06); }
.btn.ok{ background:var(--ok); }
.btn.danger{ background:var(--danger); }
.btn.ghost{ background:transparent; border:1px solid rgba(255,255,255,.18); color:var(--text); }
.btn.sm{ padding:6px 10px; font-size:.9rem; }

/* شارات ووسوم */
.badge{ background:#1f254a; color:#cfe1ff; padding:6px 10px; border-radius:999px; }
.tag{ background:#1d223f; color:#a9b6ff; padding:4px 10px; border-radius:10px; }

/* جداول */
.table{ width:100%; border-collapse:separate; border-spacing:0 8px; }
.table thead th{ color:#cfd6ff; font-weight:800; border-bottom:1px solid rgba(255,255,255,.08); padding:10px 12px; }
.table tbody td{ padding:12px; background:#0f1433; border-top:1px solid rgba(255,255,255,.06); }
.table tbody tr{ border-radius:12px; }

/* ====== شبكة النماذج (Register / Document) ====== */
.grid{ display:grid; gap:12px; }
.grid-2{ grid-template-columns:repeat(2, minmax(0,1fr)); }
.grid-3{ grid-template-columns:repeat(3, minmax(0,1fr)); }
@media (max-width:992px){ .grid-3{ grid-template-columns:1fr 1fr; } }
@media (max-width:680px){ .grid-2,.grid-3{ grid-template-columns:1fr; } }

form .form-row{ display:flex; flex-direction:column; gap:6px; }
form label{ color:#d9deff; font-weight:700; font-size:.95rem; }
form input, form textarea, form select{
  background:#0e1435; color:#f5f7ff; border:1px solid rgba(255,255,255,.08);
  border-radius:10px; padding:10px 12px;
}
form textarea{ min-height:120px; }

/* ====== “شركاؤنا” داكن يناسب شعارات بيضاء ====== */
.partners-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
@media (max-width:992px){ .partners-grid{ grid-template-columns:repeat(2,1fr);} }
.partner-card{
  background:#0f1330; 
  border:1px solid rgba(255,255,255,.06);
  border-radius:16px; padding:20px; text-align:center;
}
.partner-card img{ max-height:80px; opacity:.95; }
.partner-card h6{ color:#cfd6ff; margin-top:10px; }

/* ====== تواصل معنا ====== */
#contact, #partners{ background:#0b0f27; }
#contact p{ color:#eef2ff; font-weight:600; }

/* ====== مربعات الهيدر/الفورمز في صفحة الدخول ====== */
.form-wrap{ background:linear-gradient(180deg, #0f1433, #0b1030); border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:18px; }
.h-title{ color:#dbe3ff; font-weight:800; }

/* ====== شريط علوي (روابط الأدمن/تسجيل الخروج) ====== */
.topbar{
  display:flex; align-items:center; gap:10px;
}
.topbar .sep{ opacity:.35; }

/* تحسين وضوح النصوص على الخلفية الداكنة */
.text-muted { color: rgba(255,255,255,.75) !important; }
.text-white-75 { color: rgba(255,255,255,.85) !important; }

/* ألوان أقوى للأقسام الداكنة */
.section, .section-alt { padding: 64px 0; }
.section-alt { background: rgba(255,255,255,0.02); }

/* بطاقات شركاؤنا بالشعار الأبيض */
#partners .card {
  background: #0f1530;      /* أغمق عشان الشعار الأبيض يبان */
  color: #e6e6f0;
  border: 1px solid rgba(255,255,255,.07);
}

/* contact readability */
#contact p { color: rgba(255,255,255,.85); }

/* وثيقة المبادرة – مسافات وراحة قراءة */
.card.shadow-soft { background: rgba(17,24,39,.85); border: 1px solid rgba(255,255,255,.08); }
.form-label { color: #e8e8ff; }
.form-control, textarea.form-control {
  background: rgba(255,255,255,.05);
  border-color: rgba(255,255,255,.12);
  color: #fff;
}
.form-control::placeholder { color: rgba(255,255,255,.45); }

/* navbar وfooter (ثابتين) */
.app-navbar { background: #0b0f24; border-bottom: 1px solid rgba(255,255,255,.06); }
.app-footer { background: #0b0f24; color: rgba(255,255,255,.7); }

/* أزرار صغيرة متناسقة */
.btn-danger.btn-sm, .btn.btn-sm.btn-danger { padding: .35rem .7rem; font-size: .875rem; }
/* ========= إصلاحات ألوان النص على الثيم الداكن ========= */
.app-card,
.app-card *:not(.btn):not(.badge):not(.tag) {
  color: var(--ink);
}

.table,
.table thead th,
.table tbody td {
  color: var(--ink);
}

.form-label,
label {
  color: var(--ink);
  font-weight: 600;
}

/* ========= تخطيط وراحة لصفحة وثيقة المبادرة ========= */
.doc-form .section {
  margin-bottom: 20px;
  padding: 16px;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 14px;
  background: rgba(255,255,255,0.03);
}

.doc-form .section legend {
  padding: 0 8px;
  font-weight: 700;
  color: var(--accent);
}

.doc-form .grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px 16px;
}

.doc-form .grid.grid-2 { grid-template-columns: 1fr 1fr; }
.doc-form .col-span-2 { grid-column: 1 / -1; }

.doc-form .form-row .form-control {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.08);
  color: var(--ink);
}

.doc-form .form-control::placeholder { color: rgba(255,255,255,0.55); }

.doc-form .form-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-start;
  margin-top: 10px;
}
/* حدود ناعمة للكروت الداخلية */
.border-soft { border: 1px solid rgba(255,255,255,0.08) !important; }

/* توحيد حقول النماذج في الثيم الداكن */
.card .form-control {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.10);
  color: var(--ink);
}







/* ===== Projecthon – Landing (matches provided design) ===== */
:root{
  --ph-bg:#0b0f24;
  --ph-ink:#eef1ff;
  --ph-ink-dim:#cbd5ff;
  --ph-muted:#9fb0e8;
  --ph-stroke:rgba(255,255,255,.08);
  --ph-violet:#7b3aed;
  --ph-cyan:#22d3ee;
  --ph-orange:#ff6a00;
  --ph-pink:#ee0979;
}

/* Hero */
.ph-hero{
  background:
    radial-gradient(800px 300px at 15% -10%, rgba(34,211,238,.18), transparent 60%),
    radial-gradient(1000px 400px at 85% -20%, rgba(123,58,237,.22), transparent 60%),
    linear-gradient(180deg, #12173a, var(--ph-bg));
  color:var(--ph-ink);
  padding: 110px 0 90px;
  position: relative;
  overflow: clip;
  border-bottom:1px solid var(--ph-stroke);
}
.ph-hero-logo{ height:90px; opacity:.95; }
.ph-hero-kicker{ margin:14px 0 6px; color:var(--ph-muted); font-weight:600; letter-spacing:.3px; }
.ph-hero-title{
  font-size: clamp(1.8rem, 2.5vw + 1rem, 3rem);
  font-weight: 800;
  margin-bottom: 18px;
}
.ph-hero-cta .btn{ border-radius: 14px; padding: 12px 18px; font-weight: 800; }
.ph-btn-primary{
  background: linear-gradient(90deg, var(--ph-violet), var(--ph-cyan));
  border:0; color:#fff;
}
.ph-btn-primary:hover{ filter:brightness(1.08); }
.ph-btn-ghost{
  background: transparent; color:#fff;
  border:1px solid var(--ph-stroke);
}
.ph-btn-ghost:hover{ background: rgba(255,255,255,.05); }

/* big stamp word behind */
.ph-hero-stamp{
  position:absolute; inset-inline:0; bottom:-18px; text-align:center;
  font-weight:900; letter-spacing:.2em; opacity:.06; pointer-events:none;
  font-size: clamp(2.8rem, 8vw + 1rem, 9rem);
}

/* Sections */
.ph-section{ padding:68px 0; background:var(--ph-bg); color:var(--ph-ink); }
.ph-section-alt{ padding:68px 0; background:#0f1433; border-top:1px solid var(--ph-stroke); border-bottom:1px solid var(--ph-stroke); }

.ph-title-ink{
  background: linear-gradient(90deg, var(--ph-violet), var(--ph-cyan));
  -webkit-background-clip:text; background-clip:text; color:transparent;
  font-weight:900; letter-spacing:.5px;
}

.ph-lead{ color:#e9ecff; font-size:1.15rem; }
.ph-link-more{ display:inline-block; margin-top:10px; color:var(--ph-cyan); font-weight:800; }

/* Cards */
.ph-card{
  background: linear-gradient(180deg,#12173a,#0e1330);
  border:1px solid var(--ph-stroke);
  border-radius:16px; padding:16px;
  color:var(--ph-ink);
  box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.ph-card.mini h5{ font-weight:800; margin-bottom:6px; }
.ph-muted{ color:var(--ph-muted); }

/* Ribbon (Prizes) */
.ph-ribbon{
  background: linear-gradient(135deg, var(--ph-orange), var(--ph-pink)) !important;
  border:0; border-radius:20px;
  box-shadow:0 18px 35px rgba(0,0,0,.3);
}
.ph-white-70{ color: rgba(255,255,255,.75); }
.ph-white-85{ color: rgba(255,255,255,.88); }

/* Partners */
.partners-grid{
  display:grid; gap:18px;
  grid-template-columns: repeat(4,1fr);
}
@media (max-width:992px){ .partners-grid{ grid-template-columns:repeat(2,1fr); } }
.partner-card{
  background:#0f1330; border:1px solid var(--ph-stroke);
  border-radius:16px; padding:22px; text-align:center;
  transition:.2s;
}
.partner-card:hover{ transform: translateY(-3px); }
.partner-card img{ max-height:78px; width:auto; margin:0 auto 8px; display:block; }
.partner-card h6{ color:#cfd6ff; font-weight:700; }

/* Contact */
#contact p.ph-strong{ color:#eef2ff; font-weight:700; }

/* Make default cards/inputs align with landing palette */
.card{ background: linear-gradient(180deg,#12173a,#0e1330); border:1px solid var(--ph-stroke); }
.form-control, .form-select{
  background:#0e1435; color:#fff; border:1px solid var(--ph-stroke);
}






/* ===== OVERRIDES: ألوان مكثّفة حسب التصميم ===== */
/* لو حسّيت اختلاف بسيط بالدرجات، عطِني أكواد HEX النهائية من المصمم وأبدّلها لك فوراً */
:root{
  --ph-bg:#0a0f1f;           /* خلفية داكنة أكثر */
  --ph-ink:#f2f5ff;          /* نص فاتح جداً */
  --ph-ink-dim:#cfe0ff;      /* نص ثانوي واضح */
  --ph-muted:#a8b7e6;        /* رمادي مزرق */
  --ph-stroke:rgba(255,255,255,.10);

  --ph-violet:#7c3aed;       /* بنفسجي قوي */
  --ph-cyan:#06b6d4;         /* فيروزي قوي */
  --ph-orange:#ff6a00;       /* برتقالي */
  --ph-pink:#ff2d55;         /* وردي قوي */

  --ph-card-1:#101734;       /* خلفية بطاقات */
  --ph-card-2:#0e142d;
}

/* ===== HERO أقوى و الشعار أكبر ===== */
.ph-hero{
  background:
    radial-gradient(900px 340px at 10% -10%, rgba(6,182,212,.20), transparent 60%),
    radial-gradient(1100px 420px at 90% -25%, rgba(124,58,237,.26), transparent 60%),
    linear-gradient(180deg, #0f1430, var(--ph-bg));
  color:var(--ph-ink);
  padding: 122px 0 96px;
  border-bottom:1px solid var(--ph-stroke);
  position:relative;
  overflow: clip;
}
.ph-hero-logo{
  height: clamp(110px, 10vw, 160px);  /* تكبير واضح */
  filter: drop-shadow(0 8px 22px rgba(0,0,0,.35));
}
.ph-hero-kicker{ margin:16px 0 8px; color:var(--ph-ink-dim); font-weight:700; letter-spacing:.2px; }
.ph-hero-title{
  font-size: clamp(2rem, 2.6vw + 1rem, 3.2rem);
  font-weight: 900;
  margin-bottom: 18px;
  line-height: 1.25;
}
.ph-hero-cta .btn{ border-radius: 14px; padding: 12px 18px; font-weight: 800; }
.ph-btn-primary{
  background: linear-gradient(90deg, var(--ph-violet), var(--ph-cyan));
  border:0; color:#fff;
  box-shadow: 0 10px 28px rgba(124,58,237,.22);
}
.ph-btn-ghost{
  background: transparent; color:#fff;
  border:1px solid var(--ph-stroke);
}
.ph-btn-ghost:hover{ background: rgba(255,255,255,.06); }

/* ختم خلفي */
.ph-hero-stamp{
  position:absolute; inset-inline:0; bottom:-16px; text-align:center;
  font-weight:900; letter-spacing:.22em; opacity:.06; pointer-events:none;
  font-size: clamp(3rem, 8vw + 1rem, 9rem);
}

/* ===== أقسام عامة بتباين قوي ===== */
.ph-section{ padding:72px 0; background:var(--ph-bg); color:var(--ph-ink); }
.ph-section-alt{ padding:72px 0; background:#0e1430; border-block:1px solid var(--ph-stroke); }
.ph-title-ink{
  background: linear-gradient(90deg, var(--ph-violet), var(--ph-cyan));
  -webkit-background-clip:text; background-clip:text; color:transparent;
  font-weight:900; letter-spacing:.5px;
}
.ph-lead{ color:#e9edff; font-size:1.18rem; font-weight:600; }

/* ===== بطاقات عامة ===== */
.ph-card{
  background: linear-gradient(180deg,var(--ph-card-1),var(--ph-card-2));
  border:1px solid var(--ph-stroke);
  border-radius:18px; padding:18px;
  color:var(--ph-ink);
  box-shadow: 0 10px 28px rgba(0,0,0,.28);
}
.ph-muted{ color:var(--ph-muted); }

/* ===== الجوائز (شريط متدرّج قوي) ===== */
.ph-ribbon{
  background: linear-gradient(135deg, var(--ph-orange), var(--ph-pink)) !important;
  border:0; border-radius:22px;
  box-shadow:0 20px 38px rgba(0,0,0,.35);
}
.ph-white-70{ color: rgba(255,255,255,.78); }
.ph-white-85{ color: rgba(255,255,255,.90); }

/* ===== شركاؤنا (بطاقات داكنة تناسب شعارات بيضاء) ===== */
.partners-grid{
  display:grid; gap:18px; grid-template-columns: repeat(4,1fr);
}
@media (max-width:992px){ .partners-grid{ grid-template-columns:repeat(2,1fr); } }
.partner-card{
  background:#0f1430; border:1px solid var(--ph-stroke);
  border-radius:18px; padding:22px; text-align:center;
  transition:.2s;
}
.partner-card:hover{ transform: translateY(-3px); }
.partner-card img{ max-height:82px; width:auto; margin:0 auto 10px; display:block; }
.partner-card h6{ color:#dbe4ff; font-weight:800; }

/* ===== تواصل معنا أوضح ===== */
#contact p.ph-strong{ color:#eef2ff; font-weight:800; letter-spacing:.2px; }

/* ===== قسم الأهداف بنفس فكرة الملف: لونين + نقاط يمين/يسار ===== */
#goals{
  position: relative;
  overflow: clip;
}
#goals::before,
#goals::after{
  content:"";
  position:absolute;
  width:220px; height:220px;
  background:
    radial-gradient(6px 6px at 14px 14px, rgba(255,255,255,.45) 45%, transparent 50%) 0 0/28px 28px,
    radial-gradient(6px 6px at 14px 14px, rgba(255,255,255,.35) 45%, transparent 50%) 14px 14px/28px 28px;
  opacity:.10;
  filter: blur(.2px);
}
#goals::before{ inset-inline-start:-40px; top:-30px; transform: rotate(12deg); }
#goals::after { inset-inline-end:-40px; bottom:-40px; transform: rotate(-8deg); }

/* بطاقات الأهداف المتناوبة لونين */
.goal-card{
  position: relative;
  border-radius: 18px;
  padding: 18px 16px;
  border: 1px solid var(--ph-stroke);
  color: var(--ph-ink);
  overflow: hidden;
}
.goal-card h5{ font-weight:900; margin-bottom: 6px; letter-spacing:.2px; }
.goal-card p{ margin:0; color: var(--ph-ink-dim); font-weight:600; }

/* تدرّجين مختلفين (لونين) */
.goal-a{ background: linear-gradient(180deg, #151b3d, #101632); }
.goal-b{ background: linear-gradient(180deg, #121739, #0e142e); }

/* نقطة ديكور لكل بطاقة (يمين) */
.goal-card::after{
  content:""; position:absolute; inset-inline-end:-26px; top:-26px;
  width:120px; height:120px; border-radius:50%;
  background: radial-gradient(closest-side, rgba(124,58,237,.35), transparent 70%);
  filter: blur(1px);
}

/* تخطيط الشبكة للأهداف */
.goals-grid{ display:grid; gap:14px; grid-template-columns: repeat(3, 1fr); }
@media (max-width:992px){ .goals-grid{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width:600px){ .goals-grid{ grid-template-columns: 1fr; } }


















/* ====== Projecthon New Theme (RTL) ====== */
:root{
  --ph-bg:#002160;            /* الخلفية الأساسية */
  --ph-ink:#F2F6FF;           /* نص فاتح */
  --ph-ink-dim:#D7E1FF;       /* نص ثانوي */
  --ph-muted:#B7C5F0;         /* رمادي مزرق */

  --ph-violet:#362880;        /* محتوى - بنفسجي غامق */
  --ph-pink:#AC46BD;          /* محتوى - أرجواني */
  --ph-cyan:#08F3EC;          /* محتوى - فيروزي */
  --ph-stroke:rgba(255,255,255,.10);

  --ph-card-1:#0E2B6B;        /* تدرج بطاقات */
  --ph-card-2:#0A2360;
}

body{ background: var(--ph-bg); color: var(--ph-ink); font-family: 'Tajawal', system-ui; direction: rtl; }
a{ color: var(--ph-cyan); }
a:hover{ filter: brightness(1.1); }

.ph-section{ padding:72px 0; background: var(--ph-bg); }
.ph-section-alt{ padding:72px 0; background: #022456; border-block:1px solid var(--ph-stroke); }

/* ===== HERO with Video ===== */
.ph-hero{
  position: relative; overflow: clip;
  min-height: 78vh; display: flex; align-items: center;
  border-bottom:1px solid var(--ph-stroke);
}
.ph-hero.has-video .ph-hero-video{
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  filter: saturate(1.1) contrast(1.05) brightness(.65);
}
.ph-hero-overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(900px 380px at 12% -10%, rgba(8,243,236,.20), transparent 60%),
    radial-gradient(1100px 420px at 90% -25%, rgba(172,70,189,.22), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,.25), rgba(0,0,0,.35));
}

/* Decorative floating shapes */
.ph-hero-shape{
  position:absolute; border-radius:50%;
  filter: blur(1px); opacity:.18; pointer-events:none;
}
.ph-shape-a{
  width:240px; height:240px; right:-60px; top:-40px;
  background: radial-gradient(closest-side, var(--ph-pink), transparent 70%);
  animation: floatY 6s ease-in-out infinite;
}
.ph-shape-b{
  width:280px; height:280px; left:-70px; bottom:-60px;
  background: radial-gradient(closest-side, var(--ph-cyan), transparent 70%);
  animation: floatX 7s ease-in-out infinite;
}
@keyframes floatY { 0%,100%{ transform: translateY(0);} 50%{ transform: translateY(12px);} }
@keyframes floatX { 0%,100%{ transform: translateX(0);} 50%{ transform: translateX(14px);} }

.ph-hero-logo{ height: clamp(110px, 10vw, 160px); filter: drop-shadow(0 8px 22px rgba(0,0,0,.35)); }
.ph-hero-kicker{ margin: 14px 0 6px; color: var(--ph-ink-dim); font-weight:700; letter-spacing:.2px; }
.ph-hero-title{
  font-size: clamp(2rem, 2.4vw + 1rem, 3.1rem);
  font-weight: 900; margin-bottom: 18px; line-height: 1.25; color: #fff;
}
.ph-hero-cta .btn{ border-radius: 14px; padding: 12px 18px; font-weight: 800; }

.ph-btn-primary{
  background: linear-gradient(90deg, var(--ph-pink), var(--ph-cyan)); color:#001627; border:0;
  box-shadow: 0 10px 28px rgba(8,243,236,.18);
}
.ph-btn-ghost{ background: transparent; color:#fff; border:1px solid var(--ph-stroke); }
.ph-btn-ghost:hover{ background: rgba(255,255,255,.06); }

.ph-hero-stamp{
  position:absolute; inset-inline:0; bottom:-18px; text-align:center;
  font-weight:900; letter-spacing:.22em; opacity:.06; pointer-events:none;
  font-size: clamp(3rem, 8vw + 1rem, 9rem); color:#fff;
}

/* Cards + shared */
.ph-card{
  background: linear-gradient(180deg, var(--ph-card-1), var(--ph-card-2));
  border: 1px solid var(--ph-stroke); border-radius: 18px; color: var(--ph-ink);
  box-shadow: 0 10px 28px rgba(0,0,0,.28);
}
.ph-lead{ color:#EBF3FF; font-size:1.12rem; font-weight:600; }
.ph-title-ink{
  background: linear-gradient(90deg, var(--ph-violet), var(--ph-cyan));
  -webkit-background-clip:text; background-clip:text; color:transparent;
  font-weight:900; letter-spacing:.5px;
}
.ph-strong{ color:#F3F7FF; font-weight:800; }

/* Lists */
.ph-list{ margin: 0; padding: 0 1rem; }
.ph-list li{ margin:.25rem 0; color: var(--ph-ink-dim); }

/* Goals (لونين + نقاط يمين/يسار + أنيميشن خفيف) */
#goals{ position: relative; overflow: clip; }
#goals::before, #goals::after{
  content:""; position:absolute; width:220px; height:220px; opacity:.10; filter: blur(.2px);
  background:
    radial-gradient(6px 6px at 14px 14px, rgba(255,255,255,.45) 45%, transparent 50%) 0 0/28px 28px,
    radial-gradient(6px 6px at 14px 14px, rgba(255,255,255,.35) 45%, transparent 50%) 14px 14px/28px 28px;
}
#goals::before{ inset-inline-start:-40px; top:-30px; transform: rotate(12deg); }
#goals::after { inset-inline-end:-40px; bottom:-40px; transform: rotate(-8deg); }

.goals-grid{ display:grid; gap:14px; grid-template-columns: repeat(3, 1fr); }
@media (max-width:992px){ .goals-grid{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width:600px){ .goals-grid{ grid-template-columns: 1fr; } }
.goal-card{ position:relative; border-radius:18px; padding:18px; border:1px solid var(--ph-stroke); }
.goal-card h5{ font-weight:900; margin-bottom: 6px; letter-spacing:.2px; color:#fff; }
.goal-card p{ margin:0; color: var(--ph-ink-dim); font-weight:600; }
.goal-a{ background: linear-gradient(180deg, #151B8A, #0F176F); } /* اشتقاق من #362880 */
.goal-b{ background: linear-gradient(180deg, #271A73, #101457); } /* تنويع نفس العائلة */
.ph-float{ animation: updown 4.8s ease-in-out infinite; }
.ph-float-delay{ animation: updown 5.6s ease-in-out 0.5s infinite; }
@keyframes updown { 0%,100%{ transform: translateY(0);} 50%{ transform: translateY(-6px);} }

/* Partners grid */
.partners-grid{ display:grid; gap:18px; grid-template-columns:repeat(4,1fr); }
@media (max-width:992px){ .partners-grid{ grid-template-columns:repeat(2,1fr); } }
.partner-card{ text-align:center; transition:.2s; }
.partner-card:hover{ transform: translateY(-3px); }
.partner-card img{ max-height:82px; width:auto; margin:0 auto 10px; display:block; }
.partner-card h6{ color:#E6EDFF; font-weight:800; }

/* Inputs (بحث المبادرات) */
.ph-input.sm{ height: 40px; padding: 6px 10px; border-radius: 10px; border:1px solid var(--ph-stroke); background:#0E2B6B; color:#fff; }
.ph-input.sm::placeholder{ color:#BFD6FF; }

/* Buttons (bootstrap overrides safe) */
.btn{ font-weight:800; }
.btn-sm{ padding:.4rem .6rem; font-size:.9rem; }

/* Contact */
#contact p{ color: rgba(255,255,255,.9); }

/* Media helpers */
.ratio.ratio-16x9 video, .ratio.ratio-16x9 img{ width:100%; height:100%; object-fit:cover; }

/* ===== تحسين بطاقات الأهداف/المراحل مع أيقونات متناسقة ===== */
.ph-goal-card, .ph-step { position:relative; overflow:hidden; }
.ph-ico { 
  width:54px; height:54px; border-radius:14px; 
  background: linear-gradient(135deg, #AC46BD, #08F3EC);
  display:flex; align-items:center; justify-content:center; 
  margin-bottom:10px; box-shadow:0 6px 16px rgba(8,243,236,.15);
}
.ph-ico.sm { width:42px; height:42px; border-radius:12px; }

.ph-ico svg { width:26px; height:26px; fill:none; stroke:#001a24; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.ph-ico.sm svg { width:22px; height:22px; }

.ph-step .fw-bold { color:#F2F6FF; }

/* تحسين تباعد العناصر داخل أقسام جديدة */
#beneficiaries .ph-card h6, #value .ph-card h6 { color:#F2F6FF; font-weight:800; }

/* CTA المبادرات */
#initiatives-cta .btn[disabled] { opacity:.6; cursor:not-allowed; }

/* تباين أعلى لعناوين صغيرة داخل بطاقات */
.ph-card h5, .ph-card h6 { color:#fff; font-weight:800; }

/* تأكيد ألوان الشريط (الجوائز) مع الهوية */
.ph-ribbon{
  background: linear-gradient(135deg, #362880, #AC46BD) !important;
  border:0; border-radius:22px;
  box-shadow:0 20px 38px rgba(0,0,0,.35);
}

/* Chips / Badges أنيقة */
.badge.chip{
  background: rgba(8,243,236,.15);
  border: 1px solid rgba(8,243,236,.35);
  color: #8efaff;
  border-radius: 999px;
  padding: 6px 10px;
  font-weight: 700;
}
.badge.pill{
  background: rgba(172,70,189,.15);
  border: 1px solid rgba(172,70,189,.35);
  color: #f2b7ff;
  border-radius: 999px;
  padding: 4px 10px;
  font-weight: 700;
}
.badge.pill.muted{
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.16);
  color: rgba(255,255,255,.78);
}

/* مدخلات شريط الأدوات */
.ph-input.sm{
  height: 40px; padding: 6px 10px; border-radius: 10px;
  border:1px solid rgba(255,255,255,.14);
  background:#0E2B6B; color:#fff;
}
.ph-input.sm::placeholder{ color:#BFD6FF; }


/* ===== لوحة الألوان (مطابقة لهويتكم) ===== */
:root{
  --ph-bg:#002160;
  --ph-ink:#F2F6FF;
  --ph-ink-dim:#D7E1FF;
  --ph-muted:#B7C5F0;
  --ph-violet:#362880;
  --ph-pink:#AC46BD;
  --ph-cyan:#08F3EC;
  --ph-stroke:rgba(255,255,255,.12);
}

/* ===== أهداف – Pills ===== */
.ph-goals{ background: #0b1130; }
.section-cap{ display:flex; align-items:center; gap:14px; justify-content:center; margin-bottom:16px; }
.section-cap .cap-line{
  width:min(20vw,160px); height:8px; border-radius:999px;
  background: linear-gradient(90deg, var(--ph-cyan), var(--ph-pink), var(--ph-violet));
  opacity:.55;
}
.goals-pills{
  display:grid; gap:12px;
  grid-template-columns: repeat(3, minmax(0,1fr));
}
@media (max-width:992px){ .goals-pills{ grid-template-columns: 1fr 1fr; } }
@media (max-width:600px){ .goals-pills{ grid-template-columns: 1fr; } }

.pill{
  display:flex; align-items:center; gap:10px;
  padding:14px 16px; border-radius:16px;
  background:#0d1740; border:1px solid var(--ph-stroke);
  color:#fff; font-weight:800; letter-spacing:.2px;
  box-shadow: 0 10px 24px rgba(0,0,0,.25);
}
.pill-accent{ background: linear-gradient(180deg, #121742, #0e1435); border-color: rgba(255,255,255,.14); }
.pill .ico{ display:inline-flex; width:36px; height:36px; align-items:center; justify-content:center;
  background: linear-gradient(135deg, var(--ph-pink), var(--ph-cyan)); border-radius:10px; }
.pill .ico svg{ width:20px; height:20px; color:#00182a; }

/* ===== مراحل – كاروسيل التفاف بلا نهاية ===== */
.ph-stages{
  background: linear-gradient(180deg, #04163c, #002160);
  border-top:1px solid var(--ph-stroke); border-bottom:1px solid var(--ph-stroke);
}
.loop{ position:relative; overflow:hidden; }
.loop-track{
  display:flex; gap:16px; width:max-content;
  animation: scrollLoop 28s linear infinite;
}
.stage-card{
  width: 260px; min-height: 360px;
  background: #0f173a; color: var(--ph-ink);
  border:1px solid var(--ph-stroke); border-radius:18px;
  box-shadow:0 10px 28px rgba(0,0,0,.28);
}
.stage-card .card-img{ height:160px; overflow:hidden; border-bottom:1px solid var(--ph-stroke); background:#0c1330; }
.stage-card .card-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.stage-card .card-body{ padding:14px; }
.stage-card h5{ font-weight:900; margin-bottom:6px; color:#fff; }

@keyframes scrollLoop{
  0% { transform: translateX(0); }
  100% { transform: translateX(calc(-50%)); } /* لأننا ضاعفنا القائمة */
}

/* أزرار التحكّم */
#pauseLoop, #playLoop { min-width: 160px; }

/* ===== Goals Pills ===== */
.ph-goals{ background:#0b1130; }
.section-cap{ display:flex; align-items:center; gap:14px; justify-content:center; margin-bottom:16px; }
.section-cap .cap-line{
  width:min(20vw,160px); height:8px; border-radius:999px;
  background: linear-gradient(90deg, #08F3EC, #AC46BD, #362880);
  opacity:.55;
}

.goals-pills{ display:grid; gap:12px; grid-template-columns: repeat(3, minmax(0,1fr)); }
@media (max-width:992px){ .goals-pills{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .goals-pills{ grid-template-columns:1fr; } }

.pill{
  display:flex; align-items:center; gap:10px;
  padding:14px 16px; border-radius:16px;
  background:#0d1740; border:1px solid rgba(255,255,255,.12);
  color:#fff; font-weight:800; letter-spacing:.2px;
  box-shadow:0 10px 24px rgba(0,0,0,.25);
}
.pill-accent{ background: linear-gradient(180deg, #121742, #0e1435); border-color: rgba(255,255,255,.18); }
.pill .ico{
  display:inline-flex; width:36px; height:36px; align-items:center; justify-content:center;
  background: linear-gradient(135deg, #AC46BD, #08F3EC);
  border-radius:10px; color:#00182a;
}

/* ===== Stages Infinite Loop ===== */
.ph-stages{ background: linear-gradient(180deg, #04163c, #002160); border-block:1px solid rgba(255,255,255,.12); }
.loop{ position:relative; overflow:hidden; }
.loop-track{ display:flex; gap:16px; width:max-content; animation: scrollLoop 28s linear infinite; }
@keyframes scrollLoop{ 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

.stage-card{
  width:260px; min-height:360px;
  background:#0f173a; color:#F2F6FF;
  border:1px solid rgba(255,255,255,.12); border-radius:18px;
  box-shadow:0 10px 28px rgba(0,0,0,.28);
}
.stage-card .card-img{ height:160px; overflow:hidden; border-bottom:1px solid rgba(255,255,255,.12); background:#0c1330; }
.stage-card .card-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.stage-card .card-body{ padding:14px; }
.stage-card h5{ font-weight:900; margin-bottom:6px; color:#fff; }

/* نوحد الازرار */
/* ===== أزرار البرنامج بألوان الهوية ===== */
button,
.btn,
input[type="submit"],
input[type="button"] {
  background-color: #362881 !important; /* لون الهوية */
  color: #aff2f2 !important;           /* لون النص */
  border: none !important;
  border-radius: 8px;                  /* حواف ناعمة */
  font-weight: 600;
  box-shadow: 0 4px 12px rgba(54,40,129,.3);
  transition: background-color 0.2s ease, transform 0.1s ease;
}

/* تأثير عند المرور */
button:hover,
.btn:hover,
input[type="submit"]:hover,
input[type="button"]:hover {
  filter: brightness(1.1);
  transform: translateY(-1px);
}

/* تأثير عند الضغط */
button:active,
.btn:active,
input[type="submit"]:active,
input[type="button"]:active {
  transform: translateY(0);
}