@import "https://fonts.googleapis.com/css2?family=Montserrat:wght@900&display=swap";
@import "https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css";

h1,
h2,
h3,
h4,
h5,
.h5 {
	font-weight: 900 !important;
	text-transform: uppercase;
}

.title+.text {
	margin-top: 0;
}

.wow {
	visibility: hidden;
}

.btn {
	font-weight: 400 !important;
}

header {
	border-bottom: 1px solid #e1e1e1;
}

.header .navbar-nav .nav-link {
	font-weight: 700 !important;
	text-transform: uppercase;
}

.header .header-info-logo-img img {
	width: 200px;
}

.cw-header-contact a:hover {
	color: #FFFFFF;
}

.cw-header-contact .fa {
	display: inline-block;
	vertical-align: middle;
	padding-right: 0.25rem;
	color: var(--color-theme-secondary);
}

.cw-address,
.cw-phone {
	position: relative;
	vertical-align: middle;
	margin: 0.25rem;
	/* padding-left: 1.1rem; */
	color: #FFFFFF;
	font-size: 0.8rem;
	text-transform: uppercase;
	font-weight: 700;
}

.cw-address:before {
	font-family: FontAwesome;
	content: "\f3c5";
	/* position: absolute; */
	/* left: 0; */
	padding-right: 0.5rem;
	color: #FFFFFF;
}

.cw-phone:before {
	font-family: FontAwesome;
	content: "\f2a0";
	/* position: absolute; */
	/* left: 0; */
	padding-right: 0.5rem;
	color: #FFFFFF;
}

/* Hide hours until JS shortens hours */
.cw-header-bar .cw-bar-wrap {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	-moz-column-gap: 1.5rem;
	column-gap: 1.5rem;
}

.cw-lineHours {
	display: none;
	padding: 0.75rem;
	text-align: center;
}

/* Inline container */
.cw-lineHours .cw-hours-inline {
	display: inline-block;
}

/* Wrapping row of chunks */
.cw-lineHours .cw-hours-text {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem 0.75rem;
	line-height: 1.4;
	color: #FFFFFF;
	font-size: 0.8em;
}

/* Each grouped range with its own icon */
.cw-lineHours .cw-chunk {
	display: inline-flex;
	align-items: center;
	white-space: normal;
}

/* Icon before each range */
.cw-lineHours .cw-chunk i {
	margin: 0 0.35rem;
	font-size: 0.8rem;
	line-height: 1;
	flex: 0 0 auto;
}

/* Bold day/day-range */
.cw-lineHours .cw-day {
	font-weight: 600;
	margin-right: 0.25rem;
}

.header .navbar .active>.nav-link,
.header .navbar .nav-link:hover {
	color: var(--color-theme-highlight);
}

.header .dropdown-item .badge {
	background: var(--color-theme-secondary);
	color: var(--color-theme-text-btn);
}

@media (max-width: 992px) {
	.cw-header-contact {
		display: none;
	}
}

@media (min-width: 992px) {
	.cw-header-info .container {
		max-width: 1140px;
	}
	.cw-header-info .header-info-logo-img {
		position: absolute;
		z-index: 1040;
		top: 34px;
	}
	nav.navbar .container {
		min-height: 93px;
	}
	.header.has-cart .collapse.justify-content-center,
	.header .navbar-collapse.justify-content-center {
		justify-content: flex-end !important;
	}
	.header .navbar-nav:not(.navbar-cart) {
		max-width: calc(100% - 210px);
		justify-content: center;
	}
	.cw-phone,
	.cw-address {
		margin-right: 2rem;
	}
}

@media (min-width: 1400px) {
	.header .container,
	.cw-header-contact .container {
		max-width: 1340px;
	}
}

.cw-hero .carousel-item {
	height: 500px;
	background-size: cover;
	background-position: center center;
}

.cw-hero:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgb(0 0 0/40%);
}

.cw-hero .carousel-control-prev,
.cw-hero .carousel-control-next {
	width: 10%;
	text-align: center;
	opacity: 0.7;
	z-index: 3;
}

.cw-hero .carousel-control-prev:hover,
.cw-hero .carousel-control-next:hover {
	opacity: 1;
}

.cw-overlay {
	position: absolute;
	z-index: 1;
	top: 20%;
	width: 100%;
	text-align: center;
	color: #FFFFFF;
}

.cw-overlay h1 {
	font-size: 2.5rem;
	text-transform: uppercase;
	line-height: 1;
}

.cw-overlay h1 span {
	display: block;
	margin: 1rem 0 0.75rem;
	text-transform: uppercase;
	font-weight: 400;
	font-size: 40%;
}

.cw-overlay .cw-button-container {
	justify-content: center;
	max-width: 580px;
	margin: 2rem auto 0;
	padding: 1rem;
	background-color: rgba(0, 0, 0, 0.5);
}

.cw-overlay .cw-button-container .btn {
	margin: 0.25rem;
}

@media (min-width: 768px) {
	.cw-overlay h1 {
		font-size: 4rem;
	}
}

@media (min-width: 1400px) {
	.cw-hero .carousel-item {
		height: 580px;
	}
	.cw-overlay h1 {
		font-size: 5rem;
	}
	.cw-overlay h1 span {
		font-size: 30%;
	}
	.cw-overlay .cw-button-container {
		max-width: 700px;
	}
	.cw-overlay .cw-button-container .btn {
		font-size: 1.25rem;
	}
}

section.inventory-search-module .form__wrapper {
	background-color: var(--color-theme-highlight) !important;
	color: #FFFFFF;
	background-size: contain;
}

.cw-list {
	margin: 2rem 0;
}

.cw-card {
	position: relative;
	overflow: hidden;
	max-height: 300px;
	box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.5);
}

.cw-card a {
	display: block;
	z-index: 2;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.cw-card:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background: rgba(0, 0, 0, 0.25);
	transition: background 0.5s ease-out;
}

.cw-card:hover:before {
	background: rgba(0, 0, 0, 0.6);
}

.cw-card .cw-card-img {
	height: 100%;
	width: 100%;
	-o-object-fit: cover;
	object-fit: cover;
}

.cw-card .cw-card-img-overlay {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding-bottom: 1.75rem;
	justify-content: center;
	color: #FFFFFF;
	text-transform: uppercase;
	background: linear-gradient(to bottom,
			rgba(0, 0, 0, 0) 0%,
			rgba(0, 0, 0, 0.65) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#a6000000', GradientType=0);
}

.cw-card-title {
	font-size: 1.5rem;
	margin-bottom: 1rem;
}

@media (min-width: 768px) {
	.cw-list {
		margin: 4rem 0;
	}
}

.page-home .list {
	padding: 0;
}

.page-home .list .list-wrap {
	margin-bottom: 2em !important;
}

.page-home .list .list-img-wrap {
	margin: auto;
	padding: 34% 0;
}

.page-home .list .list-img-photo {
	background-size: contain;
}

.page-home .list .list-text-title {
	text-transform: none;
	text-transform: uppercase;
}

.page-home .list .list-text-btn {
	display: none;
}

@media (min-width: 992px) {
	.page-home .text h3 {
		font-size: 2.5rem;
	}
	.page-home .text .lead {
		font-size: 1.35rem;
	}
}

@media (min-width: 1400px) {
	.page-home .text h3 {
		font-size: 3.25rem;
	}
}

/* Style Search */
.cw-style-search {
    text-align: center;
    position: relative;
    border-radius: 1vw;
    background: var(--color-theme-background);
    color: var(--color-theme-text)
}

.cw-style-search h2::after {
    content: "";
    display: block;
    height: 3px;
    width: 80px;
    margin: .5rem 0 1.5rem;
    background-color: var(--color-theme-primary)
}

.cw-style-search h2::after {
    margin-right: auto;
    margin-left: auto
}

.cw-style-search .cw-bs-button-text {
    color: var(--color-theme-text);
    position: relative;
    top: 0;
    height: 100%;
    width: 100%;
    display: block;
    height: auto;
    transition: .25s ease-in;
    transition-delay: .1s;
    z-index: 5;
    font-weight: 700
}

.cw-style-search .cw-bs-link {
    position: relative;
    display: block
}

.cw-style-search .cw-bs-link .cw-bs-link-img {
    position: relative;
    z-index: 5;
    max-width: 200px;
    margin: auto
}

.cw-style-search .cw-bs-button {
    margin-top: -45px;
    padding: 43px .5rem .5rem;
    width: 100%;
    text-align: center;
    display: block;
    position: relative;
    background: var(--color-theme-background);
    border: 1px solid var(--color-theme-border);
    border-radius: .5vw;
    transition: .3s ease-in-out;
    transition-delay: .35s;
    overflow: hidden;
    z-index: 1
}

.cw-style-search .cw-bs-button:before {
    content: "";
    display: block;
    background: var(--color-theme-primary);
    position: absolute;
    width: 200%;
    height: 500%;
    border-radius: 100%;
    transition: .8s cubic-bezier(.4, 0, 1, 1);
    z-index: 3
}

.cw-style-search .cw-bs-button:after {
    content: "";
    display: block;
    background: var(--color-theme-highlight);
    position: absolute;
    width: 300%;
    height: 600%;
    border-radius: 100%;
    transition: .4s cubic-bezier(.4, 0, 1, 1);
    z-index: 2
}

.cw-style-search .cw-bs-link:hover .cw-bs-button .cw-bs-button-text {
    color: var(--color-theme-text-btn)
}

.cw-style-search .cw-bs-link:hover .cw-bs-button {
    color: transparent
}

.cw-style-search .cw-bs-link .cw-bs-button:before {
    transform: translate(-110%, -80%) translateZ(0)
}

.cw-style-search .cw-bs-link:hover .cw-bs-button:before {
    transform: translate(-45%, -34%) translateZ(0)
}

.cw-style-search .cw-bs-link .cw-bs-button:after {
    transform: translate(-110%, -80%) translateZ(0)
}

.cw-style-search .cw-bs-link:hover .cw-bs-button:after {
    transform: translate(-55%, -54%) translateZ(0)
}

@media (min-width: 576px) {
    .cw-style-search .cw-bs-button {
        margin-top: -50px;
        padding: 45px 2rem .7rem;
    }
}

/* Text Image */
.cw-textImage {
	position: relative;
	overflow: hidden;
}

.cw-textImage1 {
	margin-bottom: 1rem;
}

.cw-textImage2 {
	margin-bottom: 5rem;
}

.cw-textImage1 .cw-content {
	padding: 2rem;
	background: url(https://cdn.powersports.com/cdn-cgi/image/h=1440,w=1920/BD664CE04C7B7D31509402500C81D72A.jpg) center;
	background-size: cover;
	color: #FFFFFF;
}

.cw-textImage1 .cw-image {
	min-height: 300px;
	background: url(https://cdn.powersports.com/cdn-cgi/image/h=1440,w=1920/343FC8F93751CD88B84A8F846B32C335.jpg);
	background-size: cover;
}

.cw-textImage2 .cw-image {
	padding: 0;
}

.cw-textImage2 .cw-content {
	padding: 2rem;
	background: url(https://cdn.powersports.com/cdn-cgi/image/h=1440,w=1920/2A9EA7B29A326555267FACB1442705F3.jpg) center;
	background-size: cover;
	color: #FFFFFF;
}

.cw-content h4 span {
	font-style: italic;
	font-size: 60%;
}

.cw-intro img {
	width: 200px;
}

.cw-textImage .cw-hours {
	position: relative;
	margin: 0;
}

.cw-textImage .cw-hours:before {
	padding-top: 0.25rem;
	font-size: 2rem;
	color: var(--color-theme-secondary);
}

.cw-mapContact {
	padding: 1rem 0;
	background: rgba(0, 0, 0, 0.1);
}

.cw-textImage .cw-address {
	font-size: 1rem;
}

.cw-textImage .cw-address:before {
	color: var(--color-theme-secondary);
}

@media (min-width: 992px) {
	.cw-textImage .cw-content {
		padding: 8% 4%;
	}
	.cw-textImage1 .cw-image,
	.cw-textImage2 .cw-content {
		border-left: 0.5rem solid #FFFFFF;
	}
	.cw-textImage2 .cw-image,
	.cw-textImage1 .cw-content {
		border-right: 0.5rem solid #FFFFFF;
	}
	.cw-textImage h3 {
		font-size: 2.25rem;
	}
	.cw-textImage h4 {
		font-size: 1.75rem;
	}
	.cw-intro h2 {
		font-size: 2.25rem;
	}
}

@media (min-width: 1400px) {
	.cw-textImage h3 {
		font-size: 2.75rem;
	}
	.cw-textImage h4 {
		font-size: 2rem;
	}
	.cw-intro h2 {
		font-size: 3rem;
	}
	.cw-textImage .cw-content {
		padding: 8%;
	}
}

.popular-vehicles-sections {
	padding: 2em;
}

.popular-vehicles-section-heading::after {
	content: "";
	display: block;
	height: 3px;
	width: 80px;
	margin: 0.5rem 0 1.5rem;
	background-color: var(--color-theme-secondary);
}

.cw-services {
	padding: 28px 0 85px;
}

.cw-services .container {
	max-width: 1500px;
}

.cw-services h2 {
	text-transform: uppercase;
	margin-bottom: 1rem;
}

.cw-services .cw-service-item {
	margin-bottom: 2rem;
}

.cw-services .cw-service-item img {
	width: 270px;
	margin-bottom: 1rem;
	margin-top: 1.5rem;
}

@media (min-width: 768px) {
	.cw-services .cw-service-item {
		padding: 0 1rem;
	}
	.cw-services h2 {
		font-size: 3.25rem;
	}
}

.page-home .inventoryslideshow {
	margin: 5em 0 15px;
	padding-top: 4rem;
	background: #EEEEEE;
}

.inventoryslideshow h3 {
	font-size: 1.1rem !important;
	text-transform: none;
}

.inventoryslideshow h3:hover {
	color: var(--color-theme-secondary);
}

.inventoryslideshow .item__data__price,
.inventoryslideshow .item__data__value {
	font-size: 0.95rem !important;
	text-shadow: 0 0 3px #000;
}

.inventoryslideshow-slick {
	padding: 1rem 0 1.5rem;
	margin-bottom: 0 !important;
}

.inventoryslideshow .card__multi__style7 .item__style {
	display: none;
}

.card__multi__style7 .item__card__photo img {
	border-radius: 0 !important;
}

.card__multi__style7 .item__card__photo:after {
	border-radius: 0 !important;
	background: linear-gradient(to top,
			rgba(0, 0, 0, 0.5),
			transparent) !important;
	color: #FFFFFF;
}

@media (min-width: 992px) {
	.inventoryslideshow-title-heading {
		font-size: 2.5rem;
	}
}

@media (min-width: 1400px) {
	.inventoryslideshow-title-heading {
		font-size: 3.25rem;
	}
}

.inventory {
	padding-top: 0 !important;
}

.inventory .vehicle-card.layout-1 .price-mileage-block .value {
	font-size: 1rem !important;
}

.inventory .vehicle-card .card-body h5.inventory-title {
	text-transform: none;
	font-size: 1.1rem;
}

.inventory .srp-sidebar .card-header::before {
	border-color: transparent !important;
}

body .inventory .vehicle-card.layout-1 .price-mileage-block {
	background: rgba(180, 180, 180, 0.15);
}

body .inventory .btn-link.btn-clear-filter {
	color: var(--color-theme-text-btn);
}

.inventory .srp-sidebar .card-header .card-title {
	color: #FFFFFF;
}

.inventory .inventory-cta .btn {
	background: var(--color-theme-secondary) !important;
	border-color: var(--color-theme-secondary) !important;
}

.inventory .vehicle-card.layout-2 .price {
	background: var(--color-theme-highlight) !important;
	font-weight: 700;
	color: #333 !important;
}

body .p-veh-card .card-top-img a {
	display: block;
}

body .inventory .carousel-indicators {
	background: transparent !important;
	bottom: 0;
	margin-bottom: 0;
}

.inventory .carousel-indicators [data-bs-target] {
	width: 7px;
	height: 7px;
	background: var(--color-theme-highlight);
}

.inventory .btn-primary,
.inventory .btn-primary:focus {
	background: var(--color-theme-highlight) !important;
	border-color: var(--color-theme-highlight) !important;
}

.vdp__title__mod {
	background: var(--color-theme-highlight);
	padding: 1.5rem 1rem 1rem;
}

.vdp-module-canvas-razor-wrapper .btn-secondary,
section.page-inventory-details .btn.btn-primary,
.vdp-module-canvas-razor-wrapper .btn-check:checked+.btn-outline-secondary {
	background: var(--color-theme-secondary) !important;
	border-color: var(--color-theme-secondary) !important;
}

.vdp-module-canvas-razor-wrapper .btn-secondary:hover {
	background: var(--color-theme-secondary) !important;
	border-color: var(--color-theme-secondary) !important;
}

.page-inventory-details .module,
.vdp-module-canvas-razor-wrapper .module {
	margin-top: 25px !important;
}

.page-inventory .container.mb-4 {
	max-width: none;
	margin-bottom: 0 !important;
	padding: 1rem;
	background: var(--color-theme-primary);
	color: #FFFFFF;
}

.veh__trim[VehicleHeadingWidgetCssScope],
.veh__title[VehicleHeadingWidgetCssScope],
.veh__generation[VehicleHeadingWidgetCssScope],
.vdp__title__mod .veh__price__mileage__wrapper .veh__price[VehicleHeadingWidgetCssScope],
.vdp__title__mod .veh__price__mileage__wrapper .veh__mileage .mileage__value[VehicleHeadingWidgetCssScope],
.vdp__title__mod .veh__mileage[VehicleHeadingWidgetCssScope] {
	color: #FFFFFF !important;
}

.vdp__title__mod .veh__price__mileage__wrapper .veh__price[VehicleHeadingWidgetCssScope] {
	font-size: 1.5rem !important;
}

@media (min-width: 992px) {
	.page-inventory .container.mb-4 {
		padding: 3rem 4rem;
	}
}

@media (min-width: 1400px) {
	.inventory .vehicle-card.layout-1 .price-mileage-block .value {
		font-size: 1.1rem !important;
	}
	.inventory .vehicle-card .card-body h5.inventory-title {
		text-transform: none;
		font-size: 1.2rem;
	}
}

section:not(.page-home) .title {
	position: relative;
	margin-bottom: 2.5rem;
	background: url(https://cdn.powersports.com/cdn-cgi/image/h=1440,w=1920/0D809B399A10C5DE0BC929F83851290A.jpg) no-repeat center;
	background-size: cover;
	text-align: center;
}

section:not(.page-home) .title:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgb(0 0 0/58%);
}

section:not(.page-home) .title .title-heading {
	position: relative;
	z-index: 1;
	margin: auto;
	padding: 2rem 0;
	color: #FFFFFF;
	text-shadow: 0 0 4px #000;
}

section:not(.page-home) .title h1 {
	font-size: 2rem;
}

section:not(.page-home) .form {
	padding-top: 1rem;
}

.employees-email {
	font-size: 0.85rem;
}

@media (min-width: 992px) {
	section:not(.page-home) .title .title-heading {
		padding: 3.5rem 0;
	}
	section:not(.page-home) .title h1 {
		font-size: 2.5rem;
	}
}

.form-forms-header {
	font-size: 1.75rem;
}

hr {
	opacity: 1;
}

.bootstrap-select {
	padding: 0 !important;
	background: 0 0;
	border: none;
}

.bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
	width: 100%;
}

.form .bootstrap-select .dropdown-menu li.selected a,
.form .bootstrap-select .dropdown-menu li.selected a:hover {
	color: #000;
	background: 0 0;
}

.bootstrap-select .dropdown-menu li a span.text {
	display: inline;
	background: 0 0;
}

.bootstrap-select>.dropdown-toggle.bs-placeholder::after {
	border-top-color: var(--color-theme-highlight);
}

/* -------------------- VDP ---------------------- */
.sn_business_openclose.open {
	background: var(--color-theme-primary) !important;
	color: var(--color-theme-text-btn) !important;
}

.vdp-module-canvas-razor-wrapper .vdp__sticky-navigation__mod button.sn_more_btn {
	background: var(--color-theme-primary) !important;
	color: var(--color-theme-text-btn) !important;
}

.vdp-module-canvas-razor-wrapper .vdp__sticky-navigation__mod button.sn_more_btn:hover {
	background: var(--color-theme-secondary);
}

.vdp-module-canvas-razor-wrapper .vdp__sticky-navigation__mod button.sn_more_btn:before {
	background: var(--color-theme-secondary);
}

.vdp-module-canvas-razor-wrapper .vdp__sticky-navigation__mod .sn_share_item a {
	color: var(--color-theme-text);
}

.vdp-module-canvas-razor-wrapper .vdp__sticky-navigation__mod .sn_share_item a:hover {
	color: var(--color-theme-secondary);
}

.vdp-module-canvas-razor-wrapper .vdp__sticky-navigation__mod .sn_dropdown a {
	color: var(--color-theme-text);
}

.vdp-module-canvas-razor-wrapper .vdp__sticky-navigation__mod .sn_dropdown a:hover {
	color: var(--color-theme-secondary);
}

.vdp-module-canvas-razor-wrapper .vdp__dealerInfo__mod .store__hours {
	margin-bottom: 1em;
}

/* Footer and VDP spacing */
.vdp-module-canvas-razor-wrapper {
	margin-bottom: 2em;
}

/* Quick Connect Module */
.vdp-module-canvas-razor-wrapper .vdp__quickconnect__mod .section__title {
	color: var(--color-theme-header);
}

/* ════════════════════════════════════════════════════════════
   CASTILLO AUTO GROUP — v4 OVERRIDES
   Built from inspected class names — June 4, 2026

   TWO BUTTON STYLES ACROSS THE SITE:
   ────────────────────────────────────
   "BLUE"  = Navy #1a4d8f → Light blue #5b9bd5 on hover
             Used for: VIEW DETAILS, browse, upload, nav CTAs
             (matches the existing btn-secondary "Learn More" behavior)

   "GREEN" = Green #1e9e6a → Green #1e9e6a on hover (stays same)
             Used for: SEND buttons, Search button
   ════════════════════════════════════════════════════════════ */

:root {
	--cag-navy: #1a4d8f;
	--cag-navy-dark: #15407a;
	--cag-green: #1e9e6a;
	--cag-lblue: #5b9bd5;
	--cag-coral: #e8602a;
	--cag-orange: #e07820;
	--cag-wash: #f0f4ff;
}

/* ════════════════════════════════════════════════════════════
   1. ALL .btn-primary → NAVY / LIGHT-BLUE HOVER (default)
   This covers: VIEW DETAILS, VIEW ALL INVENTORY,
   SHOP ALL INVENTORY, Upload buttons, financing buttons,
   and any other btn-primary across the site.
   ════════════════════════════════════════════════════════════ */
.btn-primary,
.btn.btn-primary,
a.btn-primary,
button.btn-primary,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active {
	background-color: var(--cag-navy) !important;
	border-color: var(--cag-navy) !important;
	color: #FFFFFF !important;
}

.btn-primary:hover,
.btn.btn-primary:hover,
a.btn-primary:hover,
button.btn-primary:hover {
	background-color: var(--cag-lblue) !important;
	border-color: var(--cag-lblue) !important;
	color: #FFFFFF !important;
}

/* VIEW DETAILS on featured cards — sentence case */
a.btn.btn-primary.col-12 {
	text-transform: none !important;
	font-weight: 500 !important;
	letter-spacing: 0.01em;
}

/* ════════════════════════════════════════════════════════════
   2. SEND BUTTONS → GREEN / GREEN HOVER ("double up")
   Targets the Send button at the bottom of every form page.
   Uses buttontext attribute + btn-submit class.
   ════════════════════════════════════════════════════════════ */

/* Target via the buttontext="Send" attribute on parent wrapper */
[buttontext="Send"] .btn,
[buttontext="Send"] .btn-primary,
[buttontext="Send"] button {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
	color: #FFFFFF !important;
}

[buttontext="Send"] .btn:hover,
[buttontext="Send"] .btn-primary:hover,
[buttontext="Send"] button:hover {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
	color: #FFFFFF !important;
}

/* Also target via the btn-submit class directly */
.btn.btn-primary.btn-submit,
button.btn-submit,
.btn-submit {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
	color: #FFFFFF !important;
}

.btn.btn-primary.btn-submit:hover,
button.btn-submit:hover,
.btn-submit:hover {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
	color: #FFFFFF !important;
}

/* The businessinfo / Contact Us page Send */
.businessinfo .btn-primary.btn-submit,
.businessinfo .btn.btn-primary.btn-submit {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
}

.businessinfo .btn-primary.btn-submit:hover,
.businessinfo .btn.btn-primary.btn-submit:hover {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
}

/* ════════════════════════════════════════════════════════════
   3. SEARCH BUTTON (next to stock#/VIN) → GREEN / GREEN HOVER
   ════════════════════════════════════════════════════════════ */
.inventory-search-module .btn,
.inventory-search-module .btn-primary,
.search-btn,
button[type="submit"].btn-search,
.input-group .btn-primary {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
	color: #FFFFFF !important;
}

.inventory-search-module .btn:hover,
.inventory-search-module .btn-primary:hover,
.search-btn:hover,
.input-group .btn-primary:hover {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
	color: #FFFFFF !important;
}

/* ════════════════════════════════════════════════════════════
   4. EMAIL vs CALL buttons (inventory cards + VDP)
   Email = navy (covered by default .btn-primary)
   Call = GREEN with WHITE phone icon so it's visible
   Email icon stays white on navy background
   ════════════════════════════════════════════════════════════ */

/* CALL → green, not default navy */
.btn-primary:has(.fa-phone),
.btn.btn-primary:has(.fa-phone),
button.btn-primary:has(.fa-phone) {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
	color: #FFFFFF !important;
}

.btn-primary:has(.fa-phone):hover {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
}

/* White icon on green so it's visible */
.btn-primary:has(.fa-phone) .fa-phone,
.btn-primary .fa-phone {
	color: #FFFFFF !important;
}

/* Email icon — white on navy (already correct from default) */
.btn-primary .fa-envelope {
	color: #FFFFFF !important;
}

/* ════════════════════════════════════════════════════════════
   5. CONTACT-US PAGE INFO ICONS (the red circles on right side)
   Phone → green  |  Email → navy  |  Map pin → Google pin
   Using real classes: .contact-icon-call, .contact-icon-address
   Also target the circular background/border around each icon
   ════════════════════════════════════════════════════════════ */

/* Reset ALL contact icons first — remove red from everything */
.contact-details .contact-icon {
	color: inherit !important;
	background-color: transparent !important;
	border-color: currentColor !important;
}

/* Phone icon → green (icon + circle border) */
.contact-details.contact-phone .contact-icon,
.contact-icon-call {
	color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
}

.contact-phone-link {
	color: var(--cag-green) !important;
}

.contact-phone-link:hover {
	color: var(--cag-green) !important;
}

/* Email icon → navy blue */
.contact-details.contact-email .contact-icon,
.contact-icon-email {
	color: var(--cag-navy) !important;
	border-color: var(--cag-navy) !important;
}

/* Map / address icon → Google Maps pin red #EA4335 */
.contact-details.contact-address .contact-icon,
.contact-icon-address {
	color: #EA4335 !important;
	border-color: #EA4335 !important;
}

/* ════════════════════════════════════════════════════════════
   6. FEATURED CARD PRICE BAR → FULL-WIDTH NAVY, EDGE TO EDGE
   Real classes: .item__flex (wrapper), .item__data (each half)
   ════════════════════════════════════════════════════════════ */
.inventoryslideshow .item__flex,
.card__multi__style7 .item__flex {
	display: flex !important;
	width: 100% !important;
	margin: 0 !important;
	background: var(--cag-navy) !important;
	border-radius: 0 !important;
}

.inventoryslideshow .item__flex .item__data,
.card__multi__style7 .item__flex .item__data {
	flex: 1 1 50% !important;
	padding: 0.5rem 0.75rem !important;
	text-align: center;
}

.inventoryslideshow .item__flex .item__data+.item__data {
	border-left: 1px solid rgba(255, 255, 255, 0.25) !important;
}

.inventoryslideshow .item__flex .item__label {
	color: #b9cdec !important;
	font-size: 0.7rem !important;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.inventoryslideshow .item__flex .item__data__value {
	color: #FFFFFF !important;
	font-weight: 700 !important;
	font-size: 1.1rem !important;
	text-shadow: none !important;
}

/* ════════════════════════════════════════════════════════════
   7. HIDE: Ext. Color row on vehicle cards
   Surgical target via data-property attribute
   ════════════════════════════════════════════════════════════ */
.veh__info__item[data-property="Ext. Color"],
.veh__info__item[data-property="Exterior Color"] {
	display: none !important;
}

/* ════════════════════════════════════════════════════════════
   8. HIDE: Style / Exterior Color / Interior Color sidebar filters
   ════════════════════════════════════════════════════════════ */
.srp-sidebar [data-filter-name="Style"],
.srp-sidebar [data-filter-name="ExteriorColor"],
.srp-sidebar [data-filter-name="InteriorColor"],
.srp-sidebar [data-filter-name="Exterior Color"],
.srp-sidebar [data-filter-name="Interior Color"],
.filter-section[data-name="Style"],
.filter-section[data-name="Exterior Color"],
.filter-section[data-name="Interior Color"] {
	display: none !important;
}

/* ════════════════════════════════════════════════════════════
   9. FORM INPUT FOCUS → green ring (replaces red)
   ════════════════════════════════════════════════════════════ */
input:focus,
input:focus-visible,
select:focus,
textarea:focus,
.form-control:focus,
.form-select:focus,
.form-forms-longanswer:focus {
	border-color: var(--cag-green) !important;
	box-shadow: 0 0 0 0.2rem rgba(30, 158, 106, 0.20) !important;
	outline: none !important;
}

/* ════════════════════════════════════════════════════════════
   10. SOFT BLUE WASH on form pages (not harsh white)
   ════════════════════════════════════════════════════════════ */
.businessinfo,
.contact-formleft,
.form-wrap,
.form-display-component {
	background-color: var(--cag-wash) !important;
}

/* Keep form fields white */
.form-control,
input.form-control,
textarea.form-control {
	background-color: #FFFFFF !important;
}

/* ════════════════════════════════════════════════════════════
   11. FINANCING / TRADE-IN description text → readable size
   ════════════════════════════════════════════════════════════ */
.form-description,
.module-description,
.form-forms-longanswer .helptext,
[data-highlightable] .helptext,
.form-group .form-text {
	font-size: 1rem !important;
	line-height: 1.7 !important;
	color: #334455 !important;
}

/* ════════════════════════════════════════════════════════════
   12. VEHICLE INFO bars (VDP) → soft light-blue stripe, not green
   ════════════════════════════════════════════════════════════ */
.veh__info__item {
	background: transparent !important;
}

.veh__info__item:nth-child(odd) {
	background: #eaf1fb !important;
}

.veh__info__wrapper .info__label {
	color: #44566b !important;
}

/* ════════════════════════════════════════════════════════════
   13. PRICE BREAKDOWN — estimated tax context note
   ════════════════════════════════════════════════════════════ */
.srp-ftc-breakdown-disclaimer {
	font-size: 0.8rem !important;
	color: #556 !important;
}

.srp-ftc-breakdown-body::after {
	content: "Heads up: San Leandro sales tax is about 10.75%. On a $7,000 vehicle that\2019s roughly $750 added at registration. Ask us for your full out-the-door price \2014 no surprises.";
	display: block;
	margin-top: 0.75rem;
	padding: 0.75rem 0.9rem;
	background: var(--cag-wash);
	border-left: 3px solid var(--cag-navy);
	border-radius: 0 6px 6px 0;
	font-size: 0.8rem;
	line-height: 1.55;
	color: #334455;
}

/* ════════════════════════════════════════════════════════════
   14. VEHICLE BADGES (ready for JS helper)
   Hybrid = light blue · 4x4 = orange · Gas Saver = green
   ════════════════════════════════════════════════════════════ */
.cag-badge {
	position: absolute;
	top: 8px;
	right: 8px;
	z-index: 6;
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	padding: 3px 10px;
	border-radius: 6px;
	color: #FFFFFF;
}

.cag-badge--hybrid {
	background: var(--cag-lblue) !important;
}

.cag-badge--4x4 {
	background: var(--cag-orange) !important;
}

.cag-badge--gassaver {
	background: var(--cag-green) !important;
}

.cag-badge--sale {
	background: var(--cag-coral) !important;
}

/* ════════════════════════════════════════════════════════════
   15. HIDE hero "Contact Us" button (middle button)
   The hero has 3 buttons inside .cw-button-container.
   Hides the 2nd one. To change text on the 3rd,
   edit it in your page builder hero/slideshow section.
   ════════════════════════════════════════════════════════════ */
.cw-overlay .cw-button-container .btn:nth-child(2) {
	display: none !important;
}

/* ════════════════════════════════════════════════════════════
   16. NAV LINK HOVER → light blue (matches the btn style)
   ════════════════════════════════════════════════════════════ */
.header .navbar .active>.nav-link,
.header .navbar .nav-link:hover {
	color: var(--cag-lblue) !important;
}

/* ════════════════════════════════════════════════════════════
   17. FUTURE CHANGES — add below this line
   ════════════════════════════════════════════════════════════ */

/* ════════════════════════════════════════════════════════════
   v5 FIXES (June 4) — hover state corrections
   These rules use `body` prefix to win on specificity against
   the .inventory .btn-primary base rules above.
   ════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────────────────────
   v5.1 — EMAIL button (anywhere): NAVY default, LIGHT BLUE hover
   White envelope icon, white text
   Higher specificity than .inventory .btn-primary by using body
   ───────────────────────────────────────────────────────────── */
body .btn-primary:has(.fa-envelope),
body .inventory .btn-primary:has(.fa-envelope),
body section.page-inventory-details .btn.btn-primary:has(.fa-envelope),
body .vdp-module-canvas-razor-wrapper .btn-primary:has(.fa-envelope) {
	background-color: var(--cag-navy) !important;
	border-color: var(--cag-navy) !important;
	color: #FFFFFF !important;
}

body .btn-primary:has(.fa-envelope):hover,
body .inventory .btn-primary:has(.fa-envelope):hover,
body section.page-inventory-details .btn.btn-primary:has(.fa-envelope):hover,
body .vdp-module-canvas-razor-wrapper .btn-primary:has(.fa-envelope):hover {
	background-color: var(--cag-lblue) !important;
	border-color: var(--cag-lblue) !important;
	color: #FFFFFF !important;
}

body .btn-primary:has(.fa-envelope) .fa-envelope {
	color: #FFFFFF !important;
}

/* ─────────────────────────────────────────────────────────────
   v5.2 — CALL button: GREEN, hover STAYS GREEN ("double up")
   White phone icon — visible on green
   ───────────────────────────────────────────────────────────── */
body .btn-primary:has(.fa-phone),
body .inventory .btn-primary:has(.fa-phone),
body section.page-inventory-details .btn.btn-primary:has(.fa-phone),
body .vdp-module-canvas-razor-wrapper .btn-primary:has(.fa-phone) {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
	color: #FFFFFF !important;
}

body .btn-primary:has(.fa-phone):hover,
body .inventory .btn-primary:has(.fa-phone):hover,
body section.page-inventory-details .btn.btn-primary:has(.fa-phone):hover,
body .vdp-module-canvas-razor-wrapper .btn-primary:has(.fa-phone):hover {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
	color: #FFFFFF !important;
}

body .btn-primary:has(.fa-phone) .fa-phone {
	color: #FFFFFF !important;
}

/* ─────────────────────────────────────────────────────────────
   v5.3 — Inventory .btn-primary OVERRIDE
   The base file forces .inventory .btn-primary to use
   --color-theme-highlight. We push back to navy/light-blue
   for buttons that aren't Email (envelope) or Call (phone).
   ───────────────────────────────────────────────────────────── */
body .inventory .btn-primary:not(:has(.fa-phone)):not(:has(.fa-envelope)) {
	background-color: var(--cag-navy) !important;
	border-color: var(--cag-navy) !important;
	color: #FFFFFF !important;
}

body .inventory .btn-primary:not(:has(.fa-phone)):not(:has(.fa-envelope)):hover {
	background-color: var(--cag-lblue) !important;
	border-color: var(--cag-lblue) !important;
	color: #FFFFFF !important;
}

/* ─────────────────────────────────────────────────────────────
   v5.4 — Inventory sidebar Contact Us SEND
   User wants this one NAVY → LIGHT BLUE (not the green/green
   the standalone Contact Us page uses). The sidebar Send sits
   inside the inventory page wrapper.
   ───────────────────────────────────────────────────────────── */
body .inventory .btn-submit,
body .inventory .btn.btn-primary.btn-submit,
body .page-inventory .btn-submit,
body .page-inventory .btn.btn-primary.btn-submit,
body section.page-inventory .btn-submit {
	background-color: var(--cag-navy) !important;
	border-color: var(--cag-navy) !important;
	color: #FFFFFF !important;
}

body .inventory .btn-submit:hover,
body .inventory .btn.btn-primary.btn-submit:hover,
body .page-inventory .btn-submit:hover,
body .page-inventory .btn.btn-primary.btn-submit:hover,
body section.page-inventory .btn-submit:hover {
	background-color: var(--cag-lblue) !important;
	border-color: var(--cag-lblue) !important;
	color: #FFFFFF !important;
}

/* ─────────────────────────────────────────────────────────────
   v5.5 — Standalone Contact Us page SEND → GREEN / GREEN
   (page-contact-us is the only page where this applies)
   This needs to beat the .inventory override above, so it
   uses an even more specific selector with body + section
   ───────────────────────────────────────────────────────────── */
body section.page-contact-us .btn-submit,
body section.page-contact-us .btn.btn-primary.btn-submit,
body .page-contact-us .businessinfo .btn-submit,
body .page-contact-us [buttontext="Send"] .btn {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
	color: #FFFFFF !important;
}

body section.page-contact-us .btn-submit:hover,
body section.page-contact-us .btn.btn-primary.btn-submit:hover,
body .page-contact-us .businessinfo .btn-submit:hover,
body .page-contact-us [buttontext="Send"] .btn:hover {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
	color: #FFFFFF !important;
}

/* ─────────────────────────────────────────────────────────────
   v5.6 — All other form-page Send buttons → GREEN / GREEN
   (Value My Trade, Car Finder, Schedule a Visit, Start Your
    Vehicle Purchase, Instant Cash Offer, Referral Program,
    Check for Warranty, Request a Rental Quote, Submit a
    Testimonial). These are non-inventory pages, so they fall
    outside the .inventory override.
   ───────────────────────────────────────────────────────────── */
body section[class*="page-"]:not(.page-inventory):not(.page-cars-for-sale) .btn-submit,
body section[class*="page-"]:not(.page-inventory):not(.page-cars-for-sale) [buttontext="Send"] .btn,
body .page-value-my-trade .btn-submit,
body .page-car-finder .btn-submit,
body .page-schedule-a-visit .btn-submit,
body .page-start-your-vehicle-purchase .btn-submit,
body .page-instant-cash-offer .btn-submit,
body .page-referral-program .btn-submit,
body .page-check-for-warranty .btn-submit,
body .page-request-a-rental-quote .btn-submit,
body .page-submit-a-testimonial .btn-submit,
body .page-loan-application .btn-submit {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
	color: #FFFFFF !important;
}

body section[class*="page-"]:not(.page-inventory):not(.page-cars-for-sale) .btn-submit:hover,
body section[class*="page-"]:not(.page-inventory):not(.page-cars-for-sale) [buttontext="Send"] .btn:hover,
body .page-value-my-trade .btn-submit:hover,
body .page-car-finder .btn-submit:hover,
body .page-schedule-a-visit .btn-submit:hover,
body .page-start-your-vehicle-purchase .btn-submit:hover,
body .page-instant-cash-offer .btn-submit:hover,
body .page-referral-program .btn-submit:hover,
body .page-check-for-warranty .btn-submit:hover,
body .page-request-a-rental-quote .btn-submit:hover,
body .page-submit-a-testimonial .btn-submit:hover,
body .page-loan-application .btn-submit:hover {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
	color: #FFFFFF !important;
}

/* ─────────────────────────────────────────────────────────────
   v5.7 — SEARCH button (Stock # / VIN) → GREEN / GREEN
   Sits next to the search input on the inventory listing page
   ───────────────────────────────────────────────────────────── */
body .inventory .input-group .btn-primary,
body .inventory .input-group button[type="submit"],
body .input-group .btn-primary[type="submit"],
body button.btn-search,
body .stock-search .btn-primary,
body .search-stock .btn-primary {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
	color: #FFFFFF !important;
}

body .inventory .input-group .btn-primary:hover,
body .inventory .input-group button[type="submit"]:hover,
body .input-group .btn-primary[type="submit"]:hover,
body button.btn-search:hover,
body .stock-search .btn-primary:hover,
body .search-stock .btn-primary:hover {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
	color: #FFFFFF !important;
}

/* ─────────────────────────────────────────────────────────────
   v5.8 — VDP "btn-secondary" buttons that were turning green
   Fix the rule at base line 688-697 by overriding with body prefix
   These are the Email/Call style buttons on the vehicle detail page
   ───────────────────────────────────────────────────────────── */
body .vdp-module-canvas-razor-wrapper .btn-secondary:not(:has(.fa-phone)):not(:has(.fa-envelope)),
body section.page-inventory-details .btn.btn-primary:not(:has(.fa-phone)):not(:has(.fa-envelope)) {
	background-color: var(--cag-navy) !important;
	border-color: var(--cag-navy) !important;
	color: #FFFFFF !important;
}

body .vdp-module-canvas-razor-wrapper .btn-secondary:not(:has(.fa-phone)):not(:has(.fa-envelope)):hover,
body section.page-inventory-details .btn.btn-primary:not(:has(.fa-phone)):not(:has(.fa-envelope)):hover {
	background-color: var(--cag-lblue) !important;
	border-color: var(--cag-lblue) !important;
	color: #FFFFFF !important;
}

/* ─────────────────────────────────────────────────────────────
   v5.9 — Browser fallback: if :has() not supported,
   target Email and Call buttons by their inventory-cta class.
   Specifically:
   - .inventory-cta has 2 children: email + call
   - First child → Email (navy)
   - Last child → Call (green)
   ───────────────────────────────────────────────────────────── */
body .inventory-cta .btn:first-child {
	background-color: var(--cag-navy) !important;
	border-color: var(--cag-navy) !important;
	color: #FFFFFF !important;
}

body .inventory-cta .btn:first-child:hover {
	background-color: var(--cag-lblue) !important;
	border-color: var(--cag-lblue) !important;
}

body .inventory-cta .btn:last-child {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
	color: #FFFFFF !important;
}

body .inventory-cta .btn:last-child:hover {
	background-color: var(--cag-green) !important;
	border-color: var(--cag-green) !important;
}

body .inventory-cta .btn .fa {
	color: #FFFFFF !important;
}

/* ─────────────────────────────────────────────────────────────
   v5.10 — Catch-all for any remaining .btn-primary in featured
   slideshow / popular vehicles area → navy / light-blue
   ───────────────────────────────────────────────────────────── */
body .inventoryslideshow .btn-primary,
body .popular-vehicles-sections .btn-primary,
body .card__multi__style7 .btn-primary {
	background-color: var(--cag-navy) !important;
	border-color: var(--cag-navy) !important;
	color: #FFFFFF !important;
}

body .inventoryslideshow .btn-primary:hover,
body .popular-vehicles-sections .btn-primary:hover,
body .card__multi__style7 .btn-primary:hover {
	background-color: var(--cag-lblue) !important;
	border-color: var(--cag-lblue) !important;
	color: #FFFFFF !important;
}

/* ─────────────────────────────────────────────────────────────
   v5.11 — Future placeholder
   ───────────────────────────────────────────────────────────── */
/* v5.12 placeholder */