/* Variáveis de cores para o Tema Escuro (Padrão) */
:root {
    --bg: #0a0a0f;
    --bg-2: #12121a;
    --bg-card: #1a1a28;
    --border: rgba(255, 255, 255, 0.08);
    --text: #e8e8f0;
    --text-muted: #888899;
    --grad-primary: linear-gradient(135deg, #6c63ff 0%, #ff6584 50%, #ffa94d 100%);
    --grad-hero: linear-gradient(135deg, #0a0a0f 0%, #1a0a2e 50%, #0a1a1f 100%);
    --header-bg: rgba(10, 10, 15, 0.9);
    --menu-bg: rgba(10, 10, 15, 0.95);
}

/* Override para o Tema Claro */
html.light {
    --bg: #f8fafc;
    --bg-2: #f1f5f9;
    --bg-card: #ffffff;
    --border: rgba(0, 0, 0, 0.1);
    --text: #0f172a;
    --text-muted: #64748b;
    --grad-hero: linear-gradient(135deg, #f8fafc 0%, #e0e7ff 50%, #f1f5f9 100%);
    --header-bg: rgba(248, 250, 252, 0.9);
    --menu-bg: rgba(248, 250, 252, 0.95);
}

.border-custom {
    border-color: var(--border);
}

.text-gradient {
    background: var(--grad-primary);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.header-backdrop {
    background-color: var(--header-bg);
}

.menu-backdrop {
    background-color: var(--menu-bg);
}

/*Estrutura Correção Gemini*/
/* Variáveis de cores para o Tema Escuro (Padrão) */
:root {
    --bg: #0a0a0f;
    --bg-2: #12121a;
    --bg-card: #1a1a28;
    --border: rgba(255, 255, 255, 0.08);
    --text: #e8e8f0;
    --text-muted: #888899;
    --grad-primary: linear-gradient(135deg, #6c63ff 0%, #ff6584 50%, #ffa94d 100%);
    --grad-hero: linear-gradient(135deg, #0a0a0f 0%, #1a0a2e 50%, #0a1a1f 100%);
    --header-bg: rgba(10, 10, 15, 0.9);
    --menu-bg: rgba(10, 10, 15, 0.95);
}

/* Override para o Tema Claro */
html.light {
    --bg: #f8fafc;
    --bg-2: #f1f5f9;
    --bg-card: #ffffff;
    --border: rgba(0, 0, 0, 0.1);
    --text: #0f172a;
    --text-muted: #64748b;
    --grad-hero: linear-gradient(135deg, #f8fafc 0%, #e0e7ff 50%, #f1f5f9 100%);
    --header-bg: rgba(248, 250, 252, 0.9);
    --menu-bg: rgba(248, 250, 252, 0.95);
}

.border-custom {
    border-color: var(--border);
}

.text-gradient {
    background: var(--grad-primary);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.header-backdrop {
    background-color: var(--header-bg);
}

.menu-backdrop {
    background-color: var(--menu-bg);
}