/* Auth pages shared CSS — exact copy from reference design */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --blue:#2563EB;--blue-d:#1D4ED8;--blue-l:#3B82F6;
  --orange:#2563EB;--orange-d:#1D4ED8;
  --white:#fff;--bg-card:rgba(255,255,255,0.90);
  --text:#0F172A;--muted:#64748B;--label:#475569;
  --border:#E2E8F0;
}
html,body{height:100%;font-family:'Manrope','Plus Jakarta Sans',sans-serif;color:var(--text);overflow:hidden}
/* Blue Shipment page background: white -> light blue diagonal gradient, soft glow top-right */
body{background:radial-gradient(1200px 700px at 110% -10%, #DCE9FF 0%, rgba(220,233,255,0) 55%), linear-gradient(135deg,#FFFFFF 0%,#F2F7FF 60%,#E6F0FF 100%);}
#bg{display:none !important}
/* Faint square grid overlay — mimics blueshipment.nl marketing page */
.dots{position:fixed;inset:0;z-index:1;pointer-events:none;background-image:linear-gradient(to right, rgba(37,99,235,.055) 1px, transparent 1px),linear-gradient(to bottom, rgba(37,99,235,.055) 1px, transparent 1px);background-size:44px 44px;mask-image:radial-gradient(ellipse 90% 80% at 50% 40%, #000 55%, transparent 100%);-webkit-mask-image:radial-gradient(ellipse 90% 80% at 50% 40%, #000 55%, transparent 100%)}
.wrap{position:relative;z-index:2;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.card{width:100%;max-width:440px;background:var(--bg-card);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border:1px solid rgba(255,255,255,.9);border-radius:24px;padding:44px 42px 40px;box-shadow:0 24px 64px rgba(37,99,235,.16),0 4px 20px rgba(0,0,0,.08);animation:up .55s cubic-bezier(.22,1,.36,1) both}
@keyframes up{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}
.logo-wrap{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:28px}
.logo-wrap .logo-icon{height:40px;width:40px;flex-shrink:0}
.logo-wrap .logo-text{font-family:'Manrope','Plus Jakarta Sans',sans-serif;font-size:26px;font-weight:800;letter-spacing:-0.03em;color:#0B0B0F;line-height:1}
.logo-wrap .logo-blue{color:var(--blue)}
.bar{width:38px;height:3px;background:var(--blue);border-radius:99px;margin:0 auto 24px}
.heading{min-height:2.6rem;text-align:center;font-size:1.5rem;font-weight:800;letter-spacing:-.03em;margin-bottom:6px;overflow:hidden;position:relative}
.msg{display:block;animation:slide .45s cubic-bezier(.22,1,.36,1) both}
@keyframes slide{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.msg .accent{color:var(--blue);font-weight:800}
.sub{font-size:.88rem;color:var(--muted);text-align:center;margin-bottom:28px;line-height:1.55}
.field{margin-bottom:16px}
label{display:block;font-size:.75rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--label);margin-bottom:7px}
.iw{position:relative}
.ico{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#94A3B8;pointer-events:none;transition:color .2s}
.iw:focus-within .ico{color:var(--blue)}
input[type=text],input[type=password],input[type=email]{width:100%;height:50px;padding:0 44px 0 42px;border:1.5px solid var(--border);border-radius:12px;background:rgba(255,255,255,.8);font-family:'Manrope','Plus Jakarta Sans',sans-serif;font-size:.93rem;font-weight:500;color:var(--text);outline:none;transition:border-color .2s,box-shadow .2s,background .2s}
input::placeholder{color:#CBD5E1}
input:focus{border-color:var(--blue);background:#fff;box-shadow:0 0 0 4px rgba(37,99,235,.1)}
.eye{position:absolute;right:13px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:#94A3B8;padding:4px;display:flex;transition:color .2s}
.eye:hover{color:var(--blue)}
.extras{display:flex;align-items:center;justify-content:space-between;margin:18px 0 26px}
.rem{display:flex;align-items:center;gap:9px;cursor:pointer;user-select:none;font-size:.875rem;color:var(--muted)}
.rem input{display:none}
.cb{width:18px;height:18px;border:1.5px solid var(--border);border-radius:5px;background:rgba(255,255,255,.8);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .18s}
.rem input:checked~.cb{background:var(--blue);border-color:var(--blue)}
.cb svg{opacity:0;transition:opacity .15s}
.rem input:checked~.cb svg{opacity:1}
.forgot{font-size:.875rem;color:var(--blue);text-decoration:none;font-weight:600;transition:color .2s}
.forgot:hover{color:var(--blue-d)}
.btn{width:100%;height:58px;border:none;border-radius:9999px;background:var(--blue);color:#fff;font-family:'Manrope','Plus Jakarta Sans',sans-serif;font-weight:800;font-size:1.05rem;letter-spacing:-0.01em;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 8px 28px rgba(37,99,235,.35),inset 0 1px 0 rgba(255,255,255,.2);transition:background .18s,transform .14s,box-shadow .18s;position:relative;overflow:hidden}
.btn::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.12) 0%,transparent 60%);pointer-events:none}
.btn:hover{background:var(--blue-d);transform:translateY(-2px);box-shadow:0 14px 36px rgba(37,99,235,.45)}
.btn:active{transform:translateY(0)}
.btn:disabled{opacity:.6;cursor:not-allowed;transform:none}
.btn.loading .bl{opacity:0}
.btn.loading .sp{display:block}
.sp{display:none;position:absolute;width:20px;height:20px;border:2.5px solid rgba(255,255,255,.25);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.foot{text-align:center;margin-top:20px;font-size:.82rem;color:var(--muted)}
.foot a{color:var(--blue);text-decoration:none;font-weight:600}
.trust{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:24px;padding-top:20px;border-top:1px solid rgba(226,232,240,.6)}
.ti{display:flex;align-items:center;gap:5px;font-size:.72rem;color:#94A3B8;font-weight:600}
.ti svg{width:11px;height:11px;color:var(--blue)}
.alert{padding:12px 16px;border-radius:10px;font-size:.85rem;margin-bottom:16px;display:flex;align-items:center;gap:8px}
.alert-error{background:#FEF2F2;border:1px solid #FECACA;color:#DC2626}
.alert-success{background:#F0FDF4;border:1px solid #BBF7D0;color:#16A34A}