/**
 * Events-list block — list/grid container + pagination.
 * Card visuals live in event-card.css.
 * Registered as `lrob-calendar-block-events-list` (deps: lrob-calendar-event-card).
 */

.lrob-cal-events-list-wrapper {
    position: relative;
    transition: opacity 0.15s ease;
}

/* Subtle fade during AJAX page swap */
.lrob-cal-events-list-wrapper.lrob-cal-loading {
    opacity: 0.55;
    pointer-events: none;
}

.lrob-events-list {
    display: flex;
    flex-direction: column;
}

/* List + Full templates: rows are line-separated, no gap. */
.lrob-template-list,
.lrob-template-full {
    border-top: 1px solid var(--lrob-cal-border);
    /* Border-top + the bottom border on each event card = a clean ruled list.
       The wrapper border-top fills the leading edge so the first row has a
       rule above it. */
}

/* Grid template: keep the proper card-grid gap. */
.lrob-template-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--lrob-cal-space-4);
}

/* Minimal template list spacing is tighter than list/full */
.lrob-template-minimal {
    gap: var(--lrob-cal-space-1);
}

/* ─── Pagination ─────────────────────────────────────────────────────────── */

.lrob-cal-events-pagination {
    margin: var(--lrob-cal-space-5) 0 0;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--lrob-cal-space-2);
}

/* Arrows + "Page X / Y" — ghost style. No filled circle background, no
   heavy border. Hover gets the subtle surface-hover tint. */
.lrob-cal-page-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1px solid transparent;
    border-radius: var(--lrob-cal-radius-md);
    background: transparent;
    color: var(--lrob-cal-text-muted);
    text-decoration: none;
    font-size: 1.2em;
    line-height: 1;
    transition: background-color var(--lrob-cal-duration) var(--lrob-cal-ease),
                color var(--lrob-cal-duration) var(--lrob-cal-ease);
}

.lrob-cal-page-arrow:hover {
    background: var(--lrob-cal-surface-hover);
    color: var(--lrob-cal-text);
}

.lrob-cal-page-arrow--disabled {
    opacity: 0.35;
    pointer-events: none;
}

.lrob-cal-page-indicator {
    font-size: 0.9em;
    color: var(--lrob-cal-text-muted);
    min-width: 80px;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

/* Numbered style — wraps paginate_links() output. Same ghost feel. */
.lrob-cal-events-pagination--numbered {
    flex-wrap: wrap;
    gap: var(--lrob-cal-space-1);
}

.lrob-cal-events-pagination--numbered .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 var(--lrob-cal-space-3);
    border: 1px solid transparent;
    border-radius: var(--lrob-cal-radius-md);
    background: transparent;
    color: var(--lrob-cal-text-muted);
    text-decoration: none;
    font-size: 0.92em;
    line-height: 1;
    transition: background-color var(--lrob-cal-duration) var(--lrob-cal-ease),
                color var(--lrob-cal-duration) var(--lrob-cal-ease);
}

.lrob-cal-events-pagination--numbered a.page-numbers:hover {
    background: var(--lrob-cal-surface-hover);
    color: var(--lrob-cal-text);
}

.lrob-cal-events-pagination--numbered .page-numbers.current {
    background: var(--lrob-cal-primary);
    border-color: var(--lrob-cal-primary);
    color: var(--lrob-cal-primary-fg);
    font-weight: var(--lrob-cal-font-weight-medium);
}

.lrob-cal-events-pagination--numbered .page-numbers.dots {
    border-color: transparent;
    background: transparent;
}