/* argo-gym auth/public theme — lifted VERBATIM from argo-coach login
   (coach_sign_in.html) so the public pages are the real ARGO theme, not a new one. */

* { font-family: 'Inter', sans-serif; }

.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
.no-scrollbar::-webkit-scrollbar { display: none; }

@keyframes gradient {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.animate-gradient { background-size: 200% 200%; animation: gradient 8s ease infinite; }

:root {
  --bg-primary: #000000;
  --bg-secondary: rgba(0, 0, 0, 0.4);
  --bg-input: rgba(0, 0, 0, 0.5);
  --text-primary: #ffffff;
  --text-secondary: #d1d5db;
  --text-muted: #9ca3af;
  --text-placeholder: #6b7280;
  --border-primary: #374151;
  --border-secondary: rgba(31, 41, 55, 0.5);
  --green-icon: #4ade80;
  --green-from: #10b981;
  --green-to: #4ade80;
  --green-hover-from: #059669;
  --green-hover-to: #10b981;
  --green-link: #4ade80;
  --green-link-hover: #86efac;
  --overlay-opacity: 0.3;
  --hero-opacity: 0.6;
}

body { background-color: var(--bg-primary); color: var(--text-primary); }

.bg-form-container { background-color: var(--bg-secondary); }
.bg-input-field { background-color: var(--bg-input); }
.text-secondary { color: var(--text-secondary) !important; }
.text-muted { color: var(--text-muted) !important; }
.border-custom { border-color: var(--border-primary) !important; }
.border-custom-light { border-color: var(--border-secondary) !important; }
.icon-green { color: var(--green-icon); }

.btn-gradient { background: linear-gradient(to right, var(--green-from), var(--green-to)); }
.btn-gradient:hover { background: linear-gradient(to right, var(--green-hover-from), var(--green-hover-to)); }

.link-green { color: var(--green-link); }
.link-green:hover { color: var(--green-link-hover); }

input::placeholder { color: var(--text-placeholder); }
input:focus, select:focus, textarea:focus {
  outline: none; border-color: #4ade80; box-shadow: 0 0 0 3px rgba(74, 222, 128, 0.2);
}

.mobile-bg-overlay { opacity: var(--overlay-opacity); }
.hero-image { opacity: var(--hero-opacity); }

/* ── Wizard (reg-*) — real ARGO registration wizard styles ── */
.reg-eyebrow { font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 8px; }
.reg-segs { display: flex; gap: 6px; }
.reg-segs b { display: block; flex: 1; height: 3px; border-radius: 999px; background: rgba(255,255,255,.12); overflow: hidden; }
.reg-segs b em { display: block; height: 100%; width: 0; background: var(--green-from); transition: width .6s ease; }
.reg-segs b.done em { width: 100%; }
.reg-step { display: none; }
.reg-step.on { display: block; animation: regStepIn .35s ease both; }
@keyframes regStepIn { from { opacity: 0; transform: translateX(14px); } to { opacity: 1; transform: translateX(0); } }
.reg-step-title { color: var(--text-primary); font-size: 17px; font-weight: 600; line-height: 1.3; margin-bottom: 4px; }
.reg-step-help { color: var(--text-muted); font-size: 13px; line-height: 1.5; margin-bottom: 16px; }
.reg-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.reg-chip { border: 1px solid rgba(255,255,255,.12); background: transparent; color: var(--text-secondary); padding: 8px 14px; border-radius: 999px; font-size: 13px; line-height: 1.2; text-align: left; cursor: pointer; transition: border-color .2s, background-color .2s, color .2s; }
.reg-chip:hover { border-color: rgba(255,255,255,.28); color: #fff; }
.reg-chip.on { border-color: #10b981; background: rgba(16,185,129,.15); color: #fff; }
.reg-inline-err { color: #f87171; font-size: 13px; margin-top: 10px; }
.reg-inline-err:empty { display: none; }
.reg-nav { display: flex; align-items: center; gap: 10px; }
.reg-nav .btn-gradient { flex: 1 1 auto; }
.reg-back { flex: 0 0 auto; border: 1px solid rgba(255,255,255,.12); color: var(--text-secondary); padding: 12px 18px; border-radius: 6px; font-size: 13px; font-weight: 500; transition: border-color .2s, color .2s; background: transparent; cursor: pointer; }
.reg-back:hover { border-color: rgba(255,255,255,.28); color: #fff; }

/* Hero (right panel) step list */
.hero-eyebrow { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: #4ade80; font-weight: 700; margin-bottom: 12px; }
.hero-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.hero-steps li { display: flex; align-items: center; gap: 12px; color: #6b7280; font-size: 14px; transition: color .3s; }
.hero-steps li .n { width: 26px; height: 26px; border-radius: 50%; border: 1px solid rgba(255,255,255,.14); display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 800; flex: none; }
.hero-steps li.done { color: #9ca3af; }
.hero-steps li.done .n { background: rgba(16,185,129,.2); border-color: rgba(16,185,129,.5); color: #4ade80; }
.hero-steps li.now { color: #fff; font-weight: 600; }
.hero-steps li.now .n { background: #10b981; border-color: #10b981; color: #04150d; }

/* Standard field (green icon + dark input) — matches the login inputs exactly */
.argo-field { position: relative; }
.argo-field .fi { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--green-icon); }
.argo-input {
  padding-left: 3rem; width: 100%; height: 2.75rem; border-radius: 0.375rem; font-size: 14px;
  color: #fff; background-color: var(--bg-input); border: 1px solid var(--border-primary);
  transition: all .15s;
}
select.argo-input option { background: #0f0f0f; }
