/* ============================================================ VIJIN.AI · Sovereign — Controls as "Wall of Refusal" ------------------------------------------------------------ BOLD editorial typography. Each prohibition row is anchored by a giant outlined "لا" glyph (graphic motif echoing the oversized numerals in the reference), with a large statement, a meaningful neon icon, and a red "محظور / RESTRICTED" tag. Hairline rhythm. No cards, no bubbles, no glass — a sovereign declaration wall. Scope: .svx [data-seg="sovereign"] .sv-fcards Loaded LAST. Reversible: remove `svx` from . ============================================================ */ /* ── Stage: vertical declaration list ───────────────────── */ .svx [data-seg="sovereign"] .sv-fcards{ display:grid !important; grid-template-columns:1fr 1fr !important; gap:14px !important; grid-template-rows:none !important; grid-auto-flow:row !important; max-width:1080px !important; margin:46px auto 0 !important; border-top:none !important; } /* neutralise fcards.css 4-col + nth-child placement so it's a clean 2-col */ .svx [data-seg="sovereign"] .sv-fc:nth-child(1), .svx [data-seg="sovereign"] .sv-fc:nth-child(2), .svx [data-seg="sovereign"] .sv-fc:nth-child(3), .svx [data-seg="sovereign"] .sv-fc:nth-child(4), .svx [data-seg="sovereign"] .sv-fc:nth-child(5), .svx [data-seg="sovereign"] .sv-fc:nth-child(6), .svx [data-seg="sovereign"] .sv-fc:nth-child(7){ grid-column:auto !important; margin-inline-start:0 !important; } /* ── Row ────────────────────────────────────────────────── */ .svx [data-seg="sovereign"] .sv-fc, .svx [data-seg="sovereign"] .sv-fc:nth-child(n){ position:relative !important; overflow:hidden !important; display:grid !important; grid-template-columns:auto 1fr !important; align-items:center !important; gap:22px !important; width:auto !important; margin:0 !important; padding:26px 24px !important; border:1px solid rgba(255,255,255,.09) !important; border-radius:16px !important; background:transparent !important; transform:none !important; transition:background .26s ease, border-color .26s ease !important; } .svx [data-seg="sovereign"] .sv-fc:hover{ background:linear-gradient(90deg, color-mix(in oklab,var(--c) 10%,transparent), transparent 75%) !important; border-color:color-mix(in oklab,var(--c) 32%,transparent) !important; } /* ── Giant outlined "لا" hero glyph (left gutter in RTL) ──── */ .svx [data-seg="sovereign"] .sv-fc::before{ content:"" !important; display:none !important; } .svx [data-seg="sovereign"] .sv-fc:hover::before{ opacity:0 !important; } /* ── Meaningful neon icon (start anchor) ────────────────── */ .svx [data-seg="sovereign"] .sv-fc-ic{ position:relative !important; inset:auto !important; opacity:1 !important; z-index:2 !important; pointer-events:auto !important; width:74px !important; height:74px !important; margin:0 !important; padding:0 !important; border:none !important; background:none !important; box-shadow:none !important; border-radius:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; overflow:visible !important; flex:none !important; } .svx [data-seg="sovereign"] .sv-fc-ic::before{ content:"" !important; position:absolute !important; inset:0 !important; top:auto !important; left:50% !important; bottom:50% !important; width:64px !important; height:64px !important; transform:translate(-50%,50%) !important; border-radius:50% !important; background:radial-gradient(circle at center, color-mix(in oklab,var(--c) 40%,transparent), transparent 70%) !important; filter:blur(11px) !important; z-index:0 !important; } .svx [data-seg="sovereign"] .sv-fc-ic::after{display:none !important;} .svx [data-seg="sovereign"] .sv-fc-ic svg{ width:40px !important; height:40px !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) 80%,transparent)) drop-shadow(0 0 26px color-mix(in oklab,var(--c) 50%,transparent)) brightness(1.25) !important; transition:transform .26s ease !important; } .svx [data-seg="sovereign"] .sv-fc:hover .sv-fc-ic svg{transform:scale(1.12) !important;} /* ── Statement text (the hero) ──────────────────────────── */ .svx [data-seg="sovereign"] .sv-fc-in{ position:relative !important; z-index:2 !important; min-height:0 !important; height:auto !important; padding:0 !important; display:block !important; text-align:start !important; } .svx [data-seg="sovereign"] .sv-fc-in b{ position:relative !important; z-index:2 !important; display:block !important; font-size:19px !important; font-weight:700 !important; color:#f4f7ff !important; line-height:1.45 !important; letter-spacing:-.01em !important; text-shadow:none !important; } /* ── "RESTRICTED" tag removed per user request ──────────── */ .svx [data-seg="sovereign"] .sv-fc-in::after{ display:none !important; } /* ── Responsive ─────────────────────────────────────────── */ @media(max-width:680px){ .svx [data-seg="sovereign"] .sv-fcards{grid-template-columns:1fr !important;} .svx [data-seg="sovereign"] .sv-fc, .svx [data-seg="sovereign"] .sv-fc:nth-child(n){ grid-template-columns:auto 1fr !important; gap:16px !important; padding:22px 16px !important; } .svx [data-seg="sovereign"] .sv-fc-in b{font-size:17px !important;} .svx [data-seg="sovereign"] .sv-fc::before{font-size:78px !important;inset-inline-end:14px !important;} .svx [data-seg="sovereign"] .sv-fc-ic{width:52px !important;height:52px !important;} .svx [data-seg="sovereign"] .sv-fc-ic svg{width:30px !important;height:30px !important;} } @media(prefers-reduced-motion:reduce){ .svx [data-seg="sovereign"] .sv-fc:hover .sv-fc-ic svg{transform:none !important;} } /* ── LIGHT THEME: never white/gold/yellow on cream — dark ink + tamed glow ── */ [data-theme="light"].svx [data-seg="sovereign"] .sv-fc, [data-theme="light"].svx [data-seg="sovereign"] .sv-fc:nth-child(n){ border-color:color-mix(in oklab,var(--c) 24%, rgba(9,4,84,.16)) !important; } [data-theme="light"].svx [data-seg="sovereign"] .sv-fc-in b{ color:#0c1738 !important; } [data-theme="light"].svx [data-seg="sovereign"] .sv-fc::before{ color:color-mix(in oklab,var(--c) 15%, transparent) !important; -webkit-text-stroke:2px color-mix(in oklab,var(--c) 52%, #0c1738) !important; text-stroke:2px color-mix(in oklab,var(--c) 52%, #0c1738) !important; opacity:.5 !important; } [data-theme="light"].svx [data-seg="sovereign"] .sv-fc-ic::before{ opacity:.38 !important; } [data-theme="light"].svx [data-seg="sovereign"] .sv-fc-ic svg{ filter:drop-shadow(0 0 4px color-mix(in oklab,var(--c) 42%,transparent)) brightness(.92) !important; }