@import url("/css/franchises/shared.css");

/* Optional font-family imports from centrally managed resources on Sirv */

@import url('https://bluesky.sirv.com/Global/Assets/Fonts/Peugeot/2024/peugeot.css');

.peugeot {

    /* Optionally set franchise font-family to match that in Sirv @font-face rules  */
    /* Styles in shared.css will fallback to --bs-body-font-family by default */
    --franchise-font-family: 'Peugeot';
    /* Set franchise-specifc button colours */
    --franchise-primary: #0074e8;
    --franchise-secondary: #000;
    --franchise-secondary-hover: #333;
    --franchise-primary-button-text: #fff;
    --franchise-hover-bg: #333;
    --franchise-hover-text: #fff;

    font-size: .975rem !important;

}



.peugeot .btn-white:hover {
    border-color: #fff !important;
    background-color: var(--franchise-secondary) !important;
    color: #fff !important;
}



.peugeot .bg-secondary {
    background-color: var(--franchise-secondary) !important;
}

.peugeot .btn-search {
    background-color: var(--franchise-primary) !important;
    border-color: var(--franchise-primary) !important;
}

.peugeot .btn-search svg {
    color: #fff !important;
}

.peugeot .bg-primary.badge {
    color: var(--franchise-hover-text) !important;
}


.peugeot .btn-primary-alt {
    background-color: var(--franchise-primary) !important;
    border-color: var(--franchise-primary) !important;
    color: var(--franchise-primary-button-text) !important;
}

.peugeot .btn-primary-alt:hover {
    background-color: var(--franchise-secondary) !important;
    border-color: var(--franchise-secondary) !important;
    color: #fff !important;
}

.peugeot .btn-primary:hover,
.peugeot ._vm_btn--primary:hover {
    border-color: var(--franchise-hover-bg) !important;
    color: var(--franchise-hover-text) !important;
}

.peugeot ._vm_btn--secondary {
    background-color: var(--franchise-secondary) !important;
    border-color: var(--franchise-secondary) !important;
    color: #fff !important;
}

.peugeot ._vm_btn--secondary:hover {
    background-color: var(--franchise-primary) !important;
    border-color: var(--franchise-primary) !important;
    color: var(--franchise-secondary) !important;
}

.peugeot .btn-outline-primary {
    border-color: var(--franchise-primary) !important;
    color: #fff !important;
}

.peugeot .btn-outline-primary:hover {
    background-color: var(--franchise-primary) !important;
    border-color: var(--franchise-primary) !important;
    color: var(--franchise-primary-button-text) !important;
}


.peugeot .btn-outline-secondary {
    background-color: #fff !important;
    border-color: var(--franchise-secondary) !important;
    color: var(--franchise-secondary) !important;
}

.peugeot .btn-outline-secondary:hover {
    background-color: var(--franchise-secondary) !important;
    border-color: var(--franchise-secondary) !important;
    color: #fff !important;
}


.peugeot .btn-secondary {
    background-color: var(--franchise-secondary) !important;
    border-color: var(--franchise-secondary) !important;

    svg {
        color: #fff !important;
    }

}

.peugeot .service-booking .btn-dark, .peugeot .part-ex .btn-dark, .peugeot .version-carousel .btn-secondary, .peugeot #quote-action-buttons .btn-secondary, .peugeot .ucd-ctas .btn-secondary {
    background-color: var(--franchise-secondary) !important;
    border-color: var(--franchise-secondary) !important;
    color: #fff !important;
}

.peugeot .service-booking .btn-dark:hover, .peugeot .part-ex .btn-dark:hover, .peugeot .version-carousel .btn-secondary:hover, .peugeot #quote-action-buttons .btn-secondary:hover, .peugeot .ucd-ctas .btn-secondary:hover {
    background-color: var(--franchise-secondary-hover) !important;
    border-color: var(--franchise-secondary-hover) !important;
    color: #fff !important;
}


.peugeot .btn-outline-dark:hover {
    background-color: var(--franchise-secondary-hover) !important;
    border-color: var(--franchise-secondary-hover) !important;
    color: #fff !important;
}

.peugeot .btn-link {
    color: #50DD6D;
    min-height: 32px;
}

.peugeot .franchise-hover {
    transition: ease all 0.3s;
}

.peugeot .franchise-hover:hover {
    color: var(--franchise-primary) !important;
}


.tick-list ul li::before {
    background-color: #50DD6D !important;
}

.peugeot .dealership__hours svg {
    color: var(--franchise-primary) !important;
}