/* Alissa careers: jobs list widget, single job page and the CV application form (v2 design tokens). */

/* ---------- Jobs list (Alissa_Jobs_V2) ---------- */
body.alx .jobs { display: block; border-top: 1px solid var(--line); }
body.alx .job-row {
  position: relative; display: grid; grid-template-columns: 60px minmax(0, 1fr) auto 40px; gap: 24px; align-items: center;
  padding: 34px 0; border-bottom: 1px solid var(--line); color: var(--ink); transition: color .3s, opacity 1s var(--ease), transform 1s var(--ease);
}
body.alx .job-row::before { content: ""; position: absolute; inset-inline-start: 0; bottom: -1px; width: 0; height: 1px; background: var(--copper); transition: width .6s var(--ease); }
body.alx .job-row:hover::before { width: 100%; }
body.alx .job-row__main { display: grid; gap: 8px; }
body.alx .job-row__title { font-weight: 300; font-size: clamp(20px, 2vw, 28px); line-height: 1.4; transition: color .3s; }
body.alx .job-row__desc { color: var(--muted); font-size: 14px; line-height: 1.9; font-weight: 300; max-width: 620px; }
body.alx .job-row__tags, body.alx .job-tags { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
body.alx .job-row__tags span, body.alx .job-tags span {
  padding: 6px 14px; border: 1px solid var(--line); border-radius: 999px; font-size: 13px; color: var(--muted); white-space: nowrap;
}
body.alx .job-row__tags .is-closed, body.alx .job-tags .is-closed { color: var(--copper); border-color: var(--copper-soft); }
body.alx .job-row__arrow { font-size: 20px; color: var(--muted); transition: transform .4s var(--ease), color .3s; }
body.alx .job-row:hover .job-row__title, body.alx .job-row:hover .job-row__arrow { color: var(--copper); }
body.alx .job-row:hover .job-row__arrow { transform: translateX(-8px); }
body.alx .jobs__empty {
  display: flex; align-items: center; gap: 18px; padding: clamp(36px, 5vw, 56px) 0; border-bottom: 1px solid var(--line);
  color: var(--ink); font-size: clamp(20px, 2vw, 28px); line-height: 1.5; font-weight: 300;
}
body.alx .jobs__empty::before { content: ""; flex: none; width: 40px; height: 1px; background: var(--copper); }

/* ---------- Single job ---------- */
body.alx .job-tags { justify-content: flex-start; margin-top: 22px; }
body.alx .job { display: grid; grid-template-columns: 8fr 4fr; gap: clamp(32px, 6vw, 110px); align-items: start; }
body.alx .job > .e-con, body.alx .job__content { display: block; }
body.alx .job__content { max-width: none; }
body.alx .page-head .e-con > .elementor-widget.crumbs { margin-block-end: 18px; }
body.alx .facts .eyebrow + .elementor-widget .facts__list { margin-top: 0; }
body.alx .enquiry__aside .facts__list { border-top: 0; margin-top: 0; }
body.alx .enquiry__aside .facts__row { flex-direction: column; gap: 6px; padding: 18px 0; }
body.alx .enquiry__aside .facts__label { font-size: 12px; }
body.alx .job__content > :first-child { margin-top: 0; }
body.alx .job__lead { font-size: 19px !important; color: var(--ink) !important; margin-bottom: 26px; }
body.alx .job__content h2, body.alx .job__content h3 { font-weight: 300; font-size: 22px; margin: 40px 0 14px; color: var(--ink); }
body.alx .job__content p + p { margin-top: 14px; }
body.alx .job__content ol { padding-inline-start: 22px; margin-top: 8px; }
body.alx .job__content ol li { list-style: decimal; }
body.alx .job__content a { color: var(--copper); }
body.alx .facts .facts__row > span:last-child { text-align: end; }

body.alx .job-btn {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 30px; padding: 16px 30px;
  background: var(--ink); color: #fff; font-size: 15px; border-radius: 0 16px 0 16px; transition: background .35s;
}
body.alx .job-btn:hover { background: var(--copper); color: #fff; }

/* ---------- Application form ---------- */
body.alx .job-page .enquiry { scroll-margin-top: 80px; }
body.alx .apply-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 26px 32px; }
body.alx .apply-form .field { display: grid; gap: 4px; }
body.alx .apply-form .field--wide { grid-column: 1 / -1; }
body.alx .apply-form .field > span { font-size: 12px; color: var(--muted); }
body.alx .apply-form input[type=text], body.alx .apply-form input[type=email], body.alx .apply-form input[type=tel],
body.alx .apply-form select, body.alx .apply-form textarea {
  width: 100%; background: transparent; border: 0; border-bottom: 1px solid #cfc6bb; border-radius: 0;
  padding: 12px 0; font: inherit; font-size: 15px; color: var(--ink); outline: 0; transition: border-color .3s;
}
body.alx .apply-form input[dir=ltr] { text-align: right; }
body.alx .apply-form textarea { resize: vertical; min-height: 110px; line-height: 1.9; }
body.alx .apply-form input:focus, body.alx .apply-form select:focus, body.alx .apply-form textarea:focus { border-bottom-color: var(--copper); }
body.alx .apply-form ::placeholder { color: #b1aaa2; }

body.alx .apply-form .file { position: relative; }
body.alx .apply-form .file input { position: absolute; inset: 0; opacity: 0; cursor: pointer; z-index: 1; }
body.alx .apply-form .file__box {
  display: flex; align-items: center; gap: 16px; padding: 18px; margin-top: 6px;
  border: 1px dashed #cfc6bb; background: var(--ivory); transition: border-color .3s;
}
body.alx .apply-form .file:hover .file__box, body.alx .apply-form .file input:focus + .file__box { border-color: var(--copper); }
body.alx .apply-form .file__box b { flex: none; padding: 8px 16px; background: var(--ink); color: #fff; font-size: 13px; font-weight: 400; }
body.alx .apply-form .file__box em { font-style: normal; font-size: 14px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

body.alx .apply-form .consent { display: flex; gap: 10px; align-items: flex-start; margin-top: 28px; font-size: 14px; color: var(--muted); line-height: 1.8; }
body.alx .apply-form .consent input { margin-top: 6px; accent-color: var(--copper); }
body.alx .apply-form .consent a { color: var(--copper); text-decoration: underline; }
body.alx .apply-form__submit {
  margin-top: 28px; padding: 16px 34px; border: 0; cursor: pointer; background: var(--ink); color: #fff;
  font: inherit; font-size: 15px; border-radius: 0 16px 0 16px; transition: background .35s;
}
body.alx .apply-form__submit:hover { background: var(--copper); }
body.alx .apply-form__submit:disabled { opacity: .6; cursor: wait; }
body.alx .apply-form__error { margin-bottom: 26px; padding: 14px 18px; border-inline-start: 3px solid var(--copper); background: #f7ebe3; color: #7a3818; font-size: 14px; }
body.alx .apply-form__trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }

body.alx .apply-done h3 { font-weight: 300; font-size: 26px; margin-bottom: 12px; }
body.alx .apply-done p { color: var(--muted); line-height: 1.9; }

@media (max-width: 960px) {
  body.alx .job { grid-template-columns: 1fr; }
  body.alx .job .facts { position: static; }
  body.alx .job-row { grid-template-columns: 40px minmax(0, 1fr) 28px; gap: 14px 16px; }
  body.alx .job-row__tags { grid-column: 2 / 3; grid-row: 2; justify-content: flex-start; }
}
@media (max-width: 600px) {
  body.alx .apply-form__grid { grid-template-columns: 1fr; }
  body.alx .job-row { padding: 26px 0; }
}