﻿.accordion {
    width: 90%;
    margin: 0 auto;
}

    .accordion .card {
        border: none;
    }

        .accordion .card .card-header {
            background-color: transparent;
            border: 0;
            padding: 4px;
            width: 75%;
            margin: 0 auto;
        }

            .accordion .card .card-header button .dropdown-arrow {
                transform: rotate(180deg);
            }

            .accordion .card .card-header button[aria-expanded="true"] .dropdown-arrow {
                transform: rotate(0deg);
            }

            .accordion .card .card-header button[aria-expanded="true"] span {
                font-weight: bold;
            }

        .accordion .card .card-body {
            margin-top: 8px;
            margin-bottom: 8px;
            padding: 12px 8px;
        }

            .accordion .card .card-body p, .accordion .card .card-body span {
                font-family: "Effra-Regular";
                color: #414042;
                font-size: 1em;
                text-align: left;
            }

            .accordion .card .card-body strong {
                padding: 8px 0 0 12px;
            }

        .accordion .card .card-header button span {
            text-transform: none;
            font-family: "Effra-Regular";
            color: #414042;
            font-size: 18px;
            letter-spacing: initial;
            color: #AB1239 !important;
        }


.hot-spot-card-wrapper {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

    .hot-spot-card-wrapper .load-more-button {
        cursor: pointer;
        color: #AB1239;
        text-decoration-color: #AB1239;
    }

        .hot-spot-card-wrapper .load-more-button::after {
            color: #AB1239;
            text-decoration-color: #AB1239;
            content: url("../../Images/icons/expand-plus-red.svg");
            margin-left: 5px;
        }

    .hot-spot-card-wrapper .hot-spot-card {
        display: flex;
        flex-direction: row;
        align-content: center;
        align-items: center;
        gap: 8px;
    }


        .hot-spot-card-wrapper .hot-spot-card .hot-spot-info {
            display: flex;
            gap: 4px;
            padding-top: 3px;
            flex-direction: column;
            justify-items: center;
            align-items: center;
            min-width: 60px;
        }

            .hot-spot-card-wrapper .hot-spot-card .hot-spot-info .distance {
            }

        .hot-spot-card-wrapper .hot-spot-card .hot-spot-label {
            text-align: left;
            font-weight: bold;
        }
