/* HMS-60 — hotel partner portal. Own layout, quiet palette, the same token
   conventions as every other screen. */

.hotel-sign-in {
  max-width: 24rem;
  margin: 3rem auto;
}

.hotel-sign-in__title {
  margin: 0 0 1rem;
  font-size: 1.25rem;
  color: var(--wa-color-text-normal);
}

.hotel-sign-in__label {
  display: block;
  margin: 0.75rem 0 0.25rem;
  font-size: 0.875rem;
  color: var(--wa-color-text-quiet);
}

.hotel-sign-in__input {
  width: 100%;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--wa-color-neutral-border-normal);
  border-radius: var(--wa-border-radius-m);
  font: inherit;
}

.hotel-sign-in__submit {
  margin-top: 1rem;
  padding: 0.625rem 1.25rem;
  border: 1px solid var(--wa-color-brand-fill-loud);
  border-radius: var(--wa-border-radius-m);
  background: var(--wa-color-brand-fill-loud);
  color: var(--wa-color-brand-on-loud);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

.hotel-sign-in__alert {
  margin-top: 1rem;
  color: var(--wa-color-danger-fill-loud);
}

.hotel-sign-in__hint {
  margin-top: 1.5rem;
  font-size: 0.8125rem;
  color: var(--wa-color-text-quiet);
}

/* Dashboard */

.hotel-dashboard__header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.hotel-dashboard__title {
  margin: 0;
  font-size: 1.375rem;
  color: var(--wa-color-text-normal);
}

.hotel-dashboard__subtitle {
  margin: 0.125rem 0 0;
  color: var(--wa-color-text-quiet);
}

.hotel-dashboard__section {
  margin-bottom: 2rem;
}

.hotel-dashboard__section-title {
  margin: 0 0 0.5rem;
  font-size: 1.125rem;
  color: var(--wa-color-text-normal);
}

.hotel-dashboard__kpis {
  margin: 0 0 1rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  gap: 0.75rem;
}

.hotel-dashboard__kpi {
  border: 1px solid var(--wa-color-neutral-border-normal);
  border-radius: var(--wa-border-radius-m);
  padding: 0.75rem 1rem;
}

.hotel-dashboard__label {
  font-size: 0.8125rem;
  color: var(--wa-color-text-quiet);
}

.hotel-dashboard__value {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--wa-color-text-normal);
}

.hotel-dashboard__table,
.hotel-rooming__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}

/* The dashboard tables carry 5+ columns plus an inline dispute form; on a
   phone they outgrow the section and the overflow renders under the next
   section, where it cannot be tapped. Scroll inside the wrap instead —
   same contract as .admin-table-wrap. */
.hotel-table-wrap {
  overflow-x: auto;
  width: 100%;
  /* Same right-edge scroll hint as .admin-table-wrap: painted beneath the
     table, so it never covers or blocks tappable content. */
  box-shadow: inset -10px 0 10px -10px var(--wa-color-neutral-border-quiet);
}

.hotel-table-wrap table {
  min-width: max-content;
}

.hotel-dashboard__table th,
.hotel-dashboard__table td,
.hotel-rooming__table th,
.hotel-rooming__table td {
  text-align: left;
  padding: 0.5rem;
  border-bottom: 1px solid var(--wa-color-neutral-border-quiet);
}

.hotel-rooming__event {
  margin: 1rem 0 0.5rem;
  font-size: 1rem;
  color: var(--wa-color-text-normal);
}

.hotel-rooming__empty {
  color: var(--wa-color-text-quiet);
}

.hotel-rooming__confirm {
  margin-top: 0.75rem;
  padding: 0.5rem 1rem;
  border: 1px solid var(--wa-color-brand-fill-loud);
  border-radius: var(--wa-border-radius-m);
  background: var(--wa-color-brand-fill-quiet);
  color: var(--wa-color-brand-on-quiet);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

/* VIP verifications (HMS-253) — same table/quiet conventions as the dashboard
   and rooming list above. */

.hotel-vip-verifications__title {
  margin: 0 0 1rem;
  font-size: 1.375rem;
  color: var(--wa-color-text-normal);
}

.hotel-vip-verifications__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}

.hotel-vip-verifications__table th,
.hotel-vip-verifications__table td {
  text-align: left;
  padding: 0.5rem;
  border-bottom: 1px solid var(--wa-color-neutral-border-quiet);
}

.hotel-vip-verifications__table input[type="submit"],
.hotel-vip-verifications__table button {
  padding: 0.375rem 0.75rem;
  border: 1px solid var(--wa-color-brand-fill-loud);
  border-radius: var(--wa-border-radius-m);
  background: var(--wa-color-brand-fill-quiet);
  color: var(--wa-color-brand-on-quiet);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

.hotel-vip-verifications__empty {
  color: var(--wa-color-text-quiet);
}