@import url("variables-FUA05D-.css");

@import url("../../estate-pagination-11FG774.css");
@import url("sections-JibFsmb.css");
@import url("estate-filter-p7QO7Js.css");
@import url("estate-demand-aZxqe5v.css");
@import url("../../elements-dl5f-vu.css");
@import url("../../estate-gallery-4RTEWbJ.css");
@import url("../../estate-map-8f3vFkV.css");
@import url("../../info-table-3-N4UDZ.css");
@import url("../../development-project-IYsmMeY.css");
@import url("../../estate-archive-tXigkzP.css");

* {
    box-sizing: border-box;
}

html {
    padding: 0;
    width: 100%;
}

body {
    font-family: var(--font-primary);
}

form {
    select, input {
        font-family: var(--font-primary);
    }
}

.container {
    max-width: 1060px;
    margin: auto;
}

.h1 {
    font-family: var(--font-primary);
    font-size: 28px;
    font-weight: 500;
    line-height: 35px;
    margin: 0 0 17px;
}
.h2 {
    font-family: var(--font-primary);
    font-size: 25px;
    font-weight: 700;
    line-height: 32px;
    margin: 0 0 15px;
}
.h3 {
    font-family: var(--font-primary);
    font-size: 23px;
    line-height: 26px;
    font-weight: 700;
    margin: 0 0 12px;
}

main {
    .container.base-container {
        padding: 0 10px;
    }
}

main {
    .content-wrapper__homepage {
        display: flex;
        flex-direction: column;
        gap: 25px;
    }
}

#content {
    margin-bottom: 40px;
}

.breadcrumbs {
    color: var(--link-green);
    font-size: 14px;
    line-height: 1.5em;
    margin: 10px 0 20px;
    font-weight: 600;
    a {
        color: var(--link-green);
        text-decoration: none;
        &:hover {
            color: var(--link-green-hover);
            text-decoration: underline;
        }
    }
    .--separator {
        font-weight: 500;
    }
    .--last {
        font-weight: 500;
    }
}

.btn {
    display: inline-block;
    font-family: var(--font-primary);
    padding: 10px 15px;
    background-color: #999999;
    border-radius: 8px;
    color: var(--btn-std-text);
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    transition: all .2s ease;
    &.btn-std {
        background-color: var(--btn-std);
        &:hover {
            background-color: var(--btn-std-hover);
            color: var(--btn-std-text-hover);
        }
    }
    &.w-100 {
        width: 100%;
    }
}

button.btn {
    border: none;
}

.container-side-menu {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 16px;
    margin-bottom: 25px;
    .container-list-options {
        grid-column: span 12/auto;
        display: flex;
        align-items: center;
        justify-content: space-between;
        .ms-parent {
            width: 190px;
            font-size: 1em;
            .ms-choice {
                font-size: 1em;
                font-weight: 700;
                font-family: var(--font-primary);
            }
        }
        .list-view-switcher {
            a {
                text-decoration: none;
                &:hover {
                    text-decoration: underline;
                }
            }
        }
        .map-link {
            color: #000000;
            display: flex;
            gap: 8px;
            justify-content: end;
            .label {
                display: none;
            }
            .icon {
                width: 1.2rem;
                img {

                }
            }
        }
    }
    .container-side-menu__content {
        grid-column: span 12/auto;
        /*margin-bottom: 20px;*/
    }
    .container-side-menu__sidebar {
        grid-column: span 12/auto;
        display: flex;
        flex-direction: column;
        gap: 20px;
        .sidebar__wrapper {
            display: flex;
            box-shadow: 0px 1px 6px #0000001F;
            border: 2px solid #D4D4D4;
            padding: 15px 20px;
            box-sizing: border-box;
            .sidebar-header {
                h4 {
                    color: #202020;
                    font-size: 21px;
                    margin: 0 0 10px;
                    font-weight: 600;
                }
            }
            ul {
                margin: 0;
                padding-left: 25px;
                li {

                    padding: 3px 0;
                }
            }
            a {
                color: var(--link-std);
                &:hover {
                    color: var(--link-std-hover);
                }
            }
        }
        .ad {
            display: flex;
            justify-content: center;
        }
    }
}

@media only screen and (min-width: 1024px) {
    .h1 {
        font-size: 38px;
        line-height: 48px;
    }
    .h2 {
        font-size: 31px;
        line-height: 41px;
    }
    .h3 {
        font-size: 25px;
        line-height: 29px;
    }
}

@media only screen and (min-width: 768px) {
    .container-side-menu {
        .container-list-options {
            grid-column: span 9/auto;
            .list-view-switcher {
                .map-link {
                    .label {
                        display: block;
                    }
                }
            }
        }
        .container-side-menu__content {
            grid-column: span 9/auto;
        }
        .container-side-menu__sidebar {
            grid-column: span 3/auto;
        }
    }
}

@media only screen and (max-width: 768px) {
    .container-re-list {
        display: flex;
        flex-direction: column;
        /* change items order */
        section:has(.s-main-filter__container) {order: 10; }
        .breadcrumbs { order: 20; }
        section:has(.h1) {order: 30;}
        .container-side-menu {order: 40;}

        .main-filter-mobile-switcher {
            display: flex;
            align-content: center;
            gap: 8px;
            box-sizing: border-box;
            margin-left: -10px;
            margin-right: -10px;
            background-color: #f3f3f3;
            padding: 15px 20px;
            .icon {
                display: flex;
                align-content: center;
                width: 1.5rem;
                img {
                    max-width: 1.5rem;
                }
            }
        }
        .s-main-filter__container {
            max-height: 0;
            overflow: hidden;
            &.main-filter-visible {
                max-height: none;
                overflow: visible;
            }
        }

        section:has(.s-main-filter__container.main-filter-visible) {
            .main-filter-mobile-switcher {
                display: none;
            }
        }
    }
}

.real-estate-map-container {
    .heading {
        .list-view-switcher {
            .list-link {
                color: #000000;
            }
        }
    }
}
