/* HomeReserve owns geometry, scrolling, pointer events and its 9000+ layers.
   Calendars are mounted under body, outside #hr-widget: theme them explicitly. */
:root {
  --booking-text:#17352d; --booking-muted:#5f706a;
  --booking-surface:#fffdf8; --booking-field:#fffdf8;
  --booking-action:#087052; --booking-action-hover:#07543f;
  --booking-action-soft:#dcebe4; --booking-action-text:#fffaf0;
}
[data-theme="night"] {
  --booking-text:#fffaf0; --booking-muted:#b8c3bc;
  --booking-surface:#222724; --booking-field:#2b302d;
  --booking-action:#c4a66d; --booking-action-hover:#efd08e;
  --booking-action-soft:#3a3429; --booking-action-text:#03271f;
}
body .vanilla-calendar {
  background:var(--booking-surface) !important;
  border:1px solid rgb(196 166 109 / 46%) !important;
  border-radius:18px !important;
  box-shadow:0 24px 64px rgb(0 22 17 / 30%) !important;
}

html body #hr-modal,
html body .vanilla-calendar {
  --custom-text:var(--booking-text);
  --custom-label:var(--booking-muted);
  --custom-background:var(--booking-surface);
  --custom-main:var(--booking-action);
  --custom-main-dark:var(--booking-action-hover);
  --custom-main-light:var(--booking-action-soft);
  color:var(--booking-text);
  color-scheme:light;
}
html[data-theme="night"] body #hr-modal { color-scheme:dark; }
html body :is(#hr-widget,#hr-modal) .button-primary {
  background:var(--booking-action) !important;
  color:var(--booking-action-text) !important;
}
html body :is(#hr-widget,#hr-modal) .button-primary .button-content {
  color:var(--booking-action-text) !important;
}
html body #hr-widget .search__input-button * { color:var(--booking-action-text) !important; }
html body :is(#hr-widget,#hr-modal) .more-photos__text { background:var(--booking-surface) !important; color:var(--booking-text) !important; border-color:var(--booking-muted) !important; }
html body #hr-modal .tooltip,
html body #hr-modal .tooltip * {
  color:var(--booking-text) !important;
}
html body #hr-modal .tooltip {
  background:var(--booking-surface) !important;
  border-color:var(--booking-muted) !important;
}

html body .vanilla-calendar :is(.vanilla-calendar-info__title,.vanilla-calendar-month,.vanilla-calendar-year,.vanilla-calendar-week__day,.vanilla-calendar-footer__title,.vanilla-calendar-footer__notice) { color:var(--booking-text) !important; }
html body .vanilla-calendar .vanilla-calendar-day__btn { color:var(--booking-text) !important; background:transparent !important; }
html body .vanilla-calendar .vanilla-calendar-day__btn_disabled { color:var(--booking-muted) !important; opacity:1 !important; text-decoration:line-through; }
html body .vanilla-calendar .vanilla-calendar-text { color:var(--booking-muted) !important; }
html body .vanilla-calendar .vanilla-calendar-day__btn_selected { background:var(--booking-action-soft) !important; }
html body .vanilla-calendar :is(.vanilla-calendar-day__btn_selected-first,.vanilla-calendar-day__btn_selected-last) { background:var(--booking-action) !important; color:var(--booking-action-text) !important; }
html body .vanilla-calendar :is(.button-primary,.select__button) { background:var(--booking-action) !important; color:var(--booking-action-text) !important; }
html body .vanilla-calendar :is(.button-primary,.select__button) * { color:var(--booking-action-text) !important; }
html body .vanilla-calendar .select__dropdown { background:var(--booking-field) !important; color:var(--booking-text) !important; }
html[data-theme="night"] body .vanilla-calendar .vanilla-calendar-arrow::before { filter:brightness(0) invert(1); }

html body #hr-modal :is(.hr-modal,.main-page,.hotel-detail,.hotel-detail__fixed,.basket-page,.basket-page__price,.form,.form__container) { background:var(--booking-surface) !important; color:var(--booking-text) !important; }
html body #hr-modal :is(.form-input__input,input,textarea,.select__input) { background:var(--booking-field) !important; color:var(--booking-text) !important; border-color:rgb(196 166 109 / 35%) !important; }
html body #hr-modal :is(input,textarea)::placeholder { color:var(--booking-muted) !important; opacity:1 !important; }
html body #hr-modal :is(.hotel-info__title,.hotel-detail__content-title,.hotel-detail-info__title,.form__title,.price-block__title,.tariff-card__title,.tariff-card__desc,.tariff-card__right) { color:var(--booking-text) !important; }
html body #hr-modal :is(.form-input__label,.hotel-detail-info__description,.hotel-list__item) { color:var(--booking-muted) !important; }
html body #hr-modal .tariff-card__left { color:var(--booking-text) !important; }
html body #hr-modal .tariff-card { background:var(--booking-surface) !important; border-color:var(--booking-muted) !important; }
html body #hr-modal .tariff-card--selected { background:var(--booking-action-soft) !important; border-color:var(--booking-action) !important; }

/* Provider labels use hard-coded grey independently of its theme variables. */
html body :is(#hr-widget,#hr-modal) :is(.inputs__label,.select__input-text,.search__input-text,.hotel-detail-info__card-text,.hotel-detail-info__address-text,.price-info__day,.hotel-detail__day,.pay-block__text) { color:var(--booking-muted) !important; }
html body :is(#hr-widget,#hr-modal) .tabs__button { color:var(--booking-muted) !important; }
html body :is(#hr-widget,#hr-modal) .tabs__button--active { color:var(--booking-text) !important; }
html body :is(#hr-widget,#hr-modal) .ymaps3--open-maps-button { background:#fff !important; color:#17352d !important; }
/* Map attribution retains its own light surface in both booking themes. */
html body :is(#hr-widget,#hr-modal) .ymaps3--map-copyrights { background:#fff !important; color:#17352d !important; }
html body :is(#hr-widget,#hr-modal) .ymaps3--map-copyrights a { color:#17352d !important; }
html body #hr-modal .user-agreement__item p { color:var(--booking-muted) !important; }
html body :is(#hr-widget,#hr-modal) .hotel-card .muted { opacity:1 !important; }
html body :is(#hr-widget,#hr-modal) .hotel-card .hotel-card__image.muted { opacity:.5 !important; }
html body :is(#hr-widget,#hr-modal) .price-info__text p { color:var(--booking-muted) !important; }
html body #hr-modal .convenience__popup { background:var(--booking-surface) !important; color:var(--booking-text) !important; }
html body :is(#hr-widget,#hr-modal) :is(.button-secondary,.button-secondary:hover,.button-secondary:active) { background:var(--booking-surface) !important; color:var(--booking-text) !important; border-color:var(--booking-muted) !important; }
html body :is(#hr-widget,#hr-modal) .button-secondary .button-content { color:var(--booking-text) !important; }
html body .vanilla-calendar :is(.vanilla-calendar-day__btn_selected-first,.vanilla-calendar-day__btn_selected-last) .vanilla-calendar-text { color:var(--booking-action-text) !important; }

/* HomeReserve supplies light backgrounds for some guest, results and checkout
   surfaces even when its text variables follow our night palette. */
html[data-theme="night"] body :is(#hr-widget,#hr-modal) .select__option-child,
html[data-theme="night"] body :is(#hr-widget,#hr-modal) .select__option-child option { background:var(--booking-field) !important; color:var(--booking-text) !important; color-scheme:dark; }
html[data-theme="night"] body #hr-modal .select__dropdown { background:var(--booking-field) !important; color:var(--booking-text) !important; border-color:rgb(196 166 109 / 45%) !important; }
html body .mobile-select :is(.mobile-select__dropdown,.mobile-select__option,.mobile-select__children) { background:var(--booking-surface) !important; color:var(--booking-text) !important; }
html body .mobile-select :is(.mobile-select__option-child,.mobile-select__option-child_select,.mobile-select__increment) { background:var(--booking-field) !important; color:var(--booking-text) !important; border-color:var(--booking-muted) !important; }
html body .mobile-select :is(.mobile-select__note,.mobile-select__text) { color:var(--booking-text) !important; }
html[data-theme="night"] body #hr-modal .main-page :is(.custom-calendar.hr-search-container,.tabs,.search__input,.hotel-card) { background:var(--booking-surface) !important; color:var(--booking-text) !important; }
html[data-theme="night"] body #hr-modal :is(.pay-block,.form__info-block--input,.basket-page__fixed) { background:var(--booking-surface) !important; color:var(--booking-text) !important; }
html[data-theme="night"] body #hr-modal :is(.search__input,.form__info-block--input) { background:var(--booking-field) !important; }
html[data-theme="night"] body #hr-modal .main-page .hotel-card :is(.hotel-info__title,.price-info__current-price) { color:var(--booking-text) !important; }
html[data-theme="night"] body #hr-modal .main-page .map-pin,
html[data-theme="night"] body #hr-modal .main-page .map-pin span { color:var(--booking-action-text) !important; }
html[data-theme="night"] body #hr-modal .main-page .map-pin { background:var(--booking-action) !important; }

/* The provider's empty header and welcome strip remain after its contact
   controls are hidden. The map's policy links remain available in list view. */
html body #hr-modal .main-page > :is(.header,.welcome) { display:none !important; }
html body #hr-modal .main-page:has(.ymaps3--map-container) > .rules { display:none !important; }

/* Contact channels live in the fixed site panel. Keep the provider's booking
   fields (including the required guest phone input) intact. */
html body :is(#hr-widget,#hr-modal) :is(.header__button,.header__links,.header__locale-selector-wrapper,.header__current-locale,.header__burger,.burger-menu.header__list) { display:none !important; }

/* Catalogue hierarchy: title, address, complete accented parameters, amenities. */
html body #hr-widget .hotel-card .hotel-info__title { color:var(--booking-text) !important; }
html body #hr-widget .hotel-card .hotel-info__title { display:block !important; max-height:none !important; overflow:visible !important; white-space:normal !important; text-overflow:clip !important; -webkit-line-clamp:unset !important; overflow-wrap:anywhere !important; }
html body #hr-widget .hotel-card .hotel-info__text.is-duplicate-address { display:none !important; }
html body #hr-widget .hotel-card :is(.hotel-info__text,.hotel-info__text span,.hotel-list__item) { color:var(--booking-muted) !important; }
html body #hr-widget .hotel-card .hotel-info__params { flex-wrap:wrap !important; gap:8px 16px !important; margin-block:12px !important; }
html body #hr-widget .hotel-card .hotel-info__params-item { overflow:visible !important; margin:0 !important; flex:0 0 auto !important; }
html body #hr-widget .hotel-card .hotel-info__params-item span { white-space:normal !important; overflow:visible !important; text-overflow:clip !important; color:var(--booking-action) !important; font-weight:600 !important; }
html body #hr-widget .hotel-card .hotel-info__params-item svg { color:var(--booking-action) !important; }
html body #hr-widget .hotel-card .hotel-info__params-item svg path { stroke:var(--booking-action) !important; }
html body #hr-widget .hotel-card :is(.price-info__current-price,.price-info__day) { color:var(--booking-text) !important; }
html body :is(#hr-widget,#hr-modal) :is(.price-info__button,.hotel-detail__price-button,.form-submit) { height:50px !important; min-height:50px !important; }
html[data-theme="night"] body :is(#hr-widget,#hr-modal) :is(.price-info__button,.hotel-detail__price-button,.form-submit) svg path { stroke:var(--booking-action-text) !important; }

@media (max-width:600px) {
  /* Centre the fee explanation within the viewport instead of letting it
     extend past the right edge of its tariff card. */
  html body #hr-modal .tooltip {
    position:fixed !important;
    inset:50% auto auto 50% !important;
    transform:translate(-50%,-50%) !important;
    width:min(300px,calc(100vw - 32px)) !important;
    max-height:calc(100dvh - 32px);
    overflow:auto;
  }
}