/*
 * GIFI cards
 * Shared, plugin-scoped styles for Events, Publications and Videos.
 * Bootstrap handles grid, spacing and utilities; these rules protect the
 * components from theme-specific card/image/link styles.
 */

.gifi-card-wrapper,
.gifi-event-card-wrapper {
    --gifi-card-primary: var(--bs-primary, #0d6efd);
    --gifi-card-success: var(--bs-success, #198754);
    --gifi-card-text: var(--bs-body-color, #212529);
    --gifi-card-muted: var(--bs-secondary-color, #6c757d);
    --gifi-card-border: var(--bs-border-color, #dee2e6);
    --gifi-card-bg: var(--bs-body-bg, #fff);
    --gifi-card-soft-bg: var(--bs-tertiary-bg, #f5f6f7);
}

/* -------------------------------------------------------------------------- */
/* Shared card language                                                       */
/* -------------------------------------------------------------------------- */

article.gifi-content-card,
article.gifi-event-card {
    position: relative;
    background: var(--gifi-card-bg) !important;
    border: 1px solid var(--gifi-card-border) !important;
    border-radius: .75rem !important;
    box-shadow: 0 .25rem 1rem rgba(0, 0, 0, .06);
    color: var(--gifi-card-text) !important;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

article.gifi-content-card:hover,
article.gifi-event-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 .65rem 1.5rem rgba(0, 0, 0, .10);
    border-color: rgba(var(--bs-primary-rgb, 13, 110, 253), .28) !important;
}

.gifi-card-media,
.gifi-event-media {
    position: relative;
    min-height: 240px;
    overflow: hidden;
    background: var(--gifi-card-soft-bg) !important;
}

.gifi-card-image,
.gifi-event-image {
    position: absolute !important;
    inset: 0;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    object-fit: cover !important;
    opacity: 1 !important;
    filter: none !important;
    transform: scale(1);
    transition: transform .35s ease;
}

article.gifi-content-card:hover .gifi-card-image,
article.gifi-event-card:hover .gifi-event-image {
    transform: scale(1.025);
}

.gifi-card-body,
.gifi-event-body {
    position: relative;
    z-index: 1;
    background: var(--gifi-card-bg) !important;
    color: var(--gifi-card-text) !important;
}

.gifi-card-badge,
.gifi-event-type,
.gifi-event-status {
    font-size: .72rem !important;
    line-height: 1 !important;
    letter-spacing: .04em;
    text-transform: uppercase;
    font-weight: 700 !important;
    padding: .55rem .75rem !important;
}

.gifi-card-title,
.gifi-card-title.card-title,
.gifi-event-title,
.gifi-event-title.card-title {
    margin-top: 0 !important;
    color: var(--gifi-card-text) !important;
    font-size: clamp(1.25rem, 1.05rem + .55vw, 1.7rem) !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
}

.gifi-card-title a,
.gifi-card-title a:visited,
.gifi-event-title a,
.gifi-event-title a:visited {
    color: inherit !important;
    text-decoration: none !important;
}

.gifi-card-title a:hover,
.gifi-event-title a:hover {
    color: var(--gifi-card-primary) !important;
}

.gifi-card-title a:focus-visible,
.gifi-event-title a:focus-visible {
    outline: 3px solid rgba(var(--bs-primary-rgb, 13, 110, 253), .35);
    outline-offset: 4px;
    border-radius: .15rem;
}

.gifi-card-meta-label,
.gifi-event-meta-label {
    color: var(--gifi-card-muted) !important;
    font-size: .73rem !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.gifi-card-meta-value,
.gifi-event-meta-value {
    color: var(--gifi-card-text) !important;
    font-size: .98rem !important;
    line-height: 1.45 !important;
    font-weight: 600 !important;
}

.gifi-card-cta,
.gifi-event-cta {
    color: var(--gifi-card-primary) !important;
    font-size: .9rem !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
}

.gifi-card-arrow,
.gifi-event-arrow {
    display: inline-block;
    margin-left: .2rem;
    transition: transform .2s ease;
}

article.gifi-content-card:hover .gifi-card-arrow,
article.gifi-event-card:hover .gifi-event-arrow {
    transform: translateX(.2rem);
}

/* -------------------------------------------------------------------------- */
/* Events                                                                     */
/* -------------------------------------------------------------------------- */

.gifi-event-type {
    color: var(--gifi-card-primary) !important;
    background: rgba(var(--bs-primary-rgb, 13, 110, 253), .08) !important;
    border: 1px solid rgba(var(--bs-primary-rgb, 13, 110, 253), .20);
}

.gifi-event-status {
    color: var(--gifi-card-success) !important;
    background: rgba(var(--bs-success-rgb, 25, 135, 84), .08) !important;
    border: 1px solid rgba(var(--bs-success-rgb, 25, 135, 84), .20);
}

.gifi-event-meta {
    color: var(--gifi-card-text) !important;
}

.gifi-event-meta-secondary {
    margin-top: .15rem;
    color: var(--gifi-card-muted) !important;
    font-size: .9rem !important;
    line-height: 1.4 !important;
}

/* -------------------------------------------------------------------------- */
/* Publications                                                               */
/* -------------------------------------------------------------------------- */

.gifi-publication-type {
    color: var(--gifi-card-primary) !important;
    background: rgba(var(--bs-primary-rgb, 13, 110, 253), .08) !important;
    border: 1px solid rgba(var(--bs-primary-rgb, 13, 110, 253), .20);
}

.gifi-publication-year {
    color: var(--gifi-card-text) !important;
    background: var(--gifi-card-soft-bg) !important;
    border: 1px solid var(--gifi-card-border) !important;
}

.gifi-publication-media {
    background: var(--gifi-card-soft-bg) !important;
}

.gifi-publication-image {
    object-position: center !important;
}

.gifi-card-detail {
    position: relative;
    z-index: 1;
}

.gifi-keyword-pill {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    padding: .35rem .6rem;
    border: 1px solid var(--gifi-card-border);
    border-radius: 999px;
    background: var(--gifi-card-soft-bg) !important;
    color: var(--gifi-card-muted) !important;
    font-size: .78rem !important;
    line-height: 1.25 !important;
    font-weight: 600 !important;
}

/* -------------------------------------------------------------------------- */
/* Videos                                                                     */
/* -------------------------------------------------------------------------- */

.gifi-video-media {
    min-height: 250px;
    background: #111 !important;
}

.gifi-video-type {
    color: var(--gifi-card-primary) !important;
    background: rgba(var(--bs-primary-rgb, 13, 110, 253), .08) !important;
    border: 1px solid rgba(var(--bs-primary-rgb, 13, 110, 253), .20);
}

.gifi-video-play {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.75rem;
    height: 3.75rem;
    border: 1px solid rgba(255, 255, 255, .8);
    border-radius: 50%;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 .35rem 1rem rgba(0, 0, 0, .2);
    color: #111 !important;
    transform: translate(-50%, -50%);
    transition: transform .2s ease, background-color .2s ease;
    pointer-events: none;
}

.gifi-video-play i {
    display: block;
    margin-left: .12rem;
    font-size: 1.15rem;
    line-height: 1;
}

article.gifi-video-card:hover .gifi-video-play {
    background: #fff;
    transform: translate(-50%, -50%) scale(1.06);
}

.gifi-video-description {
    position: relative;
    z-index: 1;
    color: var(--gifi-card-muted) !important;
    font-size: .95rem !important;
    line-height: 1.55 !important;
}

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

@media (max-width: 767.98px) {
    .gifi-card-media,
    .gifi-event-media,
    .gifi-video-media {
        min-height: 0;
        aspect-ratio: 16 / 9;
    }

    .gifi-card-body,
    .gifi-event-body {
        padding: 1.25rem !important;
    }

    .gifi-video-play {
        width: 3.25rem;
        height: 3.25rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    article.gifi-content-card,
    article.gifi-event-card,
    .gifi-card-image,
    .gifi-event-image,
    .gifi-card-arrow,
    .gifi-event-arrow,
    .gifi-video-play {
        transition: none !important;
    }

    article.gifi-content-card:hover,
    article.gifi-event-card:hover,
    article.gifi-content-card:hover .gifi-card-image,
    article.gifi-event-card:hover .gifi-event-image,
    article.gifi-content-card:hover .gifi-card-arrow,
    article.gifi-event-card:hover .gifi-event-arrow,
    article.gifi-video-card:hover .gifi-video-play {
        transform: none !important;
    }

    article.gifi-video-card:hover .gifi-video-play {
        transform: translate(-50%, -50%) !important;
    }
}