/* Destination picker (homepage, hotels list, map). Fits inside each form's existing field. */
.mn-dp { position: relative; width: 100%; }
.mn-dp .mn-dp-input { width: 100%; padding-right: 30px; cursor: pointer; text-overflow: ellipsis; }
.mn-dp .mn-dp-input[readonly] { background: transparent; }
.mn-dp .mn-dp-clear {
    position: absolute; right: 2px; top: 50%; transform: translateY(-50%);
    width: 26px; height: 26px; border: 0; border-radius: 50%; padding: 0;
    background: rgba(168, 93, 109, .12); color: #8B4A55; font-size: 18px; line-height: 26px; cursor: pointer;
}
.mn-dp .mn-dp-clear:hover { background: rgba(168, 93, 109, .22); }
.mn-dp .mn-dp-clear[hidden] { display: none; }

.mn-dp-panel {
    position: absolute; z-index: 1060; top: calc(100% + 10px); left: -12px;
    width: max(100%, 320px); max-width: calc(100vw - 32px);
    background: #fff; border-radius: 16px; box-shadow: 0 18px 50px rgba(61, 43, 61, .18);
    border: 1px solid #F1E4E7; padding: 6px; text-align: left;
    font-family: 'Montserrat', sans-serif;
}
.mn-dp-panel[hidden] { display: none; }
.mn-dp-panel .mn-dp-sheet-head, .mn-dp-panel .mn-dp-filter { display: none; }
.mn-dp-panel .mn-dp-list { list-style: none; margin: 0; padding: 0; max-height: 330px; overflow-y: auto; overscroll-behavior: contain; }
.mn-dp-panel .mn-dp-item {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 10px 12px; border-radius: 10px; cursor: pointer; color: #3D2B3D; font-size: .92rem;
}
.mn-dp-panel .mn-dp-item::before {
    content: ''; flex: 0 0 8px; height: 8px; border-radius: 50%; background: #E8C4C8; margin-right: -4px;
}
.mn-dp-panel .mn-dp-name { flex: 1 1 auto; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mn-dp-panel .mn-dp-count { flex: 0 0 auto; font-size: .78rem; color: #8B6F7C; }
.mn-dp-panel .mn-dp-item.is-active, .mn-dp-panel .mn-dp-item:hover { background: #FBEDEF; }
.mn-dp-panel .mn-dp-item[aria-selected="true"] .mn-dp-name { color: #A85D6D; font-weight: 700; }
.mn-dp-panel .mn-dp-item[aria-selected="true"]::before { background: #A85D6D; }
.mn-dp-panel .mn-dp-all { color: #8B4A55; font-weight: 600; border-bottom: 1px solid #F3E8EA; border-radius: 10px 10px 0 0; }
.mn-dp-panel .mn-dp-all::before { background: none; border: 2px solid #E8C4C8; }
.mn-dp-panel .mn-dp-child { padding-left: 28px; }
.mn-dp-panel .mn-dp-empty { padding: 14px 12px; color: #8B6F7C; font-size: .88rem; }

/* phones: bottom sheet */
body.mn-dp-lock { overflow: hidden; }
.mn-dp-backdrop { position: fixed; inset: 0; z-index: 1065; background: rgba(36, 22, 33, .45); animation: mn-dp-fade .2s ease; }
.mn-dp-panel.is-sheet {
    position: fixed; z-index: 1070; left: 0; right: 0; bottom: 0; top: auto;
    width: 100%; max-width: none; max-height: 82vh; padding: 8px 14px calc(14px + env(safe-area-inset-bottom));
    border-radius: 22px 22px 0 0; border: 0; display: flex; flex-direction: column;
    animation: mn-dp-up .22s ease;
}
.mn-dp-panel.is-sheet .mn-dp-sheet-head {
    display: flex; align-items: center; justify-content: space-between; padding: 10px 4px 8px;
    font: 700 1.15rem 'Cormorant Garamond', Georgia, serif; color: #3D2B3D;
}
.mn-dp-panel.is-sheet .mn-dp-close {
    width: 34px; height: 34px; border: 0; border-radius: 50%; background: #F6ECEE; color: #3D2B3D; font-size: 20px; line-height: 34px;
}
.mn-dp-panel.is-sheet .mn-dp-filter {
    display: block; width: 100%; margin: 4px 0 8px; padding: 11px 14px; border: 2px solid #EFE3E6; border-radius: 12px;
    font: 400 16px 'Montserrat', sans-serif; color: #3D2B3D; background: #FFF9F8;
}
.mn-dp-panel.is-sheet .mn-dp-filter:focus { outline: none; border-color: #A85D6D; }
.mn-dp-panel.is-sheet .mn-dp-list { max-height: none; flex: 1 1 auto; }
.mn-dp-panel.is-sheet .mn-dp-item { padding: 14px 12px; font-size: 1rem; }
@keyframes mn-dp-up { from { transform: translateY(30px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes mn-dp-fade { from { opacity: 0; } to { opacity: 1; } }

/* optional dates on the hotels list / map search forms */
.date-values .date-placeholder { display: none; color: #9B8592; font-weight: 400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.date-values.is-empty .date-placeholder { display: inline; }
.date-values.is-empty .check-in-render, .date-values.is-empty .check-out-render, .date-values.is-empty .date-sep { display: none; }
