/*
 * Fileify Purple — isolated UI theme
 *
 * The purple theme is scoped to the normal app container.
 * Fullscreen Now Playing (#fullscreen-player-view) is deliberately
 * excluded so its artwork and original black shading remain untouched.
 */

#main-layout-container {
    --fileify-purple: #a855f7;
    --fileify-purple-bright: #c084fc;

    --bg-base: #08050d;
    --bg-surface: #100a18;
    --bg-element: #191025;
    --bg-hover: #261636;

    --text-main: #ffffff;
    --text-sub: #b9adca;
}

/* Main app shell only */
#main-layout-container {
    background: var(--bg-base) !important;
}

#main-layout-container .sidebar,
#main-layout-container .sidebar-box,
#main-layout-container .right-queue-sidebar {
    background: var(--bg-surface) !important;
}

#main-layout-container .main-content {
    background-color: var(--bg-surface) !important;
    background-image: linear-gradient(
        to bottom,
        #24103b 0%,
        rgba(16, 10, 24, 0.78) 300px,
        var(--bg-surface) 500px
    ) !important;
}

/* Navigation */
#main-layout-container .nav-item:hover,
#main-layout-container .nav-item.active {
    color: var(--fileify-purple-bright) !important;
}

#main-layout-container .library-header,
#main-layout-container .playlist-section-header {
    color: var(--text-sub) !important;
}

#main-layout-container .action-btn-icon:hover {
    color: var(--fileify-purple-bright) !important;
}

/* Cards */
#main-layout-container .rec-card {
    background-color: rgba(168, 85, 247, 0.07) !important;
}

#main-layout-container .rec-card:hover {
    background-color: rgba(168, 85, 247, 0.14) !important;
}

#main-layout-container .music-card {
    background-color: var(--bg-element) !important;
}

#main-layout-container .music-card:hover {
    background-color: var(--bg-hover) !important;
}

/* Track lists */
#main-layout-container .track-row:hover {
    background-color: rgba(168, 85, 247, 0.10) !important;
}

#main-layout-container .track-row.playing,
#main-layout-container .track-row.playing .track-sub-text {
    color: var(--fileify-purple-bright) !important;
}

#main-layout-container .row-btn:hover,
#main-layout-container .row-btn.pinned-active {
    color: var(--fileify-purple-bright) !important;
}

/* Search */
#main-layout-container .search-input {
    background-color: #191221 !important;
}

#main-layout-container .search-input:focus {
    box-shadow: 0 0 0 2px var(--fileify-purple) !important;
    background-color: #21182b !important;
}

/* Context menus / dialogs inside the main app */
#main-layout-container .context-menu {
    background-color: #181020 !important;
    border-color: #332341 !important;
}

#main-layout-container .context-menu-item:hover {
    background-color: #2a1938 !important;
}

#main-layout-container .modal-content-card {
    background-color: #140d1c !important;
    border-color: #2e2039 !important;
}

#main-layout-container .modal-divider {
    background-color: #2e2039 !important;
}

#main-layout-container .btn-primary {
    background-color: var(--fileify-purple) !important;
}

#main-layout-container .btn-primary:hover {
    background-color: var(--fileify-purple-bright) !important;
}

/*
 * Bottom player only.
 * This is outside #main-layout-container in Fileify, so it gets
 * its own narrowly scoped purple rules.
 */
.player-bar {
    --fileify-player-purple: #a855f7;
    --fileify-player-purple-bright: #c084fc;
}

.player-bar .control-btn:hover,
.player-bar .volume-icon-btn:hover,
.player-bar .control-btn.active-panel-btn,
.player-bar .control-btn.active-toggle {
    color: var(--fileify-player-purple-bright) !important;
}

.player-bar .control-btn.active-toggle::after {
    background-color: var(--fileify-player-purple-bright) !important;
}

.player-bar .control-btn .repeat-badge {
    background-color: var(--fileify-player-purple) !important;
}

.player-bar #progress-fill,
.player-bar #volume-fill {
    background-color: var(--fileify-player-purple) !important;
}

/*
 * IMPORTANT:
 * Nothing below targets #fullscreen-player-view, .fs-bg-layer,
 * .fs-gradient, or fullscreen artwork. Those elements remain
 * exactly under the app's original Now Playing styling.
 */