/* custom font */
 
@font-face {
   font-family: Frutiger;
   src: url('{ basePath }/sfsites/c/resource/Frutiger/Frutiger/FrutigerLTW05-55Roman.eot')format('eot');
   src: url('{ basePath }/sfsites/c/resource/Frutiger/Frutiger/FrutigerLTW05-55Roman.ttf')format('ttf');
   src: url('{ basePath }/sfsites/c/resource/Frutiger/Frutiger/FrutigerLTW05-55Roman.woff')format('woff');
   src: url('{ basePath }/sfsites/c/resource/Frutiger/Frutiger/FrutigerLTW05-55Roman.woff2')format('woff2');
}

@font-face {
   font-family: FrutigerLight;
  src: url('{ basePath }/sfsites/c/resource/Frutiger/Frutiger/FrutigerLTW05-45Light.eot')format('eot');
   src: url('{ basePath }/sfsites/c/resource//Frutiger/Frutiger/FrutigerLTW05-45Light.ttf')format('ttf');
   src: url('{ basePath }/sfsites/c/resource/Frutiger/Frutiger/FrutigerLTW05-45Light.woff')format('woff');
   src: url('{ basePath }/sfsites/c/resource/Frutiger/Frutiger/FrutigerLTW05-45Light.woff2')format('woff2');
}
@font-face {
   font-family: FrutigerBold;
  src: url('{ basePath }/sfsites/c/resource/Frutiger/Frutiger/FrutigerLTW05-65Bold.eot')format('eot');
   src: url('{ basePath }/sfsites/c/resource/Frutiger/Frutiger/FrutigerLTW05-65Bold.ttf')format('ttf');
   src: url('{ basePath }/sfsites/c/resource//Frutiger/Frutiger/FrutigerLTW05-65Bold.woff')format('woff');
   src: url('{ basePath }/sfsites/c/resource/Frutiger/Frutiger/FrutigerLTW05-65Bold.woff2')format('woff2');
}


/* Color adjustments */


:root, :host {
--c-brand-color-h: 211;
--c-brand-color-s:100%;
--c-brand-root:hsla(var(--c-brand-color-h), 0%, 100%, 1); 
--c-brand-root-contrast:hsla(var(--c-brand-color-h), 0%, 20%, 1); 
--c-brand-color-primary:hsla(var(--c-brand-color-h), var(--c-brand-color-s), 31%, 1);
--c-brand-color-primary-contrast:hsla(var(--c-brand-color-h), var(--c-brand-color-s), 100%, 1);
--c-brand-color-secondary:hsla(198, 100%, 46%, 1);
--c-brand-color-secondary-contrast:hsla(var(--c-brand-color-h), var(--c-brand-color-s), 100%, 1);
--c-brand-color-neutral-s: 0%;
--c-brand-color-neutral-light:hsla(var(--c-brand-color-h), var(--c-brand-color-neutral-s), 96%, 1);
--c-brand-color-neutral-light-contrast: var(--c-brand-root-contrast);
--c-brand-color-neutral-lighter:hsla(var(--c-brand-color-h), var(--c-brand-color-neutral-s), 93%, 1);
--c-brand-color-neutral-lighter-contrast:var(--c-brand-root-contrast);
--c-brand-color-neutral-medium:hsla(var(--c-brand-color-h), 5%, 76%, 1);
--c-brand-color-neutral-medium-contrast:var(--c-brand-root-contrast);
--c-brand-color-neutral-darker:hsla(var(--c-brand-color-h), 7%, 53%, 1);
--c-brand-color-neutral-darker-contrast: var(--c-brand-root);
--c-brand-color-neutral-dark:hsla(var(--c-brand-color-h), var(--c-brand-color-neutral-s), 32%, 1);
--c-brand-color-neutral-dark-contrast:var(--c-brand-root);
--c-brand-color-green:hsla(82, 73%, 41%, 1);
--c-brand-color-green-contrast:var(--c-brand-root);
--c-brand-color-orange:hsla(39, 100%, 48%, 1);
--c-brand-color-orange-contrast:var(--c-brand-root);
--c-brand-color-red:hsla(327, 100%, 36%, 1);
--c-brand-color-red-contrast:var(--c-brand-root);

--dxp-g-brand:var(--c-brand-color-primary);
--dxp-g-brand-contrast:var(--c-brand-color-primary-contrast);
--dxp-g-root: var(--c-brand-root);
--dxp-g-root-contrast: var(--c-brand-root-contrast);
--dxp-g-root-1:var(--c-brand-color-neutral-light);
--dxp-g-root-contrast-1: var(--c-brand-color-neutral-light-contrast);
--dxp-g-root-2: var(--c-brand-color-neutral-darker);
--dxp-g-root-3: var(--c-brand-color-neutral-dark);
--dxp-g-root-contrast-2: var(--c-brand-color-neutral-darker-contrast);
--dxp-g-root-contrast-3: var(--c-brand-color-neutral-dark-contrast);
--dxp-s-button-color: var(--c-brand-color-secondary);
--dxp-s-button-color-1: var(--c-brand-color-primary);
--dxp-s-button-color-hover: var(--c-brand-color-neutral-darker);
--dxp-s-button-color-hover-contrast:var(--c-brand-color-secondary-contrast);
--dxp-s-button-color-focus-contrast: var(--c-brand-color-secondary-contrast);
--dxp-s-button-color-active-contrast: var(--c-brand-color-secondary-contrast);
--sds-c-button-brand-text-color: var(--c-brand-color-secondary-contrast);
--slds-c-button-brand-text-color-hover: var(--c-brand-color-secondary-contrast);
--dxp-g-success: var(--c-brand-color-green);
--dxp-g-success-contrast: var(--c-brand-color-green-contrast);
--sds-c-button-success-color-background: var(--c-brand-color-green);
--sds-c-button-success-text-color:  var(--c-brand-color-green-contrast);
--dxp-g-brand-1: var(--c-brand-color-secondary);
--dxp-g-brand-contrast-1: var(--c-brand-color-secondary-contrast);
--slds-g-color-border-brand-1: var(--c-brand-color-secondary);
--dxp-g-neutral: var(--c-brand-color-neutral-light);
--dxp-g-neutral-contrast: var(--c-brand-color-neutral-light-contrast);
--dxp-g-neutral-1: var(--c-brand-color-neutral-lighter);
--dxp-g-neutral-contrast-1:var(--c-brand-color-neutral-lighter-contrast);
--dxp-g-neutral-2: var(--c-brand-color-neutral-darker);
--dxp-g-neutral-contrast-2: var(--c-brand-color-neutral-darker-contrast);
--dxp-g-neutral-3: var(--c-brand-color-neutral-dark);
--dxp-g-neutral-contrast-3:  var(--c-brand-color-neutral-dark-contrast);

--dxp-g-warning: #F49D00;

/*Button Brand - new*/
--slds-c-button-brand-color-background:var(--c-brand-color-secondary);
--slds-c-button-brand-color-border:var(--c-brand-color-secondary);
--slds-c-button-brand-color-background-active:var(--c-brand-color-neutral-darker);
--slds-c-button-brand-color-background-hover:var(--c-brand-color-neutral-darker);
--slds-c-button-brand-color-border-hover:var(--c-brand-color-neutral-darker);
--slds-c-button-brand-text-color:var(--c-brand-color-secondary-contrast);
--slds-c-button-brand-text-color-active:var(--c-brand-color-neutral-darker-contrast);
--slds-c-button-brand-text-color-hover:var(--c-brand-color-neutral-darker-contrast);



/*Button Neutral - new*/
--slds-c-button-neutral-color-border:var(--c-brand-color-neutral-darker);
--slds-c-button-neutral-color-border-active:var(--c-brand-color-neutral-dark);
--slds-c-button-neutral-color-border-hover:var(--c-brand-color-neutral-dark);
--slds-c-button-neutral-color-text:var(--c-brand-color-neutral-darker);
--slds-c-button-neutral-color-text-hover:var(--c-brand-color-neutral-dark);

/*Button Outline - Color Secondary  - new*/
--slds-c-button-outline-brand-color-border:var(--c-brand-color-secondary);
--slds-c-button-outline-brand-color-border-hover:var(--c-brand-color-neutral-dark);
--slds-c-button-outline-brand-color-text: var(--c-brand-color-secondary);
--slds-c-button-outline-brand-color-text-hover: var(--c-brand-color-neutral-dark);

/*Button Stateful - aka Dropdown  - new*/
--slds-c-button-stateful-color-background-selected:transparent;
--slds-c-button-stateful-color-background-selected-active:95, var(--c-brand-color-neutral-light);
--slds-c-button-stateful-color-background-selected-hover:95, var(--c-brand-color-neutral-light);
--slds-c-button-stateful-color-border-selected:transparent;
--slds-c-button-stateful-color-border-selected-hover:1, var(--c-brand-color-neutral-medium);

/*Button Outline - Color Success  - new*/
--slds-c-button-success-color-background:var(--c-brand-color-green);
--slds-c-button-success-color-border:var(--c-brand-color-green);
--slds-c-button-success-text-color:var(--c-brand-color-green-contrast);
--slds-c-button-success-text-color-active:var(--c-brand-color-green-contrast);
--slds-c-button-success-text-color-hover:var(--c-brand-color-green-contrast);


/*Button Brand - old*/
--sds-c-button-brand-color-background:var(--c-brand-color-secondary);
--sds-c-button-brand-color-border:var(--c-brand-color-secondary);
--sds-c-button-brand-color-background-active:var(--c-brand-color-neutral-darker);
--sds-c-button-brand-color-background-hover:var(--c-brand-color-neutral-darker);
--sds-c-button-brand-color-border-hover:var(--c-brand-color-neutral-darker);
--sds-c-button-brand-text-color:var(--c-brand-color-secondary-contrast);
--sds-c-button-brand-text-color-active:var(--c-brand-color-neutral-darker-contrast);
--sds-c-button-brand-text-color-hover:var(--c-brand-color-neutral-darker-contrast);



/*Button Neutral - old*/
--sds-c-button-neutral-color-border:var(--c-brand-color-neutral-darker);
--sds-c-button-neutral-color-border-active:var(--c-brand-color-neutral-dark);
--sds-c-button-neutral-color-border-hover:var(--c-brand-color-neutral-dark);
--sds-c-button-neutral-color-text:var(--c-brand-color-neutral-darker);
--sds-c-button-neutral-color-text-hover:var(--c-brand-color-neutral-dark);

/*Button Outline - Color Secondary  - old*/
--sds-c-button-outline-brand-color-border:var(--dxp-s-button-color);
--sds-c-button-outline-brand-color-border-hover:var(--c-brand-color-neutral-dark);
--sds-c-button-outline-brand-color-text: var(--c-brand-color-secondary);
--sds-c-button-outline-brand-color-text-hover: var(--c-brand-color-neutral-dark);

/*Button Stateful - aka Dropdown  - old*/
--sds-c-button-stateful-color-background-selected:transparent;
--sds-c-button-stateful-color-background-selected-active:95, var(--c-brand-color-neutral-light);
--sds-c-button-stateful-color-background-selected-hover:95, var(--c-brand-color-neutral-light);
--sds-c-button-stateful-color-border-selected:transparent;
--sds-c-button-stateful-color-border-selected-hover:1, var(--c-brand-color-neutral-medium);

/*Button Outline - Color Success  - old*/
--sds-c-button-success-color-background:var(--c-brand-color-green);
--sds-c-button-success-color-border:var(--c-brand-color-green);
--sds-c-button-success-text-color:var(--c-brand-color-green-contrast);
--sds-c-button-success-text-color-active:var(--c-brand-color-green-contrast);
--sds-c-button-success-text-color-hover:var(--c-brand-color-green-contrast);


/*Styles for cards - new */
--slds-c-card-color-background:var(--c-brand-root);
--slds-c-card-color-border:var(--c-brand-color-neutral-medium);
--slds-g-color-border-base-1: var(--c-brand-color-neutral-medium);

/*Styles for cards - old */
--sds-c-card-color-background:var(--c-brand-root);
--sds-c-card-color-border:var(--c-brand-color-neutral-medium);
--sds-g-color-border-base-1: var(--c-brand-color-neutral-medium);

--dxp-c-link-text-color:var(--c-brand-color-primary);

/*borders*/
--sds-c-input-color-border:var(--c-brand-color-neutral-medium);
--slds-g-color-border-base-1: var(--c-brand-color-neutral-medium);
--sds-c-input-radius-border:0.25rem;


/* forms, fields */
--sds-c-input-text-color:hsla(var(--c-brand-color-h), 0%, 20%, 1); 


/*accordion*/
--slds-c-accordion-heading-text-color:var(--c-brand-color-root-contrast);
--sds-c-accordion-heading-text-color:var(--c-brand-color-root-contrast);
--slds-c-accordion-heading-font-size:
--sds-c-accordion-heading-font-size:
--slds-c-accordion-heading-text-color-hover:
--sds-c-accordion-heading-text-color-hover

}


}
/* backgrounds */

.bg-white{
background-color:#fff;
color: var(--c-brand-color-root-contrast);
}
.bg-white *:not(button, button *){
color: var(--c-brand-color-root-contrast);
}


.bg-primary{
background-color: var(--c-brand-color-primary);
color: var(--dxp-g-brand-contrast);
}
.bg-primary *:not(button, button *){
color: var(--c-brand-color-primary-contrast)!important;
}
.bg-secondary{
background-color: var(--c-brand-color-secondary);
color: var(--c-brand-color-secondary-contrast);
}
.bg-secondary *:not(button, button *){
color: var(--c-brand-color-secondary-contrast)!important;
}
.bg-light{
background-color:var(--c-brand-color-neutral-light);
color: var(--c-brand-color-neutral-light-contrast);
}
.bg-light *:not(button, button *){
color: var(--c-brand-color-neutral-light-contrast);
}
.bg-dark{
background-color: var(--c-brand-color-neutral-dark);
color: var(--c-brand-color-neutral-dark-contrast);
}
.bg-dark *:not(button, button *){
color: var(--c-brand-color-neutral-dark-contrast)!important;
}


/* font-styles */
.text-primary{
 color: var(--c-brand-color-primary);
}
.text-secondary{
 color: var(--c-brand-color-secondary);
}
.text-gray, .slds-text-color_weak{
 color: var(--c-brand-color-neutral-darker);
}
.text-white{
#fff;
}


/*text styles*/

:root {
--dxp-g-root-font-family: Frutiger, Arial, sans-serif;
--dxp-g-heading-font-family: FrutigerLight, Arial, serif;
--dxp-s-body-text-color: var(--c-brand-root-contrast);
} 
 
h1, h2, h3, h4 {
   font-family: var(--dxp-g-heading-font-family);
}
h1 {
 font-size:var(--dxp-g-font-size-10);
}
h2 {
 font-size:var(--dxp-g-font-size-7);
 margin-bottom: var(--dxp-g-spacing-xsmall);
}
h3 {
 font-size:var(--dxp-g-font-size-6);
}
b, strong {
font-family:FrutigerBold, Arial, sans-serif;
}

p{
  font-family: var(--dxp-s-body-font-family);
  font-size: var(--dxp-s-body-font-size);
}
a {
  color: var(--c-brand-color-primary);
}
a:hover, a:active, a:visited, a:focus {
  var(--c-brand-color-neutral-darker);
}  
/* text color styles */ 
  
/**navigation alignment **/    
  .navigation-menu{
      background-color: var(--c-brand-color-neutral-light);
  }

.disable-checkbox {
     pointer-events: none;
     opacity: 0.6; /* You can adjust the opacity to give a visual indication of the disabled state */
 }

/** stacked accordion **/  


 .form-container {
      max-width: 600px; /* Adjust max-width as needed */
      margin: 0 auto; /* Center the container horizontally */
      border: 1px solid #d8dde6; /* Add border around the form */
      border-radius: 5px; /* Add border-radius for rounded corners */
      padding: 20px; /* Add padding to the container */
  }
  .form-headline {
      text-align: center; /* Center the headline horizontally */
      margin-bottom: 20px; /* Add spacing between headline and form */
      font-size: 20px; /* Set font size to 20px */
      font-weight: bold; /* Make the headline bold */
  }
 lightning-accordion.accordion-parent:nth-child(n) > div > slot > lightning-accordion-section > div > section > div.slds-accordion__summary {
  background-color: var(--c-brand-color-neutral-light);
  margin-bottom: var(--dxp-g-spacing-xxsmall);
}

/**buttons**/
[kx-scope=button-brand]:hover:before {
 background: var(--slds-c-button-brand-color-background-hover);
}

[kx-scope=button-neutral]:hover:before {
 background: none!important;
}


.slds-button--brand, .slds-button.slds-button_icon.slds-button_icon-brand, .slds-button_brand, lightning-button[variant=brand]::part(button) {
  background-color: var(--slds-c-button-brand-color-background, var(--dxp-s-button-color, var(--dxp-g-brand, #0176d3)));
  border-color: var(--slds-c-button-brand-color-border, var(--dxp-s-button-color, var(--dxp-g-brand, #0176d3)));
  color: var(--slds-c-button-brand-text-color, var(--dxp-s-button-color-contrast, var(--dxp-g-brand-contrast, #fff)));
}
.slds-button--brand:focus, .slds-button--brand:hover, .slds-button.slds-button_icon.slds-button_icon-brand:focus, .slds-button.slds-button_icon.slds-button_icon-brand:hover, .slds-button_brand:focus, .slds-button_brand:hover, lightning-button[variant=brand]::part(button):focus, lightning-button[variant=brand]::part(button):hover,  .slds-button--brand:active, .slds-button.slds-button_icon.slds-button_icon-brand:active, .slds-button_brand:active, lightning-button[variant=brand]::part(button):active {
  background-color: var(--slds-c-button-brand-color-background-hover, var(--dxp-s-button-color-hover, var(--dxp-g-brand-1, #014486)));
  border-color: var(--slds-c-button-brand-color-border-hover, var(--dxp-s-button-color-hover, var(--dxp-g-brand-1, #014486)));
  color: var(--slds-c-button-brand-text-color-hover, var(--dxp-s-button-color-hover-contrast, var(--dxp-g-brand-contrast-1, #fff)));
}


.slds-button--neutral, .slds-button_neutral, lightning-button[variant=neutral]::part(button) {

  background: none !important;
  border-color: var(--sds-c-button-neutral-color-border);
  transition: var(--dxp-c-button-neutral-transition);
  color: var(--slds-c-button-neutral-color-text);
}


.slds-button--neutral:focus,.slds-button--neutral:hover,.slds-button_neutral:focus,.slds-button_neutral:hover,lightning-button[variant=neutral]::part(button):focus,lightning-button[variant=neutral]::part(button):hover, .slds-button--neutral:active,.slds-button_neutral:active,lightning-button[variant=neutral]::part(button):active {
  background: none!important;
  border-color: var(--slds-c-button-neutral-color-border-active);
 color: var(--slds-c-button-neutral-color-text-hover);
}


.slds-button_outline-brand, lightning-button[variant=brand-outline]::part(button) {
 background: none!important;
 border-color: var(--slds-c-button-outline-brand-color-border);
 color: var(--slds-c-button-outline-brand-color-text);
}

.slds-button_outline-brand:focus, .slds-button_outline-brand:hover, lightning-button[variant=brand-outline]::part(button):active, lightning-button[variant=brand-outline]::part(button):focus {
background: none!important;
border-color: var(--slds-c-button-outline-brand-color-border-hover);
color: var(--slds-c-button-outline-brand-color-text-hover);	
}


/*progress-bar*/
.slds-path__nav .slds-is-complete {
  background: var(--c-brand-color-green)!important;
}
.slds-path__nav .slds-is-complete:hover {
  background: var(--c-brand-color-green)!important;
}
.slds-path__nav .slds-is-complete:after, .slds-path__nav .slds-is-complete:before {
  background: var(--c-brand-color-green)!important;
}

.slds-path__nav .slds-is-complete.slds-is-active:first-child {
  background: var(--c-brand-color-green);
}
.slds-path__nav .slds-is-complete .slds-is-active:hover:after, .slds-path__nav .slds-is-active:hover:before {
  background: var(--c-brand-color-green)!important;
}
.slds-path__nav .slds-is-complete:hover:after, .slds-path__nav .slds-is-complete:hover:before {
  background: var(--c-brand-color-green) !important;
}

header {
  --dxp-c-section-content-spacing-block-start: 0;
   --dxp-c-section-content-spacing-inline-end: 0;
  --dxp-c-section-content-spacing-block-end: 0;
  --dxp-c-section-content-spacing-inline-start: 0;
  --dxp-c-section-columns-max-width: none;
  }

footer *:not(strong) {
  font-family: var(--dxp-g-heading-font-family);
 font-size: 0.8rem; 
}
footer {
--dxp-c-section-content-spacing-block-start: 0;
--dxp-c-section-content-spacing-inline-end: 0;
--dxp-c-section-content-spacing-block-end: 0;
--dxp-c-section-content-spacing-inline-start: 0;
--dxp-c-section-columns-max-width: none;
}