/* soundsystem.world v4.9.9: One responsive layout scale for the whole frontend.
 * NORMAL: editorial pages/forms/profiles; WIDE: maps, grids and CTAs;
 * FULL: page backgrounds, navigation and immersive/fullscreen maps.
 * Inner padding of cards, forms and maps is not part of the outer page grid.
 * Loaded AFTER all theme component styles, including generated bundles.
 */
body.ssw-map-page {
  --ssw-grid-gutter: clamp(16px, 3vw, 48px);
  --ssw-grid-normal-max: 1120px;
  --ssw-grid-wide-max: 1520px;
  --ssw-grid-normal: min(var(--ssw-grid-normal-max), calc(100% - 2 * var(--ssw-grid-gutter)));
  --ssw-grid-wide: min(var(--ssw-grid-wide-max), calc(100% - 2 * var(--ssw-grid-gutter)));
  --ssw-grid-full: 100%;
  --ssw-section-space: clamp(42px, 5vw, 76px);
  --ssw-section-space-small: clamp(24px, 3vw, 40px);
  --ssw-grid-gap: clamp(12px, 1.25vw, 20px);
}

/* Explicit utility roles for new sections; existing sections are mapped below. */
body.ssw-map-page .ssw-grid--normal {box-sizing:border-box;width:var(--ssw-grid-normal);max-width:var(--ssw-grid-normal-max);margin-inline:auto;}
body.ssw-map-page .ssw-grid--wide {box-sizing:border-box;width:var(--ssw-grid-wide);max-width:var(--ssw-grid-wide-max);margin-inline:auto;}
body.ssw-map-page .ssw-grid--full {box-sizing:border-box;width:var(--ssw-grid-full);max-width:none;}

/* WIDE — same visible left/right anchors across all major content sections. */
body.ssw-map-page :is(
  .ssw-home-hero,
  .ssw-home-mapwrap,
  .ssw-home-sections,
  .ssw-shell,
  .ssw-playlists-modern,
  .ssw-discover,
  .ssw-releases,
  .ssw-ng-shell,
  .ssw-global-support,
  .ssw-feedback,
  .ssw-footer-inner
) {
  box-sizing: border-box;
  width: var(--ssw-grid-wide);
  max-width: var(--ssw-grid-wide-max);
  min-width: 0;
  margin-inline: auto;
}
/* Map explorer still has a legacy !important full-width rule: cancel only that rule. */
body.ssw-map-page .ssw-shell {
  width:var(--ssw-grid-wide)!important;
  max-width:var(--ssw-grid-wide-max)!important;
  margin-inline:auto!important;
}
/* Preserve vertical rhythm but remove competing outer horizontal padding. */
body.ssw-map-page :is(
  .ssw-home-hero,.ssw-home-mapwrap,.ssw-home-sections,
  .ssw-playlists-modern,.ssw-discover,.ssw-releases,.ssw-ng-shell,.ssw-footer-inner
) { padding-inline: 0; }
body.ssw-map-page .ssw-shell :is(.intro,.workarea) {margin-inline:0;}
body.ssw-map-page .ssw-shell .intro {padding-inline:0;}
/* The playlists sub-section already sits inside a WIDE page container:
   it must not subtract a second gutter from the available width. */
body.ssw-map-page .ssw-playlists-modern .ssw-home-sections.ssw-playlists-collection {
  box-sizing:border-box;width:100%;max-width:none;margin:0;padding:0;gap:0;
}

body.ssw-map-page .ssw-shell .workarea {width:100%;max-width:none;}

/* NORMAL — editorial/content and user editing views share one outer width. */
body.ssw-map-page :is(
  .ssw-single-inner,
  .ssw-single--editorial .ssw-single-inner,
  .ssw-standard-page,
  .ssw-search-page,
  .ssw-creator
) {
  box-sizing:border-box;
  width:var(--ssw-grid-normal);
  max-width:var(--ssw-grid-normal-max);
  min-width:0;
  margin-inline:auto;
  padding-inline:0;
}

/* Inner cards keep their internal padding; only the outer container is normalized. */
body.ssw-map-page .ssw-global-support,
body.ssw-map-page .ssw-feedback {
  width:var(--ssw-grid-wide);
  max-width:var(--ssw-grid-wide-max);
  padding:clamp(24px,3vw,48px);
}
body.ssw-map-page .ssw-global-support {
  margin-top:var(--ssw-section-space-small);
  margin-bottom:clamp(14px,1.8vw,24px);
}
body.ssw-map-page .ssw-feedback {
  margin-top:0;
  margin-bottom:var(--ssw-section-space);
}
body.ssw-map-page .ssw-home-sections {
  gap:var(--ssw-section-space);
  padding-block:var(--ssw-section-space) var(--ssw-section-space-small);
}
body.ssw-map-page .ssw-home-sections :is(.recent-grid-list,.upcoming-grid-list,.playlists-grid),
body.ssw-map-page .ssw-playlists-all .playlists-grid,
body.ssw-map-page .ssw-release-grid,
body.ssw-map-page .ssw-discover-grid {
  column-gap:var(--ssw-grid-gap);
  row-gap:var(--ssw-grid-gap);
}
/* One vertical hand-off between primary content and the shared footer CTA.
   Previously some templates added 90px of bottom padding ON TOP of CTA margin. */
body.ssw-map-page :is(
  .ssw-home-sections,.ssw-playlists-modern,.ssw-discover,.ssw-releases,
  .ssw-standard-page,.ssw-search-page,.ssw-creator,.ssw-single-inner
) {padding-bottom:0;}
body.ssw-map-page .ssw-ng-shell {margin-bottom:0;}
body.ssw-map-page .ssw-global-support {margin-top:var(--ssw-section-space);}

/* Avoid the especially large, template-specific empty gap after the last card. */
body.ssw-map-page.page-template-playlists-new .ssw-playlists-modern {padding-bottom:0;}
body.ssw-map-page.page-template-playlists-new .ssw-global-support {margin-top:var(--ssw-section-space);}

/* Full-width interactive modes bypass the normal content columns by design. */
body.ssw-map-page .ssw-maparea:fullscreen,
body.ssw-map-page .ssw-home-mapframe:fullscreen,
body.ssw-map-page .ssw-history-map-column:fullscreen {
  width:100vw!important;
  max-width:none!important;
  margin:0!important;
  border-radius:0!important;
}

/* Release popup artwork behaves like the other map's photographic thumbnails.
   Keep the branded placeholder logo contained rather than cropping it. */
body.ssw-map-page .ssw-releases-map-wrap .leaflet-popup-content .ssw-popup-image img {
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
}
body.ssw-map-page .ssw-releases-map-wrap .leaflet-popup-content .ssw-popup-image .ssw-popup-placeholder img,
body.ssw-map-page .ssw-releases-map-wrap .leaflet-popup-content .ssw-popup-image img.ssw-fallback-logo {
  object-fit:contain!important;
}

/* Zoom overlay: native SVG graphic instead of the misaligned Unicode glyph. */
body.ssw-map-page .ssw-profile-avatar .ssw-profile-zoom {
  display:grid!important;
  place-items:center!important;
  width:34px;
  height:34px;
  padding:0;
  line-height:0!important;
  font-size:0!important;
  text-align:center;
  box-sizing:border-box;
}
body.ssw-map-page .ssw-profile-avatar .ssw-profile-zoom::before {
  content:"";
  display:block;
  width:18px;
  height:18px;
  background:#fff;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 9V4h5v2H6v3zm11-5h5v5h-2V6h-3zM4 15h2v3h3v2H4zm14 0h2v5h-5v-2h3z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 9V4h5v2H6v3zm11-5h5v5h-2V6h-3zM4 15h2v3h3v2H4zm14 0h2v5h-5v-2h3z'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* On narrow screens every category shares one predictable 16px outer gutter. */
@media (max-width:760px) {
  body.ssw-map-page {--ssw-grid-gutter:16px;--ssw-section-space:clamp(32px,8vw,48px);--ssw-grid-gap:12px;}
  body.ssw-map-page .ssw-home-sections {padding-top:var(--ssw-section-space);}
  body.ssw-map-page :is(.ssw-global-support,.ssw-feedback) {padding:24px 20px;border-radius:18px;}
  body.ssw-map-page .ssw-single--editorial .ssw-single-inner {padding-top:22px;}
}
@media (max-width:480px) {
  body.ssw-map-page .ssw-home-hero {gap:20px;}
  body.ssw-map-page :is(.ssw-global-support,.ssw-feedback) {padding:22px 18px;}
}
