/* ============================================================
   ONCORR auth pages — shared branding (admin / organizer /
   agency / participant logins). Front-end only: forms, field
   names and routes are untouched by design.
   ============================================================ */
.oc-auth{position:fixed;inset:0;z-index:50;overflow:auto;font-family:'Jost',Inter,system-ui,sans-serif;
  background:linear-gradient(160deg,#0B1730 0%,#14263D 55%,#0F2440 100%);color:#1B2A44;
  -webkit-font-smoothing:antialiased}
.oc-auth *,.oc-auth *::before,.oc-auth *::after{box-sizing:border-box}

/* ambient aurora + stars (matches the homepage) */
.oc-auth .oc-aurora{position:fixed;width:620px;height:620px;right:-160px;top:-180px;border-radius:50%;
  pointer-events:none;filter:blur(70px);opacity:.5;
  background:conic-gradient(from 0deg,rgba(53,84,209,.55),rgba(127,176,240,.25),rgba(240,160,90,.4),rgba(254,201,60,.2),rgba(53,84,209,.55));
  animation:ocAAur 18s linear infinite}
.oc-auth .oc-aurora--2{width:460px;height:460px;left:-170px;right:auto;top:auto;bottom:-200px;opacity:.32;animation-duration:26s;animation-direction:reverse}
@keyframes ocAAur{0%{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(1.1)}100%{transform:rotate(360deg) scale(1)}}
.oc-auth .oc-stars{position:fixed;left:0;top:0;width:2px;height:2px;border-radius:50%;background:transparent;pointer-events:none;
  box-shadow:8vw 12vh #fff,22vw 30vh rgba(255,255,255,.7),36vw 8vh #fff,52vw 22vh rgba(255,255,255,.6),68vw 14vh #fff,84vw 32vh rgba(255,255,255,.7),14vw 60vh rgba(255,255,255,.6),44vw 74vh #fff,76vw 66vh rgba(255,255,255,.5),90vw 80vh #fff,30vw 88vh rgba(255,255,255,.6),60vw 92vh rgba(255,255,255,.7);
  animation:ocATw 3.6s ease-in-out infinite}
@keyframes ocATw{0%,100%{opacity:.9}50%{opacity:.3}}

/* layout */
.oc-auth-shell{position:relative;min-height:100%;display:grid;grid-template-columns:1.05fr .95fr;max-width:1220px;margin:0 auto;
  padding:40px 24px;gap:48px;align-items:center}
.oc-auth-brand{color:#fff;padding:20px 8px}
.oc-auth-brand .logo{height:44px;margin-bottom:34px;display:block}
.oc-auth-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#F0A05A}
.oc-auth-eyebrow::before{content:"";width:26px;height:2px;background:#F0A05A;border-radius:2px}
.oc-auth-brand h2{font-size:clamp(28px,3.2vw,40px);line-height:1.15;font-weight:800;margin:14px 0 12px;color:#fff}
.oc-auth-brand h2 em{font-style:normal;color:#FEC93C}
.oc-auth-brand p{font-size:16px;line-height:1.65;color:rgba(255,255,255,.72);max-width:440px;margin:0 0 26px}
.oc-auth-point{display:flex;gap:12px;align-items:flex-start;margin:0 0 13px;font-size:14.5px;color:rgba(255,255,255,.85)}
.oc-auth-point .tick{color:#7CE0A3;font-weight:800;line-height:1.4}
/* clearly visible pill button back to the homepage */
.oc-auth-home{
  display:inline-flex;align-items:center;gap:9px;margin-top:28px;
  color:#fff;font-size:14.5px;font-weight:700;text-decoration:none;
  background:rgba(255,255,255,.12);border:1.5px solid rgba(255,255,255,.35);
  padding:11px 20px;border-radius:100px;backdrop-filter:blur(4px);
  transition:background .2s,border-color .2s,transform .15s;
}
.oc-auth-home:hover{
  color:#0E1B33;background:#FEC93C;border-color:#FEC93C;transform:translateY(-1px);
}
/* the brand logo is a link home on every auth page */
.oc-auth-logolink{display:block;width:fit-content;margin-bottom:34px;border-radius:8px}
.oc-auth-logolink .logo{margin-bottom:0;transition:opacity .2s}
.oc-auth-logolink:hover .logo{opacity:.85}

/* floating planes on the brand panel */
.oc-auth-planes{position:relative;height:0}
.oc-auth-plane{position:absolute;cursor:pointer;transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
.oc-auth-plane svg{display:block;fill:rgba(255,255,255,.85);filter:drop-shadow(0 8px 18px rgba(0,0,0,.45));transition:fill .3s,filter .3s}
.oc-auth-plane:hover{transform:scale(1.2) rotate(-5deg)}
.oc-auth-plane:hover svg{fill:#FEC93C;filter:drop-shadow(0 0 16px rgba(254,201,60,.8))}
.oc-auth-plane--1{width:46px;height:46px;right:6%;top:-330px;animation:ocAFly 7s ease-in-out infinite}
.oc-auth-plane--1 svg{transform:rotate(45deg)}
.oc-auth-plane--2{width:30px;height:30px;right:24%;top:-120px;opacity:.7;animation:ocAFly 9s 1.4s ease-in-out infinite}
.oc-auth-plane--2 svg{transform:rotate(80deg)}
@keyframes ocAFly{0%,100%{margin-top:0}50%{margin-top:-14px}}

/* card */
.oc-auth-card{position:relative;background:#fff;border-radius:20px;padding:44px 44px 34px;
  box-shadow:0 40px 90px -30px rgba(3,10,26,.7);max-width:520px;width:100%;justify-self:end}
.oc-auth-card .panel-tag{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:#3554D1;background:rgba(53,84,209,.09);padding:6px 12px;border-radius:100px;margin-bottom:14px}
.oc-auth-card h1{font-size:27px;font-weight:800;color:#0E1B33;margin:0 0 6px;line-height:1.2}
.oc-auth-card .cap{font-size:14.5px;color:#5D6B84;margin:0 0 24px}

/* flash blocks (keep Bootstrap classes working, restyle) */
.oc-auth .alert{border:0;border-radius:12px;padding:13px 16px;font-size:14px;margin-bottom:16px}
.oc-auth .alert-danger{background:#FBE9E9;color:#B33A3A}
.oc-auth .alert-danger a{color:#B33A3A;font-weight:700}
.oc-auth .alert-success{background:#E4F5EA;color:#1F7A4D}

/* fields */
.oc-field{margin-bottom:16px;position:relative}
.oc-field label{display:block;font-size:13px;font-weight:700;letter-spacing:.02em;color:#3C4B60;margin-bottom:7px}
.oc-auth .oc-field input.form-control{display:block;width:100%;border:1.5px solid #E3E9F2;border-radius:12px;
  background:#F6F8FC;padding:14px 46px 14px 16px;font:inherit;font-size:15.5px;color:#0E1B33;outline:0;
  transition:border-color .2s,box-shadow .2s,background .2s;height:auto;box-shadow:none}
.oc-auth .oc-field input.form-control:focus{border-color:#3554D1;background:#fff;box-shadow:0 0 0 4px rgba(53,84,209,.12)}
.oc-auth .oc-field input.form-control.is-invalid{border-color:#B33A3A;background-image:none}
.oc-auth .oc-field .text-danger{display:block;margin-top:6px;font-size:13px;color:#B33A3A}
.oc-eye{position:absolute;right:14px;top:41px;cursor:pointer;color:#8A97AD;line-height:1;padding:4px}
.oc-eye:hover{color:#3554D1}
.oc-field--nolabel .oc-eye{top:15px}

/* actions */
.oc-auth-row{display:flex;justify-content:flex-end;margin:2px 0 18px}
.oc-auth-row a{font-size:14px;font-weight:600;color:#3554D1;text-decoration:none}
.oc-auth-row a:hover{text-decoration:underline}
.oc-auth button.oc-submit{display:block;width:100%;border:0;cursor:pointer;font:inherit;font-size:16px;font-weight:700;color:#0E1B33;
  background:linear-gradient(180deg,#FFD75E,#FEC93C);padding:15px;border-radius:12px;
  transition:transform .15s,box-shadow .15s;box-shadow:0 12px 26px -12px rgba(254,201,60,.75)}
.oc-auth button.oc-submit:hover{transform:translateY(-1px);box-shadow:0 16px 30px -12px rgba(254,201,60,.9)}
.oc-auth button.oc-submit:disabled{opacity:.7;transform:none;cursor:wait}
.oc-auth-alt{margin-top:20px;text-align:center;font-size:14.5px;color:#5D6B84}
.oc-auth-alt a{color:#3554D1;font-weight:700;text-decoration:none}
.oc-auth-alt a:hover{text-decoration:underline}
.oc-auth-foot{margin-top:22px;padding-top:16px;border-top:1px solid #EDF1F7;text-align:center;font-size:12.5px;color:#93A1B8}

/* responsive */
@media (max-width:980px){
  .oc-auth-shell{grid-template-columns:1fr;gap:26px;padding:28px 18px 40px;align-items:start}
  .oc-auth-brand{padding:6px 2px 0}
  .oc-auth-brand .logo{height:38px;margin-bottom:22px}
  .oc-auth-brand p{margin-bottom:16px}
  .oc-auth-point{display:none}
  .oc-auth-planes,.oc-auth-plane{display:none}
  .oc-auth-card{justify-self:stretch;max-width:100%;padding:30px 22px 26px}
  .oc-auth-home{margin-top:8px}
}
@media (max-width:420px){
  .oc-auth-card h1{font-size:23px}
}

/* accessibility: visible keyboard focus + calm mode */
.oc-eye{background:none;border:0;font:inherit}
.oc-auth a:focus-visible,.oc-auth button:focus-visible,.oc-auth .oc-field input.form-control:focus-visible{
  outline:3px solid #FEC93C;outline-offset:3px;border-radius:8px}
.oc-auth .oc-field input.form-control:focus-visible{outline-color:#3554D1}
@media (prefers-reduced-motion: reduce){
  .oc-auth .oc-aurora,.oc-auth .oc-aurora--2,.oc-auth .oc-stars,.oc-auth-plane{animation:none !important}
  .oc-auth *{transition:none !important}
}
/* heading-order: brand headline is styled like a heading but is a <p> */
.oc-auth-headline{font-size:clamp(28px,3.2vw,40px);line-height:1.15;font-weight:800;margin:14px 0 12px;color:#fff}
.oc-auth-headline em{font-style:normal;color:#FEC93C}
.oc-auth-foot{color:#7C8797}
