@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=DM+Mono:wght@400;500&display=swap');

/* ── List reset ── */
#whr_embed_hook .whr-items {
  list-style: none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.75rem !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* ── Group heading ── */
#whr_embed_hook h2.whr-group,
body #whr_embed_hook h2.whr-group {
  font-family: 'DM Sans', sans-serif !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: #7ebe42 !important;
  margin: 1.5rem 0 0.5rem !important;
  padding: 0 !important;
  border: none !important;
  border-bottom: none !important;
  background: none !important;
  box-shadow: none !important;
  line-height: 1.2 !important;
  text-shadow: none !important;
}

/* ── Card ── */
#whr_embed_hook .whr-item {
  background: #161c27 !important;
  border: 1px solid #1e2a3a !important;
  border-radius: 10px !important;
  padding: 1.25rem 1.5rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  transition: border-color 0.2s, background 0.2s !important;
  position: relative !important;
}

#whr_embed_hook .whr-item:hover {
  border-color: #2e3f55 !important;
  background: #1a2233 !important;
}

/* ── Left content wrapper (injected by JS) ── */
#whr_embed_hook .whr-item-left {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.5rem !important;
  flex: 1 !important;
  min-width: 0 !important;
}

/* ── Department badge ── */
#whr_embed_hook .whr-dept {
  font-family: 'DM Sans', sans-serif !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: #7ebe42 !important;
  list-style: none !important;
  line-height: 1.2 !important;
}

#whr_embed_hook .whr-dept span {
  display: none !important;
}

/* ── Title ── */
#whr_embed_hook .whr-title {
  font-family: 'DM Sans', sans-serif !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: #e2e8f0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  margin: 0 !important;
}

#whr_embed_hook .whr-title a {
  color: inherit !important;
  text-decoration: none !important;
  transition: color 0.15s !important;
}

#whr_embed_hook .whr-title a:hover {
  color: #7ee787 !important;
}

/* ── Meta info row ── */
#whr_embed_hook .whr-info {
  list-style: none !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.35rem 0.1rem !important;
  padding: 0 !important;
  margin: 0 !important;
}

#whr_embed_hook .whr-info .whr-dept {
  display: none !important;
}

#whr_embed_hook .whr-info li {
  display: flex !important;
  align-items: center !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 0.8rem !important;
  color: #8b9ab0 !important;
  gap: 0.3rem !important;
  list-style: none !important;
}

#whr_embed_hook .whr-info li span {
  display: none !important;
}

/* ── Hide job code ── */
#whr_embed_hook .whr-code {
  display: none !important;
}

/* ── Location pin icon ── */
#whr_embed_hook .whr-location::before {
  content: '' !important;
  display: inline-block !important;
  width: 14px !important;
  height: 14px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e05c5c'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z'/%3E%3C/svg%3E") !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  flex-shrink: 0 !important;
}

/* ── Calendar icon for date ── */
#whr_embed_hook .whr-date::before {
  content: '' !important;
  display: inline-block !important;
  width: 13px !important;
  height: 13px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%238b9ab0'%3E%3Cpath d='M17 12h-5v5h5v-5zM16 1v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2h-1V1h-2zm3 18H5V8h14v11z'/%3E%3C/svg%3E") !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  flex-shrink: 0 !important;
}

/* ── Separator dots ── */
#whr_embed_hook .whr-info li.whr-location::after,
#whr_embed_hook .whr-info li.whr-date::after {
  content: '·' !important;
  margin-left: 0.35rem !important;
  color: #3a4a5e !important;
}

#whr_embed_hook .whr-info li:last-child::after {
  display: none !important;
}

/* ── Apply button (injected by JS) ── */
#whr_embed_hook .whr-apply-btn {
  display: inline-block !important;
  padding: 0.5rem 1.1rem !important;
  background: transparent !important;
  border: 1px solid #2e3f55 !important;
  border-radius: 6px !important;
  color: #a0b4cc !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 0.82rem !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: background 0.15s, border-color 0.15s, color 0.15s !important;
  flex-shrink: 0 !important;
}

#whr_embed_hook .whr-apply-btn:hover {
  background: #1e2a3a !important;
  border-color: #4a6080 !important;
  color: #e2e8f0 !important;
}

/* ── "New" badge ── */
#whr_embed_hook .whr-badge-new {
  display: inline-block !important;
  margin-right: 0.6rem !important;
  padding: 0.2rem 0.6rem !important;
  background: #1a3a1a !important;
  border: 1px solid #2d6a2d !important;
  border-radius: 20px !important;
  color: #7ee787 !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.03em !important;
  vertical-align: middle !important;
}