.carousal-container ::-webkit-scrollbar {
     width: 10px;
     /* scrollbar width */
 }
 .carousal-container ::-webkit-scrollbar-track {
     background: #F2F3F5;
     /* track color */
 }
 .carousal-container ::-webkit-scrollbar-thumb {
     background: #03428E;
     ;
     /* scrollbar color */
     border-radius: 6px;
 }
 body {
     margin: 0;
     padding: 0;
     overflow-x: hidden;
 }
div[data-btntype="label"] .geocode-btn {
color:#03428E !important;
}
 .recaptcha-container {
     position: fixed;
     width: 100%;
     height: 100%;
     z-index: 9999;
     background-color: rgba(0, 0, 0, 0.7);
     display: flex;
     justify-content: center;
     align-items: center;
     inset: 0;
 }
 .recaptcha-container>div {
     display: flex;
     flex-direction: column;
     align-items: end;
     gap: 12px;
 }
 form {
     margin: 0 auto;
     display: flex;
     flex-direction: column;
     gap: 40px;
     padding-bottom: 48px;
 }

 .form-sections-container {
     display: flex;
     flex-direction: column;
     gap: 40px;

 }

 button {
cursor:pointer;
     padding: 8px 20px;
     display: flex;
     justify-content: center;
     align-items: center;
     border: 2px solid #03428E;
     border-radius: 35px;
     gap: 8px;
     width: fit-content;
     height: fit-content;


     font-family: Encode Sans Expanded;
     font-weight: 600;
     font-style: SemiBold;
     font-size: 14px;
     leading-trim: NONE;
     line-height: 20px;
     letter-spacing: 0%;
     text-align: center;
     text-wrap: nowrap;

     transition: 0.3s ease-in-out;
 }

 .secondary {
     border-color: #03428E !important;
     color: #03428E !important;
     background: white !important;
 }

 label[for="tc"] {
     font-family: Encode Sans;
     font-weight: 400;
     font-style: Expanded Regular;
     font-size: 12px;
     leading-trim: NONE;
     line-height: 16px;
     letter-spacing: 0px;
     color: #222939;
     display: flex;
     gap: 4px;
 }
 label[for="tc"] a {
     font-family: Encode Sans;
     font-weight: 400;
     font-style: Expanded Regular;
     font-size: 12px;
     leading-trim: NONE;
     line-height: 16px;
     letter-spacing: 0px;
     text-decoration: underline;
     text-decoration-style: solid;
     text-decoration-offset: 0%;
     text-decoration-thickness: 0%;
     text-decoration-skip-ink: auto;
     color: #03428E;
 }

 .primary {
     color: white;
     background-color: #03428E;

 }

 .primary:hover {
     background-color: #03428e44;
     color: #03428E;
 }






 .map {
     width: 100%;
     height: 100%;
     z-index: 8;
 }

 .marker-label-left {

     white-space: normal;
     max-width: 15ch;
     font-size: 14px;
     color: #E42313;
     text-align: start;
     transform: translateX(100%);
     margin-left: 8ch;
     /* Dark text shadow */
     text-shadow: 2px 2px 2px rgba(255, 255, 255, 0.938)
 }


 .input-wrapper {
     position: relative;
display:flex;
align-items:center;
gap:2px;
flex:1;
    border: 1.5px solid #86898F;
    border-radius: 8px;
padding:12px;
cursor:pointer;
 }
.input-wrapper:focus-within{
border-color: rgb(0, 182, 165);
}
 .input-wrapper input{
    box-sizing: border-box;
cursor:pointer;
 }

.input-wrapper input:focus {
    cursor: text;
}

 .input-wrapper.error input {
     border-color: red;
     font-family: Encode Sans;
     font-size: 14px;
     
 }

 .input-wrapper.error::after {
     content: "Invalid zipcode";
     position: absolute;
     top: 100%;
     left: 0;
     margin-top: 4px;
     font-size: 12px;
     color: red;
 }

 .c-container {
     width: 1241px;
     margin: 0 auto;
 }


 .g-progress-bar {
     width: 666px;
 }



 .field-empty {
     border-color: #E42313 !important;
     /* position: absolute;
            content: "Please fill all fields";
            left: 4px;
            top: -1.4em;
            font-size: 9px;
            width: 100%;
            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap;
            color: red;
            font-weight: 400; */
 }

 @media(max-width:1241px) {
     .c-container {
         width: 98%;
     }

 }




 @media(max-width:1024px) {
     .select-dealer-btn {
         width: fit-content;
     }

.select-dealer-btn svg{
display:none;
}
 }
 @media(min-width:769px) and (max-width:1024px) {
     form {
         width: 95%;
     }
 }
 @media(max-width:768px) {
.input-wrapper input{
 width:inherit !important;
}
     form {
         width: 90%;
 gap:0px;     
}

form #dealer-selection,form .submit-section{
 margin-top:40px;
}
     label[for="tc"] {
         width: 100%;
     }

     label[for="tc"] span {
         max-width: max-content;
     }
 }

 .dealer-card {
     border-radius: 20px;
     border: 1px solid var(--Anthracite-200, #B9BCC3);
     display: flex;
     flex-direction: column;
     height: fit-content;
     text-align: start;
 }


 .dealer-info,
 .dealer-footer {
     margin: 11px 15px;
     width: auto !important;
 }

 .dealer-footer {
     display: flex;
     flex-direction: column;
     gap: 8px;
 }

 .dealer-name {
     color: var(--Anthracite-600, #222939);
     /* Body/Small/Bold */
     font-family: "Encode Sans";
     font-size: 14px;
     font-style: normal;
     font-weight: 600;
     line-height: 20px;
     /* 142.857% */


     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
 }

 .dealer-dis {
     color: var(--Anthracite-500, #4B4F59);
     font-family: "Encode Sans";
     font-size: 12px;
     font-style: normal;
     font-weight: 400;
     line-height: 18px;
 }


 .dealer-map {
     width: 100%;
     aspect-ratio: 16/9;
     background-color: #4B4F59;
 }



 .current-selected-vehicle {
     color: var(--Anthracite-600, #222939);

     /* Body/Small/Regular */
     font-family: "Encode Sans";
     font-size: 14px;
     font-style: normal;
     font-weight: 700;
     line-height: 20px;
     /* 142.857% */
 }


 .inventory-count {
     padding: 3px 14px;
     display: flex;
     text-align: center;
     align-items: center;
     justify-content: center;
     gap: 10px;
     background-color: #222939;
     border-radius: 8px;
     height: fit-content;
     width: fit-content;
     color: white;


     color: var(--White, #FFF);

     /* Body/Large/Bold */
     font-family: "Encode Sans";
     font-size: 16px;
     font-style: normal;
     font-weight: 600;
     line-height: 24px;
     /* 150% */

     white-space: nowrap;
 }


 .cta-container {
     display: flex;
     justify-content: space-between;
     align-items: center;
 }

 .select-dealer-btn {
     padding: 8px 20px;
     display: flex;
     gap: 8px;
     color: white;
     background-color: #03428E;
     border-radius: 35px;
     align-items: center;
     justify-content: center;
     outline: none;
     border: 1.5 px solid #03428E;

     color: var(--White, #FFF);
     text-align: center;

     /* Button/Regular */
     font-family: "Encode Sans Expanded";
     font-size: 14px;
     font-style: normal;
     font-weight: 600;
     line-height: 20px;
     /* 142.857% */
 }

 img {
     max-width: 100%;
 }

 .inventory-info {
     display: flex;
     gap: 30px;
 }

 .inventory-info-dealer {

     display: flex;
     flex-direction: column;
     justify-content: space-between;
     max-width: calc(1241px - 975px);
gap:24px;
 }

 .inventory-info-dealer>div:first-child {
     display: flex;
     flex-direction: column;
 }

 .select-vehicle {
     color: var(--Primary-Blue-Main-500, #03428E);
     text-wrap: nowrap;

     /* Header/H5/Title Case/Regular/Large */
     font-family: "Encode Sans";
     font-size: 20px;
     font-style: normal;
     font-weight: 700;
     line-height: 28px;
     /* 140% */
 }


 .inventory-info-dealer .notification {
     display: flex;
     align-items: center;
     gap: 8px;

     color: var(--Anthracite-600, #222939);

     /* Body/Large/Regular */
     font-family: "Encode Sans";
     font-size: 16px;
     font-style: normal;
     font-weight: 400;
     line-height: 24px;
 }

 .dealer-info-content {
     padding: 28px;
     text-align: center;
     display: flex;
     flex-direction: column;
     gap: 12px;
     border-radius: 20px;
     background-color: #F2F3F5;
 }




 .dealer-info-content .dealer-name {
     white-space: wrap !important;
 }

 .your-selected-dealer {
     color: var(--Primary-Blue-Main-500, #03428E);
     text-align: center;
     font-family: "Encode Sans";
     font-size: 17px;
     font-style: normal;
     font-weight: 600;
     line-height: 28px;
     /* 164.706% */
 }

 .primary-btn {
     padding: 8px 20px;
     border-radius: 35px;
     background-color: #03428E ;
     color: white;
     outline: none;
     border: none;
     width: 100%;
     align-self: center;
     border: 2px solid #03428E !important;
 }

.vehicle-card img{
aspect-ratio:16/9;
}
 .vehicle-card.selected button {
     border-color: #006E6A !important;
     color: #006E6A !important;
     background-color: #DFF7F5 !important;
 }

 .dealer-name-addr,
 .selected-vehicle-info {
     display: flex;
     flex-direction: column;
 }



 .vehicle-card {
     display: flex;
     flex-direction: column;
     gap: 12px;
     padding: 12px;
     border-radius: 20px;
     border: 1px solid var(--Anthracite-200, #B9BCC3);
 }

 .vehicle-card input[type="checkbox"] {
     appearance: none;
     width: 24px;
     height: 24px;
     border: 2px solid #86898F;
     border-radius: 50%;
     background-color: #86898F;
     position: relative;
     cursor: pointer;
 }

 .vehicle-card input[type="checkbox"]::after {
     content: "";
     position: absolute;
     top: 45%;
     left: 50%;
     width: 4px;
     height: 9px;
     border: solid white;
     border-width: 0 2px 2px 0;
     transform: translate(-50%, -50%) rotate(45deg);
     opacity: 0;
 }

 .vehicle-card input[type="checkbox"]:checked {
     background-color: #00B6A5 !important;
     border-color: #006E6A !important;
 }

 .vehicle-card input[type="checkbox"]::after {
     opacity: 1;
     /* show tick when checked */
 }


 .vehicle-card.selected {
     border-color: #00B6A5;
 }

 .vehicle-card input[type="checkbox"] {
     align-self: flex-end;
 }

 .vehicle-card .vehicle-name {
     text-align: center;

     color: var(--Anthracite-600, #222939);
     text-align: center;

     /* Body/Large/Bold */
     font-family: "Encode Sans";
     font-size: 16px;
     font-style: normal;
     font-weight: 600;
     line-height: 24px;
     /* 150% */

     min-height: 3.2rem;
 }


 .vehicle-card .vehicle-card-footer {
     display: flex;
     width: 100%;
     justify-content: space-between;
 }

 .vehicle-card-footer a {
     color: var(--Anthracite-600, #222939);
     text-align: center;
     font-family: "Encode Sans";
     font-size: 12px;
     font-style: normal;
     font-weight: 400;
     line-height: 16px;
     text-decoration: none;

     display: flex;
     align-items: center;
     justify-content: center;
     gap: 4px;
     cursor: pointer;
     /* 133.333% */
 }


 .vehicle-card .msrp {
     color: var(--Anthracite-600, #222939);
     font-family: "Encode Sans";
     font-size: 12px;
     font-style: normal;
     font-weight: 700;
     line-height: 16px;
 }


 .inventory-info-dealer div {
     width: auto !important;
 }


 #dealer-inventory-container {
     display: flex;
     gap: 32px;
 }

 #dealer-inventory-container .carousal {
     padding: 0px;
     width: 943px !important;
 }


button:focus {
  outline: none;
}


 button:focus-visible {
     outline: 2px solid black !important;
     outline-offset: 2px;
 }


 @media(max-width:1024px) {
     #dealer-inventory-container {
         overflow-x: scroll;
         padding-bottom: 18px;
     }

     .vehicle-card {
         min-width: 294px;
     }

 }