/*
 * ACADRIX — هوية الشعار وحركاته
 * الشعار ثلاث طبقات على لوحة واحدة (scripts/build_brand_icons.py):
 *   الحلقة الخارجية · الحلقة الداخلية · حرف A بالقبعة والكتاب
 * فتدور كل حلقة وحدها. الماركب في templates/_brand.html.
 */
:root {
    --brand-teal: #25b09b;
    --brand-red: #f03355;
    --brand-violet: #514b82;
    --brand-amber: #ffa516;
    --brand-navy: #1a1e3d;
    --brand-ring: conic-gradient(var(--brand-teal) 25%, var(--brand-red) 0 50%, var(--brand-violet) 0 75%, var(--brand-amber) 0);
}

/* ---------------------------------------------------------------- الشعار */
.bm { position: relative; display: inline-block; width: var(--bm, 48px); height: var(--bm, 48px); flex: none; vertical-align: middle; }
.bm img { position: absolute; inset: 0; width: 100%; height: 100%; user-select: none; -webkit-user-drag: none; }
.bm .bm-o, .bm .bm-i, .bm .bm-a { transform-origin: 50% 50%; will-change: transform; }
/* حرف A كحلي: يُضاء خلفه في الثيم الداكن ليُقرأ */
body:not(.light-theme) .bm .bm-a { filter: drop-shadow(0 0 calc(var(--bm, 48px) * .05) rgba(255, 255, 255, .55)); }

/* دوران مستمر: شاشة التحميل */
.bm.spin .bm-o { animation: bm-cw 2.4s cubic-bezier(.6, .1, .4, .9) infinite; }
.bm.spin .bm-i { animation: bm-ccw 1.8s cubic-bezier(.6, .1, .4, .9) infinite; }
.bm.spin .bm-a { animation: bm-breathe 1.2s ease-in-out infinite; }

/* تركيب الشعار عند الظهور ثم دوران هادئ: صفحة الدخول وحول النظام */
.bm.assemble .bm-o { animation: bm-in-o 1.1s cubic-bezier(.2, .8, .2, 1) both, bm-cw 60s linear 1.1s infinite; }
.bm.assemble .bm-i { animation: bm-in-i 1.1s cubic-bezier(.2, .8, .2, 1) .12s both, bm-ccw 45s linear 1.22s infinite; }
.bm.assemble .bm-a { animation: bm-in-a .9s cubic-bezier(.34, 1.56, .64, 1) .45s both, bm-float 5s ease-in-out 1.4s infinite; }
.bm.assemble:hover .bm-o { animation-duration: 1.1s, 6s; }
.bm.assemble:hover .bm-i { animation-duration: 1.1s, 4s; }

/* لفّة واحدة عند المرور وعند تحميل الصفحة: شعار الرأس */
.bm.flick .bm-o { animation: bm-cw 1.2s cubic-bezier(.5, 0, .2, 1) 1; }
.bm.flick .bm-i { animation: bm-ccw 1.2s cubic-bezier(.5, 0, .2, 1) 1; }
a:hover > .bm.flick .bm-o, .bm.flick:hover .bm-o { animation: bm-cw .9s cubic-bezier(.5, 0, .2, 1) infinite; }
a:hover > .bm.flick .bm-i, .bm.flick:hover .bm-i { animation: bm-ccw .9s cubic-bezier(.5, 0, .2, 1) infinite; }

@keyframes bm-cw { to { transform: rotate(1turn); } }
@keyframes bm-ccw { to { transform: rotate(-1turn); } }
@keyframes bm-breathe { 50% { transform: scale(.88); } }
@keyframes bm-float { 50% { transform: translateY(-3%); } }
@keyframes bm-in-o { from { transform: rotate(-200deg) scale(.4); opacity: 0; } }
@keyframes bm-in-i { from { transform: rotate(220deg) scale(1.6); opacity: 0; } }
@keyframes bm-in-a { from { transform: translateY(-60%) scale(.3); opacity: 0; } }

/* ---------------------------------------------------------------- النص */
.bm-word { display: block; margin: 12px auto 0; height: auto; animation: bm-word-in .7s ease .9s both; }
.bm-word.dark-only { display: none; }
body:not(.light-theme) .bm-word.dark-only { display: block; }
body:not(.light-theme) .bm-word.light-only { display: none; }
@keyframes bm-word-in { from { opacity: 0; transform: translateY(10px); letter-spacing: .2em; } }

/* لمعة تعبر النص مرة كل بضع ثوانٍ */
.bm-shine { position: relative; display: block; width: max-content; max-width: 100%; margin: 0 auto; overflow: hidden; }
.bm-shine::after { content: ""; position: absolute; inset: 0; transform: translateX(-120%);
    background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, .55) 50%, transparent 65%);
    animation: bm-shine 5s ease-in-out 2s infinite; pointer-events: none; mix-blend-mode: overlay; }
@keyframes bm-shine { 0%, 70% { transform: translateX(-120%); } 100% { transform: translateX(120%); } }

/* ---------------------------------------------------------------- خلفية بألوان الشعار */
.bm-orbs { position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.bm-orbs span { position: absolute; width: 42vmax; height: 42vmax; border-radius: 50%; filter: blur(70px); opacity: .22; animation: bm-orb 22s ease-in-out infinite alternate; }
.bm-orbs span:nth-child(1) { background: var(--brand-teal); top: -18vmax; right: -12vmax; }
.bm-orbs span:nth-child(2) { background: var(--brand-amber); top: -14vmax; left: -16vmax; animation-delay: -6s; }
.bm-orbs span:nth-child(3) { background: var(--brand-red); bottom: -20vmax; right: -10vmax; animation-delay: -11s; }
.bm-orbs span:nth-child(4) { background: var(--brand-violet); bottom: -18vmax; left: -14vmax; animation-delay: -16s; }
body.light-theme .bm-orbs span { opacity: .28; }
@keyframes bm-orb { to { transform: translate(6vmax, 5vmax) scale(1.15); } }

/* شريط بألوان الحلقات بدل الحدّ الأزرق */
.bm-bar { position: relative; }
.bm-bar::before { content: ""; position: absolute; inset: 0 0 auto; height: 5px; border-radius: inherit;
    border-bottom-left-radius: 0; border-bottom-right-radius: 0;
    background: linear-gradient(90deg, var(--brand-amber), var(--brand-teal), var(--brand-red), var(--brand-violet), var(--brand-amber));
    background-size: 200% 100%; animation: bm-bar 6s linear infinite; }
@keyframes bm-bar { to { background-position: 200% 0; } }

@media (prefers-reduced-motion: reduce) {
    .bm img, .bm-word, .bm-shine::after, .bm-orbs span, .bm-bar::before { animation: none !important; }
}