/* --- GLOBAL VARIABLES --- */
:root {
    /* Colors */
    --bg-dark: #000000;
    --bg-card: #1a1a1a;
    --bg-card-footer: #252525;
    --text-main: #ffffff;
    --text-muted: #cccccc;
    --text-muted-darker: #999999;

    --accent-purple: #62109F;
    --accent-purple-hover: #4e0d7e;
    --accent-gold: #FFD700;

    /* Borders & Inputs */
    --border-color: #333333;
    --input-bg: #0d0d0d;
    --input-border: #e0e0e0;

    /* Fonts */
    --font-main: 'Poppins', sans-serif;
}

/* --- GLOBAL RESET --- */
* {
    font-family: var(--font-main);
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* --- BODY & BACKGROUND --- */
body {
    background: linear-gradient(135deg, var(--bg-dark) 0%, var(--bg-card) 50%, var(--bg-dark) 100%);
    min-height: 100vh;
    color: var(--text-main);
    overflow-x: hidden;
    position: relative;
}

/* Background Pattern Overlay */
body::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: radial-gradient(circle at 10% 20%, rgba(255, 255, 255, 0.03) 0%, transparent 20%),
        radial-gradient(circle at 90% 80%, rgba(255, 255, 255, 0.03) 0%, transparent 20%);
    pointer-events: none;
    z-index: -1;
}

/* --- COMMON UTILITIES --- */

/* Scrollbar Hiding */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}

.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Buttons */
.btn-gold {
    background-color: var(--accent-gold);
    color: black;
    border: none;
    cursor: pointer;
    transition: all 0.2s;
    font-weight: 600;
}

.btn-gold:hover {
    background-color: var(--accent-gold-hover);
    transform: scale(1.02);
}

.btn-black {
    background-color: var(--bg-dark);
    color: var(--text-main);
    border: 1px solid var(--border-color);
    transition: background 0.3s;
}

.btn-black:hover {
    background-color: var(--bg-card-footer);
}

/* Links */
a {
    text-decoration: none;
    color: inherit;
}