/* ═══════════════════════════════════════════════════════════════════════════
   LogiWorx onboarding — apple.com / Apple Account style
   Sign in, Create account (6-step wizard), Account under review.
   Needs apple.css (tokens) loaded first.
   ═══════════════════════════════════════════════════════════════════════════ */
body.ob{margin:0;background:#fff;color:var(--lw-ink);min-height:100vh;display:flex;flex-direction:column;overflow:auto;height:auto;}

/* Global nav — frosted, 48px, like apple.com */
.ob-nav{position:sticky;top:0;z-index:50;height:48px;background:rgba(251,251,253,.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--lw-hair);}
.ob-nav-in{max-width:1024px;margin:0 auto;height:100%;display:flex;align-items:center;justify-content:space-between;padding:0 22px;}
.ob-wordmark{font-size:17px;font-weight:600;letter-spacing:-.02em;color:var(--lw-ink);text-decoration:none;display:flex;align-items:center;gap:8px;}
.ob-wordmark::before{content:"";width:18px;height:18px;border-radius:5px;background:var(--lw-grad);}
.ob-nav-link{font-size:12px;color:var(--lw-ink-2);text-decoration:none;}
.ob-nav-link:hover{color:var(--lw-blue);}

/* Page */
.ob-main{flex:1;width:100%;max-width:600px;margin:0 auto;padding:72px 22px 56px;text-align:center;}
.ob-narrow{max-width:460px;}
.ob-hero-glyph{width:64px;height:64px;border-radius:18px;background:var(--lw-grad);display:flex;align-items:center;justify-content:center;margin:0 auto 26px;box-shadow:0 14px 34px rgba(2,132,199,.25);}
.ob-title{font-family:var(--lw-font-display);font-size:48px;line-height:1.08;font-weight:600;letter-spacing:-.03em;margin:0 0 12px;color:var(--lw-ink);}
.ob-lede{font-size:21px;line-height:1.38;font-weight:400;letter-spacing:-.015em;color:var(--lw-muted);margin:0 auto 40px;max-width:520px;}
.ob-foot{border-top:1px solid var(--lw-hair);background:var(--lw-bg);color:var(--lw-faint);font-size:12px;text-align:center;padding:18px 22px;}
.ob-foot p{margin:4px 0;}
.ob-foot a{color:var(--lw-muted);}

/* Fields: stacked, floating labels (Apple Account sign-in) */
.ob-form{text-align:left;}
.ob-stack{border:1px solid var(--lw-line);border-radius:12px;overflow:hidden;background:#fff;}
.ob-stack .ob-field + .ob-field{border-top:1px solid var(--lw-line);}
.ob-field{position:relative;}
.ob-input{display:block;width:100%;border:0;outline:none;background:transparent;font-size:17px;color:var(--lw-ink);padding:24px 16px 8px;height:56px;font-family:inherit;letter-spacing:-.02em;border-radius:0;}
.ob-field label{position:absolute;left:16px;top:18px;font-size:17px;color:var(--lw-faint);pointer-events:none;transition:all .2s var(--lw-ease);letter-spacing:-.02em;}
.ob-input:focus + label,.ob-input:not(:placeholder-shown) + label{top:8px;font-size:12px;color:var(--lw-muted);}
.ob-stack:focus-within{border-color:var(--lw-blue);box-shadow:0 0 0 4px rgba(2,116,184,.18);}
.ob-check{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--lw-ink-2);margin:18px 2px 22px;cursor:pointer;}
.ob-check input{width:18px;height:18px;accent-color:var(--lw-blue);}
.ob-error{background:rgba(255,59,48,.08);color:#c9241a;font-size:14px;border-radius:12px;padding:10px 14px;margin-top:12px;}
.ob-success{background:rgba(52,199,89,.10);color:#1d7a3a;font-size:14px;border-radius:12px;padding:10px 14px;margin-top:12px;}

/* Buttons */
.ob-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--lw-blue);color:#fff;border:0;border-radius:980px;font-size:17px;font-weight:400;letter-spacing:-.02em;padding:12px 28px;min-height:48px;cursor:pointer;font-family:inherit;text-decoration:none;transition:background .2s var(--lw-ease),transform .15s var(--lw-ease),opacity .2s;}
.ob-btn:hover{background:var(--lw-blue-hover);}
.ob-btn:active{transform:scale(.985);}
.ob-btn:disabled{opacity:.35;cursor:not-allowed;}
.ob-btn-block{width:100%;}
.ob-btn-secondary{background:rgba(0,0,0,.05);color:var(--lw-ink);}
.ob-btn-secondary:hover{background:rgba(0,0,0,.09);}
.ob-links{margin-top:28px;font-size:14px;color:var(--lw-muted);line-height:2;}
.ob-links a{color:var(--lw-blue);text-decoration:none;}
.ob-links a:hover{text-decoration:underline;}
.ob-links p{margin:0;}

/* Icons in tinted tiles (SF Symbols feel) */
.ob-ico{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;}
.ob-ico svg{width:100%;height:100%;}
.ob-tile{width:44px;height:44px;border-radius:12px;background:var(--lw-grad);color:#fff;padding:10px;}
.ob-tile.muted{background:var(--lw-bg);color:var(--lw-blue);}

/* ═══ Registration wizard (register.html) ═══ */
#reg-shell{display:block;min-height:0;width:100%;}
#reg-brand{display:none!important;}
#reg-form-panel{background:#fff!important;display:block;padding:0 22px 72px;overflow:visible;}
#reg-card{max-width:560px;margin:0 auto;}
#reg-intro{text-align:center;padding:64px 0 36px;}
#reg-intro .ob-title{font-size:48px;}
#reg-intro .ob-lede{margin-bottom:0;}

/* progress: thin segmented bar + step label (no numbered dots) */
#prog-track{height:4px;background:var(--lw-bg);border-radius:980px;margin:0 0 36px;}
#prog-fill{background:var(--lw-grad)!important;border-radius:980px;transition:width .6s var(--lw-ease);}
.step-dots{display:none!important;}
.ob-step-count{font-size:14px;font-weight:600;color:var(--lw-blue);margin-bottom:8px;letter-spacing:-.01em;}
.ob-step-title{font-family:var(--lw-font-display);font-size:32px;font-weight:600;letter-spacing:-.025em;line-height:1.12;color:var(--lw-ink);margin:0 0 10px;}
.ob-step-desc{font-size:17px;line-height:1.47;color:var(--lw-muted);margin:0 0 28px;letter-spacing:-.015em;}
.reg-step.active{animation:obIn .6s var(--lw-ease);}
@keyframes obIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* fields */
.reg-label{font-size:13px;font-weight:500;color:var(--lw-ink-2);letter-spacing:-.01em;margin-bottom:7px;}
.reg-label span[style*="ef4444"]{color:var(--lw-faint)!important;font-weight:400;}
.reg-input{border:1px solid var(--lw-line);border-radius:12px;padding:14px 16px;font-size:17px;letter-spacing:-.02em;color:var(--lw-ink);min-height:52px;transition:border-color .2s var(--lw-ease),box-shadow .2s var(--lw-ease);}
.reg-input:focus{border-color:var(--lw-blue);box-shadow:0 0 0 4px rgba(2,116,184,.18);}
.reg-input.ok{border-color:#34c759;box-shadow:none;}
.reg-input.err{border-color:#ff3b30;box-shadow:0 0 0 4px rgba(255,59,48,.12);}
select.reg-input{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236e6e73' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px;}
.field-row{gap:14px;}
.field-hint{font-size:13px;margin-top:6px;}
.field-hint.ok{color:#1d7a3a;}
.field-hint.err{color:#c9241a;}
.field-hint.info{color:var(--lw-muted);}
.pw-wrap .pw-toggle{font-size:13px;color:var(--lw-blue);font-weight:500;right:16px;}
#pw-strength-bar{height:4px;border-radius:980px;margin-top:8px;}
#pw-strength-label{font-size:12px;margin-top:5px;}

/* choice cards */
.portal-card,.role-chip,.pm-chip{border:1px solid var(--lw-line);border-radius:18px;background:#fff;transition:border-color .25s var(--lw-ease),box-shadow .25s var(--lw-ease),transform .25s var(--lw-ease);}
.portal-card{display:flex;gap:16px;align-items:flex-start;padding:20px 22px;text-align:left;}
.portal-card:hover,.role-chip:hover,.pm-chip:hover{border-color:#86868b;background:#fff;transform:none;}
.portal-card.selected,.role-chip.selected,.pm-chip.selected{border-color:var(--lw-blue);background:#fff;box-shadow:0 0 0 1px var(--lw-blue);}
.portal-card.selected::after{background:var(--lw-blue);font-size:11px;width:22px;height:22px;top:16px;right:16px;}
.portal-icon{margin:0;font-size:0;}
.portal-title{font-size:17px;font-weight:600;letter-spacing:-.02em;color:var(--lw-ink);margin:0 0 4px;}
.portal-desc{font-size:14px;color:var(--lw-muted);line-height:1.43;}
.role-chip{padding:14px;gap:12px;}
.role-chip-icon{width:30px;height:30px;color:var(--lw-blue);font-size:0;}
.role-chip-label{font-size:15px;font-weight:500;color:var(--lw-ink);letter-spacing:-.01em;}
.pm-chip{padding:14px 8px 12px;font-size:13px;font-weight:500;color:var(--lw-ink);}
.pm-chip .ob-ico{width:26px;height:26px;color:var(--lw-blue);margin-bottom:4px;}
.pm-chip.selected{color:var(--lw-ink);}
.eq-chip{border:1px solid var(--lw-line);border-radius:980px;font-size:14px;padding:8px 14px;color:var(--lw-ink);}
.eq-chip:hover{border-color:#86868b;color:var(--lw-ink);}
.eq-chip.selected{background:var(--lw-ink);border-color:var(--lw-ink);color:#fff;}

/* buttons in the wizard */
.btn-reg-primary{background:var(--lw-blue)!important;border-radius:980px;font-size:17px;font-weight:400;letter-spacing:-.02em;padding:13px 24px;min-height:50px;box-shadow:none!important;transition:background .2s var(--lw-ease),opacity .2s;}
.btn-reg-primary:hover{background:var(--lw-blue-hover)!important;}
.btn-reg-primary:disabled{opacity:.35;}
.btn-reg-ghost{border:0;background:rgba(0,0,0,.05);color:var(--lw-ink);border-radius:980px;font-size:17px;font-weight:400;padding:13px 24px;min-height:50px;}
.btn-reg-ghost:hover{background:rgba(0,0,0,.09);color:var(--lw-ink);}
#step-1 p a,#reg-card a{color:var(--lw-blue)!important;}

/* notes, review, terms */
.ob-note{display:flex;gap:12px;align-items:flex-start;background:var(--lw-bg);border-radius:14px;padding:14px 16px;margin-bottom:22px;font-size:14px;line-height:1.43;color:var(--lw-ink-2);}
.ob-note .ob-ico{width:20px;height:20px;color:var(--lw-blue);margin-top:1px;}
#review-rows{font-size:15px;}
.review-row{padding:13px 0;border-bottom:1px solid var(--lw-hair);}
.review-key{font-size:14px;color:var(--lw-muted);font-weight:400;}
.review-val{font-size:15px;color:var(--lw-ink);font-weight:500;}
#step-6 > div[style*="border-radius:14px"]{border:0!important;background:var(--lw-bg)!important;border-radius:18px!important;padding:6px 22px!important;}
.terms-box{background:var(--lw-bg);border:0;border-radius:14px;font-size:13px;color:var(--lw-muted);}
#reg-err{background:rgba(255,59,48,.08);border:0;color:#c9241a;border-radius:12px;font-size:14px;}

/* role picker sheet */
#role-modal-overlay{background:rgba(0,0,0,.35)!important;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);}
#role-modal{border-radius:28px 28px 0 0!important;padding:14px 24px 30px!important;}
#role-modal h3{font-size:24px!important;font-weight:600!important;letter-spacing:-.025em;color:var(--lw-ink)!important;}
#role-modal p{font-size:15px!important;color:var(--lw-muted)!important;}

/* success / pending */
#reg-success,#reg-pending{padding:24px 0 0!important;}
#reg-success h2,#reg-pending h2{font-family:var(--lw-font-display);font-size:40px!important;font-weight:600!important;letter-spacing:-.03em;line-height:1.1;color:var(--lw-ink)!important;}
#reg-success > p,#reg-pending > p{font-size:19px!important;line-height:1.42!important;color:var(--lw-muted)!important;}
#success-icon{margin:0 auto 22px!important;}
#success-next-steps{background:var(--lw-bg)!important;border:0!important;border-radius:18px!important;padding:20px 22px!important;}
#success-next-steps > div:first-child{color:var(--lw-ink)!important;font-size:15px!important;font-weight:600!important;}
#success-steps-body{color:var(--lw-ink-2)!important;font-size:15px!important;line-height:1.8!important;}
#reg-success > div[style*="f8fafc"]{background:#fff!important;border:1px solid var(--lw-line)!important;border-radius:18px!important;padding:20px 22px!important;}
#invite-email{border:1px solid var(--lw-line)!important;border-radius:12px!important;padding:11px 14px!important;font-size:15px!important;}
#reg-success button[onclick="sendTeammateInvite()"]{background:var(--lw-blue)!important;border-radius:980px!important;padding:11px 20px!important;font-weight:400!important;font-size:15px!important;}
#enterprise-cta{background:#000!important;border-radius:18px!important;padding:24px!important;}
#enterprise-cta a{border-radius:980px!important;background:var(--lw-blue)!important;font-weight:400!important;}
#reg-pending > div[style*="fefce8"]{background:var(--lw-bg)!important;border:0!important;border-radius:18px!important;}
#reg-pending > div[style*="fefce8"] div{color:var(--lw-ink-2)!important;}

/* Account under review (pending.html) */
.ob-card-list{background:var(--lw-bg);border-radius:18px;padding:6px 22px;text-align:left;margin:0 0 28px;}
.ob-card-list .row{display:flex;gap:14px;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--lw-hair);}
.ob-card-list .row:last-child{border-bottom:0;}
.ob-card-list .n{width:28px;height:28px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;background:#fff;color:var(--lw-muted);box-shadow:inset 0 0 0 1px var(--lw-line);}
.ob-card-list .n.done{background:#34c759;color:#fff;box-shadow:none;}
.ob-card-list .n.now{background:var(--lw-blue);color:#fff;box-shadow:none;}
.ob-card-list .t{font-size:15px;font-weight:600;color:var(--lw-ink);letter-spacing:-.01em;}
.ob-card-list .d{font-size:14px;color:var(--lw-muted);margin-top:2px;line-height:1.43;}

@media (max-width:640px){
  .ob-title,#reg-intro .ob-title{font-size:36px;}
  .ob-lede{font-size:19px;}
  .ob-main{padding-top:48px;}
  #reg-intro{padding-top:44px;}
  .ob-step-title{font-size:28px;}
  .field-row{grid-template-columns:1fr;}
  #role-chips{grid-template-columns:1fr!important;}
  #pm-grid{grid-template-columns:repeat(2,1fr)!important;}
}
