/* Thin override on top of the vendored nineeleven-omeka theme
   (static/theme/css/legacy.css), loaded after it in head.html.

   Scope: (1) WCAG 2.2 AA affordances the 2014-era theme lacks, and (2) the
   content classes our Hugo item/list templates still emit. The old placeholder
   chrome (.site-header/.site-nav/body max-width) is gone — the vendored theme
   now owns page layout, header, footer, nav, typography, and colors. */

/* ------------------------------------------------------------------ */
/* WCAG 2.2 AA additions                                              */
/* ------------------------------------------------------------------ */

/* SC 2.4.1 Bypass Blocks — skip link, visually hidden until focused. */
.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 1000;
  padding: 10px 16px; background: #fff; color: #213881; text-decoration: underline;
}
.skip-link:focus { left: 8px; top: 8px; }
/* The skip target is a non-interactive <main tabindex="-1"> — suppress its ring. */
main:focus { outline: none; }

/* SC 2.4.7 / 2.4.11 Focus Visible — a real, high-contrast ring in the theme blue. */
:focus-visible { outline: 3px solid #213881; outline-offset: 2px; }

/* Accessible-name helper. */
.visually-hidden {
  position: absolute !important; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}

/* SC 2.5.8 Target Size (Min) — >= 24x24 for standalone nav/pagination/tag/facet
   controls that are otherwise tight inline links. */
.navigation a, .pager a, .pagination a, .item-tags a, .terms-cloud a {
  display: inline-block; min-height: 24px; min-width: 24px; padding: 4px 8px;
}

/* SC 1.4.3 Contrast — the theme puts white text on tan #8e8264 (only 3.8:1) for
   buttons, the pager, and sort links; darken to #6f6550 (5.5:1 vs white). */
button, input[type="button"], input[type="reset"], input[type="submit"],
.pagination .pagination_next, .pagination .pagination_previous,
#sort-links a { background-color: #6f6550; }

/* SC 1.4.3 Contrast — the theme's link color, tan #8e8264, is only 3.8:1 on white
   (and it sits over the translucent content background), so darken general links
   to #5f5533 (~7:1). Heading links stay the theme blue (already high-contrast).
   The white-on-tan pager/sort links keep their #fff (more specific) on the now
   darker background above. */
a { color: #5f5533; }
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #213881; }

/* ------------------------------------------------------------------ */
/* Content classes still emitted by our item/list templates          */
/* (pending the item/list/collection DOM-contract port)              */
/* ------------------------------------------------------------------ */

.item-metadata dt { font-weight: bold; margin-top: 0.5em; }
.item-metadata dd { margin-left: 1em; }
.item-files img { max-width: 100%; height: auto; }

/* Item/browse link lists — the theme reset strips list styling, and these use
   our classes (not the theme's), so restore clean spacing. */
.page-list { list-style: none; padding: 0; margin: 1em 0; }
.page-list li { margin: 0.3em 0; }
/* .home-browse is a <nav>, so the theme's `nav ul li { inline-block }` applies;
   lay the links out as a spaced row instead of letting them run together. */
.home-browse ul { list-style: none; padding: 0; margin: 1em 0; display: flex; flex-wrap: wrap; gap: 0.4em 1.5em; }

/* Pagination (Hugo's internal template) — keep it horizontal after the reset. */
.pagination { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 0.25em; padding: 0; margin: 1em 0; }
.pagination .page-item { display: inline-block; }
.pagination a, .pagination button { display: inline-block; min-height: 24px; min-width: 24px; padding: 4px 8px; }
.terms-summary { color: #666; font-size: 0.9em; }
.terms-cloud { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5em 1em; }
.terms-cloud li { display: inline-flex; align-items: baseline; gap: 0.3em; }
.terms-cloud .terms-count { color: #595959; font-size: 0.85em; }
.terms-cloud a { text-decoration: none; }
.terms-cloud a:hover { text-decoration: underline; }

/* dev-only "View original" link (development environment). */
.dev-source-link { margin: 0.25em 0 1em; font-size: 0.85em; }
.dev-source-link a { display: inline-block; padding: 0.15em 0.6em; border: 1px dashed #c9a227; border-radius: 4px; background: #fffbe6; color: #8a6d00; text-decoration: none; }
.dev-source-link a:hover { background: #fff3bf; }

/* Pagefind search widget on /search/. */
#search { margin-top: 1em; }

/* ------------------------------------------------------------------ */
/* Homepage: carousel + featured collections                          */
/* ------------------------------------------------------------------ */

/* Thumbnail carousel — mirrors the original's jCarousel frame (rounded corners,
   soft grey shadow) and round dark-brown prev/next controls that overlap the
   left/right edges. (The theme's jCarousel CSS isn't vendored.) */
.home-carousel { position: relative; margin: 1.25em 0 2em; padding: 10px; border-radius: 5px; box-shadow: 0 0 2px #999; }
.home-carousel-track { list-style: none; display: flex; gap: 0.5em; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding: 0; margin: 0; }
.home-carousel-track li { flex: 0 0 auto; scroll-snap-align: start; margin: 0; }
.home-carousel-track a { display: block; }
.home-carousel-track img { display: block; width: 185px; height: 185px; object-fit: cover; }
.home-carousel-nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%; background: #4e443c; color: #fff; font-size: 24px; line-height: 30px; text-align: center; cursor: pointer; }
.home-carousel-prev { left: 15px; }
.home-carousel-next { right: 15px; }
.home-carousel-nav:hover { background: #63574c; }
.home-carousel-dots { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.4em; margin: 0.6em 0 0; padding: 0; }
/* SC 2.5.8 Target Size — 24x24 hit area with a 10px visual dot centered inside. */
.home-carousel-dots button { width: 24px; height: 24px; padding: 0; border: 0; background: transparent; cursor: pointer; position: relative; }
.home-carousel-dots button::before { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 10px; height: 10px; border-radius: 50%; border: 1px solid #8e8264; background: #fff; }
.home-carousel-dots button.active::before { background: #8e8264; }

/* Featured collections — the theme's #home .collection styles most of this;
   just size the thumbnail and description. */
.collection.record .image img { display: block; width: 200px; height: 200px; object-fit: cover; margin: 0.3em 0; }
.collection.record .collection-description { font-size: 0.9em; }

/* ------------------------------------------------------------------ */
/* Collection tree (/collections/) and news list (/news/)             */
/* ------------------------------------------------------------------ */

/* Collections browse cards (theme adds the .collections .collection divider). */
/* Item/collection browse thumbnails — 200x200 square-cropped like the original's
   square_thumbnails (our stored thumbs aren't square). */
.item-img img,
.collections .collection .image img { width: 200px; height: 200px; object-fit: cover; }

/* Browse controls (items/collections): secondary nav + "Page X of Y" pager. */
.items-nav.secondary-nav { margin: 0.25em 0 1em; }
.items-nav.secondary-nav .navigation { list-style: none; display: flex; flex-wrap: wrap; gap: 1.25em; padding: 0; margin: 0; }
.items-nav.secondary-nav .active a { font-weight: bold; }
.pagination-nav { margin: 1em 0; }
.pagination-nav .pagination { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 1.5em; padding: 0; margin: 0; }
.pagination-nav .pagination li { margin: 0; }
.pagination-nav .pagination_next { margin-left: auto; }

/* Previous/next item navigation on item pages. */
.item-pagination { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 1em; padding-top: 1em; margin-top: 1.5em; border-top: 1px solid #cfcabc; }
.item-pagination li { margin: 0; }
.item-pagination .next { margin-left: auto; }
#item-citation .citation-url { word-break: break-word; }

.collections .collection { padding: 0.9em 0; }
.collections .collection h2 { margin-bottom: 0.35em; }
.collections .collection .image img { display: block; margin: 0.3em 0; }
.collections .collection .view-items-link { font-size: 0.9em; }

/* Child-collection sub-tree on a collection page (plain nested list; the card
   tree at /collections/ uses body.collection-tree, not .collections). */
.collections #collection-tree > ul { list-style: none; padding-left: 0; margin: 0.5em 0; }
.collections #collection-tree ul ul { list-style: disc; padding-left: 1.5em; margin: 0.3em 0; }
.collections #collection-tree li { margin: 0.2em 0; }

/* News: two-column blog with an Archives sidebar. */
.news-layout { display: flex; gap: 2em; align-items: flex-start; }
.news-main { flex: 1 1 auto; min-width: 0; }
.news-sidebar { flex: 0 0 180px; }
.news-sidebar h2 { font-size: 1.15em; border-bottom: 1px solid #cfcabc; padding-bottom: 0.25em; }
.news-sidebar ul { list-style: none; padding: 0; margin: 0; }
.news-sidebar li { margin: 0.35em 0; }
.news-entry { border-bottom: 1px solid #cfcabc; padding-bottom: 1.25em; margin-bottom: 1.5em; }
.news-entry h2 { margin-bottom: 0.15em; }
.news-entry .entry-meta { color: #666; font-size: 0.85em; margin: 0 0 0.75em; }
.news-body img { max-width: 100%; height: auto; }
.news-body figure { margin: 0 0 1em; }
@media (max-width: 640px) { .news-layout { flex-direction: column; } .news-sidebar { flex-basis: auto; } }