/* Brand specific variables */
:root {
    --skoda-primary-dark: #0d3b2e;
    --skoda-primary-base: #419468;
    --skoda-primary-light: #78FAAE;
    --skoda-primary-lighter: #E8FFF1;
    --skoda-hover-primary: #59BC87;
    --skoda-hover-secondary: #A8FFCC;
    --autocomplete-selected-item-background-color: #419468;
    --datepicker-primary: #419468;
    --datepicker-primary-alt-1: #78FAAE;
    --datepicker-primary-alt-2: #E8FFF1;
}
/* Fonts */
@font-face {
    font-family: "TYPO_1";
    src: url("../../fonts/SKODA/SKODANext-Light.woff2") format("woff2");
    font-style: normal;
    font-display: swap;
    font-weight: 300
}
@font-face {
    font-family: "TYPO_2";
    src: url("../../fonts/SKODA/SKODANext-Regular.woff2") format("woff2");
    font-style: normal;
    font-display: swap;
    font-weight: 400;
}
@font-face {
    font-family: "TYPO_3";
    src: url("../../fonts/SKODA/SKODANext-Bold.woff2") format("woff2");
    font-style: normal;
    font-display: swap;
    font-weight: 700;
}

/* Match font-family with font-weight */
.ff-1 {
    font-weight: 300;
}
.ff-2 {
    font-weight: 400;
}
.ff-3 {
    font-weight: 700;
}

/* BOOKING SEARCH FORM */
.BSEARCH_FORM,
.BSEARCH_FORM__MAIN {
    background-color: var(--skoda-primary-dark);
}
.BSEARCH_FORM__SINGLE_INPUT_A {
    font-weight: 300;
}
.BSEARCH_FORM__SINGLE_INPUT_A_LABEL {
    font-weight: 300;
}
.BSEARCH_FORM__SINGLE_INPUT_A_LABEL [class^="icon-"] {
    color: var(--skoda-primary-dark);
}
.BSEARCH_FORM__SINGLE_INPUT_A_BORDER_RIGHT_COLOR_ALT {
    border-right-color: var(--skoda-primary-dark);
}
.BSEARCH_FORM__SUBMIT_BTN_DESKTOP {
    background-color: var(--skoda-primary-light);
    border-color: var(--skoda-primary-light);
    color: var(--skoda-primary-dark);
    border-radius: 100px;
}
.BSEARCH_FORM__STORE_SEARCH_TITLE_AMOUNT {
    color: var(--skoda-primary-base);
}
.BSEARCH_FORM__STORE_SEARCH_DISTANCE_ICON,
.BSEARCH_FORM__STORE_SEARCH_EMAIL_ICON {
    color: var(--skoda-primary-base);
}
.BSEARCH_FORM__STORE_SEARCH_DISTANCE_TEXT {
    color: var(--skoda-primary-dark);
}
.BSEARCH_FORM__STORE_INPUT_CTN {
    border-color: var(--skoda-primary-dark);
}
.BSEARCH_FORM__STORE_SEARCH_AUTOCOMPLETE_MY_POSITION {
    color: var(--skoda-primary-dark);
}
#bsearch_form .BSEARCH_FORM__STORE_SEARCH_SELECTED_STORE_ITEM {
    background-color: var(--skoda-primary-base);
}

/* FORMS */


/* Input Badges (checkboxes and radios variants) */
input.INPUT_BADGE:checked ~ label {
    background-color: var(--skoda-primary-base);
}

/* Radio inputs */
input.RADIO_INPUT:checked ~ label .RADIO_INPUT__CHECKZONE::before {
    background-color: var(--skoda-primary-base);
}
input.RADIO_INPUT:checked ~ label .RADIO_INPUT__CHECKZONE {
    border-color: var(--skoda-primary-base);
}

/* Checkbox inputs */
input.CHECKBOX_INPUT:checked ~ label .CHECKBOX_INPUT__CHECKZONE::before {
    background-color: var(--skoda-primary-base);
}
input.CHECKBOX_INPUT:checked ~ label .CHECKBOX_INPUT__CHECKZONE {
    border-color: var(--skoda-primary-base);
}

/* Select inputs + dropdowns */
select.SELECT_INPUT,
button.DROPDOWN_INPUT__PLACEHOLDER {
    font-family: TYPO_1, sans-serif;
    font-weight: 300;
    border-radius: 0px;
}
select.SELECT_INPUT:focus,
input.DROPDOWN_INPUT:focus {
    outline: none;
}
select.SELECT_INPUT:focus ~ label,
input.DROPDOWN_INPUT:focus ~ label {
    font-family: TYPO_2, sans-serif;
}

/* Text inputs */
input.TEXT_INPUT {
    font-family: TYPO_1, sans-serif;
    font-weight: 300;
    border-radius: 0px;
    transition: border-radius 300ms;
}
input.TEXT_INPUT:focus {
    outline: none;
    border-radius: 8px;
}
input.TEXT_INPUT:focus ~ label {
    font-family: TYPO_2, sans-serif;
}

/* BUTTONS */
.BUTTON_PRIMARY {
    color: var(--skoda-primary-light);
    background-color: var(--skoda-primary-dark);
    font-family: TYPO_3, sans-serif;
    border: 1px solid var(--skoda-primary-dark);
    border-radius: 100px;
}
.BUTTON_SECONDARY {
    color: var(--skoda-primary-dark);
    background-color: transparent;
    font-family: TYPO_3, sans-serif;
    border: 1px solid var(--skoda-primary-dark);
    border-radius: 100px;
}