/*
 * CDNAPP-146: Orchestrator look for the auth screens (login, forgot/reset password).
 * Mirrors closerdesign.net (cdn-web-ui, CLOSERDS-365): dark base, brand blue #507fa2
 * (project 25 primary_color) with black text on blue buttons, white logo_light,
 * Archivo / Inter Tight type. Plain CSS so the Blade-only pages need no build step.
 */
@font-face{font-family:"Archivo";src:url("/fonts/orchestrator/archivo.woff2") format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:"Inter Tight";src:url("/fonts/orchestrator/inter-tight.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url("/fonts/orchestrator/jetbrains-mono.woff2") format("woff2");font-weight:100 800;font-display:swap}

.ox{
  --bg:#09090a; --bg2:#101012; --panel:#141416; --line:#26262a; --line2:#34343a;
  --ink:#f3f1ea; --mute:#a3a3a8; --dim:#8a8a90;
  --blue:#507fa2; --blue-hi:#6893b4; --blue-text:#8fb6d4; --on-blue:#000000;
  --err:#ff6b55; --ok:#7fd1a4;
  --display:"Archivo","Arial Narrow",Impact,sans-serif;
  --sans:"Inter Tight","Helvetica Neue",Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
  box-sizing:border-box; min-height:100vh; width:100%;
  display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
  background:var(--bg); color:var(--ink); font-family:var(--sans);
  -webkit-font-smoothing:antialiased;
}
.ox *,.ox *::before,.ox *::after{box-sizing:border-box}
.ox a{color:var(--blue-text)}
.ox a:hover{color:var(--ink)}
.ox :focus-visible{outline:2px solid var(--blue-text);outline-offset:3px}

/* Left: the Orchestrator statement */
.ox-side{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;gap:48px;
  padding:clamp(28px,5vw,64px);border-right:1px solid var(--line);
  background:
    radial-gradient(900px 520px at -10% 110%,rgba(80,127,162,.28),transparent 60%),
    linear-gradient(var(--bg2),var(--bg))}
.ox-side::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:64px 64px;mask-image:linear-gradient(180deg,transparent,#000 35%,#000 70%,transparent)}
.ox-side>*{position:relative;z-index:1}
.ox-logo{display:block;height:34px;width:auto}
.ox-eyebrow{font-family:var(--mono);font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue-text);margin:0 0 22px}
.ox-eyebrow::before{content:"";display:inline-block;width:8px;height:8px;background:var(--blue);margin-right:10px;vertical-align:1px}
.ox-headline{font-family:var(--display);font-stretch:85%;font-weight:800;text-transform:uppercase;
  font-size:clamp(44px,6.2vw,92px);line-height:.92;letter-spacing:-.01em;margin:0}
.ox-headline em{font-style:normal;color:var(--blue-text)}
.ox-sub{max-width:34em;margin:26px 0 0;font-size:clamp(16px,1.35vw,19px);line-height:1.5;color:var(--mute)}
.ox-back{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:13px;letter-spacing:.06em;text-decoration:none}
.ox-back:hover{text-decoration:underline}

/* Right: the sign-in card */
.ox-main{display:flex;align-items:center;justify-content:center;padding:clamp(24px,5vw,64px)}
.ox-card{width:100%;max-width:440px;background:var(--panel);border:1px solid var(--line2);border-radius:4px;
  padding:clamp(24px,3.4vw,40px);box-shadow:0 30px 80px -40px rgba(0,0,0,.9)}
.ox-card h1,.ox-card .ox-title{font-family:var(--display);font-stretch:90%;font-weight:800;font-size:30px;line-height:1.05;
  text-transform:uppercase;letter-spacing:.005em;margin:0 0 6px;color:var(--ink)}
.ox-lede{margin:0 0 26px;color:var(--mute);font-size:15px;line-height:1.5}
.ox-field{margin:0 0 18px}
.ox-label{display:block;font-size:13.5px;font-weight:600;color:var(--ink);margin:0 0 8px;letter-spacing:.01em}
.ox-labelrow{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.ox-input{display:block;width:100%;height:50px;padding:0 14px;font:500 16px/1 var(--sans);color:var(--ink);
  background:var(--bg);border:1px solid var(--line2);border-radius:3px;transition:border-color .15s,box-shadow .15s}
.ox-input::placeholder{color:var(--dim)}
.ox-input:hover{border-color:#4a4a52}
.ox-input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(80,127,162,.35)}
.ox-input[aria-invalid="true"]{border-color:var(--err)}
.ox-input:-webkit-autofill{-webkit-text-fill-color:var(--ink);-webkit-box-shadow:0 0 0 40px var(--bg) inset;caret-color:var(--ink)}
.ox-link{background:none;border:0;padding:0;cursor:pointer;font:500 13.5px var(--sans);color:var(--blue-text);text-decoration:none}
.ox-link:hover{color:var(--ink);text-decoration:underline}
.ox-check{display:flex;align-items:center;gap:10px;margin:0 0 20px;font-size:14px;color:var(--mute)}
.ox-check input{width:18px;height:18px;accent-color:var(--blue)}
.ox-btn{display:flex;width:100%;align-items:center;justify-content:center;gap:12px;height:54px;padding:0 22px;
  font:700 16.5px var(--sans);letter-spacing:.01em;color:var(--on-blue);background:var(--blue);border:0;border-radius:2px;cursor:pointer;
  text-decoration:none;box-shadow:4px 4px 0 0 #000,4px 4px 0 1px var(--line2);transition:transform .15s,background .15s,box-shadow .15s}
.ox-btn:hover{background:var(--blue-hi);transform:translate(-1px,-1px);box-shadow:5px 5px 0 0 #000,5px 5px 0 1px var(--line2)}
.ox-btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 0 #000}
.ox-btn[disabled]{opacity:.6;cursor:progress}
.ox-btn .ox-arr{font-family:var(--mono);font-weight:500}
.ox-alert{border:1px solid;border-radius:3px;padding:12px 14px;margin:0 0 20px;font-size:14px;line-height:1.45}
.ox-alert ul{margin:0;padding-left:18px}
.ox-alert--err{border-color:rgba(255,107,85,.55);background:rgba(255,107,85,.08);color:#ffb3a6}
.ox-alert--ok{border-color:rgba(127,209,164,.5);background:rgba(127,209,164,.08);color:#bfeed3}
.ox-help{display:block;margin-top:7px;font-size:13px;color:#ffb3a6}
.ox-divider{display:flex;align-items:center;gap:14px;margin:26px 0 14px;color:var(--dim);font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase}
.ox-divider::before,.ox-divider::after{content:"";flex:1;height:1px;background:var(--line)}
.ox-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 18px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line);font-size:13.5px}
.ox-foot a,.ox-foot .ox-link{font-size:13.5px}
.ox-ghost{display:flex;width:100%;align-items:center;justify-content:center;height:48px;font:600 15px var(--sans);
  color:var(--ink);background:transparent;border:1px solid var(--line2);border-radius:2px;cursor:pointer;text-decoration:none}
.ox-ghost:hover{border-color:var(--blue);color:var(--ink)}

@media (max-width:900px){
  .ox{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr}
  .ox-side{border-right:0;border-bottom:1px solid var(--line);gap:26px;padding:22px 20px 28px}
  .ox-side .ox-back--side{display:none}
  .ox-logo{height:26px}
  .ox-eyebrow{margin-bottom:14px;font-size:11.5px}
  .ox-headline{font-size:clamp(38px,11vw,56px)}
  .ox-sub{margin-top:14px;font-size:15px}
  .ox-main{align-items:flex-start;padding:24px 16px 40px}
  .ox-card{padding:24px 20px}
}
@media (prefers-reduced-motion:reduce){.ox *{transition:none!important}}

/* Presentia product wordmark + Closer Design credit */
.ox-brand{display:inline-flex;flex-direction:column;gap:6px;text-decoration:none;color:var(--ink)}
.ox-brand:hover{color:var(--ink)}
.ox-word{font-family:var(--display);font-stretch:88%;font-weight:800;font-size:34px;line-height:1;letter-spacing:-.01em;color:var(--ink)}
.ox-word i{font-style:normal;color:var(--blue-text)}
.ox-tag{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.ox-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 24px}
.ox-credit{display:inline-flex;align-items:center;gap:10px;font-size:13px;color:var(--mute);text-decoration:none}
.ox-credit img{height:20px;width:auto;display:block}
@media (max-width:900px){
  .ox-word{font-size:28px}
  .ox-tag{font-size:11px}
  .ox-bottom{display:none}
  .ox-credit--card{display:inline-flex}
}
.ox-credit--card{display:none;margin-top:18px}
@media (max-width:900px){.ox-credit--card{display:inline-flex}}