/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: Astra is fast, fully customizable & beautiful WordPress theme suitable for blog, personal portfolio, business website and WooCommerce storefront. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with Schema.org code integrated and is Native AMP ready so search engines will love your site. It offers special features and templates so it works perfectly with all page builders like Elementor, Beaver Builder, Visual Composer, SiteOrigin, Divi, etc. Some of the other features: # WooCommerce Ready # Responsive # RTL & Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and WooCommerce ready theme that you can use for building any kind of website!
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.8.8.1734942352
Updated: 2024-12-23 03:25:52

*/
@import url('https://cdn-uicons.flaticon.com/2.6.0/uicons-regular-rounded/css/uicons-regular-rounded.css');
@import url('https://cdn-uicons.flaticon.com/2.6.0/uicons-bold-straight/css/uicons-bold-straight.css');
@import url('https://cdn-uicons.flaticon.com/2.6.0/uicons-regular-straight/css/uicons-regular-straight.css');
@import url('https://cdn-uicons.flaticon.com/2.6.0/uicons-thin-rounded/css/uicons-thin-rounded.css');

@font-face {
    font-family: 'CustomFont';
    src: url('/path-to-your-font/CustomFont.woff2') format('woff2'),
        url('/path-to-your-font/CustomFont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    /* Ensures text is visible while font loads */
}

.nf-input-limit {
    display: none;
}

#nf-field-684,
#nf-field-690 {
    background: #333 !important;
}

#nf-field-684:hover,
#nf-field-690:hover {
    background: #efe15e !important;
    color: #020102 !important;
}

.nf-form-content button,
.nf-form-content input[type=button],
.nf-form-content input[type=submit] {
    background: #333 !important;
    margin-top: 5px;
}

.ast-separate-container {
    background-color: #ffffff !important;
}

nav.navbar.navbar-expand-lg.navbar-light.bg-white {
    /*     background: #100e42 !important; */
}

.top-header-in {
    flex-wrap: wrap;
}

.navbar-toggler {
    background-color: #ffffff !important;
}

button.navbar-toggler.collapsed:focus {
    background-color: #fff !important;
}

.nav-link {
    /*     color: rgb(255, 255, 255) !important; */
}

.nav-link:hover {
    color: #000000bd !important;
}

.navbar-brand img {
    width: auto;
    height: 81px;
}

.text-danger i,
.me-3 i {
    margin-right: 4px;
}

footer {
    font-size: 14px;
    line-height: 1.8;
}

footer a {
    transition: color 0.3s;
}

footer a:hover {
    color: #aaa !important;
    text-decoration: underline;
}

footer .bi {
    margin-right: 5px;
    /*     color: #fff; */
}

/* Dropdown Hover Effect */
.dropdown:hover .dropdown-menu {
    display: block;
}

.dropdown-menu-custom {
    margin-top: 21px !important;
    width: 1285px;
    left: 50%;
    transform: translateX(-50%);
}

/* Grid/List View Custom CSS */
.grid-view .list-item {
    display: grid !important;
    width: 32%;
    margin: 1px;
    text-align: center;
    border: 1px solid #AAAAAA;
    border-radius: 5px;
    float: left;
    background: #fff;
    -webkit-box-shadow: 0px 10px 25px -8px rgba(0, 0, 0, 0.44);
    -moz-box-shadow: 0px 10px 25px -8px rgba(0, 0, 0, 0.44);
    box-shadow: 0px 10px 25px -8px rgba(0, 0, 0, 0.44);
    margin: 5px;
}

.grid-view .list-item span {
    display: block;
    padding: 10px;
    color: #000000;
    font-weight: 700;
}

.list-view .list-item {
    display: block;
    width: 30%;
    float: left;
    margin: 10px;
    text-align: left;
    border: 1px solid #AAAAAA;
    border-radius: 5px;
    padding: 10px;
}

.list-view .list-item span {
    padding: 10px;
    color: #000000;
    font-weight: 700;
}

.border-bm-mu {
    border-bottom: 1px solid;
}

h6.fw-bold.mb-2 {
    margin-bottom: 20px !important;
}

button.btn.search-btn {
    position: absolute;
    right: 17px;
    top: 17px;
    box-shadow: none;
}

input.search-input {
    padding-left: 15px;
    padding-right: 38px;
    color: #474242;
}

ul.list-unstyled li {
    width: 100%;
    /* display: block; */
    margin-right: 50px;
}

ul.list-unstyled li a {
    color: #000000;
    font-weight: 500;
    line-height: 30px;
    font-size: 14px;
}

ul.list-unstyled {
    margin-left: 0;
}

.grid-view .list-item img {
    object-fit: cover;
    aspect-ratio: 1;
    height: 15.5em;
    width: 100%;
}

.list-view .list-item img {
    width: 30px;
    aspect-ratio: 1;
    object-fit: cover;
}

.bg-light {
    --bs-bg-opacity: 0 !important;
    background-color: rgb(255 255 255) !important;
}

.grid-view {
    height: 680px !important;
    overflow: scroll;
}

a.d-flex.align-items-center {
    display: inline-block !important;
}

/* Hide the search box initially */
.hidden {
    display: none !important;
}

/* Search Dropdown Styling */
.search-dropdown {
    position: absolute;
    top: 100%;
    right: 0;
    /* Align with the container */
    width: 300px;
    /* Adjust width as needed */
    background: #fff;
    border: 1px solid #AAAAAA;
    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.15);
    border-radius: 5px;
    padding: 15px;
    z-index: 1050;
    /* Higher than typical navbar elements */
    transition: all 0.3s ease;
    /* Smooth transitions */
}

/* Search Container Styling */
.search-container {
    display: block;

}

/* Input Styling */
.search-input {
    flex: 1;
    border: 1px solid #AAAAAA;
    border-radius: 5px;
    padding: 8px 12px;
    font-size: 14px;
    transition: border-color 0.3s ease;
}

.search-input:focus {
    border-color: #AAAAAA;
    /* Highlight on focus */
    outline: none;
}

/* Search Button Styling */
.search-button {
    background: #AAAAAA;
    color: #fff;
    border: none;
    border-radius: 5px;
    padding: 8px 12px;
    cursor: pointer;
    transition: background 0.3s ease;
}

.search-button:hover {
    background: #333333;
    /* Darker on hover */
}

/* Nav Item Alignment */
.search-item {
    position: relative;
    display: flex;
    /*             align-items: center;
            justify-content: center; */
}

/* Navbar Nav Alignment */
.navbar-nav {
    display: flex;
    justify-content: flex-end;
    /* Align items to the right */
    gap: 15px;
    /* Add spacing between nav items */
}

/* Search Results Styling */
.search-results {
    margin-top: 10px;
    max-height: 250px;
    overflow-y: auto;
    border-top: 1px solid #ddd;
    padding-top: 10px;
}

.search-result {
    padding: 8px 10px;
    border-bottom: 1px solid #f1f1f1;
    font-size: 14px;
    color: #333;
    cursor: pointer;
    transition: background 0.3s ease;
}

.search-result:hover {
    background: #f9f9f9;
    /* Highlight on hover */
}

/* Responsive Styling */
@media (max-width: 768px) {
    .search-dropdown {
        width: 90%;
        /* Adjust width for smaller screens */
        right: 5%;
        top: 60px;
        /* Adjust top for mobile layout */
    }

    .search-input {
        font-size: 12px;
        padding: 6px 8px;
    }

    .search-button {
        padding: 6px 8px;
        font-size: 12px;
    }

    .footer_copyright {
        width: 100%;
        text-align: center;
    }

    h5.card-model-year {
        min-height: unset;
    }
}

table,
td,
th {
    border: none;
    padding: 0;
}

.textwidget br {
    display: none;
}

/* .tools a,
.textwidget a {
    color: rgb(255 255 255) !important;
} */

a {

    text-decoration: none !important;
}

.textwidget p {
    text-align: right;
}

.green-dot::before {
    content: '';
    display: inline-block;
    width: 10px;
    height: 10px;
    -moz-border-radius: 7.5px;
    -webkit-border-radius: 7.5px;
    border-radius: 7.5px;
    background-color: #6bf388;
    margin-right: 10px;
}

.no-green-dot {
    margin-left: 20px;
}

button#dropdownMenuButton {
    background: transparent;
    color: #f1582a;
    border: none;
}

.footer-top-border-in {
    border: 1px solid;
}

.border-top {
    border-top: none !important;
}

h1.entry-title {
    display: none;
}

/* .inventory-title-in {
    display: flex;
} */

.inventory-title-in i {
    font-size: 28px;
}

.hdr-top {
    padding-left: 15px;
    padding-right: 15px;
}

#primary {
    margin: 0 !important;
    padding: 0 !important;
}

/*  */

:is(.page-id-61870) .elementor-widget-container .search-container {
    background-color: #444;
    padding: 20px;
    width: 100%;
}

.inventory {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.inventory span {
    color: orange;
    font-weight: bold;
}

.vehicle-count {
    color: orange;
}

.filters {
    display: flex;
    gap: 10px;
}

select,
.search-button,
input[type="text"] {
    padding: 0 10px;
    /*   border: none; */
    border-radius: 5px;
}

/* select {
    background-color: #555;
    color: #fff;
    flex: 1;
	padding: 0px 10px !important;
} */

.filters select {
    background-color: #555;
    color: #fff;
    flex: 1;
    background-image: linear-gradient(45deg, #00000000 50%, #ffffff 60%), linear-gradient(135deg, #ffffff 40%, transparent 50%) !important;
    background-position: calc(100% - 13px) 17px, calc(100% - 8px) 17px, 100% 0;
    background-size: 5px 5px, 5px 5px;
    background-repeat: no-repeat;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.filters select:focus {
    background-image: linear-gradient(45deg, #00000000 50%, #000000 60%), linear-gradient(135deg, #000000 40%, transparent 50%) !important;
}


.search-button {
    background-color: orange;
    color: #fff;
    font-weight: bold;
    cursor: pointer;
}

/* 
input[type="text"] {
  flex: 2;
  background-color: #555;
  color: #fff;
} */

input::placeholder {
    color: #aaa;
}

.welcome-section {
    background-color: #4b4b4b;
    padding: 50px 20px;
}

.content-container {
    display: flex;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    gap: 20px;
}

.logo-container {
    flex: 1;
    text-align: center;
}

.logo {
    max-width: 150px;
}

.text-container {
    flex: 2;
}

h1 {
    font-size: 28px;
    margin-bottom: 20px;
}

p {
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 20px;
}

.cta-button {
    display: inline-block;
    background-color: #000;
    color: #fff;
    padding: 10px 20px;
    text-decoration: none;
    border-radius: 5px;
    font-size: 14px;
}

.cta-button:hover {
    background-color: #ff6600;
}

.text-container p {
    color: #fff;
}

/* single page slider */
.slick-slide {
    max-height: 700px !important;
}

/* home page slider */

/* Slider container styling */
.latest-arrivals-slider {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.car-image-wrapper .overlay {
    position: absolute;
    top: -100%;
    left: 0;
    width: 100%;
    height: 100%;
    /*     background-color: rgba(0, 0, 0, 0.6); */
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.5rem;
    transition: top 0.4s ease-in-out;
}

/* .car-image-wrapper {
    height: 200px !important;
} */
.car-item:hover .overlay {
    top: 0;
}

.car-image-wrapper {
    position: relative;
}

.car-image-wrapper .overlay i {
    padding: 5px 11px;
}

/* Individual car item styling */
.car-item {
    background: #fff;
    text-align: center;
    transition: transform 0.3s ease;
    position: relative;
    overflow: hidden;
}

/* Car image styling */
/* .car-item img {
    width: 100%;
    height: auto;
    border-radius: 5px;
    margin-bottom: 10px;
} */

/* Car details section */
.car-details {
    padding: 10px 0;
}

.car-make {
    color: #DB2E2D;
    text-transform: uppercase;
    margin-bottom: 5px;
    display: block;
    font-weight: 400;
    font-size: .9rem;
}

.car-title {
    /*     line-height: 1.5rem !important;
    letter-spacing: 0;
    margin: 0;
    padding: 0;
    font-size: 27px;
    margin-bottom: 20px !important;
    margin-top: 5px !important;
    font-weight: 700; */
}

.title-underline:after {
    width: 50px;
    display: block;
    margin: auto;
    content: "";
    height: 1px;
    background: #db2d2e;
    bottom: 0;
    left: 50%;
    transition: width .8s ease, background-color .8s ease;
    -webkit-transition: width .8s ease, background-color .8s ease;
    -o-transition: width .8s ease, background-color .8s ease;
    -ms-transition: width .8s ease, background-color .8s ease;
    -moz-transition: width .8s ease, background-color .8s ease;
}

.title-underline::before {
    content: '';
    display: block;
    margin: auto;
    left: 0;
    height: 1px;
    width: 30px;
    background: #ff4500;
    transition: width .8s ease, background-color .8s ease;
    -webkit-transition: width .8s ease, background-color .8s ease;
    top: 5px !important;
    position: relative;
}

.car-item .title-underline:after {
    width: 50px;
    display: block;
    margin: auto;
    content: "";
    height: 1px;
    background: #db2d2e;
    bottom: 0;
    left: 50%;
    transition: width .8s ease, background-color .8s ease;
    -webkit-transition: width .8s ease, background-color .8s ease;
    -o-transition: width .8s ease, background-color .8s ease;
    -ms-transition: width .8s ease, background-color .8s ease;
    -moz-transition: width .8s ease, background-color .8s ease;
}

.car-item:hover .title-underline:after {
    width: 30px;
    left: 0;
}

.car-item .title-underline::before {
    content: '';
    display: block;
    margin: auto;
    left: 0;
    height: 1px;
    width: 30px;
    background: #ff4500;
    transition: width .8s ease, background-color .8s ease;
    -webkit-transition: width .8s ease, background-color .8s ease;
    top: 5px !important;
    position: relative;
}

.car-item:hover .title-underline::before {
    width: 50px;
    transition: 0.8s ease, background-color .8s ease;
}

.car-price {
    font-size: 30px;
    color: #000000;
    font-weight: 600;
    margin-top: 15px;
    font-family: "Outfit", Sans-serif !important;
}

span.price-weekly-in {
    font-size: 22px;
    font-weight: normal;
}

.inventory input {
    width: 70%;
}

.inventory span {
    color: var(--primary) !important;
    font-weight: bold;
    font-size: 18px;
    text-transform: uppercase;
}

span.vehicle-count-number {
    color: #fff !important;
}

.search-container-home {
    background-color: #444;
    padding: 20px;
    font-family: "Outfit", Sans-serif !important;
    color: #fff;
}

.inventory {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

input.search-input-home {
    margin: 0 10px;
}

.inventory span {
    font-weight: bold;
}

.search-home-border {
    border-top: 5px solid rgba(0, 0, 0, 0.5);
    padding: 10px;
}

.vehicle-count {
    color: orange;
}

.filters {
    display: flex;
    gap: 10px;
}

/*         select,
        .search-button,
        input[type="text"] {
            padding: 10px;
            border: none;
        } */

select {
    background-color: #555;
    color: #fff;
    flex: 1;
}

button.search-button {
    width: 25%;
}

.search-button {
    background-color: var(--primary);
    color: #fff;
    font-weight: bold;
    cursor: pointer !important;
}

/* input[type="text"] {
            flex: 2;
            color: #fff;
        } */

input::placeholder {
    color: #aaa;
}

select:disabled {
    background-color: #333;
    color: #888;
}


/* Styling for Custom Prev/Next Arrows */
.owl-prev,
.owl-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    font-size: 24px;
    color: #333;
    z-index: 10;
    box-shadow: none;
    padding: 10px;
}

.latest-arrivals-slider:hover .owl-prev {
    opacity: 1;
    left: -10px;
    transition: .8s ease, background-color .8s ease;
    background: #ffffff;
    color: var(--primary);
    border: 1px solid #AAAAAA;
}

.latest-arrivals-slider:hover .owl-next {
    opacity: 1;
    right: -10px;
    transition: .8s ease, background-color .8s ease;
    background: #ffffff;
    color: var(--primary);
    border: 1px solid #AAAAAA;
}

.owl-prev {
    left: -30px;
    opacity: 0;
}

.owl-next {
    right: -30px;
    /* Position for right arrow */
    opacity: 0;
}

.owl-prev:hover,
.owl-next:hover {
    color: #ffffff !important;
    background: var(--primary) !important;
    border: 1px solid #AAAAAA !important;
}

p.car-old-price {
    color: #000000;
    text-decoration: line-through;
    margin-bottom: 0;
    font-size: 13px;
}

.hero-sd-home .car-item {
    margin-left: 2px !important;
}

.hero-sd-home .car-item img {
    aspect-ratio: 3 / 2;
    object-fit: cover;
}

/* .car-item img {
    height: 180px !important;
    max-width: 100%;
    object-fit: cover;
    padding: 1px;
    aspect-ratio: 1;
} */

/*  */

.dealer-info {
    text-align: center;
    border-top: 1px solid #e1e1e1;
}

.dealer-logo {
    display: inline-block;
    margin-bottom: 8px;
    width: auto;
    height: 50px !important;
    margin-top: 8px;
}

.car-details-items {
    text-align: center;
    font-size: 11px;
    /*     border-top: 1px solid #e1e1e1; */
    width: 100%;
    margin: 0 auto;
    padding: 5px 0;
    display: block;
    color: #000;
    font-weight: 400;
}

.detail-item {
    display: inline-block;
    margin: 0 5px;
    font-weight: 500;
}

.chat-button-wrapper {
    text-align: center;
    margin: 20px 0;
}

.chat-button {
    background-color: var(--primary);
    color: #fff;
    padding: 8px 16px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    border: 1px solid var(--primary);
    font-size: 18px;
}

.chat-button:hover {
    background-color: #fff;
    color: #000;
}

.finance-button-wrapper {
    text-align: center;
    margin: 10px 5px;
}

.button-body-cars-in {
    display: flex;
    margin: 0 auto;
}

.finance-button {
    background-color: #100e42;
    color: #fff;
    padding: 8px 16px;
    border: none;
    border-radius: 5px;
}

.finance-button:hover {
    background-color: #393771;
    color: #fff;
}

.finance-button-wrapper a:focus,
.chat-button-wrapper a:focus {
    color: #000;
}

.card-body-left {
    width: 100% !important;
}

.card-body {
    display: block;
    height: auto;
    /* height: 145px; */
    padding-top: 0 !important;
    text-align: center;
}

.card-body-right {
    /*     padding-top: 5px; */
    margin-top: -10px;
}

*/ h4.card-title {
    text-transform: uppercase;
    color: #000;
    font-weight: normal;
    font-size: 0.9rem;
    margin-bottom: 0 !important;
}

h5.card-model-year {
    font-weight: 800;
    line-height: 1.5rem;
    font-size: 1.1rem;
    margin: 1px 0;
    color: #363636;
}

.drive-trim {
    /*     font-weight: lighter;
    font-size: 0.95rem;
    margin-bottom: 0 !important;
    opacity: 0.8;
    color: #000; */
    color: #333;
    /*     padding: 5px 5px; */
    font-size: 16px;
    margin-bottom: 5px !important;
}

p.card-text {
    color: #6b6868;
    margin: 0;
    z-index: 9999;
}

/* p.new-price {
    color: #db2e2d;
    font-size: 1.2rem;
    font-weight: 600;
    margin: 0;
} */

/*  */
.page-link {
    color: #999999 !important;
    /*     padding: 8px 16px !important; */
}

/* .active>.page-link,
.page-link.active {
    background-color: #DB2E2D !important;
    border-color: #DB2E2D !important;
    color: #fff !important;
} */

/* .page-link:hover {
    color: #fff !important;
    background-color: #DB2E2D !important;
    border-color: #9d8e8e !important;
} */

.page-link:focus {
    box-shadow: none !important;
}

.page-item {
    margin-left: 3px;
    font-family: 'Outfit';
    width: 40px;
    text-align: center;
}

/*  */
h3.site-description-title {
    color: #fff;
}

.image-wrapper .overlay {
    position: absolute;
    top: -100%;
    /* Start the banner off-screen (above the image) */
    left: 0;
    width: 100%;
    height: 100%;
    /*     background-color: rgba(0, 0, 0, 0.6); */
    /* Semi-transparent black */
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.5rem;
    transition: top 0.4s ease-in-out;
    /* Smooth slide animation */

}

.card:hover .overlay {
    top: 0;
    /* Slide the banner down into view */
}

.image-wrapper {
    overflow: hidden;
    border-radius: 5px 5px 0 0;
}

.overlay i:hover {
    background: #fff;
    color: var(--primary);
    transition: opacity 0.3s ease-in-out;
}

.overlay i {
    border: 1px solid #AAAAAA;
    border-radius: 25px;
    padding: 5px 10px;
    font-size: 20px;
}

/* Tooltip styles */
.view-text {
    font-style: normal;
    position: absolute;
    bottom: 67%;
    /* Position above the overlay text */
    left: 50%;
    transform: translateX(-50%);
    background-color: rgba(0, 0, 0, 0.8);
    /* Black semi-transparent background */
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 0.8rem;
    white-space: nowrap;
    /* Prevent wrapping */
    opacity: 0;
    /* Hidden by default */
    visibility: hidden;
    /* Hide the tooltip initially */
    transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
    /* Smooth fade-in */
}

/* Tooltip arrow */
.view-text::after {
    content: '';
    position: absolute;
    top: 100%;
    /* Arrow below the tooltip */
    left: 50%;
    transform: translateX(-50%);
    border-width: 5px;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.8) transparent transparent transparent;
}

/* Show tooltip on hover */
.overlay i:hover .view-text {
    opacity: 1;
    visibility: visible;
}

.icon-certified-in img {
    width: 50px;
    height: auto;
    transition: width 200ms ease-in-out;
    margin: 0 auto;
    display: block;
}

.icon-certified-in p {
    font-weight: bold;
    font-size: 12px;
    line-height: 17px;
    text-align: center;
}

.icon-certified-in {
    display: flex;
    /* 	justify-content: space-between; */
}

.feature-item {
    width: 70px;
}

.feature-item {
    width: 70px;
}

#finance_iframe {
    min-height: 2000px;
}

header.entry-header.ast-no-thumbnail.ast-header-without-markup {
    display: none;
}

/* single car page */
i.bi.bi-check {
    font-size: 24px;
    color: #000;
}

.mg-top-in {
    margin-top: 40px;
}

ul.options-list {
    margin: 0;
}

li.single-car-options {
    color: #000;
}

.options-list li {
    display: flex;
}

ul.details-list {
    margin: 0;
    padding: 20px 0px 0 20px !important;
    background: #F2F5FB;
    border-radius: 5px;
    margin-bottom: 15px;
}

ul.details-list li strong {
    margin-left: 5px;
}



img.card-img-top.car-image {
    height: 200px !important;
    object-fit: cover;
    min-height: 200px;
}

.icon-car-features {
    z-index: 10;
}

@media screen and (max-width: 1024px) {
    .latest-arrivals-slider:hover .owl-prev {
        left: 0px;
    }

    .latest-arrivals-slider:hover .owl-next {
        right: 0px;
    }

    .owl-prev {
        left: 10px;

    }

    .owl-next {
        right: 10px;

    }
}

@media screen and (min-width: 769px) {
    li.nav-item.dropdown {
        display: block;
    }

    li.nav-item.dropdown.mobile {
        display: none;
    }
}

@media screen and (max-width: 768px) {
    li.nav-item.dropdown {
        display: none;
    }

    li.nav-item.dropdown.mobile {
        display: block;
    }

    .mobile-ql .me-3 {
        width: 100% !important;
    }

    .dropdown-menu.mobile-dd {
        width: 100%;
        margin: 0 !important;
        height: auto ! IMPORTANT;
    }

    .grid-view {
        height: auto !important;
        overflow: unset;
    }

    .grid-view .list-item {
        display: block;
        width: 100%;
        text-align: left;
        border: none;
        border-radius: 0;
        float: left;
        background: #fff;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
        margin: 0;
        padding: 0px !important;
    }

    .grid-view .list-item img {
        display: none;
    }

    .grid-view .list-item span {
        display: block;
        padding: 0;
        color: #000000;
        font-weight: 500;
    }

    /* home */
    .inventory {
        display: block;
    }

    .inventory input {
        width: 100%;
        margin: 6px 0;
    }

    .filters {
        display: block;
    }

    .filters select {
        margin-bottom: 10px;
    }

    .filters .search-button {
        width: 100%;
        padding: 10px;
    }
}

@media screen and (min-width: 768px) {
    div#filte-tggl {
        display: none;
    }

    div#car-count {
        font-size: 50px !important;
        font-weight: 800;
        color: #333;
        line-height: 1.2;
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .sclicon i {
        font-size: 28px;
        float: right;
    }

    .mobile-in {
        display: none;

    }
}

@media (max-width: 767px) {
    div#filte-tggl {
        display: block;
    }

    .filter-sidebar {
        display: none;
    }

    .filter-sidebar.active {
        display: block;
    }

    div#filte-tggl {
        background: #f6f6f6;
        border-bottom: 1px solid #D3D3D3;
        color: #212529;
        font-weight: 400;
        font-size: 1.125rem;
        overflow: hidden;
        white-space: nowrap;
        text-transform: uppercase;
        padding: 12px;
        width: 90%;
        margin: 0 auto;
    }

    .filte-tggl i {
        float: right;
    }

    .filter-sidebar {
        border-right: none !important;
    }

    div#car-count {
        display: none;
    }

    .webview-in {
        display: none;

    }

}

div#car-count {
    font-size: 23px;
}

@media screen and (max-width: 500px) {
    .car-item img {
        height: 200px !important;
        width: 90%;
        margin: 0 auto;
        object-fit: cover;
    }

    .textwidget p {
        text-align: left;
    }

    .textwidget ul {
        padding-left: 0;
    }

    .pagination {
        padding-left: 0px !important;
        margin-left: 0px !important;
    }

}

#footer_copyright a.text-white:hover {
    color: red !important;
}

@media screen and (min-device-width: 601px) and (max-device-width: 1024px) {
    .car-card {
        width: 50% !important;
    }

    .top-header-in {
        flex-wrap: nowrap !important;
    }

    .top-left-in {
        width: 20%;
    }

    .top-center-in {
        width: 45%;
    }

    .button-body-cars-in {
        display: block !important;
    }

    .finance-button-wrapper {
        margin: 15px 5px;
    }


}

@media screen and (max-width: 1385px) {
    .dropdown-menu-custom {

        width: 1015px;
        left: 50%;
        transform: translateX(-50%);
    }
}

@media screen and (min-device-width: 1025px) and (max-device-width: 1399px) {
    .button-body-cars-in {
        display: block !important;
    }

    .finance-button-wrapper {
        margin: 15px 5px;
    }

    .top-header-in {
        flex-wrap: nowrap !important;
    }

    .top-left-in {
        width: 20%;
    }

    .top-center-in {
        width: 45%;
    }
}

@media screen and (min-width: 992px) {
    .d-flex.justify-content-between.align-items-center.flex-wrap.mobile {
        display: none !important;
    }

    .d-flex.align-items-center.mobile {
        display: none !important;
    }
}

@media screen and (max-width: 991px) {
    .container.bg-light.py-2.border-bottom {
        display: none;
    }

    .d-flex.justify-content-between.align-items-center.flex-wrap.mobile {
        display: flex !important;
    }

    a.navbar-brand.mobile img {
        width: 100%;
    }

    .container-full.bg-light.py-2.border-bottom.hdr-top {
        display: none;
    }

    .nav-item-in {
        display: block !important;
    }
}

.dropdown-menu.mobile-dd.p-3.collapse {
    display: none;
}

.dropdown-menu.mobile-dd.p-3.collapse.show {
    display: block;
}


.dropdown-menu-custom {
    display: block !important;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease, visibility 0.2s ease;
    position: fixed !important;
    /* Ensures it behaves like a dropdown */
    z-index: 1050;
    /* Makes it visible above other elements */
    --bs-dropdown-zindex: 1000;
    --bs-dropdown-min-width: 10rem;
    --bs-dropdown-padding-x: 0;
    --bs-dropdown-padding-y: 0.5rem;
    --bs-dropdown-spacer: 0.125rem;
    --bs-dropdown-font-size: 1rem;
    --bs-dropdown-color: var(--bs-body-color);
    --bs-dropdown-bg: var(--bs-body-bg);
    --bs-dropdown-border-color: var(--bs-border-color-translucent);
    --bs-dropdown-border-radius: var(--bs-border-radius);
    --bs-dropdown-border-width: var(--bs-border-width);
    --bs-dropdown-inner-border-radius: calc(var(--bs-border-radius) - var(--bs-border-width));
    --bs-dropdown-divider-bg: var(--bs-border-color-translucent);
    --bs-dropdown-divider-margin-y: 0.5rem;
    --bs-dropdown-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    --bs-dropdown-link-color: var(--bs-body-color);
    --bs-dropdown-link-hover-color: var(--bs-body-color);
    --bs-dropdown-link-hover-bg: var(--bs-tertiary-bg);
    --bs-dropdown-link-active-color: #fff;
    --bs-dropdown-link-active-bg: #0d6efd;
    --bs-dropdown-link-disabled-color: var(--bs-tertiary-color);
    --bs-dropdown-item-padding-x: 1rem;
    --bs-dropdown-item-padding-y: 0.25rem;
    --bs-dropdown-header-color: #6c757d;
    --bs-dropdown-header-padding-x: 1rem;
    --bs-dropdown-header-padding-y: 0.5rem;
    min-width: var(--bs-dropdown-min-width);
    padding: var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);
    margin: 0;
    font-size: var(--bs-dropdown-font-size);
    color: var(--bs-dropdown-color);
    text-align: left;
    list-style: none;
    background-color: var(--bs-dropdown-bg);
    background-clip: padding-box;
    border: var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);
    border-radius: var(--bs-dropdown-border-radius);




}

.dropdown-menu-custom.show {
    opacity: 1;
    visibility: visible;
}

.splide__arrow--prev {
    border-radius: 0 !important;
    opacity: 0 !important;

}

.splide__arrow--next {
    border-radius: 0 !important;
    opacity: 0 !important;
}

#related-vehicles-slider:hover .splide__arrow--prev {
    opacity: 1 !important;
    left: -26px !important;
    transition: .8s ease, background-color .8s ease;
    color: #DB2E2D;
    width: 55px;
    height: 55px;
    line-height: 55px;
    border-radius: 50% !important;
    box-shadow: 0 3px 40px 0 #dbe0e8;
    border: 0 solid #fff0;
    background-color: var(--primary);
    cursor: pointer;
    z-index: 2;
    text-align: center;





}

#related-vehicles-slider:hover .splide__arrow--next {
    opacity: 1 !important;
    right: -24px !important;
    transition: .8s ease, background-color .8s ease;
    color: #DB2E2D;
    width: 55px;
    height: 55px;
    line-height: 55px;
    border-radius: 50% !important;
    box-shadow: 0 3px 40px 0 #dbe0e8;
    border: 0 solid #fff0;
    background-color: var(--primary);
    cursor: pointer;
    z-index: 2;
    text-align: center;
}

.splide__slide .car-item .overlay {
    height: 200px !important;
}

.nf-form-content input.ninja-forms-field {
    height: 37px !important;
    border-radius: 6px !important;
}

.wpb_column.vc_column_container.vc_col-sm-8.vc_col-has-fill {
    background: #f5f5f5;
    margin-top: 17px;
}

/*  */

/* For drive good only */

.hdr-top {
    display: none;
}

span.wpml-ls-native {
    /*     color: #fff; */
    font-weight: 600;
}

.d-flex.justify-content-between.align-items-center.flex-wrap.mobile {
    display: none !important;
}

footer .container .row {
    text-transform: uppercase;
    text-align: left;
}


div#cookie-law-info-bar {
    background-color: black !important;
    color: #fff black !important;
}

.sclicon i {
    font-size: 30px;
}

/* contact us */
.contact-us-in {
    background: #f5f5f5;
    padding: 20px 20px 0;
    margin-top: 20px !important;
}

.contact-us-in .nf-before-form-content {
    display: none;
}

.contact-us-in label {
    font-weight: 100 !important;
    font-size: 14px !important;
    color: #000 !important;
    line-height: 20px;
    font-family: "Outfit", Sans-serif !important;
}

.contact-us-in .nf-field-container {
    margin-bottom: 0;
}

.sell-your-car .nf-field-container {
    margin-bottom: 5px !important;
}

.contact-us-in input.ninja-forms-field {
    background: #ffffff !important;
    height: 37px !important;
}

.contact-us-in .ninja-forms-field {
    height: 150px !important;
    background: white !important;
}

.contact-us-right-in {
    margin-top: -20px;
    background-color: #f5f5f5;
}

/* dealer sign up */

.dealer-sign-up-in h2 {
    font-family: "Outfit", Sans-serif !important;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 36px;
    line-height: 46px;
    letter-spacing: 0px;
}

.dealer-sign-up-in p {
    margin: 0;
    font-weight: 400;
    text-transform: none;
    font-size: 14px;
    line-height: 22px;
    letter-spacing: 0px;
    color: #999999;
    font-family: "Outfit", Sans-serif !important;
}

.dealer-sign-up-in h3 {
    font-family: "Outfit", Sans-serif !important;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 28px;
    line-height: 42px;
    letter-spacing: 0px;
}

.dealer-sign-up-frm-in label {
    font-weight: 100 !important;
    font-size: 14px !important;
    color: #000 !important;
    line-height: 20px;
    font-family: "Outfit", Sans-serif !important;
}

.dealer-sign-up-frm-in .nf-field-container {
    margin-bottom: 0;
}

.dealer-sign-up-frm-in input.ninja-forms-field {
    height: 37px !important;
    border-radius: 5px !important;
}

.nf-field-label {
    margin: 0 !important;
}

/* .nf-form-content input:not([type=button]) {
    background: #ffffff !important;
} */

.submit-wrap input {
    background: #000 !important;
    font-size: 14px !important;
    padding: 9px !important;
}

/* cookie */

.cli-bar-container .cli-bar-message {
    font-size: 12px;
}

.cli-bar-message {
    width: 88% !important;
    text-align: left !important;
}

.cli-bar-message a {
    color: #FFFF00;
}

.wpml-ls-current-language span.wpml-ls-native {
    color: #fff;
}



/* blog */
a.premium-blog-excerpt-link.elementor-button {
    font-size: 14px;
    padding-top: 14px;
    padding-bottom: 14px;
    padding-left: 20px;
    padding-right: 20px;
    color: #fff;
    background-color: #f4524d;
}

p.premium-blog-post-content {
    height: 140px;
}

figcaption.widget-image-caption.wp-caption-text {
    color: #000;
    font-size: 14px;
    font-weight: 500;
}

.textwidget li a {
    font-weight: 700;
}

.textwidget li a i {
    font-size: 30px;
}

.chat-button-wrapper {
    /*     display: none; */
}

.ast-header-without-markup .entry-title {
    display: none;
}

.premium-blog-wrap .premium-blog-thumbnail-container {
    height: 200px;
}

.post-thumbnail {
    text-align: center;
}

.post-thumbnail img {
    width: 100%;
}

/* terms-conditions */
.terms-conditions h1 {
    font-family: "Outfit", Sans-serif !important;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 40px;
    line-height: 50px;
    letter-spacing: 0px;
}

.terms-conditions h4 {
    font-family: "Outfit", Sans-serif !important;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: 0px;
}

.terms-conditions h3 {
    font-family: "Outfit", Sans-serif !important;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 28px;
    line-height: 42px;
    letter-spacing: 0px;
}

.nf-error.field-wrap .nf-field-element:after {
    line-height: 34px !important;
    height: 35px !important;
}

.nf-pass.field-wrap .nf-field-element:after {
    line-height: 37px !important;
    height: 35px !important;
}

.filter-title {
    color: #1e293b;
}

.inventory-title-in h2 {
    color: #1e293b;
}

img.dealer-logo[alt="GoPro Auto"],
img.dealer-logo[alt="KSA Auto"],
img.dealer-logo[alt="Auto Via"],
img.dealer-logo[alt="Action VIP Auto"],
img.dealer-logo[alt="GTS Auto"] {
    width: 125px;
    object-fit: cover;
}

/* Tooltip styling */
.tooltip-wrapper {
    display: inline-block;
}

.tooltip {
    display: none !important;
    position: absolute;
    background-color: #333;
    color: #fff;
    padding: 8px;
    border-radius: 4px;
    font-size: 12px;
    width: 250px;
    bottom: 25%;
    left: 55%;
    margin-left: -60px;
    transform: translateX(-50%);
    white-space: normal;
    z-index: 10;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

/* Show tooltip on hover */
.tooltip-wrapper:hover .tooltip {
    display: block !important;
    opacity: 1 !important;
}

span.tooltip-wrapper {
    margin-left: 8px;
    height: 2px;
    display: none !important;
}

.textwith-tooltip {
    display: flex;
    margin-top: 12px;
}

/* Style for tooltip trigger */
.tooltip-trigger {
    font-weight: bold;
    color: #000000;
    bottom: 8px;
    left: -4px;
}

.tooltip-trigger i {
    font-size: 12px;
}

.tooltip-in {
    display: flex;
    justify-content: center;
}

.latest-arrivals-slider.slick-initialized.slick-slider .car-image-wrapper{
    display: flex;
}

/* ================New design============== */
.container-full {
    overflow: hidden;
}

ul.navbar-nav {
    width: 100%;
    /*     justify-content: space-between; */
}

.nav-item-in {
    display: flex;
}

.nav-item-out {
    display: flex;
}

.navbar-brand img {
    height: 70px !important;
    /*     border-radius: 10px; */
    	padding: 12px;
    -webkit-filter: drop-shadow(0px 0px 10px #fff);
    filter: drop-shadow(0px 0px 10px #fff);
}

nav.navbar.navbar-expand-lg.navbar-light.bg-white {
    animation: vehica-slide-down 0.5s;
    box-shadow: 0 2px 7px 0 rgb(196 196 196 / .34);
}

.nav-link {
    color: #000 !important;
    font-weight: 600 !important;
    font-family: "Outfit", Sans-serif !important;
    line-height: 1.75;
}

span.wpml-ls-native {
    color: #000;
}

ul.navbar-nav {
    margin: 0;
}

.form-select:focus {
    border-color: #D3D3D3 !important;
    box-shadow: unset !important;
}

.form-select {
    font-size: 18px !important;
    /*     line-height: 1.85 !important; */
    background-color: #fff !important;
    background-clip: padding-box;
    border: 1px solid #D3D3D3 !important;
    appearance: none !important;
    border-radius: 5px !important;
    box-shadow: unset;
    color: #050B20 !important;
}

input#max-price-filter,
input#min-price-filter {
    font-size: 18px !important;
    /*     line-height: 1.85 !important; */
    background-color: #fff !important;
    background-clip: padding-box;
    border: 1px solid #D3D3D3 !important;
    appearance: none !important;
    border-radius: 5px !important;
    box-shadow: unset;
    color: #050B20 !important;
    padding-left: 12px;
}

input#max-price-filter:focus,
input#min-price-filter:focus {
    border-color: #AAAAAA !important;
}

input#max-price-filter::placeholder,
input#min-price-filter::placeholder {
    color: #050B20 !important;
}

button#reset-btn:hover {
    background-color: var(--primary);
    border-color: var(--primary);
}

button#reset-btn {
    border-radius: 5px !important;
    font-size: 20px
}

.inventory-title-in h2 {
    color: #000000 !important;
    padding: 10px 0;
    margin-left: 0 !important;
    border-bottom: 1px solid #AAAAAA;
    font-family: "Outfit", sans-serif;
}

.inventory-title-in {
    display: block;
    /*     background: #ffffff; */
    text-align: center !important;
    border-radius: 5px 5px 0 0;
}

h5.card-model-year {
    font-family: "Outfit", sans-serif;
    font-size: 18px !important;
    margin: 0;
    font-weight: 500 !important;
    color: #050B20 !important;
}

.card {
    border-radius: 5px;
}

img.card-img-top.car-image {
    border-radius: 5px 5px 0 0;
}

.card {
    border-radius: 5px !important;
}

.image-wrapper .overlay {
    border-radius: 5px 5px 0 0;
}

.card-body {
    padding: 0 !important;
}

.new-card-bottom-in {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /*     padding: 0 10px; */
}

.button-body-cars-in {
    margin: 0 !important;
    padding: 0;
}

h5.card-model-year {
    text-align: left;
}

.car-details-items {
    display: flex;
    justify-content: space-between;
}

span.value-suffix {
    display: block;
    line-height: 1;
    margin-top: 2px;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 400;
    color: #050B20;
    font-family: "Outfit", sans-serif;
}

.chat-button-wrapper {
    margin: 10px 0 !important;
}

.chat-button {
    width: 100%;
    display: block;
}

span.detail-item img {
    width: 22px;
    height: 20px;
    margin-bottom: 5px;
    margin-top: 3px;
}

span.detail-item i {
    font-size: 19px;
}

.finance-button-wrapper {
    margin: 0 !important;
}

.finance-button {
    background-color: transparent !important;
    color: var(--primary) !important;
    padding: 0 !important;
    border-radius: unset !important;
    font-size: 20px;
    font-weight: 500;
    line-height: 2.2;
    font-family: "Outfit", sans-serif;
    text-decoration: underline !important;
}

.card-text-full-in {
    padding: 0 10px;
    margin-bottom: 7px;
}

.border-in {
    border-top: 1px solid #D3D3D3;
    margin: 10px 0;
}

p.new-price {
    color: #050B20;
    font-size: 20px;
    font-weight: 700;
    margin: 0;
    font-family: "Outfit", sans-serif;
}

.card:hover {
    box-shadow: 0 6px 24px 0 rgba(0, 0, 0, 0.05);
}


h5.card-model-year {
    min-height: 45px;
}


input#search-bar {
    display: flex;
    align-items: center;
    border-radius: 5px;
    padding: 12px 20px;
    background: transparent;
    outline: none;
    font-size: 18px;
    color: #333;
    font-family: "Outfit", sans-serif;
    border: 1px solid #AAAAAA !important;
    box-shadow: unset;
}

input#search-bar::placeholder {
    color: #aaa;
}

.active>.page-link,
.page-link.active {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
}

.page-link:hover {
    color: #fff !important;
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

i.bi.bi-arrow-up-right {
    font-size: 12px;
}

.sticky-in {
    position: fixed !important;
    width: 100%;
    z-index: 99;
    padding: 0 !important;
}

footer.bg-dark.text-white.py-5 {
    background: #f5f5f5 !important;
    color: #000 !important;
    /*     box-shadow: 0px -2px 7px 0 rgb(196 196 196 / .34); */
}

.tools a,
.textwidget a {
    color: rgb(0 0 0) !important;
}

.textwidget.custom-html-widget i {
    font-size: 30px;
}

footer .bi {
    margin-right: 5px;
    color: #000000;
}

p.mb-0.footer_copyright a {
    color: rgb(0 0 0) !important;
}

.tools {
    display: flex;
    justify-content: flex-end;
}

img.widget-logo-in {
    width: 130px;
    padding-bottom: 12px;
}

.main-slider img,
.thumbnail-slider img {
    border-radius: 5px;
}

.thumbnail-slider .slick-slide {
    padding: 5px;
}

.thumbnail-slider .slick-current img {
    opacity: 1 !important;
}

.thumbnail-slider img {
    opacity: .5;
}

.car-title {
    line-height: 2.5rem !important;
    letter-spacing: 0;
    margin: 0;
    padding: 0;
    margin-bottom: 5px !important;
    font-size: 30px;
    font-family: "Outfit", sans-serif;
    font-weight: 700;
    color: #050B20;
    letter-spacing: 3px;
}

.sub-title-in {
    display: flex;
}

i.bi.bi-circle-fill {
    font-size: 5px;
    color: #161244;
    align-content: space-around;
    padding: 0 10px;
}

.border-line-in {
    border: 1px solid #AAAAAA;
    margin: 15px 0;
}

.details-list li {
    display: flex;
    justify-content: space-between;
    font-size: 18px !important;
}

.description {
    font-size: 18px !important;
}


span.overview-in i,
span.overview-in img {
    font-size: 16px;
    padding-right: 5px;
    height: 16px;
    display: flex;
    align-items: center;
}

.details-list li {
    font-family: "Outfit", sans-serif;
    font-size: 16px;
}


/* ===================new design======================== */
/* .navbar-bg-white {
    max-width: 100%;
} */
.container-full {
    overflow: hidden;
}

.sticky-in {
    background: #fff !important;
    position: fixed !important;
    /*     border-bottom: unset !important; */
}

.sticky-in .nav-link {
    color: #000 !important;
}

.sticky-in span.wpml-ls-native {
    color: #000 !important;
}

nav.navbar.navbar-expand-lg.navbar-light {
    width: 100%;
    z-index: 9999;
    border-bottom: 1px solid #7548488a;
    background: #fff;
}

:is(.home) nav.navbar.navbar-expand-lg.navbar-light {
    /*     position: absolute; */
    z-index: 99;
    /*     width: 100%; */
    background: #3f3d4e69;
    border-bottom: 1px solid #4040408a;
}


:is(.home) span.wpml-ls-native {
    color: #fff;
}

:is(.home) .sticky-in .nav-link {
    color: #000 !important;
}

.nav-item-in li {
    margin-left: 10px;
    margin-right: 10px;
}

:is(.home) .nav-link {
    /*     font-family: Outfit !important; */
    font-size: 21px !important;
    font-weight: 500 !important;
    color: #fff !important;
}

:is(.home) .carousel-item:after {
    content: '';
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: 0.3;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

:is(.home) .inventory {
    padding: 0;
    margin: 0;
    display: none;
}

:is(.home) .search-home-border {
    padding: 0;
    display: none;
}

:is(.home) select:disabled {
    background-color: #cfcfcf !important;
    color: #696868 !important;
}

:is(.home) .filters select {
    background-color: #fff;
    color: #000000;
    background-image: linear-gradient(45deg, #00000000 50%, #000000 60%), linear-gradient(135deg, #000000 40%, transparent 50%) !important;
    font-size: 20px;
    background-position: calc(100% - 20px) 50%, calc(100% - 15px) 50%;
    height: 55px;
    font-family: "Outfit", Sans-serif !important;
}

:is(.home) .search-container-home {
    padding: 40px 20px 40px 20px;
    background: linear-gradient(148deg, rgb(58 97 112 / 56%) 30%, rgb(92 62 62 / 62%) 45%, rgb(24 23 16 / 35%) 75%);
    /*     border-radius: 15px; */
    box-shadow: 0px 1px 2px 0px rgb(187 184 184 / 5%);
    /* border: 1px solid #d3cece00; */
    /*     margin-top: -215px; */
    margin-top: 0px;
    backdrop-filter: blur(2px);
}

:is(.home) button.search-button {
    border-radius: 5px;
    background: var(--primary);
    color: #fff;
    padding: 10px 25px;
    font-size: 20px;
    font-weight: 500;
    line-height: 35px;
}

:is(.home) .search-button:hover {
    background: #24272C;
}

:is(.home) .hero-sd-home .car-item {
    border-radius: 5px;
    border-width: 1px;
    border-style: solid solid solid;
    border-color: #AAAAAA;
    /*     height: 350px; */
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
}

:is(.home) .slick-slide {
    padding: 6px;
}

:is(.home) .home-title-in h2 {
    font-size: 30px;
    text-transform: uppercase;
    font-style: normal;
    text-align: left;
    font-family: "Outfit", Sans-serif !important;
    font-weight: 600 !important;
    line-height: 38px !important;
    color: #24272C !important;

}

:is(.home) .title-underline-inone {
    border-bottom: 1px solid #EDEDED;
}

.wpml-ls-legacy-list-horizontal a {
    display: flex;
    text-decoration: none;
    padding: 5px 10px;
    line-height: 1;
}

.wpml-ls-legacy-list-horizontal .wpml-ls-item {
    padding: 0;
    margin: 0;
    list-style-type: none;
    display: inline-block;
}

.wpml-ls-legacy-list-horizontal>ul {
    padding: 0;
    margin: 0 !important;
    list-style-type: none;
}

.wpml-ls-legacy-list-horizontal {
    border: 1px solid transparent;
    padding: 7px;
    clear: both;
}

/* .blog-bg-in .premium-blog-post-container {
    background-color: #e5e5e5;
    padding: 8px;
} */
/* .premium-blog-thumb-effect-wrapper {
    border-radius: 10px !important;
} */
/* .blog-cont-in h2 {
    color: #FFFFFF !important;
} */
/* .blog-bg-in a {
    color: #000 !important;
} */
:is(.home) .indu-body-in:hover .wp-caption-text {
    color: #fff !important;
}

:is(.home) .indu-body-in:hover {
    background: #5a5f7173;
    color: #f0f8ff;
    transition-duration: .3s;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
}

:is(.home) .indu-body-in {
    box-sizing: border-box;
    border: 1px solid #AAAAAA;
    border-radius: 5px;
    padding: 10px 0;
    background: #d5d5d5e3;
}

:is(.home) figcaption.widget-image-caption.wp-caption-text {
    color: #24272c;
    font-size: 14px;
    font-weight: 600;
    font-family: "Outfit", Sans-serif !important;
}

:is(.home) .premium-blog-post-container .premium-blog-content-wrapper {
    background-color: transparent !important;
    padding: 0px;
}

:is(.home) .premium-blog-post-container .premium-blog-entry-title {
    font-size: 18px;
    margin-bottom: 5px;
    margin-top: 25px;
}

:is(.home) .blog-cont-in {
    background: #F1F1F1;
}

:is(.home) .blog-bg-in .premium-blog-post-container {
    background-color: #ffffff;
    padding: 30px;
}

:is(.home) .blog-bg-in a {
    color: #000000 !important;
    font-family: "Outfit", Sans-serif !important;
}

:is(.home) .blog-in-tt::after {
    border-color: #000;
}

:is(.home) .blog-cont-in h2 {
    color: #24272c !important;
}

.navbar-bg-white {
    max-width: 1800px;
}

:is(.home) .brands-ing-in img {
    border: 1px solid #AAAAAA !important;
    padding: 10px;
    border-radius: 5px !important;
    box-shadow: 0 1px 2px rgb(0 0 0 / 0%) !important;
}

:is(.home) .brands-ing-in img:hover {
    transition-duration: .3s;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    border: 1px solid #AAAAAA !important;
}

:is(.home) .brands-ing-in img {
    border: 1px solid #AAAAAA !important;
    padding: 10px;
    border-radius: 5px !important;
    box-shadow: 0 1px 2px transparent !important;
    height: 80px !important;
    object-fit: contain;
}

:is(.home) .body-part-title-in {
    background: url(/wp-content/uploads/2025/04/body-part-bg.jpeg) no-repeat center center;
    background-size: cover;
}

:is(.home) .body-part-title-in h2 {
    color: #fff !important;
}

:is(.home) .body-part-items-in figcaption.widget-image-caption.wp-caption-text {
    color: #fff;
}

:is(.home) .blog-bg-in {
    overflow: hidden;
}

.indu-body-in figcaption.widget-image-caption.wp-caption-text {
    color: #fff;
    background: #445a6d;
}

.body-part-items-in .title-underline {
    margin-top: 12px;
}

.bg-dark {
    background-color: #ffffff !important;
    padding-top: 60px !important;
}

footer.bg-dark .container {
    /*     padding-bottom: 60px; */
    max-width: 1140px;
}

.textwidget li a {
    font-family: "Outfit", Sans-serif !important;
    color: #000 !important;
}

.text-white {
    color: rgb(0 0 0) !important;
}

:is(.home) footer .bi {
    margin-right: 5px;
    color: #fff;
}

span.navbar-toggler-icon:after,
span.navbar-toggler-icon:before {
    content: "";
    position: absolute;
    height: 2px;
    width: 28px;
    right: 22px;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    background: #000;
    top: 40%;
}

:is(.home) span.navbar-toggler-icon:after, :is(.home) span.navbar-toggler-icon:before {
    background: #ffffff;
}

.sticky-in span.navbar-toggler-icon:before {
    top: 40%;
}

span.navbar-toggler-icon:after {
    top: 60%;
}

.sticky-in span.navbar-toggler-icon:after {
    top: 60%;
}

span.line-1 {
    position: absolute;
    width: 28px;
    height: 2px;
    overflow: hidden;
    text-indent: 200%;
    background: #ffffff;
    right: 22px;
    top: 45px;
}

.navbar-toggler-icon {
    background-image: unset;
}

button.navbar-toggler.collapsed:focus {
    background-color: unset !important;
    border: unset !important;
    box-shadow: unset !important;
}

button.navbar-toggler {
    background: unset !important;
    border: unset;
    box-shadow: unset !important;
}

img.widget-logo-in {
    width: 130px;
    -webkit-filter: drop-shadow(2px 2px 6px #100e42c7);
    filter: drop-shadow(2px 2px 6px #100e42c7);
    margin-left: -10px;
}

:is(.home) .share-in {
    color: #000 !important;
}

.share-in {
    font-weight: 700;
    font-family: "Outfit", Sans-serif !important;
    color: #000 !important;
    margin-top: 20px;
}

/* :is(.home) .car-details h3 {
    font-size: 18px !important;
} */
:is(.home) .car-price {
    margin-top: 0;
}

.wpml-ls-legacy-list-horizontal .wpml-ls-flag+span {
    margin-left: .4em;
}

.navbar-nav {
    gap: 0px;
}

@media screen and (max-width: 991px) {
    .bg-dark {
        text-align: center;
    }

    :is(.home) .nav-link {
        color: #000 !important;
    }

    div#navbarNav {
        background: #fff !important;
        /* background: linear-gradient(to bottom, #ffffff, #ffffff, #e3e3e3, #e3e3e3c4) !important; */
        position: absolute;
        right: 0;
        margin: 0;
        overflow: auto;
        width: 100%;
        top: 86px;
        z-index: 9999;
        border-bottom: 1px solid #AAAAAA;
    }

    #search-box.search-dropdown {
        position: fixed;
        /* absolute thakle parent-er upor depend kore, fixed diye screen-er top-a boshe */
        top: 90px;
        left: 0;
        width: 100vw;
        full viewport width background: #fff;
        /* optional: background jeno content clear thake */
        z-index: 9999;
        /* ensure it stays on top */
        padding: 1rem;
        display: flex;
        justify-content: center;
        /* horizontally center contents */
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
        /* optional: shadow for separation */
    }

    .mobile-search-in {
        display: flex;
    }

    #search-box .search-container {
        width: 100%;
    }

    .nav-link i {
        color: #000;
    }

    .nav-item-in {
        padding: 15px 15px 20px;
    }

    .icon-cl-in i {
        color: #000;
        padding-right: 5px;
    }

    :is(.home) .bg-dark {
        text-align: center;
    }

    :is(.home) .home-title-in h2 {
        text-align: center;
    }

    .nav-item-in a {
        color: #000 !important;
    }

    .mobile-search-section.d-flex.align-items-center {
        margin-top: 2px;
        margin: 0 auto !important;
    }

    .navbar-toggler-icon {
        background-image: unset !important;
    }

    .nav-item-in a:hover {
        color: #000000bd !important;
    }
}

@media screen and (min-width: 992px) {
    :is(.home) .nav-item-in {
        display: flex;
    }

    .collapse.navbar-collapse.mail-move-in {
        display: block !important;
    }

    .nav-item-in {
        display: flex;
        margin: 0 auto;
    }

    .icon-cl-in i {
        display: none !important;
    }

    .nav-item-in {
        display: flex;
		gap: 20px;
    }
}


.search-bar {
    /*     border: 8px solid #a4a4a4; */
    padding: unset !important;
    border-radius: 5px;
    background: #a4a4a4;
    box-shadow: 0 0 6px 6px #a6a6a6;
}

#reset-btn {
    background: var(--primary);
    border-color: var(--primary);
}

button#search_bar_btn {
    border-radius: 0px 5px 5px 0px;
    font-size: 20px;
    font-family: 'Outfit';
    background: var(--primary);
    border: unset;
}


button#search_bar_btn:hover {
    background: var(--primary)ad;
}

input#search-bar {
    border-radius: 5px;
    border: 0;
    width: 100%;
}

.nav-item .nav-link {
    font-family: "Outfit", sans-serif !important;
    font-size: 21px;
    font-weight: 500;
}

option {
    text-transform: capitalize;
    font-family: "Outfit", sans-serif !important;
}

.form-select {
    text-transform: capitalize;
    font-family: "Outfit", sans-serif !important;
}






.wpml-ls-legacy-list-horizontal {
    font-size: 18px;
}

#heroCarousel img {
    height: 100vh;
    object-fit: cover;
}

.wpml-ls-current-language {
    display: none !important;
}



@media only screen and (max-width: 768px) {
    :is(.home) .search-container-home {
        /*     margin-top: -415px; */
        margin-top: 0px;
    }

    .sticky-in span.navbar-toggler-icon:after,
    .sticky-in span.navbar-toggler-icon:before {
        background: #000;
    }
}







/* ---------------------------------footer CSS ----------------------------------------------- */

/* Footer Styles */
.commissaudio-footer {
    font-family: "Outfit", Sans-serif !important;
    color: #ffffff;
    background-color: #121212;
    position: relative;
    overflow: hidden;
}

.commissaudio-footer .container {
    position: relative;
    z-index: 2;
}

.footer-top-section {
    padding: 60px 0 40px;
    background: linear-gradient(135deg, #1a1a1a 0%, #000000 100%);
    position: relative;
}

.footer-top-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, var(--primary), #c2c3c4);
}

.footer-promo-banner {
    display: flex;
    flex-wrap: wrap;
    /*     gap: 30px; */
}

.promo-left {
    padding-right: 30px;
    border-right: 1px solid #fff;
}

.promo-content {
    max-width: 500px;
}

.tagline-badge {
    display: inline-block;
    background-color: rgb(249 249 249 / 72%);
    color: #030602a8;
    padding: 5px 15px;
    border-radius: 5px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1px;
    margin-bottom: 20px;
    text-transform: uppercase;
    /* joy add */
    font-family: "Outfit", Sans-serif !important;
}

.promo-question {
    font-size: 20px;
    font-weight: 600;
    color: #000;
    margin-bottom: 15px;
}

.promo-headline {
    font-size: 32px;
    font-weight: 700;
    line-height: 1.3;
    margin: 15px 0 25px;
    background: linear-gradient(90deg, #ffffff, #cccccc);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    /* joy add */
    font-family: "Outfit", Sans-serif !important;
}

.partner-badge {
    position: absolute;
    padding-left: 30px;
    top: -15px;
    left: 30%;
    display: none;
}

@media screen and (max-width: 1230px) {
    .partner-badge {
        position: unset;
        padding-right: 40px;
        padding-left: 0px;
        top: unset;
        left: unset;
    }
}

.contact-info {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin: 10px 0;
}

.contact-info span {
    display: flex;
    align-items: center;
    /*     gap: 8px; */
    font-size: 15px;
    /* joy add */
    font-family: "Outfit", Sans-serif !important;
}

.contact-info i {
    color: #fff;
}

.social-icons {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 25px;
}

.social-icons a {
    display: flex;
    align-items: center;
    gap: 5px;
    color: #ffffff;
    text-decoration: none;
    transition: all 0.3s ease;
    font-weight: 500;
    /* joy add */
    font-family: "Outfit", Sans-serif !important;
}

.social-icons a:hover {
    color: #ffa500;
}

.social-icons i {
    font-size: 14px;
}

.arrow {
    margin-left: 5px;
    transition: transform 0.3s ease;
}

.social-icons a:hover .arrow {
    transform: translateX(3px);
}

.footer-column {
    margin-bottom: 30px;
}

.footer-title {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 25px;
    position: relative;
    padding-bottom: 10px;
}

.footer-title span {
    position: relative;
    display: inline-block;
    color: #fff;
    background: linear-gradient(90deg, #ffffff, #cccccc);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: "Outfit", Sans-serif !important;
}

.footer-title::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 150px;
    height: 3px;
    background: linear-gradient(90deg, #016fbbc9, #016fbb59);
}

.footer-menu {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-menu li {
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    color: #bbbbbb;
    transition: all 0.3s ease;
    font-family: "Outfit", Sans-serif !important;
    line-height: 1.5;
}

.footer-menu li:hover {
    color: #ffffff;
    transform: translateX(5px);
}

.footer-menu i {
    color: #ffa500;
    font-size: 10px;
}

.footer-copyright {
    padding: 25px 0;
    background-color: #000000;
    text-align: center;
    border-top: 1px solid #333333;
}

.copyright-content p {
    margin: 0;
    color: #888888;
    font-size: 14px;
    /* joy add */
    font-family: "Outfit", Sans-serif !important;
}

.highlight {
    color: var(--primary);
    font-weight: 600;
}

/* Responsive Styles */
@media (max-width: 992px) {
    .promo-left {
        /*         padding-right: 0; */
        margin-bottom: 40px;
    }

    .promo-headline {
        font-size: 28px;
    }
}

@media (max-width: 768px) {
    .footer-promo-banner {
        flex-direction: column;
    }

    .promo-headline {
        font-size: 24px;
    }

    .footer-title {
        font-size: 18px;
    }

    :is(.home) span.wpml-ls-native {
        color: #fff !important;
    }

    :is(.home) .sticky-in span.wpml-ls-native {
        color: #000 !important;
    }

    .search-hide-in {
        display: none !important;
    }
}

@media (max-width: 576px) {
    .contact-info {
        flex-direction: column;
        gap: 10px;
    }

    .social-icons {
        gap: 10px;
    }

    .promo-headline {
        font-size: 22px;
    }
}

a.quick_links {
    color: #bbb;
}

a.quick_links:hover {
    color: #fff !important;
}

/* joy/arif vai */

.car-info {
    display: flex;
    justify-content: space-between;
}

h3.related-car-title {
    font-family: "Outfit", sans-serif;
    font-size: 17px !important;
    margin: 0;
    font-weight: 500;
    color: #050B20;
    padding: 10px 0px;
}

.car-price {
    color: #050B20;
    font-size: 20px;
    font-weight: 700;
    margin: 0;
    font-family: "Outfit", sans-serif !important;
    margin-bottom: 0px !important;
}

span.price-weekly-in {
    color: #050B20;
    font-size: 18px;
    font-weight: 700;
    margin: 0;
    font-family: "Outfit", sans-serif;
}

.car-item {
    border-radius: 5px !important;
    border: 1px solid #AAAAAA;
}

.car-info img {
    width: 16px !important;
    height: 16px !important;
    margin-bottom: 10px !important;
    margin-top: 7px !important;
    margin: 0 auto;
}

.car-info i {
    font-size: 19px;
    color: #000;
}

div#ast-scroll-top {
    background-color: var(--primary) !important;
}

a.contact_dealer {
    background: var(--primary) !important;
    border-radius: 5px !important;
    font-family: "Outfit", sans-serif;
}

a.contact_dealer:hover {
    background: #ffffff !important;
    color: var(--primary);
    border: 1px solid;
}

.car-details {
    padding: 10px 10px;
}

:is(.home) .car-details h3 {
    font-size: 17px !important;
    letter-spacing: 0;
    font-family: 'Outfit';
}

.card {
    border-color: #D3D3D3 !important;
}

span.maker-highlight,
.year-highlight {
    font-family: "Outfit", sans-serif;
    font-size: 18px;
}

.splide__arrow svg {
    fill: #ffffff !important;
}

.car-info span {
    padding: 0 2px;
}

.contact-title-in h2 {
    font-size: 2.25rem !important;
    line-height: 2.5rem !important;
    font-weight: 700 !important;
    color: rgb(20 28 45) !important;
    font-family: "Outfit", Sans-serif !important;
}

.contact-description-in p {
    font-size: 1.125rem;
    line-height: 1.75rem;
    color: #000;
    font-family: "Outfit", Sans-serif !important;
    margin-bottom: unset !important;
}

.contact-left-in h6 {
    font-size: 1.5rem;
    line-height: 2rem;
    color: #000 !important;
    font-family: 'Outfit' !important;
}

.contact-left-in svg {
    font-size: 1.5rem;
    line-height: 2.25rem;
    /*     margin-top: 5px; */
}

.contact-left-in .elementor-widget-icon-box.elementor-position-left .elementor-icon-box-wrapper {
    align-items: center;
}

.contact-left-in p {
    font-size: 16px;
    color: #000 !important;
    font-family: "Outfit", Sans-serif !important;
}

.contact-left-in h6 {
    font-size: 1.5rem !important;
    line-height: 2rem !important;
    font-weight: 700;
    font-family: "Outfit", Sans-serif !important;
}

.contact-right-main-in h2 {
    font-size: 2.25rem;
    line-height: 2.5rem;
    color: rgb(20 28 45) !important;
    font-family: "Outfit", Sans-serif !important;
}

.contact-right-main-in .nf-form-fields-required {
    font-size: 1.25rem;
    line-height: 1.75rem;
    font-weight: 500;
    font-family: "Outfit", Sans-serif !important;
}

.contact-right-main-in .nf-form-content {
    background-color: rgb(247 247 247);
    padding: 1.5rem;
    border-width: 1px;
    border-radius: .5rem;
    font-family: "Outfit", Sans-serif !important;
    /*     margin-top: 2rem; */
}

.contact-right-main-in .nf-field-container {
    margin-bottom: 10px;
}

.contact-right-main-in .nf-form-content label {
    font-size: 18px;
    font-family: "Outfit", Sans-serif !important;
    font-weight: 400;
}

.contact-right-main-in textarea,
.contact-right-main-in input {
    background: #ffffff !important;
}

.contact-right-main-in .nf-form-fields-required {
    display: none;
}

.rc-anchor-dark .rc-anchor-logo-text,
.rc-anchor-dark div a:link,
.rc-anchor-dark div a:visited {
    color: #000000 !important;
}

.rc-anchor-dark.rc-anchor-normal,
.rc-anchor-dark.rc-anchor-compact {
    border: 1px solid #ffffff !important;
}

.rc-anchor-dark {
    background: #ffffff !important;
    color: #000000 !important;
}

.nf-form-content input[type=submit] {
    background: var(--primary) !important;
    padding: 24px !important;
    border-radius: 5px !important;
    color: #fff !important;
    display: inline-block;
    font-size: 20px !important;
    line-height: 0 !important;
    fill: #fff;
    text-align: center;
    transition: all .3s ! IMPORTANT;
    font-family: "Outfit", Sans-serif !important;
    width: 100% !important;
}

.submit-container input:hover {
    background: #000000 !important;
}

.contact-right-main-in textarea {
    height: 128px !important;
    border-radius: 6px;
}

.nf-form-cont h2 {
    font-size: 35px !important;
    font-weight: 400 !important;
}

.nf-form-cont label {
    font-weight: 400 !important;
    font-size: 18px !important;
}

/* End joy/arif vai */


.contact-info-address {
    display: flex;
    flex-wrap: wrap;
    gap: 0px;
    margin: 0px;
}

.address a {
    color: #fff;
    /* joy add */
    font-family: "Outfit", Sans-serif !important;
}

a.twitter, a.insta {
    display: none;
}

display: none !important;
}

.drive-trim {
    display: none !important;
}

.price-weekly-in {
    display: none !important;
}

.car-old-price {
    display: none !important;
}

footer .address i {
    color: #fff;
}

.contact-info span a {
    color: #fff;
}


.nf-form-fields-required {
    display: none !important;
}



.why-aj:hover {
    transform: scale(1.3);
}

.explore-vehicle-type:hover figcaption {
    color: white !important;
    transition: color 0.3s ease;
}

.explore-vehicle-type:hover {
    background: var(--primary) !important;
}

.home-brands:hover h5 {
    color: white !important;
    transition: color 0.1s ease;
}

.home-brands:hover {
    background: var(--primary);
    transition: color 0.3s ease;
    border-radius: 5px;
}

@media (min-width: 1400px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1650px !important;
    }
}

@media (min-width: 1201px) and (max-width: 1399px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl {
        max-width: 1370px !important;
    }
}

@media (min-width: 993px) and (max-width: 1199px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm {
        max-width: 1170px !important;
    }
}


.home-brands .elementor-widget-container {
    padding: 20px 0px !important;
}



.why-aj-grid .elementor-widget-container {
    min-height: 328px !important;
}


.wpml-ls-flag {
    display: none !important;
}


.nav_phone_location {
    background: var(--primary);
    margin: 3px;
    border-radius: 5px;
    padding: 0px 5px;
}


.sticky-in .nav_phone_location {
    background: unset;
    margin: unset;
    border-radius: unset;
    padding: unset;
}


.nav_phone_location i.bi {
    color: #ffffff;
}

.nav_phone_location:hover {
    background: #5a5555;
    transition: background 0.3s ease-in;
}



.sticky-in .nav_phone_location i.bi {
    color: #000;
    padding-right: 2px;
}

.sticky-in .nav_phone_location:hover {
    background: #5a5555;
    border-radius: 5px;
}

nav.navbar.navbar-expand-lg.navbar-light.sticky-in {
    padding: 10px 0px !important;
}


input#search-bar {
    border-radius: 5px 0 0 5px;
    border: 0;
    width: 83.33%;
    background: #fff;
    height: 50px;
    font-size: 22px;
}



a.dev-link {
    color: var(--primary);
}

a.site-title-link {
    color: var(--primary);
}


.page-item:first-child .page-link Specificity: (0, 3, 0) {
    border-radius: 5px;
}

.page-item:not(:first-child) .page-link {
    border-radius: 5px;
    width: 40px;
    text-align: center;
}

.page-item:first-child .page-link {
    border-radius: 5px;
}


/* @media (max-width: 600px) {
	.sticky-in .nav_phone_location{
		background: var(--primary);
		margin: 3px;
		border-radius: 5px;
		padding: 0px 5px;
	}
	.nav_phone_location i.bi {
		color: #ffffff !important;
	}
} */

@media (max-width: 678px) {
    :not(.home) .nav_phone_location i.bi {
        color: #000;
    }

    .wpml-ls-legacy-list-horizontal {
        padding: unset !important;
    }
}

@media (max-width: 600px) {
    .sticky-in .nav_phone_location {
        /* 	background: #238DFB;
		margin: 3px;
		border-radius: 5px; */
        padding: 0px 5px;
    }

    :is(.home) .nav_phone_location i.bi {
        color: #fff !important;
    }

    .sticky-in .nav_phone_location i.bi {
        color: #000 !important;
    }
}

p.drive-trim {
    text-align: left;

}

@media (min-width: 768px) {
    p.drive-trim {
        min-height: 25px;
    }
}


/* new update design */
.inventory-title-in {
    display: none;
}

i.bi.bi-search {
    display: none;
}

.search-hide-in {
    display: none;
}

span.detail-item i {
    color: var(--primary);
}

.car-info i {
    color: var(--primary);
}

/* @media (max-width: 678px) {
	.location-mobile-in{
		display: none !important;
	}
	a.navbar-brand.mobile {
		width: 215px;
	}
} */

@media (max-width: 678px) {
    /* 	.location-mobile-in{
		display: none !important;
	}
	a.navbar-brand.mobile {
		width: 130px;
	} */

    .nav_phone_location {
        background: unset;
        margin: unset;
        border-radius: unset;
        padding: 0px 5px;
    }
}


span.overview-in {
    display: flex;
    align-items: center;
}



.home_page_h3 h3 {
    font-size: 40px !important;
    color: var(--primary) !important;
    margin-bottom: 0px !important;
    font-weight: 500 !important;
    font-family: 'Outfit' !important;
}

.home_page_h2 h2 {
    font-size: 35px !important;
    margin-bottom: 0px !important;
    font-weight: 400 !important;
    font-family: 'Outfit' !important;
}

.brand-in img {
    -webkit-filter: drop-shadow(0px 0px 10px #fff);
    filter: drop-shadow(0px 0px 10px #fff);
}


:is(.home) span.elementor-icon.elementor-animation- {
    background-color: var(--primary) !important;
}

.how_does_it_works {
    background: var(--primary);
}

.custom_devider {
    --divider-color: var(--borderColor) !important;
}


:is(.home) .home_buttons a:hover {
    background: var(--primary) !important;
}

.blue {
    color: var(--primary);
}

.privacy_terms_links {
    color: var(--primary);
    font-weight: 600;
}

.privacy_terms_links:hover {
    color: var(--primary)ad;
}

.contact_page_icons .elementor-icon-box-icon span {
    fill: var(--primary) !important;
}

.nf-response-msg {
    font-size: 20px;
}


#custom-calculator {
    /* 	display: none; */
}



@media (max-width: 360px) {
    .location-mobile-in {
        display: none;
    }

    .wpml-ls-legacy-list-horizontal a {
        padding: 5px 3px !important;
    }

    .wpml-ls-legacy-list-horizontal .wpml-ls-flag+span {
        margin-left: 0 !important;
    }
}

@media (max-width: 767px) {

    .fb-mobile-in,
    .insta-mobile-in {
        display: none;
    }
}

.promo-left a:focus,
.promo-right a:focus {
    color: #fff;
}

@media (max-width: 600px) {
    .slider-text {
        margin-top: -20px !important;
    }

    :is(.home) .search-container-home {
        padding: 20px;
    }

    .search-container-home .container {
        --bs-gutter-x: unset;
    }

    .custom-slider {
        height: 65vh !important;
    }

    nav.navbar.navbar-expand-lg.navbar-light {
        padding: 10px 0px;
    }

}



a.site-title-link:focus,
a.dev-link:focus,
a.privacy_terms_links:focus {
    color: #b1c2d5;
}

:is(.home) .home_buttons a:focus {
    background: var(--primary) !important;
}

.promo-left a:focus,
.promo-right a:focus,
a.slider-btn:focus {
    color: #fff;
}





/*added by kayum*/
@media screen and (min-width: 1082px) and (max-width: 1254px) {
    div#car-count {
        font-size: 40px !important;

    }

}

@media screen and (min-width: 992px) and (max-width: 1096px) {
    button#search_bar_btn {
        font-size: 16px !important;
        ;
    }

    input#search-bar {
        font-size: 16px !important;
        ;
    }

    div#car-count {
        font-size: 38px !important;

    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {

    .container,
    .container-md,
    .container-sm {
        max-width: 960px !important;
    }

    div#car-count {
        font-size: 28px !important;
    }

    button#search_bar_btn {
        font-size: 14px !important;
    }

    input#search-bar {
        font-size: 14px !important;
    }

    .col-md-2 {
        width: 18.666667% !important;
    }

    input#search-bar {
        width: 81.33% !important;
    }

}

@media screen and (min-width: 601px) and (max-width:800px) {
    .finance-button {
        font-size: 16px !important;
    }

    p.new-price {
        font-size: 16px !important;
        ;
    }
}

@media screen and (min-width: 1025px) and (max-width: 1200px) {
    .finance-button {
        font-size: 15px !important;
    }

    p.new-price {
        font-size: 15px !important;
        ;
    }

}

















/* #latest_car_price_new_style {
    box-sizing: border-box;
}

#latest_car_price_new_style .price-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
/*     gap: 12px; * /
    width: 100%;
}

#latest_car_price_new_style .price-left {
    display: flex;
    flex-direction: column;
	align-items: flex-start;
/*     gap: 4px; * /
    min-width: 0;
	line-height: 20px;
}

#latest_car_price_new_style .retail-price {
    color: #9b9b9b;
    font-size: 13px;
    text-decoration: line-through;
    font-weight: 700;
}

#latest_car_price_new_style .main-price {
    color: var(--primary);
    font-size: 28px;
    font-weight: 800;
    line-height: 1;
}

#latest_car_price_new_style .weekly-box {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    min-width: 120px;
	line-height: 20px;
	
}

#latest_car_price_new_style .est-label {
    color: #666;
    font-weight: 700;
    font-size: 12px;
    margin-bottom: 2px;
    text-align: right;
}

#latest_car_price_new_style .est-amount {
    color: var(--primary);
    font-size: 22px;
    font-weight: 800;
    display: flex;
    align-items: baseline;
/*     gap: 6px; * /
}

#latest_car_price_new_style .est-amount .per {
    font-size: 12px;
    color: #333;
    margin-left: 4px;
    font-weight: 700;
}

#latest_car_price_new_style .apr {
    font-size: 11px;
    color: var(--primary);
    margin-top: 4px;
    text-align: right;
}

#latest_car_price_new_style .retail-price-label {
    color: #666;
    font-weight: 700;
    font-size: 14px;
} */

@media(max-width:1023px) {
    #latest_car_price_new_style .price-row {
        flex-direction: row;
        align-items: flex-start;
        /*         gap: 6px; */
    }

    #latest_car_price_new_style .weekly-box {
        align-items: flex-end;
    }

    #latest_car_price_new_style .est-label,
    #latest_car_price_new_style .apr {
        text-align: left;
    }
}



.nf-mp-header,
.nf-mp-footer {
    display: none;
}

@media(max-width:550px) {
    .nf-form-content input[type=submit] {
        font-size: 16px !important;
    }
}

.carfax_hide {
    display: none;
}

.carfax_button {
    height: 45px;
}


.header-logo-rob {
    display: flex;
    align-items: center;
}


@media(max-width:1200px) {
    .full_address_rob {
        display: none;
    }
}


/* Default (below 1540px) */
.full_address_rob br {
    /*     display: none; */
}


/* At 1540px and above */
@media (min-width: 1541px) {
    .full_address_rob.fr br {
        display: block;
    }
}

@media (min-width: 1400px) {
    .full_address_rob.en br {
        display: block;
    }

    a.full_address_rob {
/*         display: none; */
    }
}




a.full_address_rob {
/*     display: none; */
}

@media (min-width: 1400px) {
    a.full_address_rob.fr {
        display: block;
    }

    .location-mobile-in.fr {
/*         display: none; */
    }
}

@media (min-width: 1300px) {
    a.full_address_rob.en {
        display: block;
    }

    .location-mobile-in.en {
/*         display: none; */
    }
}


/* #ast-scroll-top {
	bottom: 85px;
} */


/* react-style added by binu */
:root {
    --primary: #016fbb;
	--borderColor: #016fbbad;
    --title: #050b20;
    --subTitle: #666666;
}

.splide__track {
    padding-top: 0;
    padding-bottom: 8px;
}

/* Add left space to first visible slide */
.splide__slide:first-child {
    margin-left: 4px !important;
}

/* Add right space to last visible slide */
.splide__slide:last-child {
    margin-right: 4px !important;
}



/* Custom Carfax logo for specs section */
.carfax-logo-spec {
    display: flex;
    justify-content: start;
    align-items: start;

}

/* Custom classes for Details mobile blocks */
.details-subtitle-regular {
    display: none;
    display: block;
    padding-top: 16px;
    padding-bottom: 0;
}

.details-subtitle-special {
    display: block;
    padding-top: 4px;
    padding-bottom: 0;
}


@media screen and (min-width: 768px) {
    .details-subtitle-special {
        display: none !important;
    }

}

@media screen and (min-width: 768px) {
    .details-subtitle-regular {
        display: none;
    }

}


.detail-pricing {
    display: flex !important;
    justify-content: space-between !important;
    align-items: start !important;
    gap: 10px !important;
}

.retail-price-label {
    /* display: none; */
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 24px !important;
    font-family: 'Outfit', sans-serif !important;
    color: #666 !important;

}

.retail-price {
    font-size: 16px !important;
    font-weight: 600 !important;
    text-decoration: line-through;
    font-family: 'Outfit', sans-serif !important;
    color: #8a8a8a !important;
}

.apr {
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 24px !important;
    font-family: 'Outfit', sans-serif !important;
    color: #777 !important;
}

.total_price_amount {
    font-size: 36px !important;
    line-height: 36px !important;
    font-weight: 800 !important;
    font-family: 'Outfit', sans-serif !important;
    color: var(--primary) !important;
}

html,
body,
#root {
    font-family: "Outfit", sans-serif !important;
}

/* Chat button shared styles */
.chat_button {
    display: flex;
    width: 100%;
    padding: 0.5rem 1rem;
    /* py-2 px-4 */
    margin-bottom: 0.5rem;
    margin-top: 0;
    /* my-2 */
    justify-content: center;
    align-items: center;
    gap: 0.375rem;
    /* gap-1.5 */
    border-radius: 5px !important;
    /* rounded-sm */
    background-color: var(--primary) !important;
    color: #fff !important;
    font-size: 1.125rem;
    /* text-lg */
    border: 1px solid transparent;
    transition: color 0.2s, background-color 0.2s, border-color 0.2s;
    height: 45px;
    --circle-color: white;
    --bolt-color: var(--primary);
}

.chat_button:hover {
    background-color: #fff !important;
    color: #000 !important;
    border-color: var(--primary);
    --circle-color: black;
    --bolt-color: white;
}

/* Price special block (3 horizontal rows) */
.price-row-special {
    /* display: none; */
    display: flex;
    flex-direction: row !important;
    justify-content: space-between;
}

.price-row-special__row {
    display: flex;

    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    line-height: 1;
}

.price-row-special__label {
    color: #666666;
    font-weight: 700;
    font-size: 13px;
    margin-top: 10px;
    font-family: 'Roboto', sans-serif;
    line-height: 1.2;
}

.price-row-special__old-price {
    color: #9b9b9b;
    font-size: 15px;
    text-decoration: line-through;
    font-weight: 700;
    /* 	min-height: 1.25rem; */
    font-family: 'Roboto', sans-serif;
    line-height: 1.2;
}

.price-row-special__main-price {
    color: var(--primary);
    font-size: 23px;
    line-height: 2.5rem;
    font-weight: 800;
    font-family: 'Roboto', sans-serif;
}

.price-row-special__weekly {
    display: flex;
    justify-content: flex-start;
    align-items: baseline;
    white-space: nowrap;
    font-family: 'Roboto', sans-serif;
}

.price-row-special__weekly-amount {
    color: var(--primary);
    font-size: 28px;
    font-weight: 800;
}

.price-row-special__weekly-unit {
    font-size: 0.875rem;
    color: #333333;
    text-align: center;
    font-weight: 700;
}

.price-row-special__rate {
    font-size: 0.75rem;
    color: var(--primary);
    margin-top: 0.25rem;
}

/* Related Vehicle Price Row Special (duplicate for VehiclesSlide) */
.related_vehicle_price-row-special {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.related_vehicle_price-row-special__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0;
    margin: 0;
    line-height: 1;
}

.related_vehicle_price-row-special__label {
    color: #666666;
    font-weight: 700;
    font-size: 13px;
    margin: 0;
    padding-top: 10px;
    line-height: 1.2;
}

.related_vehicle_price-row-special__old-price {
    color: #9b9b9b;
    font-size: 15px;
    text-decoration: line-through;
    font-weight: 700;
    min-height: 0;
    line-height: 1.2;
    margin: 0;
    padding: 0;
}

.related_vehicle_price-row-special__main-price {
    color: var(--primary);
    font-size: 23px;
    line-height: 1.2;
    font-weight: 800;
    margin: 0;
    padding: 0;
    font-family: 'Roboto', sans-serif;
}

.related_vehicle_price-row-special__weekly {
    display: flex;
    justify-content: flex-start;
    align-items: baseline;
    white-space: nowrap;
}

.related_vehicle_price-row-special__weekly-amount {
    color: var(--primary);
    font-size: 28px;
    font-weight: 800;
    line-height: 1;
    margin: 0;
    padding: 0;
}

.related_vehicle_price-row-special__weekly-unit {
    font-size: 13px;
    color: #333333;
    text-align: center;
    font-weight: 700;
}

.related_vehicle_price-row-special__rate {
    font-size: 0.75rem;
    color: var(--primary);
    margin: 0;
    padding: 0;
    line-height: 1.2;
}

.related_vehicle_carfax-finance-row {
    /* display: none; */
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    border-bottom: 1px solid #D3D3D3;
    padding-bottom: 16px;
}

/* Car title */
.car-title {

    font-weight: 500;
    line-height: 21.6px !important;
    color: var(--title);
    font-size: 20px;
    letter-spacing: 0 !important;
    height: 48px;

}

@media (min-width: 1024px) {
    .car-title {
        font-size: 1.25rem;
    }
}

/* Car trim */
.car-trim {
    font-size: 16px;
    color: #333333;
    margin-bottom: 0.25rem;
    height: 1.25rem;
    font-family: 'Roboto', sans-serif;
}

/* Specs row */
.car-specs {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #D3D3D3;
    border-bottom: 1px solid #D3D3D3;
    padding: 0.5rem 2.5px;
    gap: 0.25rem;

}

@media (min-width: 1024px) {
    .car-specs {
        /* padding-left: 0.625rem;
		padding-right: 0.625rem; */
        gap: 1rem;
    }
}

.car-specs__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    margin: 0 5px;
}

.car-specs__icon {
    width: 19px;
    height: 19px;
}

.car-specs__icon--primary {
    color: #046bd2;
}

.car-specs__text {
    font-size: 14px;
    color: var(--title);
    white-space: nowrap;
}

.car-specs__icon--gearbox {
    display: block;
    background-image: var(--gearbox-icon-url);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.car-specs__icon--interior {
    display: block;
    background-image: var(--interior-color-icon-url);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}


/* Carfax + Finance row */
.carfax-finance-row {
    /* display: none; */
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0.5rem;
    margin-bottom: 0;
    border-bottom: 1px solid #D3D3D3;
    padding-bottom: 16px;
    gap: 4px;
}

.carfax-logo img {
    width: 118px;
}

/* Price / finance row */
.price-row-regular {
    padding: 0.5rem 0.625rem;
    /* py-2 lg:px-2.5 */
    border-bottom: 1px solid #D3D3D3;
    /* display: flex; */
    display: none;
    justify-content: space-between;
    align-items: center;
    gap: 0.25rem;
}

@media (min-width: 1024px) {
    .price-row-regular {
        gap: 0.5rem;
        /* lg:gap-2 */
    }
}

.price-value {
    font-size: 1rem;
    /* text-base */
    color: var(--title);
    font-weight: 700;
}

@media (min-width: 1024px) {
    .price-value {
        font-size: 1.25rem;
        /* lg:text-xl */
    }
}

.finance-link {
    display: inline-flex;
    align-items: center;
    /* gap: 0.5rem; */
    cursor: pointer;
    background: transparent;
    padding-top: 0.25rem;
    /* py-1 */
    padding-bottom: 0.25rem;
    color: var(--primary);
    font-weight: 500;
    font-size: 1rem;
}

@media (min-width: 768px) {
    .finance-link {
        font-size: 1.25rem;
        /* md:!text-xl */
    }
}

.finance-text {
    text-decoration: underline;
    text-underline-offset: 0.25rem;
    text-decoration-color: var(--primary);
}

/* Detail page buttons */
.finance_btn,
.contact_us_btn,
.details_complete_btn {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 3rem;
    padding: 5px 0;
    border-radius: 4px;
    font-size: 22px;
    font-weight: 700;
    background-color: var(--primary);
    color: #ffffff;
    border: 1px solid transparent;
    cursor: pointer;
    transition: background-color 0.2s, color 0.2s, border-color 0.2s;
}

.finance_btn:hover,
.contact_us_btn:hover,
.details_complete_btn:hover {
    background-color: #ffffff;
    color: var(--primary);
    border-color: var(--primary);
}

.finance_btn {
    margin-bottom: 2px;
}

.contact_us_btn {
    margin-top: 2px;
    margin-bottom: 0.5rem;
}

.details_complete_btn {
    margin-bottom: 2px;
}


a.car-item-link.slick-slide .interior {
    /* display: none; */
}

a.car-item-link.slick-slide .stock_number {
    display: none;
}


/* Related Vehicle Card Styles */
.related_vehicle_regular {
    padding-bottom: 10px;
    text-align: center;
}

.related_vehicle__title_regular {
    height: 40px;
    font-weight: 500;
    color: var(--title);
    font-size: 17px;
    margin-top: 14px;
}

.related_vehicle__trim {
    display: none;
    font-size: 18px;
    font-weight: 300;
    color: var(--subTitle);
    margin-top: 20px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 28px;
}

.related_vehicle_special {

    display: block;
    text-align: center;
}

.related_vehicle__title_speacial {
    font-weight: 500;
    color: "#050B20";
    font-size: 17px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.related_vehicle_finance-link {
    display: inline-flex;
    align-items: center;
    /* gap: 0.5rem; */
    cursor: pointer;
    background: transparent;
    padding-top: 0;
    /* py-1 */
    padding-bottom: 0;
    color: var(--primary);
    font-weight: 500;
    font-size: 1rem;
}

@media (min-width: 768px) {
    .related_vehicle_finance-link {
        font-size: 1.25rem;
        /* md:!text-xl */
    }
}

/* ===== Payment Calculator Styles ===== */

.calculator-icon {
    width: 20px !important;
    height: 20px !important;
    color: #fff !important;
}

.calculator-icon-text {
    color: #fff !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    line-height: 25px !important;
    font-family: 'Outfit', sans-serif !important;
}

.calculator-func {
    background-color: #0072c7 !important;
    color: #fff !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    line-height: 25px !important;
    font-family: 'Outfit', sans-serif !important;
    border: 0 !important;
    border-radius: 5px !important;

}

.calculator-label {
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 20px !important;
    font-family: 'Outfit', sans-serif !important;
    color: black !important;
}


.calculator-input {
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 24px !important;
    font-family: 'Outfit', sans-serif !important;
    color: #475569 !important;
    /* box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05) !important; */
    border-radius: 4px !important;
    background: #fff !important;
    width: 100% !important;
    max-width: 100% !important;
    /* height: 40px !important; */
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

@media (min-width: 768px) {
    .calculator-input {
        max-width: 102px !important;
    }
}


.calculator-input::placeholder {
    color: #475569 !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 24px !important;
    font-family: 'Outfit', sans-serif !important;
}

.calculator-input:focus {
    outline: none !important;
}

.calculator-downpay {
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 24px !important;
    font-family: 'Outfit', sans-serif !important;
    color: #475569 !important;
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05) !important;
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
    background: #fff !important;
    height: 40px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    padding-right: 10px !important;
    padding-left: 10px !important;

}

.calculator-downpay::placeholder {
    color: #475569 !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 24px !important;
    font-family: 'Outfit', sans-serif !important;
}

.calculator-downpay:focus {
    outline: none !important;
    /* border-color: none !important; */
    /* box-shadow: 0 0 0 1px #0072c7 !important; */
}

.payment-calculator-payment-item {
    display: flex;
    flex-direction: column !important;
    justify-content: space-between;
    align-items: start;
    gap: 6px;
    margin-right: 8px;
}

/* Container holding payment items (two items should sit side-by-side) */
.payment-calculator-payments {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.payment-calculator-payments>.payment-calculator-payment-item {
    flex: 1 1 0;
    margin-right: 0;
    /* gap handles spacing */
}

/* Mobile / Tablet responsive rules moved further down to preserve cascade order */


.payment-calculator-payment-label {
    display: block;
    margin-bottom: 0px;
}


.payment-calculator-input-wrapper {
    display: block;
}

/* PaymentCalculator bi-weekly/monthly field fix */
.payment-calculator-payment-value {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0;
}

.payment-calculator-currency-symbol {
    font-size: 18px;
    font-weight: 600;
    color: #222;
    margin: 0 4px 0 0;
    align-self: center;
    line-height: 40px;
}

.payment-calculator-payment-item input.calculator-input,
.payment-calculator-amount-financed-inner input.calculator-input {
    margin: 0;
    width: 100%;
    text-align: left;
    display: inline-block;
}




.payment-calculator-container {
    display: block;
    width: 100%;
    margin-top: 16px;
    border: 1px solid #ddd;
    padding: 10px;
    font-family: 'Outfit', sans-serif;
    background: #fff;
}

.payment-calculator-header {
    background-color: var(--primary);
    color: #fff;
    padding: 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.payment-calculator-header-content {
    display: flex;
    align-items: start;
    gap: 4px;
}

.payment-calculator-reset-btn {
    background: none;
    border: none;
    color: #fff;
    font-size: 20px;
    font-weight: 500;
    line-height: 25px;
    font-family: 'Outfit', sans-serif;
    cursor: pointer;
    padding: 0;
}

.payment-calculator-layout {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 10px;
    padding-top: 8px;
}

.payment-calculator-row {
    display: grid !important;
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    gap: 12px;
}

@media (min-width: 768px) {
    .payment-calculator-row {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

.payment-calculator-column-bordered {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 12px;
    border-bottom: none;

    width: 100%;
}

@media (min-width: 768px) {
    .payment-calculator-column-bordered {
        display: grid;
        grid-template-columns: repeat(1, minmax(0, 1fr));
        gap: 12px;
        border-right: 1px solid;
        border-bottom: none !important;
        width: 100%;
    }
}

.payment-calculator-column {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 12px;
    width: 100%;
}

.payment-calculator-two-col-grid {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 12px;
}

@media (min-width: 768px) {
    .payment-calculator-two-col-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.payment-calculator-inner-col {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 12px;
}

.payment-calculator-field-wrapper {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.payment-calculator-payment-label-text {
    font-size: 18px;
    line-height: 28px;
    white-space: nowrap;
}

.payment-calculator-label {
    font-size: 18px;
    font-weight: 600;
    line-height: 20px;
    font-family: 'Outfit', sans-serif;
    color: #000;
    /* padding-bottom: 8px; */
    text-align: start;
}

@media (min-width: 1024px) {
    .payment-calculator-label {
        text-align: left;
    }
}

.payment-calculator-field-value {
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--title);
    font-weight: 700;
    font-size: 20px;
    padding-bottom: 0;
    width: 100%;
}


.payment-calculator-currency-symbol {
    font-size: 16px;
    color: #334155;
    font-weight: normal;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Oxygen-Sans', Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
    margin-right: 0;
}

.payment-calculator-currency-symbol.suffix {
    margin-left: 4px;
    margin-right: 0;
}



.payment-calculator-select {
    display: block;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    font-family: 'Outfit', sans-serif;
    color: #475569;
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23475569' d='M6 8.825L1.175 4 2.238 2.938 6 6.7l3.763-3.762L10.825 4z'/%3E%3C/svg%3E") no-repeat right 10px center;
    height: 40px;
    width: 100%;
    padding: 8px 30px 8px 10px;
    cursor: pointer;
    box-sizing: border-box;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.payment-calculator-select:focus {
    outline: none;

}

.payment-calculator-input-wrapper {
    display: flex;
    align-items: center;
    gap: 4px;
    width: 100%;
}

.payment-calculator-button-container {
    text-align: center;
    margin-bottom: 0;
    border: none;
    border-color: #eee;
}

.payment-calculator-button {
    width: 100%;
    background-color: var(--primary);
    color: #fff;
    font-size: 20px;
    font-weight: 500;
    line-height: 25px;
    font-family: 'Outfit', sans-serif;
    border: 1px solid var(--primary);
    border-radius: 5px;
    padding: 8px 16px;
    cursor: pointer;
    transition: background-color 0.2s;
}

/* .payment-calculator-button:hover {
	background-color: #0056a3;
} */

.payment-calculator-results {
    display: flex;
    flex-wrap: wrap;
    margin-top: 5px;
    border-top: 0;
    padding-top: 0;
}

.payment-calculator-amount-financed {
    width: 100%;
    border-right: 0;
    padding-left: 0;
    margin-bottom: 24px;
}

@media (min-width: 1024px) {
    .payment-calculator-amount-financed {
        width: calc(100% / 3);
        border-right: 1px solid;

        margin-bottom: 0;
    }
}

.payment-calculator-amount-financed-inner {
    display: flex;
    flex-direction: column !important;
    justify-content: space-between;
    align-items: start;
    gap: 6px;
    height: 55px;
}

/* Mobile / Tablet: arrange calculator rows as side-by-side where appropriate */
/* @media screen and (max-width: 991px) {
	.payment-calculator-amount-financed-inner {
		flex-direction: row !important;
		justify-content: space-between !important;
		align-items: center;
		gap: 8px;
	}

	.payment-calculator-payment-item {
		flex-direction: row !important;
		justify-content: space-between !important;
		align-items: center;
		gap: 8px;
	}

	.payment-calculator-payments {
		align-items: flex-start;
	}
}
 */



.payment-calculator-amount-financed-inner .payment-calculator-label {
    padding-bottom: 0;
}


.payment-calculator-payment-item .payment-calculator-input-wrapper,
.payment-calculator-amount-financed-inner .payment-calculator-input-wrapper {
    width: 100%;
}

.payment-calculator-payments {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0;
    padding-left: 0;
    padding-right: 0;
}

@media (min-width: 1024px) {
    .payment-calculator-payments {
        width: calc(200% / 3);
        padding-left: 12px;
        padding-right: 12px;
    }
}

.payment-calculator-payment-values-container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    width: 100%;
    gap: 12px;
}

.payment-calculator-payment-values-container>.payment-calculator-payment-item {
    flex: 1 1 0;
    margin-right: 0;
}

.payment-calculator-payments-title {
    width: 100%;
    text-align: start;
    margin-bottom: 0;
}

@media (min-width: 1024px) {
    .payment-calculator-payments-title {
        width: 100%;
        margin-bottom: 8px;
    }
}




/* Payment item styling for screens below lg (1024px) */
@media (max-width: 1024px) {
    .payment-calculator-payment-item .payment-calculator-payment-label {
        flex-shrink: 0;
        margin-bottom: 0;
    }

    .payment-calculator-payment-item .payment-calculator-payment-value {
        flex: 1;
        max-width: 60%;
        justify-content: flex-end;
        margin-top: 0;
    }
}


.payment-calculator-payment-label {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    color: #000;
    font-weight: 500;
    font-size: 13px;
    font-family: 'Outfit', sans-serif;
    margin-bottom: 0px;
}


.payment-calculator-payment-label.monthly {
    font-size: 18px;
}


.payment-calculator-payment-value {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    margin-top: 0px;
    color: var(--title);
}


/* ++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.payment-calculator-row input[type="text"] {
    padding: 0px;
}

.payment-calculator-currency-symbol.suffix {
    display: none;
}

.payment-calculator-inner-col {
    gap: 15px;
}

.payment-calculator-currency-symbol {
    display: none;
}

.payment-calculator-amount-financed-inner {
    display: unset;
}

.payment-calculator-payment-item input.calculator-input {
    padding: 0px;
}

.payment-calculator-select {
    width: 50%;
}

.calculator-downpay {
    width: 50% !important;
}

.payment-calculator-disclaimer-text {
    font-size: 14px;
    font-family: 'Outfit';
    color: gray;
}

.payment-calculator-row {
    padding-bottom: 15px;
}

input.amount-financed-input {
    padding: 0px;
}

.reset-x {
    color: #000000;
    padding-left: 5px;
}

.payment-calculator-label, .payment-calculator-payment-label {
    font-weight: 300;
}

@media (max-width: 1200px) {
    .payment-calculator-label {
        line-height: 20px;
        padding-bottom: 0px;
    }
}

@media (max-width: 767px) {
    .payment-calculator-inner-col {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/* ===== Payment Calculator Styles ===== */

.nf-fu-fileinput-button {
    margin-bottom: 5px !important;
}



/* ===== Description Section Styles ===== */

.desc_header {
    display: none;
    padding-top: 16px;
    padding-bottom: 40px;
}

@media (min-width: 768px) {
    .desc_header {
        display: block;
    }
}

.desc_title {
    font-weight: 700;
    color: var(--title);
    line-height: 2.5rem;
    letter-spacing: 3px;
    font-size: 1.875rem;
}

.desc_divider {
    height: 1.5px;
    background-color: #AAAAAA;
    margin: 15px 0;
}

.desc_content {
    font-size: 1.125rem;
    font-weight: 300;
    color: #000;
    line-height: 1.6;
}

/* ===== Spec Section Styles ===== */

.desc_spec {
    padding: 20px 35px 20px 20px;
    background-color: #F2F5FB;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-bottom: 15px;
}

.desc_spec_item {
    display: flex;
    justify-content: space-between;
    gap: 8px;
}

.desc_spec_label {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.desc_spec_label_icon {
    width: 16px;
    height: 16px;
    margin-right: 5px;
    color: #000;
}

.desc_spec_label_icon_img {
    width: 16px;
    height: 16px;
    margin-right: 5px;
    object-fit: contain;
}

.desc_spec_label_text {
    color: #000;
    font-size: 1.125rem;
    line-height: 1.5rem;
}

.desc_spec_value {
    color: #000;
    font-size: 1.125rem;
    line-height: 1.5rem;
    font-weight: 700;
}

@media (max-width: 340px) {

    .desc_spec_label,
    .desc_spec_label_text,
    .desc_spec_value {
        font-size: 16px;
    }
}

.details_sidebar-info-regular {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* ===== Details Header Styles ===== */

/* Regular Details Header */
.details_header_regular {
    display: none;
}

@media (min-width: 768px) {
    .details_header_regular {
        display: block;
        /* display: none; */
    }
}

.details_header_regular_title {
    font-size: 1.875rem;
    font-weight: 700;
    color: var(--title);
    line-height: 2.5rem;
    letter-spacing: 3px;
    margin-bottom: 5px;
}


.details_header_regular_dot {
    /* font-size: 1.875rem; */
    color: #161244;
    margin-left: 0.25rem;
    margin-right: 0.25rem;
    /* vertical-align: middle; */
}

@media screen and (min-width :768px) {
    .details_header_regular_dot {
        font-size: 1.875rem;
        color: #161244;
        margin-left: 0.25rem;
        margin-right: 0.25rem;
        vertical-align: middle;
    }
}


.details_header_regular_divider {
    background-color: #AAAAAA;
    height: 1.5px;
    width: 100%;
    margin: 15px 0;
}

.details_price {
    margin-bottom: 1.25rem;
    font-size: 2.25rem;
    font-weight: 700;
    line-height: 2.75rem;
    color: var(--primary);
    font-family: 'Outfit', sans-serif;
}

@media (max-width: 767px) {
    .details_price{
        width: 150px;
        text-align: right;
    }
	
}

button.payment-calculator-button:hover {
    background: #fff;
    border: 1px solid var(--primary);
    color: var(--primary);
}


/* Special Details Header */
.details_header_special {
    display: none;
}

@media (min-width: 768px) {
    .details_header_special {
        display: none;
    }
}

.details_header_special_title {
    font-size: 1.875rem;
    font-weight: 700;
    color: var(--title);
    line-height: 2.5rem;
    letter-spacing: 3px;
    margin-bottom: 5px;
}



.details_header_special_dot {
    /* font-size: 1.875rem; */
    color: #161244;
    margin-left: 0.25rem;
    margin-right: 0.25rem;
    /* vertical-align: middle; */
}

@media screen and (min-width :768px) {
    .details_header_special_dot {
        font-size: 1.875rem;
        color: #161244;
        margin-left: 0.25rem;
        margin-right: 0.25rem;
        vertical-align: middle;
    }
}


.details_header_special_divider {
    background-color: #AAAAAA;
    height: 1.5px;
    width: 100%;
    margin: 15px 0;
}

.details_price_special {
    display: flex !important;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 6px;
}

.details_price_special_col {
    display: flex;
    flex-direction: column;
}

.details_price_special_weekly_row {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
}

.details_price_special_weekly_unit {
    font-size: 0.875rem;
    color: #333;
    text-align: center;
    font-weight: 700;
}

/* =========================
   Sticky Right Container
========================= */
@media (min-width: 768px) {
    .sticky-right-container {
        background-color: #fff;
    }

    .sticky-right-container--fixed {
        position: fixed;
        top: 120px;
    }

    .sticky-right-container--bottom {
        position: absolute;
        bottom: 0;
    }

    .sticky-right-container--relative {
        position: relative;
    }


    /* STICKY RIGHT PANEL — GLOBAL ON/OFF TOGGLE */

    .sticky-right-container--fixed,
    .sticky-right-container--bottom {
        position: relative !important;
        top: auto !important;
        bottom: auto !important;
        left: auto !important;
        width: 100% !important;
    }

}

/* =========================
   Related Vehicle Title
========================= */
.related_vehicle_title {
    font-size: 1.875rem;
    line-height: 2.5rem;
    letter-spacing: 3px;
    font-weight: 700;
    color: var(--title);
}

@media (min-width: 768px) {
    .related_vehicle_title {
        margin-bottom: 5px;
    }
}

/* =========================
   Slider Navigation Buttons
========================= */
.prev-btn,
.next-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9999;
    height: 55px;
    width: 55px;
    border-radius: 50%;
    background-color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: none;
    outline: none;
    /* Hidden by default; revealed via CSS :hover on the wrapper */
    opacity: 0;
    pointer-events: none;
    transition: opacity 300ms ease-out, transform 300ms ease-out;
}

.prev-btn {
    left: -10px;
    transform: translateY(-50%) translateX(24px);
}

.next-btn {
    right: -10px;
    transform: translateY(-50%) translateX(-24px);
}

/* Show buttons when hovering the wrapper — pure CSS, no React state conflict */
.vehicles-slide-wrapper:hover .prev-btn,
.vehicles-slide-wrapper:hover .next-btn {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(-50%) translateX(0);
}

.prev-btn__icon,
.next-btn__icon {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1;
}

.next-btn__icon {
    transform: rotate(180deg);
}

@media (min-width: 768px) {

    .prev-btn,
    .next-btn {
        height: 50px;
        width: 50px;
    }

    .prev-btn__icon,
    .next-btn__icon {
        font-size: 1.125rem;
    }

    .prev-btn {
        left: -24px;
    }

    .next-btn {
        right: -24px;
    }
}

/* Custom Reset Button styles */
.reset-btn {
    background: var(--primary);
    color: #fff;
    border: none;
    border-radius: 5px;
    padding: 8px 24px;
    font-size: 20px;
    font-weight: 400;
    cursor: pointer;
    margin-bottom: 12px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background 0.2s, color 0.2s;
}

.reset-btn:hover {
    background: var(--primary);
    color: #fff;
}


/* search portion */
.search-form {
    display: flex;
    width: 100%;
    height: 50px;
    border-radius: 4px;

    box-shadow: 0 0 6px 6px #a6a6a6;
    overflow: hidden;
    margin-bottom: 1rem;
}

@media (min-width: 768px) {
    .search-form {
        margin-bottom: 1.5rem;
    }
}

.search-field__input {
    flex: 1 1 0%;
    min-width: 0;
    height: 100%;
    padding: 12px !important;
    border-radius: 4px 0 0 4px;
    outline: none;
    font-size: 18px;
    color: #000;
    border-radius: 0;
    background: #fff;
}

.search-field__input::placeholder {
    color: #a3a3a3 !important;
    font-size: 18px;
    font-weight: 400;
}

.search-field__input::-webkit-input-placeholder {
    color: #a3a3a3 !important;
    font-size: 18px;
    font-weight: 400;
}

.search-field__input::-moz-placeholder {
    color: #a3a3a3 !important;
    font-size: 18px;
    font-weight: 400;
}

.search-field__input:-ms-input-placeholder {
    color: #a3a3a3 !important;
    font-size: 18px;
    font-weight: 400;
}

@media (min-width: 1280px) {

    .search-field__input,
    .search-field__input::placeholder {
        font-size: 22px;
    }
}

/* Custom Search Button styles */
.search-btn {
    flex-shrink: 0;
    width: 123px;
    height: 100%;
    background: var(--primary);
    color: #fff;
    border-radius: 0 4px 4px 0;

    padding: 0 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
    font-weight: 400;
    cursor: pointer;
    transition: opacity 0.2s;
}

@media (min-width: 768px) {
    .search-btn {
        width: 200px;
    }
}

@media (min-width: 1280px) {
    .search-btn {
        font-size: 22px;
    }
}

.search-btn:hover {
    opacity: 0.8;
}


/* Small mobile fix: prevent search button from being cut off */
@media (max-width: 400px) {
    .search-form {
        height: 46px;
    }

    .search-field__input {
        padding: 10px !important;
        font-size: 16px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .search-btn {
        width: 123px;
        flex-shrink: 0;
        padding: 0 16px;
        font-size: 16px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}


/* Search button area end */


.no-found-text {
    text-align: center;
    padding: 40px 0;
    color: var(--primary);
    font-size: 19.2px;
    font-family: "Roboto", sans-serif;
}

.no-vehicle-found-details {
    color: var(--primary);
    font-size: 20px;
    font-weight: 400 !important;
    margin-top: 16px;
}

/* Use this class to control visibility of the Image Description Modal */
.image-description-modal-container {
    /* display: none !important; */
}

/* ---- Loader skeleton ---- */
@keyframes loader-spin {
    to {
        transform: rotate(360deg);
    }
}

.loader {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 2.5rem;
}

@media (min-width: 768px) {
    .loader {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
        padding-top: 3.5rem;
        padding-bottom: 3.5rem;
    }
}

.loader__aside {
    min-width: 25rem;
    flex-shrink: 0;
}

.loader__skeleton {
    height: 2.5rem;
    background-color: #f3f4f6;
    border-radius: 0.25rem;
    margin-bottom: 0.75rem;
}

.loader__main {
    position: relative;
    flex: 1 1 0%;
    min-height: 420px;
}

.loader__overlay {
    position: absolute;
    inset: 0;
    background-color: rgba(255, 255, 255, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
}

.loader__spinner {
    animation: loader-spin 1s linear infinite;
    border-radius: 9999px;
    height: 2.5rem;
    width: 2.5rem;
    border: 3px solid var(--primary);
    border-top-color: var(--primary);
}


/* Allow sticky React inventory sidebar inside the main content wrapper */
@media (min-width: 768px) {
    .container-full:has(#react-cars-root) {
        /* Do not clip sticky sidebar */
        overflow: visible;
    }

    .container-full:has(#react-cars-root) .cars-sidebar-sticky {
        position: sticky;
        top: 120px;
        align-self: flex-start;
    }
}

/* On mobile, keep sidebar sticky but closer to the top (below header) */
@media (max-width: 767.98px) {
    .container-full:has(#react-cars-root) {
        /* Do not clip sticky sidebar */
        overflow: visible;
    }

    .container-full:has(#react-cars-root) .cars-sidebar-sticky {
        position: sticky;
        top: 60px;
        z-index: 100 !important;
        align-self: flex-start;
    }
}

/* =========================
   Mobile Filter Header (filter_mobile)
   Mirrors React VehicleFilterPanel mobile bar
   ========================= */
.filter_mobile {
    position: relative;
    display: block;
    /* visible on mobile */
    background-color: #ffffff;
    /* bg-white */
    z-index: 100;
    /* z-100 */
}

@media (min-width: 768px) {

    /* md:!hidden */
    .filter_mobile {
        display: none;
    }
}

.filter_mobile-inner {
    padding-top: calc(var(--mobile-navbar-offset, 20px) + 0.625rem);
    /* navbar gap + pt-2.5 (10px) */
    padding-right: 1rem;
    /* px-4 (16px) */
    padding-left: 1rem;
    /* px-4 (16px) */
}

.filter_mobile-toggle {
    display: flex;
    /* !flex */
    align-items: center;
    /* items-center */
    justify-content: space-between;
    /* justify-between */
    background-color: #f6f6f6;
    /* bg-[#f6f6f6] */
    margin-bottom: 0;
    /* mb-0 */
    padding: 0.75rem;
    /* p-3 (12px) */
    width: 100%;
    /* w-full */
    height: 49.63px;
    /* h-[49.63px] */
    font-weight: 400;
    /* font-normal */
    font-size: 1rem;
    /* text-base */
    color: #212529;
    /* !text-[#212529] */
    border-bottom: 1px solid #d3d3d3;
    /* border-b border-b-[#d3d3d3] */
    text-transform: uppercase;
    /* uppercase */
}

.filter_mobile-label {
    display: flex;
    /* flex */
    align-items: center;
    /* items-center */
    height: 100%;
    /* h-full */
}

.filter_mobile-icon {
    color: #212529;
    /* !text-[#212529] */
    transition: transform 0.3s ease;
    /* transition-transform duration-300 */
}

.filter_mobile-icon.is-open {
    transform: rotate(0deg);
    /* rotate-0 */
}

.filter_mobile-icon.is-closed {
    transform: rotate(180deg);
    /* rotate-180 */
}

/* =========================
   Desktop Filter Header (filter_desktop)
   Mirrors hidden md:!block + h4 styles
   ========================= */
.filter_desktop {
    display: none;
}

@media (min-width: 768px) {
    .filter_desktop {
        display: block;
        /* md:!block */
    }
}

.filter_desktop h4 {
    color: #333333;
    /* !text-[#333] */
    font-size: 38px;
    /* !text-[38px] */
    font-weight: 800;
    /* !font-extrabold */
    line-height: 2.5rem;
    /* leading-10 ~ 40px */
    word-break: break-word;
    /* break-words */
    margin-bottom: 0;
    /* !mb-0 */
}

@media (min-width: 1280px) {
    .filter_desktop h4 {
        font-size: 45px;
        /* xl:!text-[50px] */
        line-height: 60px;
        /* xl:!leading-[60px] */
    }
}

/* =========================
   Main Filter Container (filter_main)
   Mirrors the Tailwind utility layout
   ========================= */
.filter_main {
    width: 100%;
    /* w-full */
    padding-top: 15px;
    /* !pt-[15px] */
    padding-left: 0.5rem;
    /* px-2 (8px) */
    padding-right: 0.5rem;
    /* px-2 */
    background-color: #ffffff;
    /* !bg-white */
    border-radius: 4px;
    /* !rounded-sm */
    display: grid;
    /* grid */
    gap: 0.75rem;
    /* gap-3 */
    border: 1px solid #d3d3d3;
    /* !border !border-[#D3D3D3] */
    overflow-wrap: anywhere;
    /* !text-wrap */
    margin-top: 0.75rem;
    /* mt-3 */
}

@media (min-width: 768px) {
    .filter_main {
        width: 194px;
        /* md:w-[194px] */
        margin-top: 0;
        /* md:!mt-0 */
        display: grid;
        /* md:!grid */
    }
}

@media (min-width: 1024px) {
    .filter_main {
        width: 307.4px;
        /* lg:w-[307.4px] */
    }
}

@media (min-width: 1280px) {
    .filter_main {
        width: 310px;
        /* xl:w-[310px] */
    }
}

@media (min-width: 1536px) {
    .filter_main {
        width: 400px;
        /* 2xl:w-[400px] */
    }
}

/* =========================
   React Cars Layout (cars_layout)
   Mirrors: container mx-auto px-2.5 md:!px-4 flex flex-col md:flex-row
            justify-start items-start gap-0 pt-0 pb-2.5 md:!pt-14 md:!pb-7
   ========================= */
.cars_layout {
    padding-left: 0.625rem;
    /* px-2.5 ~ 10px */
    padding-right: 0.625rem;
    padding-top: 0;
    /* pt-0 */
    padding-bottom: 0.625rem;
    /* pb-2.5 ~ 10px */
    display: flex;
    /* flex */
    flex-direction: column;
    /* flex-col */
    justify-content: flex-start;
    /* justify-start */
    align-items: flex-start;
    /* items-start */
    gap: 0;
    /* gap-0 */
}

@media (min-width: 768px) {
    .cars_layout {
        padding-left: 1rem;
        /* md:!px-4 (16px) */
        padding-right: 1rem;
        padding-top: 3.5rem;
        /* md:!pt-14 (~56px) */
        padding-bottom: 1.75rem;
        /* md:!pb-7 (~28px) */
        flex-direction: row;
        /* md:flex-row */
    }
}

/* =========================
   React Cars Sidebar Wrapper (cars_sidebar_wrapper)
   Mirrors: flex flex-col w-full md:w-[194px] lg:w-[307.4px]
            xl:w-[310px] 2xl:w-100
   ========================= */
.cars_sidebar_wrapper {
    display: flex;
    /* flex */
    flex-direction: column;
    /* flex-col */
    width: 100%;
    /* w-full */
}

@media (min-width: 768px) {
    .cars_sidebar_wrapper {
        width: 194px;
        /* md:w-[194px] */
    }
}

@media (min-width: 1024px) {
    .cars_sidebar_wrapper {
        width: 307.4px;
        /* lg:w-[307.4px] */
    }
}

@media (min-width: 1280px) {
    .cars_sidebar_wrapper {
        width: 310px;
        /* xl:w-[310px] */
    }
}

/* 2xl:w-100 is non-standard Tailwind; interpret as 100% width on very large screens */
@media (min-width: 1536px) {
    .cars_sidebar_wrapper {
        width: 400px;
    }
}

/* =========================
   React Cars Sidebar Aside (cars_sidebar_aside)
   Mirrors: w-full shrink-0 bg-white
   ========================= */
.cars_sidebar_aside {
    width: 100%;
    /* w-full */
    flex-shrink: 0;
    /* shrink-0 */
    background-color: #fff;
    /* bg-white */
}

/* =========================
   Mobile Search Block (cars_search_mobile)
   Mirrors: flex flex-col md:hidden mx-auto !mt-10
   and prevents overflow by constraining width to container
   ========================= */
.cars_search_mobile {
    display: flex;
    /* flex */
    flex-direction: column;
    /* flex-col */
    width: 100%;
    /* fill container, no horizontal overflow */
    margin-top: 2.5rem;
    /* !mt-10 (~40px) */
}

@media (min-width: 768px) {
    .cars_search_mobile {
        display: none;
        /* md:hidden */
    }
}

/* When the mobile filter panel is open, disable sticky sidebar
   so the filter block scrolls normally on small screens. */
@media (max-width: 767.98px) {
    body.react-cars-filters-open .container-full:has(#react-cars-root) .cars-sidebar-sticky {
        position: static;
        top: auto;
        z-index: auto !important;
    }
}

.interrior_color_spec {
    /* display: none !important; */
}

.stock_spec {
    /* display: flex; */
    display: none;
}

/* for CAR-1319 make the count and fornt size smaller and remove break */
.filter_desktop br.block {
    display: none;
}



/* Image Description Modal Custom Styles */

.idm-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.idm-backdrop {
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    transition: opacity 0.3s;
}

.idm-close-button-desktop {
    display: none;
}

@media (min-width: 1024px) {
    .idm-close-button-desktop {
        display: block;
        position: absolute;
        top: -2.5rem;
        right: 0;
        z-index: 10000;
        color: white;
        transition: color 0.2s;
        padding: 0.25rem;
        background: transparent;
        border: none;
    }

    .idm-close-button-desktop:hover {
        color: #e5e7eb;
        /* gray-200 */
    }
}

.idm-content-container {
    position: relative;
    z-index: 50;
    width: 100%;
    overflow: visible;
    pointer-events: none;
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
}

@media (min-width: 1024px) {
    .idm-content-container {
        /* height: 100%; */
        background-color: white;
        display: grid;
        grid-template-columns: repeat(12, minmax(0, 1fr));
        pointer-events: auto;
        margin-top: 40px;
        margin-bottom: 40px;
        margin-left: 20px;
        margin-right: 20px;

    }
}

.idm-image-section {
    width: 100%;
    max-height: 100%;
    grid-column: span 12 / span 12;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    pointer-events: auto;
    position: relative;
    user-select: none;
}

@media (min-width: 1024px) {
    .idm-image-section {
        grid-column: span 8 / span 8;
/*         align-items: flex-start; */
    }
}

.idm-mobile-close-button {
    position: absolute;
    top: -2.5rem;
    right: 0;
    z-index: 10000;
    color: white;
    transition: color 0.2s;
    padding: 0.25rem;
    background: transparent;
    border: none;
}

@media (min-width: 1024px) {
    .idm-mobile-close-button {
        display: none;
    }
}

.idm-main-image {
    max-width: 100%;
    max-height: 60vh;
    object-fit: contain;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
    pointer-events: none;
}


@media (min-width: 768px) {
    .idm-main-image {
        max-height: 480px;
    }
}

@media (min-width: 1024px) {
    .idm-main-image {
        max-height: 600px !important;
        box-shadow: none;
    }
}

@media (min-width: 1280px) {
    .idm-main-image {
        max-height: 650px !important;
        box-shadow: none;
    }
}

.idm-sidebar-section {
    display: none;
}

@media (min-width: 1024px) {
    .idm-sidebar-section {
    display: flex;
    grid-column: span 4 / span 4;
    background-color: white;
    flex-direction: column;
    padding: 0.5rem;
    overflow-y: auto !important;
    pointer-events: auto;
    margin-top: 4px;
	margin-right:6px;
	margin-left:6px;
    }
}

.idm-button-finance {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 3rem;
    padding: 5px 0;
    border-radius: 4px;
    font-size: 22px;
    font-weight: 700;
    background-color: var(--primary);
    color: #ffffff;
    border: 1px solid transparent;
    cursor: pointer;
    transition: background-color 0.2s, color 0.2s, border-color 0.2s;
}

.idm-button-finance:hover {
    background-color: #ffffff;
    color: var(--primary);
    border-color: var(--primary);
}

.idm-button-contact {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 3rem;
    padding: 5px 0;
    border-radius: 4px;
    font-size: 22px;
    font-weight: 700;
    background-color: var(--primary);
    color: #ffffff;
    border: 1px solid transparent;
    cursor: pointer;
    transition: background-color 0.2s, color 0.2s, border-color 0.2s;
}

.idm-button-contact:hover {
    background-color: #ffffff;
    color: var(--primary);
    border-color: var(--primary);
}

.idm-iframe-container {

    transition: all 0.5s ease-in-out;
   max-height: 0;
}

.idm-iframe-container-open {
    height: 70px;
    max-height: 100%;
}

.idm-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: #F0F0F0 !important;
    cursor: pointer;
    transition: opacity 0.2s;
    opacity: 0;
    pointer-events: none;
}
.idm-arrow.visible {
    opacity: 1;
    pointer-events: auto;
}

.idm-arrow-left {
    left: 0.5rem;
}

.idm-arrow-right {
    right: 0.5rem;
}

.idm-logo-container {
    display: flex;
    justify-content: center;
    margin-top: 40px;
    margin-bottom: 10px;
    padding-right: 20px;
    padding-left: 20px;
}

.idm-logo-image {
    /* max-height: 5rem; */
    object-fit: contain;
}

.idm-button-container {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin-bottom: 4px;
}

.details_sidebar-info-special {
    display: block;
    flex-direction: column;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
}

.details_sidebar-info-regular {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 8px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
}

.details_badges-wrap {
    display: flex;
    flex-direction: column;
    margin-bottom: 0.75rem;
    margin-top: 4px;
}

@media (min-width: 768px) {
    .details_badges-wrap {
        margin-bottom: 1.25rem;
    }
}

.details_badges-row {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.375rem;
}

.details_badge-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
}

.details_badge-icon {
    width: 40px;
    height: 40px;
    border-radius: 9999px;
    background-color: white;
    border: 2px solid #ef4444;
}

@media (min-width: 768px) {
    .details_badge-icon {
        width: 30px;
        height: 30px;
    }
}

@media (min-width: 1025px) {
    .details_badge-icon {
        width: 40px;
        height: 40px;
    }
}

@media (min-width: 426px) and (max-width: 768px) {
    p.details_price {
        line-height: 30px;
    }

    .details_sidebar-info-regular {
        flex-direction: column;
        gap: 0px;
    }

    .details_badge-item:nth-child(n + 4) {
        display: none !important;
    }
}

/* .details_sidebar-info-regular {
    overflow: hidden;
} */


.details_badge-label {
    font-size: 0.75rem;
    font-weight: 700;
    color: #334155;
    text-align: center;
    height: 2rem;
    max-width: 70px;
}

.details-subtitle-regular-sm-sub {
    /* font-size: 1.125rem;
    line-height: 1.75rem;
    margin-bottom: 0.5rem;
    color: #334155; */
}

.details-subtitle-regular-sm-title {
    font-size: 1.875rem;
    font-weight: 700;
    color: var(--title);
    line-height: 2.5rem;
    letter-spacing: 3px;
    margin-bottom: 0;
}


/* ---- Details Price Styling ---- */
.details_price_div_regular {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.details_sidebar-info-regular {
    margin-top: 1rem;
}

@media screen and (min-width: 768px) {
    .details-subtitle-special {
        display: none !important;
    }

}

@media screen and (min-width: 768px) {
    .details-subtitle-regular {
        display: none;
    }

}

img.related_vehicles_img {
    min-height: 200px;
}



/* ===== Small Screen Description Styles ===== */
.desc-divider-sm-outer {
    display: block;
    background-color: #AAAAAA;
    margin: 12px 0;
    width: 100%;
    height: 1.5px;
}

@media (min-width: 768px) {
    .desc-divider-sm-outer {
        display: none !important
    }
}

.desc-section-sm {
    display: block;
    padding-top: 8px;
    padding-bottom: 40px;
}

@media (min-width: 768px) {
    .desc-section-sm {
        display: none !important;
    }
}

.description-sm-title {
    font-weight: 700;
    color: var(--title);
    line-height: 2.5rem;
    letter-spacing: 3px;
    font-size: 1.875rem;
    margin-bottom: 0;
}

.desc-content-sm {
    font-size: 1.125rem;
    font-weight: 300;
    color: #000;
    line-height: 1.6;
    margin-top: 16px;
    display: block;
    word-break: break-all;
}



/* for CarFax */
.carfax-hide a.carfax-logo,
.carfax-logo-spec.carfax-hide {
    display: none;
}

.carfax-hide a.finance-link,
.carfax-hide a.related_vehicle_finance-link {
    color: #fff;
    font-weight: 300;
    font-size: 1.25rem;
    background: var(--primary);
    border: 1px solid var(--primary);
    width: 100%;
    justify-content: center;
    border-radius: 5px;
    padding: 0.5rem 1rem;

}


.carfax-hide .finance-link svg,
.carfax-hide .related_vehicle_finance-link svg {
    fill: #fff;
}

.carfax-finance-row.carfax-hide,
.related_vehicle_carfax-finance-row.carfax-hide {
    padding-bottom: 10px;
    margin-top: 0px;
}

.carfax-hide a .finance-text {
    text-decoration: unset;
}

.carfax-hide a.related_vehicle_finance-link {
    margin-top: 10px;
}




/* For regular Dealers Carfax control */
.price-row-special,
.carfax-finance-row,
.related_vehicle_price-row-special,
.related_vehicle_carfax-finance-row {
    display: none;
}

.price-row-regular {
    display: flex;
    margin-left: 10px;
    margin-right: 10px;
    padding: 0.5rem 0rem;
}

.financement-with-carfax a.carfax-logo {
    display: none;
}

.financement-with-carfax {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

a.finace-regular.finance-link {
    background: var(--primary);
    color: #fff;
    border-radius: 5px;
    margin-left: 10px !important;
    margin-right: 10px !important;
    display: flex;
    justify-content: center;
    height: 45px;
}

.finace-regular.finance-link svg {
    fill: #fff;
}

.price-row-regular:has(.financement-with-carfax:not(.carfax-show)) {
    border-bottom: unset;
}


a.finace-regular.finance-link.carfax-show {
    display: flex;
}

a.finace-regular.finance-link {
    display: none;
}

.financement-with-carfax.carfax-show a.finance-link,
.financement-with-carfax.carfax-show a.related_vehicle_finance-link {
    display: none;
}

.financement-with-carfax.carfax-show a.carfax-logo {
    display: block;
}


.financement-with-carfax a.carfax-logo {
    display: none;
}

a.finace-regular.finance-link.related-vehicles-silder {
    margin-top: 7px;
    margin-bottom: 7px;
}


a.finace-regular.finance-link.carfax-show:hover {
    background: #fff;
    color: #000;
}

.finace-regular.finance-link.carfax-show:hover svg, .carfax-finance-row.carfax-hide a.finance-link:hover svg, .carfax-hide a.related_vehicle_finance-link:hover svg {
    fill: #000;
}

.carfax-finance-row.carfax-hide a.finance-link:hover, .carfax-hide a.related_vehicle_finance-link:hover {
    background: #fff;
    color: #000;
}

a.finace-regular.finance-link.carfax-show .finance-text {
    text-decoration: unset;
}

a.finace-regular.finance-link {
    border: 1px solid var(--primary);
}


.details_header_regular_subtitle {
    /* color: #334155;
    font-size: 1.125rem;
    line-height: 1.75rem;
    margin-bottom: 0; */
}

.details_header_regular_subtitle-year {
    font-size: 1.125rem;
    line-height: 1.75rem;
    margin-bottom: 0.5rem;
    color: #334155;
}

.details_header_regular_subtitle-maker {
    font-size: 1.125rem;
    line-height: 1.75rem;
    margin-bottom: 0.5rem;
    color: #334155;
}

.details_header_regular_trim {
    font-size: 1.125rem;
    line-height: 1.75rem;
    margin-bottom: 0.5rem;
    color: #334155;
	text-transform: uppercase;
}

@media (min-width: 768px) {

    .details_header_regular_subtitle-year {
        color: #334155;
        font-size: 1.125rem;
        line-height: 1.75rem;
        margin-bottom: 0;
    }

    .details_header_regular_subtitle-maker {
        color: #334155;
        font-size: 1.125rem;
        line-height: 1.75rem;
        margin-bottom: 0;
    }

    .details_header_regular_trim {
        color: #334155;
        font-size: 1.125rem;
        line-height: 1.75rem;
        margin-bottom: 0;
    }
}

.details_header_special_subtitle {
    display: none;

}

@media (min-width: 768px) {
    .details_header_special_subtitle {
        display: block;
    }
}


.details_header_special_subtitle-year {
    font-size: 1.125rem;
    line-height: 1.75rem;
    margin-bottom: 0.5rem;
    color: #334155;
}

.details_header_special_subtitle-maker {
    font-size: 1.125rem;
    line-height: 1.75rem;
    margin-bottom: 0.5rem;
    color: #334155;
}

.details_header_special_subtitle_trim {
    font-size: 1.125rem;
    line-height: 1.75rem;
    margin-bottom: 0.5rem;
    color: #334155;
}

@media (min-width: 768px) {

    .details_header_special_subtitle-year {
        color: #334155;
        font-size: 1.125rem;
        line-height: 1.75rem;
        margin-bottom: 0;
    }

    .details_header_special_subtitle-maker {
        color: #334155;
        font-size: 1.125rem;
        line-height: 1.75rem;
        margin-bottom: 0;
    }

    .details_header_special_subtitle_trim {
        color: #334155;
        font-size: 1.125rem;
        line-height: 1.75rem;
        margin-bottom: 0;
    }
}


.hover-overlay {
    display: none !important;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    background: rgba(0, 0, 0, 0.6);
    transition: all 0.3s ease;
    pointer-events: none;
}

.hover-overlay--active {
    height: 100%;
}

.hover-overlay--inactive {
    height: 0;
}

.video-icon-wrapper {
    position: absolute;
    top: 3px;
    /* same as top-3 */
    left: 3px;
    /* same as left-3 */
}

@media (min-width: 768px){
.video-icon-wrapper {
    position: absolute;
    top: 12px;
    /* same as top-3 */
    left: 12px;
    /* same as left-3 */
}
}

.video-icon {
    width: 32px;
    /* w-8 */
    height: 32px;
    /* h-8 */
    border-radius: 50% !important;
    background-color: #ffffff;
    border: 2px solid #ef4444 !important;
    /* red-500 */
}

.badge-wrapper {
    position: absolute;
    bottom: 12px;
    /* bottom-3 */
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    z-index: 12;
}


video.idm-main-image,
iframe.idm-main-image,
.custom-iframe-wrapper.idm-main-image {
    pointer-events: auto ;
}

/* Car Image Thumbnails Styling */
.car-image-thumbnails .splide__slide img {
    opacity: 0.5;
}

.car-image-thumbnails .splide__slide.is-current-thumb:not(.splide__slide--clone) img {
    opacity: 1;
    border: 2px solid #333;
}

.car-image-thumbnails .splide__slide.is-video-active:not(.splide__slide--clone) img {
    border: none ;
    border-radius: 0 ;
}


.card-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    padding-left: 1rem;
    padding-right: 1rem;
}

@media (min-width: 640px) {
    .card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 768px) {
    .card-grid {
        row-gap: 2rem !important;
        column-gap: 1rem !important;
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }
}

@media (min-width: 1024px) {
    .card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1rem;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}

@media (min-width: 1280px) {
    .card-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.react-scroller {
    position: fixed;
    right: 1rem;
    bottom: 2.25rem !important;
    width: 31.5px !important;
    height: 31.5px !important;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #ffffff;
    font-weight: 600;
    cursor: pointer;
    z-index: 99;
    border: 1px solid #969393 !important;
    border-radius: 0.125rem !important;
    background: var(--primary);
}

.react-scroller:hover {
    background: var(--primary);
}

.react-scroller-icon {
    color: #ffffff !important;
    width: 1.5rem;
    height: 1.25rem;
}

/* Related Vehicles Slide Classes */
.related-hover-overlay {
    display: none !important;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    background: rgba(0, 0, 0, 0.6);
    transition: all 0.3s ease;
    pointer-events: none;
}

.related-hover-overlay--active {
    height: 100%;
}

.related-hover-overlay--inactive {
    height: 0;
}

.related-video-icon-wrapper {
    display: none;
    position: absolute;
    top: 3px;
    left: 3px;
}

@media (min-width: 768px) {
    .related-video-icon-wrapper {
        display: none;
        position: absolute;
        top: 12px;
        left: 12px;
    }
}

.related-badge-wrapper {
    display: none;
    /* display: flex;  */
    position: absolute;
    bottom: 12px;
    left: 0;
    right: 0;

    justify-content: center;
    z-index: 250;
}



/* ===== Popup Pricing Sidebar Styles ===== */
.popup-sidebar-info-regular{
    /* display: none; */
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap:5px;
    margin-bottom:10px ;
}
.popup-subtitle-regular-sm {
    display: none;
    /* padding-top: 4px; */
    padding-bottom: 0;
}

@media screen and (min-width: 768px) {
    .popup-subtitle-regular-sm {
        display: block !important;
    }
}

.popup-subtitle-special {
    display: none;
    padding-top: 4px;
    padding-bottom: 0;
}

@media screen and (min-width: 768px) {
    .popup-subtitle-special {
        display: block!important;
    }
}

.popup-subtitle-regular-sm-sub {
    /* font-size: 1.125rem;
    line-height: 1.75rem;
    margin-bottom: 0.5rem;
    color: #334155; */
}

.popup-subtitle-regular-sm-title {
    font-size: 1.875rem;
    font-weight: 700;
    color: var(--title);
    line-height: 2.5rem;
    letter-spacing: 3px;
    margin-bottom: 0;
}

.popup_sidebar-info-regular {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 8px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
}

.popup_price_div_regular {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.popup_price {
    width: 150px;
    text-align: right;
    font-size: 2.25rem;
    font-weight: 700;
    color: var(--primary);
    line-height: 2.75rem;
    margin-bottom: 0;
}

.popup_header_regular_subtitle-year {
    font-size: 1.125rem;
    line-height: 1.75rem;
    margin-bottom: 0.5rem;
    color: #334155;
}

.popup_header_regular_subtitle-maker {
    font-size: 1.125rem;
    line-height: 1.75rem;
    margin-bottom: 0.5rem;
    color: #334155;
}

.popup_header_regular_trim {
    font-size: 1.125rem;
    line-height: 1.75rem;
    margin-bottom: 0.5rem;
    color: #334155;
	text-transform: uppercase;
}

.popup_header_regular_dot {
    color: #161244;
    margin: 0 0.25rem;
}

@media (min-width: 768px) {

    .popup_header_regular_subtitle-year {
        color: #334155;
        font-size: 1.125rem;
        line-height: 1.75rem;
        margin-bottom: 0;
    }

    .popup_header_regular_subtitle-maker {
        color: #334155;
        font-size: 1.125rem;
        line-height: 1.75rem;
        margin-bottom: 0;
    }

    .popup_header_regular_trim {
        color: #334155;
        font-size: 1.125rem;
        line-height: 1.75rem;
        margin-bottom: 0;
    }
}

.popup_header_special_subtitle-year {
    font-size: 1.125rem;
    line-height: 1.75rem;
    margin-bottom: 0.5rem;
    color: #334155;
}

.popup_header_special_subtitle-maker {
    font-size: 1.125rem;
    line-height: 1.75rem;
    margin-bottom: 0.5rem;
    color: #334155;
}

.popup_header_special_subtitle_trim {
    font-size: 1.125rem;
    line-height: 1.75rem;
    margin-bottom: 0.5rem;
    color: #334155;
}

.popup_header_special_dot {
    color: #161244;
    margin: 0 0.25rem;
}

@media (min-width: 768px) {

    .popup_header_special_subtitle-year {
        color: #334155;
        font-size: 1.125rem;
        line-height: 1.75rem;
        margin-bottom: 0;
    }

    .popup_header_special_subtitle-maker {
        color: #334155;
        font-size: 1.125rem;
        line-height: 1.75rem;
        margin-bottom: 0;
    }

    .popup_header_special_subtitle_trim {
        color: #334155;
        font-size: 1.125rem;
        line-height: 1.75rem;
        margin-bottom: 0;
    }
}

.popup_sidebar-info-special {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 8px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
    margin-top: 1rem;
}

.popup_total_price_amount {
    width:136px;
    text-align: right;
    font-size: 2.15rem !important;    
    font-weight: 700;
    color: var(--primary);
    line-height: 2.75rem;
}

/* Popup Pricing Detail Styles */
.popup-detail-pricing {
    display: flex !important;
    justify-content: space-between !important;
    align-items: start !important;
    gap: 0px !important;
    margin-top:4px;
    margin-bottom: 10px;
}

.popup-retail-price-label {
    font-size: 0.875rem;
    font-weight: 600;
    color: #475569;
    display: none;
}

.popup-retail-price {
    font-size: 0.875rem;
    font-weight: 400;
    color: #64748b;
    text-decoration: line-through;
    display: block;
}

.popup-apr {
    font-size: 0.875rem;
    font-weight: 500;
    color: #475569;
    display: block;
}
/* styles.css */
.popup-sepcial-model {
  font-size: 1.875rem; /* equivalent to !text-3xl */
  font-weight: bold; /* equivalent to !font-bold */
  color: var(--title); /* using custom CSS variable */
  line-height: 2.5rem; /* equivalent to !leading-10 */
  letter-spacing: 3px; /* equivalent to !tracking-[3px] */
  margin-bottom: 0; /* equivalent to !mb-0 */

}


/* for regular Dealers */
div#footer-top-images {
    display: none;
}

span.retail-price,
.details_header_special,
.span.retail-price-label,
.details-subtitle-special,
.details_price_div_regular .retail-price-label {
    display: none ;
}

.popup-subtitle-special, .popup-retail-price {
    display: none !important;
}


/* .details-subtitle-regular {
    display: block;
} */

img.idm-logo-image {
    max-height: 80px;
}

/* ====================================================
   Badge Wrapper & Tooltip Styles
   ==================================================== */

/* Slide from bottom transition for badge wrapper on card hover */
.custom-badge-wrapper {
    position: absolute;
    bottom: 8px;
    right: 8px;
    transform: translateY(32px);
    opacity: 0;
    transition: transform 0.35s ease-out, opacity 0.3s ease-in;
    z-index: 20;
    pointer-events: none;
    /* Allow hovering through the wrapper to trigger card hover */
}

/* Related vehicle badges centered horizontally */
.related-custom-badge-wrapper {
    position: absolute;
    bottom: 8px;
    left: 50%;
    transform: translate(-50%, 32px);
    opacity: 0;
    transition: transform 0.35s ease-out, opacity 0.3s ease-in;
    z-index: 20;
    pointer-events: none;
    /* Allow hovering through the wrapper to trigger card hover */
}

.car-card-container:hover .custom-badge-wrapper {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}

.car-card-container:hover .related-custom-badge-wrapper {
    transform: translate(-50%, 0);
    opacity: 1;
    pointer-events: auto;
}

/* Tooltip container for each individual badge */
.custom-badge-container {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Tooltip bubble styling */
.custom-badge-tooltip {
    pointer-events: none;
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(-5px);
    margin-bottom: 8px;
    white-space: nowrap;
    border-radius: 4px;
    background-color: #1a1a1a;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 500;
    color: #ffffff;
    opacity: 0;
    transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;
    z-index: 50;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}

.custom-badge-container:hover .custom-badge-tooltip {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* Arrow point for the tooltip */
.custom-badge-tooltip-arrow {
    position: absolute;
    top: 100%;
    left: 50%;
    margin-top: -1px;
    height: 6px;
    width: 12px;
    transform: translateX(-50%);
    fill: #1a1a1a;
    color: #1a1a1a !important;
}

/* Limit badges to max 3 */
.badge-limit-3>*:nth-child(n+4) {
    display: none !important;
}

/* ==================================================== 
   Details Page Badges & Tooltips
   ==================================================== */

/* Hide the default span label */
.details_badge-label {
    display: none !important;
}

/* Tooltip container for each individual details badge */
.details-custom-badge-container {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Tooltip bubble styling for details page badges */
.details_badge-item.details-custom-badge-container .details-custom-badge-tooltip {
    pointer-events: none;
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(-5px);
    margin-bottom: 8px;
    white-space: nowrap;
    border-radius: 4px;
    background-color: #1a1a1a !important;
    background: #1a1a1a !important;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 500;
    color: #ffffff !important;
    opacity: 0;
    transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;
    z-index: 99999 !important;
    /* Ensure it is on top */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3) !important;
}

.details-custom-badge-container:hover .details-custom-badge-tooltip {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* Arrow point for details page tooltip */
.details-custom-badge-tooltip-arrow {
    position: absolute;
    top: 100%;
    left: 50%;
    margin-top: -1px;
    height: 6px;
    width: 12px;
    transform: translateX(-50%);
    fill: #1a1a1a !important;
    color: #1a1a1a !important;
}

/* Styling for Badges paragraph header in details sidebar */
.badge-style {
    font-size: 14px;
    font-weight: 700;
    color: #666;
    text-transform: capitalize;
    margin-bottom: 6px;
    font-family: "Outfit", Sans-serif !important;
    letter-spacing: 1px;
}

@media screen and (min-width: 1024px) {
    .badge-style {
        text-align: end !important;
    }

    /* Shift the last badge's tooltip to the left on desktop to prevent cut off */
    .details_badge-item.details-custom-badge-container:last-child .details-custom-badge-tooltip {
        left: auto !important;
        right: calc(50% - 15px) !important;
        transform: translate(0, -5px) !important;
    }

    .details_badge-item.details-custom-badge-container:last-child:hover .details-custom-badge-tooltip {
        transform: translate(0, 0) !important;
    }

    .details_badge-item.details-custom-badge-container:last-child .details-custom-badge-tooltip-arrow {
        left: auto !important;
        right: 15px !important;
        transform: translateX(50%) !important;
    }
}

@media only screen and (max-width: 767px) {
    /* Shift the first badge's tooltip to the right on mobile to prevent cut off */
    .details_badge-item.details-custom-badge-container:first-child .details-custom-badge-tooltip {
        right: auto !important;
        left: calc(50% - 15px) !important;
        bottom: 100% !important;
        top: auto !important;
        margin-bottom: 8px !important;
        transform: translate(0, -5px) !important;
    }

    .details_badge-item.details-custom-badge-container:first-child:hover .details-custom-badge-tooltip {
        transform: translate(0, 0) !important;
    }

    .details_badge-item.details-custom-badge-container:first-child .details-custom-badge-tooltip-arrow {
        right: auto !important;
        left: 15px !important;
        top: 100% !important;
        margin-top: -1px !important;
        transform: translateX(-50%) !important;
    }
}






/* for weekly price enable  */
/* a.finace-regular.finance-link.carfax-show, .price-row-regular, .details_header_regular, .details_header_regular, .popup-sidebar-info-regular, .details-subtitle-regular {
    display: none !important;
}


.details_header_special, .popup-subtitle-special, .popup-retail-price, .popup-retail-price-label, .details_header_special_subtitle, .details_price_div_regular .retail-price-label, span.retail-price  {
    display: block !important;
}


.price-row-special, .carfax-finance-row, .slide-card-pricing-special, .related_vehicle_carfax-finance-row, .related_vehicle_price-row-special {
    display: flex !important;
}

.badge-style {
    text-align: start !important;
}


.apr, .popup-apr {
    text-align: end;
}

.popup_header_special_subtitle_trim, .details_header_special_subtitle {
    word-wrap: break-word;
}

.price-row-special .price-row-special__column:last-child, .related_vehicle_price-row-special .related_vehicle_price-row-special__column:last-child {
    text-align: end;
}

.price-row-special .price-row-special__column:last-child .price-row-special__weekly, .related_vehicle_price-row-special .related_vehicle_price-row-special__column:last-child .related_vehicle_price-row-special__weekly {
    justify-content: flex-end; */
}

/* End for weekly price enable  */