/* DPP Job Alerts v0.5.1 — aligned to site design system */
.dpp-ja{
  --ja-ink:#111;
  --ja-bg:#fff;
  --ja-line:#ddd;
  --ja-tint:#f7f7f5;
  --ja-ac:#111;
  --ja-ac-h:color-mix(in srgb, #111 85%, transparent);
  --ja-ok:#027a48;
  --ja-ok-bg:#ecfdf3;
  --ja-err:#b42318;
  --ja-sub:#686868;
  --ja-ease:cubic-bezier(.22,1,.36,1);
  font-family:Manrope,sans-serif;
  font-weight:300;
  letter-spacing:-.1px;
  line-height:1.4
}

/* ── trigger button — matches ue-simple-popup-btn / active-filter-item style ── */
.dpp-ja-btn{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:var(--ja-ink);
  font:inherit;
  cursor:pointer;
  transition:opacity .18s ease;
  -webkit-user-select:none;
  user-select:none
}
.dpp-ja-btn:hover{
  opacity:.65
}
.dpp-ja-btn:active{
  opacity:.5
}
.dpp-ja-btn i,
.dpp-ja-btn svg{
  font-size:1em;
  line-height:1em
}

/* ── flash note ── */
.dpp-ja-note{
  margin:.75rem 0 0;
  padding:.65rem .9rem;
  border:1px solid #c5d9c9;
  border-radius:0;
  background:#f4fbf5;
  color:#1a5c2a;
  font-size:.875rem;
  line-height:1.4;
  animation:ja-fade .4s ease
}
.dpp-ja-note[hidden]{display:none}

/* ── overlay ── */
.dpp-ja-md{
  position:fixed;inset:0;z-index:100001;
  display:flex;align-items:flex-start;justify-content:center;
  opacity:0;visibility:hidden;
  transition:opacity .22s ease,visibility .22s ease
}
.dpp-ja-md.is-open{opacity:1;visibility:visible}
.dpp-ja-bd{
  position:absolute;inset:0;
  background:rgba(0,0,0,.4);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px)
}

/* ── card ── */
.dpp-ja-card{
  position:relative;z-index:1;
  width:100%;max-width:30rem;
  margin:8vh 1rem 0;
  padding:2rem 2rem 1.75rem;
  border:1px solid var(--ja-line);
  border-radius:0;
  background:var(--ja-bg);
  box-shadow:0 24px 80px -16px rgba(0,0,0,.15);
  transform:translateY(10px) scale(.98);
  opacity:0;
  transition:transform .32s var(--ja-ease),opacity .22s ease
}
.dpp-ja-md.is-open .dpp-ja-card{
  transform:translateY(0) scale(1);opacity:1
}

/* ── kicker + heading ── */
.dpp-ja-k{
  margin:0 0 .5rem;
  color:var(--ja-sub);
  font-size:.75rem;
  font-weight:700;
  letter-spacing:1.4px;
  text-transform:uppercase
}
.dpp-ja-card h3{
  margin:0;
  color:var(--ja-ink);
  font-size:clamp(1.125rem,1.125rem + ((1vw - .2rem) * .392),1.375rem);
  font-weight:400;
  letter-spacing:-.1px;
  line-height:1.125
}
.dpp-ja-t{
  margin:.65rem 0 1.15rem;
  color:var(--ja-sub);
  font-size:.875rem;
  line-height:1.4
}

/* ── close btn ── */
.dpp-ja-x{
  position:absolute;top:1.1rem;right:1.1rem;
  display:grid;place-items:center;
  width:2.2rem;height:2.2rem;
  border:1px solid transparent;
  border-radius:0;
  background:var(--ja-tint);
  color:var(--ja-sub);
  font-size:.85rem;
  cursor:pointer;
  transition:all .15s ease
}
.dpp-ja-x:hover{
  background:#eee;
  color:var(--ja-ink);
  border-color:var(--ja-line)
}

/* ── filter summary ── */
.dpp-ja-sum{
  padding:.85rem 1rem;
  border:1px solid var(--ja-line);
  border-radius:0;
  background:var(--ja-tint)
}
.dpp-ja-lt{
  margin:0 0 .5rem;
  color:var(--ja-ink);
  font-size:.75rem;
  font-weight:700;
  letter-spacing:1.4px;
  text-transform:uppercase
}
.dpp-ja-ls{
  display:flex;flex-wrap:wrap;gap:.4rem;
  margin:0;padding:0;list-style:none
}
.dpp-ja-ls li{
  padding:.35rem .7rem;
  border:1px solid var(--ja-line);
  border-radius:0;
  background:#fff;
  color:var(--ja-ink);
  font-size:.82rem;
  line-height:1.3
}

/* ── form ── */
.dpp-ja-fm{margin-top:1.15rem}
.dpp-ja-lb{
  display:block;
  margin:0 0 .4rem;
  color:var(--ja-ink);
  font-weight:400;
  font-size:.875rem
}
.dpp-ja-in{
  width:100%;
  padding:.78rem .95rem;
  border:1px solid var(--ja-line);
  border-radius:0;
  background:#fff;
  color:var(--ja-ink);
  font-family:inherit;
  font-size:.875rem;
  box-sizing:border-box;
  transition:border-color .15s ease,box-shadow .15s ease
}
.dpp-ja-in::placeholder{color:#999}
.dpp-ja-in:focus{
  outline:0;
  border-color:var(--ja-ink);
  box-shadow:0 0 0 2px rgba(17,17,17,.08)
}
.dpp-ja-hp{position:absolute;left:-9999px;opacity:0;pointer-events:none}

/* ── frequency selector ── */
.dpp-ja-freq{display:flex;gap:.4rem;margin:.6rem 0 0}
.dpp-ja-freq label{
  display:flex;align-items:center;gap:.3rem;
  padding:.42rem .72rem;
  border:1px solid var(--ja-line);
  border-radius:0;
  background:#fff;
  color:var(--ja-sub);
  font-size:.82rem;
  cursor:pointer;
  transition:all .15s ease
}
.dpp-ja-freq label:hover{
  border-color:#999;
  color:var(--ja-ink)
}
.dpp-ja-freq input{position:absolute;opacity:0;pointer-events:none}
.dpp-ja-freq input:checked+span{color:var(--ja-ink);font-weight:400}
.dpp-ja-freq label:has(input:checked){
  border-color:var(--ja-ink);
  background:rgba(17,17,17,.04);
  color:var(--ja-ink)
}

/* ── submit button ── */
.dpp-ja-go{
  position:relative;
  margin-top:1rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.45rem;
  min-width:11rem;
  padding:1rem 2.25rem;
  border:0;
  border-radius:0;
  background:var(--ja-ac);
  color:#fff;
  font:inherit;
  font-size:clamp(1rem,1rem + ((1vw - .2rem) * .196),1.125rem);
  cursor:pointer;
  transition:background .18s ease
}
.dpp-ja-go:hover:not([disabled]){
  background:var(--ja-ac-h)
}
.dpp-ja-go:active:not([disabled]){
  background:#333
}
.dpp-ja-go[disabled]{opacity:.55;cursor:wait}
.dpp-ja-go .ja-spin{
  display:none;
  width:14px;height:14px;
  border:2px solid rgba(255,255,255,.3);
  border-top-color:#fff;
  border-radius:50%;
  animation:ja-spin .6s linear infinite
}
.dpp-ja-go[disabled] .ja-spin{display:inline-block}
.dpp-ja-go[disabled] .ja-txt{opacity:.35}

/* ── gdpr line ── */
.dpp-ja-gdpr{
  margin:.7rem 0 0;
  font-size:.75rem;
  line-height:1.4;
  color:var(--ja-sub)
}
.dpp-ja-gdpr a{
  color:var(--ja-ink);
  text-decoration:underline;
  text-underline-offset:2px
}
.dpp-ja-gdpr a:hover{color:var(--ja-sub)}

/* ── message area ── */
.dpp-ja-msg{
  min-height:1.3rem;
  margin:.7rem 0 0;
  font-size:.875rem;
  color:var(--ja-ink)
}
.dpp-ja-msg.is-err{color:var(--ja-err)}

/* ── success state ── */
.dpp-ja-ok{display:none;text-align:center;padding:2.5rem 1.5rem}
.dpp-ja-ok.is-vis{display:block;animation:ja-fade .4s ease}
.dpp-ja-ok-ic{
  display:inline-flex;align-items:center;justify-content:center;
  width:52px;height:52px;
  border-radius:0;
  background:var(--ja-ok-bg);
  margin:0 0 1rem
}
.dpp-ja-ok-ic svg{width:26px;height:26px;color:var(--ja-ok)}
.dpp-ja-ok-ic svg path{
  stroke-dasharray:24;
  stroke-dashoffset:24;
  animation:ja-check .5s ease .15s forwards
}
.dpp-ja-ok h4{margin:0 0 .45rem;font-size:1.125rem;color:var(--ja-ink);font-weight:400}
.dpp-ja-ok p{margin:0;color:var(--ja-sub);font-size:.875rem;line-height:1.4}

/* ── body lock ── */
body.dpp-ja-open{overflow:hidden}

/* ── animations ── */
@keyframes ja-spin{to{transform:rotate(360deg)}}
@keyframes ja-fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@keyframes ja-check{to{stroke-dashoffset:0}}

/* ── mobile bottom-sheet ── */
@media(max-width:767px){
  .dpp-ja-md{align-items:flex-end}
  .dpp-ja-card{
    margin:0;
    border-radius:0;
    padding:1.25rem 1.25rem 1.5rem;
    max-height:90vh;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    transform:translateY(100%);
    opacity:1
  }
  .dpp-ja-md.is-open .dpp-ja-card{transform:translateY(0)}
  .dpp-ja-card::before{
    content:'';display:block;
    width:32px;height:3px;
    margin:0 auto .85rem;
    border-radius:0;
    background:#ccc
  }
  .dpp-ja-btn{justify-content:center}
  .dpp-ja-freq{flex-wrap:wrap}
  .dpp-ja-card h3{font-size:1.125rem}
}
