/* ================================================================
   GSM Multi Tool — Login / Register redesign  (blue-teal, light)
   Covers the page cards (.auth-card) and the header popups
   (#loginModal / #registerModal).  Pure CSS — no markup/JS change.
   ================================================================ */

/* ---- shared tokens ---- */
:root{
  --ax-grad:linear-gradient(135deg,#3a6ff0 0%,#7b5cf0 52%,#20c3dd 100%);
  --ax-ink:#0f1b3d;
  --ax-mut:#6a7488;
  --ax-line:#e5eaf3;
  --ax-field:#f5f8fc;
  --ax-blue:#3a6ff0;
}

/* ================= CARD SHELLS ================= */
.auth-card{
  max-width:430px;margin-inline:auto;border:1px solid var(--ax-line) !important;
  border-radius:22px !important;
  background:#ffffff !important;
  box-shadow:0 24px 60px -22px rgba(20,40,90,.28), 0 2px 0 rgba(255,255,255,.6) inset !important;
  position:relative;overflow:hidden;
}
.auth-card::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--ax-grad)}

#loginModal .modal-dialog, #registerModal .modal-dialog{max-width:430px}
#loginModal .modal-content, #registerModal .modal-content{
  border:1px solid var(--ax-line) !important;border-radius:22px !important;overflow:hidden;position:relative;
  background:#ffffff !important;box-shadow:0 34px 90px -26px rgba(20,40,90,.4) !important;
}
#loginModal .modal-content::before, #registerModal .modal-content::before{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--ax-grad);z-index:2}
#loginModal .modal-header, #registerModal .modal-header{border:0 !important;padding:26px 30px 4px !important}
#loginModal .modal-body, #registerModal .modal-body{padding:8px 30px 30px !important}

/* ================= HEADINGS (fixes the invisible white title) ================= */
.auth-card h2, .auth-card h3,
#loginModal .modal-header h3, #registerModal .modal-header h3{
  background:var(--ax-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  color:transparent !important;font-weight:800 !important;letter-spacing:-.01em;
}
.auth-card > p, .auth-card .text-muted,
#loginModal .modal-body p, #registerModal .modal-body p,
#loginModal .modal-body .text-muted, #registerModal .modal-body .text-muted{
  color:var(--ax-mut) !important;
}
#loginModal .btn-close, #registerModal .btn-close{opacity:.5}

/* ================= LABELS ================= */
.auth-card .form-label,
#loginModal .form-label, #registerModal .form-label{
  color:#47516a !important;font-weight:700 !important;font-size:12px !important;
  letter-spacing:.3px;text-transform:uppercase;margin-bottom:6px;
}

/* ================= INPUTS ================= */
.auth-card .form-control,
#loginModal .form-control, #registerModal .form-control{
  height:50px;border-radius:13px !important;border:1.5px solid var(--ax-line) !important;
  background:var(--ax-field) !important;color:var(--ax-ink) !important;
  font-size:14.5px;font-weight:500;padding:0 16px;transition:.18s;box-shadow:none !important;
}
.auth-card .form-control::placeholder,
#loginModal .form-control::placeholder, #registerModal .form-control::placeholder{color:#9aa4b6 !important}
.auth-card .form-control:focus,
#loginModal .form-control:focus, #registerModal .form-control:focus{
  border-color:var(--ax-blue) !important;background:#fff !important;
  box-shadow:0 0 0 4px rgba(58,111,240,.14) !important;
}
#registerModal .a2z-reg-otp input[name="code"],
.auth-card .a2z-reg-otp input[name="code"]{height:58px}

/* ================= PRIMARY BUTTON ================= */
.auth-card .btn-primary-modern,
#loginModal .btn-primary-modern, #registerModal .btn-primary-modern{
  height:52px;border:0 !important;border-radius:13px !important;font-weight:700 !important;font-size:15px !important;
  color:#fff !important;background:var(--ax-grad) !important;background-size:160% 160% !important;
  box-shadow:0 14px 30px -10px rgba(58,111,240,.55) !important;transition:.2s;
}
.auth-card .btn-primary-modern:hover,
#loginModal .btn-primary-modern:hover, #registerModal .btn-primary-modern:hover{
  transform:translateY(-2px);background-position:100% 0 !important;
  box-shadow:0 20px 40px -12px rgba(58,111,240,.65) !important;
}

/* ================= CAPTCHA + LINKS + MISC ================= */
.auth-card .a2z-captcha-refresh, #registerModal .a2z-captcha-refresh{
  border:1px solid var(--ax-line) !important;background:var(--ax-field) !important;color:#5a6478 !important;border-radius:10px !important;
}
.auth-card .a2z-captcha-img, #registerModal .a2z-captcha-img{border:1px solid var(--ax-line) !important;border-radius:10px !important}
.auth-card a, #loginModal a, #registerModal a,
.auth-card .btn-link, #registerModal .a2z-otp-back, #registerModal .a2z-otp-resend{
  color:var(--ax-blue) !important;font-weight:600;text-decoration:none;
}
.auth-card a:hover, #loginModal a:hover, #registerModal a:hover{text-decoration:underline}
.auth-card .a2z-reg-success .bi-check-circle-fill{color:#16b981 !important}
