/**
 * Single event page, The Moran Hotel (Figma "The Moran Hotel - Happenings" node 1:129, desktop 1440).
 * Markup: tribe-events/single-event.php (content) + tribe/events/v2/default-template.php (hero).
 *
 * Fonts, colours and sizes follow the Figma; the properties the theme sets on h2 / p / a are re-declared with
 * !important on this template's own classes.
 */

/* TEC's skeleton sets this by id (max 1048px + padding); the design is a centred column inside the full-width page. */
.single-tribe_events #tribe-events-pg-template {
    max-width: none;
    margin: 0;
    padding: 0;
}

.ewf-single {
    --ewf-navy: #002b3d;
    --ewf-sand: #eed9b2;
    --ewf-sand-hover: #e6cd9d;
    --ewf-font-body: 'canada-type-gibson', sans-serif;
    --ewf-font-heading: 'benton-modern-display', serif;

    padding: 103px 20px 132px;
    background: #fff;
    color: #000;
    font-family: var(--ewf-font-body);
    font-size: 18px;
    font-weight: 300;
    line-height: 22px;
    text-align: center;
}

.ewf-single *,
.ewf-single *::before,
.ewf-single *::after {
    box-sizing: border-box;
}

.ewf-single .screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    white-space: nowrap;
}

/* ---- Title and date -------------------------------------------------- */

.single-tribe_events .ewf-single .ewf-single__title {
    margin: 0;
    padding: 0;
    color: var(--ewf-navy) !important;
    font-family: var(--ewf-font-heading) !important;
    font-size: 38px;
    font-weight: 400 !important;
    letter-spacing: 2.66px !important;
    line-height: 48px !important;
    text-transform: none;
}

.single-tribe_events .ewf-single .ewf-single__date {
    margin: 19px 0 0;
    color: var(--ewf-navy);
    font-family: var(--ewf-font-body) !important;
    font-size: 14px;
    font-weight: 300 !important;
    letter-spacing: 1.54px !important;
    line-height: 22px !important;
}

/* ---- Content --------------------------------------------------------- */

.single-tribe_events .ewf-single .ewf-single__content {
    max-width: 699px;
    margin: 53px auto 0;
    text-align: left;
}

.single-tribe_events .ewf-single .ewf-single__content p {
    margin: 0 0 25px;
    color: #000;
    font-family: var(--ewf-font-body) !important;
    font-size: 18px;
    font-weight: 300 !important;
    letter-spacing: 0 !important;
    line-height: 22px !important;
    text-align: left !important;
}

.single-tribe_events .ewf-single .ewf-single__content > :last-child {
    margin-bottom: 0;
}

.single-tribe_events .ewf-single .ewf-single__content a {
    color: var(--ewf-navy);
    text-decoration: underline;
}

/* ---- Buttons --------------------------------------------------------- */

.ewf-single__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 15px;
    margin-top: 52px;
}

.single-tribe_events .ewf-single .ewf-single__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 43px;
    min-width: 138px;
    padding: 0 25px;
    background: var(--ewf-sand);
    color: var(--ewf-navy) !important;
    font-family: var(--ewf-font-body) !important;
    font-size: 14px;
    font-weight: 500 !important;
    letter-spacing: 1.54px !important;
    line-height: 22px !important;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: background-color 0.2s ease;
}

.single-tribe_events .ewf-single .ewf-single__btn:hover,
.single-tribe_events .ewf-single .ewf-single__btn:focus-visible {
    background: var(--ewf-sand-hover);
}

.ewf-single__btn:focus-visible {
    outline: 2px solid var(--ewf-navy);
    outline-offset: 3px;
}

/* ---- Small screens (no Figma frames below desktop) ------------------- */

@media (max-width: 767.98px) {
    .ewf-single {
        padding: 56px 20px 72px;
    }

    .single-tribe_events .ewf-single .ewf-single__title {
        font-size: 30px;
        letter-spacing: 1.5px !important;
        line-height: 38px !important;
    }

    .single-tribe_events .ewf-single .ewf-single__content {
        margin-top: 36px;
    }

    .single-tribe_events .ewf-single .ewf-single__content p {
        font-size: 16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .single-tribe_events .ewf-single .ewf-single__btn {
        transition: none;
    }
}