﻿:root {
    --pp-primary: #0C2C65;
}
.p-priceplan {
    font-size: 1rem;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    overflow: hidden;
    position: relative;
    /*    &:hover {
        border: 1px solid var(--rz-primary);
    }*/
}

.p-priceplan-price {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 2rem;
    margin-top: 1.25rem;
}

    .p-priceplan-price > div {
        display: flex;
    }

        .p-priceplan-price > div > * {
            font-size: 2rem;
            line-height: 2rem;
        }

        .p-priceplan-price > div span {
            font-size: 0.75rem;
            line-height: 1.25rem;
        }

.p-priceplan-base {
    cursor: pointer;
}

    .p-priceplan-base:hover {
        border: 1px solid var(--rz-primary);
    }

.p-priceplan-current:hover {
    border: 1px solid var(--rz-primary);
}

.p-priceplan-active {
    border: 2px solid var(--rz-primary);
}

.p-priceplan header {
    padding: 0.5rem;
    background-color: var(--rz-primary);
    display: flex;
    justify-content: center;
}

    .p-priceplan header * {
        color: #EDEDED;
        font-weight: 500;
        margin: 0;
    }

.p-priceplan main {
    color: var(--rz-panel-menu-item-hover-color);
}

    .p-priceplan main ul li {
        margin-left: calc((100% - 80%)/2);
        margin-right: calc((100% - 80%)/2);
        display: flex;
        align-items: center;
        gap: 0.25rem;
    }

        .p-priceplan main ul li span {
            border-bottom: 2px solid var(--rz-primary);
            padding-bottom: 0.75rem;
            margin-bottom: 1rem;
            display: block;
            font-size: 0.85rem;
            width: 100%;
        }

        .p-priceplan main ul li:before {
            font-family: 'Material Icons';
            content: 'check_circle';
            font-size: 1rem;
            padding-bottom: 0.75rem;
            margin-bottom: 1rem;
            vertical-align: middle;
        }

.p-priceplan footer {
    padding: 1rem;
    box-sizing: border-box;
}

.p-priceplan-disabled * {
    opacity: 0.6;
    cursor: default;
}

.p-priceplan-popular {
    height: 150px;
    inset-block-start: 0;
    inset-inline: auto 0;
    overflow: hidden;
    position: absolute;
    transform: rotate(90deg);
    width: 150px;
    z-index: 1;
}

    .p-priceplan-popular > * {
        background: #61CE70;
        color: var(--rz-panel-menu-item-hover-background-color);
        font-size: 13px;
        font-weight: 800;
        left: 0;
        line-height: 2;
        margin-block-start: 35px;
        text-align: center;
        text-transform: uppercase;
        transform: translateY(-50%) translateX(-50%) translateX(35px) rotate(-45deg);
        width: 200%;
    }
