/* ============================================================ VIJIN.AI · Sovereign — Command Outputs Wave (sv-proc) "من الرصد إلى القرار التنفيذي" ------------------------------------------------------------ Applies Neon Float icon system to the wave nodes. Enhances the connecting wave SVG with glow. Scope: .svx [data-seg="sovereign"] .sv-proc Reversible: remove `svx` from . ============================================================ */ /* ── Wave path: stronger glow ───────────────────────────── */ .svx [data-seg="sovereign"] .sv-proc-wave{ filter: drop-shadow(0 0 14px rgba(123,108,240,.6)) drop-shadow(0 0 4px rgba(23,209,198,.5)) !important; opacity:.92 !important; } /* ── Badge: strip ALL backgrounds including 3d.css overrides ─ */ .svx [data-seg="sovereign"] .sv-proc-badge, .svx [data-seg="sovereign"] .sv-proc-badge:hover{ width:100px !important; height:112px !important; background:none !important; background-image:none !important; border:none !important; box-shadow:none !important; border-radius:0 !important; display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:flex-start !important; overflow:visible !important; position:relative !important; padding-bottom:14px !important; animation:none !important; transform:none !important; filter:none !important; } /* Glow halo BEHIND icon — very subtle atmosphere only */ .svx [data-seg="sovereign"] .sv-proc-badge::before{ content:"" !important; position:absolute !important; top:0px !important; left:50% !important; transform:translateX(-50%) !important; width:100px !important; height:100px !important; border-radius:50% !important; background:radial-gradient(circle at center, color-mix(in oklab,var(--c) 22%,transparent) 0%, color-mix(in oklab,var(--c) 8%,transparent) 45%, transparent 72%) !important; filter:blur(14px) !important; z-index:0 !important; pointer-events:none !important; } /* Holographic disc base */ .svx [data-seg="sovereign"] .sv-proc-badge::after{ content:"" !important; position:absolute !important; bottom:0 !important; left:50% !important; transform:translateX(-50%) !important; width:78px !important; height:14px !important; border-radius:50% !important; background:radial-gradient(ellipse at center, color-mix(in oklab,var(--c) 34%,transparent) 0%, color-mix(in oklab,var(--c) 14%,transparent) 50%, transparent 75%) !important; border:1px solid color-mix(in oklab,var(--c) 48%,transparent) !important; box-shadow:0 0 16px 4px color-mix(in oklab,var(--c) 30%,transparent) !important; z-index:1 !important; pointer-events:none !important; } /* SVG: neon glow */ .svx [data-seg="sovereign"] .sv-proc-badge svg{ width:48px !important; height:48px !important; position:relative !important; z-index:2 !important; color:var(--c) !important; filter: drop-shadow(0 0 3px color-mix(in oklab,var(--c) 100%,transparent)) drop-shadow(0 0 12px color-mix(in oklab,var(--c) 88%,transparent)) drop-shadow(0 0 26px color-mix(in oklab,var(--c) 58%,transparent)) brightness(1.3) !important; margin-bottom:8px !important; flex:none !important; } /* Floating animation per node */ .svx [data-seg="sovereign"] .sv-proc-node{ animation:svProcFloat 4s ease-in-out infinite !important; } .svx [data-seg="sovereign"] .sv-proc-node:nth-child(2){animation-delay:.65s !important;} .svx [data-seg="sovereign"] .sv-proc-node:nth-child(3){animation-delay:1.3s !important;} .svx [data-seg="sovereign"] .sv-proc-node:nth-child(4){animation-delay:1.95s !important;} .svx [data-seg="sovereign"] .sv-proc-node:nth-child(5){animation-delay:2.6s !important;} .svx [data-seg="sovereign"] .sv-proc-node:nth-child(6){animation-delay:3.25s !important;} @keyframes svProcFloat{ 0%,100%{transform:translate(-50%,-50%) translateY(0)} 50%{transform:translate(-50%,-50%) translateY(-9px)} } /* ── Title: colored + glow ──────────────────────────────── */ .svx [data-seg="sovereign"] .sv-proc-tx h4{ font-size:17px !important; font-weight:700 !important; color:var(--c) !important; text-shadow:0 0 20px color-mix(in oklab,var(--c) 55%,transparent) !important; line-height:1.3 !important; margin-bottom:6px !important; } .svx [data-seg="sovereign"] .sv-proc-tx p{ font-size:12.5px !important; color:var(--t2) !important; line-height:1.6 !important; } /* ── Responsive: keep mobile grid working ───────────────── */ @media(max-width:820px){ .svx [data-seg="sovereign"] .sv-proc-node{ animation:none !important; transform:none !important; } } @media(prefers-reduced-motion:reduce){ .svx [data-seg="sovereign"] .sv-proc-node{animation:none !important;} }