/* ==========================================================================
   StoreLocal - New Facility Cards
   Test CSS for [facility-group-new]

   Everything is scoped to .facility-wrap-new so the existing
   [facility-group] shortcode remains untouched.
   ========================================================================== */


/* ==========================================================================
   RESULTS COUNT
   ========================================================================== */

.facility-wrap-new .facility-results-count > p {
    display: block;
    padding: 10px 0 20px;
    margin: 0;

    font-size: 28px;
    line-height: normal;
}


/* ==========================================================================
   FACILITY CARD
   ========================================================================== */

.facility-wrap-new .facility-list-new .facility-box {
    position: relative;

    overflow: visible;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    padding: 12px;

    background-color: #fff !important;

    border-radius: 10px;

    cursor: pointer;

    transition: transform 0.3s ease;

    box-sizing: border-box;
}


/* ==========================================================================
   RATING
   ========================================================================== */

.facility-wrap-new .facility-card-rating {
    position: absolute;
    top: 6px;
    right: 6px;
    z-index: 2;

    padding: 2.5px 4px;

    background: rgba(69, 69, 68, 0.08);
    border-radius: 10px;

    line-height: 1.2;
}

.facility-wrap-new .facility-card-rating a {
    color: inherit;
    text-decoration: none;
}

.facility-wrap-new
.facility-card-rating
.review-score-count-wrap
.rpi-header
.review-count {
    display: none;
}

.facility-wrap-new
.facility-card-rating
.review-score-count-wrap
.rpi-header
.rpi-stars::before,
.facility-wrap-new
.facility-card-rating
.review-score-count-wrap
.rpi-header
.rpi-stars::after {
    max-width: 25px;
}

.facility-wrap-new
.facility-card-rating
.review-score-count-wrap
.rpi-header {
    flex-direction: row-reverse;

    margin-bottom: 0 !important;

    max-width: 45px;

    color: #454544 !important;

    gap: 0;
}


/* ==========================================================================
   INFORMATION
   ========================================================================== */

.facility-wrap-new .facility-card-info {
    display: flex;
    flex-direction: column;

    margin-top: 16px;
}


.facility-wrap-new .facility-card-title-link {
    display: block;

    color: inherit;

    text-decoration: none;
}


.facility-wrap-new .facility-card-title-link:hover,
.facility-wrap-new .facility-card-title-link:focus {
    color: inherit;

    text-decoration: none;
}


.facility-wrap-new h3.facility-card-title {
    margin-top: 0;
    margin-bottom: 12px;

    padding-right: 60px;

    color: #053ff2;

    text-transform: uppercase;
}


/* ==========================================================================
   ADDRESS
   ========================================================================== */

.facility-wrap-new .facility-card-address {
    display: flex;
    align-items: flex-start;

    gap: 5px;

    margin-bottom: 10px;

    font-size: 15px;

    line-height: 1.35;
}


.facility-wrap-new .facility-card-address-icon {
    display: inline-flex;

    flex: 0 0 auto;
}


.facility-wrap-new .facility-card-address-icon svg {
    display: block;

    flex-shrink: 0;
}


/* ==========================================================================
   PHONE
   ========================================================================== */

.facility-wrap-new .facility-card-phone {
    display: flex;
    align-items: center;

    gap: 5px;

    color: inherit;

    font-size: 16px;

    text-decoration: none;
}


.facility-wrap-new .facility-card-phone:hover,
.facility-wrap-new .facility-card-phone:focus {
    color: #053ff2;

    text-decoration: none;
}


.facility-wrap-new .facility-card-phone-icon {
    display: inline-flex;

    flex: 0 0 auto;
}


/* ==========================================================================
   CTA
   ========================================================================== */

.facility-wrap-new .facility-card-button-wrap {
    margin-top: 24px;
}


.facility-wrap-new .facility-card-button-wrap .fusion-button {
    width: 100%;

    box-sizing: border-box;

    text-align: center;

    color: #000 !important;
}


.facility-wrap-new .facility-card-button-wrap .yellow-btn span {
    color: #000 !important;

    font-weight: 600;
}


/* ==========================================================================
   DESKTOP
   ========================================================================== */

@media only screen and (min-width: 1300px) {

    .facility-wrap-new h3.facility-card-title {
        font-size: 15px !important;
    }

}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media only screen and (max-width: 767px) {

    .facility-wrap-new .facility-results-count > p {
        font-size: 24px;
    }

}


@media only screen and (max-width: 760px) {

    .facility-wrap-new .facility-list-new {
        gap: 20px;
    }

}