/**
 * The Events Calendar — bringing the plugin into the site's design system.
 *
 * TEC ships a complete visual system of its own and its stylesheets load after
 * the theme's, so on every calendar and event page it quietly wins: its
 * typeface for headings, its blue for links and buttons, its own greys for
 * dates. Several of its rules match the theme's at equal specificity, which is
 * why a number of declarations here are forced rather than merely more
 * specific — source order decides otherwise.
 *
 * Collected in one file because these had begun to scatter: whenever something
 * looks wrong on a calendar or event page, this is where to look.
 */

/* ============================================================
   TYPE AND COLOUR
   ============================================================ */

.tribe-common h1, .tribe-common h2, .tribe-common h3,
.tribe-common h4, .tribe-common h5, .tribe-common h6,
.tribe-events h1, .tribe-events h2, .tribe-events h3,
.tribe-events h4, .tribe-events h5, .tribe-events h6,
h1.tribe-events-single-event-title,
.tribe-events-single h1, .tribe-events-single h2 {
    font-family: var(--srpc-font-display);
    color: var(--srpc-navy);
}

.tribe-common, .tribe-events {
    font-family: var(--srpc-font-body);
}

/* TEC's own rule matches at equal specificity and loads later, so forcing is
   the only way this wins. */
.tribe-events-widget .tribe-events-widget-events-list .tribe-events-widget-events-list__header-title,
.elementor-widget-sidebar .tribe-events-widget-events-list__header-title {
    font-family: var(--srpc-font-display) !important;
    font-size: var(--srpc-text-xl) !important;
    font-weight: 700 !important;
    line-height: var(--srpc-leading-snug);
    letter-spacing: -0.015em;
    text-transform: none;
    color: var(--srpc-navy) !important;
    margin: 0 0 0.7rem;
}

/* TEC links default to a blue belonging to no part of this palette. */
.tribe-common a,
.elementor-widget-sidebar .tribe-common a {
    color: var(--srpc-orange-deep);
}

.tribe-common a:hover,
.tribe-common a:focus {
    color: var(--srpc-orange);
}

/* Event titles read as headings rather than actions, so they stay navy and
   leave the accent for things that actually do something. */
.elementor-widget-sidebar .tribe-common a.tribe-events-widget-events-list__event-title-link,
.tribe-common a.tribe-events-widget-events-list__event-title-link,
.tribe-common a.tribe-events-calendar-list__event-title-link {
    color: var(--srpc-navy);
    font-family: var(--srpc-font-display);
    font-weight: 600;
}

.elementor-widget-sidebar .tribe-common a.tribe-events-widget-events-list__event-title-link:hover,
.tribe-common a.tribe-events-widget-events-list__event-title-link:hover,
.tribe-common a.tribe-events-calendar-list__event-title-link:hover {
    color: var(--srpc-orange);
}

/* Dates and weekday labels arrived as two further undeclared inks. */
.tribe-common .tribe-events-calendar-list__month-separator-text,
.tribe-common .tribe-events-calendar-list__event-date-tag-daynum,
.tribe-common .tribe-events-widget-events-list__event-date-tag-daynum {
    color: var(--srpc-ink) !important;
    font-family: var(--srpc-font-display);
}

.tribe-common .tribe-events-calendar-list__event-date-tag-weekday,
.tribe-common .tribe-events-widget-events-list__event-date-tag-weekday {
    color: var(--srpc-steel) !important;
}

/* ============================================================
   SINGLE EVENT
   ============================================================ */

/* The schedule line is a flex row with no gap and the cost carries its margin
   on the right, so at narrow widths the price welded onto the end time:
   "9:00 am - 5:00 pm$50". */
.tribe-events-schedule {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.25rem 0.75rem;
}

.tribe-events-schedule .tribe-events-cost {
    margin: 0 !important;
    font-weight: 600;
    color: var(--srpc-orange-deep);
}

/* ============================================================
   CALENDAR LIST
   ============================================================ */

/* TEC hides event descriptions below its own breakpoint, which on this site
   means the bay-closure notes vanish on phones — "40, 60, and 100 yard bays
   will be closed for this event" showed on desktop and nowhere else. Members
   check the schedule on a phone; that is exactly who needs the warning. */
/* TEC hides these two ways at once — display:none AND visibility:hidden.
   Overriding only the first leaves the element reserving its full height and
   rendering nothing, which is worse than it being absent. */
.tribe-common .tribe-events-calendar-list__event-description,
.tribe-common .tribe-events-calendar-list__event-description p {
    display: block !important;
    visibility: visible !important;
}

.tribe-common .tribe-events-calendar-list__event-description {
    margin-top: 0.4rem;
    font-size: var(--srpc-text-sm);
    line-height: 1.5;
    color: var(--srpc-ink-soft);
}

/* The only blue button on the site: TEC's default #334AFF in its own
   typeface, sitting directly beneath the navy and orange header. */
.tribe-common .tribe-common-c-btn,
.tribe-common button.tribe-common-c-btn,
.tribe-common a.tribe-common-c-btn,
.tribe-events .tribe-common-c-btn,
.tribe-common .tribe-events-c-search__button {
    background-color: var(--srpc-orange) !important;
    border-color: var(--srpc-orange) !important;
    color: #fff !important;
    font-family: var(--srpc-font-display) !important;
    font-weight: 600 !important;
    border-radius: var(--srpc-radius) !important;
}

.tribe-common .tribe-common-c-btn:hover,
.tribe-common .tribe-events-c-search__button:hover {
    background-color: var(--srpc-orange-deep) !important;
    border-color: var(--srpc-orange-deep) !important;
}

/* The calendar is one of three navigation destinations but renders its only
   h1 screen-reader-only, so the page opened on a bare date range with no
   title. Restored, and styled like every other page heading. */
.tribe-events-header__content-title h1.tec-a11y-title-hidden,
.tribe-events-header__content-title h1.screen-reader-text {
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 0 0.6rem !important;
    overflow: visible !important;
    clip: auto !important;
    clip-path: none !important;
    white-space: normal !important;
    font-family: var(--srpc-font-display) !important;
    font-size: var(--srpc-text-2xl) !important;
    font-weight: 700 !important;
    letter-spacing: -0.018em;
    color: var(--srpc-navy) !important;
}
