/* =========================================================
   JOSS Ops Portal — shared design system
   Brand: Joss Search 2025 — bright pink #E82D83 / maroon #5D0E39 on clean white. Archivo headlines, Plus Jakarta Sans body.
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@500;600;700;800;900&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root{
  --font:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --display:'Archivo',var(--font);
  --ink:#16181d; --slate:#33373f; --muted:#71757e; --faint:#a4a8b0;
  --brand:#0A5BC4; --brand-dark:#08479A; --brand-deep:#5D0E39; --brand-soft:#E7F0FE; --brand-line:#B7D4F8;
  --canvas:#f4f3f6; --surface:#ffffff; --line:#ebe9f0; --line-soft:#f3f1f7;

  /* status palette (spec #279) */
  --st-available:#16a34a;  --st-available-bg:#e8f8ee;  --st-available-line:#bbf0cc;
  --st-oncall:#0d9488;     --st-oncall-bg:#e1f5f3;     --st-oncall-line:#b6e6e0;
  --st-selected:#d97706;   --st-selected-bg:#fef6e0;   --st-selected-line:#fae3a8;
  --st-submitted:#dc2626;  --st-submitted-bg:#fdecec;  --st-submitted-line:#f7c9c9;
  --st-interview:#e11d48;  --st-interview-bg:#fde7ec;  --st-interview-line:#f7c2cf;
  --st-placed:#64748b;     --st-placed-bg:#eef1f5;     --st-placed-line:#d6dce4;
  --st-unavailable:#334155;--st-unavailable-bg:#e7e9ee;--st-unavailable-line:#c8cdd7;
  --st-holiday:#9aa0a8;

  --r:16px; --r-sm:11px; --r-lg:22px;
  --sh-1:0 1px 2px rgba(10,45,110,.05),0 2px 6px rgba(10,45,110,.05);
  --sh-2:0 12px 34px rgba(10,45,110,.12);
  --sh-pop:0 28px 70px rgba(22,24,29,.26);
  --ring:0 0 0 4px rgba(10,91,196,.16);
}
*{box-sizing:border-box;}html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;scroll-behavior:smooth;}
html,body{margin:0;}
body{font-family:var(--font);color:var(--slate);background:var(--canvas);min-height:100vh;
  background-image:
    radial-gradient(900px 460px at 100% -10%,rgba(232,45,131,.10),transparent 60%),
    radial-gradient(760px 380px at -6% 2%,rgba(10,91,196,.09),transparent 55%),radial-gradient(720px 420px at 46% 112%,rgba(13,148,136,.07),transparent 62%);
  background-attachment:fixed;}
a{color:inherit;}
::selection{background:var(--brand-soft);}

/* ---------- Top nav ---------- */
.jp-nav{position:sticky;top:0;z-index:60;display:flex;align-items:center;gap:18px;padding:14px 26px;
  background:rgba(255,255,255,.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);}
.jp-nav::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:linear-gradient(90deg,transparent,var(--brand) 25%,#E82D83 50%,#0d9488 75%,transparent);
  background-size:220% 100%;animation:jpSheen 8s linear infinite;opacity:.55;}
@keyframes jpSheen{from{background-position:220% 0;}to{background-position:-220% 0;}}
.jp-brand{display:flex;align-items:center;gap:12px;flex-shrink:0;text-decoration:none;}
.jp-logo{width:42px;height:42px;border-radius:13px;display:flex;align-items:center;justify-content:center;
  background:var(--ink);color:#fff;font-family:var(--display);font-weight:900;font-size:15px;letter-spacing:-.5px;
  box-shadow:0 8px 18px rgba(22,24,29,.3);position:relative;}
.jp-logo::after{content:"";position:absolute;right:6px;bottom:6px;width:6px;height:6px;border-radius:50%;background:#E82D83;box-shadow:0 0 0 2px var(--ink);}
.jp-brand h1{font-family:var(--display);font-size:16px;font-weight:800;color:var(--ink);margin:0;letter-spacing:-.4px;line-height:1;}
.jp-brand p{margin:3px 0 0;font-size:10.5px;color:var(--muted);font-weight:600;letter-spacing:.2px;}
.jp-tabs{display:flex;gap:3px;background:var(--canvas);border:1px solid var(--line);border-radius:13px;padding:4px;}
.jp-tab{display:inline-flex;align-items:center;gap:8px;border:none;background:transparent;cursor:pointer;
  padding:9px 15px;border-radius:9px;font-family:var(--font);font-size:13px;font-weight:700;color:var(--muted);
  text-decoration:none;transition:all .14s;letter-spacing:-.1px;white-space:nowrap;}
.jp-tab svg{width:16px;height:16px;}
.jp-tab:hover{color:var(--brand-dark);background:var(--brand-soft);}
.jp-tab.active{background:linear-gradient(135deg,#2E7BE0,var(--brand));color:#fff;box-shadow:0 5px 14px rgba(10,91,196,.35);}
.jp-nav-sp{flex:1;}
.jp-region{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 13px;border:1px solid var(--line);border-radius:11px;background:#fff;font-size:12.5px;font-weight:700;color:var(--slate);}
.jp-region .flag{width:20px;height:14px;border-radius:3px;overflow:hidden;display:inline-block;box-shadow:0 0 0 1px rgba(0,0,0,.06);}
.jp-iconbtn{width:42px;height:42px;border:1px solid var(--line);background:#fff;border-radius:12px;cursor:pointer;color:var(--slate);display:inline-flex;align-items:center;justify-content:center;transition:all .14s;}
.jp-iconbtn svg{width:18px;height:18px;}
.jp-iconbtn:hover{border-color:var(--brand);color:var(--brand);}
.jp-user{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:#E82D83;color:#fff;font-family:var(--display);font-weight:800;font-size:14px;box-shadow:0 6px 16px rgba(232,45,131,.35);cursor:pointer;user-select:none;}

/* ---------- User menu dropdown ---------- */
.jp-user-wrap{position:relative;}
.jp-user-dd{display:none;position:absolute;top:calc(100% + 10px);right:0;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 28px rgba(20,25,40,.14),0 3px 8px rgba(20,25,40,.06);min-width:180px;padding:6px;z-index:500;}
.jp-user-dd.open{display:block;}
.jp-user-dd-name{padding:10px 12px 4px;font-size:12.5px;font-weight:800;color:var(--ink);font-family:var(--display);}
.jp-user-dd-email{padding:0 12px 8px;font-size:11px;color:var(--muted);font-weight:600;border-bottom:1px solid var(--line-soft);margin-bottom:6px;word-break:break-all;}
.jp-user-dd-item{display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:8px;font-size:13px;font-weight:700;color:#D14343;cursor:pointer;transition:background .12s;}
.jp-user-dd-item:hover{background:#FDEEEE;}
.jp-user-dd-item svg{width:16px;height:16px;flex-shrink:0;}
/* ---------- Cards / shells ---------- */
.jp-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-1);}
.jp-h{font-family:var(--display);font-size:14px;font-weight:800;color:var(--ink);letter-spacing:-.2px;text-transform:uppercase;}
.jp-sub{font-size:11px;color:var(--faint);font-weight:600;}

/* ---------- Buttons ---------- */
.jp-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 16px;border:1px solid var(--line);border-radius:11px;background:#fff;font-family:var(--font);font-size:13px;font-weight:700;color:var(--slate);cursor:pointer;transition:all .14s;letter-spacing:-.1px;text-decoration:none;}
.jp-btn svg{width:16px;height:16px;}
.jp-btn:hover{border-color:var(--brand-line);color:var(--brand-dark);background:var(--brand-soft);transform:translateY(-1px);box-shadow:0 6px 14px rgba(10,91,196,.12);}
.jp-btn-primary{background:#5D0E39;border-color:#5D0E39;color:#fff;box-shadow:0 10px 24px rgba(93,14,57,.30);}
.jp-btn-primary:hover{background:#7A1349;border-color:#7A1349;color:#fff;transform:translateY(-1px);}
.jp-btn-dark{background:var(--ink);border-color:var(--ink);color:#fff;}
.jp-btn-dark:hover{background:#000;color:#fff;}
.jp-btn-sm{height:34px;padding:0 12px;font-size:12px;border-radius:9px;}

/* ---------- Badges ---------- */
.jp-badge{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;line-height:1;padding:5px 10px;border-radius:20px;border:1px solid transparent;white-space:nowrap;}
.jp-badge .dot{width:7px;height:7px;border-radius:50%;background:currentColor;flex-shrink:0;}
.b-available{background:var(--st-available-bg);color:var(--st-available);border-color:var(--st-available-line);}
.b-oncall{background:var(--st-oncall-bg);color:var(--st-oncall);border-color:var(--st-oncall-line);}
.b-selected{background:var(--st-selected-bg);color:var(--st-selected);border-color:var(--st-selected-line);}
.b-submitted{background:var(--st-submitted-bg);color:var(--st-submitted);border-color:var(--st-submitted-line);}
.b-interview{background:var(--st-interview-bg);color:var(--st-interview);border-color:var(--st-interview-line);}
.b-placed{background:var(--st-placed-bg);color:var(--st-placed);border-color:var(--st-placed-line);}
.b-unavailable{background:var(--st-unavailable-bg);color:var(--st-unavailable);border-color:var(--st-unavailable-line);}
.b-vetted{background:var(--st-available-bg);color:var(--st-available);border-color:var(--st-available-line);}
.b-notvetted{background:#f1f2f5;color:#71757e;border-color:#e4e5ea;}

/* ---------- Avatars ---------- */
.jp-av{border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-family:var(--display);font-weight:800;flex-shrink:0;letter-spacing:-.3px;box-shadow:0 3px 8px rgba(22,24,29,.16);overflow:hidden;}
.av-0{background:linear-gradient(135deg,#E82D83,#5D0E39);}
.av-1{background:linear-gradient(135deg,#3a3e48,#16181d);}
.av-2{background:linear-gradient(135deg,#4C8FE0,#0A5BC4);}
.av-3{background:linear-gradient(135deg,#A44E71,#5D0E39);}
.av-4{background:linear-gradient(135deg,#00B57F,#00A070);}
.av-5{background:linear-gradient(135deg,#8FC0F2,#0A5BC4);}

/* ---------- Form controls ---------- */
.jp-input{width:100%;height:42px;padding:0 13px;border:1px solid var(--line);border-radius:11px;background:#fff;font-family:var(--font);font-size:13.5px;font-weight:500;color:var(--ink);outline:none;transition:all .14s;}
.jp-input::placeholder{color:var(--faint);}
.jp-input:focus{border-color:var(--brand);box-shadow:var(--ring);}
.jp-search{position:relative;}
.jp-search svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--faint);pointer-events:none;}
.jp-search .jp-input{padding-left:38px;}
.jp-label{font-size:10.5px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--faint);display:block;margin-bottom:7px;}

/* ---------- Toast ---------- */
.jp-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);z-index:400;background:var(--ink);color:#fff;font-size:13px;font-weight:700;padding:13px 20px;border-radius:13px;box-shadow:var(--sh-pop);opacity:0;pointer-events:none;transition:all .22s;display:flex;align-items:center;gap:9px;max-width:90vw;}
.jp-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.jp-toast::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--brand);flex-shrink:0;}
.jp-toast.err::before{background:#ff5a5a;}

/* ---------- Scrollbars ---------- */
*::-webkit-scrollbar{width:10px;height:10px;}
*::-webkit-scrollbar-thumb{background:#dcdae2;border-radius:20px;border:3px solid transparent;background-clip:content-box;}
*::-webkit-scrollbar-thumb:hover{background:#c3c0cc;background-clip:content-box;}

/* ---------- Status legend ---------- */
.jp-legend{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.jp-legi{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:700;color:var(--muted);}
.jp-legi .sw{width:13px;height:13px;border-radius:4px;flex-shrink:0;}

@media (max-width:1100px){
  .jp-tabs{order:3;width:100%;overflow-x:auto;}
  .jp-nav{flex-wrap:wrap;}
}@media (max-width:560px){
  .jp-nav{padding:10px 12px;gap:10px;}
  .jp-brand h1{font-size:14px;}
  .jp-brand p{display:none;}
  .jp-logo{width:36px;height:36px;font-size:13px;border-radius:11px;}
  .jp-iconbtn,.jp-user{width:36px;height:36px;border-radius:10px;}
  .jp-region{height:34px;padding:0 10px;font-size:11.5px;}
  .jp-tab{padding:8px 12px;font-size:12px;}
  .jp-tab svg{width:15px;height:15px;}
}

/* ---------- Global search overlay (omni) ---------- */
.jp-omni{position:fixed;inset:0;z-index:300;background:rgba(22,24,29,.34);backdrop-filter:blur(3px);display:flex;justify-content:center;align-items:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .16s;}
.jp-omni.show{opacity:1;pointer-events:auto;}
.jp-omni-card{width:620px;max-width:90vw;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--sh-pop);overflow:hidden;display:flex;flex-direction:column;max-height:74vh;transform:none;margin:0;transition:none;}
.jp-omni.show .jp-omni-card{transform:none;}
.jp-omni-h{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line-soft);}
.jp-omni-h svg{width:19px;height:19px;color:var(--faint);flex-shrink:0;}
.jp-omni-h input{flex:1;border:none;outline:none;background:transparent;font-family:var(--font);font-size:16px;font-weight:600;color:var(--ink);}
.jp-omni-h input::placeholder{color:var(--faint);font-weight:500;}
.jp-omni-h kbd{font-family:var(--font);font-size:10.5px;font-weight:800;color:var(--muted);background:var(--canvas);border:1px solid var(--line);border-radius:6px;padding:3px 7px;}
.jp-omni-results{overflow:auto;padding:8px;}
.jp-omni-group{font-size:10px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--faint);padding:11px 10px 5px;}
.jp-omni-row{display:flex;align-items:center;gap:11px;padding:9px 10px;border-radius:11px;cursor:pointer;transition:background .12s;}
.jp-omni-row:hover{background:var(--brand-soft);}
.jp-omni-dot{width:11px;height:11px;border-radius:50%;flex-shrink:0;margin:0 9px;box-shadow:0 0 0 3px rgba(0,0,0,.03);}
.jp-omni-tx{flex:1;min-width:0;}
.jp-omni-t{font-family:var(--display);font-size:13.5px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.jp-omni-s{font-size:11.5px;color:var(--muted);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px;}
.jp-omni-k{font-size:10px;font-weight:800;color:var(--muted);background:var(--canvas);border:1px solid var(--line);border-radius:20px;padding:3px 9px;flex-shrink:0;}
.jp-omni-empty{padding:34px 16px;text-align:center;color:var(--faint);font-size:13px;font-weight:600;}

/* ---------- Mercury hover link card (shared) ---------- */
.jp-merc{position:fixed;z-index:560;background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:var(--sh-pop);padding:6px;min-width:248px;max-width:300px;opacity:0;pointer-events:none;transform:translateY(5px);transition:opacity .12s,transform .12s;}
.jp-merc.show{opacity:1;transform:none;pointer-events:auto;}
.jp-merc-sec{font-size:9.5px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--faint);padding:8px 9px 4px;display:flex;align-items:center;gap:6px;}
.jp-merc-sec .sw{width:8px;height:8px;border-radius:2px;}
.jp-merc-lk{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:9px;cursor:pointer;transition:background .12s;text-decoration:none;}
.jp-merc-lk:hover{background:var(--brand-soft);}
.jp-merc-lk .ic{width:24px;height:24px;border-radius:7px;background:var(--brand-soft);color:var(--brand-dark);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.jp-merc-lk .ic svg{width:13px;height:13px;}
.jp-merc-lk .tx{flex:1;min-width:0;}
.jp-merc-lk .t{font-size:12px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.jp-merc-lk .s{font-size:10.5px;color:var(--muted);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px;}
.jp-merc-lk .ar{width:13px;height:13px;color:var(--faint);flex-shrink:0;}
.jp-merc-empty{padding:9px;font-size:11.5px;color:var(--muted);font-weight:600;}
.jp-merc-div{height:1px;background:var(--line-soft);margin:5px 4px;}

/* Bug 595: Power Pages private-mode banner is not part of the JOSS portal UI. */
#privateModeText{display:none!important;}