﻿@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:wght@400;600&display=swap');
body.theme-cosmic-2 {
    animation: none;
    --bg-gradient: linear-gradient(180deg, #00050f 0%, #020d1e 100%);
    --text-color: #d8eeff;
    --link-bg: rgba(5, 30, 70, 0.65);
    --link-hover: rgba(10, 50, 110, 0.85);
    --card-bg: transparent;
    --card-border: transparent;
    --shadow: 0 20px 60px rgba(0, 0, 0, 0.9);
}

body.theme-cosmic-2 .profile-container {
    background-image: url('/images/cosmic-2.webp');
    background-size: cover;
    background-position: center top;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: none;
    box-shadow: 0 20px 80px rgba(0, 0, 0, 0.8);
}

@keyframes cosmic-2-pulse {
    0%, 100% { box-shadow: 0 0 7px 1px rgba(30, 100, 255, 0.18); border-color: rgba(40, 120, 255, 0.2); }
    50%       { box-shadow: 0 0 14px 2px rgba(60, 140, 255, 0.32); border-color: rgba(70, 160, 255, 0.35); }
}

body.theme-cosmic-2 .link-card {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(40, 120, 255, 0.2);
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.7);
    transition: border-color 0.25s, box-shadow 0.3s, transform 0.2s;
    animation: cosmic-2-pulse 3s ease-in-out infinite;
}

/* Cosmic blurry nebula that sweeps across on hover */
body.theme-cosmic-2 .link-card::before {
    content: '';
    position: absolute;
    top: -20%;
    left: -115%;
    width: 115%;
    height: 140%;
    background: linear-gradient(
        100deg,
        rgba(4, 0, 30, 0.85)   0%,
        rgba(15, 8, 90, 0.65)  30%,
        rgba(40, 25, 170, 0.45) 60%,
        rgba(80, 50, 220, 0.2) 85%,
        transparent             100%
    );
    transform: skewX(-20deg);
    transition: left 0.5s cubic-bezier(0.19, 1, 0.22, 1);
    z-index: -1;
    pointer-events: none;
}

body.theme-cosmic-2 .link-card:hover,
body.theme-cosmic-2 .link-card:active {
    animation: none;
    transform: translateY(-2px);
    border-color: rgba(60, 160, 255, 0.65);
    box-shadow: 0 0 22px rgba(30, 120, 255, 0.45), 0 0 8px rgba(20, 80, 220, 0.25) inset;
}

body.theme-cosmic-2 .link-card:hover::before,
body.theme-cosmic-2 .link-card:active::before {
    left: 0;
}

body.theme-cosmic-2 .avatar {
    border-color: rgba(60, 180, 255, 0.65);
    box-shadow: 0 0 30px rgba(30, 120, 255, 0.45), 0 0 60px rgba(30, 80, 200, 0.2);
}

body.theme-cosmic-2 .username   { text-shadow: 0 0 8px rgba(60, 160, 255, 0.6), 0 0 18px rgba(30, 100, 220, 0.35), 0 0 2px #000; }
body.theme-cosmic-2 #bio-text   { text-shadow: 0 0 3px #000; }
body.theme-cosmic-2 .fab        { text-shadow: 0 0 3px #000; }

body.theme-cosmic-2 { font-family: 'Titillium Web', sans-serif; }
body.theme-cosmic-2 .link-card { border-radius: 0px 12px 0px 12px; }
