/**
 * WebCalendar Frontend Styles
 */

/* CSS Isolation & Reset */
.webcal-frontend-container,
.webcal-frontend-container *,
.webcal-frontend-container *::before,
.webcal-frontend-container *::after,
.webcal-upcoming-events-root,
.webcal-upcoming-events-root *,
.webcal-upcoming-events-root *::before,
.webcal-upcoming-events-root *::after {
    box-sizing: border-box;
}

.webcal-frontend-container,
.webcal-upcoming-events-root {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    line-height: 1.5;
    color: #1d2327;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin: 20px 0;
}

/* Reset headings and lists that themes often style aggressively */
.webcal-frontend-container h2,
.webcal-frontend-container h3,
.webcal-upcoming-events-root h2,
.webcal-upcoming-events-root h3 {
    margin: 0;
    padding: 0;
    border: none;
    text-transform: none;
    letter-spacing: normal;
}

.webcal-frontend-container ul,
.webcal-upcoming-events-root ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Standardized Buttons — scoped to navbar only so Toast UI internal
   buttons ("+N more", popup close, etc.) are not affected. */
.webcal-frontend-navbar button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    padding: 0 12px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    color: #2271b1;
    background: #f6f7f7;
    border: 1px solid #2271b1;
    border-radius: 3px;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.1s ease-in-out;
    text-decoration: none;
}

.webcal-frontend-navbar button:hover {
    background: #f0f0f1;
    border-color: #135e96;
    color: #135e96;
}

.webcal-frontend-navbar button:focus {
    color: #135e96;
    border-color: #2271b1;
    box-shadow: 0 0 0 1px #2271b1;
    outline: 2px solid transparent;
}

.webcal-frontend-navbar button:active {
    background: #edeff0;
    border-color: #135e96;
    transform: translateY(1px);
}

/* Calendar Container Height Safety */
.webcal-frontend-container [ref="containerRef"],
.webcal-frontend-container div[style*="height: 600px"] {
    height: 600px;
}

@media (max-width: 600px) {
    .webcal-frontend-container [ref="containerRef"],
    .webcal-frontend-container div[style*="height: 600px"] {
        height: 450px !important;
    }
}

.webcal-frontend-navbar {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    border-bottom: 1px solid #dcdcde;
    padding-bottom: 15px;
    margin-bottom: 20px;
}

.webcal-frontend-title {
    font-size: 1.25rem !important;
    font-weight: 600 !important;
    color: #1d2327 !important;
}

.webcal-view-selector {
    height: 32px;
    padding: 0 24px 0 8px;
    border: 1px solid #8c8f94;
    border-radius: 4px;
    background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23666' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right 8px center;
    background-size: 8px 10px;
    appearance: none;
    font-size: 13px;
    cursor: pointer;
}

.webcal-view-selector:focus {
    border-color: #2271b1;
    box-shadow: 0 0 0 1px #2271b1;
    outline: none;
}

/* Responsive adjustments */
@media (max-width: 600px) {
    .webcal-frontend-navbar {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center !important;
        gap: 6px;
    }

    .webcal-frontend-title {
        order: -1;
        width: 100%;
        margin-bottom: 4px !important;
    }

    .webcal-frontend-navbar button {
        height: 28px;
        padding: 0 8px;
        font-size: 12px;
    }

    .webcal-view-selector {
        width: auto;
        height: 28px;
        font-size: 12px;
        margin-top: 0;
    }
}

/* Upcoming Events */
.webcal-upcoming-events {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.webcal-upcoming-event {
    padding: 16px 0;
    border-bottom: 1px solid #dcdcde;
}

.webcal-upcoming-event:last-child {
    border-bottom: none;
}

.webcal-upcoming-event__header {
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 4px 8px;
    margin: 0 -8px;
    border-radius: 4px;
    transition: background-color 0.15s;
}

.webcal-upcoming-event__header:hover {
    background-color: #f0f0f1;
}

.webcal-upcoming-event__header-content {
    flex: 1;
    min-width: 0;
}

.webcal-upcoming-event__title {
    display: block;
    font-size: 1rem;
    font-weight: 600;
    color: #1d2327;
    margin: 0 0 4px 0 !important;
    line-height: 1.3;
}

.webcal-upcoming-event__chevron {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    margin-left: 8px;
    color: #646970;
    transition: transform 0.2s ease;
    display: block;
}

.webcal-upcoming-event__chevron--expanded {
    transform: rotate(90deg);
}

.webcal-upcoming-event__details {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.3s ease;
}

.webcal-upcoming-event__details--open {
    max-height: 1000px; /* Increased for longer descriptions */
}

.webcal-upcoming-event__details-inner {
    padding: 12px 0 4px 0;
}

.webcal-upcoming-event__featured-image {
    display: block;
    max-width: 60px;
    max-height: 60px;
    border-radius: 4px;
    border: 1px solid #dcdcde;
    object-fit: cover;
    margin-bottom: 8px;
}

.webcal-upcoming-event__attachments {
    margin-top: 12px;
    border-top: 1px solid #dcdcde;
    padding-top: 12px;
}

.webcal-upcoming-event__attachments-label {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #646970;
    margin-bottom: 8px;
}

.webcal-upcoming-event__attachment-thumb {
    max-width: 100%;
    width: auto;
    height: auto;
    max-height: 150px;
    border-radius: 4px;
    display: block;
    margin: 8px 0;
    border: 1px solid #dcdcde;
}

.webcal-upcoming-event__attachment-link {
    display: inline-block;
    font-size: 0.8125rem;
    color: #2271b1;
    text-decoration: none;
    margin: 4px 0;
    word-break: break-all;
}

.webcal-upcoming-event__attachment-link:hover {
    color: #135e96;
    text-decoration: underline;
}

.webcal-upcoming-event__date,
.webcal-upcoming-event__time,
.webcal-upcoming-event__location {
    display: inline-flex;
    align-items: center;
    font-size: 0.8125rem;
    color: #646970;
    margin-right: 16px;
    line-height: 1.4;
}

.webcal-upcoming-event__location::before {
    content: "\1F4CD";
    margin-right: 4px;
    font-style: normal;
}

p.webcal-upcoming-event__description {
    font-size: 0.875rem;
    color: #3c434a;
    margin: 8px 0 0 0 !important;
    line-height: 1.5;
    white-space: pre-wrap;
}

div.webcal-upcoming-event__description {
    font-size: 0.875rem;
    color: #3c434a;
    margin: 8px 0 0 0 !important;
    line-height: 1.5;
    white-space: normal;
}

.webcal-upcoming-event__map-link {
    margin: 6px 0;
    font-size: 0.8125rem;
}

.webcal-upcoming-event__map-link a {
    color: #0073aa;
    text-decoration: none;
}

.webcal-upcoming-event__map-link a:hover {
    color: #135e96;
    text-decoration: underline;
}

.webcal-upcoming-event__event-link {
    margin: 8px 0 0;
    padding-top: 8px;
    border-top: 1px solid #eee;
}

.webcal-upcoming-event__event-link a {
    color: #0073aa;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 600;
}

.webcal-upcoming-event__event-link a:hover {
    color: #135e96;
    text-decoration: underline;
}

.webcal-upcoming-events-loading,
.webcal-upcoming-events-empty {
    padding: 30px 0;
    color: #646970;
    font-style: italic;
    text-align: center;
}

/* Compact layout */
.webcal-upcoming-events--compact .webcal-upcoming-event {
    padding: 10px 0;
}

.webcal-upcoming-events--compact .webcal-upcoming-event__title {
    display: inline;
    margin-right: 12px !important;
    font-size: 0.9375rem;
}

.webcal-upcoming-events--compact .webcal-upcoming-event__description {
    display: none;
}

/* Responsive */
@media (max-width: 782px) {
    .webcal-frontend-navbar {
        flex-wrap: wrap;
        gap: 8px;
    }

    .webcal-frontend-title {
        order: -1;
        width: 100%;
        text-align: center;
        margin-bottom: 2px !important;
    }

    .webcal-view-selector {
        width: auto;
    }

    .webcal-upcoming-event__date,
    .webcal-upcoming-event__time,
    .webcal-upcoming-event__location {
        display: flex;
        margin-right: 0;
        margin-top: 4px;
    }
}

/* Calendar loading indicator — uses grid stacking (grid-area: 1/1)
   to overlay the calendar. No position: absolute/relative needed,
   which avoids creating positioned ancestors that break Toast UI
   popup placement on multi-calendar pages. */
.webcal-frontend-loading {
    z-index: 100;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    background: rgba(255, 255, 255, 0.7);
    color: #1d2327;
    font-size: 0.9375rem;
    font-weight: 500;
    backdrop-filter: blur(2px);
}

.webcal-frontend-loading__spinner {
    display: block;
    width: 32px;
    height: 32px;
    border: 3px solid #dcdcde;
    border-top-color: #2271b1;
    border-radius: 50%;
    animation: webcal-spin 0.8s linear infinite;
}

@keyframes webcal-spin {
    to { transform: rotate(360deg); }
}

/* Holiday Manager Admin Table */
.webcal-holiday-manager .wp-list-table th {
    font-weight: 600;
}

.webcal-holiday-manager .wp-list-table td {
    vertical-align: middle;
}

/* Toast UI Overrides & Custom Popup Styles */
.toastui-calendar-layout {
    background-color: #fff;
    border: 1px solid #dcdcde;
    border-radius: 4px;
}

/* Keep the "+N more" button in month view cells above the
   absolutely-positioned event overlay so users can click it.
   The events container (.toastui-calendar-weekday-events) is an
   absolutely-positioned sibling that paints on top of the grid by
   DOM order.  Elevating the button into its own stacking context
   with z-index lets it render above the overlay. */
.toastui-calendar-grid-cell-more-events {
    position: relative;
    z-index: 1;
}

/* Detail Popup Content */
.toastui-calendar-detail-container {
    padding: 16px !important;
}

.toastui-calendar-detail-container p {
    margin: 0 0 12px 0 !important;
    line-height: 1.5 !important;
    font-size: 14px !important;
    color: #3c434a !important;
}

.toastui-calendar-detail-container strong {
    display: block;
    margin-bottom: 8px;
    font-size: 12px;
    text-transform: uppercase;
    color: #646970;
}

.toastui-calendar-detail-container img {
    border: 1px solid #dcdcde;
    transition: transform 0.2s ease;
}

.toastui-calendar-detail-container img:hover {
    transform: scale(1.02);
}

/* Detail popup buttons: match plugin style */
.toastui-calendar-detail-container .toastui-calendar-icon {
    filter: sepia(100%) hue-rotate(190deg) saturate(500%); /* Match WP Blue */
}

/* Fixed height for calendar root to prevent layout shifts.
   IMPORTANT: Do NOT add position: relative — it creates a positioned
   ancestor that breaks Toast UI's document-absolute popup coordinates
   on multi-calendar pages. Use CSS Grid stacking for the loading
   overlay instead (see .webcal-frontend-calendar-wrapper). */
.webcalendar-frontend-root {
    min-height: 400px;
}

/* Grid stacking lets the loading overlay cover the calendar without
   needing position: relative on a parent element. Both children
   occupy grid cell 1/1 and overlap visually. */
.webcal-frontend-calendar-wrapper {
    display: grid;
}

.webcal-frontend-calendar-wrapper > * {
    grid-area: 1 / 1;
}

/* ========================================
   Category Legend (Layer Toggle)
   ======================================== */
.webcal-category-legend {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 16px;
    padding: 10px 0;
    margin-bottom: 10px;
    border-bottom: 1px solid #dcdcde;
}

.webcal-category-legend__item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    cursor: pointer;
    color: #1d2327;
    user-select: none;
}

.webcal-category-legend__item input[type="checkbox"] {
    margin: 0;
    width: 14px;
    height: 14px;
    cursor: pointer;
}

.webcal-category-dot {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex-shrink: 0;
}

.webcal-category-legend__actions {
    margin-left: auto;
    font-size: 12px;
    color: #646970;
    white-space: nowrap;
}

.webcal-category-legend__link {
    background: none;
    border: none;
    padding: 0;
    font-size: 12px;
    color: #2271b1;
    cursor: pointer;
    text-decoration: none;
    height: auto;
    line-height: inherit;
}

.webcal-category-legend__link:hover {
    color: #135e96;
    text-decoration: underline;
    background: none;
    border: none;
}

@media (max-width: 600px) {
    .webcal-category-legend {
        gap: 6px 12px;
    }

    .webcal-category-legend__actions {
        margin-left: 0;
        width: 100%;
        margin-top: 4px;
    }
}

/* ========================================
   Agenda / List View
   ======================================== */
.webcal-agenda {
    min-height: 200px;
}

.webcal-agenda__date-group {
    margin-bottom: 4px;
}

.webcal-agenda__date-header {
    position: sticky;
    top: 0;
    z-index: 10;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #1d2327;
    background: #f6f7f7;
    padding: 8px 12px;
    border-bottom: 1px solid #dcdcde;
    border-top: 1px solid #dcdcde;
}

.webcal-agenda__date-group:first-child .webcal-agenda__date-header {
    border-top: none;
}

.webcal-agenda__event {
    padding: 10px 12px;
    border-bottom: 1px solid #f0f0f1;
    cursor: pointer;
    transition: background-color 0.15s;
}

.webcal-agenda__event:hover {
    background-color: #f6f7f7;
}

.webcal-agenda__event:last-child {
    border-bottom: none;
}

.webcal-agenda__event-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.webcal-agenda__event-time {
    flex-shrink: 0;
    width: 80px;
    font-size: 0.8125rem;
    color: #646970;
}

.webcal-agenda__event-title {
    flex: 1;
    min-width: 0;
    font-size: 0.9375rem;
    font-weight: 500;
    color: #1d2327;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.webcal-agenda__event-location {
    flex-shrink: 0;
    font-size: 0.8125rem;
    color: #646970;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.webcal-agenda__event-location::before {
    content: "\1F4CD";
    margin-right: 4px;
}

.webcal-agenda__event-details {
    padding: 10px 0 4px 22px;
}

p.webcal-agenda__event-description {
    font-size: 0.875rem;
    color: #3c434a;
    line-height: 1.5;
    white-space: pre-wrap;
    margin: 0 0 8px 0;
}

div.webcal-agenda__event-description {
    font-size: 0.875rem;
    color: #3c434a;
    line-height: 1.5;
    white-space: normal;
    margin: 0 0 8px 0;
}

.webcal-agenda__event-image {
    display: block;
    max-width: 80px;
    max-height: 80px;
    border-radius: 4px;
    border: 1px solid #dcdcde;
    object-fit: cover;
    margin-bottom: 8px;
}

.webcal-agenda__empty {
    padding: 40px 0;
    color: #646970;
    font-style: italic;
    text-align: center;
    font-size: 0.9375rem;
}

@media (max-width: 600px) {
    .webcal-agenda__event-row {
        flex-wrap: wrap;
        gap: 4px 8px;
    }

    .webcal-agenda__event-time {
        width: auto;
    }

    .webcal-agenda__event-title {
        white-space: normal;
        flex-basis: 100%;
        order: -1;
    }

    .webcal-agenda__event-location {
        max-width: none;
    }
}

/* ========================================
   Single Event Page — Featured Image
   ======================================== */
.webcal-single-event__featured-image {
    margin-bottom: 24px;
}

.webcal-single-event__featured-img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 400px;
    object-fit: cover;
    border-radius: 6px;
    border: 1px solid #dcdcde;
}

/* ========================================
   Rich Text (HTML) Description Styles
   ======================================== */
.webcal-popup-html-desc p,
div.webcal-agenda__event-description p,
div.webcal-upcoming-event__description p {
    margin: 0 0 0.5em;
}

.webcal-popup-html-desc ul, .webcal-popup-html-desc ol,
div.webcal-agenda__event-description ul, div.webcal-agenda__event-description ol,
div.webcal-upcoming-event__description ul, div.webcal-upcoming-event__description ol {
    margin: 0.25em 0;
    padding-left: 1.5em;
    list-style: revert !important;
}

.webcal-popup-html-desc a,
div.webcal-agenda__event-description a,
div.webcal-upcoming-event__description a {
    color: #0073aa;
    text-decoration: underline;
}

.webcal-popup-html-desc blockquote,
div.webcal-agenda__event-description blockquote,
div.webcal-upcoming-event__description blockquote {
    border-left: 3px solid #dcdcde;
    margin: 0.5em 0;
    padding-left: 1em;
    color: #646970;
}

/* ========================================
   Event Detail Popup — scrollable for long descriptions
   ======================================== */
.webcalendar-frontend-root .toastui-calendar-popup-container {
  max-height: 60vh !important;
  overflow-y: auto !important;
}

.webcalendar-frontend-root .toastui-calendar-detail-container {
  color: #1d2327 !important;
}

.webcalendar-frontend-root .toastui-calendar-detail-container .toastui-calendar-content {
  color: #2c3338 !important;
}

.webcalendar-frontend-root .toastui-calendar-template-popupDetailDate,
.webcalendar-frontend-root .toastui-calendar-template-popupDetailLocation,
.webcalendar-frontend-root .toastui-calendar-template-popupDetailState,
.webcalendar-frontend-root .toastui-calendar-template-popupDetailAttendees {
  color: #2c3338 !important;
}

.webcalendar-frontend-root .toastui-calendar-template-popupDetailBody {
  max-height: 120px;
  overflow-y: auto;
  color: #2c3338 !important;
}

.webcalendar-frontend-root .toastui-calendar-template-popupDetailBody p,
.webcalendar-frontend-root .toastui-calendar-template-popupDetailBody span,
.webcalendar-frontend-root .toastui-calendar-template-popupDetailBody div,
.webcalendar-frontend-root .toastui-calendar-template-popupDetailBody li {
  color: #2c3338 !important;
}

/* Force dark popup text regardless of theme inheritance */
.webcalendar-frontend-root .toastui-calendar-detail-container * {
  color: #1d2327;
}

.webcalendar-frontend-root .toastui-calendar-detail-container a {
  color: #2271b1 !important;
}

.webcalendar-frontend-root .toastui-calendar-template-popupDetailBody::-webkit-scrollbar {
  width: 4px;
}

.webcalendar-frontend-root .toastui-calendar-template-popupDetailBody::-webkit-scrollbar-thumb {
  background: #c3c4c7;
  border-radius: 2px;
}

/* ========================================
   Mini Calendar Widget
   ======================================== */
.webcal-mini-calendar {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    font-size: 13px;
    line-height: 1.4;
    color: #1d2327;
    max-width: 280px;
}

.webcal-mini-calendar__nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.webcal-mini-calendar__month {
    font-weight: 600;
    font-size: 14px;
}

.webcal-mini-calendar__prev,
.webcal-mini-calendar__next {
    background: none;
    border: 1px solid #dcdcde;
    border-radius: 3px;
    width: 28px;
    height: 28px;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    color: #2271b1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.webcal-mini-calendar__prev:hover,
.webcal-mini-calendar__next:hover {
    background: #f0f0f1;
    border-color: #2271b1;
}

.webcal-mini-calendar__grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
    text-align: center;
}

.webcal-mini-calendar__header {
    font-weight: 600;
    font-size: 11px;
    color: #646970;
    padding: 4px 0;
    text-transform: uppercase;
}

.webcal-mini-calendar__day {
    padding: 4px 2px;
    border-radius: 3px;
    min-height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: #1d2327;
}

.webcal-mini-calendar__day--empty {
    visibility: hidden;
}

.webcal-mini-calendar__day--today {
    background: #f0f0f1;
    font-weight: 700;
}

.webcal-mini-calendar__day--has-events {
    font-weight: 700;
    color: #2271b1;
    position: relative;
}

.webcal-mini-calendar__day--has-events::after {
    content: "";
    position: absolute;
    bottom: 2px;
    left: 50%;
    transform: translateX(-50%);
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #2271b1;
}

a.webcal-mini-calendar__day--has-events:hover {
    background: #e7f3ff;
    color: #135e96;
    cursor: pointer;
}

a.webcal-mini-calendar__day--has-events:hover::after {
    background: #135e96;
}

/* ========================================
   Print Styles
   ======================================== */
@media print {
    /* Hide navbar controls — keep only the title */
    .webcal-frontend-navbar button,
    .webcal-frontend-navbar a.button,
    .webcal-frontend-navbar input,
    .webcal-frontend-navbar select { display: none !important; }

    .webcal-frontend-navbar {
        border-bottom: none !important;
        margin-bottom: 10px !important;
        padding-bottom: 0 !important;
    }

    .webcal-frontend-navbar h2.webcal-frontend-title {
        display: block !important;
        font-size: 18pt !important;
        text-align: center !important;
        width: 100% !important;
    }

    /* Category legend: hide checkboxes and action buttons, keep dots + names */
    .webcal-category-legend input[type="checkbox"],
    .webcal-category-legend__actions { display: none !important; }

    .webcal-category-legend {
        border-bottom: none !important;
        justify-content: center !important;
    }

    /* Calendar: full width, auto height, remove shadows */
    .webcal-frontend-calendar-wrapper,
    .webcal-frontend-calendar-wrapper > div { height: auto !important; }

    /* Toast UI: ensure grid lines print, remove backgrounds that waste ink */
    .toastui-calendar-layout { height: auto !important; overflow: visible !important; }
    .toastui-calendar-month { overflow: visible !important; }

    /* Hide popups, overlays, loading */
    .webcal-frontend-loading,
    .toastui-calendar-see-more-popup-slot,
    .toastui-calendar-event-detail-popup-slot,
    .toastui-calendar-event-form-popup-slot,
    .toastui-calendar-popup-overlay { display: none !important; }

    /* Agenda view: no hover effect */
    .webcal-agenda__event:hover { background: none !important; }

    /* Upcoming events: no hover effect */
    .webcal-upcoming-event__header:hover { background: none !important; }

    /* Featured images: constrain height in print */
    .webcal-single-event__featured-img { max-height: 250px !important; }
    .webcal-agenda__event-image { max-height: 60px !important; }
    .webcal-upcoming-event__featured-image { max-height: 50px !important; }

    /* General: force black text, white background, remove shadows */
    .webcal-frontend-container { color: #000 !important; }
    .webcal-frontend-container * { box-shadow: none !important; }
}