/* -------------------------------------------------------
   Wizard v2 (dark) – arrows like SmartWizard + restored styles
   ------------------------------------------------------- */

/* Core variables */
:root {
  --wiz2-bg:#0f1114;
  --wiz2-surface:#12171d;
  --wiz2-ribbon:#181e26;
  --wiz2-ribbon-alt:#1f262f;
  --wiz2-border:#222b35;
  --wiz2-divider:#2c3440;
  --wiz2-accent:#8A2BE2;
  --wiz2-accent-glow:#b48dff;
  --wiz2-line-base:#2d3540;
  --wiz2-line-fill:#8A2BE2;
  --wiz2-text:#e9ecf2;
  --wiz2-text-dim:#a7b0bb;
  --wiz2-font:'Open Sans',Arial,sans-serif;

  /* Arrow bar geometry (SmartWizard style) */
  --wiz2-step-h:50px;        /* full bar height */
  --wiz2-tip-half:25px;      /* half the height (triangle border) */
  --wiz2-tip-w:40px;         /* triangle width */
  --wiz2-link-gap:30px;      /* right gap and negative left overlap */
}

/* Base page */
.registration2-body { background:var(--wiz2-bg); color:var(--wiz2-text); font-family:var(--wiz2-font); }
.wiz2 { background:var(--wiz2-surface); padding:14px 30px 6px; border-bottom:1px solid var(--wiz2-border); }

/* =======================================================
   PRIMARY STEPS RIBBON (SmartWizard arrows replication)
   ======================================================= */
.wiz2-primary { position:relative; }
.wiz2-steps {
  list-style:none; margin:0; padding:0;
  display:flex; flex-wrap:nowrap; width:100%;
  height:var(--wiz2-step-h);
  overflow:hidden;                 /* clip triangles so nothing sticks out */
  background:var(--wiz2-surface);
}

.wiz2-step {
  position:relative;
  flex:1 1 0;
  height:var(--wiz2-step-h);
  display:flex; align-items:center;
  padding:10px;                   /* base padding */
  padding-left:50px;              /* room before text on first item */
  margin-right:var(--wiz2-link-gap);
  margin-left:calc(-1 * var(--wiz2-link-gap));
  font:600 14px/1 var(--wiz2-font);
  letter-spacing:.55px;
  text-transform:uppercase;
  color:var(--wiz2-text-dim);
  background:linear-gradient(135deg,#151b23 0%, #1e252d 100%);
  border:1px solid var(--wiz2-border);
  box-sizing:border-box;
  transition:background .35s,color .35s,border-color .35s,box-shadow .35s;
}

/* first/last edges rounded */
.wiz2-step:first-child { margin-left:0; padding-left:14px; border-top-left-radius:4px; border-bottom-left-radius:4px; }
.wiz2-step:last-child  { margin-right:0; border-top-right-radius:4px; border-bottom-right-radius:4px; }

/* Create arrow tip (exact SmartWizard triangle math) */
.wiz2-step::after,
.wiz2-step::before {
  content:"";
  position:absolute;
  left:100%;
  top:50%;
  width:0; height:0;
  margin-top:calc(-1 * var(--wiz2-tip-half));   /* center triangle vertically */
  border:var(--wiz2-tip-half) solid transparent;/* full height = 2 * tip-half */
  border-left-width:var(--wiz2-tip-w);          /* tip width */
  pointer-events:none;
  transition:all .35s ease-in-out;
}
    .wiz2-step::after {
        z-index: 2;
        border-left-color: #1e252d;
    }
    /* visible tip fill  #1e252d; */
.wiz2-step::before { z-index:1; border-left-color:#14191f; }   /* subtle seam */

.wiz2-step:last-child::after,
.wiz2-step:last-child::before { display:none; } /* no tip for last segment */

/* Remove vertical seam between segments */
.wiz2-step + .wiz2-step { border-left:none; }

/* Active step */
.wiz2-step.active {
  background:linear-gradient(90deg,#3b1d6d 0%, #29233f 70%);
  color:#fff;
  border-color:var(--wiz2-accent);
  box-shadow:0 0 0 1px var(--wiz2-accent),0 0 12px -4px rgba(138,43,226,.55);
  z-index:10;
}
.wiz2-step.active::after  { border-left-color:#3b1d6d; }     /* tip fill */
.wiz2-step.active::before { border-left-color:var(--wiz2-accent); } /* accent seam */

/* Blend next step’s left seam with active tip */
.wiz2-step.active + .wiz2-step::before { border-left-color:var(--wiz2-accent); }

/* Numbers & labels (no bubbles) */
.wiz2-step-num   { font-weight:700; font-size:18px; margin-right:14px; color:inherit; }
.wiz2-step-label { color:inherit; }
.wiz2-step.active .wiz2-step-num   { color:#fff; }
.wiz2-step.active .wiz2-step-label { color:var(--wiz2-accent-glow); }

/* Completed (optional) */
.wiz2-step.completed {
  background: linear-gradient(135deg, #2e2340 0%, #3a2a57 100%);
  color: var(--wiz2-text);
  border-color: #3a2f54; /* slightly purple border */
}
.wiz2-step.completed::after  { border-left-color: #3a2a57; } /* tip fill */
.wiz2-step.completed::before { border-left-color: #5a36a9; } /* subtle purple seam */

/* Responsive arrow scaling */
@media (max-width:1100px){
  :root{ --wiz2-step-h:46px; --wiz2-tip-half:23px; --wiz2-tip-w:34px; }
  .wiz2-steps{ height:var(--wiz2-step-h); }
  .wiz2-step { height:var(--wiz2-step-h); padding-left:46px; }
  .wiz2-step::after,.wiz2-step::before{
    margin-top:calc(-1 * var(--wiz2-tip-half));
    border:var(--wiz2-tip-half) solid transparent;
    border-left-width:var(--wiz2-tip-w);
  }
}
@media (max-width:740px){
  .wiz2-steps{ flex-wrap:wrap; overflow:visible; height:auto; }
  .wiz2-step{
    flex:1 1 calc(50% - 10px);
    margin:6px 6px;
    padding:10px 18px;
    height:auto;
    border-right:1px solid var(--wiz2-border);
  }
  .wiz2-step::after,.wiz2-step::before{ display:none; } /* stacked layout */
}

/* =======================================================
   SUBSTEPS (restored fully)
   ======================================================= */
.wiz2-subbar { margin-top:26px; position:relative; }
.wiz2-subtrack{
  position:relative; height:8px; background:var(--wiz2-line-base);
  border-radius:4px; margin:0 10px 80px; overflow:hidden;
}
.wiz2-subtrack-fill{
  position:absolute; top:0; left:0; bottom:0; width:0%;
  background:linear-gradient(90deg,var(--wiz2-line-fill) 0%, #6f35d4 70%);
  box-shadow:0 0 8px 1px rgba(138,43,226,.35);
  transition:width .55s cubic-bezier(.22,.61,.36,1);
}
.wiz2-substeps{
  list-style:none; padding:0; margin:-96px 10px 12px;
  display:none; justify-content:space-between; align-items:flex-start;
}
.wiz2-substeps[data-active="true"]{ display:flex; }

.wiz2-sub{
  text-align:center; flex:1; position:relative;
  font-size:12px; min-width:78px; color:var(--wiz2-text-dim);
}
.wiz2-bubble{
  margin:0 auto 12px; width:52px; height:52px; line-height:52px;
  border-radius:50%;
  background:#2e343b; color:#dfe2e7;
  font-weight:700; font-size:18px;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 2px 4px rgba(0,0,0,.55),
             0 0 0 2px var(--wiz2-surface),
             0 0 0 3px var(--wiz2-border);
  transition:background .35s, transform .35s, box-shadow .35s;
}
.wiz2-sub.active .wiz2-bubble{
  background:var(--wiz2-accent); color:#fff; transform:scale(1.08);
  box-shadow:0 0 0 2px var(--wiz2-surface),
             0 0 0 3px var(--wiz2-accent),
             0 0 18px -4px rgba(138,43,226,.7);
}
.wiz2-sub.completed .wiz2-bubble{
  background:#3d2a57; color:#f1f1f5;
  box-shadow:0 0 0 2px var(--wiz2-surface),
             0 0 0 3px #3d2a57;
}
.wiz2-subtext{
  max-width:140px; margin:0 auto;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.wiz2-sub.active .wiz2-subtext   { color:var(--wiz2-accent-glow); font-weight:600; }
.wiz2-sub.completed .wiz2-subtext{ color:var(--wiz2-text); }

/* =======================================================
   CONTENT CARD (restored)
   ======================================================= */
.wizard2-main { padding:40px 46px 200px; }
.wizard2-content-card{
  background:var(--wiz2-surface);
  border:1px solid var(--wiz2-border);
  border-radius:16px;
  padding:36px 42px 44px;
  max-width:980px;
  box-shadow:0 6px 26px -8px rgba(0,0,0,.55);
  margin-bottom:48px;
}
.wizard2-content-card h1{ margin-top:0; font-size:28px; letter-spacing:.6px; font-weight:700; }
.wizard2-content-card p { font-size:14px; line-height:1.55rem; color:var(--wiz2-text-dim); }
.wizard2-content-card ul{ margin:14px 0 0 22px; font-size:14px; line-height:1.38rem; }

/* =======================================================
   FOOTER NAV (restored)
   ======================================================= */
.wizard2-footer-nav{
  position:fixed; left:0; right:0; bottom:0;
  background:var(--wiz2-surface);
  border-top:1px solid var(--wiz2-border);
  padding:12px 32px 18px;
  box-shadow:0 -4px 16px rgba(0,0,0,.4);
  z-index:200;
}
.wizard2-footer-nav hr{ border:none; height:2px; background:var(--wiz2-border); margin:0 0 14px; }
.wizard2-buttons { display:flex; justify-content:flex-end; gap:16px; }

.btn-primary{
  background:var(--wiz2-accent)!important; border:1px solid #5d1ea6!important;
  color:#fff!important; font-weight:600;
  border-radius:8px; padding:10px 24px;
}
.btn-primary:hover:not(:disabled){ background:var(--wiz2-accent-glow)!important; }
.btn-outline{
  background:transparent!important; border:1px solid var(--wiz2-border)!important;
  color:var(--wiz2-text-dim)!important; font-weight:600;
  border-radius:8px; padding:10px 24px;
}
.btn-outline:hover:not(:disabled){ color:var(--wiz2-text)!important; border-color:var(--wiz2-accent)!important; }
.btn:disabled{ opacity:.35; cursor:not-allowed; }

/* =======================================================
   RESPONSIVE (content/footer/substeps spacing)
   ======================================================= */
@media (max-width:1024px){
  .wizard2-main{ padding:34px 30px 190px; }
  .wizard2-content-card{ padding:30px 34px 38px; }
}
@media (max-width:740px){
  .wizard2-main{ padding:28px 22px 180px; }
  .wizard2-content-card{ padding:26px 24px 34px; }
  .wiz2-substeps{ margin:-90px 10px 10px; }
}

/* Active step arrow tip – unify color with body, remove accent seam */
.wiz2-step.active::after,
.wiz2-step.active::before {
    border-left-color: #29233f; /* match the 70%+ gradient end for seamless tip */
}


/* --- Active step arrow tip border (surgical addition) ---
   Goal: show the same accent border (#8A2BE2) along the slanted tip edge
   without altering inactive steps or overall geometry.
   Approach: use ::before as the accent “outline” triangle and slightly
   reduce the fill triangle (::after) width by 1px so the accent shows
   as a 1px border along the slanted edge.
*/
/*.wiz2-step.active::before {
    border-left-color: var(--wiz2-accent);*/ /* accent outline */
/*}

.wiz2-step.active::after {
    border-left-color: #29233f;*/ /* uniform fill matching body */
    /*border-left-width: calc(var(--wiz2-tip-w) - 1px);*/ /* reveal 1px accent edge */
/*}*/

/* --- Active step arrow tip border (surgical tweak for brighter edge) --- */
/*.wiz2-step.active::before {
  border-left-color: var(--wiz2-accent);*/ /* same as the active border */
/*}*/

/* Reveal a slightly wider accent edge so it reads clearly on dark bg */
/*.wiz2-step.active::after {
  border-left-color: #29233f;*/ /* uniform fill matching body */
  /*border-left-width: calc(var(--wiz2-tip-w) - 4px);*/ /* was -1px; make edge brighter */
/*}*/

/* Place Previous on the far left, Next stays on the right */
.wizard2-buttons #is2-btn-prev { margin-right: auto; }

/* Active step arrow tip – brighter diagonal border */
.wiz2-step.active::before { border-left-color: var(--wiz2-accent); }
.wiz2-step.active::after  {
  border-left-color: #29233f;                     /* uniform fill */
  border-left-width: calc(var(--wiz2-tip-w) - 4px);/* slightly wider accent edge */
}

/* === Logo badge overlay (surgical add) === */
.wizard2-header { position:relative; }

.wiz2-logo-badge {
  position:absolute;
  top:10px;
  left:14px;
  width:62px;
  height:62px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,0.08) 0%, rgba(255,255,255,0.02) 45%, transparent 70%),
    linear-gradient(145deg,#181e26 0%, #12171d 100%);
  border:1px solid var(--wiz2-border);
  box-shadow:
    0 4px 14px -6px rgba(0,0,0,.65),
    0 0 0 2px rgba(138,43,226,.18);
  overflow:hidden;
  opacity:.78;
  backdrop-filter:blur(2px);
  pointer-events:none; /* don’t block step clicks */
  z-index:40;
}

.wiz2-logo-badge::after {
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  background:radial-gradient(circle at 65% 60%, rgba(138,43,226,.35) 0%, rgba(138,43,226,0) 55%);
  mix-blend-mode:screen;
  opacity:.35;
}

.wiz2-logo-badge img {
  width:74%;
  height:74%;
  object-fit:contain;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.55));
  opacity:.92;
}

/* Shift steps right to make room for badge */
.wiz2 { padding-left:96px; }

/* Responsive reduction */
@media (max-width:740px){
  .wiz2-logo-badge{
    width:50px; height:50px;
    top:8px; left:10px;
    opacity:.7;
  }
  .wiz2 { padding-left:76px; }
  .wiz2-logo-badge img { width:72%; height:72%; }
}

/* Wizard buttons pointer/disabled cursors applied globally */
#is2-btn-next:enabled:hover,
#is2-btn-prev:enabled:hover {
    cursor: pointer;
}

#is2-btn-next:disabled,
#is2-btn-prev:disabled {
    cursor: not-allowed;
}