/* Material Symbols Outlined, self-hosted: no request to Google Fonts.
 * Font: static instance (opsz 24, wght 400, FILL 0, GRAD 0) of the complete icon set, v372,
 * downloaded from fonts.gstatic.com through
 *   https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0
 * License: Apache 2.0 (LICENSE next to this file).
 * To update: fetch that CSS with a browser user agent, download the .woff2 it points to and
 * replace material-symbols-outlined.woff2. Every icon name keeps working, no subset to rebuild. */
@font-face {
  font-family: 'Material Symbols Outlined';
  font-style: normal;
  font-weight: 400;
  font-display: block; /* icon names must never flash as text while the font loads */
  src: url('material-symbols-outlined.woff2') format('woff2');
}

.material-symbols-outlined,
.maplibregl-ctrl-icon::before,
.maplibregl-ctrl-attrib-button::before,
.maplibregl-popup-close-button::before {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}

/* MapLibre keeps its behaviour and accessible button labels; its control artwork
   comes from the same local font as the rest of the application. */
.maplibregl-map .maplibregl-ctrl-group button .maplibregl-ctrl-icon {
  background-image: none;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--grey-600);
}
.maplibregl-ctrl-icon::before { font-size: var(--icon-lg); }
.maplibregl-ctrl-zoom-in .maplibregl-ctrl-icon::before { content: 'add'; }
.maplibregl-ctrl-zoom-out .maplibregl-ctrl-icon::before { content: 'remove'; }
.maplibregl-ctrl-compass .maplibregl-ctrl-icon::before { content: 'navigation'; }

/* The compact toggle is a <summary>: a flex box centres the glyph in the 24px circle (an inline glyph would
   sit at the start of the line, off centre). Scoped to the compact state, where MapLibre shows the toggle. */
.maplibregl-ctrl-attrib-button { background-image: none; }
.maplibregl-ctrl-attrib.maplibregl-compact summary.maplibregl-ctrl-attrib-button {
  display: flex;
  align-items: center;
  justify-content: center;
}
.maplibregl-ctrl-attrib-button::before {
  content: 'info';
  font-size: var(--icon-lg);
  color: var(--grey-600);
}
.maplibregl-popup-close-button { font-size: 0; }
.maplibregl-popup-close-button::before { content: 'close'; font-size: var(--icon-lg); }