/*
Theme Name: Kolibri WordPress Elementor Theme
Theme URI: https://wielands.nl/wordpress-plugin-koppeling-met-kolibri/
Description: Child thema met alleen noodzakelijkse css voor de Kolibri WordPress plugin
Author: Wielands
Author URI: https://wielands.nl
Template: hello-elementor
Version: 1.0.1
Text Domain: kb-elementor-theme
*/

/* Map Single House Post
 * ---------------------------------------------------------- */
.kb-object-map-inner,
.kb-object-streetview-inner {
    height: 380px;
}

/* Map
 * ---------------------------------------------------------- */
.kb-map-houses-wrapper {
    position: relative;
}

.kb-map-houses {
    width: 100%;
    height: 700px;
    margin-top: 15px;
}
.kb-map-houses .kb-cookie-placeholder {
    height: 100% !important;
    background: #fef3ea !important;
}
@media (max-width: 1000px) {
    .kb-map-houses {
        height: 65vh;
    }
}

.kb-map-popup {
    --close-btn-width: 36px;
    --accent-color: #114459;
    --close-bg-color: #114459;
    --close-bg-color-hover: #FF8D00;
    background: #fff;
    display: flex;
    position: absolute;
    bottom: 20px;
    margin: 0 auto;
    max-width: 600px;
    left: 0;
    right: 0;
    box-sizing: border-box;
    align-items: center;
    border-radius: 4px;
}
.kb-map-popup--hide {
    display: none;
}
.kb-map-popup__close {
    position: absolute;
    right: -10px;
    top: -10px;
    width: var(--close-btn-width);
    height: var(--close-btn-width);
    line-height: var(--close-btn-width);
    border-radius: var(--close-btn-width);
    color: #fff;
    background: var(--close-bg-color);
    text-align: center;
    font-size: 1.1rem;
    cursor: pointer;
    border: 0 !important;
    padding: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
}
.kb-map-popup__close img {
    width: 14px;
    flex-shrink: 0;
}
.kb-map-popup__close:hover {
    background: var(--close-bg-color-hover);
}
.kb-map-popup__image {
    position: relative;
    min-width: 150px;
    overflow: hidden;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
}
.kb-map-popup__image a {
    display: block;
    width: 150px;
}
.kb-map-popup__image a img {
    width: 100%;
    height: auto;
    display: block;
}
.kb-map-popup__status {
    position: absolute;
    bottom: 0;
    left: 0;
    text-align: center;
    padding: 4px 8px;
    background: var(--accent-color);
    color: #fff;
    font-size: 12px;
}
.kb-map-popup__info {
    padding: 10px 20px;
}
.kb-map-popup__title {
    color: var(--accent-color);
    font-weight: 600;
    margin: 0;
    line-height: 1;
    font-size: 22px;
}
.kb-map-popup__title a {
    text-decoration: none;
}
.kb-map-popup__city {
    margin: 0 0 5px 0;
}
.kb-map-popup__price {
    padding: 0 0 5px 0;
    color: var(--accent-color);
}
.kb-map-popup__meters {
    font-size: 12px;
}

.house-status-BESCHIKBAAR {
    display: none;
}

/* House properties
 * ---------------------------------------------------------- */
.kb-object-features-list {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: var(--e-global-typography-text-font-size);
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.kb-object-features-list li {
    display: flex;
    gap: 10px;
    border-bottom: 1px solid #4f4f4f61;
}
.kb-object-features-list li .kb-object-list-label {
    width: 40%;
    flex-shrink: 0;
    display: block;
}
.kb-object-features-list li .kb-object-list-value {
    display: block;
}
@media (max-width: 767px) {
    .kb-object-features-list li {
        flex-direction: column;
        gap: 5px;
    }
    .kb-object-features-list li .kb-object-list-label {
        color: #686868;
    }
}

/* Read more
 * ---------------------------------------------------------- */
.read-more {
    --accent-color: #C09A5E;
    --accent-color-hover: #007D32;
    position: relative;
    padding-bottom: 30px;
}
.read-more__btn {
    position: absolute;
    bottom: 0;
    z-index: 1;
    color: var(--accent-color);
    padding: 0;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
}
.read-more__btn::before {
    transition: all 0.2s ease-in-out;
    content: "";
    width: 14px;
    height: 14px;
    background-image: url("assets/images/icon-minus.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    display: inline-block;
    margin-right: 10px;
    flex-shrink: 0;
}
.read-more__btn:focus-visible {
    color: var(--accent-color-hover);
}
.read-more__btn:hover {
    color: var(--accent-color-hover);
}
.read-more--active.read-more--small .read-more__inner {
    height: 160px;
}
.read-more--active .read-more__inner {
    height: 240px;
    overflow: hidden;
}
.read-more--active .read-more__btn::before {
    background-image: url("assets/images/icon-plus.svg");
}
.read-more--active::after {
    content: "";
    display: block;
    height: 140px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}

.kb-alert {
    padding: 15px;
}
.kb-alert--info {
    background: #fff5cb;
}