/* Condensed 3-month retreat calendar — see assets/js/retreat-calendar.js */
.rc { max-width: 1040px; margin: 0 auto; text-align: left; }
.rc-status { text-align: center; font-size: 0.9rem; opacity: 0.6; }

.rc-viewport { position: relative; display: flex; align-items: center; gap: 0.5rem; }
.rc-track {
    flex: 1; display: flex; column-gap: 1.25rem; overflow-x: auto;
    scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.rc-track::-webkit-scrollbar { display: none; }

.rc-nav {
    flex: 0 0 auto; width: 2rem; height: 2rem; padding: 0; border-radius: 50%;
    border: 1px solid rgba(0,0,0,0.15); background: #fff; color: #333;
    font-size: 1.2rem; line-height: 1; cursor: pointer; box-shadow: none;
    display: flex; align-items: center; justify-content: center;
}
.rc-nav:disabled { opacity: 0.25; cursor: default; }

.rc-month {
    position: relative; flex: 0 0 calc((100% - 2.5rem) / 3); scroll-snap-align: start;
    background: #f7f4f0; border-radius: 8px; padding: 0.9rem 0.8rem 0.8rem;
}
.rc-month-title { text-align: center; font-size: 0.85rem; font-weight: 600; letter-spacing: 0.04em; margin-bottom: 0.5rem; color: #3a3a3a; }

.rc-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.rc-dow { text-align: center; font-size: 0.65rem; color: #999; padding-bottom: 0.2rem; }
.rc-day {
    position: relative; display: flex; align-items: center; justify-content: center;
    height: 2rem; font-size: 0.78rem; color: #555; border-radius: 4px;
    margin: 0; padding: 0; border: 0; background: none; box-shadow: none;
    font-family: inherit; line-height: 1; letter-spacing: 0; text-transform: none; min-width: 0;
}
.rc-day.is-past { color: #c4c0bb; }
.rc-day.is-today { box-shadow: inset 0 0 0 1px rgba(0,0,0,0.35); }
.rc-day.has-event {
    cursor: pointer; font-weight: 600; color: #2b2b2b;
    background: color-mix(in srgb, var(--rc-color) 28%, #fff);
}
.rc-day.has-event:hover, .rc-day.has-event:focus-visible, .rc-day.is-selected {
    background: var(--rc-color); color: #fff; outline: none;
}
.rc-bars { position: absolute; left: 3px; right: 3px; bottom: 2px; display: flex; gap: 1px; }
.rc-bars i { flex: 1; height: 3px; border-radius: 2px; }

.rc-note { text-align: center; font-size: 0.72rem; color: #999; margin-top: 0.4rem; }
.rc-month.is-waiting .rc-grid { opacity: 0.3; }
.rc-waiting {
    position: absolute; inset: 2.2rem 0.8rem 0.8rem; display: flex; align-items: center; justify-content: center;
    text-align: center; font-size: 0.82rem; font-style: italic; color: #555; padding: 0 0.5rem;
}

.rc-detail { margin: 1rem auto 0; max-width: 520px; }
.rc-detail-title { font-size: 0.85rem; margin: 0 0 0.5rem; color: #555; }
.rc-option {
    display: block; padding: 0.6rem 0.9rem; margin-bottom: 0.5rem; background: #fff;
    border: 1px solid rgba(0,0,0,0.1); border-left: 4px solid; border-radius: 6px;
    text-decoration: none; color: #333; font-size: 0.85rem; line-height: 1.5;
}
.rc-option:hover { background: #f7f4f0; }
.rc-option strong, .rc-option span, .rc-option em { display: block; }
.rc-option span { color: #777; }
.rc-option em { font-style: normal; font-size: 0.8rem; color: #4a7c59; }

.rc-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.4rem 1.1rem; margin-top: 1rem; font-size: 0.78rem; color: #555; }
.rc-legend-item { display: inline-flex; align-items: center; gap: 0.35rem; }
.rc-legend-item i { width: 0.7rem; height: 0.7rem; border-radius: 2px; display: inline-block; }

@media (max-width: 900px) {
    .rc-month { flex-basis: calc((100% - 1.25rem) / 2); }
}
@media (max-width: 560px) {
    .rc-viewport { gap: 0.25rem; }
    .rc-month { flex-basis: 100%; }
    .rc-day { height: 2.3rem; font-size: 0.85rem; }
}
