/*
 * Niles Connect 5.2.0
 * Shared editorial/page component system.
 *
 * This layer is intentionally scoped to the current page-code families.
 * It does not replace plugin presentation or legacy component CSS.
 */

:where(.nc-today, .nc-community-page, .nc-government-page) {
  --nc-home-ink: #173042;
  --nc-home-navy: #16334a;
  --nc-home-blue: #235f85;
  --nc-home-green: #43725b;
  --nc-home-green-soft: #eef5f0;
  --nc-home-gold: #c7963e;
  --nc-home-cream: #f8f5ee;
  --nc-home-sky: #edf5f8;
  --nc-home-border: #dce5e8;

  width: min(1180px, 100%);
  margin-inline: auto;
  color: var(--nc-home-ink);
  display: grid;
  gap: clamp(2.25rem, 4.5vw, 4rem);
  padding-bottom: clamp(2.75rem, 5vw, 4.5rem);
}

/* The front-page template intentionally opens the WordPress shell to 100%.
   The page-code wrapper above is the actual content boundary. */
body.home .entry-content > .nc-today,
body.front-page .entry-content > .nc-today {
  width: min(1180px, calc(100% - 40px));
}

/* Standard pages already sit in the theme container. Do not create a second
   viewport-width system inside them. */
.entry-content > .nc-government-page {
  width: 100%;
}

/* Shared feature hero. It is a wide panel, not a viewport breakout. */
:where(.nc-today, .nc-community-page, .nc-government-page) > .nc-today__hero {
  width: 100%;
  margin-inline: 0;
  border-radius: 28px;
  padding-inline: clamp(1.5rem, 5vw, 4.5rem);
}

/* Content bands remain visually distinct while following the same page edges. */
:where(.nc-today, .nc-community-page, .nc-government-page) > .nc-home-section--band {
  width: 100%;
  margin-inline: 0;
  padding: clamp(2.25rem, 5vw, 4.5rem) clamp(1.25rem, 4vw, 4rem);
  border-radius: 26px;
}

/* The dark accountability feature is full-width within the page composition,
   not full viewport width. */
:where(.nc-today, .nc-community-page, .nc-government-page) > .nc-home-accountability {
  width: 100%;
  margin-inline: 0;
  padding: clamp(2.5rem, 5vw, 4.75rem) clamp(1.25rem, 4vw, 4rem);
  border-radius: 28px;
}

/* Ordinary sections align directly with hero/band edges. */
:where(.nc-today, .nc-community-page, .nc-government-page) > .nc-home-section {
  width: 100%;
  min-width: 0;
}

:where(.nc-today, .nc-community-page, .nc-government-page) .nc-home-section__head {
  min-width: 0;
}

:where(.nc-today, .nc-community-page, .nc-government-page) .nc-home-section__head > div {
  min-width: 0;
}

/* Government page uses the homepage three-column grid with neutral cards. */
.nc-government-page .nc-home-accountability__grid > .nc-card {
  min-width: 0;
  padding: clamp(1.15rem, 2.5vw, 1.6rem);
  border: 1px solid var(--nc-home-border);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(24, 58, 77, .055);
}

.nc-government-page .nc-home-accountability__grid > .nc-card h3 {
  margin: .15rem 0 .55rem;
  color: var(--nc-home-navy);
}

.nc-government-page .nc-home-accountability__grid > .nc-card p:last-child {
  margin-bottom: 0;
}

/* Plugin output is allowed to use the available section width but may not
   force the whole page wider than its shell. */
:where(.nc-today, .nc-community-page, .nc-government-page) :where(
  .nc-home-section,
  .nc-home-pane,
  .nc-card,
  [class*="dw-"],
  [class*="civic-"]
) {
  min-width: 0;
  max-width: 100%;
}

:where(.nc-today, .nc-community-page, .nc-government-page) img,
:where(.nc-today, .nc-community-page, .nc-government-page) video,
:where(.nc-today, .nc-community-page, .nc-government-page) iframe {
  max-width: 100%;
}

/* Wide records/data tables get their own scroll boundary rather than
   widening the page. */
:where(.nc-today, .nc-community-page, .nc-government-page) table {
  max-width: 100%;
}

/* The source/research notice aligns with the same component language. */
.nc-government-page > .nc-news-source-note {
  margin: 0;
  border-radius: 20px;
}

/* Shared responsive transformations based on the actual page markup. */
@media (max-width: 980px) {
  :where(.nc-today, .nc-community-page, .nc-government-page) > .nc-today__hero {
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
  }

  :where(.nc-today, .nc-community-page, .nc-government-page) .nc-today__hero-panel {
    width: 100%;
    max-width: 680px;
  }

  :where(.nc-today, .nc-community-page, .nc-government-page) .nc-home-accountability__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  :where(.nc-today, .nc-community-page, .nc-government-page) {
    gap: 2.25rem;
  }

  body.home .entry-content > .nc-today,
  body.front-page .entry-content > .nc-today {
    width: min(100% - 28px, 1180px);
  }

  :where(.nc-today, .nc-community-page, .nc-government-page) > .nc-today__hero {
    padding: 2.6rem 1.25rem 3.2rem;
    border-radius: 22px;
  }

  :where(.nc-today, .nc-community-page, .nc-government-page) .nc-today__hero h1 {
    font-size: clamp(2.4rem, 12vw, 4rem);
  }

  :where(.nc-today, .nc-community-page, .nc-government-page) .nc-today__hero-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  :where(.nc-today, .nc-community-page, .nc-government-page) .nc-today__hero-actions a {
    width: 100%;
  }

  :where(.nc-today, .nc-community-page, .nc-government-page) > .nc-home-section--band,
  :where(.nc-today, .nc-community-page, .nc-government-page) > .nc-home-accountability {
    padding: 2.25rem 1.15rem;
    border-radius: 20px;
  }

  :where(.nc-today, .nc-community-page, .nc-government-page) .nc-home-section__head {
    flex-direction: column;
    align-items: flex-start;
    gap: .75rem;
  }

  :where(.nc-today, .nc-community-page, .nc-government-page) .nc-home-accountability__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  :where(.nc-today, .nc-community-page, .nc-government-page) .nc-home-join {
    grid-template-columns: minmax(0, 1fr);
    padding: 1.35rem;
    border-radius: 20px;
  }

  :where(.nc-today, .nc-community-page, .nc-government-page) .nc-home-join__actions {
    width: 100%;
  }

  :where(.nc-today, .nc-community-page, .nc-government-page) .nc-home-join__actions a {
    flex: 1 1 100%;
    justify-content: center;
  }
}

@media (max-width: 480px) {
  body.home .entry-content > .nc-today,
  body.front-page .entry-content > .nc-today {
    width: min(100% - 20px, 1180px);
  }

  :where(.nc-today, .nc-community-page, .nc-government-page) > .nc-today__hero,
  :where(.nc-today, .nc-community-page, .nc-government-page) > .nc-home-section--band,
  :where(.nc-today, .nc-community-page, .nc-government-page) > .nc-home-accountability {
    border-radius: 16px;
  }

  :where(.nc-today, .nc-community-page, .nc-government-page) .nc-home-shortcuts {
    grid-template-columns: minmax(0, 1fr);
  }

  :where(.nc-today, .nc-community-page, .nc-government-page) .nc-home-shortcut:last-child {
    grid-column: auto;
  }
}

/* ==========================================================
   5.3.0 Mobile shortcut-card system
   Consolidated to the proven flex-based phone layout. The earlier
   grid-based correction was superseded and has been removed.
   ========================================================== */
/* ==========================================================
   Mobile shortcut-card hard reset
   Do not use CSS Grid for this component on phones. Safari can
   collapse the text track when legacy/global wrapping rules interact
   with grid min-content sizing. Flex-wrap makes the geometry explicit.
   ========================================================== */
@media (max-width: 640px) {
  :where(.nc-today, .nc-community-page) .nc-home-shortcuts {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  :where(.nc-today, .nc-community-page) .nc-home-shortcut,
  :where(.nc-today, .nc-community-page) .nc-home-shortcut:last-child {
    display: flex !important;
    flex-flow: row wrap !important;
    align-items: center !important;
    align-content: flex-start !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    margin: 0 0 .6rem !important;
    padding: 1rem !important;
    box-sizing: border-box !important;
  }

  :where(.nc-today, .nc-community-page) .nc-home-shortcut__icon {
    display: grid !important;
    place-items: center !important;
    flex: 0 0 40px !important;
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    height: 40px !important;
    margin: 0 .85rem 0 0 !important;
  }

  :where(.nc-today, .nc-community-page) .nc-home-shortcut > strong {
    display: block !important;
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    line-height: 1.25 !important;
  }

  :where(.nc-today, .nc-community-page) .nc-home-shortcut > span:last-child:not(.nc-home-shortcut__icon) {
    display: block !important;
    flex: 0 0 calc(100% - 52px) !important;
    width: calc(100% - 52px) !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: .3rem 0 0 52px !important;
    padding: 0 !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    line-height: 1.45 !important;
  }
}

@media (max-width: 380px) {
  :where(.nc-today, .nc-community-page) .nc-home-shortcut__icon {
    flex-basis: 36px !important;
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    margin-right: .7rem !important;
  }

  :where(.nc-today, .nc-community-page) .nc-home-shortcut > span:last-child:not(.nc-home-shortcut__icon) {
    flex-basis: calc(100% - 47px) !important;
    width: calc(100% - 47px) !important;
    margin-left: 47px !important;
  }
}

/* 5.3.1: Authoritative primary-button contrast rule.
 * Older page-system CSS contains a black !important label color for .nc-button.
 * This shared stylesheet loads last, so primary theme buttons are normalized
 * globally instead of only within selected page wrappers. Secondary/light
 * variants retain their intentionally light-background treatment. */
.nc-button:not(.nc-button--secondary):not(.nc-button-secondary):not(.nc-button-light),
a.nc-button:not(.nc-button--secondary):not(.nc-button-secondary):not(.nc-button-light):link,
a.nc-button:not(.nc-button--secondary):not(.nc-button-secondary):not(.nc-button-light):visited,
a.nc-button:not(.nc-button--secondary):not(.nc-button-secondary):not(.nc-button-light):hover,
a.nc-button:not(.nc-button--secondary):not(.nc-button-secondary):not(.nc-button-light):focus,
a.nc-button:not(.nc-button--secondary):not(.nc-button-secondary):not(.nc-button-light):focus-visible,
a.nc-button:not(.nc-button--secondary):not(.nc-button-secondary):not(.nc-button-light):active {
  background: var(--nc-blue, var(--ah-blue, #083c7a));
  color: #fff !important;
  text-decoration: none;
}

a.nc-button:not(.nc-button--secondary):not(.nc-button-secondary):not(.nc-button-light):hover,
a.nc-button:not(.nc-button--secondary):not(.nc-button-secondary):not(.nc-button-light):focus,
a.nc-button:not(.nc-button--secondary):not(.nc-button-secondary):not(.nc-button-light):focus-visible,
a.nc-button:not(.nc-button--secondary):not(.nc-button-secondary):not(.nc-button-light):active {
  background: var(--nc-blue-dark, #061f40);
}

/* Keep nested labels/icons from reintroducing a dark foreground color. */
.nc-button:not(.nc-button--secondary):not(.nc-button-secondary):not(.nc-button-light) * {
  color: inherit !important;
}



/* 5.4.0 Article transparency and publishing provenance */
.single-article .entry-meta {
  align-items:center;
  justify-content:center;
  gap:.45rem 1rem;
  line-height:1.45;
}
.single-article .entry-meta .posted-on,
.single-article .entry-meta .updated-on,
.single-article .entry-meta .byline {
  display:inline-flex;
  align-items:baseline;
  gap:.28rem;
  min-width:0;
}
.single-article .entry-meta .meta-label {
  color:var(--nc-text,#17212b);
  font-weight:800;
}
.nc-article-transparency {
  max-width:var(--nc-readable,760px);
  margin:38px auto 0;
  padding:24px;
  border:1px solid var(--nc-border,#dce4e8);
  border-radius:18px;
  background:var(--nc-surface-tint,#f7fafb);
}
.nc-article-transparency > h2 { margin:0 0 18px; font-size:1.35rem; }
.nc-article-transparency h3 { margin:0 0 10px; font-size:1rem; }
.nc-article-history + .nc-article-sources { margin-top:24px; padding-top:20px; border-top:1px solid var(--nc-border,#dce4e8); }
.nc-article-history ol { list-style:none; margin:0; padding:0; }
.nc-history-entry { margin:0; padding:14px 0; border-top:1px solid var(--nc-border,#dce4e8); }
.nc-history-entry:first-child { border-top:0; padding-top:0; }
.nc-history-entry__meta { display:flex; flex-wrap:wrap; gap:.35rem .65rem; align-items:baseline; }
.nc-history-entry__meta strong { color:var(--nc-primary,#075985); }
.nc-history-entry--correction .nc-history-entry__meta strong { color:#9f1239; }
.nc-history-entry p { margin:.35rem 0 0; }
.nc-article-sources ul { margin:.25rem 0 0; padding-left:1.2rem; }
.nc-article-sources li + li { margin-top:.45rem; }
.nc-article-sources a { overflow-wrap:break-word; }

@media (max-width:700px) {
  .single-article .entry-meta { justify-content:flex-start; flex-direction:column; align-items:flex-start; gap:.35rem; }
  .single-article .entry-meta .posted-on,
  .single-article .entry-meta .updated-on,
  .single-article .entry-meta .byline { display:flex; flex-wrap:wrap; }
  .nc-article-transparency { margin-top:28px; padding:18px; border-radius:14px; }
}