/* ---------------------------------------------------------------------------
   Tuyển dụng: danh sách tin, trang chi tiết và hai form ở cột phải.
   Dùng chung khung .nv-intro-bg / .nv-letter với trang Về chúng tôi và Liên hệ.
   --------------------------------------------------------------------------- */

.nv-job-list {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.nv-job-card {
  background: #fff;
  border-radius: 14px;
  padding: 24px 26px;
  box-shadow: 0 4px 18px rgba(23, 36, 47, .08);
  border-left: 4px solid var(--nv-primary);
  transition: box-shadow .25s ease, transform .25s ease;
}

.nv-job-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(23, 36, 47, .14);
}

/* Tin hết hạn vẫn hiện nhưng nhạt đi, viền xám: người xem biết là còn đó mà
   không nộp được nữa. */
.nv-job-card.is-expired {
  border-left-color: #c3ced7;
}

.nv-job-card.is-expired .nv-job-name a {
  color: #6b7a86;
}

.nv-job-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.nv-job-name {
  margin: 0;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.4;
}

.nv-job-name a {
  color: #17242f;
}

.nv-job-name a:hover {
  color: var(--nv-primary);
  text-decoration: none;
}

.nv-job-tag {
  flex: 0 0 auto;
  padding: 3px 12px;
  border-radius: 999px;
  background: #eef2f5;
  color: #6b7a86;
  font-size: 12px;
  font-weight: 700;
}

/* Dòng thông tin: phòng ban, địa điểm, số lượng, hạn nộp, lương ---------- */

.nv-job-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 22px;
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
}

.nv-job-meta li {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  line-height: 1.5;
  color: #5b6a75;
}

.nv-job-meta i {
  width: 15px;
  text-align: center;
  color: var(--nv-primary);
}

.nv-job-meta--single {
  gap: 10px 26px;
  padding-bottom: 18px;
  border-bottom: 1px solid #e6ebef;
  font-size: 14px;
}

.nv-job-meta--single li {
  font-size: 14px;
}

.nv-job-meta--single b {
  color: #17242f;
}

.nv-job-excerpt {
  margin: 14px 0 18px;
  line-height: 1.75;
  color: #5b6a75;
}

/* Trang chi tiết --------------------------------------------------------- */

.nv-job-title {
  margin: 0 0 4px;
  font-size: 26px;
  font-weight: 700;
  line-height: 1.3;
  color: #17242f;
}

.nv-job-closed {
  margin: 16px 0 0;
  padding: 10px 14px;
  border-radius: 10px;
  background: #fdf1f1;
  color: #b32d2e;
  font-weight: 700;
}

.nv-job-single .nv-content {
  margin-top: 18px;
}

/* Hai form ở cột phải ---------------------------------------------------- */

.nv-job-filter .form-control,
.nv-job-apply .form-control {
  border-radius: 8px;
  padding: 10px 14px;
  height: auto;
}

.nv-job-filter label,
.nv-job-apply label {
  font-weight: 700;
  font-size: 14px;
  color: #17242f;
}

.nv-job-filter-check label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 400;
  font-size: 14px;
  color: #5b6a75;
}

.nv-job-reset {
  display: inline-block;
  margin-left: 14px;
  font-size: 13px;
  color: #6b7a86;
}

/* Ô chọn tệp: nút mặc định của trình duyệt rất thô, cho nó cái khung cho đồng
   bộ với các ô nhập khác. */
.nv-job-apply input[type="file"] {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid #ced4da;
  border-radius: 8px;
  font-size: 13px;
}

@media (min-width: 992px) {
  /* Cột phải ôm lấy form, không kéo dài bằng danh sách tin bên trái - danh sách
     có thể rất dài, kéo cho bằng là thừa ra một mảng trắng lớn. */
  .nv-jobs .col-lg-4 > .nv-letter,
  .nv-job-single .col-lg-4 > .nv-letter {
    position: sticky;
    top: 90px;
  }
}

@media (max-width: 991px) {
  .nv-jobs .col-lg-4,
  .nv-job-single .col-lg-4 {
    margin-top: 22px;
  }
}