/*
|--------------------------------------------------------------------------
| I.N.P. El Divino Salvador
| Portal público 2026
|--------------------------------------------------------------------------
*/

:root {
    --eds-bg: #020817;
    --eds-bg-2: #07192f;
    --eds-panel: #0b2235;
    --eds-panel-2: #0f2a3f;
    --eds-header-rgb: 2, 8, 23;

    --eds-line: rgba(255, 255, 255, .09);
    --eds-line-blue: rgba(85, 199, 255, .30);

    --eds-white: #ffffff;
    --eds-text: #c1d1da;
    --eds-muted: #849daa;

    --eds-text-primary: #ffffff;
    --eds-text-secondary: #c1d1da;
    --eds-text-muted: #849daa;
    --eds-on-image: #ffffff;
    --eds-on-image-muted: #d5e2e8;

    --eds-blue: #55c7ff;
    --eds-blue-strong: #3cb7f1;

    --eds-green: #55dc96;
    --eds-yellow: #ffc83d;
    --eds-red: #ff7070;

    --eds-radius: 22px;

    --eds-shadow:
        0 28px 70px rgba(0, 0, 0, .20);
}


/*
|--------------------------------------------------------------------------
| Base
|--------------------------------------------------------------------------
*/

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body.eds-public-body {
    margin: 0;

    overflow-x: hidden;

    background:
        radial-gradient(
            circle at 12% 0%,
            rgba(var(--eds-accent-rgb, 85, 199, 255), .08),
            transparent 34rem
        ),
        radial-gradient(
            circle at 88% 42%,
            rgba(var(--eds-accent-rgb, 85, 199, 255), .035),
            transparent 30rem
        ),
        linear-gradient(
            180deg,
            var(--eds-bg) 0%,
            var(--eds-bg-2) 52%,
            var(--eds-bg) 100%
        );

    color:
        var(--eds-white);

    font-family:
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Helvetica,
        Arial,
        sans-serif;

    -webkit-font-smoothing:
        antialiased;
}

img {
    max-width: 100%;
}

a {
    color: inherit;
}

.eds-main {
    min-height:
        60vh;
}


/*
|--------------------------------------------------------------------------
| Contenedor
|--------------------------------------------------------------------------
*/

.pp-shell {
    width:
        min(
            1180px,
            calc(100% - 40px)
        );

    margin:
        0 auto;
}

.pp-section {
    padding:
        64px 0;
}

.pp-section-soft {
    border-top:
        1px solid var(--eds-line);

    border-bottom:
        1px solid var(--eds-line);

    background:
        rgba(255, 255, 255, .018);
}


/*
|--------------------------------------------------------------------------
| Tipografía
|--------------------------------------------------------------------------
*/

.pp-kicker {
    color:
        var(--eds-blue);

    font-size:
        10px;

    font-weight:
        900;

    letter-spacing:
        3px;

    text-transform:
        uppercase;
}

.pp-title {
    margin:
        10px 0 14px;

    font-size:
        clamp(
            40px,
            6vw,
            68px
        );

    line-height:
        .98;

    letter-spacing:
        -2px;
}

.pp-title-medium {
    margin:
        9px 0 14px;

    font-size:
        clamp(
            30px,
            4vw,
            46px
        );

    line-height:
        1.03;
}

.pp-lead {
    max-width:
        720px;

    color:
        var(--eds-text);

    font-size:
        17px;

    line-height:
        1.75;
}

.pp-muted {
    color:
        var(--eds-muted);
}


/*
|--------------------------------------------------------------------------
| Botones
|--------------------------------------------------------------------------
*/

.pp-actions {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        11px;

    margin-top:
        24px;
}

.pp-button {
    display:
        inline-flex;

    min-height:
        46px;

    padding:
        0 21px;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid
        rgba(85, 199, 255, .42);

    border-radius:
        10px;

    color:
        var(--eds-white);

    text-decoration:
        none;

    font-size:
        14px;

    font-weight:
        900;

    transition:
        transform .16s ease,
        background .16s ease,
        border-color .16s ease;
}

.pp-button:hover {
    transform:
        translateY(-2px);
}

.pp-button-primary {
    border-color:
        var(--eds-blue-strong);

    background:
        var(--eds-blue-strong);

    color:
        #031d2d;
}

.pp-button-secondary {
    background:
        rgba(255,255,255,.025);
}

.pp-button-green {
    border-color:
        rgba(85,220,150,.45);

    background:
        rgba(85,220,150,.14);

    color:
        #67eda6;
}


/*
|--------------------------------------------------------------------------
| Back
|--------------------------------------------------------------------------
*/

.pp-back {
    display:
        inline-flex;

    margin-bottom:
        25px;

    align-items:
        center;

    gap:
        8px;

    color:
        var(--eds-blue);

    text-decoration:
        none;

    font-size:
        13px;

    font-weight:
        900;
}


/*
|--------------------------------------------------------------------------
| Badges
|--------------------------------------------------------------------------
*/

.pp-badges {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        7px;
}

.pp-badge {
    display:
        inline-flex;

    padding:
        6px 10px;

    align-items:
        center;

    border-radius:
        100px;

    background:
        rgba(85,199,255,.11);

    color:
        var(--eds-blue);

    font-size:
        10px;

    font-weight:
        900;
}

.pp-badge-green {
    background:
        rgba(85,220,150,.12);

    color:
        var(--eds-green);
}

.pp-badge-yellow {
    background:
        rgba(255,200,61,.12);

    color:
        var(--eds-yellow);
}


/*
|--------------------------------------------------------------------------
| Cabecera Eventos
|--------------------------------------------------------------------------
*/

.events-hero {
    padding:
        58px 0 35px;
}

.events-hero-grid {
    display:
        grid;

    grid-template-columns:
        1fr auto;

    gap:
        40px;

    align-items:
        end;
}

.events-counter {
    min-width:
        155px;

    padding:
        20px 22px;

    border:
        1px solid var(--eds-line);

    border-radius:
        17px;

    background:
        rgba(255,255,255,.025);
}

.events-counter-value {
    font-size:
        31px;

    font-weight:
        900;
}

.events-counter-label {
    margin-top:
        4px;

    color:
        var(--eds-muted);

    font-size:
        11px;

    font-weight:
        700;
}


/*
|--------------------------------------------------------------------------
| Evento principal
|--------------------------------------------------------------------------
*/

.featured-event {
    display:
        grid;

    grid-template-columns:
        1.15fr .85fr;

    overflow:
        hidden;

    border:
        1px solid var(--eds-line);

    border-radius:
        26px;

    background:
        var(--eds-panel);

    box-shadow:
        var(--eds-shadow);
}

.featured-event-media {
    position:
        relative;

    min-height:
        460px;

    overflow:
        hidden;

    background:
        #10283a;
}

.featured-event-media img {
    display:
        block;

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    transition:
        transform .45s ease;
}

.featured-event:hover
.featured-event-media img {
    transform:
        scale(1.025);
}

.featured-event-overlay {
    position:
        absolute;

    inset:
        0;

    background:
        linear-gradient(
            90deg,
            rgba(5,18,28,.02),
            rgba(5,18,28,.13)
        );
}

.featured-event-fallback {
    width:
        100%;

    height:
        100%;

    min-height:
        460px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    flex-direction:
        column;

    background:
        radial-gradient(
            circle at center,
            #1a4b68,
            #09202f
        );
}

.featured-event-day {
    font-size:
        105px;

    font-weight:
        900;

    line-height:
        .8;
}

.featured-event-month {
    margin-top:
        17px;

    color:
        var(--eds-yellow);

    font-size:
        19px;

    font-weight:
        900;

    letter-spacing:
        4px;
}

.featured-event-body {
    display:
        flex;

    padding:
        38px;

    justify-content:
        center;

    flex-direction:
        column;
}

.featured-event-body h2 {
    margin:
        17px 0 13px;

    font-size:
        clamp(
            32px,
            4vw,
            49px
        );

    line-height:
        1;

    letter-spacing:
        -1px;
}

.featured-event-summary {
    color:
        var(--eds-text);

    line-height:
        1.7;
}


/*
|--------------------------------------------------------------------------
| Tarjetas Eventos
|--------------------------------------------------------------------------
*/

.events-list-title {
    margin-bottom:
        25px;
}

.events-grid {
    display:
        grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap:
        19px;
}

.event-card {
    overflow:
        hidden;

    border:
        1px solid var(--eds-line);

    border-radius:
        20px;

    background:
        rgba(255,255,255,.03);

    color:
        var(--eds-white);

    text-decoration:
        none;

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.event-card:hover {
    transform:
        translateY(-4px);

    border-color:
        rgba(85,199,255,.43);

    box-shadow:
        0 24px 55px rgba(0,0,0,.18);
}

.event-card-image {
    position:
        relative;

    overflow:
        hidden;

    aspect-ratio:
        16 / 10;

    background:
        #10283a;
}

.event-card-image img {
    display:
        block;

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    transition:
        transform .35s ease;
}

.event-card:hover
.event-card-image img {
    transform:
        scale(1.04);
}

.event-date-overlay {
    position:
        absolute;

    left:
        14px;

    bottom:
        14px;

    padding:
        10px 13px;

    border:
        1px solid
        rgba(255,255,255,.13);

    border-radius:
        12px;

    background:
        rgba(4,18,28,.83);

    backdrop-filter:
        blur(12px);
}

.event-date-overlay strong {
    display:
        block;

    font-size:
        22px;
}

.event-date-overlay span {
    color:
        var(--eds-blue);

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        1px;
}

.event-card-fallback {
    width:
        100%;

    height:
        100%;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    flex-direction:
        column;

    background:
        radial-gradient(
            circle at center,
            #19465f,
            #0b2232
        );
}

.event-card-fallback-day {
    font-size:
        60px;

    font-weight:
        900;

    line-height:
        .9;
}

.event-card-fallback-month {
    margin-top:
        10px;

    color:
        var(--eds-yellow);

    font-size:
        13px;

    font-weight:
        900;

    letter-spacing:
        2px;
}

.event-card-content {
    padding:
        21px;
}

.event-card-content h3 {
    margin:
        12px 0 9px;

    font-size:
        21px;

    line-height:
        1.18;
}

.event-card-summary {
    color:
        #9fb5c2;

    font-size:
        14px;

    line-height:
        1.6;
}

.event-card-meta {
    display:
        grid;

    gap:
        6px;

    margin-top:
        16px;

    padding-top:
        15px;

    border-top:
        1px solid
        rgba(255,255,255,.07);

    color:
        #839ca9;

    font-size:
        12px;
}

.event-card-more {
    display:
        inline-block;

    margin-top:
        15px;

    color:
        var(--eds-blue);

    font-size:
        13px;

    font-weight:
        900;
}


/*
|--------------------------------------------------------------------------
| Detalle del evento
|--------------------------------------------------------------------------
*/

.event-detail {
    padding:
        46px 0 15px;
}

.event-detail-hero {
    display:
        grid;

    grid-template-columns:
        1.12fr .88fr;

    overflow:
        hidden;

    border:
        1px solid var(--eds-line);

    border-radius:
        27px;

    background:
        var(--eds-panel);

    box-shadow:
        var(--eds-shadow);
}

.event-detail-media {
    min-height:
        525px;

    overflow:
        hidden;

    background:
        #10283a;
}

.event-detail-media img {
    display:
        block;

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;
}

.event-detail-copy {
    padding:
        42px;
}

.event-detail-copy h1 {
    margin:
        17px 0;

    font-size:
        clamp(
            38px,
            5vw,
            60px
        );

    line-height:
        .98;

    letter-spacing:
        -2px;
}

.event-detail-summary {
    color:
        var(--eds-text);

    font-size:
        16px;

    line-height:
        1.7;
}


/*
|--------------------------------------------------------------------------
| Metadatos
|--------------------------------------------------------------------------
*/

.event-info-grid {
    display:
        grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0,1fr)
        );

    gap:
        11px;

    margin-top:
        27px;
}

.event-info {
    padding:
        15px 16px;

    border:
        1px solid var(--eds-line);

    border-radius:
        12px;

    background:
        rgba(255,255,255,.025);
}

.event-info-label {
    margin-bottom:
        6px;

    color:
        var(--eds-blue);

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        1.5px;
}

.event-info-value {
    color:
        var(--eds-white);

    font-size:
        13px;

    font-weight:
        700;

    line-height:
        1.5;
}


/*
|--------------------------------------------------------------------------
| Contenido
|--------------------------------------------------------------------------
*/

.event-content-grid {
    display:
        grid;

    grid-template-columns:
        minmax(0, 1fr)
        350px;

    gap:
        25px;

    align-items:
        start;

    padding-top:
        35px;
}

.event-description-card,
.registration-card {
    border:
        1px solid var(--eds-line);

    border-radius:
        20px;

    background:
        rgba(255,255,255,.027);
}

.event-description-card {
    padding:
        30px;
}

.event-description-card h2,
.registration-card h2 {
    margin:
        0 0 16px;

    font-size:
        24px;
}

.event-description-text {
    color:
        var(--eds-text);

    line-height:
        1.9;
}

.registration-card {
    position:
        sticky;

    top:
        105px;

    overflow:
        hidden;
}

.registration-card-header {
    padding:
        22px;

    border-bottom:
        1px solid var(--eds-line);

    background:
        rgba(85,199,255,.045);
}

.registration-card-body {
    padding:
        22px;
}

.registration-status {
    margin-bottom:
        15px;

    padding:
        13px 14px;

    border-radius:
        11px;

    background:
        rgba(85,220,150,.09);

    color:
        var(--eds-green);

    font-size:
        13px;

    font-weight:
        800;
}

.registration-status.closed {
    background:
        rgba(255,200,61,.08);

    color:
        var(--eds-yellow);
}

.registration-capacity {
    display:
        flex;

    margin:
        17px 0;

    justify-content:
        space-between;

    gap:
        20px;

    color:
        var(--eds-text);

    font-size:
        13px;
}

.capacity-bar {
    height:
        8px;

    overflow:
        hidden;

    border-radius:
        99px;

    background:
        rgba(255,255,255,.08);
}

.capacity-bar-fill {
    height:
        100%;

    border-radius:
        inherit;

    background:
        linear-gradient(
            90deg,
            #37b9ef,
            #55dc96
        );
}


/*
|--------------------------------------------------------------------------
| Pagination
|--------------------------------------------------------------------------
*/

.pp-pagination {
    display:
        flex;

    margin-top:
        32px;

    align-items:
        center;

    justify-content:
        center;

    gap:
        10px;
}

.pp-pagination a,
.pp-pagination span {
    display:
        inline-flex;

    min-height:
        40px;

    padding:
        0 15px;

    align-items:
        center;

    border:
        1px solid var(--eds-line);

    border-radius:
        9px;

    background:
        rgba(255,255,255,.025);

    color:
        var(--eds-text);

    text-decoration:
        none;

    font-size:
        13px;
}

.pp-pagination a:hover {
    border-color:
        rgba(85,199,255,.40);

    color:
        var(--eds-blue);
}

.pp-pagination .disabled {
    opacity:
        .40;
}


/*
|--------------------------------------------------------------------------
| Vacío
|--------------------------------------------------------------------------
*/

.pp-empty {
    padding:
        45px 25px;

    border:
        1px dashed
        rgba(255,255,255,.14);

    border-radius:
        19px;

    color:
        var(--eds-muted);

    text-align:
        center;
}


/*
|--------------------------------------------------------------------------
| Responsive
|--------------------------------------------------------------------------
*/

@media (max-width: 980px) {

    .featured-event,
    .event-detail-hero {
        grid-template-columns:
            1fr;
    }

    .featured-event-media,
    .event-detail-media {
        min-height:
            420px;
    }

    .events-grid {
        grid-template-columns:
            repeat(
                2,
                1fr
            );
    }

    .event-content-grid {
        grid-template-columns:
            1fr;
    }

    .registration-card {
        position:
            relative;

        top:
            auto;
    }

}


@media (max-width: 700px) {

    .pp-shell {
        width:
            min(
                100% - 28px,
                1180px
            );
    }

    .pp-section {
        padding:
            50px 0;
    }

    .events-hero {
        padding:
            42px 0 25px;
    }

    .events-hero-grid {
        grid-template-columns:
            1fr;
    }

    .events-counter {
        width:
            max-content;
    }

    .featured-event-media,
    .event-detail-media {
        min-height:
            315px;
    }

    .featured-event-body,
    .event-detail-copy {
        padding:
            27px 22px;
    }

    .events-grid,
    .event-info-grid {
        grid-template-columns:
            1fr;
    }

}


/*
|--------------------------------------------------------------------------
| V4 - Fondos dinámicos por paleta
|--------------------------------------------------------------------------
|
| Estas reglas no cambian la lógica del portal. Únicamente hacen que la
| paleta pública también transforme la atmósfera visual del sitio.
|
*/

html,
body.eds-public-body {
    background-color: var(--eds-bg);
}

body.eds-public-body {
    transition:
        background-color .30s ease,
        color .30s ease;
}

.pp-section-soft {
    background:
        linear-gradient(
            180deg,
            var(--eds-bg-2),
            var(--eds-bg)
        );
}

.featured-event,
.event-detail-hero,
.events-counter,
.event-card,
.event-info,
.event-description-card,
.registration-card {
    transition:
        background .30s ease,
        border-color .30s ease,
        box-shadow .30s ease;
}

.featured-event,
.event-detail-hero {
    background:
        linear-gradient(
            145deg,
            var(--eds-panel),
            var(--eds-panel-2)
        );
}

.events-counter,
.event-card,
.event-info,
.event-description-card,
.registration-card {
    background:
        linear-gradient(
            145deg,
            color-mix(
                in srgb,
                var(--eds-panel) 88%,
                transparent
            ),
            color-mix(
                in srgb,
                var(--eds-panel-2) 82%,
                transparent
            )
        );
}

.registration-card-header {
    background:
        rgba(
            var(--eds-accent-rgb, 85, 199, 255),
            .055
        );
}

@supports not (
    background:
        color-mix(in srgb, #000 50%, transparent)
) {
    .events-counter,
    .event-card,
    .event-info,
    .event-description-card,
    .registration-card {
        background:
            var(--eds-panel);
    }
}


/*
|--------------------------------------------------------------------------
| V5 - Paleta Perla / páginas internas claras
|--------------------------------------------------------------------------
*/

html[data-eds-scheme="light"] body.eds-public-body {
    background:
        radial-gradient(
            circle at 12% 0%,
            rgba(var(--eds-accent-rgb, 38, 158, 216), .10),
            transparent 34rem
        ),
        linear-gradient(
            180deg,
            var(--eds-bg) 0%,
            var(--eds-bg-2) 55%,
            var(--eds-bg) 100%
        );

    color:
        #0f2233;
}

html[data-eds-scheme="light"] .pp-section-soft {
    border-top-color:
        rgba(15,34,51,.08);

    border-bottom-color:
        rgba(15,34,51,.08);

    background:
        linear-gradient(
            180deg,
            #edf5fa,
            #f8fbfd
        );
}

html[data-eds-scheme="light"] .pp-title,
html[data-eds-scheme="light"] .pp-title-medium,
html[data-eds-scheme="light"] .events-counter-value,
html[data-eds-scheme="light"] .featured-event-body h2,
html[data-eds-scheme="light"] .event-card-content h3,
html[data-eds-scheme="light"] .event-detail-copy h1,
html[data-eds-scheme="light"] .event-info-value,
html[data-eds-scheme="light"] .event-description-card h2,
html[data-eds-scheme="light"] .registration-card h2 {
    color:
        #0f2233;
}

html[data-eds-scheme="light"] .pp-lead,
html[data-eds-scheme="light"] .pp-muted,
html[data-eds-scheme="light"] .events-counter-label,
html[data-eds-scheme="light"] .featured-event-summary,
html[data-eds-scheme="light"] .event-card-summary,
html[data-eds-scheme="light"] .event-card-meta,
html[data-eds-scheme="light"] .event-detail-summary,
html[data-eds-scheme="light"] .event-description-text {
    color:
        #496275;
}

html[data-eds-scheme="light"] .events-counter,
html[data-eds-scheme="light"] .featured-event,
html[data-eds-scheme="light"] .event-card,
html[data-eds-scheme="light"] .event-detail-hero,
html[data-eds-scheme="light"] .event-info,
html[data-eds-scheme="light"] .event-description-card,
html[data-eds-scheme="light"] .registration-card {
    border-color:
        rgba(15,34,51,.10);

    background:
        #ffffff;

    box-shadow:
        0 18px 50px
        rgba(34,72,98,.08);
}

html[data-eds-scheme="light"] .event-card:hover {
    border-color:
        rgba(var(--eds-accent-rgb, 38, 158, 216),.36);

    box-shadow:
        0 22px 55px
        rgba(34,72,98,.12);
}

html[data-eds-scheme="light"] .pp-button {
    border-color:
        rgba(var(--eds-accent-rgb, 38, 158, 216),.34);

    color:
        #0f2233;
}

html[data-eds-scheme="light"] .pp-button-primary {
    color:
        #ffffff;
}

html[data-eds-scheme="light"] .pp-button-secondary {
    background:
        #ffffff;
}

html[data-eds-scheme="light"] .pp-badge {
    background:
        rgba(var(--eds-accent-rgb, 38, 158, 216),.10);

    color:
        var(--eds-accent-deep, #0f6e9f);
}

html[data-eds-scheme="light"] .event-date-overlay {
    border-color:
        rgba(255,255,255,.24);

    background:
        rgba(8,27,40,.84);

    color:
        #ffffff;
}

html[data-eds-scheme="light"] .registration-card-header {
    border-bottom-color:
        rgba(15,34,51,.08);

    background:
        rgba(var(--eds-accent-rgb, 38, 158, 216), .055);
}


/*
|--------------------------------------------------------------------------
| V6 - Ajustes finos paleta Perla
| Mejora contraste y armonía en páginas internas
|--------------------------------------------------------------------------
*/

html[data-eds-scheme="light"] .pp-kicker,
html[data-eds-scheme="light"] .event-date-label,
html[data-eds-scheme="light"] .featured-event-label,
html[data-eds-scheme="light"] .event-card-label {
    color:
        var(--eds-accent-deep, #0f6e9f);
}

html[data-eds-scheme="light"] .featured-event-body,
html[data-eds-scheme="light"] .event-card-content,
html[data-eds-scheme="light"] .event-info,
html[data-eds-scheme="light"] .registration-card,
html[data-eds-scheme="light"] .event-description-card {
    color:
        #0f2233;
}

html[data-eds-scheme="light"] .event-card-meta strong,
html[data-eds-scheme="light"] .event-info-value,
html[data-eds-scheme="light"] .featured-event-day,
html[data-eds-scheme="light"] .event-card-fallback-day {
    color:
        #0f2233;
}

html[data-eds-scheme="light"] .featured-event-month,
html[data-eds-scheme="light"] .event-card-fallback-month,
html[data-eds-scheme="light"] .event-info-label {
    color:
        #496275;
}

html[data-eds-scheme="light"] .featured-event-overlay {
    background:
        linear-gradient(
            180deg,
            rgba(15,34,51,.02),
            rgba(15,34,51,.04) 40%,
            rgba(15,34,51,.14) 100%
        );
}

html[data-eds-scheme="light"] .event-detail-hero {
    background:
        linear-gradient(
            145deg,
            #ffffff,
            #edf4f9
        );
}

html[data-eds-scheme="light"] .event-date-overlay {
    box-shadow:
        0 12px 30px rgba(15,34,51,.14);
}

html[data-eds-scheme="light"] .pp-empty,
html[data-eds-scheme="light"] .pp-state-empty {
    border-color:
        rgba(15,34,51,.10);

    background:
        rgba(255,255,255,.72);

    color:
        #60798a;
}


/*
|--------------------------------------------------------------------------
| V7 - Sistema tipográfico y contraste semántico
|--------------------------------------------------------------------------
|
| La paleta ya no cambia solamente fondos. Los textos principales,
| secundarios y muted siguen el tema activo.
|
*/

body.eds-public-body {
    color:
        var(--eds-text-primary, var(--eds-white));
}

.pp-title,
.pp-title-medium {
    color:
        var(--eds-text-primary, var(--eds-white));
}

.pp-lead {
    color:
        var(--eds-text-secondary, var(--eds-text));
}

.pp-muted {
    color:
        var(--eds-text-muted, var(--eds-muted));
}

html[data-eds-scheme="light"] body.eds-public-body {
    --eds-white: #0f2233;
    --eds-text: #496275;
    --eds-muted: #6f8797;
    --eds-text-primary: #0f2233;
    --eds-text-secondary: #496275;
    --eds-text-muted: #6f8797;
    --eds-on-image: #ffffff;
    --eds-on-image-muted: #d8e5ec;
    --eds-line: rgba(15,34,51,.10);
    --eds-line-blue: rgba(var(--eds-accent-rgb, 38,158,216), .28);
}

/*
| Predicaciones: las tarjetas de listado tienen fondo claro en Perla.
| Se excluyen las tarjetas cinematográficas del Home.
*/
html[data-eds-scheme="light"]
#contenido-principal
a[href*="/predicaciones/"]:not(.home-sermon-feature):not(.home-sermon-mini)
:is(h1,h2,h3,h4,strong) {
    color:
        var(--eds-text-primary) !important;
}

html[data-eds-scheme="light"]
#contenido-principal
a[href*="/predicaciones/"]:not(.home-sermon-feature):not(.home-sermon-mini)
:is(p,span) {
    color:
        var(--eds-text-secondary) !important;
}

/*
| Etiquetas y enlaces conservan el acento.
*/
html[data-eds-scheme="light"]
#contenido-principal
:is(
    .pp-kicker,
    .section-kicker,
    .section-link,
    .event-card-more,
    .featured-event-more,
    .registration-link
) {
    color:
        var(--eds-accent-deep, #0f6e9f) !important;
}

/*
| Superficies claras genéricas.
*/
html[data-eds-scheme="light"]
#contenido-principal
:is(
    .events-counter,
    .event-card,
    .event-info,
    .event-description-card,
    .registration-card
) {
    color:
        var(--eds-text-primary);
}

/*
| El footer permanece oscuro; no forma parte de #contenido-principal.
*/


/*
|--------------------------------------------------------------------------
| V8 - Fallback de contraste para contenido destacado
|--------------------------------------------------------------------------
*/

html[data-eds-scheme="light"]
#contenido-principal
.eds-auto-dark-surface {
    color:
        #ffffff !important;
}

html[data-eds-scheme="light"]
#contenido-principal
.eds-auto-dark-surface
:is(h1,h2,h3,h4,h5,h6,p,span,small,strong,a) {
    color:
        #ffffff !important;
}

html[data-eds-scheme="light"]
#contenido-principal
.eds-auto-dark-surface
:is([class*="meta"],[class*="summary"],[class*="description"]) {
    color:
        #d7e4ea !important;
}


/*
|--------------------------------------------------------------------------
| V9 - Superficies oscuras dentro del tema claro
|--------------------------------------------------------------------------
*/

html[data-eds-scheme="light"]
body.eds-public-body
#contenido-principal
.eds-auto-dark-surface,
html[data-eds-scheme="light"]
body.eds-public-body
#contenido-principal
.eds-auto-dark-surface
:is(h1,h2,h3,h4,h5,h6,p,span,small,strong,b,em,a) {
    color:
        #ffffff !important;
}

html[data-eds-scheme="light"]
body.eds-public-body
#contenido-principal
.eds-auto-dark-surface
:is([class*="meta"],[class*="description"],[class*="summary"],[class*="subtitle"]) {
    color:
        #c6d7df !important;
}