/* LayoffLink Career Help Pop-up - all selectors are .llcp-* prefixed so nothing
   here can collide with the theme's own styles. Brand colours come from the
   theme's design tokens (--sky, --purple), with the same values as fallbacks. */

.llcp-root { font-family: inherit; }
.llcp-root *, .llcp-root *::before, .llcp-root *::after { box-sizing: border-box; }

/* Floating button - bottom-LEFT, because the theme's AI assistant sits bottom-right */
.llcp-launcher {
  position: fixed; left: 20px; bottom: 24px; z-index: 80;
  display: inline-flex; align-items: center; gap: .55rem;
  margin: 0; padding: .8rem 1.2rem .8rem 1rem;
  border: 0; border-radius: 999px; cursor: pointer;
  font: inherit; font-size: .92rem; font-weight: 800; line-height: 1.2; letter-spacing: 0;
  color: #fff;
  background: linear-gradient(135deg, var(--sky, #2F6FE4), var(--purple, #6A4FC4));
  box-shadow: 0 14px 30px -12px rgba(47, 111, 228, .7);
  transition: transform .15s ease, box-shadow .15s ease;
}
.llcp-launcher:hover { transform: translateY(-2px); box-shadow: 0 18px 34px -12px rgba(47, 111, 228, .8); }
.llcp-launcher:focus-visible { outline: 3px solid #14213D; outline-offset: 3px; }
.llcp-launcher-ico { font-size: 1.15rem; line-height: 1; }

html.llcp-lock { overflow: hidden; }

/* Overlay + dialog */
.llcp-overlay {
  position: fixed; inset: 0; z-index: 1000;
  display: flex; align-items: center; justify-content: center;
  padding: 1rem;
  background: rgba(20, 33, 61, .58);
  opacity: 0; transition: opacity .18s ease;
}
.llcp-overlay[hidden] { display: none; }
.llcp-overlay.is-open { opacity: 1; }

.llcp-modal {
  position: relative; width: 100%; max-width: 480px;
  max-height: calc(100vh - 2rem); overflow-y: auto;
  padding: 1.9rem 1.75rem 1.5rem;
  background: #fff; color: #14213D; text-align: left;
  border-radius: 18px;
  box-shadow: 0 30px 70px -20px rgba(0, 0, 0, .55);
  transform: translateY(14px) scale(.98); transition: transform .22s ease;
}
.llcp-overlay.is-open .llcp-modal { transform: none; }
.llcp-modal:focus { outline: none; }

.llcp-close {
  position: absolute; top: 12px; right: 12px;
  width: 34px; height: 34px; margin: 0; padding: 0;
  border: 0; border-radius: 50%; cursor: pointer;
  font-size: 1.5rem; line-height: 1; color: #4a5468; background: #f1f3f8;
}
.llcp-close:hover { background: #e4e8f1; }
.llcp-close:focus-visible { outline: 3px solid var(--sky, #2F6FE4); outline-offset: 2px; }

.llcp-title {
  margin: 0 2rem .4rem 0; padding: 0;
  font-family: var(--font-board, inherit); font-size: 1.45rem; font-weight: 700; line-height: 1.25;
  color: #14213D; letter-spacing: -0.01em;
  text-transform: none; /* the theme upper-cases every h2 */
}
.llcp-sub { margin: 0 0 1.25rem; font-size: .95rem; line-height: 1.5; color: #4a5468; }

.llcp-field { margin: 0 0 .95rem; min-width: 0; }
.llcp-label { display: block; margin: 0 0 .3rem; padding: 0; font-size: .82rem; font-weight: 700; color: #14213D; }
.llcp-req { color: #c62828; }
.llcp-opt { font-weight: 400; color: #7a8396; }

.llcp-input {
  display: block; width: 100%; margin: 0; padding: .7em .85em;
  font: inherit; font-size: 15px; line-height: 1.4; color: #14213D;
  background: #fff; border: 1px solid #cdd3df; border-radius: 9px;
  box-shadow: none; transition: border-color .15s ease, box-shadow .15s ease;
}
.llcp-input::placeholder { color: #9aa2b3; }
.llcp-input:focus { outline: none; border-color: var(--sky, #2F6FE4); box-shadow: 0 0 0 3px rgba(47, 111, 228, .18); }
.llcp-textarea { min-height: 96px; resize: vertical; }

.llcp-row { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }

/* Topic chips */
.llcp-chips { margin: 0 0 1rem; padding: 0; border: 0; min-width: 0; }
.llcp-chips .llcp-label { padding: 0; }
.llcp-chip { display: inline-block; margin: 0 .35rem .4rem 0; position: relative; cursor: pointer; }
.llcp-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.llcp-chip span {
  display: inline-block; padding: .42em .9em;
  font-size: .85rem; font-weight: 600; color: #36405a;
  background: #fff; border: 1px solid #cdd3df; border-radius: 999px;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.llcp-chip:hover span { border-color: var(--sky, #2F6FE4); }
.llcp-chip input:checked + span { color: var(--sky, #2F6FE4); background: #eaf1fd; border-color: var(--sky, #2F6FE4); }
.llcp-chip input:focus-visible + span { outline: 3px solid var(--sky, #2F6FE4); outline-offset: 2px; }

.llcp-error {
  margin: 0 0 .9rem; padding: .7em .9em;
  font-size: .9rem; line-height: 1.4; color: #a12727;
  background: #fdeaea; border: 1px solid #f2c0c0; border-radius: 9px;
}
.llcp-error[hidden] { display: none; }

.llcp-submit {
  display: block; width: 100%; margin: .2rem 0 0; padding: .9em 1em;
  border: 0; border-radius: 10px; cursor: pointer;
  font: inherit; font-size: 1rem; font-weight: 800; color: #fff;
  background: linear-gradient(135deg, var(--sky, #2F6FE4), var(--purple, #6A4FC4));
  box-shadow: 0 10px 22px -12px rgba(47, 111, 228, .8);
  transition: filter .15s ease, transform .15s ease;
}
.llcp-submit:hover { filter: brightness(.95); }
.llcp-submit:active { transform: scale(.985); }
.llcp-submit:disabled { opacity: .65; cursor: not-allowed; }
.llcp-submit:focus-visible { outline: 3px solid #14213D; outline-offset: 2px; }

.llcp-note { margin: .8rem 0 0; font-size: .76rem; line-height: 1.4; color: #7a8396; text-align: center; }

.llcp-hp { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* Thank-you view */
.llcp-done { text-align: center; padding: .4rem 0 .2rem; }
.llcp-done[hidden] { display: none; }
.llcp-done .llcp-title { margin: 0 0 .4rem; }
.llcp-done-ico {
  width: 58px; height: 58px; margin: .2rem auto 1rem;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.9rem; font-weight: 800; color: #1e7d43;
  background: #e6f6ec; border-radius: 50%;
}

/* Phones: slide up from the bottom as a sheet */
@media (max-width: 640px) {
  .llcp-launcher { left: 14px; bottom: 16px; padding: .7rem 1rem .7rem .85rem; font-size: .86rem; }
  .llcp-overlay { align-items: flex-end; padding: 0; }
  .llcp-modal {
    max-width: none; max-height: 92vh;
    padding: 1.6rem 1.25rem calc(1.25rem + env(safe-area-inset-bottom, 0px));
    border-radius: 20px 20px 0 0;
    transform: translateY(40px);
  }
  .llcp-row { grid-template-columns: 1fr; gap: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .llcp-overlay, .llcp-modal, .llcp-launcher, .llcp-submit, .llcp-chip span { transition: none; }
}
