/* =====================================================================
   FLUXX AUTH — shares the same token language as fluxx-dashboard.css
   so registration/login/forgot/reset feel like one continuous product.
   ================================================================== */
:root{
  --void:#060906;
  --panel-solid:#0e130f;
  --border: rgba(255,255,255,0.08);
  --border-hi: rgba(58,224,138,0.35);
  --gold:#f2b544;
  --gold-dim: rgba(242,181,68,0.35);
  --green:#3ce88a;
  --green-dim: rgba(60,232,138,0.35);
  --red:#ff5470;
  --text-1:#f3f6f3;
  --text-2:#9aa39c;
  --text-3:#5c655e;
  --radius-lg:22px;
  --radius-md:18px;
  --radius-sm:12px;
  --ff-display:'Space Grotesk',sans-serif;
  --ff-body:'Inter',sans-serif;
}

body:has(.fluxx-auth-page){overflow-x:hidden;}

.fluxx-auth-page{
  min-height:100vh;
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:48px 20px;
  background:
    radial-gradient(700px 500px at 15% 10%, rgba(60,232,138,0.10), transparent 60%),
    radial-gradient(600px 480px at 90% 20%, rgba(242,181,68,0.10), transparent 60%),
    radial-gradient(700px 600px at 50% 100%, rgba(60,232,138,0.06), transparent 60%),
    var(--void);
  font-family:var(--ff-body);
  color:var(--text-1);
}

.fluxx-auth-wrap{
  width:100%;
  max-width:440px;
  background:var(--panel-solid);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:38px 34px;
  box-shadow:0 24px 70px rgba(0,0,0,0.55);
}

.fluxx-auth-brand{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:26px;
}
.fluxx-auth-brand .mark{
  width:36px;height:36px;border-radius:10px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 22px rgba(60,232,138,0.4);
  overflow:hidden;
}
.fluxx-auth-brand .mark-img{width:100%;height:100%;object-fit:cover;}
.fluxx-auth-brand .name{
  font-family:var(--ff-display);font-weight:700;font-size:18px;letter-spacing:.4px;
}
.fluxx-auth-brand .name span{color:var(--green);}

.fluxx-auth-title{
  font-family:var(--ff-display);
  font-size:24px;
  font-weight:700;
  margin-bottom:6px;
  color:var(--text-1);
}
.fluxx-auth-sub{
  color:var(--text-2);
  font-size:14px;
  line-height:1.5;
  margin-bottom:26px;
}

.fluxx-alert{
  padding:12px 14px;
  border-radius:var(--radius-sm);
  font-size:13.5px;
  line-height:1.5;
  margin-bottom:20px;
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.fluxx-alert i{margin-top:2px;flex-shrink:0;}
.fluxx-alert-error{
  background:rgba(255,84,112,0.08);
  border:1px solid rgba(255,84,112,0.3);
  color:#ffb3c0;
}
.fluxx-alert-success{
  background:rgba(60,226,155,0.08);
  border:1px solid rgba(60,226,155,0.3);
  color:#8ff0c9;
}
.fluxx-alert ul{margin:0;padding-left:18px;}

.fluxx-field{margin-bottom:18px;}
.fluxx-field label{
  display:block;
  font-size:13px;
  font-weight:500;
  color:var(--text-2);
  margin-bottom:7px;
}
.fluxx-input-wrap{position:relative;}
.fluxx-input-wrap i.field-icon{
  position:absolute;left:15px;top:50%;transform:translateY(-50%);
  color:var(--text-3);font-size:14px;pointer-events:none;
}
.fluxx-field input[type="text"],
.fluxx-field input[type="email"],
.fluxx-field input[type="password"]{
  width:100%;
  padding:12px 14px 12px 42px;
  background:rgba(255,255,255,0.03);
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  color:var(--text-1);
  font-size:14.5px;
  font-family:inherit;
  transition:border-color .2s, background .2s;
}
.fluxx-field input:focus{
  outline:none;
  border-color:var(--green);
  background:rgba(60,232,138,0.05);
}
.fluxx-field input.has-toggle{padding-right:44px;}
.fluxx-toggle-pass{
  position:absolute;right:14px;top:50%;transform:translateY(-50%);
  background:none;border:none;color:var(--text-3);cursor:pointer;font-size:14px;padding:4px;
}
.fluxx-toggle-pass:hover{color:var(--text-2);}

.fluxx-strength{height:4px;border-radius:4px;background:rgba(255,255,255,.08);margin-top:8px;overflow:hidden;}
.fluxx-strength-bar{height:100%;width:0%;background:var(--red);transition:width .25s, background .25s;}

.fluxx-checkbox-row{
  display:flex;align-items:center;gap:8px;
  font-size:13.5px;color:var(--text-2);
  margin-bottom:22px;
}
.fluxx-checkbox-row input{accent-color:var(--green);width:15px;height:15px;}

.fluxx-btn-primary{
  width:100%;
  padding:13px;
  border:none;
  border-radius:var(--radius-sm);
  background:linear-gradient(90deg, var(--green), #2ecc71);
  color:#04140b;
  font-weight:700;
  font-size:15px;
  font-family:inherit;
  cursor:pointer;
  box-shadow:0 4px 18px rgba(60,232,138,.32);
  transition:filter .15s, transform .15s;
}
.fluxx-btn-primary:hover{filter:brightness(1.08);}
.fluxx-btn-primary:active{transform:scale(0.99);}

.fluxx-auth-foot{
  margin-top:24px;
  text-align:center;
  font-size:13.5px;
  color:var(--text-2);
}
.fluxx-auth-foot a{color:var(--gold);font-weight:600;}
.fluxx-auth-foot a:hover{text-decoration:underline;}

.fluxx-auth-links-row{
  display:flex;
  justify-content:space-between;
  margin:-6px 0 20px;
  font-size:13px;
}
.fluxx-auth-links-row a{color:var(--text-2);}
.fluxx-auth-links-row a:hover{color:var(--gold);}

/* Honeypot field — hidden from real visitors, visible to bots that fill every field. */
.fluxx-hp{position:absolute !important;left:-9999px !important;top:-9999px !important;}
