body {
    background-color: #000000;
    color: white;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    -webkit-tap-highlight-color: transparent;
    overflow: hidden;
    height: 100vh;
    width: 100vw;
}

.glass {
    background: rgba(18, 18, 18, 0.85);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-top: 1px solid rgba(255,255,255,0.08);
}

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

#full-player {
    transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
    transform: translateY(100%);
    z-index: 50;
}

#full-player.open {
    transform: translateY(0);
}

/* * FIXED: Removed position: absolute and opacity: 0.
 * Let the parent #immersive-overlay handle the fade-in via Tailwind!
 */
.immersive-text {
    transition: all 0.8s ease-out;
    z-index: 10;
    position: relative;
}

#ambient-bg {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: 0;
    transition: opacity 1s;
}

.orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(90px);
    opacity: 0.6;
    animation: float 10s infinite ease-in-out;
}

@keyframes float {
    0%,100%{transform:translate(0,0)}
    50%{transform:translate(20px, 40px)}
}

#nav { z-index: 10; }
#profile { z-index: 500; }

@keyframes pulse-slow {
    0%, 100% { transform: scale(1) translate(0, 0); opacity: 0.2; }
    50% { transform: scale(1.2) translate(10%, 5%); opacity: 0.4; }
}

.animate-pulse-slow {
    animation: pulse-slow 12s infinite ease-in-out;
}

/* Hide standard scrollbars and UI when immersive */
.immersive-mode-active .fp-header,
.immersive-mode-active .fp-volume {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.5s ease;
}

/* Cinematic Lyrics adjustment */
.cinematic-lyrics {
    background: transparent !important;
    font-size: 1.5rem !important;
    text-align: center !important;
    mask-image: linear-gradient(to bottom, transparent, black 20%, black 80%, transparent);
}

/* ==========================================================================
   SDAcansing Library & Creator Studio Fixes
   ========================================================================== */

/* 1. Fix the white-on-white Dropdown (<select>) issue */
#lib-content select {
    appearance: none; /* Removes default browser styling */
    background-color: rgba(255, 255, 255, 0.03);
}

/* Force the dropdown options to have a dark background so white text is visible */
#lib-content select option {
    background-color: #1a1a1a; /* Dark background for the dropdown list */
    color: #ffffff;
}

/* 2. Better contrast for all Form Inputs */
#lib-content input,
#lib-content textarea,
#lib-content select {
    background-color: rgba(255, 255, 255, 0.03) !important;
    color: #f3f4f6 !important; /* Slightly off-white for better readability */
}

/* High-contrast focus states so users know where they are typing */
#lib-content input:focus,
#lib-content textarea:focus,
#lib-content select:focus {
    background-color: rgba(255, 255, 255, 0.08) !important;
    /* Uses your primary color if it's a CSS variable, otherwise falls back to a solid border */
    border-color: var(--tw-color-primary, #4ade80) !important;
    outline: none;
}

/* 3. Tone down the active Sub-Tabs (Artist & Admin Dashboards) */
button.artist-sub-tab.bg-white\\/10,
button.admin-sub-tab.bg-white\\/10 {
    background-color: rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Ensure inactive tabs stay subdued */
button.artist-sub-tab:not(.bg-white\\/10),
button.admin-sub-tab:not(.bg-white\\/10) {
    color: #9ca3af !important; /* text-gray-400 */
}



#edit-cover-overlay button {
    background: white;
    color: black;
    padding: 10px 24px;
    font-weight: bold;
    font-size: 10px;
    letter-spacing: 2px;
    text-transform: uppercase;
    border: none;
    border-radius: 6px;
    cursor: pointer;

}


/* Full Bar State (Default) */
#mini-player {
    width: calc(100% - 24px); /* Full width minus margins */
}

/* FAB / Collapsed State */
#mini-player.collapsed {
    width: 64px; /* Width of a circle */
    border-radius: 9999px; /* Perfect circle */
    left: auto; /* Push to the right */
}

#mini-player.collapsed #mini-content,
#mini-player.collapsed #mini-collapse-btn {
    display: none; /* Hide song info and collapse icon */
}

#mini-player.collapsed #expand-arrow {
    display: flex; /* Show the expand trigger */
    z-index: 10;
}

#mini-player.collapsed #mini-play-btn {
    z-index: 20; /* Keep play button clickable over the arrow */
}
@keyframes slide-up {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}
.animate-slide-up {
    animation: slide-up 0.3s ease-out forwards;
}

#hero-song-title{font-size:6px;}

#edit-cover-overlay{margin-top:0px;z-index:99999;margin-left:250px}
#home-moods {
    transform: scale(0.75);
    margin-left:-60px;
}

/* If the modal is present in the DOM, hide the tab bar */
.request-modal-container ~ .admin-tab-bar {
    display: none !important;
}

/* If the container has a visible modal, hide the tab bar */
.admin-container:has(.request-modal-container.visible) .admin-tab-bar {
    display: none;
}


#sa-menu-container{transform:translateX(2px)}
#stats{transform:translateY(13px);}
#playlister{;z-index:99999;}