/* General body styling - Dark and sleek */
body {
    background-color: #000000; /* Solid black background to make everything stand out */
    color: #FFFFFF; /* White text for high contrast */
    font-family: 'Verdana', sans-serif; /* A clean, classic font with a 90s vibe */
    overflow-x: hidden; /* To prevent horizontal scroll from animations */
}

/* Floating elements - Oval and quirky shapes with a gold and gray palette */
.fg__admin .item-preview, 
ul.items {
    background: none; /* No background, just floating elements */
    border-radius: 50px; /* Oval shape for a quirky, retro feel */
    box-shadow: none; /* No shadow, purely floating */
}

/* Interactive buttons - Popping with color */
@keyframes flashEffect {
    0%, 100% { box-shadow: 0 0 10px rgba(255, 255, 255, 0.8); }
    50% { box-shadow: 0 0 20px rgba(255, 255, 255, 1); }
}

.fg__admin .item-preview button.item, 
ul.items button.item {
    background-color: #FFD700; /* Start with Gold */
    color: #000000; /* Black text for readability */
    border-radius: 30px; /* Rounded button style */
    padding: 15px 30px;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.3s ease;
    box-shadow: 0 8px 15px rgba(255, 255, 255, 0.3); /* Subtle white glow */
}

.fg__admin .item-preview button.item:hover, 
ul.items button.item:hover {
    transform: scale(1.1); /* Subtle scale-up on hover */
    box-shadow: 0 10px 25px rgba(255, 215, 0, 0.8); /* Bright gold glow */
    background-color: #FFD700; /* Keeps gold on hover */
    color: #000; /* Ensures readability */
}

/* Interactive text - Flashy but readable */
#gbc-cic-text {
    font-size: 2.5em;
    color: #FFD700; /* Gold */
    animation: flashEffect 1s infinite ease-in-out; /* Gentle flashing text */
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.8); /* Soft white neon glow */
    z-index: 1000;
}

/* Floating boxes with subtle dynamic shapes */
@keyframes shapeShift {
    0%, 100% { border-radius: 40px; background-color: #808080; }
    50% { border-radius: 15px; background-color: #FFD700; }
}

.fg__admin .item-preview .floating-box, 
ul.items .floating-box {
    width: 200px;
    height: 200px;
    margin: 20px auto;
    animation: shapeShift 7s infinite ease-in-out; /* Slow shape-shifting animation */
    box-shadow: 0 0 15px rgba(255, 255, 255, 0.5); /* Subtle white glow */
}

/* Soft glow effect for additional elements */
.fg__admin .item-preview button.item .top .group-wrapper .group::before, 
ul.items button.item .top .group-wrapper .group::before {
    content: '';
    position: absolute;
    top: -5px;
    left: -5px;
    right: -5px;
    bottom: -5px;
    border-radius: 50px;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.5); /* Softer glow */
    z-index: -1;
}