/* ==========================================================================
   Ayudas Archive - Grid & Cards
   ========================================================================== */

.wpvp-ayudas-archive {
    width: 100%;
}

/* Si el shortcode queda dentro de un sub-contenedor Elementor hijo con
   padding horizontal propio, se neutraliza ese padding lateral para que el
   grid recupere el ancho total de la sección (mismo ancho que tendría un
   widget Elementor colocado al nivel del padre). El padding vertical se
   conserva. */
.elementor-element.e-con.e-child:has(.wpvp-ayudas-archive) {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Grid: 4 cols (desktop) / 2 (laptop+tablet) / 1 (mobile), gap 10px */
.wpvp-ayudas-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

@media (max-width: 1366px) {
    .wpvp-ayudas-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .wpvp-ayudas-grid {
        grid-template-columns: 1fr;
    }
}

/* Card */
.wpvp-ayuda-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: var(--e-global-color-10ca9e0, #ffffff);
    border-radius: 25px;
    padding: 25px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0);
    transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.wpvp-ayuda-card:hover {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
}

@media (max-width: 1024px) {
    .wpvp-ayuda-card {
        padding: 15px;
    }
}

/* Link-overlay: cubre toda la tarjeta para hacerla clicable */
.wpvp-ayuda-card__link-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    text-indent: -9999px;
    overflow: hidden;
    white-space: nowrap;
    border-radius: inherit;
}

/* Pill de temática absoluta sobre la imagen, top-left de la card */
.wpvp-ayuda-card__tematica {
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 2;
    max-width: calc(100% - 40px);
    padding: 3px 10px 5px 10px;
    background: var(--e-global-color-primary, #1a4d7a);
    color: var(--e-global-color-10ca9e0, #ffffff);
    font-family: "Barlow", sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4em;
    text-transform: uppercase;
    border-radius: 30px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 1024px) {
    .wpvp-ayuda-card__tematica {
        font-size: 18px;
    }
}

@media (max-width: 767px) {
    .wpvp-ayuda-card__tematica {
        font-size: 16px;
        line-height: 1.3em;
    }
}

/* Media (imagen) */
.wpvp-ayuda-card__media {
    position: relative;
    aspect-ratio: 3 / 2;
    overflow: hidden;
    background: #eef2f6;
    margin-bottom: 15px;
}

.wpvp-ayuda-card__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.wpvp-ayuda-card__image--placeholder {
    object-fit: contain;
    padding: 40px;
    background: #eef2f6;
}

/* Cuerpo de la tarjeta */
.wpvp-ayuda-card__body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex-grow: 1;
}

.wpvp-ayuda-card__title {
    margin: 0;
    font-size: 18px;
    line-height: 1.35;
    font-weight: 600;
    color: var(--e-global-color-primary, #1a1a1a);
}

/* Fechas de inicio / fin bajo el titulo */
.wpvp-ayuda-card__fechas {
    margin: -6px 0 0;
    font-size: 11px;
    line-height: 1.4;
    font-weight: 600;
    color: var(--e-global-color-text, #555);
}

.wpvp-ayuda-card__fechas-label {
    font-weight: 700;
}

.wpvp-ayuda-card__excerpt {
    font-size: 14px;
    color: var(--e-global-color-text, #555);
    line-height: 1.5;
    flex-grow: 1;
}

.wpvp-ayuda-card__excerpt p {
    margin: 0;
}

/* Botón "¿Necesitas ayuda?" — relative + z-index para quedar sobre el link-overlay */
.wpvp-ayuda-card .wpvp-ayuda-btn-contacto {
    position: relative;
    z-index: 2;
    align-self: flex-start;
    margin-top: auto;
    padding: 8px 16px;
    background: transparent;
    color: var(--e-global-color-primary, #0073aa);
    border: 1px solid var(--e-global-color-primary, #0073aa);
    border-radius: 30px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.wpvp-ayuda-card .wpvp-ayuda-btn-contacto:hover {
    background: var(--e-global-color-primary, #0073aa);
    color: #fff;
}

/* Botón contacto fuera de la tarjeta (single, etc.) — estilos base */
.wpvp-ayuda-btn-contacto {
    display: inline-block;
    padding: 8px 16px;
    background: transparent;
    color: #0073aa;
    border: 1px solid #0073aa;
    border-radius: 4px;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.wpvp-ayuda-btn-contacto:hover {
    background: #0073aa;
    color: #fff;
}

/* Paginación */
.wpvp-ayudas-pagination {
    margin-top: 30px;
    text-align: center;
}

.wpvp-ayudas-pagination .page-numbers {
    display: inline-block;
    padding: 8px 14px;
    margin: 0 2px;
    border: 1px solid #ddd;
    border-radius: 4px;
    color: #333;
    text-decoration: none;
    font-size: 14px;
}

.wpvp-ayudas-pagination .page-numbers.current {
    background: #0073aa;
    color: #fff;
    border-color: #0073aa;
}

.wpvp-ayudas-pagination .page-numbers:hover:not(.current) {
    background: #f5f5f5;
}

/* No results */
.wpvp-ayudas-no-results {
    text-align: center;
    padding: 40px 20px;
    color: #777;
    font-size: 16px;
}

/* ==========================================================================
   Fix Search & Filter Pro: input del combobox transparente
   ==========================================================================
   El Kit de Elementor y el theme child pintan background blanco en todo
   input[type="text"], lo que tapa el texto del valor pre-seleccionado al
   acceder con un filtro en la URL (p. ej. /ayudas/?_organismo=cdti). Forzamos
   transparencia solo en los inputs internos de los combobox de S&F. */
.search-filter-component-combobox__actions-input,
input.search-filter-component-combobox__actions-input,
input[type="text"].search-filter-component-combobox__actions-input {
    background: transparent !important;
}

/* ==========================================================================
   Organismos Archive - Grid & Cards
   ========================================================================== */

.wpvp-organismos-archive {
    width: 100%;
}

.elementor-element.e-con.e-child:has(.wpvp-organismos-archive) {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.wpvp-organismos-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

@media (max-width: 1366px) {
    .wpvp-organismos-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .wpvp-organismos-grid {
        grid-template-columns: 1fr;
    }
}

.wpvp-organismo-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 14px;
    padding: 25px;
    background: var(--e-global-color-10ca9e0, #ffffff);
    border-radius: 25px;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0);
    transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.wpvp-organismo-card:hover {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
}

@media (max-width: 1024px) {
    .wpvp-organismo-card {
        padding: 15px;
    }
}

.wpvp-organismo-card__media {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 3 / 2;
    background: #eef2f6;
    border-radius: 15px;
    overflow: hidden;
}

.wpvp-organismo-card__logo {
    max-width: 70%;
    max-height: 70%;
    object-fit: contain;
}

.wpvp-organismo-card__logo-fallback {
    font-size: 32px;
    font-weight: 700;
    color: var(--e-global-color-primary, #1a4d7a);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.wpvp-organismo-card__body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: 100%;
}

.wpvp-organismo-card__name {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--e-global-color-primary, #1a1a1a);
}

.wpvp-organismo-card__count {
    font-size: 13px;
    color: var(--e-global-color-text, #666);
    text-transform: uppercase;
    letter-spacing: 0.3px;
}