/* Typographic street map (/gifts/typographic-map/): on top of the shared maker look (/gifts/globes/maker.css). */

.tm [hidden] { display: none !important; }
.tm .tm-label { display: block; font-size: 0.8rem; color: var(--muted); margin: 14px 0 6px; }
.tm .wm-seg button { padding: 6px 8px; white-space: normal; line-height: 1.25; }

/* the map picker: the frame is the print */
.tm .tm-mapwrap { max-width: none; }
.tm .tm-map { aspect-ratio: 1; }
.tm-frame {
    position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); pointer-events: none;
    border: 2px solid #2fa596; box-shadow: 0 0 0 2000px rgba(16, 20, 19, 0.38);
}
.tm-chips { margin-top: 10px; }
.tm-chips .wm-chip { font-size: 0.76rem; padding: 5px 10px; }

/* fonts */
.tm-fonts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.tm-font { background: var(--field); border: 0; border-radius: 9px; color: var(--ink); cursor: pointer; padding: 7px 8px 6px; text-align: left; min-width: 0; }
.tm-font b { display: block; font-size: 1rem; font-weight: 700; line-height: 1.15; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-transform: uppercase; letter-spacing: 0.02em; }
.tm-font small { display: block; font-family: 'Schibsted Grotesk', system-ui, sans-serif; font-size: 0.68rem; color: var(--muted); margin-top: 2px; }
.tm-font:hover { background: #262b29; }
.tm-font[aria-pressed="true"] { box-shadow: inset 0 0 0 1.5px var(--accent); }

/* colours */
.tm-palettes .wm-chip { font-size: 0.76rem; padding: 5px 10px; }
.tm-colors { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 10px; }

/* warnings */
.tm-warn { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.tm-warn:empty { display: none; }
.tm-warn li { font-size: 0.78rem; line-height: 1.4; color: #f3d38a; background: rgba(217, 177, 74, 0.1); border-radius: 8px; padding: 7px 9px; }

@media (max-width: 560px) {
    .tm .wm-stagebar .wm-btn span { display: none; }
    .tm-fonts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
