/* /bitrix/templates/bs_hotel_s1/dusha/catalog-busy.css
 * Бейдж «Занято на эти даты» — inline в overline-строке карточки.
 * Подключается на /catalog/ из catalog_hotel/news.php.
 * Соответствует памяти design_promo_coupon.md (амбер-палитра CTA).
 */

/* Дим карточки — общий для двух случаев:
   1) занята на запрошенные даты (.is-busy-on-dates)
   2) не подходит под фильтр (.is-dimmed-by-filter)
   На hover карточка возвращается в норму — клик на детали возможен. */
.dusha-catalog__card.is-busy-on-dates,
.dusha-catalog__card.is-dimmed-by-filter {
    position: relative;
    transition: opacity 200ms ease, filter 200ms ease;
}
.dusha-catalog__card.is-busy-on-dates .dusha-catalog__card-photo,
.dusha-catalog__card.is-dimmed-by-filter .dusha-catalog__card-photo {
    opacity: 0.42;
    filter: grayscale(80%) brightness(1.05);
    transition: opacity 200ms ease, filter 200ms ease;
}
.dusha-catalog__card.is-busy-on-dates .dusha-catalog__card-body,
.dusha-catalog__card.is-dimmed-by-filter .dusha-catalog__card-body {
    opacity: 0.62;
    transition: opacity 200ms ease;
}
/* Полупрозрачный белый overlay поверх всей карточки — ясное "выключенное" состояние. */
.dusha-catalog__card.is-busy-on-dates::after,
.dusha-catalog__card.is-dimmed-by-filter::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.30);
    pointer-events: none;
    z-index: 2;
    border-radius: inherit;
    transition: opacity 200ms ease;
    opacity: 1;
}
.dusha-catalog__card.is-busy-on-dates:hover::after,
.dusha-catalog__card.is-dimmed-by-filter:hover::after { opacity: 0; }
.dusha-catalog__card.is-busy-on-dates:hover .dusha-catalog__card-photo,
.dusha-catalog__card.is-dimmed-by-filter:hover .dusha-catalog__card-photo {
    opacity: 1;
    filter: grayscale(0) brightness(1);
}
.dusha-catalog__card.is-busy-on-dates:hover .dusha-catalog__card-body,
.dusha-catalog__card.is-dimmed-by-filter:hover .dusha-catalog__card-body {
    opacity: 1;
}

/* Индикатор AJAX-загрузки списка (при ручной смене дат). */
.dusha-catalog__listing.is-loading {
    position: relative;
    pointer-events: none;
}
.dusha-catalog__listing.is-loading::after {
    content: '';
    position: absolute; inset: 0;
    background: rgba(255, 255, 255, 0.55);
    z-index: 5;
    backdrop-filter: blur(1px);
    transition: opacity 150ms ease;
}

/* Overline становится flex-row, чтобы бейдж встал справа от текста «Апартаменты · Калининград». */
.dusha-catalog__card-overline {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
.dusha-catalog__card-overline-text {
    /* Текст по умолчанию забирает ширину, но не перекрывает бейдж. */
    flex: 0 1 auto;
    min-width: 0;
}

/* Сам бейдж — компактный chip, амбер-выделенный. */
.apt-busy-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--amber-500, #F57C18);
    color: #fff;
    font-family: var(--font-body, 'Manrope', system-ui, sans-serif);
    font-size: 10px; font-weight: 800;
    text-transform: uppercase; letter-spacing: 0.04em;
    line-height: 1.15;
    padding: 3px 8px 3px 6px;
    border-radius: 999px;
    white-space: nowrap;
    box-shadow: 0 2px 6px rgba(245, 124, 24, 0.28);
    flex-shrink: 0;
}
.apt-busy-badge__icon {
    display: inline-flex;
    align-items: center; justify-content: center;
    flex-shrink: 0;
    margin-top: -1px; /* визуально центрировать иконку часов с текстом */
}

@media (max-width: 540px) {
    .apt-busy-badge { font-size: 9.5px; padding: 2px 7px 2px 5px; }
}