/* ============================================================
   map/glass-map.css -- eDash's map v4 material on the sawit map.
   Sources, all served by edash.systems on 28 Oct 2026:
     css/glass-tokens.css   --gl-*        (../assets/glass/, verbatim)
     css/shell-glass.css    section 11    --mat-filter-pill = --gl-pill-blur
     css/glass.css          tokens, gates --mat-filter-regular, --mat-shadow-*
     css/map-viewer.css     "Map v4"      the light-theme --mv4-* material:
                                          one frosted glass for every piece
                                          of map chrome
   LOAD LAST, after project-selector.css and sawit-map.css (glass.css's
   own rule: the material layer is an override and goes after its base).

   BLUR BUDGET: 3. The brand bar, the Estate Blocks panel, the block detail
   sheet and the basemap popover blur, and the panel is hidden while the detail
   sheet is open, so three is the most that are ever on screen at once. The legend and the round map buttons take the same
   tint and rim with no blur. Nothing here touches .ps-map or the canvas.
   ============================================================ */

:root {
  /* css/glass.css */
  --mat-filter-thick: blur(24px) saturate(1.4);
  --mat-filter-regular: blur(18px) saturate(1.4);
  --mat-shadow-1: 0 1px 2px rgba(11, 79, 84, 0.06), 0 10px 28px -8px rgba(11, 79, 84, 0.16);
  --mat-shadow-2: 0 4px 16px rgba(11, 79, 84, 0.14);
  --mat-shadow-3: 0 2px 6px rgba(11, 79, 84, 0.1), 0 24px 48px -12px rgba(11, 79, 84, 0.32);
  --glass-paper: #ffffff;
  /* css/shell-glass.css section 11: the landing's blur(26px) saturate(1.8) */
  --mat-filter-pill: var(--gl-pill-blur);
}

/* css/map-viewer.css, "Map v4", light theme */
.ps-page {
  --mv4-ink: #25343f;
  --mv4-ink-2: #333d6d;
  --mv4-icon: #075b5e;
  --mv4-rule: rgba(37, 52, 63, 0.14);
  --mv4-bar: linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.42)), rgba(255, 255, 255, 0.52);
  --mv4-panel: linear-gradient(180deg, rgba(255, 255, 255, 0.76), rgba(248, 251, 251, 0.58));
  --mv4-edge: rgba(255, 255, 255, 0.78);
  --mv4-rim: inset 0 1px 0 rgba(255, 255, 255, 0.96), inset 0 -1px 0 rgba(37, 52, 63, 0.1);
  --mv4-depth: var(--gl-pill-depth), 0 18px 40px -24px rgba(0, 0, 0, 0.55);
  --mv4-chip: rgba(255, 255, 255, 0.78);
  --mv4-chip-hi: rgba(228, 241, 241, 0.94);
  --mv4-plate: rgba(239, 246, 246, 0.96);
  --mv4-plate-edge: rgba(37, 52, 63, 0.14);
  font-family: 'Montserrat', sans-serif;
}

/* ---------- the surfaces: chrome (bar tint) and panels (panel tint) ---------- */
.ps-page .sw-brandbar,
.ps-page .ps-locate-btn {
  background: var(--mv4-bar);
  border: 1px solid var(--mv4-edge);
  box-shadow: var(--mv4-rim), var(--mv4-depth);
  color: var(--mv4-ink);
}
.ps-page .ps-panel,
.ps-page .ps-panel:not(.is-open),
.ps-page .ps-detail-panel,
.ps-page .sw-base-pop,
.ps-page .ps-today-float.sw-legend,
.ps-pin-tooltip .maplibregl-popup-content {
  background: var(--mv4-panel);
  border: 1px solid var(--mv4-edge);
  box-shadow: var(--mv4-rim), var(--mv4-depth);
  color: var(--mv4-ink);
}
.ps-page .sw-brandbar,
.ps-page .ps-panel,
.ps-page .ps-panel:not(.is-open),
.ps-page .ps-detail-panel,
.ps-page .sw-base-pop {
  -webkit-backdrop-filter: var(--mat-filter-pill, var(--mat-filter-regular));
  backdrop-filter: var(--mat-filter-pill, var(--mat-filter-regular));
}
.ps-page .ps-locate-btn,
.ps-page .ps-today-float.sw-legend {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.ps-page .ps-today-float.sw-legend {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(248, 251, 251, 0.84));
}
.ps-page .ps-locate-btn {
  color: var(--mv4-icon);
}
.ps-page .ps-locate-btn:hover {
  background: var(--mv4-chip-hi);
}

/* inside the panels: the toggle face is the panel, controls are chips, tables sit on the plate */
.ps-page .ps-panel .ps-panel-toggle {
  background: transparent;
}
.ps-page :is(.ps-summary-card, .ps-category-item, .ps-search, .ps-detail-close, .ps-detail-tech-btn) {
  background: var(--mv4-chip);
  border-color: var(--mv4-rule);
}
.ps-page .ps-table-scroll {
  background: var(--mv4-plate);
  border: 1px solid var(--mv4-plate-edge);
  border-radius: 12px;
}

/* ---------- the gates: lite tier, no support, reduced transparency, more contrast, forced colours ---------- */
html.glass-lite
  .ps-page
  :is(.sw-brandbar, .ps-locate-btn, .ps-panel, .ps-detail-panel, .sw-base-pop, .ps-today-float.sw-legend),
html.glass-lite .ps-pin-tooltip .maplibregl-popup-content {
  background: var(--glass-paper);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .ps-page :is(.sw-brandbar, .ps-locate-btn, .ps-panel, .ps-detail-panel, .sw-base-pop, .ps-today-float.sw-legend) {
    background: var(--glass-paper);
  }
}
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
  .ps-page :is(.sw-brandbar, .ps-locate-btn, .ps-panel, .ps-detail-panel, .sw-base-pop, .ps-today-float.sw-legend),
  .ps-pin-tooltip .maplibregl-popup-content {
    background: var(--glass-paper);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}
@media (prefers-contrast: more) {
  .ps-page :is(.sw-brandbar, .ps-locate-btn, .ps-panel, .ps-detail-panel, .sw-base-pop, .ps-today-float.sw-legend) {
    border-color: #25343f;
  }
}
@media (forced-colors: active) {
  .ps-page :is(.sw-brandbar, .ps-locate-btn, .ps-panel, .ps-detail-panel, .sw-base-pop, .ps-today-float.sw-legend) {
    background: Canvas;
    color: CanvasText;
    border-color: CanvasText;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}
/* map-viewer.css: under 900px the panels are sheets over the map and do not blur */
@media (max-width: 899px) {
  .ps-page .ps-panel,
  .ps-page .ps-panel:not(.is-open),
  .ps-page .ps-detail-panel,
  .ps-page .sw-base-pop {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(248, 251, 251, 0.84));
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}