/* Meki: seleção de data do Mapa de Salas — responsividade mobile.
 * Preserva os mesmos handlers e mantém o layout horizontal em desktop.
 */
.room-map-date-navigation,
.room-map-date-shortcuts{
  display:flex;
  align-items:flex-end;
  gap:7px;
  min-width:0;
}
.room-map-date-field{min-width:170px}
.room-map-date-field label{display:block;margin-bottom:5px}
@media screen and (min-width:761px){
  .room-map-date-controls > .room-map-date-navigation,
  .room-map-date-controls > .room-map-date-shortcuts{
    flex:0 1 auto;
  }
}
@media screen and (max-width:760px){
  #app #mapas .room-map-toolbar{
    display:block;
    min-width:0;
    width:100%;
  }
  #app #mapas .room-map-date-controls{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    width:100%;
    min-width:0;
    gap:10px;
  }
  #app #mapas .room-map-date-controls > div{
    flex:none;
    min-width:0;
    max-width:100%;
  }
  #app #mapas .room-map-date-navigation{
    display:grid;
    grid-template-columns:44px minmax(0,1fr) 44px;
    grid-template-rows:auto minmax(44px,auto);
    align-items:end;
    gap:7px;
    width:100%;
  }
  #app #mapas .room-map-date-field{
    display:contents;
  }
  #app #mapas .room-map-date-field label{
    grid-column:1/-1;
    grid-row:1;
    margin:0;
    color:#d6eaf8;
    font-size:13px;
    font-weight:820;
    line-height:1.35;
  }
  #app #mapas .room-map-date-navigation .room-map-date-prev{
    grid-column:1;
    grid-row:2;
  }
  #app #mapas .room-map-date-navigation .room-map-date-next{
    grid-column:3;
    grid-row:2;
  }
  #app #mapas .room-map-date-navigation .room-map-date-prev,
  #app #mapas .room-map-date-navigation .room-map-date-next{
    display:grid;
    place-items:center;
    width:44px!important;
    min-width:44px;
    min-height:44px;
    height:44px;
    padding:0!important;
    color:#c1e9ff!important;
    font-size:23px;
    border:1px solid #375b76!important;
    background:linear-gradient(140deg,#173b55,#10283f)!important;
    border-radius:12px;
  }
  #app #mapas .room-map-date-field input{
    grid-column:2;
    grid-row:2;
    display:block;
    width:100%;
    min-width:0!important;
    max-width:100%;
    min-height:44px;
    height:44px;
    padding:7px 6px;
    box-sizing:border-box;
    background:#10283f;
    color:#f1faff;
    color-scheme:dark;
    font-size:16px;
    border:1px solid #356780;
    border-radius:12px;
    text-align:center;
  }
  #app #mapas .room-map-date-shortcuts{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    width:100%;
    min-width:0;
  }
  #app #mapas .room-map-date-shortcuts .btn{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    min-width:0;
    max-width:100%;
    height:auto;
    min-height:44px;
    border-radius:12px;
    padding:9px 10px;
    font-size:13px;
    white-space:normal;
    line-height:1.3;
  }
  #app #mapas .room-map-wrap{
    max-width:100%;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
  }
}
