export const s = {
  page: {
    fontFamily: "'Nunito', sans-serif",
    minHeight: "100vh",
    display: "flex", alignItems: "center", justifyContent: "center",
    background: "radial-gradient(ellipse at 30% 40%, #1a2340 0%, #0d1018 60%)",
    overflow: "hidden", position: "relative",
  },
  bgGlow: {
    position: "fixed", top: "40%", right: 0,
    width: "500px", height: "400px",
    background: "radial-gradient(ellipse, #0f2a22 0%, transparent 70%)",
    pointerEvents: "none", opacity: 0.7,
  },
  card: {
    position: "relative", zIndex: 10, width: "360px",
    background: "linear-gradient(155deg, #1d2436 0%, #131720 100%)",
    border: "1px solid rgba(255,255,255,0.08)",
    borderRadius: "30px", padding: "40px 38px 34px",
    boxShadow: "0 40px 100px rgba(0,0,0,0.7), 0 0 0 1px rgba(255,255,255,0.03)",
  },
  dotsBtn: {
    position: "absolute", top: "18px", right: "20px",
    background: "none", border: "none",
    color: "rgba(255,255,255,0.25)", fontSize: "1.3rem",
    cursor: "pointer", letterSpacing: "3px",
  },
  logoWrap: { textAlign: "center", marginBottom: "2px" },
  logoSvg: {
    width: "130px", height: "130px",
    animation: "logoPulse 3s ease-in-out infinite",
  },
  title: {
    textAlign: "center", color: "#fff",
    fontSize: "2rem", fontWeight: 900,
    letterSpacing: "-0.5px", margin: "14px 0 26px",
  },
  inputWrap: { marginBottom: "13px" },
  input: {
    width: "100%", boxSizing: "border-box",
    background: "rgba(255,255,255,0.055)",
    border: "1.5px solid rgba(255,255,255,0.09)",
    borderRadius: "14px", padding: "14px 18px",
    color: "#fff", fontFamily: "'Nunito', sans-serif",
    fontSize: "0.93rem", outline: "none",
  },
  eyeBtn: {
    position: "absolute", right: "13px", top: "50%",
    transform: "translateY(-50%)",
    background: "none", border: "none", cursor: "pointer",
    color: "rgba(255,255,255,0.35)", fontSize: "1.05rem", lineHeight: 1,
  },
  errMsg: {
    color: "#ff6b6b", fontSize: "0.83rem",
    textAlign: "center", margin: "6px 0 10px",
  },
  btnLogin: {
    width: "100%",
    background: "linear-gradient(90deg, #1fc9b0, #2de0c8, #1fc9b0)",
    backgroundSize: "200% 100%",
    border: "none", borderRadius: "14px", padding: "15px",
    color: "#082320", fontFamily: "'Nunito', sans-serif",
    fontSize: "1.05rem", fontWeight: 900, cursor: "pointer", marginTop: "6px",
    boxShadow: "0 6px 24px rgba(45,224,200,0.35)",
    animation: "shimmer 3s linear infinite",
  },
  forgotBtn: {
    display: "block", width: "100%", textAlign: "center",
    color: "#2de0c8", fontSize: "0.87rem", marginTop: "14px",
    background: "none", border: "none", cursor: "pointer",
    fontFamily: "'Nunito', sans-serif",
  },
  regRow: {
    textAlign: "center", color: "rgba(255,255,255,0.4)",
    fontSize: "0.87rem", marginTop: "9px",
  },
  link: { color: "#2de0c8", textDecoration: "none" },
  divider: { display: "flex", alignItems: "center", gap: "10px", margin: "18px 0 14px" },
  divText: { color: "rgba(255,255,255,0.25)", fontSize: "0.78rem" },
  socials: { display: "flex", gap: "10px" },
  socBtn: {
    flex: 1, padding: "11px 0", borderRadius: "12px",
    border: "1.5px solid rgba(255,255,255,0.09)",
    background: "rgba(255,255,255,0.04)",
    cursor: "pointer", fontWeight: 800,
    fontFamily: "'Nunito', sans-serif", fontSize: "0.88rem", color: "#fff",
  },
};