/* For Newly Diagnosed CSS */

#newly-diagnosed-cll .cmp-text p:not(:last-child), #newly-diagnosed-cll .cmp-text {
    margin-bottom: 0;
}

/*#newly-diagnosed-cll .wrapper {*/
/*    padding: 0 22px 0 26px;*/
/*}*/

#newly-diagnosed-cll sup {
    /*font-size: 70%;*/
    /*top: 2px;*/
}

#newly-diagnosed-cll .footnote sup {
    top: 0px;
}

.font-semi-bold {
    font-weight: 700 !important;
}

.font-redorange {
    color: var(--cll-redorange);
}

.font-common-primary {
    color: var(--common-primary);
}

.font-body-color {
    color: var(--body-color);
}

#newly-diagnosed-cll .mcl-title-sub p {
    font-size: 14px !important;
    line-height: 18px !important;
    width: 99%;
}

/* Infographic CSS - STARTS */

.infographic-content {
    width: 260px;
    height: 264px;
    flex-shrink:0;
}

.infographic-1, .infographic-2, .infographic-3 {
    width: 240px;
    height: 240px;
}

/*.infographic-1 {*/
/*    color: var(--cll-redorange);*/
/*    background-image: url('/content/dam/intelligentcontent/brands/dtc-calquence/us/en/images/cll/newly-diagnosed/info-92.png');*/
/*    background-size: 240px 240px;*/
/*}*/

/*.infographic-2 {*/
/*    color: var(--common-primary);*/
/*    background-image: url('/content/dam/intelligentcontent/brands/dtc-calquence/us/en/images/cll/newly-diagnosed/info-85.png');*/
/*    background-size: 240px 240px;*/
/*}*/

/*.infographic-3 {*/
/*    color: var(--body-color);*/
/*    background-image: url('/content/dam/intelligentcontent/brands/dtc-calquence/us/en/images/cll/newly-diagnosed/info-47.png');*/
/*    background-size: 120px 237px;*/
/*    background-position: left;*/
/*    background-repeat: no-repeat;*/
/*}*/

.graph-subtitle {
    font-size: 17px !important;
    line-height: 18px !important;
    height: 30px;
}

.graph-subtitle.extra-011{
     font-size: 14px !important;
    line-height: 14px !important;
}

.infographic p {
    text-align: center;
}

.infographic-number {
    font-weight: 800 !important;
    font-size: 80px !important;
    line-height: 64px !important;
}

.infographic-percentage {
    font-size: 30px !important;
    line-height: 18px !important;
    vertical-align: super;
    top: -10px !important;
}

.infographic-footnote-inside {
    font-weight: 800 !important;
    font-size: 13px !important;
    line-height: 18px !important;
}

.infographic-footnote-outside {
    font-weight: 800 !important;
    font-size: 15px !important;
    line-height: 18px !important;
}
.progress-ring {
  --size: 218px;
  --thickness: 28px;
  --color: var(--cll-redorange);
  --angle: 0deg;   
   --track: #fff;
  position: relative;
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.infographic-1 {
    --color: var(--cll-redorange);
    color: var(--cll-redorange);
}

.infographic-2 {
    --color: var(--common-primary);
    color: var(--common-primary);
}

.infographic-3 {
    --color: var(--body-color);
    color: var(--body-color);
}

.progress-ring::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: conic-gradient(var(--color) 0 var(--angle), var(--track) var(--angle) 360deg);
  transform: scaleX(-1); 
  transition: background 0.4s linear; 
}

.progress-ring .circle {
  position: relative;
  width: calc(var(--size) - var(--thickness));
  height: calc(var(--size) - var(--thickness));
  background: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.progress-ring .inside { text-align: center; }
/* Infographic CSS - ENDS */

/* Long Term Follow-up - STARTS */

#newly-diagnosed-cll .serious-side-effect h2 {
    height: 23px;
}

#newly-diagnosed-cll .serious-side-effect ul.isi-bullet-list li {
    margin-bottom: 4px !important;
}

#newly-diagnosed-cll .serious-side-effect ul.isi-bullet-list li:last-child:before {
    color: var(--body-color);
}

#newly-diagnosed-cll .serious-side-effect ul.isi-bullet-list li:nth-child(2):before {
    color: var(--cll-redorange);
}

.serious-side-effect .footnote {
    font-size: 12px !important;
    line-height: 12px !important;
}

#newly-diagnosed-cll .serious-side-effect .footnote {
    font-size: 12px !important;
    line-height: 14px !important;
}

.callout {
    background-color: var(--cll-redorange);
    height: 78px;
    margin-bottom: 15px;
}

.callout p {
    font-weight: 900 !important;
    font-size: 14px !important;
    line-height: 16px !important;
    color: #FFFFFF;
}

/* Long Term Follow-up - ENDS */


/* Desktop CSS - STARTS */

@media screen and (min-width: 992px) {
    .infographic-container {
        padding: 0px 38px 35px 66px;
    }

    .callout {
        height: 62px;
        margin-bottom: 00px;
    }
    
    #newly-diagnosed-cll .serious-side-effect ul.isi-bullet-list li {
        margin-left: 14px;
    }
    
    #newly-diagnosed-cll .wrapper.infographic {
        padding-top: 0;
        margin-top: -15px;
    }
    
    #newly-diagnosed-cll .wrapper.infographic > p {
        min-width: 960px;
    }
    
    .infographic-container {
        padding: 0px 38px 0px 66px;
    }
}

/* Desktop CSS - ENDS */

/* Compatibility - 26/09/25 */

#newly-diagnosed-cll .new-banner--footnote {
    padding-left: 0;
    padding-right: 278px;
}


#newly-diagnosed-cll .new-banner--footnote p:first-child {
    /*padding-right: 16px;*/
    padding-right: 0px;
    position: relative;
    left: 16px;
}


@media (max-width: 991px) {
    #start-strong-text {
        margin-top: -10px;
    }
    
    #newly-diagnosed-cll .wrapper.infographic {
        padding-top: 0;
    }
    
    #newly-diagnosed-cll .new-banner--footnote {
        padding-right: 72px;
        top: -6px;
    }
    
    #newly-diagnosed-cll .new-banner--footnote p {
        font-size: 10px;
        line-height: 7px;
    }
    
    #newly-diagnosed-cll .new-banner--footnote p:first-child {
        padding-right: 6px;
    }
    
}


@media (max-width: 389px) {
    #newly-diagnosed-cll .callout p {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
    
    #newly-diagnosed-cll .infographic-container > div:first-child {
        margin-top: 16px !important;
    }
}

/*newly css*/
#newly-diagnosed-cll #newly-diagnosed-cll-amplify .cmp-text p:not(:last-child) {
    margin-bottom: 10px;
    width: 100%;
}

#newly-diagnosed-cll-amplify .unique-font{
        font-weight: 700;
    font-size: 16px !important;
    text-transform: uppercase;
}

#newly-diagnosed-cll-amplify .font-semi-bold-900{
    font-weight: 900;
}

#newly-diagnosed-cll-amplify .amplify-top-padding{
    margin-top: 24px;
    font-weight: 900;
    font-size: 29px;
    line-height: 33px;
    color: var(--common-primary);
    margin-bottom: 9px;
    text-transform: capitalize;
}
#newly-diagnosed-cll #newly-diagnosed-cll-amplify .mcl-title-sub .unique-font,
#newly-diagnosed-cll .extra-font-001{
    font-size: 16px !important;
}

#newly-diagnosed-cll #cll-amplify-follow-up  .serious-side-effect ul.isi-bullet-list li:nth-child(2):before {
        color: var(--body-color);
}
#cll-amplify-follow-up .callout p{
    width: 696px;
}

@media (max-width: 768px) {
    #newly-diagnosed-cll #newly-diagnosed-cll-amplify .cmp-text .footnotes {
    text-indent: -6px;
    padding-left: 6px;
}
}
