/*
Theme Name: Breakdance Zero Theme
Theme URI: https://breakdance.com/zero-theme // todo
Author: Breakdance Builder
Author URI: https://breakdance.com/
Description: Entirely disables the WordPress theme system and lets you design every part of your site with Breakdance, while keeping other theme functionality like templates overrides and functions.php.
Version: 1.0.2
Tested up to: 5.9
Requires PHP: 7
License: GNU General Public License v2 or later // todo no idea about this
License URI: LICENSE
Text Domain: breakdance

Requires Breakdance to be installed.
/*--------------------------------------------------------------*/
.mt-0 {
    margin-top: 0 !important;
}
.mb-0 {
    margin-bottom: 0 !important;
}
.section-container.single-korterid-wrapper {
    padding-top: 104px !important;
}

.korterid-header {
    margin-top: 30px;
}


.breadcrumb {
    color: #808080;
    font-size: 12px;
    margin-bottom: 45px;
}
.breadcrumb a {
    color: #808080 !important;
}
.breadcrumb-separator {
    display: inline-block;
    padding: 0 10px;
}
.korterid-title {
    font-size: 52px;
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 26px;
    color: #000;
}
.korterid-featured-image {
    margin-bottom: 20px;
}

.korterid-featured-image img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.korterid-content.bde-columns {
    gap: 40px
}
.korterid-content.bde-columns .bde-column {
    display: block !important;
    width: calc(50% - 20px);
}
.korterid-info-grid .info-item {
    display: flex;
    gap: 50px;
    margin-bottom: 10px;
}
.korterid-info-grid .info-item strong {
    width: 120px;
}
.korterid-info-grid .info-item span {
    width: fit-content;
}
.info__price,
.info__price-content{
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid #EBDDD3;
}
.bde-column .info__price{
    margin-bottom: 40px;
}
.info__title {
    font-size: 20px !important;
}
.title-red {
    color: #BA5666 !important;
}
.info__price-content {
    display: flex;
    gap: 20px;
}
.info__price-additionalServices-btn {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}
.info__price-additionalServices-btn .btn {
    padding: 0 20px;
    height: 32px;
    font-size: 14px;
    line-height: 30px;
    background-color: #FDF3EC;
    border: 1px solid #FDF3EC;
    border-radius: 3px;
    box-sizing: border-box;
    cursor: pointer;
    transition: all 0.3s ease;
}
.info__price-additionalServices-btn .btn.btn-white,
.info__price-additionalServices-btn .btn:hover {
    border-color: #000;
}
.info__price-additionalServices-tabs .tabs__content .tab__content {
    display: none;
    width: 100%;
    padding-top: 20px;
}

.info__price-content-block {
    width: calc(50% - 10px);
}
.info__price-content-block p {
    font-weight: 700;
    margin: 0;
}
.info__price-content-block .configurator-total,
.info__price-content-block .configurator-extras-total {
    font-size: 42px;
    font-weight: 600;
}
#apartment-configurator  .form-check-input,
.breakdance-form-checkbox input {
   display: none !important;
}
#apartment-configurator .form-check {
    margin-bottom: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
#apartment-configurator .form-check label,
.breakdance-form-checkbox label {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 0 !important;
    cursor: pointer;
}
#apartment-configurator .form-check label sup {
    top: 3px;
    width: auto;
    display: inline-block;
    margin: 0 -8px;
}
#apartment-configurator .form-check.checkbox label:before,
.breakdance-form-checkbox label:before {
    content: '';
    width: 20px;
    height: 20px;
    background-color: #FDF3EC;
    border: 1px solid #C7A58D;
}
#apartment-configurator .form-check.checkbox label:after,
.breakdance-form-checkbox label:after {
    display: none;
    content: '\2713';
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    color: #000;
}
#apartment-configurator .form-check.checkbox input:checked + label:after,
.breakdance-form-checkbox input:checked + label:after {
    display: block;
}
#apartment-configurator .form-check.radio label:before {
    content: '';
    width: 20px;
    height: 20px;
    background-color: #FDF3EC;
    border: 1px solid #C7A58D;
    border-radius: 50%;
}
#apartment-configurator .form-check.radio label:after {
    display: none;
    content: '';
    position: absolute;
    top: 1px;
    left: 1px;
    width: 18px;
    height: 18px;
    background-color: #000;
    border: 4px solid #FDF3EC;
    border-radius: 18px;
}
#apartment-configurator .form-check.radio input:checked + label:after {
    display: block;
}
#apartment-configurator  .more-info{
    display: flex;    
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border: 1px solid #BA5666;
    border-radius: 20px;
}
#apartment-configurator  .more-info svg {
    width: 12px;
    height: auto;
}
.configuration-selections {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.configuration-selections .btn {
    height: 30px;
    padding: 0 10px;
    background-color: #fff;
    border: 1px solid #D3D3D3;
    border-radius: 3px;
    font-size: 12px;
    line-height: 28px;
}
.configuration-selections .btn:not(.not-removable) {
    position: relative;
    padding-right: 35px;
    cursor: pointer;
}
.configuration-selections .btn:not(.not-removable)::before,
.configuration-selections .btn:not(.not-removable)::after {
    content: '';
    display: block;
    position: absolute;
    top: 13px;
    right: 10px;
    width: 12px;
    height: 1px;
    background-color: #000;
    transform-origin: center;
}
.configuration-selections .btn:not(.not-removable)::before {
    transform: rotate(45deg);
}
.configuration-selections .btn:not(.not-removable)::after {
    transform: rotate(-45deg);
}
.apartment__gallery {
    display: flex;
    flex-direction: column;
    gap: 21px;
    max-width: 473px;
    width: 100%;
    margin-bottom: 44px;
}
.apartment__slider {
    position: relative;
}
.apartment__slider .slick-track {
    display: flex;
}
.apartment__slider .slick-slide {
    height: inherit;
}
.apartment__slider .slick-slide img {
    height: 100%;
    object-fit: cover;
    object-position: center center;
    overflow: hidden;
}
.apartment__slider .slick-slide.apartment-plan img {
    object-fit: contain;
}
.apartment__slider .slick-prev, 
.apartment__slider .slick-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 34px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.5);
    border: none;
    border-radius: 3px;
    cursor: pointer;
    z-index: 1;
}
.apartment__slider .slick-next {
    right: 0;
}
.apartment__slider .slick-prev {
    left: 0
}
.apartment__slider .slick-prev::after, 
.apartment__slider .slick-next::after {
    content: "";
    width: 16px;
    height: 26px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.apartment__slider .slick-prev::after {
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='26' viewBox='0 0 16 26' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.8143 2.20379L2.1875 13.0001L13.8143 23.7964' stroke='%23ffffff' stroke-width='2.94444' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.apartment__slider .slick-next::after {
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='26' viewBox='0 0 16 26' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.92693 23.7964L13.5537 13.0002L1.92693 2.20386' stroke='%23ffffff' stroke-width='2.94444' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.apartment__thumbnails .slick-slide {
    padding: 0 3.5px;
    cursor: pointer;
}
.apartment__thumbnails .slick-slide img {
    border: 1px solid #D3D3D3;
    border-radius: 3px;
    height: 63px;
    width: 100%;
    object-fit: cover;
    object-position: center center;
    overflow: hidden;
}
.apartment__thumbnails .slick-slide.apartment-plan img {
    object-fit: contain;
}
.plan-buttons-section {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    margin-top: 40px;
}
.button__red {
    background-color: #BA5666 !important;
    border: none !important;
    font-size: 14px !important;
}
.button-container {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
.modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 999999;
}
.modal.show {
    display: block;
}
.modal .container {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%;
}
.modal .modal-dialog {
    position: relative;
    width: 80%;
    max-width: 810px;
    background-color: #fff;
    padding: 40px;
}
.modal-close {
    position: absolute;
    top: 30px;
    right: 30px;
    background-color: transparent;
    border: none;
    cursor: pointer;
    z-index: 1;
}
.title-modal {
    font-size: 32px;
    margin-bottom: 32px;
}
.title-modal span {
    font-weight: 700;
}
.modal-content.apartment__content {
    display: flex;
    gap: 60px
}
.modal-content.apartment__content > * {
    width: calc(50% - 30px);
}
.modal-content.apartment__content .korterid-info-grid .info-item {
    margin-bottom: 5px;
}
.modal-content.apartment__content .info__price {
    margin-top: 30px;
    padding-top: 0;
    border-top: none;
}
.modal-content.apartment__content .info__price-content {
    margin-top: 0;
    border-top: none;
}
.modal-content.apartment__content .info__price-content-block .configurator-total, 
.modal-content.apartment__content .info__price-content-block .configurator-extras-total {
    font-size: 32px;
    font-weight: 400;
}
.fancybox__container {
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}
.fancybox__backdrop {
    background-color: rgba(0, 0, 0, 0.5);
}
@media (max-width: 820px) {
    .korterid-content.bde-columns {
        flex-direction: column-reverse !important;
    }
    .korterid-content.bde-columns .bde-column {
        width: 100%;
    }
    .apartment__gallery {
        max-width: calc(100vw - 40px) !important;
    }
    .plan-buttons-section {
        flex-direction: row;
        flex-wrap: wrap;
    }
}
