/*
 * The Events Calendar (TEC) styling tweaks for Jugendring Düsseldorf Theme 2026.
 * Uses Arbeitsbereich variables where possible.
 */

/* Map Arbeitsbereich + The7 tokens to TEC CSS variables. */
:root {
    /* fonts */
    --tec-font-family-sans-serif: var(--the7-base-font-family, inherit);

    /* colors */
    --tec-color-accent-primary: var(--arbeitsbereich-primary, var(--the7-accent-color, #e30713));
    --tec-color-button-primary: var(--arbeitsbereich-primary, var(--the7-accent-color, #e30713));
    --tec-color-button-primary-hover: var(--arbeitsbereich-primary, var(--the7-accent-color, #e30713));
    --tec-color-link-primary: var(--arbeitsbereich-primary, var(--the7-accent-color, #e30713));
    --tec-color-link-accent: var(--arbeitsbereich-primary, var(--the7-accent-color, #e30713));

    --tec-color-text-primary: var(--the7-base-color, #141827);
    --tec-color-text-secondary: var(--the7-secondary-text-color, rgba(0, 0, 0, 0.6));
}

/* Ensure TEC components inherit The7 base font when variables are not used. */
.tribe-common,
.tribe-events {
    font-family: var(--the7-base-font-family, inherit);
    color: var(--the7-base-color, inherit);
}

/* Existing local tweaks */
.tribe-events .tribe-events-c-top-bar__nav-list,
.tribe-common--breakpoint-medium.tribe-events .tribe-events-c-view-selector--tabs .tribe-events-c-view-selector__list {
    list-style: none;
}

.tribe-common .tribe-common-h3 {
    color: #141827;
    font-family: Catamaran;
    font-weight: 700;
    font-size: 22px !important;
    line-height: 1.5;
}

.tribe-common .tribe-common-c-btn,
.tribe-common a.tribe-common-c-btn {
    color: #fff;
    font-family: Catamaran, sans-serif;
    font-size: 14px;
    line-height: 1.62;
    font-weight: 700;
    border: 0;
    cursor: pointer;
    display: inline-block;
    height: auto;
    padding: 0;
    text-decoration: none;
    width: auto;
    border-radius: 4px;
    text-align: center;
    transition: background-color .2s ease;
    background-color: var(--arbeitsbereich-primary, #e30713) !important;
    padding: 11px 20px;
    width: 100%;
}

.tribe-common h1,
.tribe-common h2,
.tribe-common h3,
.tribe-common h4,
.tribe-common h5,
.tribe-common h6 {
    font-family: var(--the7-h2-font-family) !important;
}