/* =============================================================
   NHS England PhD Internship Scheme – Custom Styles
   Extends the NHS UK Frontend (nhsuk-frontend) base styles.
   ============================================================= */

/* ── Hero banner (homepage) ──────────────────────────────── */
.nhsx-hero {
  background: #005eb8;
  color: #ffffff;
  padding: 2.5rem 0;
  margin: -2rem 0 2rem;
}

.nhsx-hero h1 {
  color: #ffffff;
  margin-bottom: 0.75rem;
}

.nhsx-hero p.nhsx-hero__lead {
  color: #ffffff;
  font-size: 1.1875rem;
  max-width: 680px;
  margin-bottom: 1.5rem;
  line-height: 1.6;
}

.nhsx-hero .nhsuk-button {
  margin-right: 0.75rem;
  margin-bottom: 0.5rem;
}

/* ── Key stats strip ──────────────────────────────────────── */
.nhsx-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: 2rem;
}

.nhsx-stat {
  flex: 1 1 140px;
  border-left: 4px solid #005eb8;
  padding: 0.75rem 1rem;
  background: #f0f4f5;
}

.nhsx-stat__number {
  display: block;
  font-size: 2rem;
  font-weight: 700;
  color: #005eb8;
  line-height: 1.1;
}

.nhsx-stat__label {
  font-size: 0.875rem;
  color: #425563;
}

/* ── Section dividers ─────────────────────────────────────── */
.nhsx-section-heading {
  border-bottom: 4px solid #005eb8;
  padding-bottom: 0.5rem;
  margin-bottom: 1.5rem;
  margin-top: 2rem;
}

/* ── Project filter bar ───────────────────────────────────── */
.nhsx-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0.75rem;
  background: #f0f4f5;
  border-radius: 4px;
  margin-bottom: 1rem;
  align-items: center;
}

.nhsx-filter__label {
  font-weight: 700;
  font-size: 0.875rem;
  color: #212b32;
  margin-right: 0.25rem;
}

.nhsx-filter button {
  font-size: 0.8125rem;
  padding: 0.3rem 0.75rem;
  border: 2px solid #768692;
  background: #ffffff;
  color: #212b32;
  cursor: pointer;
  border-radius: 4px;
  font-family: inherit;
  font-weight: 600;
  transition: background 0.1s, border-color 0.1s;
}

.nhsx-filter button:hover:not(.active) {
  background: #d8dde0;
  border-color: #4c6272;
}

.nhsx-filter button.active {
  background: #005eb8;
  border-color: #005eb8;
  color: #ffffff;
}

/* ── Wave heading on completed projects page ──────────────── */
.nhsx-wave-heading {
  background: #005eb8;
  color: #ffffff;
  padding: 0.6rem 1rem;
  font-size: 1.1875rem;
  font-weight: 700;
  border-radius: 4px 4px 0 0;
  margin-bottom: 0;
  margin-top: 2rem;
}

/* ── Improved completed project cards ────────────────────── */
.nhsx-card-meta {
  color: #425563;
  font-size: 0.875rem;
  margin: 0.25rem 0 0.5rem;
}

.nhsx-card-meta strong {
  color: #212b32;
}

.nhsx-card-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin: 0.75rem 0;
}

.nhsx-card-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-top: 0.75rem;
}

.nhsx-card-actions .nhsuk-button {
  margin: 0;
  font-size: 0.875rem;
  padding: 0.35rem 0.75rem;
}

/* ── Badge colour overrides (match badge topic to colour) ─── */
.nhsuk-tag--pets       { background-color: #d5281b; color: #fff; }
.nhsuk-tag--ml         { background-color: #005eb8; color: #fff; }
.nhsuk-tag--nlp        { background-color: #ffb81c; color: #212b32; }
.nhsuk-tag--synthetic  { background-color: #007f3b; color: #fff; }
.nhsuk-tag--explain    { background-color: #ff6700; color: #fff; }
.nhsuk-tag--linkage    { background-color: #768692; color: #fff; }
.nhsuk-tag--simulation { background-color: #003087; color: #fff; }
.nhsuk-tag--data       { background-color: #330072; color: #fff; }

/* ── Current projects on homepage ────────────────────────── */
.nhsx-current-projects {
  margin-top: 2rem;
}

.nhsx-wave-badge {
  display: inline-block;
  background: #005eb8;
  color: #fff;
  font-weight: 700;
  font-size: 0.875rem;
  padding: 0.25rem 0.75rem;
  border-radius: 4px;
  margin-bottom: 1rem;
}

/* ── Custom simplified header ─────────────────────────────── */
.nhsx-header {
  background: #005eb8;
}

.nhsx-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.nhsx-header__title {
  color: #ffffff;
  font-size: 1.125rem;
  font-weight: 700;
  text-decoration: none;
  line-height: 1.3;
}

.nhsx-header__title:hover,
.nhsx-header__title:focus {
  color: #ffffff;
  text-decoration: underline;
  text-decoration-thickness: 3px;
  text-underline-offset: 3px;
}

.nhsx-nav-list {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0;
}

.nhsx-nav-list li {
  margin: 0;
}

.nhsx-nav-list a {
  display: block;
  color: rgba(255, 255, 255, 0.85);
  text-decoration: none;
  padding: 0.5rem 0.625rem;
  font-size: 0.9375rem;
  border-bottom: 4px solid transparent;
}

.nhsx-nav-list a:hover,
.nhsx-nav-list a:focus {
  color: #ffffff;
  text-decoration: underline;
}

.nhsx-nav-item--current a {
  color: #ffffff;
  font-weight: 700;
  border-bottom-color: #ffffff;
}

@media (max-width: 40em) {
  .nhsx-header__inner {
    flex-direction: column;
    align-items: flex-start;
  }

  .nhsx-nav-list {
    width: 100%;
  }

  .nhsx-nav-list a {
    padding: 0.375rem 0;
    border-bottom: none;
  }

  .nhsx-nav-item--current a {
    border-bottom: none;
    text-decoration: underline;
  }
}

/* ── Hero: add horizontal padding to inner container ─────── */
.nhsx-hero .nhsuk-width-container {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

/* ── Hero CTA buttons ─────────────────────────────────────── */
.nhsuk-button.nhsx-btn-hero-primary {
  background: #ffffff;
  color: #005eb8;
  box-shadow: 0 4px 0 #003078;
}

.nhsuk-button.nhsx-btn-hero-primary:hover {
  background: #f0f4f5;
  color: #003d78;
}

.nhsuk-button.nhsx-btn-hero-secondary {
  background: transparent;
  color: #ffffff;
  border: 2px solid #ffffff;
  box-shadow: none;
}

.nhsuk-button.nhsx-btn-hero-secondary:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #ffffff;
}

/* ── Data modality tag colours (third tag on project cards) ── */
.nhsuk-tag--tabular    { background: #007f3b; color: #fff; }
.nhsuk-tag--images     { background: #d63f93; color: #fff; }
.nhsuk-tag--text       { background: #005eb8; color: #fff; }
.nhsuk-tag--multimodal { background: #4c2c92; color: #fff; }
.nhsuk-tag--audio      { background: #41b6e6; color: #212b32; }
.nhsuk-tag--genomic    { background: #006747; color: #fff; }

/* ── Footer copyright full-width strip ───────────────────── */
.nhsx-footer-copyright {
  border-top: 1px solid #d8dde0;
  margin-top: 1.5rem;
  padding-top: 1rem;
  font-size: 0.875rem;
  color: #425563;
  width: 100%;
}

.nhsx-footer-copyright p {
  margin-bottom: 0.5rem;
}

.nhsx-footer-copyright a {
  color: #005eb8;
}
