// --- New Style --- //

.fp-light-bg {
    background: $bgLightPurple;
}

// Badge
.fp-head-28 {
    .badge {
        background: $bgLightPurplev2;
        font-weight: $fontMedium;
        font-size: $font14;
        color: $textBlack;
        border: solid 1px $bgLightPink;
        height: 32px;
        min-width: 65px;
        @include fpDflexAlignItemsJustifyContentCenter;
        @media only screen and (min-width: $md_992) {
            height: 37px;
        }
   }
}

.fp-price-plan {
    .fp-price-column {
        background-color: $bgLightPurple;
        border: solid 1px $bgLightPink;
        border-radius: 16px;
        padding: 24px;
        height: 100%;
        .fp-price-head {
            border-bottom: solid $bgLightPink 1px;
            margin-bottom: 20px;
            padding-bottom: 20px;
        }
        .fp-price-content {
            ul {
                list-style: none;
                li {
                    img {
                        height: 16px;
                    }
                    p { 
                        gap: 15px;
                        @include fpDflexAlignItemsCenter;
                    }
                }
            }
        }
        &.fp-dark-bg {
            background-color: $bgBlack;
            border-color: $bgBlack;
            h2 {
                color: $textWhite;
            }
            h3 {
                color: $textPurple;
            }
            p {
                color: $textWhite;
            }
            .fp-cmn-btn {
                &:hover,&:focus {
                   background-color: $bgWhite;
                   border-color: $bgWhite;
                   color: $textBlack;
                }
            }
        }
    }
}

.fp-our-values {
    &.fp-what-verify {
        background: $bgWhite;
        .fp-values-box {
            max-width: 100%;
            .fp-values-des {
                align-items: flex-start;
                .fp-value-content {
                    h3 {
                        font-weight: $fontRegular;
                    }
                    ul {
                        padding-left: 20px;
                        margin: 12px 0 0 0;
                        li {
                            p {
                                margin: 0 0 8px 0;
                            }
                        }
                    }
                }
            }
        }
    }
}

.fp-makes-diff {
    &.fp-how-works {
        background: $bgWhite;
        .fp-head-40 {
            color: $textBlack;
            margin-bottom: 30px;
        }
        .fp-makes-des {
            background: $bgBlack;
            border: solid $bgLightPurplev2 1px;
            padding: 40px;
            height: calc(100% - 30px);
            border-radius: 24px;
            margin: 30px 0 0 0;
            @media only screen and (min-width: $xs_576) {
                margin: 0;
                height: 100%;
            }
            .fp-makes-icon {
                color: $textPurple;
                font-weight: $fontBold;
                font-size: $font24;
            }
            h3 {
                font-weight: $fontRegular;
            }
            p {
                margin: 0;
            }
        }
    }
}
