/* =====================================================================
   ألوان نابضة بالحياة — طبقة إضافية تُحمَّل بعد بقية ملفات التنسيق
   تعتمد على نفس متغيرات الهوية (الأخضر الزمردي، السماوي، الشمسي، المرجاني، البنفسجي)
   وتعمل في الوضعين الفاتح والداكن. احذف سطر الربط في index.html للعودة للشكل السابق.
   ===================================================================== */
:root{
  --v-rainbow:linear-gradient(90deg,#00B37E,#00A8B5,#2D8CFF,#7C5CFF,#FF5FA2,#FF6B5B,#FFC233);
  --v-glow:0 14px 30px -16px;
  --v-blob-a:rgba(0,179,126,.10);
  --v-blob-b:rgba(45,140,255,.10);
  --v-blob-c:rgba(124,92,255,.09);
  --v-blob-d:rgba(255,194,51,.12);
}
:root[data-theme="dark"]{
  --v-blob-a:rgba(0,179,126,.10);
  --v-blob-b:rgba(45,140,255,.10);
  --v-blob-c:rgba(124,92,255,.12);
  --v-blob-d:rgba(255,194,51,.05);
}

/* ---------- خلفية الصفحة: بقع لونية هادئة بدل اللون المسطّح ---------- */
body{
  background:
    radial-gradient(900px 600px at 100% 30%,var(--v-blob-b),transparent 60%),
    radial-gradient(800px 600px at 0% 55%,var(--v-blob-a),transparent 60%),
    radial-gradient(900px 700px at 100% 85%,var(--v-blob-c),transparent 60%),
    radial-gradient(700px 500px at 0% 100%,var(--v-blob-d),transparent 60%),
    var(--bg);
  background-attachment:fixed;
}
@media (max-width:760px){body{background-attachment:scroll}}

/* ---------- الرأس: حركة لونية خفيفة ---------- */
.hero{background-size:100% 100%,100% 100%,180% 180%!important;animation:vHero 16s ease-in-out infinite alternate}
html[data-season] .hero{animation:none}
@keyframes vHero{from{background-position:0 0,0 0,0% 50%}to{background-position:0 0,0 0,100% 50%}}
.hero h1{text-shadow:0 4px 24px rgba(0,40,90,.25)}

/* ---------- شريط الاختصارات: أيقونات ملوّنة بالكامل ---------- */
.apps{position:relative;overflow:hidden;border:0;padding-top:16px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--card) 92%,#7C5CFF),var(--card) 60%)}
.apps::before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:var(--v-rainbow)}
.apps .app .ai{
  background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 55%,#fff));
  color:#fff;box-shadow:var(--v-glow) var(--c)}
.apps .app:hover{background:color-mix(in srgb,var(--c,#2D8CFF) 9%,transparent)}
.apps .app:hover .ai{transform:translateY(-3px) scale(1.06);box-shadow:0 16px 26px -12px var(--c)}
.apps .app-edit .ai{background:linear-gradient(135deg,#5B6B7F,#8A99AD)}

/* ---------- عناوين الأقسام: شريط لوني تحت العنوان ---------- */
main section .sec-head h2{position:relative;padding-bottom:10px}
main section .sec-head h2::after{content:"";position:absolute;bottom:0;inset-inline-start:0;width:72px;height:5px;border-radius:5px;
  background:linear-gradient(90deg,var(--sc,var(--emerald)),color-mix(in srgb,var(--sc,var(--emerald)) 35%,#FFC233))}
main section .sec-head h2 .dot{box-shadow:0 0 0 5px color-mix(in srgb,var(--sc,var(--emerald)) 22%,transparent)}
#myschedule{--sc:#00A8B5}
#platforms{--sc:#7C5CFF}
#ticket{--sc:#FF6B5B}
#faq{--sc:#00B37E}

/* ---------- البطاقات العامة داخل الأقسام: حافة علوية ملوّنة ولمسة لون ---------- */
main section .card{position:relative;overflow:hidden;border-color:color-mix(in srgb,var(--sc,var(--azure)) 22%,var(--line));
  background:linear-gradient(160deg,color-mix(in srgb,var(--sc,var(--azure)) 7%,var(--card)),var(--card) 55%)}
main section .card::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;
  background:linear-gradient(90deg,var(--sc,var(--azure)),color-mix(in srgb,var(--sc,var(--azure)) 40%,#FFC233))}

/* ---------- بطاقات «يومي» ---------- */
.td{background:linear-gradient(135deg,color-mix(in srgb,var(--c,#0B8A63) 10%,var(--card)),var(--card) 70%);
  border-color:color-mix(in srgb,var(--c,#0B8A63) 28%,var(--line))}
.td .ti{background:linear-gradient(135deg,var(--c,#0B8A63),color-mix(in srgb,var(--c,#0B8A63) 55%,#fff));color:#fff;box-shadow:var(--v-glow) var(--c,#0B8A63)}
.td:hover{transform:translateY(-2px);box-shadow:0 18px 30px -18px var(--c,#0B8A63)}
.td{transition:transform .15s,box-shadow .2s}

/* ---------- المنصات التعليمية ---------- */
.pf-cat{background:linear-gradient(165deg,var(--soft),var(--card) 45%);border-color:color-mix(in srgb,var(--c) 25%,var(--line))}
.pf-cat::before{height:7px}
.pf-ic{background:linear-gradient(135deg,color-mix(in srgb,var(--c) 18%,#fff),#fff)}
.pf-btn:not(.pf-feature){background:color-mix(in srgb,var(--c) 10%,var(--card));border-color:color-mix(in srgb,var(--c) 18%,transparent)}
.pf-cat .pf-ic{background:linear-gradient(135deg,color-mix(in srgb,var(--c) 18%,#fff),#fff)}
.pf-cat .pf-feature .pf-ic{background:rgba(255,255,255,.95)!important}
:root[data-theme="dark"] .pf-cat{background:linear-gradient(165deg,color-mix(in srgb,var(--c) 16%,var(--card)),var(--card) 50%)}
:root[data-theme="dark"] .pf-ic{background:color-mix(in srgb,var(--c) 25%,#0F1B2B)}

/* ---------- الأزرار ---------- */
.email-box .btn{background:#fff!important;color:var(--violet)!important;box-shadow:0 6px 14px -8px rgba(40,20,120,.5)!important}
.btn:not(.light):not(.outline):not(.danger):not(.violet){
  background:linear-gradient(135deg,#00A774 0%,#00A8B5 55%,#2D8CFF 120%);
  box-shadow:0 10px 22px -10px rgba(0,150,140,.85)}
.btn:not(.light):not(.outline):not(.danger):not(.violet):hover{filter:brightness(1.07) saturate(1.1);transform:translateY(-1px)}
.btn.light{background:linear-gradient(135deg,#E3F8F0,#E3F1FF);color:#006E52}
:root[data-theme="dark"] .btn.light{background:linear-gradient(135deg,#0F3A2E,#132D52);color:#7BE3BE}
.btn.outline:hover{border-color:var(--violet);color:var(--violet)}
.seg{border-color:color-mix(in srgb,var(--coral) 22%,var(--line))}

/* ---------- حقول الإدخال: إطار ملوّن عند التركيز ---------- */
input:focus,select:focus,textarea:focus{border-color:var(--azure)!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--azure) 18%,transparent)}

/* ---------- بطاقة بياناتي ---------- */
.idcard{box-shadow:0 30px 60px -10px rgba(45,60,180,.35)}
.idcard-band{height:8px;background:var(--v-rainbow)}

/* ---------- الشريط السفلي ---------- */
.mini-contacts{border-top:0;position:relative}
.mini-contacts::before{content:"";position:absolute;top:0;left:15%;right:15%;height:3px;border-radius:3px;background:var(--v-rainbow);opacity:.7}
footer{position:relative;background:linear-gradient(120deg,#0B2545 0%,#173A6B 45%,#3B2A7A 100%)!important;color:#D7E2F0}
footer::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:var(--v-rainbow)}

/* ---------- زر «اسأل الدليل» العائم ---------- */
#askFab,.ask-fab{background:linear-gradient(135deg,#00A774,#2D8CFF)!important}

/* ---------- تباين عالٍ: إيقاف الزخارف اللونية حفاظًا على الوضوح ---------- */
html[data-contrast] body{background:var(--bg)}
html[data-contrast] .apps .app .ai{box-shadow:none}
html[data-contrast] main section .card,html[data-contrast] .td,html[data-contrast] .pf-cat{background:var(--card)}

@media (prefers-reduced-motion:reduce){.hero{animation:none}}
