/* RAJ DARK PRO — Default Theme
   Accent: Red #FF0000 | Yellow #FFD700 | Green #00FF88
   BG: #0A0A0A | Card: #111111
-------------------------------------------------- */
:root {
    --bg-primary: #0A0A0A;
    --bg-secondary: #111111;
    --bg-card: #141414;
    --bg-hover: #1a1a1a;
    --accent-red: #FF0000;
    --accent-red-d: #cc0000;
    --accent-yellow: #FFD700;
    --accent-green: #00FF88;
    --accent-error: #FF4444;
    --text-primary: #FFFFFF;
    --text-secondary: #AAAAAA;
    --text-muted: #666666;
    --border: #222222;
    --radius: 8px;
    --radius-lg: 14px;
    --transition: 0.3s ease;
    --shadow-red: 0 0 20px rgba(255, 0, 0, 0.35);
    --shadow-card: 0 4px 24px rgba(0, 0, 0, 0.6);
    --theme-name: "raj_dark_pro";
}

/* Particle canvas layer */
body {
    position: relative;
}

#theme-canvas {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
    opacity: 0.35;
}

.site-header,
.admin-sidebar {
    z-index: 1000 !important;
}

/* Hero glow */
.hero::before {
    background: radial-gradient(ellipse 700px 500px at 70% 50%, rgba(255, 0, 0, 0.10) 0%, transparent 70%),
        radial-gradient(ellipse 400px 300px at 20% 80%, rgba(255, 0, 0, 0.06) 0%, transparent 60%);
}

/* Glow buttons */
.btn-primary:hover {
    background: var(--accent-yellow);
    color: #000;
    box-shadow: 0 0 28px rgba(255, 215, 0, 0.6);
}

/* Hero badge pulse */
@keyframes raj-pulse {

    0%,
    100% {
        box-shadow: 0 0 8px rgba(255, 0, 0, 0.25);
    }

    50% {
        box-shadow: 0 0 22px rgba(255, 0, 0, 0.55);
    }
}

.hero-badge {
    animation: raj-pulse 3s ease-in-out infinite;
}

/* Card border glow on hover */
.code-card:hover {
    box-shadow: 0 0 30px rgba(255, 0, 0, 0.18);
}