/* ============================================================================
 * register.redesign.css — Superset tokenizado de membership/register.css
 *
 * Origen: /tools/components/generaltools/projects/membership/assets/css/register.css (78 líneas, 6 vistas).
 *
 * MODO: SUPERSET REEMPLAZO. Copia íntegra + tokenizations en valores existentes.
 * REGLA ESTRICTA: solo cambia valores de propiedades ya declaradas.
 *
 * Tokenizations:
 *   #f9f9f9                  → var(--neutral-100)
 *   #ffffff                  → var(--neutral-white)
 *   border-radius: 10px      → var(--radius-lg) (+2)
 *   border-radius: 100px     → var(--radius-full)
 *   padding: 15px            → var(--space-4) (+1)
 *   font-size: 35px          → var(--font-h2) (+1)
 *   font-size: 25px          → var(--font-h3) (-1)
 *   font-size: 15px          → var(--font-body) (+1)
 *
 * Preservados:
 *   padding: 20px (entre --space-4 y --space-6)
 *   dimensiones específicas (60px, 40px, 25px, height/width)
 * ============================================================================ */

.content-membership-plan-name {
    background-color: var(--neutral-100);
    border-radius: var(--radius-lg);
}

.content-plan-name.selected {
    background-color: var(--neutral-white);
}

.content-plan-name {
    cursor: pointer;
    padding: var(--space-4);
    border-radius: var(--radius-lg);
}

.content-price {
    cursor: pointer;
    background-color: var(--neutral-100);
    padding: 20px;
    border-radius: var(--radius-lg);
}

.content-membership-price-icon {
    border-radius: var(--radius-full);
    height: 60px;
    width: 60px;
    font-size: var(--font-h2);
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

.content-membership-price-icon i {
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

.content-price-selected-icon {
    position: absolute;
    top: -10px;
    right: -10px;
    height: 25px;
    width: 25px;
    border-radius: var(--radius-full);
    display: none;
}

.content-price-selected-icon i {
    font-size: var(--font-body);
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

#mdlSendNewRequestPayment .content-price {
    background-color: var(--neutral-white);
}

@media (max-width: 768px) {
    .content-price h1 {
        font-size: var(--font-h3);
    }

    .content-membership-price-icon {
        height: 40px;
        width: 40px;
        font-size: var(--font-h3);
    }
}