/* Best Deal Forex — customer account pages (login, register, dashboard, reset).
   Leans on the design tokens in global.css. */

.auth-page{background:var(--off-white);padding:44px 0 72px;min-height:72vh}
.auth-wrap{max-width:460px;margin:0 auto;padding:0 16px}
.acct-wrap{max-width:900px;margin:0 auto;padding:0 16px}

.auth-card{background:var(--white);border:1px solid rgba(0,0,0,.08);border-radius:16px;
  box-shadow:0 6px 26px rgba(6,26,46,.08);padding:30px 28px}
.auth-brand{display:flex;justify-content:center;margin-bottom:6px}
.auth-brand img{height:38px}
.auth-title{font-family:'Syne',sans-serif;font-weight:800;color:var(--navy);font-size:1.4rem;text-align:center;margin:8px 0 4px}
.auth-sub{text-align:center;color:var(--text-mid);font-size:.9rem;line-height:1.55;margin-bottom:22px}

.pw-wrap{position:relative}
.pw-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:0;
  cursor:pointer;font-size:.78rem;font-weight:700;color:var(--blue);padding:4px}

.btn-full{width:100%;justify-content:center;margin-top:4px}

.auth-alt{margin-top:18px;text-align:center;font-size:.86rem;color:var(--text-mid)}
.auth-alt a{color:var(--blue);font-weight:700;text-decoration:none}
.auth-alt a:hover{text-decoration:underline}
.auth-row{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:-4px;margin-bottom:14px}
.auth-row a{font-size:.82rem;color:var(--blue);font-weight:600;text-decoration:none}

.msg{margin-top:14px;font-size:.86rem;line-height:1.5;padding:11px 13px;border-radius:9px;display:none}
.msg.show{display:block}
.msg.err{background:rgba(220,38,38,.07);color:#991b1b;border:1px solid rgba(220,38,38,.2)}
.msg.ok{background:rgba(5,150,105,.08);color:#065f46;border:1px solid rgba(5,150,105,.22)}

/* Dashboard */
.acct-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.acct-hello{font-family:'Syne',sans-serif;font-weight:800;color:var(--navy);font-size:1.5rem}
.acct-hello span{color:var(--gold)}
.acct-sub{color:var(--text-mid);font-size:.9rem;margin-top:3px}
.acct-grid{display:grid;grid-template-columns:1fr 2fr;gap:18px;align-items:start}
.acct-card{background:var(--white);border:1px solid rgba(0,0,0,.08);border-radius:14px;
  box-shadow:0 4px 18px rgba(6,26,46,.06);padding:20px}
.acct-card h2{font-family:'Syne',sans-serif;font-weight:700;color:var(--navy);font-size:1rem;margin:0 0 14px}
.prof-row{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid rgba(0,0,0,.06);font-size:.88rem}
.prof-row:last-of-type{border-bottom:0}
.prof-row .k{color:var(--text-muted)}
.prof-row .v{color:var(--navy);font-weight:600;text-align:right;word-break:break-word}
.badge-unverified{display:inline-block;font-size:.66rem;font-weight:700;color:#92400e;background:rgba(217,119,6,.12);border-radius:20px;padding:2px 9px;margin-left:6px}

.ord-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 0;border-bottom:1px solid rgba(0,0,0,.06)}
.ord-row:last-child{border-bottom:0}
.ord-main .oid{font-family:monospace;font-weight:700;color:var(--navy);font-size:.9rem}
.ord-main .ometa{font-size:.78rem;color:var(--text-muted);margin-top:3px}
.ord-right{text-align:right;white-space:nowrap}
.ord-amt{font-weight:800;color:var(--navy);font-size:.92rem}
.ost{display:inline-block;font-size:.68rem;font-weight:700;border-radius:20px;padding:3px 10px;margin-top:4px;text-transform:capitalize}
.ost.confirmed,.ost.completed,.ost.ready,
.ost.payment_verified,.ost.compliance_approved{background:rgba(5,150,105,.12);color:#065f46}
.ost.awaiting_payment,.ost.payment_reported,.ost.processing,.ost.pending,
.ost.kyc_only{background:rgba(217,119,6,.12);color:#92400e}
/* Refused, lapsed or reversed — an outcome rather than a step toward completion. */
.ost.cancelled,.ost.expired,.ost.rejected,.ost.refunded{background:rgba(220,38,38,.09);color:#991b1b}
.ord-empty{text-align:center;color:var(--text-mid);font-size:.9rem;padding:24px 0}

.acct-card .card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.acct-card .card-top h2{margin:0}
.link-btn{background:none;border:0;cursor:pointer;color:var(--blue);font-weight:700;font-size:.82rem;padding:2px 4px}
.mini-btn{display:inline-flex;align-items:center;gap:6px;background:var(--navy);color:#fff;border:0;border-radius:8px;
  font-weight:700;font-size:.78rem;padding:8px 14px;cursor:pointer}
.mini-btn.ghost{background:transparent;color:var(--text-mid);border:1.5px solid rgba(0,0,0,.15)}
.mini-btn:disabled{opacity:.55;cursor:default}
.verify-btn{background:rgba(217,119,6,.14);color:#92400e;border:0;border-radius:20px;font-size:.68rem;font-weight:700;
  padding:3px 10px;margin-left:6px;cursor:pointer}
.acct-form .field{margin-bottom:12px}
.form-actions{display:flex;gap:8px;margin-top:6px}
.cardsep{height:1px;background:rgba(0,0,0,.07);margin:18px 0}

@media(max-width:720px){.acct-grid{grid-template-columns:1fr}}

/* ---- Customer portal (/portal/) ------------------------------------------
   The signed-out card carries Sign In / Create Account; the signed-in view
   carries Get Quote / Track Order. Both use the same pill tab strip. */
.portal-wrap{max-width:1020px;margin:0 auto;padding:0 18px}
.portal-wrap.narrow{max-width:470px}

.ptabs{display:flex;gap:6px;background:rgba(0,0,0,.045);border-radius:12px;padding:5px;margin-bottom:22px}
.ptab{flex:1;border:0;background:transparent;cursor:pointer;font-family:inherit;font-weight:700;
  font-size:.85rem;color:var(--text-mid);padding:10px 8px;border-radius:9px;transition:.16s}
.ptab:hover{color:var(--navy)}
.ptab.on{background:var(--white);color:var(--navy);box-shadow:0 1px 4px rgba(0,0,0,.1)}
.ppane[hidden]{display:none}

.portal-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.portal-who{font-size:.88rem;color:var(--text-mid)}
.portal-who b{color:var(--navy)}
.portal-bar-links{display:flex;gap:14px;align-items:center}
.portal-bar-links a,.portal-bar-links button{font-size:.82rem;font-weight:700;color:var(--blue);
  text-decoration:none;background:none;border:0;cursor:pointer;font-family:inherit;padding:0}
.portal-bar-links a:hover,.portal-bar-links button:hover{text-decoration:underline}

.pcols{display:grid;grid-template-columns:1fr 340px;gap:22px;align-items:start}
.pcard{background:var(--white);border:1px solid rgba(0,0,0,.08);border-radius:16px;
  box-shadow:0 8px 26px rgba(11,60,93,.07);padding:24px}
.pcard h2{margin:0 0 4px;font-size:1.05rem;color:var(--navy)}
.pcard .sub{font-size:.83rem;color:var(--text-mid);margin:0 0 16px}
.pgrid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}

/* Signed-up-but-unverified and other inline notices. */
.pnote{font-size:.82rem;line-height:1.55;background:rgba(11,60,93,.05);border:1px solid rgba(11,60,93,.12);
  border-radius:10px;padding:11px 13px;color:var(--text-mid);margin-bottom:16px}

/* OTP entry: one wide, letter-spaced box reads better than six small ones. */
.otp-input{letter-spacing:.5em;text-align:center;font-size:1.25rem;font-weight:700}
.otp-meta{display:flex;justify-content:space-between;align-items:center;font-size:.8rem;margin-top:8px}
.otp-meta button{background:none;border:0;color:var(--blue);font-weight:700;cursor:pointer;font-family:inherit;padding:0}
.otp-meta button:disabled{color:var(--text-mid);cursor:default}

@media(max-width:860px){.pcols{grid-template-columns:1fr}}
@media(max-width:520px){.pgrid2{grid-template-columns:1fr}}