/* Matches the existing Golfforum calendar rows; the page hero stays in the site theme. */
.gfl-calendar {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    /* Elementor controls the section spacing; the shortcode adds none of its own. */
    padding: 0;
    background: transparent;
    color: var(--e-global-color-text, #27313d);
    font-family: var(--e-global-typography-text-font-family, "Inter"), Arial, sans-serif;
    font-size: 16px;
}
.gfl-calendar *, .gfl-calendar *::before, .gfl-calendar *::after { box-sizing: border-box; }
.gfl-month-title {
    margin: 24px 0 16px 10px;
    color: var(--e-global-color-text, #27313d);
    font-family: var(--e-global-typography-primary-font-family, "Prompt"), Arial, sans-serif;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.3;
}
.gfl-month-title:first-child { margin-top: 24px; }
.gfl-month-events { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.gfl-event {
    display: grid;
    grid-template-columns: 110px 80px minmax(0, 1fr) 290px;
    align-items: center;
    min-width: 0;
    min-height: 80px;
    padding: 0 10px;
    background: var(--e-global-color-secondary, #fff);
    color: var(--e-global-color-text, #27313d);
}
.gfl-event-date { font-weight: 400; white-space: nowrap; }
.gfl-event-visual { display: flex; align-items: center; justify-content: center; width: 80px; height: 80px; }
.gfl-event-image { display: block; width: 70px; height: 80px; max-width: 100%; object-fit: contain; }
.gfl-event-name { min-width: 0; padding-left: 20px; overflow-wrap: anywhere; line-height: 1.35; }
.gfl-event-type { display: block; margin-bottom: 2px; color: var(--e-global-color-text, #27313d); font-size: 12px; font-weight: 500; line-height: 1.2; }
.gfl-event-title { display: block; color: var(--e-global-color-text, #27313d); font-size: 16px; font-weight: 700; }
.gfl-event-action { display: flex; justify-content: center; min-width: 0; }
.gfl-calendar .gfl-event-action a {
    display: inline-block;
    min-width: 166px;
    padding: 15px 30px;
    border: 1px solid var(--e-global-color-text, #27313d);
    border-radius: 0;
    background: transparent;
    color: var(--e-global-color-text, #27313d);
    font: 500 16px/1.1 "Inter", Arial, sans-serif;
    text-align: center;
    text-decoration: none;
}
.gfl-calendar .gfl-event-action a:hover, .gfl-calendar .gfl-event-action a:focus-visible { background: var(--e-global-color-text, #27313d); color: var(--e-global-color-secondary, #fff); }
@media (max-width: 1024px) {
    /* Keep the calendar inside the width Elementor gives its widget. */
    .gfl-calendar {
        width: 100%;
        max-width: 100%;
        margin: 0;
    }
    .gfl-month-title { margin-left: 10px; }
    .gfl-month-title:first-child { margin-top: 24px; }
    .gfl-event {
        grid-template-columns: 135px minmax(0, 1fr);
        grid-template-areas: "date date" "visual name" "action action";
        gap: 10px 0;
        padding: 20px;
    }
    .gfl-event-date { grid-area: date; }
    .gfl-event-visual { grid-area: visual; margin-left: 15px; }
    .gfl-event-name { grid-area: name; padding-left: 0; }
    .gfl-event-action { grid-area: action; display: block; }
    .gfl-calendar .gfl-event-action a { display: block; width: 100%; }
}
@media (max-width: 380px) {
    .gfl-event { grid-template-columns: 105px minmax(0, 1fr); }
    .gfl-event-visual { margin-left: 10px; }
}