/* =========================================================================
   PMPRO — Alta de socio, cuenta, recibos…
   Adapta el marcado de Paid Memberships Pro 3.x a nuestro sistema de diseño
   (tokens de style.css). Clases reales del plugin: .pmpro_card,
   .pmpro_form_field, .pmpro_form_input, .pmpro_btn, .pmpro_message…
   ========================================================================= */

/* --- Tokens de PMPro -> tokens nuestros --------------------------------
   PMPro 3.x tiene su propio sistema de variables (base.css). Redefinirlas
   aquí es la vía limpia de personalizarlo: así heredan nuestro rojo, radio
   y bordes TODAS sus pantallas (alta, acceso, cuenta, recibos), incluidas
   las reglas internas con selectores de ID (#loginform) contra las que no
   se puede competir por especificidad sin recurrir a !important. */
html:root {
    --pmpro--color--accent: var(--prlb-acento);
    --pmpro--color--contrast: var(--prlb-texto);
    --pmpro--color--border: var(--prlb-borde);
    --pmpro--base--border-radius: var(--prlb-radius);
    --pmpro--box-shadow: var(--prlb-shadow);
}

.prlb-pmpro {
    width: min(860px, 100% - 2.5rem);
    margin-inline: auto;
    padding-block: clamp(2.5rem, 6vw, 4rem);
}
/* La cuenta y los recibos necesitan más aire horizontal */
body.pmpro-account .prlb-pmpro,
body.pmpro-invoice .prlb-pmpro { width: min(1080px, 100% - 2.5rem); }

/* --- Tarjetas de sección ------------------------------------------------ */
.pmpro_card {
    background-color: var(--prlb-fondo);
    border: 1px solid var(--prlb-borde);
    border-radius: var(--prlb-radius-lg);
    box-shadow: var(--prlb-shadow);
    padding: clamp(1.25rem, 3vw, 1.9rem);
    margin-bottom: var(--prlb-space-3);
    overflow: hidden;
}
.pmpro_card_title,
.pmpro_form_legend {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin: 0 0 var(--prlb-space-3);
    font-size: var(--prlb-fs-h3);
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--prlb-texto);
}
/* Franja de acento a la izquierda del título de cada tarjeta */
.pmpro_card_title::before {
    content: "";
    flex: none;
    width: 4px;
    height: 1.1em;
    border-radius: 2px;
    background: var(--prlb-acento);
}
.pmpro_card_content > *:last-child { margin-bottom: 0; }

/* --- Campos ------------------------------------------------------------- */
.pmpro_form_fieldset { border: 0; padding: 0; margin: 0 0 var(--prlb-space-3); }
.pmpro_form_fieldset:last-child { margin-bottom: 0; }
.pmpro_form_field { margin-bottom: var(--prlb-space-3); }
.pmpro_form_field:last-child { margin-bottom: 0; }

.pmpro_form_label {
    display: block;
    margin-bottom: 0.45rem;
    font-size: var(--prlb-fs-pequeno);
    font-weight: 600;
    color: var(--prlb-texto);
}
.pmpro_asterisk { color: var(--prlb-acento); }
.pmpro_asterisk abbr { text-decoration: none; border: 0; }

.prlb-pmpro .pmpro_form_input {
    width: 100%;
    padding: 0.8rem 1rem;
    font: inherit;
    color: var(--prlb-texto);
    background: var(--prlb-fondo);
    border: 1px solid var(--prlb-borde);
    border-radius: var(--prlb-radius);
    box-shadow: none;
    transition: border-color var(--prlb-transition), box-shadow var(--prlb-transition);
}
.prlb-pmpro .pmpro_form_input:focus {
    outline: none;
    border-color: var(--prlb-acento);
    box-shadow: 0 0 0 3px rgba(224, 0, 16, 0.14);
}
.prlb-pmpro .pmpro_form_input-textarea { min-height: 110px; resize: vertical; }

/* Select con flecha propia, igual que en nuestros formularios */
.prlb-pmpro .pmpro_form_input-select {
    -webkit-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236e6e73' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    padding-right: 2.6rem;
    cursor: pointer;
}

/* Dos columnas (el plugin ya marca .pmpro_cols-2) */
.pmpro_form_fields.pmpro_cols-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--prlb-space-3);
}
.pmpro_form_fields.pmpro_cols-2 > .pmpro_form_field { margin-bottom: 0; }
@media (max-width: 540px) {
    .pmpro_form_fields.pmpro_cols-2 { grid-template-columns: 1fr; }
}

/* --- Precio del nivel --------------------------------------------------- */
.pmpro_level_name_text { color: var(--prlb-texto-secundario); }
.pmpro_level_cost_text {
    font-weight: 600;
    color: var(--prlb-texto);
}
.pmpro_level_description_text { color: var(--prlb-texto-secundario); }

/* --- Botones ------------------------------------------------------------ */
/* Scopeado con .prlb-pmpro para ganar a `html input[type=submit]` de GeneratePress. */
.prlb-pmpro .pmpro_btn,
.prlb-pmpro .pmpro_btn:visited {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.6rem 1.3rem;
    font: inherit;
    font-weight: 600;
    line-height: 1.2;
    color: #fff;
    background: var(--prlb-acento);
    border: 1px solid var(--prlb-acento);
    border-radius: var(--prlb-radius);
    cursor: pointer;
    text-decoration: none;
    transition: background-color var(--prlb-transition), transform var(--prlb-transition);
}
.prlb-pmpro .pmpro_btn:hover,
.prlb-pmpro .pmpro_btn:focus {
    color: #fff;
    background: #b3000d;
    border-color: #b3000d;
    transform: translateY(-1px);
}
.prlb-pmpro .pmpro_btn-submit-checkout,
.prlb-pmpro .pmpro_form_submit .pmpro_btn {
    padding: 0.8rem 1.65rem;
    font-size: var(--prlb-fs-grande);
    width: 100%;
}
/* Botones "planos" (ver contraseña, cancelar…) */
.prlb-pmpro .pmpro_btn-plain,
.prlb-pmpro .pmpro_btn-plain:visited {
    color: var(--prlb-acento);
    background: none;
    border-color: transparent;
    padding: 0.2rem 0.3rem;
}
.prlb-pmpro .pmpro_btn-plain:hover { color: #b3000d; background: none; transform: none; }

/* =========================================================================
   ACCESO DE SOCIOS — portada propia: fotografía + tarjeta de cristal
   ========================================================================= */
/* El acceso ocupa de borde a borde: anulamos el marco del artículo de
   GeneratePress (padding de .inside-article y .entry-content). */
body.pmpro-login .inside-article,
body.pmpro-login .entry-content,
body.pmpro-login .site-main {
    padding: 0;
    margin: 0;
    border: 0;
    background: none;
    box-shadow: none;
}
body.pmpro-login .entry-content > *:first-child { margin-top: 0; }

.prlb-login {
    /* Dentro de la tarjeta de cristal, los tokens de PMPro pasan a modo
       oscuro/translúcido: sus reglas internas usan #loginform (selector de
       ID) y no se pueden vencer por especificidad, pero sí alimentando sus
       variables desde aquí. */
    --pmpro--color--base: rgba(255, 255, 255, 0.10);
    --pmpro--color--base-2: rgba(255, 255, 255, 0.14);
    --pmpro--color--contrast: #fff;
    --pmpro--color--border: rgba(255, 255, 255, 0.25);

    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - var(--prlb-header-h));
    padding: clamp(2rem, 6vw, 4rem) 1.25rem;
    overflow: hidden;
}
.prlb-login::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background: url("img/hero-prl.jpg") center 42% / cover no-repeat;
    transform: scale(1.05);
}
.prlb-login::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(20, 20, 22, 0.82) 0%, rgba(20, 20, 22, 0.72) 60%, rgba(20, 20, 22, 0.9) 100%),
        radial-gradient(70% 60% at 50% 30%, rgba(224, 0, 16, 0.22), transparent 70%);
}
/* Tarjeta de cristal (liquid glass) */
.prlb-login__card {
    width: min(440px, 100%);
    padding: clamp(1.75rem, 4vw, 2.5rem);
    border-radius: var(--prlb-radius-lg);
    background: rgba(255, 255, 255, 0.10);
    border: 1px solid rgba(255, 255, 255, 0.22);
    -webkit-backdrop-filter: blur(22px) saturate(160%);
    backdrop-filter: blur(22px) saturate(160%);
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.45);
    color: #fff;
    text-align: center;
}
.prlb-login__logo {
    display: block;
    width: auto;
    height: auto;
    max-width: 190px;
    margin: 0 auto var(--prlb-space-3);
    filter: drop-shadow(0 3px 12px rgba(0, 0, 0, 0.4));
}
.prlb-login__intro {
    margin: 0 0 var(--prlb-space-3);
    font-size: var(--prlb-fs-pequeno);
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.5;
}
.prlb-login__alta {
    margin: var(--prlb-space-3) 0 0;
    padding-top: var(--prlb-space-3);
    border-top: 1px solid rgba(255, 255, 255, 0.16);
    font-size: var(--prlb-fs-pequeno);
    color: rgba(255, 255, 255, 0.75);
}
.prlb-login__alta a { color: #fff; font-weight: 600; text-decoration: underline; }
.prlb-login__alta a:hover { color: #ff7a82; }

/* Formulario dentro de la tarjeta de cristal */
.prlb-login form { text-align: left; }
.prlb-login label,
.prlb-login .pmpro_form_label { color: #fff; }
.prlb-login input[type="text"],
.prlb-login input[type="password"],
.prlb-login input[type="email"] {
    width: 100%;
    padding: 0.8rem 1rem;
    font: inherit;
    color: #fff;
    background: rgba(255, 255, 255, 0.10);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: var(--prlb-radius);
    transition: border-color var(--prlb-transition), box-shadow var(--prlb-transition), background-color var(--prlb-transition);
}
.prlb-login input::placeholder { color: rgba(255, 255, 255, 0.5); }
.prlb-login input[type="text"]:focus,
.prlb-login input[type="password"]:focus,
.prlb-login input[type="email"]:focus {
    outline: none;
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(255, 255, 255, 0.6);
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.14);
}
.prlb-login .pmpro_card,
.prlb-login .pmpro_login_wrap,
.prlb-login .pmpro_section {
    background: none;
    border: 0;
    box-shadow: none;
    padding: 0;
    margin: 0;
    max-width: none;
}
.prlb-login .pmpro_card_title { color: #fff; }
.prlb-login input[type="submit"],
.prlb-login .button-primary {
    width: 100%;
    margin-top: var(--prlb-space-2);
}
/* Enlaces auxiliares (recordar contraseña) */
.prlb-login a { color: rgba(255, 255, 255, 0.85); }
.prlb-login a:hover { color: #fff; }
.prlb-login .pmpro_actions_nav,
.prlb-login .pmpro_login_wrap + div { text-align: center; }
.prlb-login label[for="rememberme"],
.prlb-login .login-remember label { font-weight: 500; color: rgba(255, 255, 255, 0.8); }

/* --- Acceso / login ----------------------------------------------------
   El formulario de acceso usa el marcado NATIVO de WordPress
   (input.input, .button-primary), no las clases pmpro_form_*: por eso
   necesita sus propias reglas. */
.prlb-pmpro input[type="text"],
.prlb-pmpro input[type="email"],
.prlb-pmpro input[type="password"],
.prlb-pmpro input[type="tel"],
.prlb-pmpro input[type="number"] {
    width: 100%;
    padding: 0.8rem 1rem;
    font: inherit;
    color: var(--prlb-texto);
    background: var(--prlb-fondo);
    border: 1px solid var(--prlb-borde);
    border-radius: var(--prlb-radius);
    box-shadow: none;
    transition: border-color var(--prlb-transition), box-shadow var(--prlb-transition);
}
.prlb-pmpro input[type="text"]:focus,
.prlb-pmpro input[type="email"]:focus,
.prlb-pmpro input[type="password"]:focus {
    outline: none;
    border-color: var(--prlb-acento);
    box-shadow: 0 0 0 3px rgba(224, 0, 16, 0.14);
}
/* Botones nativos dentro del área de socios (gana a GeneratePress). */
.prlb-pmpro .button-primary,
.prlb-pmpro input[type="submit"],
.prlb-pmpro button[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.8rem 1.65rem;
    font: inherit;
    font-weight: 600;
    color: #fff;
    background: var(--prlb-acento);
    border: 1px solid var(--prlb-acento);
    border-radius: var(--prlb-radius);
    cursor: pointer;
    text-shadow: none;
    box-shadow: none;
    transition: background-color var(--prlb-transition);
}
.prlb-pmpro .button-primary:hover,
.prlb-pmpro input[type="submit"]:hover,
.prlb-pmpro button[type="submit"]:hover {
    color: #fff;
    background: #b3000d;
    border-color: #b3000d;
}
.prlb-pmpro label { font-size: var(--prlb-fs-pequeno); font-weight: 600; }
.prlb-pmpro .pmpro_login_wrap,
.prlb-pmpro .pmpro_lost_password_wrap {
    background-color: var(--prlb-fondo);
    border: 1px solid var(--prlb-borde);
    border-radius: var(--prlb-radius-lg);
    box-shadow: var(--prlb-shadow);
    padding: clamp(1.25rem, 3vw, 1.9rem);
    max-width: 460px;
    margin-inline: auto;
}
/* El login no necesita tanto aire vertical como el checkout. */
body.pmpro-login .prlb-pmpro { padding-block: clamp(1.5rem, 3vw, 2.5rem); }
body.pmpro-login .prlb-pmpro > * + * { margin-top: var(--prlb-space-3); }

/* --- Avisos ------------------------------------------------------------- */
.pmpro_message {
    padding: 0.9rem 1.1rem;
    border: 1px solid var(--prlb-borde);
    border-radius: var(--prlb-radius);
    background: var(--prlb-fondo-alt);
    color: var(--prlb-texto);
    margin-bottom: var(--prlb-space-3);
}
.pmpro_message.pmpro_error {
    background: #fdecec;
    border-color: #f5c2c2;
    color: #a3000c;
}
.pmpro_message.pmpro_success {
    background: #e9f7ef;
    border-color: #b7e4c7;
    color: #1b6b3a;
}

/* --- Tablas (recibos, cuenta) ------------------------------------------- */
.prlb-pmpro table {
    width: 100%;
    border-collapse: collapse;
}
.prlb-pmpro th,
.prlb-pmpro td {
    text-align: left;
    padding: 0.75rem 0.6rem;
    border-bottom: 1px solid var(--prlb-borde);
}
.prlb-pmpro th {
    font-size: var(--prlb-fs-pequeno);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--prlb-texto-secundario);
}
