/* ============================================================
   Minneapolis Uprising month pages — v2 layout (design A, 2026-11-08).
   Loaded only when cdpc_uprising_month_is_v2() (month-v2.php), which also
   dequeues v1's month-page.css. The page shell rules v1 carried are repeated
   here; the toolbar and gallery are photo-set.php's, restyled.
============================================================ */

body.umv2-active,
body.umv2-active #page,
body.umv2-active #content,
body.umv2-active .site-content,
body.umv2-active .ast-container,
body.umv2-active .content-area,
body.umv2-active .site-main { background: #07090c !important; }
body.umv2-active #secondary,
body.umv2-active .widget-area.secondary,
body.umv2-active .entry-title,
body.umv2-active header.entry-header,
body.umv2-active .ast-advanced-headers-layout-1 { display: none !important; }
body.umv2-active #primary { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; }
body.umv2-active .ast-container { max-width: none !important; padding: 0 !important; }
body.umv2-active .site-content { padding-top: 0 !important; }

body.umv2-active {
  --umv2-gutter: 56px;
  --umv2-text: #f0eee9;
  --umv2-body: #dcd9d2;
  --umv2-copy: #b4b0a9;
  --umv2-dim: #8f8a83;
  --umv2-line: rgba(255, 255, 255, .09);
  --umv2-pink: #c64191;
  --umv2-pink-hi: #e2589f;
  --umv2-serif: 'Newsreader', Georgia, 'Times New Roman', serif;
  --umv2-label: 'Jost', 'Source Sans 3', system-ui, sans-serif;
}

/* The layout box is full width; everything but the cover gets the gutter. */
body.umv2-active .photo-set-layout { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 0 20px !important; color: var(--umv2-text); font-family: var(--umv2-label); }
body.umv2-active .photo-set-layout > :not(.umv2):not(script):not(style) { width: auto !important; max-width: none !important; box-sizing: border-box; margin-left: var(--umv2-gutter) !important; margin-right: var(--umv2-gutter) !important; }
body.umv2-active .photo-set-layout { overflow-x: clip; }

.umv2 a { color: inherit; text-decoration: none; }
.umv2 :is(h1, h2, h3) { margin: 0; color: var(--umv2-text); font-family: var(--umv2-serif); font-weight: 400; text-transform: none; letter-spacing: normal; }
.umv2 p { margin: 0; }
.umv2 img { display: block; width: 100%; height: 100%; object-fit: cover; max-width: none; }
.umv2Kick { display: block; font: 600 11px/1.3 var(--umv2-label); letter-spacing: .2em; text-transform: uppercase; color: var(--umv2-pink-hi); }
.umv2Pink { color: var(--umv2-pink-hi); }

/* ---------- Cover ---------- */
.umv2Hero { position: relative; display: flex; align-items: flex-end; min-height: clamp(460px, 64vh, 640px); }
.umv2Hero__media { position: absolute; inset: 0; overflow: hidden; }
.umv2Hero__media::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(7, 9, 12, .94) 0%, rgba(7, 9, 12, .62) 42%, rgba(7, 9, 12, .05) 80%),
              linear-gradient(0deg, #07090c 0%, rgba(7, 9, 12, 0) 32%);
}
.umv2Hero__text { position: relative; z-index: 1; max-width: 700px; padding: 0 var(--umv2-gutter) 46px; }
.umv2Crumbs { font: 600 11px/1.4 var(--umv2-label); letter-spacing: .18em; text-transform: uppercase; color: #cfcac3; }
.umv2Crumbs i { margin: 0 9px; font-style: normal; color: var(--umv2-pink-hi); }
.umv2 .umv2Crumbs a:hover { color: var(--umv2-pink-hi); }
.umv2Hero__title { margin: 14px 0 14px !important; font-size: clamp(36px, 4.6vw, 62px) !important; line-height: 1.04 !important; }
.umv2Hero__dek { font-size: 17px; line-height: 1.55; color: #d4d0ca; }
.umv2Hero__stats { margin-top: 14px !important; font-size: 14px; color: #cfcac3; }
.umv2Hero__stats b { color: #fff; font-weight: 500; }
.umv2Hero__edit { position: absolute; top: 16px; right: 16px; z-index: 2; padding: 6px 10px; background: rgba(0, 0, 0, .6); font: 500 11px var(--umv2-label); letter-spacing: .1em; text-transform: uppercase; }

/* ---------- Months of the year ---------- */
.umv2Months { display: flex; align-items: center; gap: 14px; padding: 14px var(--umv2-gutter); border-top: 1px solid var(--umv2-line); border-bottom: 1px solid var(--umv2-line); }
.umv2Months__yr { flex: none; font: 600 12px var(--umv2-label); letter-spacing: .12em; color: var(--umv2-dim); }
.umv2 a.umv2Months__yr:hover { color: var(--umv2-pink-hi); }
.umv2Months__rail { display: flex; gap: 8px; flex: 1 1 auto; overflow-x: auto; scrollbar-width: none; padding: 3px; }
.umv2Months__rail::-webkit-scrollbar { display: none; }
.umv2Months__m { flex: 0 0 88px; opacity: .55; transition: opacity .15s; }
.umv2Months__m:hover, .umv2Months__m.is-on { opacity: 1; }
.umv2Months__img { display: block; height: 50px; overflow: hidden; background: #12161c; }
.umv2Months__m.is-on .umv2Months__img { outline: 2px solid var(--umv2-pink); outline-offset: 2px; }
.umv2Months__lbl { display: block; margin-top: 6px; font: 600 10px var(--umv2-label); letter-spacing: .14em; text-transform: uppercase; }
.umv2Months__m.is-on .umv2Months__lbl { color: #fff; }

.umv2Step { display: none; }

/* ---------- Intro ---------- */
.umv2Intro { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 56px; padding: 44px var(--umv2-gutter) 36px; }
.umv2Intro__text { max-width: 820px; font: 400 19px/1.65 var(--umv2-serif); color: #ddd8d1; }
.umv2Intro__text p { margin: 0 0 1em; }
.umv2Intro__text :is(h2, h3) { margin: 1.2em 0 .5em; font: 600 11px/1.3 var(--umv2-label); letter-spacing: .2em; text-transform: uppercase; color: var(--umv2-pink-hi); }
.umv2Intro__text a { color: #fff; text-decoration: underline; text-decoration-color: rgba(226, 88, 159, .6); }
.umv2Intro__text ul { margin: 0 0 1em; padding: 0 0 0 20px; list-style: none; border-left: 1px solid rgba(198, 65, 145, .45); font: 400 15px/1.65 var(--umv2-label); color: var(--umv2-copy); }
.umv2Intro__text li { margin: 0 0 .6em; }
.umv2Intro__text strong, .umv2Intro__text b { color: #fff; font-weight: 600; }
.umv2Intro__text details > summary { display: none; }
.umv2Intro__text details:not([open]) > :not(summary) { display: block; }
.umv2Intro__box { align-self: start; padding-left: 24px; border-left: 1px solid rgba(255, 255, 255, .12); font-size: 14px; line-height: 1.9; color: #bdb8b1; }
.umv2Intro__box .umv2Kick { margin-bottom: 8px; }
.umv2 .umv2Intro__box a:hover { color: var(--umv2-pink-hi); }
.umv2Intro__more { display: none; }

/* ---------- Toolbar ---------- */
body.umv2-active .pa-toolbar {
  position: sticky; top: 0; z-index: 30;
  margin-top: 0 !important; margin-bottom: 26px !important; padding: 10px 0 !important;
  background: rgba(7, 9, 12, .94) !important; backdrop-filter: blur(8px);
  border: 0 !important; border-top: 1px solid var(--umv2-line) !important; border-bottom: 1px solid var(--umv2-line) !important;
  box-shadow: none !important;
}
body.admin-bar.umv2-active .pa-toolbar { top: 32px; }
body.umv2-active .pa-tb-search-input { background: transparent !important; border: 1px solid rgba(255, 255, 255, .2) !important; border-radius: 0 !important; color: var(--umv2-text) !important; font-family: var(--umv2-label) !important; }
body.umv2-active .pa-tb-search-btn { background: var(--umv2-pink) !important; border-radius: 0 !important; }
body.umv2-active :is(.pa-tb-sort-btn, .pa-density-btn) { border-radius: 0 !important; font-family: var(--umv2-label) !important; letter-spacing: .1em; text-transform: uppercase; font-size: 11px !important; }
body.umv2-active :is(.pa-tb-sort-btn.is-active, .pa-density-btn.is-active, .pa-density-btn[aria-pressed="true"]) { background: var(--umv2-pink) !important; border-color: var(--umv2-pink) !important; color: #fff !important; }
body.umv2-active .psg-count { font-family: var(--umv2-label); color: var(--umv2-dim); }

/* ---------- Gallery: 3 across, date + caption under each photo ---------- */
body.umv2-active .photo-set-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 34px 24px !important; margin-top: 0 !important; margin-bottom: 40px !important; }
body.umv2-active[data-pa-density="compact"] .photo-set-gallery { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 26px 16px !important; }
body.umv2-active[data-pa-density="large"] .photo-set-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
body.umv2-active .photo-set-item { display: flex; flex-direction: column; margin: 0; border: 0; background: none; box-shadow: none; overflow: visible; }
body.umv2-active .photo-set-item > .photo-set-card-link { order: 1; display: block; aspect-ratio: 3 / 2; overflow: hidden; background: #12161c; }
body.umv2-active .photo-set-item > .photo-set-card-link img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
body.umv2-active .photo-set-item:hover > .photo-set-card-link img { transform: scale(1.03); }
/* Date overlay (set's "Show date overlay" setting): the site-wide small label over the photo's
   bottom-left corner, as on other sets (photo-set.css). The figure also holds the caption below
   the photo, so "bottom" is the photo's bottom edge: the photo is always 3:2 of the figure width. */
body.umv2-active .photo-set-item { container-type: inline-size; }
body.umv2-active .photo-set-date-overlay { top: calc(66.667cqw - 10px); bottom: auto; transform: translateY(-100%); }
@media (max-width: 768px) {
  body.umv2-active .photo-set-date-overlay { top: calc(66.667cqw - 7px); }
}
/* A set with "Hide all captions" ticked keeps its captions visually hidden (photo-set.css), still in the HTML and the lightbox. */
body.umv2-active .photo-set-item .photo-set-caption:not(.photo-set-caption--hidden),
body.umv2-active .photo-set-layout--uprising .photo-set-item .photo-set-caption:not(.photo-set-caption--hidden) {
  order: 3; position: static; width: auto; height: auto; margin: 11px 0 0; padding: 0; overflow: visible;
  clip: auto; clip-path: none; white-space: normal; border: 0; background: none; box-shadow: none; transform: none; opacity: 1; visibility: visible;
  font: 400 13.5px/1.55 var(--umv2-label); color: var(--umv2-copy); cursor: pointer;
}
body.umv2-active .photo-set-caption__body { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
body.umv2-active .photo-set-caption.umv2-open { cursor: auto; }
body.umv2-active .photo-set-caption.umv2-open .photo-set-caption__body { display: block; -webkit-line-clamp: unset; }
body.umv2-active .photo-set-caption a { color: var(--umv2-body); text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .3); }
body.umv2-active .photo-set-caption__toggle { display: none !important; }
/* With the date overlay on, the date is already shown above the caption; month-v2.js drops the dash after it.
   With it off, the caption keeps its own date (unless the set hides caption dates). */
body.umv2-active .photo-set-item:has(.photo-set-date-overlay) .photo-set-caption .photo-caption-date { display: none; }
body.umv2-active .pa-toolbar-controls { flex-wrap: wrap; row-gap: 8px; }
body.umv2-active .photo-set-lightbox-btn { order: 0; }
body.umv2-active .photo-set-pagination { margin-bottom: 40px !important; }

/* ---------- End of month ---------- */
body.umv2-active .photo-set-layout > .umv2End { margin: 30px 0 0 !important; padding: 50px var(--umv2-gutter) 54px; background: #0b0e12; border-top: 1px solid var(--umv2-line); }
.umv2End a { color: inherit; text-decoration: none; }
.umv2End__cards { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.umv2End__card { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 20px; align-items: center; padding: 14px; border: 1px solid rgba(255, 255, 255, .12); transition: border-color .15s; }
a.umv2End__card:hover { border-color: var(--umv2-pink-hi); }
.umv2End__card.is-off { display: flex; flex-direction: column; justify-content: center; gap: 8px; border-style: dashed; }
.umv2End__card.is-off .umv2Kick { color: var(--umv2-dim); }
.umv2End__none { font-size: 14px; color: var(--umv2-dim); }
.umv2End__img { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: #12161c; }
.umv2End__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.umv2End__txt { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.umv2End__lbl { font: 600 11px var(--umv2-label); letter-spacing: .14em; text-transform: uppercase; color: var(--umv2-text); }
.umv2End__sub { font: 400 20px/1.3 var(--umv2-serif); color: var(--umv2-body); }
.umv2End__links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.umv2Btn { display: inline-flex; align-items: center; padding: 12px 18px; border: 1px solid rgba(255, 255, 255, .22); font: 500 12px/1 var(--umv2-label); letter-spacing: .14em; text-transform: uppercase; color: var(--umv2-text); }
.umv2Btn:hover { border-color: var(--umv2-pink-hi); }

/* ---------- Tablet ---------- */
@media (max-width: 1100px) {
  body.umv2-active { --umv2-gutter: 32px; }
  body.umv2-active .photo-set-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body.umv2-active[data-pa-density="compact"] .photo-set-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  .umv2Intro { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .umv2Intro__box { padding: 16px 0 0; border-left: 0; border-top: 1px solid rgba(255, 255, 255, .12); }
  .umv2End__card { grid-template-columns: 150px minmax(0, 1fr); }
}

/* ---------- Phone ---------- */
@media (max-width: 700px) {
  body.umv2-active { --umv2-gutter: 18px; }
  body.admin-bar.umv2-active .pa-toolbar { top: 0; }
  .umv2Hero { min-height: 500px; }
  .umv2Hero__media::after { background: linear-gradient(0deg, #07090c 18%, rgba(7, 9, 12, .55) 58%, rgba(7, 9, 12, .1) 100%); }
  .umv2Hero__text { padding-bottom: 22px; }
  .umv2Hero__title { font-size: 32px !important; }
  .umv2Hero__dek { font-size: 15px; }
  .umv2Hero__stats { font-size: 13px; }
  /* Phones get Prev / year / Next instead of the month strip. */
  .umv2Months { display: none; }
  .umv2Step { display: flex; justify-content: space-between; gap: 8px; padding: 12px var(--umv2-gutter); border-top: 1px solid var(--umv2-line); border-bottom: 1px solid var(--umv2-line); }
  .umv2Step__a { padding: 8px 11px; border: 1px solid rgba(255, 255, 255, .2); font: 600 11px var(--umv2-label); letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
  .umv2Step__a.is-off { opacity: .4; }
  .umv2Intro { padding-top: 22px; padding-bottom: 18px; }
  .umv2Intro__text { font-size: 16px; }
  .umv2Intro.is-clamped .umv2Intro__text { max-height: 9.9em; overflow: hidden; -webkit-mask-image: linear-gradient(180deg, #000 60%, transparent); mask-image: linear-gradient(180deg, #000 60%, transparent); }
  .umv2Intro__more { display: inline-block; margin-top: 6px; padding: 0; background: none; border: 0; font: 600 11px var(--umv2-label); letter-spacing: .14em; text-transform: uppercase; color: var(--umv2-pink-hi); cursor: pointer; }
  .umv2Intro:not(.is-clamped) .umv2Intro__more { display: none; }
  body.umv2-active .photo-set-gallery,
  body.umv2-active[data-pa-density="large"] .photo-set-gallery { grid-template-columns: minmax(0, 1fr) !important; gap: 26px !important; }
  body.umv2-active[data-pa-density="compact"] .photo-set-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 18px 10px !important; }
  body.umv2-active[data-pa-density="compact"] .photo-set-caption { display: none; }
  .umv2End__cards { grid-template-columns: minmax(0, 1fr); }
  .umv2End__card { grid-template-columns: 110px minmax(0, 1fr); gap: 14px; }
  .umv2End__sub { font-size: 16px; }
  body.umv2-active .photo-set-layout > .umv2End { padding: 34px var(--umv2-gutter); }
}

/* Editors only: Change photo sits top-right on the cover, so Edit set moves left; Edit caption sits top-left on each photo. */
.umv2Hero[data-cip-kind] .umv2Hero__edit { right: auto; left: 16px; }
.umv2-active .photo-set-item[data-fe-kind] { position: relative; }
.umv2Intro__text[data-fe-kind]:not(:has(p))::after { content: "No intro yet."; color: rgba(255, 255, 255, .45); font-style: italic; }

/* Caption ⓘ (set has "Hide all captions" ticked). The button stays quiet when the
   mouse is merely over the photo and lights up only when it is itself hovered or open.
   The popup: the Uprising rule that keeps captions clipped (photo-set.css,
   .photo-set-layout--uprising …) outranks the theme's .is-open card, so it is restated here. */
body.umv2-active .photo-set-item:hover .photo-set-caption-info-btn:not(:hover):not([aria-expanded="true"]) {
  background: rgba(10, 14, 20, .38); border-color: rgba(255, 255, 255, .22); color: rgba(255, 255, 255, .85); box-shadow: none;
}
body.umv2-active .photo-set-item .photo-set-caption-info-btn:hover,
body.umv2-active .photo-set-item .photo-set-caption-info-btn:focus-visible,
body.umv2-active .photo-set-item .photo-set-caption-info-btn[aria-expanded="true"] {
  background: #c64191; border-color: #c64191; color: #fff;
}
body.umv2-active .photo-set-item .photo-set-caption--popup.is-open,
body.umv2-active .photo-set-layout--uprising .photo-set-item .photo-set-caption--popup.is-open {
  position: absolute; left: 10px; right: 10px; top: auto; bottom: calc(100% - 66.667cqw + 44px);
  width: auto; height: auto; max-height: calc(66.667cqw - 56px); margin: 0; padding: 12px 14px; overflow: auto;
  clip: auto; clip-path: none; white-space: normal; z-index: 4; opacity: 1; visibility: visible;
  background: rgba(7, 9, 12, .94); border: 1px solid rgba(255, 255, 255, .14); box-shadow: 0 8px 22px rgba(0, 0, 0, .35);
  font: 400 13.5px/1.55 var(--umv2-label); color: var(--umv2-copy); cursor: auto;
}
body.umv2-active .photo-set-item .photo-set-caption--popup.is-open .photo-set-caption__body { display: block; -webkit-line-clamp: unset; overflow: visible; }

/* Gallery spacing matches the ICE set (Chad, 2026-11-08: "refer to ice page for good padding"):
   the photos and their toolbar run nearly edge to edge with 5px between photos, at every
   density. The cover, intro and month strip keep the page gutter. A visible caption gets
   room below it so the next row doesn't sit on its text. */
body.umv2-active .photo-set-layout > .photo-set-gallery:not(.umv2):not(script),
body.umv2-active .photo-set-layout > .pa-toolbar:not(.umv2):not(script) { margin-left: 5px !important; margin-right: 5px !important; }
body.umv2-active .photo-set-layout .photo-set-gallery,
body.umv2-active[data-pa-density] .photo-set-layout .photo-set-gallery { gap: 5px !important; }
body.umv2-active .photo-set-item .photo-set-caption:not(.photo-set-caption--hidden),
body.umv2-active .photo-set-layout--uprising .photo-set-item .photo-set-caption:not(.photo-set-caption--hidden) { padding: 0 4px 22px; }

/* Editors only: placeholder where a month has no subtitle yet (inline-edit). */
.umv2Hero__dek--empty { color: #8b8f96; font-style: italic; }
