﻿:root {
    --cor-fundo: #041017;
    --cor-fundo-secundario: #0a1821;
    --cor-superficie: rgba(13, 28, 36, 0.72);
    --cor-superficie-forte: rgba(17, 38, 48, 0.92);
    --cor-superficie-hover: rgba(22, 45, 56, 0.96);
    --cor-borda: rgba(107, 255, 176, 0.13);
    --cor-borda-forte: rgba(122, 255, 186, 0.22);
    --cor-primaria: #1fd16b;
    --cor-primaria-hover: #18b85d;
    --cor-primaria-clara: #7df0ad;
    --cor-secundaria: #15b8a6;
    --cor-secundaria-hover: #119786;
    --cor-destaque: #39c4ff;
    --cor-texto: #f3fbf8;
    --cor-texto-suave: #b5c7c2;
    --cor-texto-fraco: #78908c;
    --cor-texto-escuro: #041017;
    --cor-erro: #ef4444;
    --cor-aviso: #f59e0b;
    --cor-sucesso: #22c55e;
    --gradiente-principal: linear-gradient(135deg, #1fd16b 0%, #15b8a6 55%, #39c4ff 100%);
    --gradiente-fundo: radial-gradient(circle at top left, rgba(31, 209, 107, 0.16), transparent 35%), radial-gradient(circle at bottom right, rgba(21, 184, 166, 0.16), transparent 32%), linear-gradient(135deg, #041017 0%, #091820 48%, #07131b 100%);
    --fonte-principal: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    --raio-pequeno: 10px;
    --raio-medio: 16px;
    --raio-grande: 24px;
    --raio-xl: 32px;
    --sombra-suave: 0 10px 30px rgba(0, 0, 0, 0.18);
    --sombra-media: 0 18px 50px rgba(0, 0, 0, 0.28);
    --sombra-forte: 0 30px 80px rgba(0, 0, 0, 0.38);
    --sombra-glow: 0 0 40px rgba(31, 209, 107, 0.12);
    --borda-glass: 1px solid rgba(255, 255, 255, 0.06);
    --transicao-padrao: 0.25s ease;
    --transicao-lenta: 0.4s ease;
    --largura-maxima: 1440px;
    --altura-header: 78px;
    --altura-footer: 70px;
}

/* RESET */
*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

html,
body {
    min-height: 100%;
}

body {
    background: var(--gradiente-fundo);
    color: var(--cor-texto);
    font-family: var(--fonte-principal);
    line-height: 1.5;
    overflow-x: hidden;
    position: relative;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

    /* FUNDOS DECORATIVOS */
    body::before,
    body::after {
        content: "";
        position: fixed;
        border-radius: 999px;
        filter: blur(70px);
        z-index: 0;
        pointer-events: none;
    }

    body::before {
        width: 320px;
        height: 320px;
        background: rgba(31, 209, 107, 0.14);
        top: -90px;
        left: -90px;
    }

    body::after {
        width: 380px;
        height: 380px;
        background: rgba(21, 184, 166, 0.10);
        right: -130px;
        bottom: -120px;
    }

.bg-grid {
    position: fixed;
    inset: 0;
    background-image: linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);
    background-size: 44px 44px;
    mask-image: radial-gradient(circle at center, black 25%, transparent 85%);
    -webkit-mask-image: radial-gradient(circle at center, black 25%, transparent 85%);
    z-index: 0;
    pointer-events: none;
}

/* ESTRUTURA BASE */
main,
header,
footer,
section,
.container,
.layout,
.app-shell {
    position: relative;
    z-index: 1;
}

.container {
    width: min(100% - 32px, var(--largura-maxima));
    margin: 0 auto;
}

/* TIPOGRAFIA */
h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--cor-texto);
    font-weight: 700;
    line-height: 1.15;
}

h1 {
    font-size: clamp(2rem, 5vw, 3.6rem);
}

h2 {
    font-size: clamp(1.6rem, 4vw, 2.7rem);
}

h3 {
    font-size: clamp(1.25rem, 3vw, 1.8rem);
}

p {
    color: var(--cor-texto-suave);
}

small {
    color: var(--cor-texto-fraco);
}

/* LINKS */
a {
    color: var(--cor-secundaria);
    text-decoration: none;
    transition: var(--transicao-padrao);
}

    a:hover {
        color: var(--cor-destaque);
    }

/* IMAGENS E MÍDIA */
img,
svg,
video,
canvas {
    display: block;
    max-width: 100%;
}

/* FORMULÁRIOS */
button,
input,
select,
textarea {
    font: inherit;
}

button {
    cursor: pointer;
    border: none;
    background: none;
    transition: var(--transicao-padrao);
}

input,
select,
textarea {
    width: 100%;
    border: 1px solid var(--cor-borda);
    background: rgba(255, 255, 255, 0.03);
    color: var(--cor-texto);
    border-radius: var(--raio-medio);
    padding: 14px 16px;
    outline: none;
    transition: var(--transicao-padrao);
    appearance: none;
}

    input::placeholder,
    textarea::placeholder {
        color: var(--cor-texto-fraco);
    }

    input:focus,
    select:focus,
    textarea:focus {
        border-color: var(--cor-primaria);
        box-shadow: 0 0 0 4px rgba(31, 209, 107, 0.11);
        background: rgba(255, 255, 255, 0.05);
    }

textarea {
    min-height: 120px;
    resize: vertical;
}

label {
    display: inline-block;
    margin-bottom: 8px;
    color: var(--cor-texto);
    font-weight: 600;
}

/* BOTÕES */
.btn-primario,
.btn-neutro,
.btn-perigo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 52px;
    padding: 14px 22px;
    border-radius: var(--raio-medio);
    font-weight: 700;
    transition: var(--transicao-padrao);
}

.btn-primario {
    background: var(--gradiente-principal);
    color: #ffffff;
    box-shadow: var(--sombra-glow);
}

    .btn-primario:hover {
        transform: translateY(-2px);
        filter: brightness(1.05);
    }

.btn-neutro {
    background: rgba(255, 255, 255, 0.04);
    color: var(--cor-texto);
    border: 1px solid var(--cor-borda);
}

    .btn-neutro:hover {
        background: rgba(255, 255, 255, 0.08);
        border-color: var(--cor-borda-forte);
    }

.btn-perigo {
    background: rgba(239, 68, 68, 0.12);
    color: #ffffff;
    border: 1px solid rgba(239, 68, 68, 0.28);
}

    .btn-perigo:hover {
        background: rgba(239, 68, 68, 0.18);
    }

.btn-grande {
    min-width: 190px;
}

.btn-full {
    width: 100%;
}

/* CARDS */
.card-glass {
    background: var(--cor-superficie);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: var(--borda-glass);
    border-radius: var(--raio-grande);
    box-shadow: var(--sombra-media);
}

.card-glass-forte {
    background: var(--cor-superficie-forte);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border: var(--borda-glass);
    border-radius: var(--raio-grande);
    box-shadow: var(--sombra-forte);
}

/* LISTAS */
ul,
ol {
    list-style: none;
}

/* TABELAS */
table {
    width: 100%;
    border-collapse: collapse;
}

th,
td {
    text-align: left;
    padding: 14px 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

th {
    color: var(--cor-texto);
    font-weight: 700;
}

td {
    color: var(--cor-texto-suave);
}

/* UTILITÁRIOS */
.texto-suave {
    color: var(--cor-texto-suave);
}

.texto-fraco {
    color: var(--cor-texto-fraco);
}

.texto-destaque {
    color: var(--cor-destaque);
}

.texto-sucesso {
    color: var(--cor-sucesso);
}

.texto-erro {
    color: var(--cor-erro);
}

.gradiente-texto {
    background: var(--gradiente-principal);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.oculto {
    display: none !important;
}

.centralizar {
    display: flex;
    align-items: center;
    justify-content: center;
}

.w-100 {
    width: 100%;
}

.h-100 {
    height: 100%;
}

/* SCROLLBAR */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.03);
}

::-webkit-scrollbar-thumb {
    background: rgba(31, 209, 107, 0.28);
    border-radius: 999px;
}

    ::-webkit-scrollbar-thumb:hover {
        background: rgba(31, 209, 107, 0.45);
    }

/* SELEÇÃO */
::selection {
    background: rgba(31, 209, 107, 0.24);
    color: #ffffff;
}

/* ESTADOS */
.erro-validacao {
    color: var(--cor-erro);
    font-size: 0.92rem;
    margin-top: 6px;
}

.campo-invalido {
    border-color: rgba(239, 68, 68, 0.45) !important;
    box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.10) !important;
}

.campo-sucesso {
    border-color: rgba(34, 197, 94, 0.45) !important;
    box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.10) !important;
}

/* RESPONSIVO */
@media (max-width: 992px) {
    .container {
        width: min(100% - 24px, var(--largura-maxima));
    }

    .btn-grande {
        min-width: unset;
        width: 100%;
    }
}

@media (max-width: 768px) {
    input,
    select,
    textarea,
    .btn-primario,
    .btn-neutro,
    .btn-perigo {
        min-height: 50px;
        padding: 13px 15px;
    }

    .card-glass,
    .card-glass-forte {
        border-radius: 20px;
    }
}
