:root {
    --color-extra: #B6B5B5;
    --color-brand: #D70055;
}
.afavorites-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 16px;
}

.afav-card {
    border: 1px solid #eee;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
    transition: transform 0.15s ease;
}

.afav-card:hover {
    transform: translateY(-2px);
}

.afav-card img {
    width: 100%;
    height: 140px;
    object-fit: cover;
}

.afav-card h3 {
    font-size: 15px;
    padding: 10px;
    margin: 0;
}

.unit-card__title-row {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
}

.unit-card__title-row .unit-card__title {
    flex: 1;
}

.unit-card__title-row .add-to-favourite {
    flex: 0 0 auto;
    margin-top: 0.1rem;
}

.unit-card__title-row .add-to-favourite svg {
    height: 1.375rem;
    width: 1.575rem;
}

.add-to-favourite,
.afav-header-link {
    align-items: center;
    display: inline-flex;
    gap: 8px;
    text-decoration: none;
}

.add-to-favourite {
    background: transparent;
    border: 0;
    cursor: pointer;
    padding: 0;
}

.apartment__address .add-to-favourite svg {
    height: 30px;
    width: 40px;
    fill: none;
    stroke: none;
}
.add-to-favourite svg path {
    fill: none;
    stroke: var(--color-extra);
    stroke-width: 30px;
}
.afav-header-link svg path {
    fill: none;
    stroke: var(--color-brand);
    stroke-width: 30px;
}
.add-to-favourite.is-favourite svg path,
.afav-header-link.has-favourites svg path {
    fill: var(--color-brand);
    stroke: var(--color-brand);
    stroke-width: 30px;
}

.afav-icon,
.afav-header-heart {
    /* background: center / contain no-repeat url('../img/heart.svg'); */
    /* -webkit-mask-image: url(data:image/svg+xml,<svg viewBox="0 -28 512.001 512" xmlns="http://www.w3.org/2000/svg"><path d="m256 455.515625c-7.289062 0-14.316406-2.640625-19.792969-7.4375-20.683593-18.085937-40.625-35.082031-58.21875-50.074219l-.089843-.078125c-51.582032-43.957031-96.125-81.917969-127.117188-119.3125-34.644531-41.804687-50.78125-81.441406-50.78125-124.742187 0-42.070313 14.425781-80.882813 40.617188-109.292969 26.503906-28.746094 62.871093-44.578125 102.414062-44.578125 29.554688 0 56.621094 9.34375 80.445312 27.769531 12.023438 9.300781 22.921876 20.683594 32.523438 33.960938 9.605469-13.277344 20.5-24.660157 32.527344-33.960938 23.824218-18.425781 50.890625-27.769531 80.445312-27.769531 39.539063 0 75.910156 15.832031 102.414063 44.578125 26.191406 28.410156 40.613281 67.222656 40.613281 109.292969 0 43.300781-16.132812 82.9375-50.777344 124.738281-30.992187 37.398437-75.53125 75.355469-127.105468 119.308594-17.625 15.015625-37.597657 32.039062-58.328126 50.167969-5.472656 4.789062-12.503906 7.429687-19.789062 7.429687zm-112.96875-425.523437c-31.066406 0-59.605469 12.398437-80.367188 34.914062-21.070312 22.855469-32.675781 54.449219-32.675781 88.964844 0 36.417968 13.535157 68.988281 43.882813 105.605468 29.332031 35.394532 72.960937 72.574219 123.476562 115.625l.09375.078126c17.660156 15.050781 37.679688 32.113281 58.515625 50.332031 20.960938-18.253907 41.011719-35.34375 58.707031-50.417969 50.511719-43.050781 94.136719-80.222656 123.46875-115.617188 30.34375-36.617187 43.878907-69.1875 43.878907-105.605468 0-34.515625-11.605469-66.109375-32.675781-88.964844-20.757813-22.515625-49.300782-34.914062-80.363282-34.914062-22.757812 0-43.652344 7.234374-62.101562 21.5-16.441406 12.71875-27.894532 28.796874-34.609375 40.046874-3.453125 5.785157-9.53125 9.238282-16.261719 9.238282s-12.808594-3.453125-16.261719-9.238282c-6.710937-11.25-18.164062-27.328124-34.609375-40.046874-18.449218-14.265626-39.34375-21.5-62.097656-21.5zm0 0"/></svg>);
    mask-image: url(data:image/svg+xml,<svg viewBox="0 -28 512.001 512" xmlns="http://www.w3.org/2000/svg"><path d="m256 455.515625c-7.289062 0-14.316406-2.640625-19.792969-7.4375-20.683593-18.085937-40.625-35.082031-58.21875-50.074219l-.089843-.078125c-51.582032-43.957031-96.125-81.917969-127.117188-119.3125-34.644531-41.804687-50.78125-81.441406-50.78125-124.742187 0-42.070313 14.425781-80.882813 40.617188-109.292969 26.503906-28.746094 62.871093-44.578125 102.414062-44.578125 29.554688 0 56.621094 9.34375 80.445312 27.769531 12.023438 9.300781 22.921876 20.683594 32.523438 33.960938 9.605469-13.277344 20.5-24.660157 32.527344-33.960938 23.824218-18.425781 50.890625-27.769531 80.445312-27.769531 39.539063 0 75.910156 15.832031 102.414063 44.578125 26.191406 28.410156 40.613281 67.222656 40.613281 109.292969 0 43.300781-16.132812 82.9375-50.777344 124.738281-30.992187 37.398437-75.53125 75.355469-127.105468 119.308594-17.625 15.015625-37.597657 32.039062-58.328126 50.167969-5.472656 4.789062-12.503906 7.429687-19.789062 7.429687zm-112.96875-425.523437c-31.066406 0-59.605469 12.398437-80.367188 34.914062-21.070312 22.855469-32.675781 54.449219-32.675781 88.964844 0 36.417968 13.535157 68.988281 43.882813 105.605468 29.332031 35.394532 72.960937 72.574219 123.476562 115.625l.09375.078126c17.660156 15.050781 37.679688 32.113281 58.515625 50.332031 20.960938-18.253907 41.011719-35.34375 58.707031-50.417969 50.511719-43.050781 94.136719-80.222656 123.46875-115.617188 30.34375-36.617187 43.878907-69.1875 43.878907-105.605468 0-34.515625-11.605469-66.109375-32.675781-88.964844-20.757813-22.515625-49.300782-34.914062-80.363282-34.914062-22.757812 0-43.652344 7.234374-62.101562 21.5-16.441406 12.71875-27.894532 28.796874-34.609375 40.046874-3.453125 5.785157-9.53125 9.238282-16.261719 9.238282s-12.808594-3.453125-16.261719-9.238282c-6.710937-11.25-18.164062-27.328124-34.609375-40.046874-18.449218-14.265626-39.34375-21.5-62.097656-21.5zm0 0"/></svg>); */
    display: inline-block;
    flex: 0 0 auto;
    height: 22px;
    width: 22px;
}
.afav-icon {
    background-color: var(--color-extra);
}
/* .afav-header-heart {
    background-color: var(--color-brand);
} */
.afav-header-link {
    display: flex;
    position: relative;
    text-align: center;
    align-items: center;
    justify-content: center;
}
.afav-header-link .afav-header-heart {
    height: 35px;
    width: 45px;
}
.afav-header-link .afav-header-heart svg {
    height: 100%;
    width: 100%;
}
/* .afav-header-link.has-favourites .afav-header-heart {
    background: var(--color-brand);
} */
.add-to-favourite.is-favourite .afav-icon,
.afav-header-link.has-favourites .afav-header-heart {
    /* background-image: url('../img/heart-filled.svg'); */
    /* -webkit-mask-image: url('data:image/svg+xml,<svg id="Capa_1" enable-background="new 0 0 512.001 512.001" height="512" viewBox="0 0 512.001 512.001" width="512" xmlns="http://www.w3.org/2000/svg"><path d="m256.001 477.407c-2.59 0-5.179-.669-7.499-2.009-2.52-1.454-62.391-36.216-123.121-88.594-35.994-31.043-64.726-61.833-85.396-91.513-26.748-38.406-40.199-75.348-39.982-109.801.254-40.09 14.613-77.792 40.435-106.162 26.258-28.848 61.3-44.734 98.673-44.734 47.897 0 91.688 26.83 116.891 69.332 25.203-42.501 68.994-69.332 116.891-69.332 35.308 0 68.995 14.334 94.859 40.362 28.384 28.563 44.511 68.921 44.247 110.724-.218 34.393-13.921 71.279-40.728 109.632-20.734 29.665-49.426 60.441-85.279 91.475-60.508 52.373-119.949 87.134-122.45 88.588-2.331 1.354-4.937 2.032-7.541 2.032z"/></svg>');
    mask-image: url('data:image/svg+xml,<svg id="Capa_1" enable-background="new 0 0 512.001 512.001" height="512" viewBox="0 0 512.001 512.001" width="512" xmlns="http://www.w3.org/2000/svg"><path d="m256.001 477.407c-2.59 0-5.179-.669-7.499-2.009-2.52-1.454-62.391-36.216-123.121-88.594-35.994-31.043-64.726-61.833-85.396-91.513-26.748-38.406-40.199-75.348-39.982-109.801.254-40.09 14.613-77.792 40.435-106.162 26.258-28.848 61.3-44.734 98.673-44.734 47.897 0 91.688 26.83 116.891 69.332 25.203-42.501 68.994-69.332 116.891-69.332 35.308 0 68.995 14.334 94.859 40.362 28.384 28.563 44.511 68.921 44.247 110.724-.218 34.393-13.921 71.279-40.728 109.632-20.734 29.665-49.426 60.441-85.279 91.475-60.508 52.373-119.949 87.134-122.45 88.588-2.331 1.354-4.937 2.032-7.541 2.032z"/></svg>');
    background-color: var(--color-brand); */
}

.afav-header-count {
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    min-height: 18px;
    min-width: 18px;
    padding: 3px 5px;
    position: absolute;
    left: 0px;
    right: 0;
    z-index: 111;
    background: none;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    display: none;
}
.afav-header-link.has-favourites .afav-header-count {
    display: flex;
}

.favourites__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 15px;
    flex-direction: column;
}
.favourites__header h1 {
    color: var(--color-brand);
    font-size: clamp(1.80rem, 1.49rem - -1.56vw, 2.85rem);
}
.favourites__header .breakdance-link {

}
@media (min-width: 768px) {
    .favourites__header {
        flex-direction: row;
    } 
}