:root {
    --ff-subscription-radius: 8px;
    --ff-subscription-surface: #f7f7f5;
    --ff-subscription-border: #e8e7e4;
    --ff-subscription-selected-background: #ffffff;
    --ff-subscription-selected-header: #fff7f4;
    --ff-subscription-selected-border: rgba(254, 73, 42, 0.6);
}

.switch-inscription .button-switch-inscription {
    border-radius: var(--ff-subscription-radius);
}

.switch-inscription .button-switch-inscription-title {
    border-radius: var(--ff-subscription-radius) var(--ff-subscription-radius) 0 0;
}

.switch-inscription .button-switch-inscription-content {
    border-radius: 0 0 var(--ff-subscription-radius) var(--ff-subscription-radius);
}

.switch-inscription .button-switch-inscription.active {
    border: 1px solid var(--ff-subscription-selected-border);
    outline: none;
    background: var(--ff-subscription-selected-background);
    box-shadow: 0 7px 18px rgba(20, 20, 20, 0.08);
}

.switch-inscription .button-switch-inscription.active .button-switch-inscription-title {
    background: var(--ff-subscription-selected-header);
}

.card-inscription .card-inscription-1 .card-inscription-1-price {
    border: 1px solid var(--ff-subscription-border);
    border-radius: var(--ff-subscription-radius);
    background: var(--ff-subscription-surface);
}

@supports (corner-shape: squircle) {
    :root {
        --ff-subscription-radius: 10px;
    }

    .switch-inscription .button-switch-inscription,
    .switch-inscription .button-switch-inscription-title,
    .switch-inscription .button-switch-inscription-content,
    .card-inscription .card-inscription-1 .card-inscription-1-price {
        corner-shape: squircle;
    }
}