:root {

    /* Colors */
    --bh-map-primary:              #2C2C2C;
    --bh-map-primary-rgb:          255, 0, 0;
    --bh-map-primary-hover:        #b10303;
    --bh-map-primary-hover-rgb:    177, 3, 3;
    --bh-map-secondary: #a2a2a2;
    --bh-map-secondary-rgb:        44, 44, 44;
    --bh-map-contact-first-child:  #6a6a6a;
    --bh-map-contact-second-child: #7b7b7b;
    --bh-map-contact-third-child:  #9d9d9d;
}

/* Map */
.bh-map__wrapper {
    border: 1px solid var(--bh-map-secondary);
}

[id='bh-map-svg-wrapper'] > g {
    transition:   fill .25s ease-in-out, stroke .25s ease-in-out;
    fill:         var(--bh-map-secondary);
    stroke:       #ffffff;
    stroke-width: .75;
}

[id='bh-map-svg-wrapper'] > g.can-hover {
    cursor: pointer;
    fill:   var(--bh-map-primary);
}

[id='bh-map-svg-wrapper'] g.can-hover:not(.is-active):hover {
    fill: var(--bh-map-primary-hover);
}

[id='bh-map-svg-wrapper'] g.is-active {
    fill: var(--bh-map-primary);
}

[id='bh-map-svg'] {
    width:  100%;
    height: auto;
}

/* Tabpanel */
.bh-map__tabpanel:not(.is-active) {
    display: none;
}

/* Tablist */
.bh-map__tablist {
    display:          flex;
    overflow-x:       auto;
    align-items:      stretch;
    margin-top:       1.5rem;
    background-color: var(--bh-map-secondary);
}

button.bh-map__tab-item {
    font-size:   1.25rem;
    font-weight: 500;
    position:    relative;
    flex:        1 0 0;
    padding:     1.5rem 2rem;
    user-select: none;
    white-space: nowrap;
    border:      none;
}

@media (max-width: 767.98px) {
    button.bh-map__tab-item {
        font-size: 1rem;
        flex:      1 0 0;
        padding:   1rem 1.5rem;
    }
}

button.bh-map__tab-item:not(.is-active):hover,
button.bh-map__tab-item:not(.is-active):focus {
    background-color: var(--bh-map-primary);
}

button.bh-map__tab-item.is-active:hover,
button.bh-map__tab-item.is-active:focus {
    color:            var(--bh-map-secondary);
    background-color: #ffffff;
}

.bh-map__tab-item-separator {
    display:          block;
    width:            1px;
    margin-top:       1rem;
    margin-bottom:    1rem;
    background-color: #ffffff;
}

.bh-map__tab-item.is-active,
.bh-map__tab-item.is-active:focus {
    color:            var(--bh-map-secondary);
    background-color: #ffffff;
}

.bh-map__tab-item,
.bh-map__tab-item:where(:hover, :focus),
.bh-map button.bh-map__tab-item,
.bh-map button.bh-map__tab-item:where(:hover, :focus) {
    border-radius: 0;
}

.bh-map__tabpanel {
    position:              relative;
    display:               flex;
    overflow:              scroll hidden;
    margin:                0 auto;
    padding:               0;
    list-style:            none;
    background-color:      var(--bh-map-contact-first-child);
    overscroll-behavior-x: contain;
    scroll-snap-type:      x mandatory;
}

/* Contact Box */
.bh-map__contact {
    flex:                           none;
    flex:                           0 0 auto;
    width:                          calc(100% / var(--bh-map-contact-column-count) - var(--bh-map-contact-column-offset));
    margin:                         0;
    padding:                        5rem 2.5rem;
    color:                          #ffffff;
    background-color:               var(--bh-map-secondary);
    scroll-snap-align:              start;

    --bh-map-contact-column-count:  3;
    --bh-map-contact-column-offset: 0;
}

.bh-map__contact:not(:only-of-type) {
    --bh-map-contact-column-offset: 1rem;
}

@media (max-width: 991.98px) {
    .bh-map__contact {
        --bh-map-contact-column-count: 2;
    }
}

@media (max-width: 767.98px) {
    .bh-map__contact {
        width:                         100%;
        padding:                       2rem 1rem;

        --bh-map-contact-column-count: 1;
    }
}

.bh-map__contact:nth-of-type(1) {
    background-color: var(--bh-map-contact-first-child);
}

.bh-map__contact:nth-of-type(2) {
    background-color: var(--bh-map-contact-second-child);
}

.bh-map__contact:nth-of-type(3) {
    background-color: var(--bh-map-contact-third-child);
}

.bh-map__contact > *:not(.bh-map__contact-link) + * {
    margin-top: 1.5rem;
}

.bh-map__person {
    display:     flex;
    align-items: center;
    margin:      0;
}

@media (max-width: 767.98px) {
    .bh-map__person {
        font-size:   1.25rem;
        line-height: 1.75rem;
    }
}

.bh-map__person:before {
    display:          block;
    width:            .25em;
    height:           1em;
    margin-right:     .375em;
    content:          '';
    background-color: #ff0000;
}

.bh-map__contact-link,
.elementor .bh-map__contact-link {
    display:         flex;
    align-items:     center;
    transition:      all .25s ease-in-out;
    text-decoration: underline;
    color:           #ffffff;
}

.bh-map__contact-link:hover,
.bh-map__contact-link:focus,
.elementor .bh-map__contact-link:hover,
.elementor .bh-map__contact-link:focus {
    color: var(--bh-map-primary);
}

.bh-map__contact-link[href*='tel']:before,
.bh-map__contact-link.mail-link:before {
    width:            1.25em;
    height:           1.5em;
    margin-right:     .25em;
    content:          '';
    background-color: currentColor;
    mask-position:    center center;
    mask-repeat:      no-repeat;
}

.bh-map__contact-link[href*='tel']:before {
    mask-image: url('data:image/svg+xml,%3Csvg xmlns=\'http://www.w3.org/2000/svg\' viewBox=\'0 0 24 24\'%3E%3Cpath fill-rule=\'evenodd\' d=\'M1.5 4.5a3 3 0 0 1 3-3h1.372c.86 0 1.61.586 1.819 1.42l1.105 4.423a1.875 1.875 0 0 1-.694 1.955l-1.293.97c-.135.101-.164.249-.126.352a11.285 11.285 0 0 0 6.697 6.697c.103.038.25.009.352-.126l.97-1.293a1.875 1.875 0 0 1 1.955-.694l4.423 1.105c.834.209 1.42.959 1.42 1.82V19.5a3 3 0 0 1-3 3h-2.25C8.552 22.5 1.5 15.448 1.5 6.75V4.5Z\' clip-rule=\'evenodd\' /%3E%3C/svg%3E%0A');
}

.bh-map__contact-link.mail-link:before {
    mask-image: url('data:image/svg+xml,%3Csvg xmlns=\'http://www.w3.org/2000/svg\' viewBox=\'0 0 24 24\'%3E%3Cpath d=\'M1.5 8.67v8.58a3 3 0 0 0 3 3h15a3 3 0 0 0 3-3V8.67l-8.928 5.493a3 3 0 0 1-3.144 0L1.5 8.67Z\' /%3E%3Cpath d=\'M22.5 6.908V6.75a3 3 0 0 0-3-3h-15a3 3 0 0 0-3 3v.158l9.714 5.978a1.5 1.5 0 0 0 1.572 0L22.5 6.908Z\' /%3E%3C/svg%3E%0A');
}