/* =========================================
   Fortt Pro — Login
   Fundo preto premium
   ========================================= */

:root{
  --bg-0:#000000;
  --bg-1:#0A0A0A;
  --card: rgba(18,18,18,0.88);
  --bd: rgba(230,65,50,0.20);

  --tx-0:#FFFFFF;
  --tx-1: rgba(255,255,255,0.72);

  --ac-0:#E64132;
  --ac-1:#C83426;

  --shadow: 0 20px 60px rgba(0,0,0,0.65);
  --glow: 0 0 40px rgba(230,65,50,0.16);

  --r-lg: 20px;
  --r-md: 12px;

  --font: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

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

html, body{
  height:100%;
}

body{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  color:var(--tx-0);
  background:
    radial-gradient(900px 600px at 15% 10%, rgba(230,65,50,0.16), transparent 55%),
    radial-gradient(700px 500px at 85% 20%, rgba(230,65,50,0.08), transparent 55%),
    linear-gradient(135deg, #000000, #080808 45%, #0D0D0D 100%);
}

.container{
  width:100%;
  max-width:420px;
  padding:20px;
}

.login-card{
  background:var(--card);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  padding:45px 35px;
  border-radius:var(--r-lg);
  border:1px solid var(--bd);
  box-shadow:var(--shadow), var(--glow);
  color:var(--tx-0);
  text-align:center;
}

.login-card h2{
  color:var(--ac-0);
  font-size:28px;
  margin-bottom:8px;
  font-weight:900;
  letter-spacing:.2px;
}

.subtitle{
  color:var(--tx-1);
  font-size:14px;
  margin-bottom:28px;
}

.input-group{
  position:relative;
  margin-bottom:22px;
  text-align:left;
}

.input-group input{
  width:100%;
  padding:14px;
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.14);
  border-radius:10px;
  outline:none;
  color:#fff;
  font-size:15px;
  transition:.25s;
}

.input-group input:focus{
  border-color:var(--ac-0);
  box-shadow:0 0 0 4px rgba(230,65,50,0.12);
}

.input-group label{
  position:absolute;
  left:14px;
  top:13px;
  color:rgba(255,255,255,0.6);
  transition:.25s;
  pointer-events:none;
}

.input-group input:focus + label,
.input-group input:not(:placeholder-shown) + label{
  top:-10px;
  left:10px;
  font-size:12px;
  background:var(--bg-1);
  padding:0 6px;
  border-radius:4px;
  color:var(--ac-0);
}

button{
  width:100%;
  padding:14px;
  border:none;
  border-radius:10px;
  background:linear-gradient(135deg, var(--ac-0), var(--ac-1));
  color:#fff;
  font-size:16px;
  font-weight:800;
  cursor:pointer;
  transition:.25s;
}

button:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 25px rgba(230,65,50,0.35);
}

.toggle-text{
  margin-top:18px;
  font-size:14px;
  color:var(--tx-1);
}

.toggle-text a{
  color:var(--ac-0);
  text-decoration:none;
  font-weight:800;
  margin-left:6px;
}

.toggle-text a:hover{
  text-decoration:underline;
}

.mini{
  margin-top:14px;
  font-size:12px;
  color:rgba(255,255,255,0.55);
}