/* 
 * WEXI V3 - CYBER-VOID EDITION
 * Total UI Redesign: High-Contrast, Minimalist Cyberpunk
 */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;600;700&display=swap');

:root {
    --wexi-cyan: #00f5ff;
    --wexi-cyan-dim: rgba(0, 245, 255, 0.4);
    --wexi-cyan-glow: rgba(0, 245, 255, 0.15);
    --wexi-void: #050505;
    --wexi-carbon: #101010;
    --wexi-border: #1a1a1a;
    --wexi-text: #ffffff;
    --wexi-text-dim: #666666;
    --wexi-magenta: #ff00ff; /* Glitch accent */
}

/* Global Reset & Font */
.rc-ui-container, .rc-ui-container *, [class*="rc-ui-"] {
    font-family: 'Space Grotesk', sans-serif !important;
    letter-spacing: -0.2px !important;
}

/* Main Menu Container: SHARP CYBER VOID */
.rc-ui-container {
    background: var(--wexi-void) !important;
    border: 1px solid var(--wexi-border) !important;
    border-radius: 4px !important;
    box-shadow: 0 0 40px rgba(0, 0, 0, 0.8), 
                inset 0 0 100px rgba(0, 245, 255, 0.02) !important;
    overflow: hidden !important;
    padding: 0 !important;
    transition: transform 0.3s cubic-bezier(0.19, 1, 0.22, 1) !important;
}

/* Header: Glowing Cyber Strip */
.rc-ui-header {
    background: linear-gradient(90deg, #0a0a0a 0%, #000 100%) !important;
    border-bottom: 2px solid var(--wexi-cyan) !important;
    height: 52px !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 24px !important;
    box-shadow: 0 4px 15px var(--wexi-cyan-glow) !important;
}

.rc-ui-header-title {
    color: var(--wexi-cyan) !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 15px !important;
    letter-spacing: 3px !important;
    text-shadow: 0 0 10px var(--wexi-cyan-dim) !important;
}

/* Tabs: Minimalist & Aggressive */
.rc-ui-tabs {
    background: #080808 !important;
    border-bottom: 1px solid #1a1a1a !important;
    display: flex !important;
}

.rc-ui-tab {
    color: var(--wexi-text-dim) !important;
    font-weight: 600 !important;
    font-size: 10px !important;
    text-transform: uppercase !important;
    padding: 14px 20px !important;
    letter-spacing: 1px !important;
    border-bottom: 2px solid transparent !important;
    transition: all 0.2s ease !important;
}

.rc-ui-tab:hover {
    color: var(--wexi-cyan) !important;
    background: rgba(0, 245, 255, 0.03) !important;
}

.rc-ui-tab.active, div[style*="border-bottom: 2px solid rgb(255, 0, 255)"] {
    color: var(--wexi-cyan) !important;
    background: rgba(0, 245, 255, 0.05) !important;
    border-bottom: 2px solid var(--wexi-cyan) !important;
}

/* Cheat Items: High Contrast Boxes */
.rc-ui-item {
    background: #0c0c0c !important;
    border: 1px solid #151515 !important;
    margin: 8px 12px !important;
    padding: 14px 18px !important;
    border-radius: 2px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    transition: border 0.2s ease, background 0.2s ease !important;
}

.rc-ui-item:hover {
    border-color: var(--wexi-cyan-dim) !important;
    background: #0f0f0f !important;
}

.rc-ui-label {
    color: var(--wexi-text) !important;
    font-size: 12px !important;
    font-weight: 400 !important;
}

/* Switches: Industrial Cyberpunk */
.rc-ui-switch {
    width: 38px !important;
    height: 14px !important;
    background: #1a1a1a !important;
    border-radius: 0 !important; /* Sharp corners */
    position: relative !important;
    border: 1px solid #222 !important;
}

.rc-ui-switch::after {
    content: '' !important;
    position: absolute !important;
    top: -3px !important;
    left: -2px !important;
    width: 14px !important;
    height: 18px !important;
    background: #333 !important;
    border: 1px solid #444 !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.rc-ui-switch.active, [style*="background-color: rgb(255, 0, 255)"] {
    background: var(--wexi-cyan-glow) !important;
    border-color: var(--wexi-cyan-dim) !important;
}

.rc-ui-switch.active::after, [style*="background-color: rgb(255, 0, 255)"]::after {
    background: var(--wexi-cyan) !important;
    box-shadow: 0 0 15px var(--wexi-cyan-dim) !important;
    transform: translateX(24px) !important;
    border-color: #fff !important;
}

/* Sliders: Neo-Industrial */
.rc-ui-slider {
    -webkit-appearance: none !important;
    background: #1a1a1a !important;
    height: 4px !important;
    border: 1px solid #222 !important;
}

.rc-ui-slider::-webkit-slider-thumb {
    -webkit-appearance: none !important;
    width: 12px !important;
    height: 12px !important;
    background: var(--wexi-cyan) !important;
    border-radius: 0 !important;
    cursor: pointer !important;
    box-shadow: 0 0 10px var(--wexi-cyan-dim) !important;
}

/* Dropdowns/Selects */
.rc-ui-select {
    background: #111 !important;
    border: 1px solid #222 !important;
    color: var(--wexi-cyan) !important;
    font-size: 11px !important;
    padding: 4px 8px !important;
    border-radius: 0 !important;
}

/* Scrollbar: Ghost Blue */
::-webkit-scrollbar {
    width: 4px !important;
}

::-webkit-scrollbar-thumb {
    background: var(--wexi-cyan-dim) !important;
    border-radius: 0 !important;
}

/* Force override all magenta elements to Cyan */
[style*="rgb(255, 0, 255)"], [style*="#ff00ff"] {
    background-color: var(--wexi-cyan) !important;
    color: var(--wexi-cyan) !important;
    border-color: var(--wexi-cyan) !important;
}
