/* ==========================================================================
   Newsroom Search — template-newsroom-search.php
   Design ref: CCC26_Newsroom – Search / CCC26_Newsroom – Search_Mobile
   (CCC_Web_2026GP.xd). Loaded only on that page template (see
   inc/newsroom-search.php). Same shape as Publications & Indices (hero +
   Filters sidebar + results list), duplicated under news- classes rather
   than shared so the two pages have no cross-file dependency.
   ========================================================================== */

#newsroom-search {
  --news-hero-gradient: linear-gradient(90deg, #1A2230, #242E42);
}

/* ---- Hero ---------------------------------------------------------- */

.news-hero {
  background: var(--news-hero-gradient);
  width: 100%;
  padding: 5rem 10%;
}

.news-hero__inner {
  max-width: 100rem; /* 1600px */
  margin: 0 auto;
}

.news-hero__title {
  color: var(--ccc-color-white);
  margin: 0 0 1.25rem; /* 20px */
}

.news-hero__subtitle {
  font-size: var(--ccc-body-lg-size);
  line-height: var(--ccc-body-lg-line);
  color: var(--ccc-color-white);
  margin: 0 0 1.25rem; /* 20px */
}

.news-hero__form {
  display: flex;
  gap: 0.75rem;
}

.news-hero__input {
  flex: 0 1 50%;
  max-width: 50%;
  border: 0;
  border-radius: 0.4375rem; /* 7px */
  padding: 0 1.25rem;
  height: 3.75rem;
  font-family: var(--ccc-font-sans);
  font-size: var(--ccc-body-md-size);
  color: var(--ccc-color-ink);
  background: var(--ccc-color-white);
}

.news-hero__input::placeholder {
  color: var(--ccc-color-slate);
}

.news-hero__submit {
  flex-shrink: 0;
  height: 3.75rem;
  padding: 0 2rem;
  border: 0;
  border-radius: 0.5rem;
  background: var(--ccc-color-orange);
  color: var(--ccc-color-white);
  font-family: var(--ccc-font-mono);
  font-weight: 500;
  font-size: var(--ccc-mono-size);
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.news-hero__submit:hover {
  background: var(--ccc-color-orange-dark);
}

/* ---- Layout: sidebar + results -------------------------------------- */

.news-layout {
  display: flex;
  align-items: flex-start;
  gap: 2.5rem;
  max-width: 93.75rem; /* 1500px */
  margin: 0 auto;
  padding: 5rem 10%;
}

/* ---- Filters sidebar --------------------------------------------------- */

.news-filters {
  flex: 0 0 33.333%;
  min-width: 0;
}

.news-filters__title {
  font-size: var(--ccc-heading-xl-size);
  line-height: var(--ccc-heading-xl-line);
  margin: 0 0 0.75rem;
}

.news-filters__title::after {
  content: '';
  display: block;
  width: 10rem;
  height: 3px;
  background: var(--ccc-color-orange);
  margin: 0.75rem 0 2.5rem;
}

.news-filters__group {
  border: 0;
  margin: 0 0 2.5rem;
  padding: 0;
}

.news-filters__group[hidden] {
  display: none;
}

.news-filters__legend {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  width: 100%;
  font-family: var(--ccc-font-mono);
  font-weight: 500;
  font-size: 1.9375rem; /* 31px */
  color: var(--ccc-color-ink);
  margin-bottom: 1.5rem;
  cursor: default;
  list-style: none;
}

.news-filters__legend::-webkit-details-marker {
  display: none;
}

.news-filters__legend::after {
  content: '';
  flex: 0 0 auto;
  width: 6rem;
  height: 3px;
  background: var(--ccc-color-orange);
}

.news-filters__radio {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-family: var(--ccc-font-sans);
  font-weight: normal;
  font-size: 1.25rem; /* 20px */
  color: var(--ccc-color-ink);
  cursor: pointer;
  margin-bottom: 2.125rem; /* 34px */
}

.news-filters__radio:last-child {
  margin-bottom: 0;
}

.news-filters__radio input[type='radio'] {
  -webkit-appearance: none;
  appearance: none;
  width: 1.5rem;
  height: 1.5rem;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--ccc-color-white) 0% 0% no-repeat padding-box;
  border: 2px solid var(--ccc-color-cream);
  cursor: pointer;
}

.news-filters__radio input[type='radio']:hover {
  background: var(--ccc-color-orange) 0% 0% no-repeat padding-box;
  border: 2px solid var(--ccc-color-cream);
}

.news-filters__radio input[type='radio']:checked {
  background: var(--ccc-color-white) 0% 0% no-repeat padding-box;
  border: 6px solid var(--ccc-color-orange);
}

.news-filters__custom-range {
  display: flex;
  gap: 1rem;
  margin: 0 0 2.125rem; /* 34px, same gap the radio labels use */
}

.news-filters__custom-range[hidden] {
  display: none;
}

.news-filters__date-field {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  font-family: var(--ccc-font-sans);
  font-size: 0.875rem; /* 14px */
  color: var(--ccc-color-slate);
}

.news-filters__date-input {
  border: 2px solid var(--ccc-color-cream);
  border-radius: 0.4375rem; /* 7px, same radius as .news-hero__input */
  padding: 0 0.75rem;
  height: 2.75rem;
  font-family: var(--ccc-font-sans);
  font-size: 1rem;
  color: var(--ccc-color-ink);
  background: var(--ccc-color-white);
}

/* ---- Results column ------------------------------------------------------ */

.news-results-col {
  flex: 0 0 66.667%;
  min-width: 0;
}

.news-results-count {
  text-align: left;
  font-family: var(--ccc-font-mono);
  font-weight: 500;
  font-size: 1.25rem; /* 20px */
  line-height: 1.25rem; /* 20px */
  letter-spacing: 0;
  color: var(--ccc-color-navy);
  margin: 0 0 3.75rem; /* 60px, before results start */
  padding-bottom: 1.875rem; /* 30px */
  border-bottom: 2px solid var(--ccc-color-cream);
}

.news-list {
  display: flex;
  flex-direction: column;
}

.news-item {
  padding-top: 3.75rem; /* 60px */
  padding-bottom: 3.75rem; /* 60px */
  border-bottom: 1.5px solid var(--ccc-color-cream); /* #EFEDE9 */
}

.news-item:first-child {
  padding-top: 0;
}

.news-item__date {
  display: block;
  text-align: left;
  text-transform: uppercase;
  font-family: var(--ccc-font-mono);
  font-weight: 500;
  font-size: 0.9375rem; /* 15px */
  line-height: 1.25rem; /* 20px */
  letter-spacing: 0;
  color: var(--ccc-color-ink);
  margin-bottom: 1.875rem; /* 30px, to the text+cover row */
}

.news-item__row {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  gap: 2.75rem;
}

.news-item__text {
  order: 1;
  flex: 1;
  min-width: 0;
}

.news-item__title {
  text-align: left;
  font-family: var(--ccc-font-sans);
  font-weight: bold;
  font-size: 1.875rem; /* 30px */
  line-height: 1.875rem; /* 30px */
  letter-spacing: 0;
  color: var(--ccc-color-navy);
  margin: 0 0 1.875rem; /* 30px */
}

.news-item__title a {
  color: var(--ccc-color-navy);
  text-decoration: none;
}

.news-item__title a:hover {
  color: var(--ccc-color-orange);
}

.news-item__excerpt {
  text-align: left;
  font-family: var(--ccc-font-sans);
  font-style: italic;
  font-weight: 300;
  font-size: 1.375rem; /* 22px */
  line-height: 1.25;
  letter-spacing: 0;
  color: var(--ccc-color-ink);
  margin: 0 0 1.875rem; /* 30px */
}

.news-item__byline {
  color: var(--ccc-color-ink);
}

.news-item__cover {
  flex-shrink: 0;
  order: 2;
  display: block;
  max-width: 16rem;
  border-radius: 0;
  box-shadow: 0 0.1875rem 0.625rem #1B243280; /* 0px 3px 10px */
}

.news-item__cover img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
}

/* ---- Recent Media card — outlet badge, no image, no excerpt ------------- */

.news-item--media .news-item__title {
  margin: 0 0 1.25rem; /* 20px */
}

.news-item--media .news-item__date {
  margin: 0 0 0.75rem; /* 12px, before the byline */
}

.news-item__badge {
  display: inline-block;
  background: var(--ccc-color-navy);
  color: var(--ccc-color-white);
  font-family: var(--ccc-font-mono);
  font-weight: 500;
  font-size: 0.813rem;
  letter-spacing: 0;
  padding: 0.25rem 0.875rem; /* matches .outlet-info span */
  border-radius: 0.25rem;
  margin-bottom: 1.25rem; /* 20px */
}

/* ---- Pagination ---------------------------------------------------------- */

.news-pagination {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.9375rem; /* 15px */
  margin-top: 3.75rem;
}

.news-pagination__link {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 2.8125rem;
  height: 2.8125rem;
  padding: 0 0.5rem;
  background: var(--ccc-color-white) 0% 0% no-repeat padding-box;
  border: 2px solid var(--ccc-color-cream);
  border-radius: 0.9375rem; /* 15px */
  font-family: var(--ccc-font-mono);
  font-weight: 500;
  font-size: 1.125rem; /* 18px */
  line-height: 1.25rem; /* 20px */
  letter-spacing: 0;
  color: var(--ccc-color-orange);
  cursor: pointer;
}

.news-pagination__link:hover,
.news-pagination__link:active,
.news-pagination__link.is-current {
  background: var(--ccc-color-orange) 0% 0% no-repeat padding-box;
  border: 2px solid var(--ccc-color-cream);
  border-radius: 0.9375rem;
  color: var(--ccc-color-white);
}

.news-pagination__arrow,
.news-pagination__dots {
  background: transparent;
  border: 0;
  min-width: auto;
  height: auto;
  padding: 0;
  font-family: var(--ccc-font-mono);
  font-weight: 500;
  font-size: 1.125rem; /* 18px */
  color: var(--ccc-color-orange);
  cursor: pointer;
}

.news-pagination__dots {
  cursor: default;
}

.news-pagination__arrow:hover {
  color: var(--ccc-color-orange-dark);
}

/* ============================================================
   TABLET (≤1024px)
   ============================================================ */
@media (max-width: 1024px) {
  .news-layout {
    flex-direction: column;
    gap: 2.5rem;
  }

  .news-filters {
    flex: 1 1 auto;
    width: 100%;
  }

  .news-filters__group {
    margin-bottom: 1rem;
  }

  .news-filters__legend {
    cursor: pointer;
    padding: 0.875rem 1.25rem;
    margin-bottom: 0;
    border: 1px solid var(--ccc-color-cream);
    border-radius: 0.5rem;
    background: var(--ccc-color-white);
    font-family: var(--ccc-font-sans);
    font-weight: 500;
    font-size: 1.125rem;
  }

  .news-filters__legend::after {
    width: 0.5rem;
    height: 0.5rem;
    background: none;
    border-right: 2px solid var(--ccc-color-ink);
    border-bottom: 2px solid var(--ccc-color-ink);
    transform: rotate(45deg);
    margin-top: -0.25rem;
    transition: transform 0.2s ease;
  }

  .news-filters__group[open] .news-filters__legend::after {
    transform: rotate(-135deg);
    margin-top: 0.25rem;
  }

  .news-filters__options {
    display: none;
    padding: 1.25rem 0.25rem 0;
  }

  .news-filters__group[open] .news-filters__options {
    display: block;
  }
}

/* ============================================================
   MOBILE (≤767px)
   ============================================================ */
@media (max-width: 767px) {
  .news-hero {
    padding: 3rem 1.25rem 2.5rem;
  }

  .news-hero__form {
    flex-direction: column;
  }

  .news-hero__input {
    max-width: 100%;
  }

  .news-layout {
    padding: 3rem 1.25rem 4rem;
  }

  .news-item__row {
    flex-direction: column;
  }

  .news-item__cover {
    max-width: 100%;
    width: 100%;
    margin-top: 1.875rem; /* 30px, same as the row's usual gap */
  }

  .news-item__cover img {
    width: 100%;
  }
}
