/* ==========================================================================
   Design Tokens
   ========================================================================== */
:root {
  /* Typography */
  --plos-font-family: Arial, sans-serif;
  --plos-font-weight-regular: 400;
  --plos-font-weight-bold: 800;

  /* Type scale — headings (desktop / tablet+, min-width: 40.0625em) */
  --plos-type-h1-font-size: 2.625rem; /* 42px */
  --plos-type-h1-line-height: 3rem; /* 48px */
  --plos-type-h2-font-size: 1.75rem; /* 28px */
  --plos-type-h2-line-height: 2.25rem; /* 36px */
  --plos-type-h3-font-size: 1.3125rem; /* 21px */
  --plos-type-h3-line-height: 1.75rem; /* 28px */
  --plos-type-h4-font-size: 1.125rem; /* 18px */
  --plos-type-h4-line-height: 1.75rem; /* 28px */

  /* Type scale — headings (mobile) */
  --plos-type-h1-mobile-font-size: 2rem; /* 32px */
  --plos-type-h1-mobile-line-height: 2.5rem; /* 40px */
  --plos-type-h2-mobile-font-size: 1.3125rem; /* 21px */
  --plos-type-h2-mobile-line-height: 1.75rem; /* 28px */
  --plos-type-h3-mobile-font-size: 1.25rem; /* 20px */
  --plos-type-h3-mobile-line-height: 1.75rem; /* 28px */
  --plos-type-h4-mobile-font-size: 1.125rem; /* 18px */
  --plos-type-h4-mobile-line-height: 1.5rem; /* 24px */

  /* Type scale — body */
  --plos-type-body-l-font-size: 1.125rem; /* 18px */
  --plos-type-body-l-line-height: 1.75rem; /* 28px */
  --plos-type-body-font-size: 1rem; /* 16px */
  --plos-type-body-line-height: 1.5rem; /* 24px */
  --plos-type-body-s-font-size: 0.875rem; /* 14px */
  --plos-type-body-s-line-height: 1.5rem; /* 24px */

  /* Spacing scale */
  --plos-spacing-01: 0.25rem; /*   4px */
  --plos-spacing-02: 0.5rem; /*   8px */
  --plos-spacing-03: 0.75rem; /*  12px */
  --plos-spacing-04: 1rem; /*  16px */
  --plos-spacing-05: 1.5rem; /*  24px */
  --plos-spacing-06: 2rem; /*  32px */
  --plos-spacing-07: 2.5rem; /*  40px */
  --plos-spacing-08: 3rem; /*  48px */
  --plos-spacing-09: 4rem; /*  64px */
  --plos-spacing-10: 5rem; /*  80px */
  --plos-spacing-11: 6rem; /*  96px */
  --plos-spacing-12: 10rem; /* 160px */

  /* Colour — primitives */
  --plos-color-primary-blue: #01156b;
  --plos-color-blue-light: #E9F3FF;
  --plos-color-white: #ffffff;
  --plos-color-black: #1a1a1a;
  --plos-color-secondary-green: #037165;
  --plos-color-secondary-red: #f03f10;
  --plos-color-secondary-blue: #0c4cbd;
  --plos-color-secondary-lime: #d7df23;
  --plos-color-grey-extra-light: #f5f5f5;
  --plos-color-grey-light: #ebebeb;
  --plos-color-grey-medium: #b8b8b8;
  --plos-color-grey-dark: #8e8e8e;
  --plos-color-grey-extra-dark: #5e5e5e;
  --plos-color-green: #1a7032;
  --plos-color-green-light: #DDF5E3;
  --plos-color-red: #d32205;
  --plos-color-red-light: #FFEBE7;
  --plos-color-focus: #01156b;
  --plos-color-yellow: #FDD522;
  --plos-color-yellow-light: #FFFBE0;


  /* Colour — brand */
  --plos-color-brand-dark-blue: var(--plos-color-primary-blue);
  --plos-color-brand-white: var(--plos-color-white);
  --plos-color-brand-black: var(--plos-color-black);
  --plos-color-brand-blue: var(--plos-color-secondary-blue);
  --plos-color-brand-lime: var(--plos-color-secondary-lime);
  --plos-color-brand-red: var(--plos-color-secondary-red);
  --plos-color-brand-green: var(--plos-color-secondary-green);

  /* Colour — text */
  --plos-color-text-primary-light: var(--plos-color-black);
  --plos-color-text-primary-dark: var(--plos-color-white);
  --plos-color-text-secondary-light: var(--plos-color-grey-extra-dark);
  --plos-color-text-link-default: var(--plos-color-primary-blue);

  /* Colour — surface */
  --plos-color-surface-background-primary: var(--plos-color-grey-extra-light);
  --plos-color-surface-background-secondary: var(--plos-color-grey-light);
  --plos-color-surface-background-tertiary: var(--plos-color-grey-medium);

  /* Colour — border */
  --plos-color-border-default: var(--plos-color-grey-medium);
  --plos-color-border-text-input: var(--plos-color-grey-dark);

  /* Colour — messaging */
  --plos-color-messaging-focus: var(--plos-color-focus);
  --plos-color-messaging-positive: var(--plos-color-green);
  --plos-color-messaging-negative: var(--plos-color-red);
  --plos-color-messaging-info-icon: var(--plos-color-primary-blue);
  --plos-color-messaging-info-background: var(--plos-color-blue-light);
  --plos-color-messaging-warning-icon: var(--plos-color-yellow);
  --plos-color-messaging-warning-background: var(--plos-color-yellow-light);
  --plos-color-messaging-problem-icon: var(--plos-color-red);
  --plos-color-messaging-problem-background: var(--plos-color-red-light);
  --plos-color-messaging-success-icon: var(--plos-color-green);
  --plos-color-messaging-success-background: var(--plos-color-green-light);

  /* Colour — journals */
  --plos-color-journal-one: #cc00a6;
  --plos-color-journal-biology: #0523a2;
  --plos-color-journal-medicine: #520043;
  --plos-color-journal-pathogens: #320b92;
  --plos-color-journal-computational-biology: #1b73c5;
  --plos-color-journal-genetics: #0a613b;
  --plos-color-journal-neglected-tropical-diseases: #1b8372;
  --plos-color-journal-digital-health: #d14905;
  --plos-color-journal-climate: #038236;
  --plos-color-journal-water: #1640f8;
  --plos-color-journal-sustainability: #707c03;
  --plos-color-journal-complex-systems: #145886;
  --plos-color-journal-mental-health: #9249cf;
  --plos-color-journal-aging-and-health: #7f1092;
  --plos-color-journal-ecosystems: #7e6d2d;
  --plos-color-journal-global-public-health: #cf3030;

  /* GOV.UK token override */
  --govuk-link-colour: var(--plos-color-text-link-default);
}

/* ==========================================================================
   Broad overrides
   ========================================================================== */

/* Font family */
[class*="govuk-"] {
  font-family: var(--plos-font-family);
}

/* ==========================================================================
   Typography — Heading and body sizes
   ========================================================================== */

/* H1 — govuk-heading-xl */
.govuk-heading-xl {
  font-size: var(--plos-type-h1-mobile-font-size);
  line-height: var(--plos-type-h1-mobile-line-height);
  font-weight: var(--plos-font-weight-bold);
}

@media (min-width: 40.0625em) {
  .govuk-heading-xl {
    font-size: var(--plos-type-h1-font-size);
    line-height: var(--plos-type-h1-line-height);
  }
}

/* H2 — govuk-heading-l */
.govuk-heading-l {
  font-size: var(--plos-type-h2-mobile-font-size);
  line-height: var(--plos-type-h2-mobile-line-height);
  font-weight: var(--plos-font-weight-bold);
}

@media (min-width: 40.0625em) {
  .govuk-heading-l {
    font-size: var(--plos-type-h2-font-size);
    line-height: var(--plos-type-h2-line-height);
  }
}

/* H3 — govuk-heading-m */
.govuk-heading-m {
  font-size: var(--plos-type-h3-mobile-font-size);
  line-height: var(--plos-type-h3-mobile-line-height);
  font-weight: var(--plos-font-weight-bold);
}

@media (min-width: 40.0625em) {
  .govuk-heading-m {
    font-size: var(--plos-type-h3-font-size);
    line-height: var(--plos-type-h3-line-height);
  }
}

/* H4 — govuk-heading-s */
.govuk-heading-s {
  font-size: var(--plos-type-h4-mobile-font-size);
  line-height: var(--plos-type-h4-mobile-line-height);
  font-weight: var(--plos-font-weight-bold);
}

@media (min-width: 40.0625em) {
  .govuk-heading-s {
    font-size: var(--plos-type-h4-font-size);
    line-height: var(--plos-type-h4-line-height);
  }
}

/* Body large — govuk-body-l, govuk-body-lead */
.govuk-body-l,
.govuk-body-lead {
  font-size: var(--plos-type-body-l-font-size);
  line-height: var(--plos-type-body-l-line-height);
}

/* Body — govuk-body, govuk-body-m */
.govuk-body,
.govuk-body-m {
  font-size: var(--plos-type-body-font-size);
  line-height: var(--plos-type-body-line-height);
}

/* Body small — govuk-body-s */
.govuk-body-s {
  font-size: var(--plos-type-body-s-font-size);
  line-height: var(--plos-type-body-s-line-height);
}

/* ==========================================================================
   Fieldset legend
   ========================================================================== */

/* Base legend */
.govuk-fieldset__legend {
  font-size: var(--plos-type-body-font-size);
  line-height: var(--plos-type-body-line-height);
}

/* --xl --> H1 */
.govuk-fieldset__legend--xl {
  font-size: var(--plos-type-h1-mobile-font-size);
  line-height: var(--plos-type-h1-mobile-line-height);
  font-weight: var(--plos-font-weight-bold);
}

@media (min-width: 40.0625em) {
  .govuk-fieldset__legend--xl {
    font-size: var(--plos-type-h1-font-size);
    line-height: var(--plos-type-h1-line-height);
  }
}

/* --l --> H2 */
.govuk-fieldset__legend--l {
  font-size: var(--plos-type-h2-mobile-font-size);
  line-height: var(--plos-type-h2-mobile-line-height);
  font-weight: var(--plos-font-weight-bold);
}

@media (min-width: 40.0625em) {
  .govuk-fieldset__legend--l {
    font-size: var(--plos-type-h2-font-size);
    line-height: var(--plos-type-h2-line-height);
  }
}

/* --m --> H3 */
.govuk-fieldset__legend--m {
  font-size: var(--plos-type-h3-mobile-font-size);
  line-height: var(--plos-type-h3-mobile-line-height);
  font-weight: var(--plos-font-weight-bold);
}

@media (min-width: 40.0625em) {
  .govuk-fieldset__legend--m {
    font-size: var(--plos-type-h3-font-size);
    line-height: var(--plos-type-h3-line-height);
  }
}

/* --s --> H4 */
.govuk-fieldset__legend--s {
  font-size: var(--plos-type-h4-mobile-font-size);
  line-height: var(--plos-type-h4-mobile-line-height);
  font-weight: var(--plos-font-weight-bold);
}

@media (min-width: 40.0625em) {
  .govuk-fieldset__legend--s {
    font-size: var(--plos-type-h4-font-size);
    line-height: var(--plos-type-h4-line-height);
  }
}

/* ==========================================================================
   Hint
   ========================================================================== */

.govuk-hint {
  font-size: var(--plos-type-body-l-font-size);
  line-height: var(--plos-type-body-l-line-height);
  color: var(--plos-color-text-secondary-light);
}

/* ==========================================================================
   Radios
   ========================================================================== */

.govuk-radios__label {
  font-size: var(--plos-type-body-l-font-size);
  line-height: var(--plos-type-body-l-line-height);
  padding-left: 0.75rem;
}

.govuk-radios__input:focus + .govuk-radios__label::before {
  border-color: var(--plos-color-brand-dark-blue);
  box-shadow: 0 0 0 4px var(--plos-color-messaging-focus);
}

.govuk-radios__input:checked + .govuk-radios__label::before {
  border-color: var(--plos-color-brand-dark-blue);
}

.govuk-radios__input:checked + .govuk-radios__label::after {
  background: var(--plos-color-brand-dark-blue);
}

.govuk-radios__input:checked:focus + .govuk-radios__label::before {
  border-color: var(--plos-color-brand-dark-blue);
  box-shadow: 0 0 0 4px var(--plos-color-messaging-focus);
}

.govuk-form-group--error .govuk-radios__label::before {
  border-color: var(--plos-color-brand-red);
}

.govuk-form-group--error {
  border-left: none;
  padding-left: 0;
}

/* ==========================================================================
   Error message
   ========================================================================== */

.govuk-error-message {
  color: var(--plos-color-brand-red);
  font-size: var(--plos-type-body-font-size);
  line-height: var(--plos-type-body-line-height);
}

/* ==========================================================================
   Accordion
   ========================================================================== */

.govuk-frontend-supported .govuk-accordion__controls {
  display: none;
}

.govuk-frontend-supported .govuk-accordion__section-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: var(--plos-type-h4-font-size);
}

@media (min-width: 40.0625em) {
  .govuk-frontend-supported .govuk-accordion__section-button {
    font-size: var(--plos-type-h3-font-size);
  }
}

.govuk-frontend-supported
  .govuk-accordion__section-button:focus
  .govuk-accordion__section-heading-text-focus,
.govuk-frontend-supported
  .govuk-accordion__section-button:focus
  .govuk-accordion__section-summary-focus,
.govuk-frontend-supported
  .govuk-accordion__section-button:focus
  .govuk-accordion__section-toggle-focus {
  background-color: transparent;
  box-shadow: none;
  outline: none;
}

.govuk-frontend-supported
  .govuk-accordion__section-button:focus
  .govuk-accordion-nav__chevron::after {
  color: var(--plos-color-white);
}

.govuk-frontend-supported .govuk-accordion__section-heading-text {
  flex: 1;
  margin-bottom: 0;
}

.govuk-frontend-supported .govuk-accordion__section-toggle {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  margin-bottom: 0;
}

.govuk-frontend-supported
  .govuk-accordion__section-toggle
  .govuk-accordion__section-toggle-focus {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  gap: 0.5rem;
}

.govuk-frontend-supported .govuk-accordion__section-toggle-text {
  font-size: var(--plos-type-body-font-size);
  text-decoration: underline;
}

/* ==========================================================================
   File Upload
   ========================================================================== */

.govuk-frontend-supported .govuk-file-upload-button {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--plos-spacing-04);
  border: none;
  padding: 0;
  width: auto;
}

.govuk-frontend-supported .govuk-file-upload-button__pseudo-button-container {
  order: -1;
  flex-shrink: 0;
}

.govuk-frontend-supported .govuk-file-upload-button__status {
  background-color: transparent;
  color: var(--plos-color-text-primary-light);
  margin-bottom: 0;
  font-size: var(--plos-type-body-font-size);
  line-height: var(--plos-type-body-line-height);
}

.govuk-frontend-supported
  .govuk-file-upload-button:hover
  .govuk-file-upload-button__status,
.govuk-frontend-supported
  .govuk-file-upload-button--empty:active
  .govuk-file-upload-button__status,
.govuk-frontend-supported
  .govuk-file-upload-button--empty:focus
  .govuk-file-upload-button__status,
.govuk-frontend-supported
  .govuk-file-upload-button--empty:hover
  .govuk-file-upload-button__status {
  background-color: transparent;
}

.govuk-frontend-supported .govuk-file-upload-button__instruction {
  display: none;
}

.govuk-frontend-supported .govuk-file-upload-button__pseudo-button {
  font-size: var(--plos-type-body-font-size);
  font-weight: var(--plos-font-weight-bold);
}

.govuk-frontend-supported .govuk-file-upload-button:focus {
  outline: 3px solid var(--plos-color-messaging-focus);
  outline-offset: 3px;
  border: none;
  box-shadow: none;
}

.govuk-frontend-supported
  .govuk-file-upload-button:focus
  .govuk-file-upload-button__pseudo-button {
  background-color: var(--plos-color-brand-white);
  color: var(--plos-color-brand-dark-blue);
  box-shadow: none;
}

.govuk-frontend-supported
  .govuk-file-upload-button:focus:hover
  .govuk-file-upload-button__pseudo-button {
  border-color: var(--plos-color-brand-dark-blue);
  background-color: var(--plos-color-surface-background-primary);
}

/* ==========================================================================
   Icons
   ========================================================================== */
.plos-icon {
  display: block;
  flex: none;
  fill: none;
  width: var(--plos-spacing-05);
  height: var(--plos-spacing-05);
}

.plos-icon--inline {
  display: inline-flex;
}

.plos-icon--block {
  display: block;
}

.plos-banner {
  display: flex;
  align-items: center;
  align-content: flex-start;
  justify-content: flex-start;
  gap: var(--plos-spacing-04);
  margin: var(--plos-spacing-08);
  padding-top: var(--plos-spacing-05);
  padding-bottom: var(--plos-spacing-05);
  padding-right: var(--plos-spacing-05);
  padding-left: var(--plos-spacing-05);
}

.plos-banner--icon-container {
  display: inline-block;
  flex: 0 auto;
  order: 0;
}

.plos-banner--content {
  display: inline-block;
  order: 1;
  flex-grow: 2;
  flex-shrink: 1;
}

.plos-banner--info {
  background-color: var(--plos-color-messaging-info-background);
}

.plos-banner--success {
  background-color: var(--plos-color-messaging-success-background);
}

.plos-banner--problem {
  background-color: var(--plos-color-messaging-problem-background);
}

.plos-banner--warning {
  background-color: var(--plos-color-messaging-warning-background);
}

.plos-banner--success .plos-icon {
  color: var(--plos-color-messaging-success-icon);
  fill: var(--plos-color-messaging-success-icon);
  stroke: var(--plos-color-messaging-success-icon);
}

.plos-banner--problem .plos-icon {
  color: var(--plos-color-messaging-problem-icon);
  fill: var(--plos-color-messaging-problem-icon);
  stroke: var(--plos-color-messaging-problem-icon);
}

.plos-banner--warning .plos-icon {
  color: var(--plos-color-messaging-warning-icon);
  fill: var(--plos-color-messaging-warning-icon);
  stroke: var(--plos-color-messaging-warning-icon);
}