/************ self-serve CSS **********/

body.ip3-edit .component-wrapper .component-content .multiple-icon-signpost__two-item .component-wrapper.Item-MultipleTextIconSignpost {
    -ms-flex-preferred-size: calc(50% - var(--sm-1) + var(--sm-4));
    flex-basis: calc(50% - var(--sm-1) + var(--sm-4))
  }
body.ip3-edit .component-wrapper .component-content .multiple-icon-signpost__three-item .component-wrapper.Item-MultipleTextIconSignpost  {
    -ms-flex-preferred-size: calc(33.33% - var(--sm-1) + var(--xs-1));
    flex-basis: calc(33.33% - var(--sm-1) + var(--xs-1))
  }
  
body.ip3-edit .multiple-icon-signpost .cta--overlay-card::before {content:none;}
body.ip3-edit .config-text, body.ip3-edit .carousel-banner__content {position: relative; z-index: 5;}

/************ nojs CSS **********/
.nojs .accordion__content:not(.show){overflow: visible;  height: auto;}
.nojs .accordion-content .collapse:not(.show) {display: block;}
.nojs .accordion-content .action-button--solid{display:none;}
.nojs picture>img{display:none;}

.video--background .video-js .vjs-control-bar{display:none !important;}

/* Remove after changes moved in storybook and updated global css - Astha*/
.accordion__item {
    margin-bottom: 0;
}
.accordion__wrapper .accordion:last-of-type {
    margin-bottom:0 !important;
}

.ip3-edit .header, .ip3-edit .header.header--scroll-up{
position:relative !important;
transform: translateY(0px) !important;
z-index:9 !important;
}



.rad-link a, a>span.rad-link{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: calc(var(--sm-4) - .05rem) calc(var(--sm-4) + .8rem) calc(var(--sm-4) - .4rem) calc(var(--sm-4) + .8rem);
    outline: 0;
    box-shadow: 0 0 0 .25rem inset var(--primary-6);
    color: var(--primary-6);
    transition: all .3s 
ease-out;
    text-align: center;
    text-decoration: none;
    clip-path: inset(-.1rem round .9rem);
    background: 0 0;
    gap: var(--sm-4);
    width: -moz-fit-content;
    width: fit-content;
    min-height: 4.4rem;
    color: var(--primary-6);
    box-shadow: 0 0 0 .25rem inset var(--primary-6);
    text-decoration:none;
}
.rad-link:hover a, a:hover>span.rad-link{
background-color: var(--primary-6);
    color: var(--base-4);
    
}

.rad-link a:hover{text-decoration:none;}
span.cta__label>a:hover{text-decoration:none;}

.rad-left {
    width: 100%;
    display: inline-block;
    box-sizing: border-box;

}
.rad-right {
    width: 50%;
    display: inline-block;
    float:right;
    box-sizing: border-box;
    position:absolute;
    top:0;
}
.rad-right img{margin-top:0 !important; padding-left:var(--sm-1);}
p:has(>span.rad-left), h2:has(>span.rad-left){width:50%;}
p:has(>span.rad-right){width:50%; float:right;}

@media only screen and (max-width:767px){
.rad-right {
    width: 100%;
    display: block;
    float:none;
    position:relative;
}
.rad-left {
    display: block;
}
.rad-right img{margin-top:var(--sm-2); margin-left:0;}
p:has(>span.rad-left), h2:has(>span.rad-left){width:100%;}
p:has(>span.rad-right){width:100%; float:none;}
}
.contact-us__form .dropdown{max-width:100%;}

.consent-text p{margin-bottom:0;}
/*remove after pr merged and global updated*/
.dropdown--multi-select .dropdown__item {
  position: relative
}

.dropdown--multi-select .dropdown__item label {
  position: absolute;
  top: 0;
  width: auto
}

.dropdown--multi-select .dropdown__item label span {
  display: none
}

.dropdown--multi-select .dropdown__link {
  padding-left: calc(var(--sm-1) + var(--sm-3))
}

.dropdown--multi-select .dropdown__ul li a {
  padding-left: calc(3.2rem + var(--sm-3))
}

.dropdown--multi-select .dropdown__ul ul li a {
  padding-left: calc(1.6rem + var(--sm-1))
}

.form-field--checkbox .form-field__label::before {
  background: var(--base-3);
  border: solid 2px var(--primary-6);
}

.form-field--checkbox .form-field__label:hover::before {
  background-color: var(--primary-5)
}

.form-field--checkbox .form-field__label:focus-visible {
  outline: 2px solid var(--primary-5)
}



.form-field--checkbox .form-field__checkbox:checked + .form-field__label::before {
  content: "";
  background: var(--base-4);
  border: solid 5px var(--primary-2)

}

.rad-header{
 font-family: var(--headline-m-font-family);
  font-size: var(--headline-m-font-size);
  line-height: var(--headline-m-line-height);
  letter-spacing: var(--headline-m-letter-spacing);
  font-weight: var(--headline-m-weight);
  margin-bottom: var(--sm-3)
}

.dropdown--multi-level .dropdown__ul.open{
max-height:100% !important;
}