/* =====================================================================
   Calendar Online Display — Frontend Styles (Monthly Grid)
   ===================================================================== */

/* Font loaded dynamically via wp_add_inline_style in wp_enqueue_scripts */

/* ── Custom properties ──────────────────────────────────────────────── */
.dfco-calendar-wrap {
    /* ── Defaults (overridden by inline styles from settings) ── */
    --dfco-accent:        #4f46e5;
    --dfco-today-hl:      #4f46e5;
    --dfco-dot-color:     #4f46e5;
    --dfco-ev-border:     #4f46e5;
    --dfco-header-bg:     #4f46e5;
    --dfco-header-text:   #ffffff;
    --dfco-bg:            #ffffff;
    --dfco-surface:       #f8f8fc;
    /* font-family set directly via inline style on wrapper */
    --dfco-font-size:     15px;
    --dfco-radius:        16px;
    --dfco-radius-sm:     9px;
    --dfco-border-color:  #e6e6f0;
    --dfco-border:        #e6e6f0; /* alias for --dfco-border-color */
    --dfco-border-width:  1px;
    --dfco-shadow:        0 4px 24px rgba(0,0,0,.07), 0 1px 4px rgba(0,0,0,.04);
    --dfco-max-width:     780px;

    /* ── Derived tokens — overridden by PHP-computed values in inline style ── */
    --dfco-accent-light:  rgba(79,70,229,.10);
    --dfco-accent-mid:    rgba(79,70,229,.22);
    --dfco-today-bg:      rgba(79,70,229,.08);
    --dfco-today-border:  #4f46e5;
    --dfco-hover-bg:      rgba(79,70,229,.10);
    --dfco-hover-border:  rgba(79,70,229,.22);
    --dfco-text-primary:  #18182e;
    --dfco-text-secondary:#5c5c78;
    --dfco-text-muted:    #9898b0;
    /* --dfco-font-display removed — all elements now inherit the chosen font */

    /* ── Layout ────────────────────────────────────────────────────────── */
    box-sizing: border-box !important;
    /* Use an explicit pixel width matching the user's Max Width setting,
       capped at 100% so it never overflows on small screens.
       !important on both prevents Astra/Spectra/Starter Templates from
       overriding with width:100% or a wider container width. */
    width: var(--dfco-max-width) !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;

    font-size: var(--dfco-font-size);
    color: var(--dfco-text-primary);
    background: var(--dfco-bg);
    border-radius: var(--dfco-radius);
    box-shadow: var(--dfco-shadow);
    border: var(--dfco-border-width) solid var(--dfco-border-color);
    overflow: hidden;
    position: relative;
}

/* ── Box-sizing reset — ensure our layout isn't broken by theme resets ──
   Some themes apply box-sizing: content-box to certain elements, which
   can cause our grid columns and cells to overflow. Force border-box
   on everything inside our wrapper.
   ─────────────────────────────────────────────────────────────────────── */
.dfco-calendar-wrap *,
.dfco-calendar-wrap *::before,
.dfco-calendar-wrap *::after {
    box-sizing: border-box;
}

/* ── Button/interactive element reset ───────────────────────────────────
   The nav arrows (.dfco-nav-btn) are <div role="button"> elements — not
   <button> tags — so themes cannot apply button styles to them at all.

   For the remaining real <button> elements (subscribe toggle, close panel),
   we override only the properties themes like Astra + Spectra commonly force,
   without using "all: unset" which would wipe our own transitions and colors.
   ─────────────────────────────────────────────────────────────────────── */

/* Real button reset — only the properties themes override */
.dfco-calendar-wrap button {
    box-sizing: border-box !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

/* Subscribe button — prevent width:100% and min-height from Astra/Spectra */
.dfco-calendar-wrap .dfco-sub-btn {
    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    display: inline-flex !important;
    line-height: 1 !important;
}

/* Close button — prevent width:100% stretching */
.dfco-calendar-wrap .dfco-detail-close {
    width: 28px !important;
    height: 28px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Focus outlines for accessibility */
.dfco-calendar-wrap button:focus-visible,
.dfco-calendar-wrap [role="button"]:focus-visible {
    outline: 2px solid var(--dfco-accent);
    outline-offset: 2px;
}

/* ── Header ─────────────────────────────────────────────────────────── */
.dfco-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 20px 26px;
    background: var(--dfco-header-bg);
    color: var(--dfco-header-text);
}

.dfco-header-left {
    display: flex;
    align-items: center;
    gap: 10px;
}

.dfco-header-icon {
    width: 22px;
    height: 22px;
    opacity: .85;
    flex-shrink: 0;
}

.dfco-header-title {
    /* font-family inherited from wrapper inline style */
    font-size: 1.2rem;
    letter-spacing: -.01em;
    line-height: 1;
    font-style: italic;
}

/* ── Subscribe dropdown ─────────────────────────────────────────────── */
.dfco-subscribe-dropdown {
    position: relative;
}

.dfco-sub-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    /* font-family inherited from wrapper inline style */
    font-size: .78rem;
    font-weight: 500;
    padding: 7px 13px;
    border-radius: 20px;
    border: 1.5px solid rgba(255,255,255,.4);
    background: rgba(255,255,255,.15);
    color: #fff;
    cursor: pointer;
    backdrop-filter: blur(4px);
    transition: background .15s, border-color .15s;
    white-space: nowrap;
    line-height: 1;
}

.dfco-sub-btn:hover,
.dfco-sub-btn[aria-expanded="true"] {
    background: rgba(255,255,255,.28);
    border-color: rgba(255,255,255,.7);
}

.dfco-chevron {
    transition: transform .2s;
}

.dfco-sub-btn[aria-expanded="true"] .dfco-chevron {
    transform: rotate(180deg);
}

.dfco-subscribe-menu {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    background: #fff;
    border: 1px solid var(--dfco-border-color);
    border-radius: var(--dfco-radius-sm);
    box-shadow: 0 8px 28px rgba(0,0,0,.13);
    min-width: 210px;
    z-index: 9999;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-6px) scale(.97);
    transform-origin: top right;
    transition: opacity .18s, transform .18s;
}

.dfco-subscribe-menu.is-open {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0) scale(1);
}

.dfco-subscribe-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 16px;
    font-size: .83rem;
    color: var(--dfco-text-primary);
    text-decoration: none;
    transition: background .13s;
    border-bottom: 1px solid var(--dfco-border-color);
}

.dfco-subscribe-item:last-child { border-bottom: none; }

.dfco-subscribe-item:hover {
    background: var(--dfco-surface);
    color: var(--dfco-accent);
}

/* ── Month navigation bar ───────────────────────────────────────────── */
.dfco-month-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px 10px;
    background: var(--dfco-bg);
    border-bottom: 1px solid var(--dfco-border-color);
}

.dfco-nav-btn {
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--dfco-border-color);
    border-radius: 50%;
    background: var(--dfco-surface);
    cursor: pointer;
    color: var(--dfco-text-secondary);
    transition: background .15s, color .15s, border-color .15s, transform .12s;
    flex-shrink: 0;
}

.dfco-nav-btn svg { width: 16px; height: 16px; }

.dfco-nav-btn:hover {
    background: var(--dfco-header-bg);
    color: var(--dfco-header-text);
    border-color: var(--dfco-accent);
    transform: scale(1.06);
}

.dfco-month-label {
    /* font-family inherited from wrapper inline style */
    font-size: 1.15rem;
    font-style: italic;
    /* Typography tab's "Font Color" (--dfco-font-color). Deliberately NOT
       applied to .dfco-header-title — that element is controlled by the
       Header tab's own header_text_color / --dfco-header-text instead
       (user request: typography font color must not affect the header). */
    color: var(--dfco-font-color, var(--dfco-text-primary));
    letter-spacing: -.01em;
    text-align: center;
    min-width: 180px;
}

/* ── Day-of-week header row ─────────────────────────────────────────── */
.dfco-dow-row {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    background: var(--dfco-surface);
    border-bottom: 1px solid var(--dfco-border-color);
    padding: 6px 16px 5px;
}

.dfco-dow-row span {
    text-align: center;
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--dfco-text-muted);
}

/* ── Calendar grid ──────────────────────────────────────────────────── */
.dfco-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    padding: 10px 14px 14px;
    gap: 4px;
    background: var(--dfco-bg);
}

/* ── Day cell ───────────────────────────────────────────────────────── */
.dfco-day {
    position: relative;
    box-sizing: border-box;
    min-height: 62px;
    border-radius: var(--dfco-radius-sm);
    padding: 7px 6px 5px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    cursor: default;
    transition: background .15s;
    border: 1.5px solid transparent !important;
}

.dfco-day.dfco-other-month {
    opacity: .28;
    pointer-events: none;
}

.dfco-day.dfco-today {
    background: var(--dfco-today-bg) !important;
    border-color: var(--dfco-today-border) !important;
}

.dfco-day.dfco-has-events {
    cursor: pointer;
}

/* Hover and active only apply to current-month days */
.dfco-day.dfco-has-events:not(.dfco-other-month):hover {
    background: var(--dfco-hover-bg) !important;
    border-color: var(--dfco-hover-border) !important;
}

.dfco-day.dfco-active:not(.dfco-other-month) {
    background: var(--dfco-accent-light);
    border-color: var(--dfco-accent);
}

/* Day number — Typography tab's "Font Color" (--dfco-font-color). Same
   scoping note as .dfco-month-label above: this never touches
   .dfco-header-title or .dfco-dow-row. */
.dfco-day-num {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: .85rem;
    font-weight: 500;
    color: var(--dfco-font-color, var(--dfco-text-primary));
    line-height: 1;
    flex-shrink: 0;
}

/* Today's circle: fill stays --dfco-today-hl (unrelated to this feature).
   Text color is the separate "Today's Font Color" token
   (--dfco-today-font-color), falling back to white so a calendar rendered
   before this token existed (or before Agent FC's PHP change lands) still
   gets a legible number on the solid-accent fill.
   !important is required here, not decorative: .dfco-today .dfco-day-num
   (0,2,0) already outranks the plain .dfco-day-num rule (0,1,0) above on
   specificity alone, but !important is kept anyway to guarantee this wins
   over that base rule regardless of source-order/cascade changes elsewhere
   in the file (e.g. future utility overrides) — removing it would risk the
   today number silently inheriting the wrong color under those conditions. */
.dfco-today .dfco-day-num {
    background: var(--dfco-today-hl) !important;
    color: var(--dfco-today-font-color, #fff) !important;
    font-weight: 700;
}

/* Event dots row */
.dfco-dots {
    display: flex;
    gap: 3px;
    justify-content: center;
    flex-wrap: wrap;
    max-width: 44px;
}

.dfco-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--dfco-dot-color);
    flex-shrink: 0;
}

/* Show up to 3 dots, then a +N badge */
.dfco-dot-more {
    font-size: .58rem;
    font-weight: 700;
    color: var(--dfco-accent);
    line-height: 1;
    margin-top: 1px;
}

/* ── Event detail panel ─────────────────────────────────────────────── */
.dfco-detail-panel {
    border-top: 1px solid var(--dfco-border-color);
    background: var(--dfco-surface);
    padding: 0;
    position: relative;
    overflow: hidden;
    max-height: 0;
    transition: max-height .32s cubic-bezier(.4,0,.2,1), padding .32s;
}

.dfco-detail-panel:not([hidden]) {
    max-height: 600px;
    padding: 20px 24px 22px;
}

.dfco-detail-panel[hidden] {
    display: block !important; /* override browser hidden so transition works */
    max-height: 0;
    padding-top: 0;
    padding-bottom: 0;
}

.dfco-detail-close {
    position: absolute;
    top: 14px;
    right: 16px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: transparent;
    cursor: pointer;
    color: var(--dfco-text-muted);
    border-radius: 50%;
    transition: background .15s, color .15s;
    padding: 0;
}

.dfco-detail-close svg { width: 15px; height: 15px; }

.dfco-detail-close:hover {
    background: var(--dfco-border-color);
    color: var(--dfco-text-primary);
}

/* Date heading inside panel */
.dfco-detail-date {
    /* font-family inherited from wrapper inline style */
    font-size: 1.05rem;
    font-style: italic;
    color: var(--dfco-accent);
    margin: 0 0 14px;
    padding-right: 32px;
}

/* Individual event inside panel */
.dfco-detail-event {
    background: #fff;
    border: 1px solid var(--dfco-border-color);
    border-radius: var(--dfco-radius-sm);
    padding: 14px 16px;
    margin-bottom: 10px;
    position: relative;
    border-left: 3px solid var(--dfco-ev-border);
}

.dfco-detail-event:last-child { margin-bottom: 0; }

.dfco-detail-event-title {
    font-size: .95rem;
    font-weight: 600;
    color: var(--dfco-text-primary);
    margin: 0 0 7px;
    line-height: 1.3;
}

.dfco-detail-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 8px;
}

.dfco-detail-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: .77rem;
    color: var(--dfco-text-secondary);
}

.dfco-detail-meta-item svg {
    width: 12px;
    height: 12px;
    color: var(--dfco-accent);
    opacity: .8;
    flex-shrink: 0;
}

.dfco-detail-cat {
    display: inline-block;
    font-size: .67rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
    padding: 2px 7px;
    border-radius: 12px;
    background: var(--dfco-accent-light);
    color: var(--dfco-accent);
    border: 1px solid var(--dfco-accent-mid);
}

.dfco-detail-desc {
    font-size: .8rem;
    color: var(--dfco-text-secondary);
    line-height: 1.55;
    margin: 6px 0 8px;
}

/* Add-to-calendar buttons inside panel */
.dfco-add-btns {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    margin-top: 10px;
}

.dfco-add-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: .73rem;
    font-weight: 500;
    padding: 5px 11px;
    border-radius: 6px;
    border: 1px solid var(--dfco-border-color);
    background: var(--dfco-surface);
    color: var(--dfco-text-secondary);
    text-decoration: none;
    transition: border-color .15s, color .15s, background .15s;
    cursor: pointer;
    white-space: nowrap;
}

.dfco-add-btn:hover {
    border-color: var(--dfco-accent);
    color: var(--dfco-accent);
    background: var(--dfco-accent-light);
}

.dfco-add-btn svg { flex-shrink: 0; }

/* ── Notice ─────────────────────────────────────────────────────────── */
.dfco-notice {
    padding: 14px 20px;
    background: #fffbeb;
    border: 1px solid #fcd34d;
    border-radius: var(--dfco-radius-sm);
    font-size: .875rem;
    color: #92400e;
}

/* ── Slide-in animation for grid ────────────────────────────────────── */

/* Current-month days animate to full opacity */
@keyframes dfco-fade-in {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Other-month days animate to their dimmed opacity */
@keyframes dfco-fade-in-dim {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: .28; transform: translateY(0); }
}

.dfco-grid.is-animating .dfco-day:not(.dfco-other-month) {
    animation: dfco-fade-in .22s ease both;
}

.dfco-grid.is-animating .dfco-day.dfco-other-month {
    animation: dfco-fade-in-dim .22s ease both;
}

/* ── Responsive ─────────────────────────────────────────────────────── */
@media (max-width: 560px) {
    .dfco-header { padding: 16px 18px; flex-wrap: wrap; }
    .dfco-dow-row { padding: 5px 8px; }
    .dfco-dow-row span { font-size: .6rem; }
    .dfco-grid { padding: 6px 8px 10px; gap: 2px; }
    .dfco-day { min-height: 48px; padding: 5px 3px 4px; }
    .dfco-day-num { width: 24px; height: 24px; font-size: .78rem; }
    .dfco-dot { width: 5px; height: 5px; }
    .dfco-month-label { font-size: 1rem; min-width: 140px; }
    .dfco-detail-panel:not([hidden]) { padding: 16px 16px 18px; }
    .dfco-subscribe-menu { right: auto; left: 0; transform-origin: top left; }
}

/* =====================================================================
   Glass calendar style (v1.3.0)
   ---------------------------------------------------------------------
   Opt-in per-calendar look. Applied only when the wrapper carries
   .dfco-style-glass (see class-dfco-shortcode.php); the plain
   .dfco-calendar-wrap rules above are completely untouched, so a
   calendar left on the default "solid" style renders byte-identical to
   before this feature existed.

   --dfco-glass-bg / --dfco-glass-surface are rgba() tokens derived from
   the user's own bg_color / surface_color (see build_inline_styles() —
   hex_to_rgba() reused, not re-implemented) at ~55-60% opacity — never a
   hardcoded white, so the user's hue still shows through the frost.

   --dfco-glass-fallback-bg / --dfco-glass-fallback-surface are the same
   colors at ~92% opacity: the "no blur support" / "reduced transparency"
   path. Still visibly tinted glass, just without the blur, and always
   opaque enough to keep text readable.
   ===================================================================== */

.dfco-calendar-wrap.dfco-style-glass {
    background: var(--dfco-glass-fallback-bg);
    border-color: rgba(255,255,255,.35);
    border-top-color: rgba(255,255,255,.55);
    border-left-color: rgba(255,255,255,.55);
    /* Fallback tier keeps the same show_shadow-aware token as the
       backdrop-filter tier below, just without the blur. */
    box-shadow: var(--dfco-glass-shadow);
}

.dfco-calendar-wrap.dfco-style-glass .dfco-month-nav,
.dfco-calendar-wrap.dfco-style-glass .dfco-grid {
    background: transparent;
}

/* Header stays a tinted band, never fully transparent: header text defaults
   to white-on-indigo, and a see-through header would put that white text
   directly on the page background. --dfco-glass-header-fallback is the
   opaque tier, used here and duplicated as the !important fallback below. */
.dfco-calendar-wrap.dfco-style-glass .dfco-header {
    background: var(--dfco-glass-header-fallback);
}

.dfco-calendar-wrap.dfco-style-glass .dfco-dow-row,
.dfco-calendar-wrap.dfco-style-glass .dfco-nav-btn,
.dfco-calendar-wrap.dfco-style-glass .dfco-detail-panel,
.dfco-calendar-wrap.dfco-style-glass .dfco-subscribe-menu,
.dfco-calendar-wrap.dfco-style-glass .dfco-detail-event,
.dfco-calendar-wrap.dfco-style-glass .dfco-add-btn {
    background: var(--dfco-glass-fallback-surface);
}

/* Today/hover cells already carry their own accent-tinted tokens
   (--dfco-today-bg, --dfco-hover-bg) at low opacity from
   build_inline_styles(), so they already read as glass-on-glass with no
   overrides needed here. */

/* Dot-more "+N" chip reads on the frosted surface without its own bg,
   but give it a touch more contrast so it never disappears into blur. */
.dfco-calendar-wrap.dfco-style-glass .dfco-dot-more {
    text-shadow: 0 1px 1px rgba(255,255,255,.4);
}

/* ── Backdrop-filter tier — browsers that support it get the real frost ──
   Non-supporting browsers (and prefers-reduced-transparency, further
   below) simply keep the more-opaque fallback surfaces set above, which
   already look like a deliberate solid-glass hybrid rather than a
   half-finished effect. */
@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
    @media not (prefers-reduced-transparency: reduce) {
        .dfco-calendar-wrap.dfco-style-glass {
            background: var(--dfco-glass-bg);
            backdrop-filter: blur(18px) saturate(1.4);
            -webkit-backdrop-filter: blur(18px) saturate(1.4);
            box-shadow: var(--dfco-glass-shadow);
        }

        .dfco-calendar-wrap.dfco-style-glass .dfco-header {
            background: var(--dfco-glass-header);
            backdrop-filter: blur(10px) saturate(1.4);
            -webkit-backdrop-filter: blur(10px) saturate(1.4);
        }

        .dfco-calendar-wrap.dfco-style-glass .dfco-dow-row,
        .dfco-calendar-wrap.dfco-style-glass .dfco-nav-btn,
        .dfco-calendar-wrap.dfco-style-glass .dfco-detail-panel,
        .dfco-calendar-wrap.dfco-style-glass .dfco-subscribe-menu,
        .dfco-calendar-wrap.dfco-style-glass .dfco-detail-event,
        .dfco-calendar-wrap.dfco-style-glass .dfco-add-btn {
            background: var(--dfco-glass-surface);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
        }

        .dfco-calendar-wrap.dfco-style-glass .dfco-subscribe-menu {
            border-color: rgba(255,255,255,.4);
        }
    }
}

/* ── Reduced transparency — always the opaque fallback, even if the
   browser supports backdrop-filter. Duplicates the base selector so it
   wins regardless of the @supports block's specificity/order. ────────── */
@media (prefers-reduced-transparency: reduce) {
    .dfco-calendar-wrap.dfco-style-glass {
        background: var(--dfco-glass-fallback-bg) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    .dfco-calendar-wrap.dfco-style-glass .dfco-header {
        background: var(--dfco-glass-header-fallback) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    .dfco-calendar-wrap.dfco-style-glass .dfco-dow-row,
    .dfco-calendar-wrap.dfco-style-glass .dfco-nav-btn,
    .dfco-calendar-wrap.dfco-style-glass .dfco-detail-panel,
    .dfco-calendar-wrap.dfco-style-glass .dfco-subscribe-menu,
    .dfco-calendar-wrap.dfco-style-glass .dfco-detail-event,
    .dfco-calendar-wrap.dfco-style-glass .dfco-add-btn {
        background: var(--dfco-glass-fallback-surface) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
}

/* =====================================================================
   Gradient calendar style
   ---------------------------------------------------------------------
   Opt-in per-calendar look. Applied only when the wrapper carries
   .dfco-style-gradient (see class-dfco-shortcode.php); the plain
   .dfco-calendar-wrap rules above, and the glass rules above this block,
   are completely untouched, so solid and glass both render byte-identical
   to before this feature existed.

   Header band ONLY — the body, day grid and detail panel stay exactly as
   they are in solid. --dfco-gradient-header is a single pre-combined
   linear-gradient() value (135deg, top-left to bottom-right) built from
   two explicit user colours in gradient_stops() in class-dfco-shortcode.php:
   stop 1 is header_bg_color, stop 2 is the calendar's gradient_end_color
   ("Transition to color" on the Shape & Layout tab). Both are rendered
   verbatim — no automatic darkening or contrast adjustment is applied.
   ===================================================================== */

.dfco-calendar-wrap.dfco-style-gradient .dfco-header {
    background: var(--dfco-gradient-header);
}

/* =====================================================================
   Block editor preview — non-interactive affordances (v1.7.3)
   ---------------------------------------------------------------------
   As of v1.7.3 this stylesheet also loads inside the block editor's
   iframed canvas, so the calendar preview finally looks correct there.
   But the calendar's own JS still wires up its interactive handlers
   (nav clicks, subscribe toggle, day-cell clicks) in that context, so
   without this section the preview invites clicks that never reach
   Gutenberg — meaning the block never gets selected and the user can't
   get its toolbar to move/delete it.

   Gutenberg wraps every block in an element carrying a `data-block`
   attribute, and canvas content sits inside `.editor-styles-wrapper` /
   `.block-editor-block-list__layout`. Rules below are scoped behind one
   of those editor-only ancestors, so a front-end page — which has none
   of them — never matches anything here.

   These rules change the CURSOR only — deliberately NOT pointer-events.
   An earlier attempt set pointer-events:none on the day cells, which was
   wrong: the cells fill the whole grid (repeat(7, 1fr)), so that made the
   entire calendar area click-transparent and the click passed straight
   through instead of landing on the block. Gutenberg selects a block when
   a click ARRIVES at it, so the elements must stay hit-testable; the
   JavaScript side (assets/js/frontend.js) is what declines to act on the
   click in the editor, leaving it free to bubble up to Gutenberg.

   Everything here only changes cursor/pointer behavior — no color,
   opacity, spacing, border, shadow or gradient properties are touched,
   so the preview still looks exactly like the real thing.
   ===================================================================== */

[data-block] .dfco-calendar-wrap .dfco-nav-btn,
.editor-styles-wrapper .dfco-calendar-wrap .dfco-nav-btn,
.block-editor-block-list__layout .dfco-calendar-wrap .dfco-nav-btn {
    cursor: default;
}

[data-block] .dfco-calendar-wrap .dfco-sub-btn,
.editor-styles-wrapper .dfco-calendar-wrap .dfco-sub-btn,
.block-editor-block-list__layout .dfco-calendar-wrap .dfco-sub-btn {
    cursor: default;
}

[data-block] .dfco-calendar-wrap .dfco-subscribe-menu,
.editor-styles-wrapper .dfco-calendar-wrap .dfco-subscribe-menu,
.block-editor-block-list__layout .dfco-calendar-wrap .dfco-subscribe-menu,
[data-block] .dfco-calendar-wrap .dfco-subscribe-item,
.editor-styles-wrapper .dfco-calendar-wrap .dfco-subscribe-item,
.block-editor-block-list__layout .dfco-calendar-wrap .dfco-subscribe-item {
    cursor: default;
}

[data-block] .dfco-calendar-wrap .dfco-day,
.editor-styles-wrapper .dfco-calendar-wrap .dfco-day,
.block-editor-block-list__layout .dfco-calendar-wrap .dfco-day {
    cursor: default;
}

/* Suppress the hover/active affordances that signal interactivity on
   current-month days with events — same specificity family as the
   frontend rule at line 336 above, just editor-scoped and without any
   background/border-color change (there is nothing to hover to). */
[data-block] .dfco-calendar-wrap .dfco-day.dfco-has-events:not(.dfco-other-month):hover,
.editor-styles-wrapper .dfco-calendar-wrap .dfco-day.dfco-has-events:not(.dfco-other-month):hover,
.block-editor-block-list__layout .dfco-calendar-wrap .dfco-day.dfco-has-events:not(.dfco-other-month):hover {
    cursor: default;
}