/* ══════ PANELES LATERALES PLEGABLES ══════ */
.workspace.sidebar-plegado .sidebar { display: none; }
.workspace.chat-plegado .chat-panel { display: none; }

/* pestañas sobre el mapa */
.tab-panel {
  position: absolute; z-index: 1001;
  display: flex; align-items: center; gap: .35rem;
  background: var(--surface); color: var(--accent);
  border: 1px solid var(--border); font-size: .72rem; line-height: 1;
  cursor: pointer; padding: 0;
}
.tab-panel:hover { background: rgba(88,166,255,.15); }
.tab-texto { display: none; }
.tab-chat { display: none; }                     /* solo si hay un chat abierto */
.workspace.hay-chat .tab-chat { display: flex; }

/* PC: tiras verticales en los bordes del mapa, con flecha */
.tab-sidebar, .tab-chat { top: 50%; transform: translateY(-50%); width: 20px; height: 56px; justify-content: center; }
.tab-sidebar { left: 0;  border-left: 0;  border-radius: 0 8px 8px 0; }
.tab-chat    { right: 0; border-right: 0; border-radius: 8px 0 0 8px; }
.tab-sidebar .tab-flecha::before            { content: '◀'; }
.tab-sidebar[aria-expanded="false"] .tab-flecha::before { content: '▶'; }
.tab-chat .tab-flecha::before               { content: '▶'; }
.tab-chat[aria-expanded="false"] .tab-flecha::before    { content: '◀'; }

/* Móvil: paneles apilados, pestañas horizontales con texto */
@media (max-width: 767.98px) {
  .tab-sidebar, .tab-chat { left: 50%; right: auto; transform: translateX(-50%); width: auto; height: auto; padding: .4rem .8rem; }
  .tab-sidebar { top: 0; bottom: auto; border-top: 0; border-left: 1px solid var(--border); border-radius: 0 0 8px 8px; }
  .tab-chat    { top: auto; bottom: 0; border-bottom: 0; border-right: 1px solid var(--border); border-radius: 8px 8px 0 0; }
  .tab-texto { display: inline; }
  .tab-sidebar .tab-flecha::before                        { content: '▲'; }
  .tab-sidebar[aria-expanded="false"] .tab-flecha::before { content: '▼'; }
  .tab-chat .tab-flecha::before                           { content: '▼'; }
  .tab-chat[aria-expanded="false"] .tab-flecha::before    { content: '▲'; }
}
