/* Colores siempre activos */
.mt-acceso{background:#6b3fa0}
.mt-panico{background:#c0392b}
.mt-sos{background:#922b21}
.mt-chat{background:#1b3888}
.mt-800{background:#f2b324;color:#1a1a1a}
.mt-800 .mt-icon,.mt-800 .mt-label{color:#1a1a1a}

/* ─── BARRA MÓVIL (bottom) ─── */
#metro-bar{display:none}
@media(max-width:768px){
  #metro-bar{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:10000;height:72px;background:transparent}
  .metro-tile{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:none;cursor:pointer;padding:0;color:#fff;-webkit-tap-highlight-color:transparent;transition:filter .1s;outline:none;position:relative}
  .metro-tile:active{filter:brightness(.75)}
  .mt-icon{font-size:1.5rem;line-height:1}
  .mt-label{font-size:.6rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-top:1px}
  .mt-800 .mt-icon{font-size:1.35rem}
  .mt-800-badge{position:absolute;top:5px;right:6px;background:#1a1a1a;color:#f2b324;font-size:.5rem;font-weight:800;letter-spacing:.06em;border-radius:8px;padding:1px 5px;line-height:1.4}
  .mt-800-sub{font-size:.48rem;font-weight:600;color:#1a1a1a;opacity:.75;letter-spacing:.03em}
  .mt-sos-badge{position:absolute;top:5px;left:6px;background:rgba(255,255,255,.25);color:#fff;font-size:.5rem;font-weight:800;letter-spacing:.06em;border-radius:8px;padding:1px 5px;line-height:1.4}
  .mt-sos-sub{font-size:.48rem;font-weight:600;color:#fff;opacity:.8;letter-spacing:.03em}
  .mt-acceso,.mt-panico{display:none!important}
  #acc-btn,#acc-min-btn,#btn-panico-fab,#crisis-fab,.chat-btn{display:none!important}
}

/* ─── SIDEBAR ESCRITORIO (right) ─── */
@media(min-width:769px){
  #metro-bar{
    display:flex;
    flex-direction:column;
    position:fixed;
    right:0;
    top:50%;
    transform:translateY(-50%);
    z-index:9000;
    gap:5px;
    background:transparent;
  }
  .metro-tile{
    flex:none;
    flex-direction:row;
    border:none;
    border-radius:10px 0 0 10px;
    padding:12px 16px 12px 14px;
    gap:10px;
    align-items:center;
    justify-content:flex-start;
    cursor:pointer;
    color:#fff;
    -webkit-tap-highlight-color:transparent;
    outline:none;
    overflow:hidden;
    box-shadow:-3px 2px 10px rgba(0,0,0,.30);
    transition:transform .2s ease, box-shadow .2s ease, filter .1s;
  }
  .metro-tile:hover{
    transform:translateX(-6px);
    box-shadow:-5px 3px 14px rgba(0,0,0,.38);
    filter:brightness(1.07);
  }
  .mt-icon{font-size:1.1rem;line-height:1;flex-shrink:0}
  .mt-label{
    font-size:.65rem;
    font-weight:800;
    letter-spacing:.07em;
    text-transform:uppercase;
    white-space:nowrap;
    color:#fff;
    margin-top:0;
    opacity:1;
    max-width:none;
  }
  .mt-800 .mt-label{color:#1a1a1a}
  .mt-800-badge,.mt-800-sub,.mt-sos-badge,.mt-sos-sub{display:none!important}
  .mt-sos{display:none!important}
  .mt-acceso,.mt-panico{display:none!important}
  #btn-panico-fab,#crisis-fab,.chat-btn{display:none!important}
}

/* === Accesibilidad en sidebar escritorio === */
@media(min-width:769px){
  .mt-acceso{display:flex!important;order:10;background:#0074a8;}
  #acc-btn,#acc-min-btn,#acc-mini-tab{display:none!important;}
  #acc-panel{left:auto;right:120px;bottom:80px;top:auto;transform:none;}
  #acc-panel.visible{display:block;}
}

/* === Accesibilidad: pestaña lateral en móvil === */
@media(max-width:768px){
  #acc-btn{
    display:flex!important;
    bottom:auto!important;
    left:auto!important;
    right:0!important;
    top:70%!important;
    transform:translateY(-50%)!important;
    border-radius:10px 0 0 10px!important;
    width:42px!important;
    height:56px!important;
    box-shadow:-3px 2px 10px rgba(0,0,0,.30)!important;
    font-size:1.3rem!important;
  }
  #acc-min-btn{display:none!important;}
  #acc-panel{
    left:auto!important;
    right:48px!important;
    bottom:100px!important;
    top:auto!important;
    transform:none!important;
    max-width:calc(100vw - 60px)!important;
  }
}