/* ============================================
   SUNSHINE THEME
   ============================================ */

body[data-theme="sunshine"] {
    --primary-color: #ffd400;
    --secondary-color: #ffea00;
    --accent-color: #14b8ff;
    --text-dark: #24240b;
    --text-light: #4a4a16;
    --text-muted: #68682a;
    --light-bg: #fff46b;
    --white: #fffde8;
    --border-color: #ffe100;
}

body[data-theme="sunshine"] .navbar {
    background-color: rgba(255, 253, 232, 0.9);
    border-bottom-color: rgba(255, 225, 0, 0.58);
    box-shadow: 0 2px 20px rgba(255, 212, 0, 0.2);
}

body[data-theme="sunshine"] .hero {
    background:
        radial-gradient(circle at 22% 18%, rgba(255, 234, 0, 0.74), transparent 32%),
        radial-gradient(circle at 78% 30%, rgba(20, 184, 255, 0.16), transparent 28%),
        radial-gradient(circle at 52% 84%, rgba(255, 212, 0, 0.24), transparent 34%),
        linear-gradient(135deg, rgba(255, 253, 232, 0.82), rgba(255, 246, 107, 0.64));
}

body[data-theme="sunshine"] .hero-content h1 {
    background: linear-gradient(135deg, #ffb800, #fff200 48%, #14b8ff);
    -webkit-background-clip: text;
    background-clip: text;
}

body[data-theme="sunshine"] .who-its-for,
body[data-theme="sunshine"] .about-sean,
body[data-theme="sunshine"] .contact {
    background:
        radial-gradient(circle at 12% 18%, rgba(255, 234, 0, 0.34), transparent 30%),
        radial-gradient(circle at 86% 78%, rgba(20, 184, 255, 0.12), transparent 32%),
        linear-gradient(135deg, rgba(255, 253, 232, 0.9), rgba(255, 246, 107, 0.62));
}

body[data-theme="sunshine"] .how-sessions-work,
body[data-theme="sunshine"] .faq {
    background:
        radial-gradient(circle at 88% 18%, rgba(255, 234, 0, 0.32), transparent 30%),
        radial-gradient(circle at 16% 82%, rgba(20, 184, 255, 0.13), transparent 34%),
        linear-gradient(135deg, rgba(255, 253, 232, 0.86), rgba(255, 246, 107, 0.5));
}

body[data-theme="sunshine"] .card,
body[data-theme="sunshine"] .faq-item,
body[data-theme="sunshine"] .contact-form {
    background-color: rgba(255, 253, 232, 0.9);
    border-color: rgba(255, 225, 0, 0.58);
    box-shadow: 0 12px 32px rgba(255, 212, 0, 0.12);
}

body[data-theme="sunshine"] .contact-form {
    background: transparent;
    box-shadow: none;
}

body[data-theme="sunshine"] .card:hover,
body[data-theme="sunshine"] .faq-item.active {
    box-shadow:
        0 16px 38px rgba(255, 212, 0, 0.16),
        0 0 34px rgba(255, 242, 0, 0.3);
}

body[data-theme="sunshine"] .avatar-placeholder {
    background:
        radial-gradient(circle at 50% 18%, rgba(255, 255, 255, 0.95), transparent 0 14%),
        radial-gradient(circle at 50% 42%, rgba(255, 232, 129, 0.84), transparent 0 38%),
        repeating-conic-gradient(from 8deg, rgba(255, 244, 179, 0.52) 0 8deg, rgba(245, 158, 11, 0.22) 8deg 14deg, rgba(56, 189, 248, 0.12) 14deg 18deg),
        radial-gradient(circle, rgba(255, 254, 244, 0.88), rgba(245, 158, 11, 0.2));
}

body[data-theme="sunshine"] .theme-backdrop {
    opacity: 1;
}

body[data-theme="sunshine"] .theme-layer-atmosphere {
    inset: -10%;
    background:
        radial-gradient(circle at 28% 20%, rgba(255, 242, 0, 0.76), transparent 0 22%),
        radial-gradient(circle at 76% 26%, rgba(20, 184, 255, 0.14), transparent 0 20%),
        radial-gradient(circle at 48% 76%, rgba(255, 212, 0, 0.26), transparent 0 36%),
        repeating-radial-gradient(circle at 28% 20%, transparent 0 7vw, rgba(255, 212, 0, 0.15) 7.1vw 7.22vw, transparent 7.38vw 12vw),
        linear-gradient(135deg, rgba(255, 253, 232, 0.84), rgba(255, 246, 107, 0.72), rgba(255, 234, 0, 0.34));
    filter: saturate(1.18);
    animation: sunshineWarmth 22s ease-in-out infinite;
}

body[data-theme="sunshine"] .theme-layer-atmosphere::before,
body[data-theme="sunshine"] .theme-layer-atmosphere::after {
    content: "";
    position: absolute;
    inset: -5%;
    background:
        linear-gradient(102deg, transparent 0 11%, rgba(255, 255, 255, 0.3) 12%, transparent 13% 36%, rgba(255, 242, 0, 0.2) 37%, transparent 38% 100%),
        repeating-conic-gradient(from 12deg at 28% 20%, transparent 0 12deg, rgba(255, 212, 0, 0.14) 12.4deg 13.2deg, transparent 14deg 31deg);
    mix-blend-mode: screen;
    opacity: 0.72;
    animation: sunshineRays 18s ease-in-out infinite;
}

body[data-theme="sunshine"] .theme-layer-atmosphere::after {
    background:
        radial-gradient(circle at 20% 24%, rgba(255, 255, 255, 0.78), transparent 0 0.22rem),
        radial-gradient(circle at 68% 18%, rgba(255, 242, 0, 0.76), transparent 0 0.2rem),
        radial-gradient(circle at 84% 58%, rgba(20, 184, 255, 0.5), transparent 0 0.2rem),
        radial-gradient(circle at 30% 76%, rgba(255, 255, 255, 0.68), transparent 0 0.18rem);
    filter: drop-shadow(0 0 10px rgba(255, 242, 0, 0.48));
    animation: sunshineSparkle 7s ease-in-out infinite;
}

body[data-theme="sunshine"] .theme-layer-bottom {
    left: -8vw;
    right: -8vw;
    bottom: -12vh;
    height: min(42vh, 410px);
    border-radius: 48% 52% 0 0 / 36% 42% 0 0;
    background:
        radial-gradient(ellipse at 50% 0%, rgba(20, 184, 255, 0.13), transparent 0 34%),
        linear-gradient(to top, rgba(255, 234, 0, 0.42), rgba(255, 253, 232, 0.16), transparent);
    filter: blur(1px);
}

body[data-theme="sunshine"] .theme-layer-edge {
    top: 16vh;
    width: min(20vw, 230px);
    height: min(50vh, 450px);
    border-radius: 50%;
    background:
        radial-gradient(circle at 42% 38%, rgba(255, 255, 255, 0.7), transparent 0 18%),
        radial-gradient(circle at 50% 50%, rgba(255, 242, 0, 0.58), rgba(255, 212, 0, 0.22) 62%, transparent 72%);
    box-shadow:
        0 0 60px rgba(255, 242, 0, 0.32),
        inset -16px -18px 28px rgba(255, 212, 0, 0.14);
    opacity: 0.55;
    animation: sunshineOrb 9s ease-in-out infinite;
}

body[data-theme="sunshine"] .theme-layer-edge-left {
    left: max(-180px, -12vw);
}

body[data-theme="sunshine"] .theme-layer-edge-right {
    right: max(-180px, -12vw);
    animation-delay: -3s;
}

body[data-theme="sunshine"] .theme-eye,
body[data-theme="sunshine"] .theme-reach {
    display: none;
}

body[data-theme="sunshine"] .third-eye {
    top: 15vh;
    left: 28%;
    width: clamp(80px, 12vw, 160px);
    height: clamp(80px, 12vw, 160px);
    transform: translateX(-50%);
    border-radius: 50%;
    background:
        radial-gradient(circle at 42% 36%, rgba(255, 255, 255, 0.76), transparent 0 16%),
        radial-gradient(circle, rgba(255, 242, 0, 0.94), rgba(255, 212, 0, 0.5) 62%, transparent 68%);
    box-shadow:
        0 0 54px rgba(255, 242, 0, 0.42),
        0 0 110px rgba(255, 212, 0, 0.22);
    opacity: 0.5;
    animation: sunshineOrb 8s ease-in-out infinite;
}

@keyframes sunshineWarmth {
    0%, 100% { transform: scale(1); filter: saturate(1.04) brightness(1); }
    50% { transform: scale(1.03); filter: saturate(1.14) brightness(1.03); }
}

@keyframes sunshineRays {
    0%, 100% { opacity: 0.5; transform: rotate(-1deg); }
    50% { opacity: 0.8; transform: rotate(1deg); }
}

@keyframes sunshineSparkle {
    0%, 100% { opacity: 0.36; transform: translateY(0); }
    50% { opacity: 0.8; transform: translateY(-0.35rem); }
}

@keyframes sunshineOrb {
    0%, 100% { transform: translateY(0) scale(1); }
    50% { transform: translateY(-1.1rem) scale(1.04); }
}

@media (max-width: 768px) {
    body[data-theme="sunshine"] .theme-layer-edge {
        width: min(34vw, 160px);
        height: min(34vw, 160px);
    }

    body[data-theme="sunshine"] .third-eye {
        top: 12vh;
        left: 24%;
    }
}