/* Избранное */

.btn-favorite {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    padding: 0;
    border: none;
    border-radius: var(--radius-full);
    background: var(--white-alpha-92);
    color: var(--primary-on-light);
    box-shadow: var(--elev-2);
    cursor: pointer;
    transition: transform var(--motion-base) var(--ease-standard),
                color var(--motion-base) var(--ease-standard),
                background var(--motion-base) var(--ease-standard);
    position: relative;
    z-index: calc(var(--z-overlay) + 1);
}

.btn-favorite-sm {
    width: 2.25rem;
    height: 2.25rem;
    font-size: 0.9rem;
}

@media (hover: hover) {
    .btn-favorite:hover {
        transform: scale(1.06);
        color: var(--heart-color-hover);
    }
}

.btn-favorite.is-favorite,
.btn-favorite.is-favorite:hover {
    color: var(--heart-color);
}

.btn-favorite.is-favorite .btn-favorite-icon {
    font-weight: 900;
}

.btn-favorite:focus-visible {
    outline: var(--focus-ring-width) solid var(--focus-ring-color-accent);
    outline-offset: var(--focus-ring-offset);
}

.page-header-favorite-wrap {
    position: absolute;
    top: 1rem;
    right: 1rem;
    left: auto;
    bottom: auto;
    z-index: var(--z-overlay);
    pointer-events: none;
}

.page-header-favorite-wrap .btn-favorite {
    pointer-events: auto;
}

/* Детальная отеля/номера: кнопка в потоке под заголовком */
.page-header-favorite-wrap--prominent {
    position: relative;
    top: auto;
    right: auto;
    margin-top: 0;
    pointer-events: auto;
}

.btn-favorite-page-header {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-3);
    width: auto;
    min-width: 10.5rem;
    height: auto;
    min-height: 2.85rem;
    padding: 0.55rem 1.25rem;
    border-radius: var(--radius-pill);
    font-size: 0.95rem;
    font-weight: var(--font-weight-semibold);
    line-height: 1.2;
    color: var(--heart-color);
    background: var(--white-alpha-96);
    border: 2px solid var(--white-alpha-95);
    box-shadow: 0 4px 18px var(--black-alpha-25);
    transition: color var(--motion-base) var(--ease-standard),
                background var(--motion-base) var(--ease-standard),
                transform var(--motion-base) var(--ease-standard);
}

@media (hover: hover) {
    .btn-favorite-page-header:hover {
        color: var(--heart-color-hover);
        background: var(--white);
        transform: translateY(-1px) scale(1.02);
    }
}

.btn-favorite-page-header.is-favorite,
.btn-favorite-page-header.is-favorite:hover {
    color: var(--white);
    background: var(--heart-color);
    border-color: var(--heart-color);
}

.btn-favorite-page-header .btn-favorite-icon {
    font-size: 1.05rem;
}

.btn-favorite-page-header .btn-favorite-label {
    white-space: nowrap;
}

.hotel-card-image,
.room-card-image,
.hotel-card-horizontal-image,
.recent-view-card-image {
    position: relative;
}

.hotel-card-image .btn-favorite,
.room-card-image .btn-favorite,
.hotel-card-horizontal-image .btn-favorite,
.recent-view-card-image .btn-favorite,
.favorites-page-card .recent-view-card-image .btn-favorite {
    position: absolute;
    top: var(--space-3);
    right: var(--space-3);
    left: auto;
    z-index: calc(var(--z-overlay) + 1);
    pointer-events: auto;
    width: 2.4rem;
    height: 2.4rem;
    color: var(--heart-color);
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
    text-shadow: 0 2px 8px var(--black-alpha-25), 0 0 1px var(--white-alpha-70);
    transition: color var(--motion-base) var(--ease-standard),
                text-shadow var(--motion-base) var(--ease-standard),
                transform var(--motion-base) var(--ease-standard);
}

@media (hover: hover) {
    .hotel-card-image .btn-favorite:hover,
    .room-card-image .btn-favorite:hover,
    .hotel-card-horizontal-image .btn-favorite:hover,
    .recent-view-card-image .btn-favorite:hover,
    .favorites-page-card .recent-view-card-image .btn-favorite:hover {
        color: var(--heart-color-hover);
        background: transparent;
        box-shadow: none;
        text-shadow: 0 3px 10px var(--black-alpha-30), 0 0 1px var(--white-alpha-85);
        transform: scale(1.1);
    }
}

.hotel-card-image .btn-favorite .btn-favorite-icon,
.room-card-image .btn-favorite .btn-favorite-icon,
.hotel-card-horizontal-image .btn-favorite .btn-favorite-icon,
.recent-view-card-image .btn-favorite .btn-favorite-icon,
.favorites-page-card .recent-view-card-image .btn-favorite .btn-favorite-icon {
    font-size: 1.25rem;
}

/* Рейтинг — не перекрывать сердце в правом верхнем углу */
.hotel-card-image:has(.btn-favorite) .hotel-card-badge,
.hotel-card-horizontal-image:has(.btn-favorite) .hotel-card-badge {
    top: auto;
    bottom: var(--space-4);
    right: var(--space-4);
}

/* Размер и позиция ссылки на фото — card-catalog-shared.css */

.hotel-card-body-link {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
    color: inherit;
    text-decoration: none;
}

.hotel-card-body-link:hover {
    color: inherit;
}

/* Размер и позиция ссылки на фото — card-catalog-shared.css */

.nav-item-favorites .nav-link-favorites {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    color: var(--heart-color);
    transition: color var(--motion-base) var(--ease-standard),
                transform var(--motion-base) var(--ease-standard);
}

.nav-item-favorites .nav-link-favorites .nav-favorites-icon {
    display: block;
    color: inherit;
    font-size: 1.05rem;
    line-height: 1;
    transition: color var(--motion-base) var(--ease-standard), transform var(--motion-base) var(--ease-standard);
}

/* Десктоп: ♥ по вертикали с текстовыми пунктами (inline-flex не заполнял stretch у .nav-item) */
@media (min-width: 992px) {
    #mainNav .navbar-nav .nav-item-favorites {
        display: flex;
        align-items: center;
    }
}

/* Сердце в шапке — красное, не наследует --nav-link-color / --secondary-color */
#mainNav.navbar .navbar-nav .nav-link.nav-link-favorites,
#mainNav.navbar.scrolled .navbar-nav .nav-link.nav-link-favorites {
    color: var(--heart-color);
}

@media (hover: hover) {
    #mainNav.navbar .navbar-nav .nav-link.nav-link-favorites:hover,
    #mainNav.navbar.scrolled .navbar-nav .nav-link.nav-link-favorites:hover {
        color: var(--heart-color-hover);
    }

    #mainNav.navbar .navbar-nav .nav-link.nav-link-favorites:hover .nav-favorites-icon,
    #mainNav.navbar.scrolled .navbar-nav .nav-link.nav-link-favorites:hover .nav-favorites-icon {
        transform: scale(1.12);
    }
}

#mainNav.navbar .navbar-nav .nav-link.nav-link-favorites.active,
#mainNav.navbar.scrolled .navbar-nav .nav-link.nav-link-favorites.active {
    color: var(--heart-color-hover);
}

/* Есть сохранённые объекты — насыщеннее, заливка через .fas в JS */
#mainNav.navbar .navbar-nav .nav-link.nav-link-favorites.has-favorites,
#mainNav.navbar.scrolled .navbar-nav .nav-link.nav-link-favorites.has-favorites {
    color: var(--heart-color);
}

@media (hover: hover) {
    #mainNav.navbar .navbar-nav .nav-link.nav-link-favorites.has-favorites:hover,
    #mainNav.navbar.scrolled .navbar-nav .nav-link.nav-link-favorites.has-favorites:hover {
        color: var(--heart-color-hover);
    }
}

.nav-item-favorites .nav-link-favorites::before {
    background: var(--heart-color);
    box-shadow: none;
}

.nav-item-favorites .nav-link-favorites.has-favorites::before {
    width: 50%;
}

.nav-favorites-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.15rem;
    height: 1.15rem;
    padding: 0 0.3rem;
    font-size: 0.65rem;
    font-weight: var(--font-weight-bold);
    line-height: 1;
    border-radius: var(--radius-pill);
    background: var(--heart-color);
    color: var(--white);
}

.nav-favorites-badge[hidden] {
    display: none !important;
}

.favorites-page-hint {
    font-size: 0.9rem;
    color: var(--text-muted);
}

.favorites-page-card {
    position: relative;
}

.favorites-page .recent-views-track,
.favorites-page .favorites-page-track {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 1.25rem;
}

@media (max-width: 767.98px) {
    .btn-favorite-page-header {
        min-width: 0;
        padding: 0.5rem 1rem;
        font-size: 0.9rem;
        min-height: 2.65rem;
    }
}

@media (max-width: 575.98px) {
    .page-header-favorite-wrap:not(.page-header-favorite-wrap--prominent) {
        top: calc(4.25rem + env(safe-area-inset-top, 0px));
        right: 0.75rem;
    }

    .btn-favorite-page-header .btn-favorite-label {
        max-width: 60vw;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}