/* --- Modals & Popups --- */

/* Settings Toggle Switch */
.toggle-switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 20px;
}
.toggle-switch input { opacity: 0; width: 0; height: 0; }
.toggle-slider {
    position: absolute; cursor: pointer; inset: 0;
    background-color: var(--bg-primary); border: 2px solid var(--border); border-radius: 20px;
    transition: .4s;
}
.toggle-slider:before {
    position: absolute; content: ""; height: 12px; width: 12px;
    left: 2px; bottom: 2px; background-color: var(--accent);
    border-radius: 50%; transition: .4s;
}
input:checked + .toggle-slider:before { transform: translateX(20px); background-color: #10b981; }

/* Legacy Toggle Overrides */
[data-theme='legacy'] .toggle-slider { background-color: #000; border-color: #fff; }
[data-theme='legacy'] .toggle-slider:before { background-color: #fff; }
[data-theme='legacy'] input:checked + .toggle-slider:before { background-color: #fff; transform: translateX(20px); }
[data-theme='legacy'] input:checked + .toggle-slider { background-color: #333; }

/* Modal Image Monochrome (Legacy) */
[data-theme='legacy'] #modal-banner {
    filter: grayscale(1) contrast(1.2) brightness(0.9) !important;
}

/* Modal Icons (Legacy) */
[data-theme='legacy'] svg { filter: grayscale(1) brightness(2) !important; }

/* --- Review Modal Stamp Button Theming --- */

/* Future: Holographic Buttons */
[data-theme='future'] .stamp-btn div { border-width: 1px; border-radius: 12px; font-family: 'Inter', sans-serif; font-style: italic; }

/* Brick: Pixel Buttons */
[data-theme='brick'] .stamp-btn div { 
    border: 3px double var(--accent); 
    border-radius: 0; 
    background: var(--bg-primary); 
    color: var(--accent);
}
[data-theme='brick'] .stamp-btn span { color: var(--accent) !important; }

/* Cube: Round Sticker Buttons */
[data-theme='cube'] .stamp-btn div { 
    border: 4px solid #ffffff; 
    border-radius: 9999px; 
    color: #ffffff; 
    font-family: 'Arial Black', sans-serif;
}
[data-theme='cube'] .stamp-btn:nth-child(1) div { background: #10b981; }
[data-theme='cube'] .stamp-btn:nth-child(2) div { background: #3b82f6; }
[data-theme='cube'] .stamp-btn:nth-child(3) div { background: #f59e0b; }

/* OS: Classic UI Buttons */
[data-theme='os'] .stamp-btn div { 
    border: 2px solid; 
    border-color: #ffffff #808080 #808080 #ffffff; 
    background: #c0c0c0; 
    border-radius: 0; 
    color: #000;
}
[data-theme='os'] .stamp-btn:hover div { border-color: #808080 #ffffff #ffffff #808080; }

/* Legacy: Monochrome Buttons */
[data-theme='legacy'] .stamp-btn div { 
    border: 1px solid #ffffff; 
    border-radius: 0; 
    background: #000; 
    color: #fff;
    font-family: 'Courier New', monospace;
}
[data-theme='legacy'] .stamp-btn span { color: #fff !important; }

/* --- Radio Tuning Buttons Theming --- */
#radio-channels button:hover { background-color: var(--bg-secondary); }

[data-theme='future'] #radio-channels button:hover {
    background-color: var(--accent) !important;
}
[data-theme='future'] #radio-channels button:hover svg {
    color: #fff !important;
}

[data-theme='brick'] #radio-channels button { border-radius: 0; border: 2px solid var(--accent); background: var(--bg-primary); }
[data-theme='brick'] #radio-channels button:hover { background: var(--accent); }
[data-theme='brick'] #radio-channels button:hover svg { color: var(--bg-primary); }
[data-theme='brick'] #radio-channels button svg { color: var(--accent); }

[data-theme='cube'] #radio-channels button { border-radius: 50%; border: 3px solid #fff; background: #ff4500; box-shadow: 4px 4px 0 #4b0082; }
[data-theme='cube'] #radio-channels button:hover { transform: translate(2px, 2px); box-shadow: 2px 2px 0 #4b0082; }

[data-theme='os'] #radio-channels button { border-radius: 0; border: 2px solid; border-color: #fff #808080 #808080 #fff !important; background: #c0c0c0; }
[data-theme='os'] #radio-channels button:hover { background: #dcdcdc; }
[data-theme='os'] #radio-channels button:active { border-color: #808080 #fff #fff #808080 !important; }
[data-theme='os'] #radio-channels button svg { color: #000; }

[data-theme='legacy'] #radio-channels button { border-radius: 0; border: 1px solid #fff; background: #000; }
[data-theme='legacy'] #radio-channels button:hover { background: #fff !important; }
[data-theme='legacy'] #radio-channels button:hover svg { color: #000 !important; }

/* Custom Scrollbar for Card Descriptions */
.custom-scrollbar::-webkit-scrollbar { width: 4px; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 2px; }
