/* Stay experience of the stay space */
.stay-experience { display: grid; gap: 1.5rem; margin-block-start: 2rem; }
.stay-subtitle { margin-block: 1.5rem .5rem; font-family: var(--rym-font-body); font-size: 1rem; font-weight: 700; letter-spacing: normal; }
.stay-link { display: inline-flex; align-items: center; min-block-size: 44px; }

/* Timeline of the stay */
.stay-timeline { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; margin: 0; padding: 0; list-style: none; }
.stay-timeline__item { display: grid; gap: .5rem; color: var(--rym-color-text-muted); font-size: .875rem; font-weight: 600; line-height: 1.3; }
.stay-timeline__item::before { content: ""; block-size: 2px; border-radius: 2px; background-color: var(--rym-hairline-strong); }
.stay-timeline__item.is-done, .stay-timeline__item[aria-current="step"] { color: var(--rym-color-text); }
.stay-timeline__item.is-done::before { background-color: var(--rym-color-text); }
.stay-timeline__item[aria-current="step"] { font-weight: 700; }
.stay-timeline__item[aria-current="step"]::before { background-color: var(--rym-color-ink); block-size: 4px; margin-block-start: -1px; }

/* Section tiles */
/* W7d: one row of upright tiles on wide screens (icon above the label), two per row on phones. */
.stay-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9.5rem), 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.stay-tile { border: 1px solid var(--rym-hairline); border-radius: 1.25rem; background-color: #fff; transition: transform var(--rym-dur-2) var(--rym-ease-out); }
.stay-tile__link { display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 1.25rem; block-size: 100%; min-block-size: 8.5rem; padding: 1.125rem 1.25rem 1.25rem; border-radius: inherit; color: var(--rym-color-text); font-weight: 600; line-height: 1.3; text-decoration: none; }
.stay-tile__icon { flex: none; box-sizing: content-box; inline-size: 1.25rem; block-size: 1.25rem; padding: .6875rem; border-radius: 50%; background-color: var(--rym-color-surface-warm); color: var(--rym-color-text); }
.stay-tile__title { overflow-wrap: anywhere; }
@media (max-width: 39.99rem) {
	.stay-tile__link { min-block-size: 6.5rem; gap: .75rem; }
	.stay-tile:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
.stay-tile:focus-within { outline: 3px solid var(--rym-color-focus); outline-offset: 2px; }
.stay-tile__link:focus { outline: none; }
@media (hover: hover) and (pointer: fine) {
	.stay-tile:hover { transform: translateY(-2px); border-color: var(--rym-hairline-strong); }
	.stay-tile:hover .stay-tile__icon { background-color: var(--rym-color-ink); color: var(--rym-color-on-ink); }
}

/* Arrival guide */
.stay-arrival address { font-style: normal; font-size: 1.0625rem; line-height: var(--rym-line-height); }
.stay-arrival__unit { margin-block-start: .5rem; }

/* Access information: the released code on a navy plate. */
.stay-access__released { padding: 1.5rem; border-radius: 1.25rem; background-color: var(--rym-color-ink); color: var(--rym-color-on-ink); }
.stay-access__released:focus-visible { outline: 3px solid var(--rym-color-focus); outline-offset: 2px; }
.stay-access__released a { color: var(--rym-color-on-ink); }
.stay-access__code-label { margin-block: .75rem 0; color: var(--rym-color-on-ink-muted); font-size: .875rem; }
.stay-access__code { margin-block: .25rem .75rem; font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; font-size: clamp(1.75rem, 1.3rem + 2vw, 2.75rem); font-weight: 700; letter-spacing: .12em; }
.stay-access__message { font-weight: 700; }

/* Conditions of the release: one ruled row each, the state as a pill. */
.stay-conditions { display: grid; margin: 0; padding: 0; border-block-start: 1px solid var(--rym-hairline); list-style: none; }
.stay-conditions__item { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: .25rem .75rem; align-items: baseline; padding-block: .875rem; border-block-end: 1px solid var(--rym-hairline); }
.stay-conditions__item:last-child { border-block-end: 0; }
.stay-conditions__state { justify-content: center; min-inline-size: 4.5rem; }
.stay-conditions__message { grid-column: 2; color: var(--rym-color-text-muted); font-size: .875rem; }
.stay-identity { margin-block-start: 1.5rem; padding-block-start: 1.5rem; border-block-start: 1px solid var(--rym-hairline); }

/* Conversation */
.stay-badge { display: inline-flex; margin-inline-start: .5rem; padding: .125rem .5rem; border-radius: 999px; background-color: var(--rym-color-ink); color: var(--rym-color-on-ink); font-family: var(--rym-font-body); font-size: .8125rem; font-weight: 700; letter-spacing: normal; vertical-align: middle; }
.stay-messages__list { max-block-size: 32rem; overflow-y: auto; padding: 1.25rem; border-radius: 1.25rem; background-color: var(--rym-color-surface-warm); overscroll-behavior: contain; }
.stay-messages__list:focus-visible { outline: 3px solid var(--rym-color-focus); outline-offset: 2px; }
.stay-messages__items { display: grid; gap: .75rem; margin: 0; padding: 0; list-style: none; }
.stay-message { max-inline-size: min(34rem, 88%); padding: .75rem 1rem; border-radius: 1.125rem; border-end-start-radius: .375rem; background-color: #fff; box-shadow: 0 0 0 1px var(--rym-hairline); }
.stay-message--mine { margin-inline-start: auto; border-end-start-radius: 1.125rem; border-end-end-radius: .375rem; background-color: var(--rym-color-ink); color: var(--rym-color-on-ink); box-shadow: none; }
.stay-message--mine a { color: var(--rym-color-bg); }
.stay-message__meta { display: flex; flex-wrap: wrap; gap: .5rem; margin-block: 0 .25rem; color: var(--rym-color-text-muted); font-size: .8125rem; }
.stay-message--mine .stay-message__meta { color: var(--rym-color-on-ink-muted); }
.stay-message__sender { color: var(--rym-color-text); font-weight: 700; }
.stay-message--mine .stay-message__sender { color: var(--rym-color-bg); }
.stay-message__body { margin: 0; overflow-wrap: anywhere; }
.stay-message__body--hidden { font-style: italic; opacity: .8; }
.stay-message__files { margin-block: .5rem 0; padding-inline-start: 1rem; }
.stay-messages__empty { margin: 0; max-inline-size: none; color: var(--rym-color-text-muted); }
.stay-messages__form { margin-block-start: 1rem; }

/* Special requests and incident reports */
.stay-list { display: grid; gap: .75rem; margin: 0; padding: 0; list-style: none; }
.stay-list__item { padding: 1.25rem; border: 1px solid var(--rym-hairline); border-radius: 1rem; background-color: var(--rym-color-bg); }
.stay-list__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; margin: 0; }
.stay-list__title { font-weight: 700; }
.stay-list__text, .stay-list__answer { margin-block: .5rem 0; overflow-wrap: anywhere; }
.stay-list__answer { padding-inline-start: .875rem; border-inline-start: 1px solid var(--rym-color-text); }
.stay-list__facts { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin-block: .5rem 0; }
.stay-list__facts dt { color: var(--rym-color-text-muted); font-size: .8125rem; }
.stay-list__facts dd { margin: 0; }

/* Forms of the stay parts: the submit button at the start, not full width. */
.stay-experience .booking-form > .button { justify-self: start; }
@media (prefers-reduced-motion: reduce) { .stay-tile:hover { transform: none; } }