/* Nostr Calendar — Default Styles */

/* Card Grid */

.nostr-calendar-cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1.5rem;
    margin: 1.5rem 0;
}

.nostr-calendar-card {
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    background: #fff;
    overflow: hidden;
    transition: box-shadow 0.2s ease;
}

.nostr-calendar-card:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.nostr-calendar-card__image img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    display: block;
}

.nostr-calendar-card__body {
    padding: 1.25rem;
}

.nostr-calendar-card__date {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    margin-bottom: 0.75rem;
    padding: 0.5rem 0.75rem;
    background: #f0f4ff;
    border-left: 3px solid #2271b1;
    border-radius: 0 4px 4px 0;
}

.nostr-calendar-card__date-text {
    font-size: 1rem;
    font-weight: 600;
    color: #1a1a1a;
}

.nostr-calendar-card__time {
    font-size: 0.85rem;
    color: #555;
}

.nostr-calendar-card__title {
    font-size: 1.1rem;
    margin: 0 0 0.5rem;
    line-height: 1.3;
}

.nostr-calendar-card__summary {
    font-size: 0.9rem;
    color: #555;
    margin: 0 0 0.75rem;
    line-height: 1.5;
}

.nostr-calendar-card__location {
    font-size: 0.85rem;
    color: #666;
    margin-bottom: 0.75rem;
}

.nostr-calendar-card__location::before {
    content: "\1F4CD ";
}

.nostr-calendar-card__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.nostr-calendar-tag {
    display: inline-block;
    padding: 0.2rem 0.6rem;
    border-radius: 3px;
    font-size: 0.8rem;
    background: #f0f0f0;
    color: #444;
}

/* List Style */

.nostr-calendar-list {
    margin: 1.5rem 0;
}

.nostr-calendar-list__item {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.4rem 1rem;
    padding: 0.6rem 0;
    border-bottom: 1px solid #f0f0f0;
}

.nostr-calendar-list__item:last-child {
    border-bottom: none;
}

.nostr-calendar-list__date {
    flex-shrink: 0;
    width: 7rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: #2271b1;
}

.nostr-calendar-list__title {
    flex: 1 1 12rem;
    min-width: 0;
    font-size: 0.95rem;
    color: #1a1a1a;
}

.nostr-calendar-list__location {
    flex: 0 1 auto;
    max-width: 100%;
    font-size: 0.85rem;
    color: #666;
}

/* Empty state */

.nostr-calendar-empty {
    color: #888;
    font-style: italic;
    margin: 1.5rem 0;
}

/* Responsive */

@media (max-width: 600px) {
    .nostr-calendar-cards {
        grid-template-columns: 1fr;
    }

    .nostr-calendar-list__item {
        flex-wrap: wrap;
        gap: 0.25rem;
    }

    .nostr-calendar-list__date {
        width: auto;
    }

    .nostr-calendar-list__location {
        width: 100%;
    }
}

/* ---- month grid ---- */
.nostr-calendar-month-wrap[aria-busy="true"] .nostr-calendar-month__grid { opacity: 0.5; transition: opacity 0.15s ease; }
.nostr-calendar-month-wrap[aria-busy="true"] .nostr-calendar-month__nav-link { pointer-events: none; opacity: 0.6; }
.nostr-calendar-month__nav { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; }
.nostr-calendar-month__nav-link { padding: 0.25rem 0.6rem; border: 1px solid #ccc; border-radius: 4px; text-decoration: none; line-height: 1.4; }
.nostr-calendar-month__nav-link--today { font-weight: 600; }
.nostr-calendar-month__title { margin: 0 0 0 0.75rem; font-size: 1.25rem; }
.nostr-calendar-month__nav .wp-nostr-hint { margin-left: auto; margin-top: 0; margin-bottom: 0; }
.nostr-calendar-month__count { font-weight: 400; opacity: 0.6; font-size: 0.9em; margin-left: 0.4rem; }
.nostr-calendar-month__grid { border-top: 1px solid #ddd; border-left: 1px solid #ddd; }
.nostr-calendar-month__weekdays, .nostr-calendar-month__week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.nostr-calendar-month__week { position: relative; }
.nostr-calendar-month__weekday { padding: 0.35rem 0.5rem; font-size: 0.8rem; font-weight: 600; text-transform: uppercase; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; background: #f6f6f6; }
.nostr-calendar-month__day { min-height: 6rem; padding: 0.35rem 0.4rem; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; display: flex; flex-direction: column; gap: 0.2rem; }
.nostr-calendar-month__day--outside { background: #f2f2f2; color: #999; }
.nostr-calendar-month__day--past .nostr-calendar-month__date { opacity: 0.5; }
.nostr-calendar-month__day--today { outline: 2px solid #2a5d5d; outline-offset: -2px; }
.nostr-calendar-month__date { display: block; height: 1.25rem; line-height: 1.25rem; font-weight: 600; font-size: 0.9rem; }
.nostr-calendar-month__event { display: block; font-size: 0.8rem; line-height: 1.25; padding: 0.15rem 0.3rem; border-radius: 3px; background: #e8f1f1; color: inherit; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nostr-calendar-month__event:hover { background: #d3e5e5; }
.nostr-calendar-month__event-time { font-weight: 600; margin-right: 0.25rem; }
.nostr-calendar-month__more { font-size: 0.75rem; opacity: 0.7; }

/* multi-day events: one continuous bar per week row, floating above the cell
   borders in an overlay grid; each cell reserves the lane height below its
   date number so single-day entries start underneath the bars. */
.nostr-calendar-month__lane-space { flex: none; height: calc(var(--nc-lanes, 0) * 1.45rem); }
.nostr-calendar-month__bars { position: absolute; left: 0; right: 0; top: calc(0.35rem + 1.25rem + 0.2rem); display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); grid-auto-rows: 1.45rem; align-items: start; pointer-events: none; }
.nostr-calendar-month__bar { pointer-events: auto; display: flex; align-items: center; height: 1.25rem; margin: 0 3px; padding: 0 0.4rem; font-size: 0.8rem; line-height: 1; border-radius: 3px; background: #2a5d5d; color: #fff; text-decoration: none; overflow: hidden; white-space: nowrap; box-shadow: 0 1px 2px rgba(0,0,0,.15); }
.nostr-calendar-month__bar:hover, .nostr-calendar-month__bar:focus { background: #1f4747; color: #fff; }
.nostr-calendar-month__bar--clipped-left { margin-left: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; }
.nostr-calendar-month__bar--clipped-right { margin-right: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.nostr-calendar-month__bar-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; font-weight: 500; }
.nostr-calendar-month__bar-cap { flex: none; opacity: 0.7; margin-right: 0.25rem; }
.nostr-calendar-month__bar-cap--right { margin-right: 0; margin-left: auto; padding-left: 0.25rem; }
.nostr-calendar-month__event--span { display: none; background: #2a5d5d; color: #fff; }

@media (max-width: 600px) {
    .nostr-calendar-month__grid { border-left: 0; }
    .nostr-calendar-month__week { grid-template-columns: 1fr; }
    .nostr-calendar-month__weekdays, .nostr-calendar-month__day--outside, .nostr-calendar-month__day--empty { display: none; }
    .nostr-calendar-month__bars, .nostr-calendar-month__lane-space { display: none; }
    .nostr-calendar-month__event--span { display: block; }
    .nostr-calendar-month__day { min-height: 0; border-right: 0; }
    .nostr-calendar-month__date::before { content: attr(data-weekday) " "; font-weight: 400; }
}

/* ---- event detail ---- */
.nostr-calendar-event { max-width: 48rem; margin: 0 auto; padding: 1rem; }
.nostr-calendar-event__image img { width: 100%; height: auto; border-radius: 6px; }
.nostr-calendar-event__facts { display: grid; gap: 0.5rem; margin: 1rem 0; padding: 1rem; background: #f6f6f6; border-radius: 6px; }
.nostr-calendar-event__fact { display: flex; gap: 0.75rem; }
.nostr-calendar-event__fact-label { min-width: 4rem; font-weight: 600; }
.nostr-calendar-event__summary { font-size: 1.1rem; }
.nostr-calendar-event__links ul { padding-left: 1.25rem; }
.nostr-calendar-event__author { display: flex; gap: 1rem; align-items: center; margin-top: 2rem; padding-top: 1rem; border-top: 1px solid #ddd; }
.nostr-calendar-event__avatar { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; }
.nostr-calendar-event__back { margin-top: 2rem; }
.nostr-calendar-error { padding: 1rem; background: #fdecea; color: #7a1f1f; border-radius: 6px; }

/* ---- source hint ---- */
.wp-nostr-hint { position: relative; font-size: .8rem; margin: .5rem 0; }
.wp-nostr-hint summary { cursor: pointer; display: inline-block; padding: .15rem .6rem; border: 1px solid #ccc; border-radius: 999px; }
.wp-nostr-hint[open] dl { position: absolute; z-index: 20; background: #fff; border: 1px solid #ddd; border-radius: 6px; padding: .75rem 1rem; min-width: 18rem; box-shadow: 0 4px 16px rgba(0,0,0,.12); }
.wp-nostr-hint dt { font-weight: 600; margin-top: .4rem }
.wp-nostr-hint dd { margin: 0; word-break: break-all }
.wp-nostr-hint[open] dl { max-width: calc(100vw - 2rem); }
.wp-nostr-hint dt, .wp-nostr-hint dd { border: 0; background: none; padding: 0; text-transform: none; }
.wp-nostr-hint dt::before, .wp-nostr-hint dt::after { content: none; }
.nostr-calendar-month__nav .wp-nostr-hint[open] dl { right: 0; left: auto; }
