/* Hotelaria: recepção, hospedagem, mapa de ocupação e governança (assets/hotelaria-painel.js). Reaproveita as classes rest-* de
   assets/restaurante-painel.css (resumo, legenda, barra, conta, totais e configurações). */
#painel .hot-ponto { display: inline-block; width: 12px; height: 12px; margin-right: -8px; border-radius: 4px; background: var(--quarto); }
#painel .hot-ponto.livre, #painel .hot-quarto.livre { --quarto: #2f9e6e; }
#painel .hot-ponto.chega, #painel .hot-quarto.chega { --quarto: #2a7bc0; }
#painel .hot-ponto.ocupado, #painel .hot-quarto.ocupado { --quarto: var(--pal-6b56d6, #6b56d6); }
#painel .hot-ponto.sai, #painel .hot-quarto.sai { --quarto: #d9822b; }
#painel .hot-ponto.limpeza, #painel .hot-quarto.limpeza { --quarto: #c9a227; }
#painel .hot-ponto.manutencao, #painel .hot-quarto.manutencao { --quarto: #8a8295; }
#painel .hot-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; }
#painel .hot-quarto { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; width: 100%; min-height: 128px; margin: 0; padding: 14px 16px;
  border: 1px solid #e9e4f0; border-top: 5px solid var(--quarto); border-radius: 16px; background: #fff; color: var(--pal-2b2541, #2b2541);
  font: inherit; text-align: left; cursor: pointer; transition: transform .15s ease, box-shadow .15s ease; }
#painel .hot-quarto:hover, #painel .hot-quarto:focus-visible { transform: translateY(-2px); box-shadow: 0 10px 24px #2b25411a; }
#painel .hot-quarto strong { font-size: 24px; line-height: 1.1; }
#painel .hot-quarto em { color: var(--quarto); font-size: 12px; font-style: normal; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
#painel .hot-quarto span { font-weight: 600; }
#painel .hot-quarto small { color: var(--pal-5b5672, #5b5672); font-size: 12px; }
#painel .hot-movimento { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
#painel .hot-movimento h3 { margin: 0 0 10px; }
#painel .hot-lista { margin: 0; padding: 0; list-style: none; }
#painel .hot-lista li { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid #f0edf4; }
#painel .hot-lista small { display: block; color: var(--pal-5b5672, #5b5672); font-size: 12px; }
#painel .hot-dados h3, #painel .hot-conta h3 { margin: 0 0 12px; }
#painel .hot-dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; margin: 0; }
#painel .hot-dl .largo { grid-column: 1 / -1; }
#painel .hot-dl dt { color: var(--pal-8a8295, #8a8295); font-size: 12px; }
#painel .hot-dl dd { margin: 2px 0 0; font-weight: 600; overflow-wrap: anywhere; }
#painel .hot-conta .varejo-tabela td small { display: block; color: var(--pal-8a8295, #8a8295); font-size: 11px; }
#painel .hot-conta .hot-cancelado td { opacity: .5; text-decoration: line-through; }
#painel .hot-tipo { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid #f0edf4; }
#painel .hot-tipo small { display: block; color: var(--pal-5b5672, #5b5672); font-size: 12px; }
#painel .hot-tipo + .botao-padrao, #painel #hot-novo-quarto { margin-top: 12px; }
#painel .hot-periodo { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, .8fr) minmax(0, 1fr); gap: 8px; margin-bottom: 8px; }
#painel .hot-gov { display: grid; gap: 8px; }
#painel .hot-gov .hot-quarto { cursor: default; }
#painel .hot-gov-acoes { display: flex; flex-wrap: wrap; gap: 6px; }
#painel .hot-gov-acoes button { flex: 1 1 auto; min-height: 38px; }
#painel .hot-consumo-itens { max-height: 300px; margin: 10px 0; }
#painel .varejo-dialogo [data-busca] { width: 100%; min-height: 46px; }

/* mapa de ocupação: uma linha por acomodação, uma coluna por dia */
#painel .hot-ocupacao-card { overflow-x: auto; }
#painel .hot-ocupacao { min-width: 860px; }
#painel .hot-ocup-linha { position: relative; display: grid; grid-template-columns: 130px repeat(var(--dias), minmax(48px, 1fr)); align-items: stretch;
  min-height: 44px; border-bottom: 1px solid #f0edf4; }
#painel .hot-ocup-linha > i { grid-row: 1; border-left: 1px solid #f3f0f8; }
#painel .hot-ocup-linha > i.hoje { background: #f4f0ff; }
#painel .hot-ocup-cabecalho span { padding: 6px 0; color: var(--pal-8a8295, #8a8295); font-size: 11px; text-align: center; text-transform: uppercase; }
#painel .hot-ocup-cabecalho span b { display: block; color: var(--pal-2b2541, #2b2541); font-size: 15px; }
#painel .hot-ocup-cabecalho span.hoje b { color: var(--pal-6b56d6, #6b56d6); }
#painel .hot-ocup-quarto { grid-column: 1; grid-row: 1; padding: 6px 8px; }
#painel .hot-ocup-quarto small { display: block; color: var(--pal-8a8295, #8a8295); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#painel .hot-barra { grid-row: 1; align-self: center; z-index: 1; min-height: 30px; margin: 0 3px; padding: 4px 8px; overflow: hidden; border: 0; border-radius: 8px;
  background: var(--pal-6b56d6, #6b56d6); color: #fff; font: inherit; font-size: 12px; font-weight: 600; text-align: left; white-space: nowrap; text-overflow: ellipsis; cursor: pointer; }
#painel .hot-barra.reservada { background: #8fa8d8; }
#painel .hot-barra.confirmada { background: #2a7bc0; }
#painel .hot-barra.finalizada { background: #b9b2c7; }

@media (max-width: 760px) {
  #painel .hot-movimento { grid-template-columns: 1fr; }
  #painel .hot-grade { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
  #painel .hot-dl { grid-template-columns: 1fr; }
}
/* Formulários das janelas (reserva, check-in, tipos, acomodações) em duas colunas; no celular, uma. */
#painel .varejo-dialogo .varejo-form-grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; align-items: start; }
#painel .varejo-dialogo .varejo-form-grade > label { display: grid; gap: 6px; font-size: 12px; font-weight: 600; }
#painel .varejo-dialogo .varejo-form-grade > .largo { grid-column: 1 / -1; }
#painel .varejo-dialogo .varejo-form-grade small { color: var(--pal-5b5672, #5b5672); font-weight: 400; }
@media (max-width: 560px) { #painel .varejo-dialogo .varejo-form-grade { grid-template-columns: 1fr; } }
/* Portal do hóspede no painel */
#painel .hot-alerta dd, #painel .hot-alerta-texto { color: #b4621a !important; font-weight: 600; }