/* Pagination uses the existing theme and reserves space below the law list. */
#view-search .list-pagination {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 8px 12px;
}

#lawPageStatus {
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

/* Limit these overrides to search geometry; the original theme stays in charge. */
@layer searchLayout {
  #view-search .search-layout {
    grid-template-areas: none !important;
    grid-template-rows: auto !important;
    align-items: start !important;
  }

  #view-search .search-filter-panel,
  #view-search .result-workspace > .detail-panel {
    position: relative !important;
    top: auto !important;
    margin-top: 0 !important;
  }

  #view-search .result-workspace {
    grid-template-columns: minmax(0, 0.76fr) minmax(0, 1.04fr) minmax(0, 0.98fr) !important;
    grid-template-areas: "laws results detail" !important;
    grid-template-rows: minmax(0, 1fr) !important;
    height: min(720px, calc(100dvh - 124px)) !important;
    min-height: 0 !important;
    align-items: stretch !important;
  }

  #view-search .result-workspace > .result-column,
  #view-search .result-workspace > .detail-panel {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
  }

  #view-search .result-workspace > .result-column:first-child { grid-area: laws !important; }
  #view-search .result-workspace > .primary-column { grid-area: results !important; }
  #view-search .result-workspace > .detail-panel { grid-area: detail !important; }

  #view-search .result-column > .scroll-list,
  #view-search .detail-panel > .detail-view {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: auto !important;
  }

  @media (min-width: 1181px) and (max-width: 1559px) {
    #view-search .result-workspace {
      grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) !important;
      grid-template-areas: "laws results" "laws detail" !important;
      grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
      height: min(660px, calc(100dvh - 128px)) !important;
    }
  }

  @media (min-width: 1181px) {
    body[data-active-view="search"] .app-shell {
      padding-bottom: 18px !important;
    }

    #view-search .search-layout {
      /* Match the navigation's 18px top and bottom window margins. */
      height: calc(100dvh - 36px) !important;
      min-height: 0 !important;
      align-items: stretch !important;
    }

    #view-search .search-filter-panel {
      height: 100% !important;
      min-height: 0 !important;
      align-self: stretch;
      overflow: auto !important;
    }

    #view-search .result-workspace {
      /* Keep list content from enlarging the shared viewport-height row. */
      contain: size;
      height: auto !important;
      align-self: stretch;
    }
  }

  @media (max-width: 1180px) {
    #view-search .result-workspace {
      grid-template-columns: minmax(0, 1fr) !important;
      grid-template-areas: "laws" "results" "detail" !important;
      grid-template-rows: repeat(3, auto) !important;
      height: auto !important;
    }

    #view-search .result-workspace > .result-column,
    #view-search .result-workspace > .detail-panel {
      height: min(640px, calc(100dvh - 124px)) !important;
    }
  }

  @media (max-width: 760px) {
    #view-search .search-layout {
      grid-template-columns: minmax(0, 1fr) !important;
    }
  }
}

/* Readable one-hop citations use the detail panel's existing paper and ink. */
@layer detailCitations {
  #view-search .law-citations {
    min-width: 0;
    margin: 12px 0 !important;
    padding: 16px 0 !important;
    border-block: 1px solid var(--line);
    color: var(--ink) !important;
  }

  .law-citations * { min-width: 0; letter-spacing: 0 !important; text-shadow: none !important; }
  .law-citations h4 { margin: 0 0 14px; font-size: 16px !important; color: var(--ink) !important; }
  .law-citation-current {
    display: grid;
    gap: 4px;
    border-left: 3px solid var(--accent);
    padding: 4px 12px;
    margin-bottom: 16px;
  }
  .law-citation-current > span { font-size: 12px; color: var(--ink-soft) !important; }
  .law-citation-current > strong { font-size: 16px !important; color: var(--ink) !important; }
  .law-citation-current > p { margin: 0; font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; color: var(--ink) !important; }
  .law-citation-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-bottom: 1px solid var(--line); }
  #view-search .law-citation-tab {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 48px !important;
    padding: 8px 4px !important;
    border: 0 !important;
    border-bottom: 2px solid transparent !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    font-weight: 600 !important;
    white-space: normal !important;
    color: var(--ink-soft) !important;
    transform: none !important;
  }
  #view-search .law-citation-tab[aria-selected="true"] { border-bottom-color: var(--accent-deep) !important; color: var(--ink) !important; }
  .law-citation-tab-label { overflow-wrap: anywhere; }
  .law-citation-count { flex-shrink: 0; font-variant-numeric: tabular-nums; }
  .law-citation-panel[hidden] { display: none !important; }
  .law-citation-panel { padding-top: 8px; }
  .law-citation-list { list-style: none; margin: 0 0 0 8px; padding: 0 0 0 16px; border-left: 1px solid var(--line-strong); }
  .law-citation-row { position: relative; margin: 0; padding: 0; }
  .law-citation-row::before { content: ""; position: absolute; left: -16px; top: 25px; width: 12px; border-top: 1px solid var(--line-strong); }
  #view-search .law-citation-target {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 5px;
    width: 100%;
    max-width: 100%;
    min-height: 72px !important;
    padding: 12px 6px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--line) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    font: inherit !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    text-align: left !important;
    text-decoration: none;
    color: var(--ink) !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    transform: none !important;
  }
  .law-citation-row-heading { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 4px 12px; }
  .law-citation-row-heading > strong { font-size: 14px !important; font-weight: 700; }
  .law-citation-row-heading > span, .law-citation-source { font-size: 12px; color: var(--ink-soft) !important; }
  .law-citation-title { display: block; font-size: 14px !important; font-weight: 400 !important; color: var(--ink) !important; }
  .law-citations :is(button, a).law-citation-target:hover .law-citation-title { text-decoration: underline; text-underline-offset: 3px; }
  .law-citations :is(button, a):focus-visible { outline: 2px solid var(--accent-deep); outline-offset: -2px; }
  .law-citation-more { margin-top: 8px; }
  .law-citation-more > summary { cursor: pointer; padding: 8px 4px; font-size: 13px; line-height: 1.5; color: var(--accent-deep) !important; }
  .law-citation-more .citation-collapse-label { display: none; }
  .law-citation-more[open] .citation-collapse-label { display: inline; }
  .law-citation-more[open] .citation-expand-label { display: none; }
  .law-citation-empty { margin: 12px 0; font-size: 14px; line-height: 1.5; color: var(--ink-soft) !important; }
}

/* Size the English title against its own column, not the browser width. */
@layer englishOverview {
  html[lang="en"] body.is-overview-view .overview-main-column {
    container: englishOverview / inline-size;
  }

  html[lang="en"] body.is-overview-view .command-hero {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 24px !important;
  }

  html[lang="en"] body.is-overview-view .command-copy {
    grid-template-columns: minmax(0, 1fr) !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html[lang="en"] body.is-overview-view .command-copy > * {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html[lang="en"] body.is-overview-view .command-kicker {
    width: fit-content !important;
    white-space: normal !important;
  }

  html[lang="en"] body.is-overview-view .command-copy h2 {
    font-size: 32px !important;
    line-height: 1.16 !important;
    overflow-wrap: anywhere;
  }

  html[lang="en"] body.is-overview-view .citation-network-preview {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  @container englishOverview (min-width: 1040px) {
    html[lang="en"] body.is-overview-view .command-hero {
      grid-template-columns: minmax(0, 0.4fr) minmax(0, 0.6fr) !important;
    }
  }

  @media (max-width: 760px) {
    html[lang="en"] body.is-overview-view .command-copy h2 {
      font-size: 26px !important;
    }
  }
}

@layer overviewGraph {
  body.is-overview-view .overview-main-column {
    container: englishOverview / inline-size;
  }

  #citationNetworkPreview {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    min-width: 0 !important;
  }

  #citationNetworkPreview .overview-graph-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
    gap: 10px;
    padding: 12px 12px 0;
  }

  .overview-graph-toolbar label { display: grid; gap: 5px; min-width: 0; font-size: 12px; }
  #citationNetworkPreview .overview-graph-toolbar select {
    width: 100%; min-width: 0; max-width: 100%; text-overflow: ellipsis;
    color: #263238 !important;
    font-size: 13px !important;
  }
  .overview-graph-message { min-height: 340px; padding: 24px; }

  #citationNetworkPreview .overview-network-stage {
    height: auto !important;
    padding-bottom: 10px !important;
    min-height: 340px !important;
  }

  #citationNetworkPreview .network-core > div { min-width: 0; width: calc(100% - 20px); }
  #citationNetworkPreview .network-core strong,
  #citationNetworkPreview .network-core span {
    color: #081015 !important;
    opacity: 1 !important;
    text-shadow: none !important;
    overflow-wrap: anywhere;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
  }
  #citationNetworkPreview .network-core strong { -webkit-line-clamp: 2; font-size: 16px !important; line-height: 1.2 !important; }
  #citationNetworkPreview .network-core span { -webkit-line-clamp: 4; font-size: 12px !important; line-height: 1.3 !important; font-weight: 600; }
  #citationNetworkPreview .relation-card > div { min-width: 0; }
  #citationNetworkPreview .relation-card strong { white-space: normal; overflow-wrap: anywhere; }
  #citationNetworkPreview .relation-card > div > span { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
  #citationNetworkPreview .relation-column-title { white-space: normal; }
  #citationNetworkPreview .overview-graph-empty,
  #citationNetworkPreview .overview-graph-shown { margin: 0; font-size: 12px; }
  #citationNetworkPreview .overview-network-lines path { stroke-width: 8px !important; stroke-dasharray: 24 18; }

  .overview-network-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; }
  #citationNetworkPreview .network-legend { position: static !important; max-width: 100%; flex-wrap: wrap; }

  @container englishOverview (max-width: 1039px) {
    body.is-overview-view .command-hero { grid-template-columns: minmax(0, 1fr) !important; }
    #citationNetworkPreview { width: 100% !important; max-width: 100% !important; }
  }

  @media (max-width: 760px) {
    #citationNetworkPreview .overview-graph-toolbar { grid-template-columns: minmax(0, 1fr); }
    #citationNetworkPreview .overview-network-lines { display: none; }
  }
}

/* Keep shared button and breakpoint rules from changing table/navigation geometry. */
@layer detailLayout {
  #historyExamples {
    display: block !important;
    min-width: 0 !important;
    overflow-x: auto !important;
  }

  #historyExamples .history-example-table {
    min-width: 780px;
    padding: 0 !important;
  }

  #historyExamples .history-example-table-head,
  #historyExamples .history-example-row {
    display: grid !important;
    grid-template-columns: 100px minmax(220px, 1fr) 112px 112px 140px !important;
    gap: 12px !important;
    padding: 8px !important;
    border-width: 1px 1px 1px 4px;
    border-style: solid;
    min-width: 0;
    width: 100%;
  }

  #historyExamples .history-example-table-head { border-color: transparent; }
  #historyExamples [role="cell"] { grid-area: auto !important; min-width: 0; }
  #historyExamples .history-example-row > strong { white-space: nowrap !important; }

  #view-jurisdictions #jurisdictionThemeList {
    min-width: 0 !important;
    grid-template-columns: minmax(0, 1fr);
  }

  #jurisdictionThemeList .jurisdiction-theme-heatmap {
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
    padding-bottom: 8px;
  }

  #jurisdictionThemeList .theme-heatmap-row { min-width: 554px; }
  #jurisdictionThemeList .theme-heatmap-row > span {
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  #historyExamples::-webkit-scrollbar,
  #jurisdictionThemeList .jurisdiction-theme-heatmap::-webkit-scrollbar { height: 10px; }
  #historyExamples::-webkit-scrollbar-thumb,
  #jurisdictionThemeList .jurisdiction-theme-heatmap::-webkit-scrollbar-thumb {
    background: var(--accent);
    border-radius: 5px;
  }

  #view-anomalies { container: anomalyLayout / inline-size; }
  #anomalySearchForm {
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1fr) minmax(0, 0.82fr) minmax(0, 1.28fr) auto !important;
  }
  #anomalySearchForm label { min-width: 0; }
  #anomalySearchForm input,
  #anomalySearchForm select { width: 100% !important; min-width: 0 !important; max-width: 100%; text-overflow: ellipsis; }
  #anomalySearchForm input,
  #anomalySearchForm select,
  #anomalySearchForm button { min-height: 42px !important; }

  @container anomalyLayout (max-width: 1000px) {
    #anomalySearchForm { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    #anomalySearchForm button { grid-column: 2; }
  }
  @container anomalyLayout (max-width: 520px) {
    #anomalySearchForm { grid-template-columns: minmax(0, 1fr) !important; }
    #anomalySearchForm button { grid-column: 1; }
  }

  #view-quality .quality-gauge-ring strong {
    color: #081015 !important;
    letter-spacing: 0 !important;
  }
  #view-quality .quality-field-row > span { white-space: normal; overflow-wrap: anywhere; }

  @media (min-width: 761px) and (max-width: 1180px) {
    .sidebar,
    body.is-overview-view .sidebar {
      display: flex !important;
      flex-direction: column !important;
      align-items: stretch !important;
    }
    .sidebar > * { min-width: 0; max-width: 100%; }
    .sidebar .nav-link { white-space: normal !important; overflow-wrap: anywhere; }
  }
  @media (min-width: 981px) and (max-width: 1180px) {
    .sidebar .nav-list { grid-template-columns: minmax(0, 1fr) !important; }
    .sidebar .nav-link { justify-content: flex-start !important; }
  }
}

/* Check records remain readable when long excerpts or paths are expanded. */
@layer auditRecords {
  #anomalyMethod, .audit-check-records { min-width: 0; }
  #anomalyMethod { margin: 8px 0; }
  #anomalyMethod summary, .audit-check-records summary { cursor: pointer; }
  #anomalyMethod p, .audit-check-records p { line-height: 1.5; overflow-wrap: anywhere; }
  .audit-check-records > section { margin: 12px 0; }
  .audit-check-records h4 { margin: 8px 0; font-size: 0.875rem; }
  .audit-check-records .audit-case-meta { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .audit-check-records .audit-evidence-wide { grid-column: 1 / -1; white-space: pre-wrap; }
  .audit-case-header .case-file-id { overflow-wrap: anywhere; }
  @media (max-width: 520px) {
    .audit-check-records .audit-case-meta { grid-template-columns: minmax(0, 1fr) !important; }
  }
}

/* The provision viewport must grow with its grid-stretched panel. */
@layer historyScroll {
  #view-history .provision-panel {
    display: flex !important;
    flex-direction: column !important;
  }

  #view-history .provision-panel > .section-heading,
  #view-history .provision-panel > .history-version-selectors {
    flex: 0 0 auto;
  }

  #historyProvisionTimeline {
    /* A definite basis keeps the full text from setting the outer panel height. */
    flex: 1 1 0px;
    min-height: 640px !important;
    max-height: none !important;
    align-content: start;
    overflow: auto !important;
  }
}

/* Performance evidence stays within its existing side panel at narrow widths. */
@layer performancePanel {
  #qualityBenchmark { min-width: 0; container: benchmarkPanel / inline-size; }
  #qualityBenchmark .benchmark-context { display: grid; gap: 8px; min-width: 0; }
  #qualityBenchmark .benchmark-context label { margin: 4px 0 0; }
  #qualityBenchmark #benchmarkCaseSelect { width: 100%; max-width: 100%; min-width: 0; }
  #qualityBenchmark .benchmark-conditions { margin: 8px 0; font-size: 0.875rem; line-height: 1.6; }
  #qualityBenchmark p,
  #qualityBenchmark .quality-benchmark-card > * {
    white-space: normal !important;
    overflow-wrap: anywhere;
    letter-spacing: 0 !important;
  }
  #qualityBenchmark .quality-benchmark-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #qualityBenchmark .quality-benchmark-card { min-width: 0; }
  #qualityBenchmark .quality-benchmark-card strong { font-size: 1.05rem !important; }
  @container benchmarkPanel (max-width: 320px) {
    #qualityBenchmark .quality-benchmark-grid { grid-template-columns: minmax(0, 1fr) !important; }
  }
}
