@charset "UTF-8";

.room-list-card,
.interest-room-card{
    position:relative;
}

.room-card-favorite,
.room-favorite-button,
.room-interest-map-favorite{
    display:grid;
    place-items:center;
    border:1px solid rgba(220,225,235,.96);
    border-radius:50%;
    color:#667085;
    background:rgba(255,255,255,.96);
    box-shadow:0 5px 15px rgba(24,35,70,.13);
    font-family:Arial,sans-serif;
    font-weight:700;
    line-height:1;
    cursor:pointer;
    transition:
        transform .16s ease,
        color .16s ease,
        background .16s ease,
        opacity .16s ease;
}

.room-card-favorite{
    position:absolute;
    z-index:6;
    top:11px;
    right:11px;
    width:36px;
    height:36px;
    font-size:21px;
}

.room-favorite-button{
    width:44px!important;
    height:44px!important;
    flex:0 0 auto;
    font-size:25px!important;
}

.room-interest-map-favorite{
    pointer-events:auto!important;
    border:1px solid rgba(220,225,235,.96)!important;
    color:#667085!important;
    font-size:17px!important;
    cursor:pointer!important;
}

.room-card-favorite:hover,
.room-favorite-button:hover,
.room-interest-map-favorite:hover{
    transform:scale(1.07);
}

.room-card-favorite.is-favorited,
.room-favorite-button.is-favorited,
.room-interest-map-favorite.is-favorited{
    color:#fff!important;
    border-color:#ef4e68!important;
    background:#ef4e68!important;
}

.room-card-favorite.is-loading,
.room-favorite-button.is-loading,
.room-interest-map-favorite.is-loading{
    opacity:.55;
    cursor:wait!important;
}

.interest-toast{
    position:fixed;
    z-index:5000;
    left:50%;
    bottom:88px;
    max-width:calc(100vw - 30px);
    padding:11px 16px;
    border-radius:999px;
    color:#fff;
    background:rgba(25,31,44,.94);
    box-shadow:0 10px 30px rgba(20,28,50,.24);
    font-size:12px;
    font-weight:700;
    opacity:0;
    transform:translate(-50%,12px);
    pointer-events:none;
    transition:opacity .18s ease,transform .18s ease;
}

.interest-toast.is-visible{
    opacity:1;
    transform:translate(-50%,0);
}

.interest-list-page{
    min-height:calc(100vh - 70px);
    padding:42px 0 70px;
    background:#f7f8fb;
}

.interest-page-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:18px;
    margin-bottom:22px;
}

.interest-page-heading p{
    margin:0 0 6px;
    color:#5b5bd6;
    font-size:11px;
    font-weight:900;
    letter-spacing:.13em;
}

.interest-page-heading h1{
    margin:0;
    font-size:30px;
}

.interest-page-heading span{
    display:block;
    margin-top:8px;
    color:#747d8b;
    font-size:12px;
}

.interest-page-heading>strong{
    color:#5b5bd6;
    font-size:18px;
}

.interest-room-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
}

.interest-room-card{
    min-width:0;
    overflow:hidden;
    border:1px solid #e1e5ed;
    border-radius:16px;
    background:#fff;
    box-shadow:0 8px 24px rgba(24,36,72,.06);
    transition:opacity .18s ease,transform .18s ease;
}

.interest-room-card.is-removing{
    opacity:0;
    transform:scale(.97);
}

.interest-room-card__image{
    position:relative;
    aspect-ratio:16/10;
    overflow:hidden;
    background:#edf1f6;
}

.interest-room-card__image img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.interest-room-card__image>span{
    position:absolute;
    left:11px;
    bottom:10px;
    padding:5px 8px;
    border-radius:999px;
    color:#fff;
    background:rgba(26,33,47,.78);
    font-size:9px;
    font-weight:800;
}

.interest-room-card__body{
    padding:14px;
}

.interest-room-card__body>p{
    margin:0;
    color:#6d7685;
    font-size:10px;
}

.interest-room-card__body h2{
    min-height:40px;
    margin:6px 0 0;
    color:#202632;
    font-size:15px;
    line-height:1.4;
}

.interest-room-card__body>small{
    display:block;
    margin-top:5px;
    overflow:hidden;
    color:#858d9b;
    font-size:10px;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.interest-room-card__tags{
    display:flex;
    min-height:25px;
    gap:5px;
    margin-top:11px;
    overflow:hidden;
}

.interest-room-card__tags span{
    flex:0 0 auto;
    padding:4px 7px;
    border-radius:6px;
    color:#5c6573;
    background:#f1f3f7;
    font-size:9px;
    font-weight:700;
    white-space:nowrap;
}

.interest-room-card__price{
    display:flex;
    align-items:flex-end;
    gap:3px;
    margin-top:13px;
}

.interest-room-card__price strong{
    font-size:17px;
}

.interest-room-card__price span{
    padding-bottom:2px;
    color:#5b5bd6;
    font-size:10px;
    font-weight:800;
}

.interest-empty{
    padding:65px 20px;
    border:1px solid #e1e5ed;
    border-radius:16px;
    background:#fff;
    text-align:center;
}

.interest-empty strong{
    font-size:17px;
}

.interest-empty p{
    margin:8px 0 0;
    color:#78818f;
    font-size:12px;
}

.interest-empty a{
    display:inline-flex;
    min-height:42px;
    align-items:center;
    justify-content:center;
    margin-top:17px;
    padding:0 17px;
    border-radius:9px;
    color:#fff;
    background:#5b5bd6;
    font-size:12px;
    font-weight:800;
}

.interest-pagination{
    margin-top:24px;
}

@media(max-width:1000px){
    .interest-room-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:650px){
    .interest-list-page{
        padding:28px 0 84px;
    }

    .interest-page-heading{
        align-items:flex-start;
    }

    .interest-page-heading h1{
        font-size:25px;
    }

    .interest-room-grid{
        grid-template-columns:1fr;
    }

    .room-card-favorite{
        width:34px;
        height:34px;
        font-size:20px;
    }
}