/* XperientsMap v2 — Design-System aus der Tibarg-Center-Seite */
.xperients-map {
	--tc-blue:#144e9b; --tc-blue-deep:#0d3a72; --tc-blue-light:#b9dbef;
	--tc-sky:#e8f2fa; --tc-gray:#f3f6fa; --tc-ink:#012b3f; --tc-muted:#5d7a90;
	--tc-border:rgba(20,78,155,.12); --ok:#1f9d57;
	--tm-height:600px;

	font-family:'Hind Siliguri',system-ui,sans-serif;
	color:var(--tc-ink);
	background:var(--tc-gray);
	border:1px solid var(--tc-border);
	border-radius:16px;
	position:relative;
	overflow:hidden;
}

.tm-loading,.tm-error {
	display:flex; align-items:center; justify-content:center;
	min-height:var(--tm-height); color:var(--tc-muted); font-size:.95rem; padding:24px; text-align:center;
}
.tm-error { color:#b4453a; }

/* --- Toolbar: Etagen + Zoom --- */
.tm-toolbar {
	position:absolute; top:0; right:0; z-index:3;
	display:flex; flex-direction:column; align-items:flex-end;
	gap:12px; padding:14px; pointer-events:none;
}
.tm-toolbar > * { pointer-events:auto; }

.tm-floors {
	display:flex; flex-direction:column; gap:8px;
}
.tm-floor {
	appearance:none; border:1px solid var(--tc-border); background:#fff; cursor:pointer;
	font:600 .9rem/1 'Hind Siliguri',sans-serif; color:var(--tc-muted);
	padding:0; border-radius:50%; transition:background .15s, box-shadow .15s; width:48px; height:48px; text-align:center; box-shadow:0 4px 16px rgba(13,58,114,.12);
}
.tm-floor:hover { color:var(--tc-blue-deep); }
.tm-floor.is-active { background:var(--tc-blue); color:#fff; box-shadow:0 2px 8px rgba(20,78,155,.35); }

.tm-zoom { display:flex; gap:6px; }
.tm-btn {
	width:44px; height:44px; border-radius:12px; cursor:pointer;
	background:#fff; border:1px solid var(--tc-border); color:var(--tc-blue-deep);
	font-size:1.25rem; line-height:1; display:flex; align-items:center; justify-content:center;
	box-shadow:0 4px 14px rgba(13,58,114,.10); transition:all .12s;
}
.tm-btn:hover { background:var(--tc-sky); border-color:var(--tc-blue-light); }
.tm-btn:active { transform:translateY(1px); }

/* --- Bühne + Canvas (Zoom/Pan-Ziel) --- */
.tm-stage {
	min-width:0; position:relative; height:var(--tm-height); overflow:hidden;
	touch-action:none; cursor:grab; background:
		radial-gradient(circle at 50% 40%, #fff, var(--tc-gray) 80%);
}
.tm-stage.is-grabbing { cursor:grabbing; }
/* KEIN will-change/GPU-Layer: sonst wird das SVG als Bitmap gerastert und beim
   Zoom unscharf. Ohne Layer-Promotion rendert der Browser das Vektor-SVG bei
   jedem Zoom scharf neu. */
.tm-canvas { width:100%; height:100%; transform-origin:0 0; }
.tm-svg { display:block; width:100%; height:100%; }

/* --- Flächen-Zustände --- */
.tm-area { transition:fill .15s ease, opacity .15s ease; outline:none; }
.tm-area:focus-visible { stroke:var(--tc-blue-deep); stroke-width:2.5; }

.tm-free { fill:#dfe6ee; cursor:pointer; }
.tm-free:hover { fill:#cdd9e6; }

.tm-occupied { fill:var(--tc-blue-light); cursor:pointer; }
.tm-occupied:hover { fill:var(--tc-blue); }

.tm-selected, .tm-selected:hover { fill:var(--tc-blue); stroke:var(--tc-blue-deep); stroke-width:2; }
.tm-area.tm-flash { animation:tm-flash 1.4s ease; }
@keyframes tm-flash {
	0%,100% { stroke:var(--tc-blue-deep); stroke-width:2; }
	30% { stroke:#ffb300; stroke-width:5; }
	65% { stroke:#ffb300; stroke-width:3; }
}

.tm-dim { opacity:.25; }

/* --- Automatisch platzierte Shop-Logos (aus WP) --- */
.tm-logo-pill { fill:#fff; stroke:rgba(20,78,155,.14); stroke-width:1; filter:drop-shadow(0 1px 2px rgba(13,58,114,.18)); }
.tm-logo { pointer-events:none; }
.tm-logo-label { fill:var(--tc-blue-deep); font-family:'Hind Siliguri',system-ui,sans-serif; font-weight:600; pointer-events:none; }
.tm-logo-item { transition:opacity .18s ease; }
.tm-logo-item.tm-dim { opacity:.28; }
.tm-logo-selected .tm-logo-pill { stroke:var(--tc-blue); stroke-width:2; }

/* --- Schwebende Bedienelemente ohne feste Seitenleiste --- */
.tm-head { display:flex; flex-direction:column; gap:8px; position:absolute; top:16px; left:16px; width:min(290px,calc(100% - 104px)); z-index:5; cursor:default; }
.tm-actions { display:flex; gap:8px; align-items:flex-start; }
.tm-floating-btn { display:inline-flex; align-items:center; justify-content:center; min-height:44px; box-sizing:border-box; padding:10px 16px; border:1px solid var(--tc-border); border-radius:999px; background:#fff; color:var(--tc-blue-deep); font:inherit; font-size:.88rem; font-weight:600; line-height:1.2; cursor:pointer; box-shadow:0 4px 16px rgba(13,58,114,.12); white-space:nowrap; }
.tm-floating-btn:hover { background:var(--tc-sky); }
.tm-overview-btn { background:var(--tc-blue); color:#fff; border-color:var(--tc-blue); }
.tm-overview-btn:hover { background:var(--tc-blue-deep); }
.tm-floating-btn:focus-visible, .tm-overview :is(button,input,select,a):focus-visible { outline:3px solid var(--tc-blue-light); outline-offset:3px; }
.tm-orientation { position:relative; padding:12px 18px; border-top:1px solid var(--tc-border); background:#fff; }
.tm-services-legend { font-size:.82rem; display:flex; align-items:center; flex-wrap:wrap; gap:8px 20px; }
.tm-services-legend > strong { margin:0; color:var(--tc-muted); font-weight:600; }
.tm-services-legend .tm-legend-item { margin:0; }
.tm-head, .tm-detail, .tm-orientation, .tm-toolbar, .tm-pdf { touch-action:auto; }
.tm-filter-opt input { accent-color:var(--tc-blue); width:18px; height:18px; flex:0 0 auto; }
.tm-legend-item { display:flex; align-items:center; gap:8px; margin:7px 0; line-height:1.3; }
.tm-legend-item svg { display:block; width:24px; height:24px; flex:0 0 24px; }
.xperients-map [hidden] { display:none !important; }
.tm-search { position:relative; width:100%; }
.tm-search-input {
	width:100%; box-sizing:border-box; padding:11px 16px; font:inherit; font-size:.95rem;
	border:1px solid var(--tc-border); border-radius:999px; background:#fff; color:var(--tc-ink); box-shadow:0 4px 16px rgba(13,58,114,.12);
}
.tm-search-input:focus { outline:none; border-color:var(--tc-blue-light); box-shadow:0 0 0 3px rgba(20,78,155,.12); }
.tm-search-results {
	position:absolute; top:calc(100% + 8px); left:0; right:0; max-height:300px; overflow-y:auto; background:#fff;
	border:1px solid var(--tc-border); border-radius:12px; box-shadow:0 12px 30px rgba(13,58,114,.16);
	z-index:7;
}
.tm-search-item { display:flex; justify-content:space-between; gap:10px; width:100%; text-align:left;
	border:0; background:none; padding:10px 14px; cursor:pointer; font:inherit; color:var(--tc-ink); }
.tm-search-item:hover { background:var(--tc-sky); }
.tm-search-floor { color:var(--tc-muted); font-size:.8rem; font-weight:600; }
.tm-search-empty { padding:12px 14px; color:var(--tc-muted); font-size:.9rem; }

.tm-filter { position:static; }
.tm-filter-btn:hover { border-color:var(--tc-blue-light); }
.tm-filter-btn.is-active { background:var(--tc-blue); color:#fff; border-color:var(--tc-blue); }
.tm-filter-panel { position:absolute; top:calc(100% + 8px); left:0; width:260px; box-sizing:border-box; max-height:min(360px,55vh); overflow:auto;
	background:#fff; border:1px solid var(--tc-border); border-radius:12px;
	box-shadow:0 12px 30px rgba(13,58,114,.16); padding:8px; z-index:7; }
.tm-filter-opt { display:flex; align-items:center; gap:8px; padding:7px 9px; border-radius:8px; font-size:.88rem; cursor:pointer; }

/* PDF-Link direkt auf dem Lageplan, rechts unten. */
.tm-pdf { position:absolute; right:14px; bottom:14px; z-index:3; display:inline-flex; align-items:center; gap:6px; padding:11px 18px; border-radius:999px;
	background:var(--tc-blue); border:1px solid var(--tc-blue); color:#fff;
	font:inherit; font-weight:600; text-decoration:none; white-space:nowrap; }

.tm-pdf:hover { background:var(--tc-blue-deep); color:#fff; }
.tm-pdf:focus-visible { outline:3px solid var(--tc-blue-light); outline-offset:3px; }
.tm-filter-opt:hover { background:var(--tc-gray); }
.tm-filter-clear { width:100%; margin-top:6px; padding:9px; border:0; border-top:1px solid var(--tc-border);
	background:none; color:var(--tc-muted); cursor:pointer; font:inherit; }

/* --- Detail-Panel: Inhalt scrollbar, Sektionen --- */
.tm-detail { padding:0; }
.tm-detail-scroll { padding:18px; max-height:min(400px,calc(var(--tm-height) - 120px)); box-sizing:border-box; overflow:auto; }
.tm-section { margin-top:15px; }
.tm-section h4 { margin:0 0 6px; font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; color:var(--tc-muted); }
.tm-section p { margin:0; font-size:.9rem; line-height:1.5; }
.tm-hours { width:100%; border-collapse:collapse; font-size:.88rem; }
.tm-hours th { text-align:left; font-weight:600; color:var(--tc-muted); padding:3px 0; width:46px; }
.tm-hours td { text-align:right; padding:3px 0; color:var(--tc-ink); }
.tm-hours .is-today th, .tm-hours .is-today td { color:var(--tc-blue-deep); font-weight:700; }
.tm-gallery { display:flex; gap:6px; overflow-x:auto; margin-bottom:4px; padding-right:30px; }
.tm-gallery img { height:74px; width:auto; border-radius:8px; flex:0 0 auto; object-fit:cover; }
.tm-contact { font-size:.88rem; line-height:1.55; color:var(--tc-ink); }
.tm-contact a { color:var(--tc-blue); }
.tm-detail-scroll .tm-cta { margin-top:16px; }

/* Fokus-Sichtbarkeit für Tastatur-Bedienung */
.tm-floor:focus-visible, .tm-btn:focus-visible, .tm-filter-btn:focus-visible,
.tm-search-item:focus-visible, .tm-detail-close:focus-visible, .tm-cta:focus-visible,
.tm-detail-title:focus-visible { outline:2px solid var(--tc-blue-deep); outline-offset:2px; }
.tm-search-item:focus { background:var(--tc-sky); outline:none; }
.tm-filter-opt:focus-within { background:var(--tc-gray); }
.tm-detail-title:focus { outline:none; } /* Fokus dient nur dem Screenreader */

/* --- Detail-Panel --- */
.tm-detail {
	position:absolute; z-index:6; right:16px; bottom:76px; width:320px; max-width:calc(100% - 32px); cursor:default;
	background:#fff; border:1px solid var(--tc-border); border-radius:16px;
	padding:0; box-shadow:0 12px 34px rgba(13,58,114,.18);
	animation:tm-pop .18s ease;
}
@keyframes tm-pop { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }

.tm-detail-close {
	position:absolute; top:10px; right:10px; width:40px; height:40px; border-radius:50%;
	border:0; background:var(--tc-gray); color:var(--tc-muted); font-size:1.2rem; cursor:pointer; line-height:1;
}
.tm-detail-close:hover { background:var(--tc-sky); color:var(--tc-blue-deep); }

.tm-detail-head { display:flex; flex-direction:column; align-items:flex-start; gap:10px; margin-bottom:12px; padding-right:32px; }
.tm-detail-logo { max-width:190px; max-height:80px; object-fit:contain; }
.tm-detail-title { margin:0; font-size:1.25rem; line-height:1.2; color:var(--tc-blue-deep); }

/* Öffnungszeiten: aufklappbar */
.tm-hours-acc { margin:14px 0 4px; border-top:1px solid var(--tc-border); padding-top:12px; }
.tm-hours-acc summary {
	cursor:pointer; list-style:none; font-weight:600; font-size:.9rem; color:var(--tc-blue-deep);
	display:flex; align-items:center; justify-content:space-between; padding:2px 0;
}
.tm-hours-acc summary::-webkit-details-marker { display:none; }
.tm-hours-acc summary::after { content:'▾'; color:var(--tc-muted); transition:transform .15s ease; }
.tm-hours-acc[open] summary::after { transform:rotate(180deg); }
.tm-hours-acc .tm-hours { margin-top:10px; }

.tm-badges { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px; }
.tm-badge {
	font-size:.74rem; font-weight:600; padding:4px 10px; border-radius:999px;
	background:var(--tc-sky); color:var(--tc-blue-deep);
}
.tm-badge-floor { background:var(--tc-gray); color:var(--tc-muted); }

.tm-status { display:flex; align-items:center; gap:8px; margin:0 0 14px; font-size:.9rem; font-weight:600; }
.tm-status .tm-dot { width:9px; height:9px; border-radius:50%; }
.tm-status.is-open  { color:var(--ok); }
.tm-status.is-open  .tm-dot { background:var(--ok); }
.tm-status.is-closed { color:var(--tc-muted); }
.tm-status.is-closed .tm-dot { background:var(--tc-muted); }

.tm-cta {
	display:inline-block; background:var(--tc-blue); color:#fff; text-decoration:none;
	font-weight:600; font-size:.9rem; padding:11px 18px; border-radius:999px; transition:background .15s;
}
.tm-cta:hover { background:var(--tc-blue-deep); }

.tm-free-note { margin:0 0 4px; font-weight:600; color:var(--tc-blue-deep); }
.tm-free-sub  { margin:0; font-size:.85rem; color:var(--tc-muted); }

/* Shop-Verzeichnis: modales Fenster mit eigener Suche und Filterung. */
.tm-overview { width:min(940px,calc(100vw - 40px)); max-width:none; max-height:86vh; max-height:86dvh; padding:0; border:1px solid var(--tc-border); border-radius:24px; background:#fff; color:var(--tc-ink); font-family:inherit; box-shadow:0 24px 90px rgba(1,43,63,.25); overflow:hidden; }
.tm-overview[open] { display:flex; flex-direction:column; }
.tm-overview::backdrop { background:rgba(1,26,47,.48); }
.tm-overview-head { flex-shrink:0; display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:24px 28px 18px; }
.tm-overview-head h2 { margin:0; color:var(--tc-blue-deep); font-size:1.55rem; line-height:1.2; }
.tm-overview-head p { margin:7px 0 0; color:var(--tc-muted); font-size:.9rem; }
.tm-overview-close { flex:0 0 44px; width:44px; height:44px; border:0; border-radius:50%; background:var(--tc-gray); color:var(--tc-blue-deep); font:inherit; font-size:1.6rem; cursor:pointer; }
.tm-overview-filters { flex-shrink:0; display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:12px; padding:0 28px; }
.tm-overview-filters label { display:flex; flex-direction:column; gap:6px; min-width:0; font-size:.8rem; font-weight:600; }
.tm-overview-filters :is(input,select) { width:100%; min-width:0; min-height:44px; box-sizing:border-box; border:1.5px solid var(--tc-border); border-radius:10px; padding:10px 12px; background:var(--tc-gray); color:var(--tc-ink); font:inherit; font-size:.9rem; }
.tm-overview-count { margin:14px 28px; color:var(--tc-muted); font-size:.85rem; }
.tm-overview-results { flex:1 1 auto; overflow-y:auto; overscroll-behavior:contain; padding:0 24px 24px; min-height:0; scrollbar-gutter:stable; }
.tm-directory-list { list-style:none; padding:0; margin:0; }
.tm-directory-list > li + li { margin-top:8px; }
.tm-directory-shop { display:flex; align-items:center; gap:12px; width:100%; box-sizing:border-box; padding:12px; border:1px solid var(--tc-border); border-radius:12px; background:#fff; color:var(--tc-ink); font:inherit; text-align:left; text-decoration:none; }
button.tm-directory-shop { cursor:pointer; }
button.tm-directory-shop:hover { background:var(--tc-sky); border-color:var(--tc-blue-light); }
.tm-directory-shop img, .tm-directory-initial { width:48px; height:36px; object-fit:contain; flex:0 0 48px; }
.tm-directory-initial { display:flex; align-items:center; justify-content:center; background:var(--tc-sky); border-radius:8px; color:var(--tc-blue); font-weight:700; }
.tm-directory-shop > span:nth-child(2) { flex:1; min-width:0; overflow-wrap:anywhere; font-size:.9rem; font-weight:600; }
.tm-directory-shop small { display:block; margin-top:3px; font-size:.72rem; color:var(--tc-muted); font-weight:400; }
.tm-directory-shop a { font-size:.75rem; color:var(--tc-blue); }
.tm-directory-empty { color:var(--tc-muted); }

/* Vollständig umrandete Shop-Karten in zeilenweiser A–Z-Reihenfolge. */
.tm-overview { width:min(1040px,calc(100vw - 48px)); border:1.5px solid #d6e1eb; border-radius:24px; box-shadow:0 28px 100px rgba(1,26,47,.28); }
.tm-overview-head { background:#fff; padding:28px 32px 22px; }
.tm-overview-head h2 { font-size:1.6rem; letter-spacing:-.025em; }
.tm-overview-head p { margin-top:6px; font-size:.85rem; }
.tm-overview-close { background:#fff; border:1.5px solid #d6e1eb; transition:background .15s; }
.tm-overview-close:hover { background:var(--tc-sky); }
.tm-overview-filters { padding:4px 32px 0; gap:16px; }
.tm-overview-filters label { gap:7px; color:var(--tc-muted); font-size:.78rem; }
.tm-overview-filters :is(input,select) { min-height:48px; border-radius:12px; background:#fff; border-color:#d6e1eb; font-weight:400; }
.tm-overview-filters :is(input,select):focus { border-color:var(--tc-blue); outline:2px solid var(--tc-blue-light); outline-offset:1px; }
.tm-overview-count { flex-shrink:0; margin:0; padding:18px 32px 10px; color:var(--tc-muted); font-size:.8rem; }
.tm-overview .tm-directory-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.tm-overview .tm-directory-list > li { min-width:0; margin:0; }
.tm-overview .tm-directory-shop { height:100%; min-height:88px; padding:14px; gap:12px; border:1.5px solid #d6e1eb; border-radius:12px; background:#fff; transition:background .15s; }
.tm-overview button.tm-directory-shop:hover { background:var(--tc-sky); }
.tm-overview .tm-directory-shop:focus-visible { outline:2px solid var(--tc-blue); outline-offset:-2px; background:var(--tc-sky); }
.tm-overview .tm-directory-shop img, .tm-overview .tm-directory-initial { width:72px; height:48px; flex:0 0 72px; box-sizing:border-box; }
.tm-overview .tm-directory-initial { background:var(--tc-sky); border-radius:12px; font-size:1.2rem; }
.tm-overview .tm-directory-shop .tm-directory-copy { font-size:.94rem; line-height:1.4; font-weight:600; }
.tm-overview .tm-directory-shop small { display:flex; flex-wrap:wrap; align-items:center; gap:4px 6px; margin-top:6px; font-size:.7rem; line-height:1.4; }
.tm-directory-floor-badge { display:inline-block; border-radius:5px; padding:2px 7px; background:var(--tc-sky); color:var(--tc-blue-deep); font-weight:600; }
.tm-directory-unmapped { color:var(--tc-muted); }
.tm-directory-action { display:inline-flex; align-items:center; gap:6px; flex:0 0 auto; margin-left:auto; white-space:nowrap; color:var(--tc-blue); font-size:.74rem; font-weight:600; }
.tm-directory-action > span { font-size:1.05rem; line-height:1; }
.tm-overview .tm-directory-shop a { flex:0 0 auto; font-size:.74rem; font-weight:600; text-decoration:none; }
@media (max-width:700px) {
	.tm-overview .tm-directory-list { grid-template-columns:minmax(0,1fr); }
}

/* Mobil: kompakte schwebende Steuerung und separates Detailfenster. */
@media (max-width:600px) {
	.xperients-map { --tm-height:78vh; }
	.tm-head { top:12px; left:12px; width:calc(100% - 92px); max-width:290px; }
	.tm-toolbar { padding:12px; gap:12px; }
	.tm-floor { width:44px; height:44px; }
	.tm-floating-btn, .tm-filter-btn { padding:10px 12px; font-size:.8rem; }
	.tm-filter-panel { left:0; right:auto; width:min(270px,calc(100vw - 48px)); }
	.tm-filter-opt { padding:11px 8px; }
	.tm-orientation { padding:12px; }
	.tm-services-legend { gap:8px 14px; font-size:.75rem; }
	.tm-services-legend > strong { flex-basis:100%; }
	.tm-pdf { right:12px; bottom:12px; padding:11px 14px; font-size:.8rem; }
	.tm-detail { left:8px; right:8px; bottom:66px; width:auto; max-width:none; border-radius:18px; animation:tm-sheet .2s ease; }
	.tm-detail-scroll { max-height:min(45vh,calc(var(--tm-height) - 190px)); padding:20px; }
	.tm-overview { width:calc(100vw - 20px); max-height:92vh; max-height:92dvh; border-radius:18px; }
	.tm-overview-head { padding:20px 16px 16px; }
	.tm-overview-head h2 { font-size:1.25rem; }
	.tm-overview-filters { padding:0 16px; grid-template-columns:1fr 1fr; }
	.tm-overview-filters label:first-child { grid-column:1 / -1; }
	.tm-overview-count { margin:0; padding:14px 16px 8px; }
	.tm-overview-results { padding:0 12px 16px; }
	.tm-overview .tm-directory-shop { min-height:80px; padding:12px; gap:10px; }
	.tm-overview .tm-directory-shop img, .tm-overview .tm-directory-initial { width:60px; height:44px; flex-basis:60px; }
	.tm-overview .tm-directory-shop .tm-directory-copy { font-size:.9rem; }
	.tm-directory-action { font-size:.7rem; gap:4px; }
}
@keyframes tm-sheet { from { transform:translateY(100%); } to { transform:none; } }

@media (prefers-reduced-motion:reduce) {
	.tm-area, .tm-btn, .tm-cta, .tm-detail, .tm-logo-pill, .tm-logo-item,
	.tm-area.tm-flash, .tm-overview-close, .tm-overview .tm-directory-shop { animation:none !important; transition:none !important; }
}

.tm-shared-note { margin:0 0 14px; color:var(--tc-muted); font-size:.9rem; }