/*@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');*/

:root {
    --fgv-blue: #003A79;
    --fvg-accent-blue: #0C63AA;
    --fgv-medium-blue: #00377B;
    --fgv-dark-blue: #002D4D;
    --fgv-light-blue: #EBF6FC;

    --fvg-light-cyan: #A9DEFA;

    --fgv-light-gray: #D7D9DD;
    --fgv-off-white: #F7F7F7;
    --fgv-dark-gray: #5C5B5F;
    --fgv-background-gray: #F4F4F4;

    --fgv-dark-red: #9B0A51;
    --fgv-purple: #78487F;
    --fgv-dark-green: #2B8671;
    --fgv-light-green: #668040;
    --fgv-orange: #B06F0B;
    --fgv-yellow: #BDA132;

    --primary-color: var(--fgv-blue);
	--secondary-color: var(--fvg-accent-blue);
    --tertiary-color: var(--fgv-medium-blue);

    --text-color: var(--fgv-dark-gray);
    --dark-color: #333333;

    --success-color: #002D4D;
    --error-color: #ff6b6b;
    --info-color: #2b69ff;

	--body-bg: #fff;
	--light-bg: #f7f7f7;

    /* legacy, prioritize --cb-border-color */
	--border-color: #dddddd;

    --cb-border-color: var(--fgv-light-gray);
    --cb-border-thin: 1px solid var(--fgv-light-gray);
    --cb-border-thick: 3px solid var(--fgv-light-gray);

    /** logo **/
    --cb-logo-width-mobile: 200px;
    --cb-logo-width-desktop: 200px;

    /** header **/
    /** affected by logo height **/
    --fixed-header-small-mobile-spacing: 220px;
    --fixed-header-mobile-spacing: 159px;
    --fixed-header-desktop-spacing: 155px;

	/** common **/
    --spacing: 8px;

    --common-bg: var(--fgv-off-white);
	--common-border: 1px solid var(--cb-border-color);
	--common-light-border: 1px solid #e8eef1;
	--common-shadow: 0px 10px 20px rgba(0, 0, 0, .25);
	--common-radius: 6px;

	/** font **/
	
    /*--main-font: "Montserrat", serif;
    --second-font: "Montserrat", serif;*/

    --main-font: Arial, sans-serif;
    --second-font: Arial, sans-serif;

    --dxp-s-body-font-family: var(--main-font);

    --line-height: 1.4em;

    --font-regular: 400;
    --font-bold: 700;

    --font-small-mob: 12px;
    --font-small-desk: 14px;

    --font-regular-mob: 14px;
    --font-regular-desk: 16px;

    --font-large-mob: 18px;
    --font-large-desk: 20px;

	/** button **/
	--button-padding: 10px 15px;
    --button-large-padding: 10px 15px;

    --button-radius: 6px;

    --link-button-color: var(--fvg-accent-blue);
    --link-button-hover: var(--fvg-dark-blue);

    --button-min-height: 42px;

	/** form **/
    --input-padding: 10px 16px;
	--input-border: var(--common-border);
    --input-radius: 6px;
    --input-focus-border: 1px solid var(--primary-color);
    --input-focus-shadow: 0 0 0 5px rgba(11, 160, 204, 0.35);

	/** override **/
    --sds-c-button-brand-color-background: var(--primary-color);
    --slds-c-button-brand-color-background: var(--primary-color);
    --dxp-s-button-color: var(--primary-color);
    --dxp-g-brand: var(--primary-color);

    --dxp-s-button-color-hover: var(--fgv-dark-blue);
    --dxp-s-button-color-active: var(--fgv-dark-blue);
    --dxp-s-button-color-focus: var(--fgv-dark-blue);

    --dxp-s-button-font-family: var(--main-font);
    --dxp-s-button-radius-border: var(--input-radius);
    --dxp-s-button-font-weight: 400;

    --com-c-unified-cart-badge-link-color: var(--primary-color);
    --dxp-s-button-color: var(--primary-color);
    --dxp-s-link-text-color-hover: var(--primary-color);

    --dxp-s-form-element-radius-border: var(--input-radius);

    --com-c-layout-header-border-bottom: initial;

    /** cb variables **/
    --cb-common-radius: 6px;

    /** header **/
    --cb-header-banner-background: var(--dark-color);
    --cb-header-banner-color: white;

    /** footer **/
    --cb-footer-background: var(--fgv-blue);
    --cb-footer-color: var(--fgv-light-gray);
    --cb-footer-hover: white;
    --cb-footer-border: 1px solid var(--fgv-light-blue);

    /** checkout **/
    --cb-stepbar-completed: var(--primary-color);
    --cb-stepbar-current: var(--secondary-color);
}

body {
    font-family: var(--main-font);
    font-size: 14px;
    font-weight: var(--font-regular);
    color: var(--text-color);
    background-color: var(--body-bg) !important;
}

/** fixed header (native layout using cb header) **/
.cb-header-fixed-wrapper {
    display: block;
    margin-top: var(--fixed-header-small-mobile-spacing);
}

@media (min-width: 560px) {
    .cb-header-fixed-wrapper {
        margin-top: var(--fixed-header-mobile-spacing);
    }
}

@media (min-width: 1024px) {
    .cb-header-fixed-wrapper {
        margin-top: var(--fixed-header-desktop-spacing);
    }
}

/** fix - footer spacing (cookie notice after footer component) **/
div[name="footer"] > .component-wrapper-spacer {
    margin-bottom: 0;
}

/** buttons **/
.cb-button-primary {
    display: inline-block;
    padding: var(--button-padding);
    color: white !important;
    font-weight: 500;
    line-height: 1.6em;
    background-color: var(--fvg-accent-blue) !important;
    border-radius: var(--button-radius);
    border: initial;
    transition: background-color 250ms !important;
}

.cb-button-primary:hover {
    text-decoration: none !important;
    background-color: var(--primary-color) !important;
}

.cb-button-primary:disabled,
.cb-button-primary[disabled] {
    background-color: var(--border-color) !important;
}

.cb-button-secondary {
    padding: var(--button-padding);
    color: white !important;
    font-weight: 500;
    line-height: 1.6em;
    background-color: var(--fvg-accent-blue) !important;
    border-radius: var(--button-radius);
    border: initial;
}

.cb-button-primary-dark,
.cb-button-primary-dark:hover {
    background-color: var(--fgv-dark-blue) !important;
}

.cb-button-outline {
    --slds-c-icon-color-foreground-default: var(--fvg-accent-blue);

    padding: var(--button-padding);
    color: var(--fvg-accent-blue) !important;
    font-weight: 500;
    background-color: white !important;
    border: 1px solid var(--fvg-accent-blue);
    border-radius: var(--button-radius);
    transition: border-color 250ms, background-color 250ms;
}

.cb-button-outline:hover {
    --slds-c-icon-color-foreground-default: white;

    color: white !important;
    background-color: var(--fgv-blue) !important;
    border-color: var(--fgv-blue);
}

.cb-button-outline.active {
    --slds-c-icon-color-foreground-default: white;

    color: white !important;
    background-color: var(--fgv-dark-blue) !important;
    border-color: var(--fgv-dark-blue);
}

.cb-button-outline-icon {
    --slds-c-icon-color-foreground-default: var(--primary-color);

    display: flex;
    gap: 5px;
    align-items: center;
}

.cb-button-outline-danger:hover {
    --slds-c-icon-color-foreground-default: var(--error-color);

    border-color: var(--error-color);
}

.cb-button-outline-danger:hover span {
    color: var(--error-color);
}

.cb-link-button {
    margin: 0;
    padding: 0;
    color: var(--link-button-color) !important;
    font-weight: 500;
    background-color: initial !important;
    border: initial !important;
    transition: color 250ms;
}

.cb-link-button:hover {
    text-decoration: none !important;
    color: var(--link-button-hover);
}

.cb-link-button-arrow {
    display: flex;
    gap: var(--spacing);
    align-items: center;
}

.cb-arrow-reverse span {
    order: 2;
}

.cb-arrow-reverse svg {
    transform: rotate(180deg);
}

.cb-button-outline[disabled] {
    color: var(--text-color) !important;
    background-color: white !important;
    border-color: var(--border-color);
}

.cb-button-outline[disabled]:hover {
    background-color: white !important;
    border-color: var(--border-color);
}

.cb-button-large {
    display: block;
    width: 100%;
    padding: var(--button-large-padding);
}

.cb-button-ghost {
    background-color: var(--fgv-background-gray) !important;
    color: var(--text-color) !important;
}

.cb-button-ghost:hover {
    background-color: var(--fgv-off-white) !important;
}

[kx-scope=button-brand]:hover:before {
    opacity: 0 !important;
}

@media (min-width: 768px) {

    .cb-button-primary,
    .cb-button-secondary,
    .cb-button-outline {
        height: var(--button-min-height);
    }

}

/** titles **/
.cb-large-title {
    margin: 0 0 20px;
    font-family: var(--second-font);
    font-size: 24px;
    font-weight: 400 !important;
    line-height: 1.2em;
    font-weight: 500;
    color: var(--primary-color);
}

.cb-title {
    margin: 0 0 20px;
    font-family: var(--second-font);
    font-size: 20px;
    font-weight: 400 !important;
    line-height: 1.2em;
    font-weight: 500;
    color: var(--primary-color);
}

.cb-title-border {
    padding-bottom: 15px;
    border-bottom: var(--cb-border-thin);
}

.cb-subtitle {
    font-size: 16px;
    color: var(--text-color);
    line-height: var(--line-height);
}

.cb-title-tag {
    font-size: 14px;
    color: var(--text-color);
    font-weight: 500;
}

.cb-title-no-margin {
    margin-bottom: 0;
}

.cb-title-max-width {
    max-width: 540px;
}

@media (min-width: 1024px) {

    .cb-large-title {
        font-size: 32px;
    }

    .cb-title {
        font-size: 24px;
    }

    .cb-title-tag {
        font-size: 16px;
    }

}

/** tags **/
.cb-tag {
    padding: 4px 12px;
    font-size: 14px;
    color: var(--fgv-dark-gray);
    border: 1px solid var(--fgv-light-gray);
    border-radius: 4px;
}

.cb-tag--red {
    color: var(--fgv-dark-red);
    border-color: var(--fgv-dark-red);
}

.cb-tag--lightBlue {
    color: var(--fgv-blue);
    background-color: var(--fgv-light-blue);
    border-color: var(--fgv-light-blue);
}

/** pills **/
.cb-pill {
    padding: 4px 12px;
    font-size: 12px;
    color: var(--fgv-dark-gray);
    border: 1px solid var(--fgv-light-gray);
    border-radius: 30px;
}

.cb-pill--yellow {
    color: #705400;
    background-color: #FFEFC0;
    border-color: #FFEFC0;
}

/** alert **/
.cb-alert {
    display: block;
    padding: calc(var(--spacing) * 2);
    color: white;
    text-align: center;
    background-color: var(--primary-color);
    border-radius: var(--cb-common-radius); 
}

.cb-alert--success {
    background-color: var(--success-color);
}

.cb-alert--error {
    background-color: var(--error-color);
}

.commerce-breadcrumb {
    --com-c-breadcrumbs-spacing-inline-start: 10px;
    --com-c-breadcrumbs-spacing-inline-end: 10px;

    --com-c-breadcrumb-divider: '/';
    --com-c-breadcrumb-text-size: 14px;
}

.commerce-breadcrumb .breadcrumb-list li {
    --com-c-breadcrumb-text-color: var(--fvg-accent-blue);
    --com-c-breadcrumb-divider-color: var(--fvg-accent-blue);

    padding-left: var(--com-c-breadcrumbs-spacing-inline-start) !important;
    font-family: var(--main-font);
    font-weight: 500;
}

.commerce-breadcrumb .breadcrumb-list li:first-child {
    padding-left: 0 !important;
}

.commerce-breadcrumb .breadcrumb-list li p {
    float: right;
    margin-left: var(--com-c-breadcrumbs-spacing-inline-end) !important;
}

.commerce-breadcrumb .breadcrumb-list li a {
    --com-c-breadcrumb-link-color: var(--dark-color);

    color: var(--com-c-breadcrumb-link-color) !important;
}

/** forms **/
.cb-form-wrapper {
    display: block;
    margin: 0 0 15px;
}

.cb-form-wrapper label {
    display: block;
    margin: 0 0 5px;
}

.cb-form-field {
    width: 100%;
    padding: var(--input-padding);
    border: var(--input-border);
    border-radius: var(--input-radius);
    transition: border 250ms, box-shadow 250ms;
}

.cb-form-field:focus {
    border: var(--input-focus-border);
    box-shadow: var(--input-focus-shadow);
}

.cb-form-field--error,
.cb-form-field--error:focus {
    border-color: var(--error-color);
}

.cb-form-actions {
    display: flex;
    justify-content: space-between;
    margin: 15px 0 0;
}

.cb-form-subtitle {
    display: block;
    margin: 0 0 15px;
    color: var(--primary-color);
}

@media (min-width: 768px) {

    .cb-form-columns {
        display: flex;
        gap: 20px;
    }

}

/** lightning input override **/
.slds-form-element {
    --dxp-s-form-element-color-border-focus: var(--primary-color);
}

.slds-input, .slds-combobox__input, lightning-combobox::part(input-button) {
    font-family: var(--main-font);
    font-size: 14px;
    font-weight: 400;
}

.slds-form-element__help, .slds-form-element__helper {
    font-family: var(--main-font);
    font-size: 12px;
}

.slds-form-element__label, lightning-combobox::part(label) {
    font-family: var(--main-font);
}

.slds-has-error .slds-form-element__help {
    color: var(--error-color);
}

lightning-input.slds-form-element:not(.slds-has-error), lightning-textarea.slds-form-element:not(.slds-has-error), lightning-combobox.slds-form-element:not(.slds-has-error), lightning-lookup-address.slds-form-element:not(.slds-has-error) {
    padding-bottom: 8px;
}

lightning-input.slds-form-element div[part="input-text"], lightning-lookup-address.slds-form-element div[part="input-text"], lightning-input.slds-form-element::part(input-text) {
    min-height: 39px;
    border: var(--input-border);
    border-radius: var(--input-radius);
}

lightning-input.slds-form-element .slds-input, lightning-lookup-address.slds-form-element .slds-input, lightning-input.slds-form-element::part(input) {
    min-height: 39px;
    padding-top: 0;
}

lightning-input.slds-form-element.slds-has-error div[part="input-text"], lightning-input.slds-form-element[invalid] div[part="input-text"], lightning-lookup-address.slds-form-element.slds-has-error div[part="input-text"], lightning-lookup-address.slds-form-element[invalid] div[part="input-text"], lightning-input.slds-form-element.slds-has-error::part(input-text), lightning-input.slds-form-element[invalid]::part(input-text) {
    border-color: var(--error-color);
}

/** lightning input override (floating label) **/
lightning-input.slds-form-element div[part="input-text"], lightning-lookup-address.slds-form-element div[part="input-text"], lightning-input.slds-form-element::part(input-text) {
    position: relative;
}

lightning-input lightning-datepicker div[part='input-text'] .slds-form-element__label, lightning-input.slds-form-element div[part='input-text'] .slds-form-element__label, lightning-input::part(label), lightning-lookup-address.slds-form-element .slds-form-element__label {
    top: 50%;
    transform: translateY(-50%);
    margin-bottom: 0;
    margin-top: 0;
    padding-left: 4px;
    padding-right: 4px;
    background-color: white;
}

lightning-input lightning-datepicker div[part='input-text'] .slds-form-element__label:has(~ .slds-form-element__control > input:not(:placeholder-shown)), lightning-input.slds-form-element div[part='input-text']:focus-within .slds-form-element__label, lightning-input:focus-within::part(label), lightning-input.slds-form-element div[part='input-text'] .slds-form-element__label:has(~ .slds-form-element__control > input:-webkit-autofill), lightning-input.slds-form-element div[part='input-text'] .slds-form-element__label:has(~ .slds-form-element__control > input:autofill), lightning-input.slds-form-element div[part='input-text'][populated] .slds-form-element__label, lightning-lookup-address.slds-form-element .slds-form-element__label:has(~ .slds-form-element__control input:not(:placeholder-shown)), lightning-lookup-address.slds-form-element:focus-within .slds-form-element__label, lightning-lookup-address.slds-form-element .slds-form-element__label:has(~ .slds-form-element__control input:-webkit-autofill), lightning-lookup-address.slds-form-element .slds-form-element__label:has(~ .slds-form-element__control input:autofill) {
    top: 0;
}

/** lightning combobox override **/
lightning-combobox [part="combobox"] lightning-base-combobox .slds-combobox__form-element, lightning-combobox::part(input-button) {
    border: var(--input-border);
    border-radius: var(--input-radius);
}

lightning-combobox [part="combobox"] lightning-base-combobox [part="input-text"] [part="input-container"] input, lightning-combobox [part="combobox"] lightning-base-combobox button.slds-combobox__input, lightning-combobox::part(input), lightning-combobox::part(input-button) {
    min-height: 39px;
    padding-top: 6px;
}

.slds-listbox_vertical .slds-listbox__option {
    font-family: var(--main-font);
    font-size: 14px;
    font-weight: 400;
}

/** lightning checkbox override  **/
.slds-checkbox abbr.slds-required, lightning-select::part(required), lightning-radio-group::part(required), lightning-combobox::part(required), lightning-input::part(required) {
    display: none;
}

.slds-checkbox .slds-checkbox__label {
    display: flex;
    align-items: center;
}

.slds-checkbox .slds-checkbox__label .slds-form-element__label {
    font-size: 12px;
}

.slds-checkbox .slds-checkbox--faux, .slds-checkbox .slds-checkbox_faux, lightning-input::part(indicator) {
    width: 20px;
    height: 20px;
}

.slds-checkbox__label .slds-form-element__label, lightning-input::part(label) {
    color: var(--text-color);
}

.slds-checkbox [type="checkbox"]:checked + .slds-checkbox--faux, .slds-checkbox [type="checkbox"]:checked + .slds-checkbox_faux, .slds-checkbox [type="checkbox"]:checked ~ .slds-checkbox--faux, .slds-checkbox [type="checkbox"]:checked ~ .slds-checkbox_faux, .slds-checkbox [type="checkbox"]:checked + .slds-checkbox__label .slds-checkbox--faux, .slds-checkbox [type="checkbox"]:checked + .slds-checkbox__label .slds-checkbox_faux {
    border-color: var(--border-color);
}

.slds-checkbox [type=checkbox]:checked + .slds-checkbox--faux::after, .slds-checkbox [type=checkbox]:checked + .slds-checkbox__label .slds-checkbox--faux::after, .slds-checkbox [type=checkbox]:checked + .slds-checkbox__label .slds-checkbox_faux::after, .slds-checkbox [type=checkbox]:checked + .slds-checkbox_faux::after, .slds-checkbox [type=checkbox]:checked ~ .slds-checkbox--faux::after, .slds-checkbox [type=checkbox]:checked ~ .slds-checkbox_faux::after, lightning-input::part(indicator)::after {
    border-color: var(--primary-color);
}

.comm-login-error__text {
    margin: 0 0 16px;
    display: block;
}

/** custom checkbox **/
.cb-form-wrapper .cb-checkbox-container {
    display: flex;
    gap: 10px;
    align-items: center;
    margin: 0;
    cursor: pointer;
}

.cb-checkbox-container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.cb-checkmark {
    position: relative;
    display: block;
    height: 16px;
    width: 16px;
    flex: 0 0 16px;
    background-color: #f7f7f7;
    border: 1px solid #d1d1d1;
    border-radius: 4px;
}

.cb-checkbox-container:hover input ~ .cb-checkmark {
    background-color: #eee;
}

.cb-checkbox-container input:checked ~ .cb-checkmark {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.cb-checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

.cb-checkbox-container input:checked ~ .cb-checkmark:after {
    display: block;
}

.cb-checkbox-container .cb-checkmark:after {
    left: 5px;
    top: 2px;
    width: 4px;
    height: 9px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/** common modal **/
.cb-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 2rem;
    border-bottom: 1px solid var(--border-color);
    flex-shrink: 0;
}

.cb-modal-title {
    margin: 0;
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--dark-color);
}

.cb-modal-content {
    -webkit-overflow-scrolling: touch;
    flex-grow: 1;
    padding: 2rem;
    overflow-y: auto;
}

/** faq **/
.cb-faq {
    margin: 0 0 20px;
    color: var(--fgv-dark-blue);
    background-color: var(--fgv-background-gray);
    border-radius: var(--common-radius);
    overflow: hidden;
}

.cb-faq__title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0;
    padding: 24px;
    font-size: 16px;
    cursor: pointer;
}

.cb-faq__title:hover {
    color: var(--fvg-accent-blue);
}

.cb-faq__title svg {
    display: block;
    transform: rotate(90deg);
    transition: transform 250ms;
}

.cb-faq__description {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out, padding 0.3s ease;
}

.cb-faq__textContent {
    padding: 24px;
    margin: 0;
    line-height: 1.4;
}

.cb-faq.is-active .cb-faq__description {
    max-height: 1000px;
    opacity: 1;
}

.cb-faq.is-active .cb-faq__title {
    border-bottom: 1px solid #D7D9DD;
}

.cb-faq.is-active .cb-faq__title svg {
    transform: rotate(-90deg);
}

/** snippets **/
.cb-block {
    display: block;
    width: 100%;
}

.cb-no-margin {
    margin: 0;
}

.cb-mobile-only {
    display: block;
}

.cb-desktop-only {
    display: none;
}

@media (min-width: 1024px) {

    .cb-mobile-only {
        display: none;
    }

    .cb-desktop-only {
        display: block;
    }

}

/** fix - minicart shows below the custom navigation **/
.cb-header commerce_cart-mini-cart-panel {
    z-index: 2;
}

/** fix - duplicated padding when using a custom container inside a native section **/
.comm-section-container > .cb-container {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

/** fix - login box bottom spacing **/
.cb-login__box .comm-login-form__container {
    min-height: initial !important;
}

/** fix - removing flow runtime padding **/
.flowruntimeBody__lwc {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/** search input colors **/
commerce-search-input {
    --dxp-g-brand: var(--fgv-dark-blue);
    --sds-c-button-brand-color-background: var(--fgv-dark-blue);
    --slds-c-button-brand-color-background: var(--fgv-dark-blue);
    --sds-c-button-brand-color-border: var(--fgv-dark-blue);
    --sds-c-button-brand-color-background-hover: var(--fgv-dark-blue);

    --dxp-g-spacing-xlarge: var(--button-min-height);
}