/* „Карта на загубите“ — опростен вариант: картата на цял екран, горе само „днес“,
   долу четирите показателя на това, което е на картата, и списъкът от панела на голямата карта.
   Всичко останало идва от wall.css. */
:root { --dock-h: 8.2rem; }

.wall-simple .wall-today { width: auto; }
.wall-simple .wall-controls { top: 11.2rem; bottom: auto; }
/* под заглавието — на какво са плочките в момента; текущото е подчертано */
.wall-simple .wall-crumbs { font-size: 1.55rem; color: var(--muted); margin-top: 0.2rem; }
.wall-simple .wall-crumbs a { color: var(--ink); }
.wall-simple .wall-crumbs .cur { color: var(--teal); font-weight: 700; border-bottom: 0; }
body.wall-simple::after { height: calc(var(--dock-h) + 9rem); }

/* легенда и източник — над лентата */
.wall-simple .wall-legend { left: 2rem; right: 2rem; bottom: calc(var(--dock-h) + 1.9rem); }
.wall-simple .lg-src { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 30rem; }
.wall-simple .leaflet-bottom { bottom: calc(var(--dock-h) + 1.5rem); }

/* долната лента: петте плочки (плочките от wall.css) в един ред */
.wall-dock { position: fixed; left: 2rem; right: 2rem; bottom: 1.2rem; height: var(--dock-h); z-index: 1000; }
.wall-dock .tiles { grid-template-columns: repeat(5, minmax(0, 1fr)); grid-template-rows: minmax(0, 1fr); gap: 0.8rem; margin: 0; height: 100%; }
.wall-dock .tile { background: linear-gradient(rgba(148, 163, 184, 0.07), rgba(148, 163, 184, 0.07)), var(--glass); backdrop-filter: blur(10px); }
/* плочките са по-широки, отколкото в панела — същите пропорции, ×1,3 */
.wall-dock .tile { padding: 0.75rem 0.95rem; border-radius: 0.9rem; }
.wall-dock .t-label { font-size: 1.3rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wall-dock .t-big { font-size: 2.8rem; }
.wall-dock .t-big small { font-size: 1.1rem; }
.wall-dock .gauge { width: 8rem; }
/* петата плочка: списък с вътрешно превъртане */
.wall-dock .t-list { display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.wall-dock .t-list .t-label { flex: 0 0 auto; font-size: 1.2rem; letter-spacing: 0; }
.t-items { list-style: none; margin: 0.3rem 0 0; padding: 0 0.3rem 0 0; flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain;
  font-size: 1rem; line-height: 1.45; color: var(--ink); scrollbar-width: thin; scrollbar-color: rgba(94, 234, 212, 0.35) transparent; }
.t-items li { display: flex; align-items: center; gap: 0.45rem; min-width: 0; padding: 0.1rem 0; cursor: pointer; }
.t-items li:hover { color: var(--teal); }
.t-items li .dot { flex: 0 0 auto; margin: 0; }
.t-items li .n { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.t-items li .v { flex: 0 0 auto; font-size: 0.82rem; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
/* ILI: класовете на Световната банка в цветовете на зоните на картата; текущият — подчертан */
.ili-cls { display: grid; grid-template-columns: 1fr 1fr; gap: 0.25rem 0.35rem; margin-left: auto; font-size: 0.82rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.ili-cls span { border-left: 0.3rem solid var(--c); padding: 0.1rem 0.4rem; border-radius: 0.2rem; background: rgba(148, 163, 184, 0.06); white-space: nowrap; }
.ili-cls span b { color: var(--c); margin-right: 0.3rem; }
.ili-cls span.me { background: rgba(148, 163, 184, 0.18); box-shadow: inset 0 0 0 1px var(--c); color: var(--ink); }


/* ---------- телефон, вертикално: по-едър шрифт, горе в два реда, четирите плочки по две, еднакво ниски; без списъка и без надписите на обиколката ---------- */
@media (max-width: 700px) {
  html { font-size: 11px; }
  :root { --dock-h: 11.4rem; }
  .wall-kicker { display: none; }
  .wall-title { top: 0.9rem; left: 1.2rem; right: 12.5rem; }
  .wall-title h1 { font-size: 2.2rem; margin: 0 0 0.2rem; }
  .wall-simple .wall-crumbs { font-size: 1.25rem; }
  .wall-clock { top: 0.9rem; right: 1.2rem; }
  .clock { font-size: 1.8rem; }
  .live-badge { font-size: 0.85rem; letter-spacing: 0.08em; }
  .proto-badge { margin-top: 0.3rem; font-size: 0.8rem; }
  .wall-simple .wall-today { left: auto; right: 1.2rem; top: 6.6rem; transform: none; text-align: right; }
  .wall-simple .tl-label { display: none; }
  .wall-simple .tl-date { font-size: 1.5rem; text-shadow: none; }
  .wall-simple .wall-controls { top: 9rem; left: auto; right: 1.2rem; }
  .wall-simple .wall-controls button { min-height: 4rem; font-size: 1.25rem; padding: 0.4rem 1rem; }
  .wall-simple #btn-music span { display: none; }   /* на телефон — само иконата */
  .wall-dock { left: 0.8rem; right: 0.8rem; bottom: 0.8rem; }
  .wall-dock .tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 0.5rem; }
  .wall-dock .t-list { display: none; }
  .wall-dock .tile { padding: 0.55rem 0.75rem; }
  .wall-dock .t-label, .wall-dock .t-list .t-label { font-size: 1.15rem; letter-spacing: 0; }
  .wall-dock .t-big { font-size: 2.3rem; }
  .wall-dock .t-big small { font-size: 1rem; }
  .wall-dock .t-gauge { gap: 0.5rem; }
  .wall-dock .gauge { width: 4.2rem; }
  .ili-cls { display: none; }
  .wall-simple .wall-legend { left: 0.8rem; right: 0.8rem; bottom: calc(var(--dock-h) + 3.9rem); }
  .wall-simple .lg-src { padding-right: 0; font-size: 0.85rem; }
  .wall-simple .leaflet-bottom { bottom: calc(var(--dock-h) + 1rem); }
  .wall-simple .leaflet-control-attribution { font-size: 0.8rem; }
  .wall-caption { display: none !important; }
  .wall-tip { font-size: 1.15rem; max-width: 24rem; }
}

/* ---------- телефон, хоризонтално: четирите плочки в ред, по-едър шрифт, по-големи бутони; без списъка и без надписите на обиколката ---------- */
@media (max-height: 500px) and (min-width: 701px) {
  html { font-size: 9px; }
  :root { --dock-h: 7.4rem; }
  .wall-simple .wall-controls button { min-height: 4rem; }
  .wall-dock .tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.6rem; }
  .wall-dock .t-list { display: none; }
  .wall-caption { display: none !important; }
  .wall-dock .tile { padding: 0.6rem 0.75rem; }
  .wall-dock .t-label { font-size: 1.15rem; }
  .wall-dock .t-big { font-size: 2.4rem; }
  .wall-dock .gauge { width: 5.2rem; }
  .wall-dock .t-gauge { gap: 0.35rem; }
  .ili-cls { font-size: 0.78rem; gap: 0.15rem 0.2rem; }
  .ili-cls span { padding: 0.05rem 0.2rem; border-left-width: 0.25rem; }
  .wall-tip { font-size: 1.1rem; }
}