/* Meridian v18 · Gallery mosaic and readable editorial category pills.
   Loaded after v17; these changes apply only to the public-facing site. */

/* Bottom gallery uses every horizontal pixel, regardless of album count. */
body.meridian-portal-v16 .mp-bottom-photos {
  display:flex;
  flex-direction:column;
  min-width:0;
  height:100%;
}
body.meridian-portal-v16 .mp-bottom-gallery {
  display:grid;
  flex:1 1 auto;
  min-width:0;
  width:100%;
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-auto-rows:minmax(0,1fr);
  gap:12px;
  align-items:stretch;
  min-height:250px;
}
body.meridian-portal-v16 .mp-bottom-gallery-count-1 {grid-template-columns:minmax(0,1fr)}
body.meridian-portal-v16 .mp-bottom-gallery-count-2 {grid-template-columns:repeat(2,minmax(0,1fr))}
body.meridian-portal-v16 .mp-bottom-gallery-count-3 {
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-template-rows:minmax(0,1fr);
}
body.meridian-portal-v16 .mp-bottom-gallery > .edition-album {
  display:flex;
  flex-direction:column;
  min-width:0;
  width:100%;
  height:100%;
}
body.meridian-portal-v16 .mp-bottom-gallery .edition-album-image {
  width:100%!important;
  max-width:none!important;
  min-height:135px;
  aspect-ratio:auto!important;
  flex:1 1 auto;
}
body.meridian-portal-v16 .mp-bottom-gallery-count-1 .edition-album-image {min-height:220px}
body.meridian-portal-v16 .mp-bottom-gallery .edition-album-info {flex:0 0 auto;padding:12px 14px!important}
body.meridian-portal-v16 .mp-bottom-gallery .edition-album-info h3 {
  font-size:clamp(14px,1.2vw,18px)!important;
  line-height:1.35;
  margin:0;
  overflow-wrap:anywhere;
}

/* Photo report label is the same pill style as editorial category tags. */
body.meridian-portal-v16 .edition-album .edition-album-label {
  display:inline-flex;
  align-items:center;
  position:absolute;
  bottom:12px;
  left:12px;
  z-index:2;
  width:max-content;
  max-width:calc(100% - 24px);
  padding:5px 9px;
  border:0;
  border-radius:4px;
  background:#e7f1fd!important;
  color:#0757b2!important;
  font-family:Roboto,Arial,sans-serif;
  font-weight:850;
  font-size:9px;
  line-height:1.35;
  letter-spacing:.04em;
  text-transform:uppercase;
  box-shadow:0 1px 4px rgba(10,45,80,.12);
  transition:background-color .2s ease,color .2s ease;
}
body.meridian-portal-v16 .edition-album:hover .edition-album-label,
body.meridian-portal-v16 .edition-album:focus-visible .edition-album-label {
  background:#0757b2!important;
  color:#ffffff!important;
}
/* Keep micro-thumbnails uncluttered as in the approved front theme. */
body.meridian-portal-v16 .mp-gallery-thumbs .edition-album .edition-album-label {display:none}

/* Editors can configure category colors: choose contrasting foreground on hover. */
body.meridian-portal-v16 .edition-card:hover .edition-category,
body.meridian-portal-v16 .edition-card:focus-within .edition-category {
  background:var(--category-color,#0757b2)!important;
  color:var(--category-on-color,#ffffff)!important;
  border-color:transparent!important;
  text-decoration:none!important;
}
body.meridian-portal-v16 .edition-card .edition-category:focus-visible {
  outline:2px solid var(--category-on-color,#ffffff);
  outline-offset:2px;
}

@media(max-width:720px){
  body.meridian-portal-v16 .mp-bottom-gallery-count-3 {min-height:310px}
}
@media(max-width:520px){
  body.meridian-portal-v16 .mp-bottom-gallery-count-2,
  body.meridian-portal-v16 .mp-bottom-gallery-count-3 {
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto;
    min-height:0;
  }
  body.meridian-portal-v16 .mp-bottom-gallery .edition-album-image {
    min-height:205px;
    aspect-ratio:16 / 9!important;
    flex:0 0 auto;
  }
}
@media(prefers-reduced-motion:reduce){
  body.meridian-portal-v16 .edition-album .edition-album-label {transition:none}
}
