/* --- RESET E GERAL --- */
@import url('_base_dashbord.css');
@import url('/assets/css/_variaveis.css');

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Roboto', 'Segoe UI', Tahoma, sans-serif;
}

body {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    /* Fundo Base: Verde profundo */
    background: radial-gradient(circle at 50% 50%,  var(--secondary-blue) 0%, var(--primary-blue) 60%, #000502 100%);
    overflow: hidden;
    position: relative;
}

/* Estado Logado */
body.logged-in {
    background: #f0f2f5;
    display: block;
    overflow: auto;
}
body.logged-in::before,
body.logged-in .background-orbits,
body.logged-in .earth-container {
    display: none;
}

/* --- TEXTURA DE FUNDO (Opcional - mantida do seu código anterior) --- */
body::before {
    content: "";
    position: absolute;
    top: -50%; left: -50%; width: 200%; height: 200%;
    background: radial-gradient(circle at 30% 40%, rgba(4, 170, 109, 0.08) 0%, transparent 40%);
    pointer-events: none;
    z-index: 0;
}

/* --- PLANETA NOVO (EARTH LOADER ADAPTADO) --- */
.earth-container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1; /* Atrás do form */
    pointer-events: none;
    /* Escala para ficar grande atrás do form */
    transform: translate(-50%, -50%) scale(2.5); 
    opacity: 0.3; /* Transparência para não brigar com o texto */
}

.earth-loader {
    width: 12em; /* Aumentei um pouco a base */
    height: 12em;
    /* Removi cores sólidas, deixei transparente com borda branca */
    background-color: transparent; 
    position: relative;
    overflow: hidden;
    border-radius: 50%;
    /* Borda branca fina */
    border: 1px solid rgba(255, 255, 255, 0.6);
    /* Sombra interna para dar volume 3D sutil */
    box-shadow: inset -1em -1em 3em rgba(0, 0, 0, 0.5), inset 0 0 1em rgba(255, 255, 255, 0.1);
}

/* SVGs dos Continentes (Agora Brancos/Traços) */
.earth-loader svg {
    position: absolute;
    width: 11em;
    height: auto;
    fill: none; /* Sem preenchimento */
    stroke: rgba(255, 255, 255, 0.8); /* Contorno branco */
    stroke-width: 0.5px;
    filter: drop-shadow(0 0 2px rgba(255, 255, 255, 0.5)); /* Brilho neon */
}

.earth-loader svg:nth-child(1) {
    bottom: -3em;
    animation: round1 12s infinite linear; /* Mais lento para ser elegante */
}

.earth-loader svg:nth-child(2) {
    top: -4em;
    animation: round1 12s infinite linear;
}

.earth-loader svg:nth-child(3) {
    top: -3.5em;
    animation: round2 15s infinite linear;
}

.earth-loader svg:nth-child(4) {
    bottom: -3.2em;
    animation: round2 15s infinite linear;
}

/* Animações de Rotação (Adaptadas do seu snippet) */
@keyframes round1 {
    0% { left: -4em; transform: skewX(0deg) rotate(0deg); opacity: 0.8; }
    45% { left: 12em; transform: skewX(25deg) rotate(-15deg); opacity: 0; }
    50% { left: -10em; opacity: 0; }
    100% { left: -4em; transform: skewX(0deg) rotate(0deg); opacity: 0.8; }
}

@keyframes round2 {
    0% { left: 10em; transform: skewX(0deg) rotate(0deg); opacity: 0.8; }
    45% { left: -8em; transform: skewX(-25deg) rotate(15deg); opacity: 0; }
    50% { left: 15em; opacity: 0; }
    100% { left: 10em; transform: skewX(0deg) rotate(0deg); opacity: 0.8; }
}

/* --- ELEMENTOS ORBITAIS (ELIPSES) --- */
.background-orbits {
    position: absolute;
    width: 100%; height: 100%;
    top: 0; left: 0;
    z-index: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
    perspective: 1000px;
}

.orbit {
    position: absolute;
    border-radius: 50%;
    box-shadow: 0 0 15px rgba(4, 170, 109, 0.05);
}

.o1 {
    width: 85vmin; height: 85vmin;
    border: 1px solid rgba(4, 170, 109, 0.15);
    transform: rotateX(75deg);
    animation: spin-slow 60s linear infinite;
}

.o2 {
    width: 65vmin; height: 65vmin;
    border: 1px solid rgba(4, 170, 109, 0.1);
    transform: rotateX(75deg) rotateY(15deg);
    animation: spin-reverse 80s linear infinite;
}

@keyframes spin-slow { 100% { transform: rotateX(75deg) rotateZ(360deg); } }
@keyframes spin-reverse { 100% { transform: rotateX(75deg) rotateY(15deg) rotateZ(-360deg); } }

/* --- WRAPPER (FORMULÁRIO) --- */
.wrapper {
    position: relative;
    z-index: 10;
    width: 400px;
    max-width: 90%;
    background: var(--sidebar-hover); 
    border: 1px solid rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(10px);
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.6);
    color: #fff;
    border-radius: 20px;
    padding: 45px 35px;
    text-align: center;
}

.divLogo img { width: 140px; margin-bottom: 20px; filter: drop-shadow(0 0 10px var(--primary-blue)); }
.form-title { font-size: 20px; font-weight: 400; margin-bottom: 30px; color: #a5d6a7; letter-spacing: 1px; }

/* INPUTS */
.input-box { position: relative; width: 100%; height: 50px; margin: 25px 0; }
.input-box input {
    width: 100%; height: 100%;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 50px;
    font-size: 15px; color: #fff; padding: 0 25px;
    transition: 0.3s;
}
/* Fix Autofill Amarelo */
.input-box input:-webkit-autofill,
.input-box input:-webkit-autofill:hover, 
.input-box input:-webkit-autofill:focus, 
.input-box input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px var(--dark-bg) inset !important;
    -webkit-text-fill-color: white !important;
    border-radius: 50px !important;
}
.input-box input:focus { border-color: var(--tertiary-blue); box-shadow: 0 0 10px rgba(4, 170, 109, 0.2); }
.input-box input::placeholder { color: rgba(255, 255, 255, 0.35); }

/* BOTÃO */
.btn {
    width: 100%; height: 50px;
    background: linear-gradient(90deg, #04AA6D, #026942);
    border: none; border-radius: 50px;
    cursor: pointer; font-size: 15px; color: #fff; font-weight: 700;
    margin-top: 15px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}
.btn:hover { background: linear-gradient(90deg, #05c982, #04AA6D); transform: translateY(-2px); }

/* AREA LOGADA */
.logged-container { width: 100%; height: 100vh; }
