/* ---------- intro / legend ---------- */
.nm-cal-page .nm-intro{color:var(--drift);font-size:1.0625rem;max-width:640px;margin:8px 0 24px}
.nm-cal-legend-hint{margin:0 0 8px;font-size:13px;color:var(--drift)}
.nm-cal-legend{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px;font:600 14px/1 var(--f-body)}
.nm-cal-legend__item{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border:1px solid var(--rope);border-radius:999px;background:var(--paper);color:var(--ink);cursor:pointer;transition:opacity .15s,border-color .15s}
.nm-cal-legend__item:hover{border-color:var(--crest)}
.nm-cal-legend__item:not(.is-active){opacity:.4}
.nm-cal-legend__item:not(.is-active) .nm-dot{filter:grayscale(60%)}
.nm-dot{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none}
.nm-cal-loading{color:var(--drift);font-style:italic}

/* ---------- calendar shell ---------- */
.nm-calendar{
  --fc-border-color:var(--rope);
  --fc-page-bg-color:var(--paper);
  --fc-neutral-bg-color:var(--sand);
  --fc-today-bg-color:#FBF0DC;
  --fc-button-bg-color:var(--paper);
  --fc-button-border-color:var(--rope);
  --fc-button-text-color:var(--ink);
  --fc-button-hover-bg-color:var(--sand);
  --fc-button-hover-border-color:var(--crest);
  --fc-button-active-bg-color:var(--crest);
  --fc-button-active-border-color:var(--crest);
  background:var(--paper);border:1px solid var(--rope);border-radius:2px;
  padding:clamp(12px,2vw,28px);
  font-family:var(--f-body);
}
.nm-calendar .fc{font-size:0.9375rem}
.nm-calendar .fc-toolbar-title{font:700 clamp(22px,2.4vw,30px)/1.1 var(--f-head);color:var(--ink);text-transform:uppercase;letter-spacing:.01em}
.nm-calendar .fc-button{font:600 13px/1 var(--f-body) !important;text-transform:uppercase;letter-spacing:.04em;box-shadow:none !important;padding:8px 14px !important}
.nm-calendar .fc-button:focus-visible{outline:2px solid var(--crest);outline-offset:2px}
.nm-calendar .fc-button-active,.nm-calendar .fc-button-active:hover{color:#fff !important}
.nm-calendar .fc-col-header-cell-cushion{color:var(--drift);font-weight:600;text-transform:uppercase;font-size:12px;letter-spacing:.06em;text-decoration:none}
.nm-calendar .fc-daygrid-day-number{color:var(--ink);text-decoration:none;font-weight:600}
.nm-calendar .fc-day-other .fc-daygrid-day-number{color:var(--rope)}
.nm-calendar a{text-decoration:none}

/* A day that has at least one event — class set via JS (dayCellClassNames).
   FullCalendar paints the cell's actual background on an inner absolutely-
   positioned layer (.fc-daygrid-day-bg), not the <td> itself, so the colour
   has to be applied there too or it's invisible underneath. Covering both. */
.nm-calendar .nm-has-event,
.nm-calendar .nm-has-event .fc-daygrid-day-bg,
.nm-calendar .nm-has-event .fc-daygrid-day-frame{background:rgba(0,111,185,.14) !important;cursor:pointer}
.nm-calendar .nm-has-event:hover,
.nm-calendar .nm-has-event:hover .fc-daygrid-day-bg{background:rgba(0,111,185,.24) !important}

/* event chips */
.nm-calendar .fc-event{border:none;border-radius:2px;padding:1px 2px;font-weight:600;cursor:pointer}
.nm-calendar .fc-daygrid-event-dot{display:none} /* we colour the whole chip instead of a dot */
.nm-calendar .fc-timegrid-event .fc-event-main{padding:2px 4px}
/* Month view chips are narrow — FullCalendar's default lays the time and title out
   side by side in the same row (.fc-event-main-frame), which overlaps/truncates on a
   timed event. Stack them instead: time on its own line, title underneath. */
.nm-calendar .fc-daygrid-event .fc-event-main-frame{display:flex;flex-direction:column;align-items:flex-start;line-height:1.3}
.nm-calendar .fc-daygrid-event .fc-event-time{flex:none}
.nm-calendar .fc-daygrid-event .fc-event-title-container{width:100%}
.nm-calendar .fc-list-event-dot{border-width:5px}
/* Nomads' own events (added via WP-Admin) get a solid border, on top of their category
   colour, so they read as "ours" at a glance against the imported SADSAA/other-club rows. */
.nm-calendar .fc-event.nm-event--own{border-width:2px!important;border-style:solid!important;border-color:var(--ink)!important}
.nm-calendar .fc-list-event.nm-event--own .fc-list-event-dot{border-width:5px;outline:2px solid var(--ink);outline-offset:1px}
.nm-calendar .fc-list-day-cushion{background:var(--sand)}

@media (max-width:640px){
  .nm-calendar{padding:12px}
  .nm-calendar .fc-toolbar{flex-direction:column;gap:10px}
  .nm-calendar .fc-toolbar-chunk{display:flex;justify-content:center}
}

/* ---------- event detail modal ---------- */
.nm-modal{position:fixed;inset:0;z-index:100;display:flex;align-items:flex-end;justify-content:center}
.nm-modal[hidden]{display:none}
.nm-modal__backdrop{position:absolute;inset:0;background:rgba(11,34,51,.55)}
.nm-modal__panel{
  position:relative;background:var(--paper);border-radius:8px 8px 0 0;
  width:100%;max-width:560px;max-height:88vh;overflow-y:auto;
  padding:clamp(24px,4vw,40px);margin-bottom:0;
  box-shadow:0 -8px 40px rgba(0,0,0,.25);
  animation:nm-modal-up .22s ease-out;
}
@media (min-width:720px){
  .nm-modal{align-items:center}
  .nm-modal__panel{border-radius:8px;margin-bottom:0;animation:nm-modal-in .18s ease-out}
}
@keyframes nm-modal-up{from{transform:translateY(24px);opacity:0}to{transform:translateY(0);opacity:1}}
@keyframes nm-modal-in{from{transform:scale(.97);opacity:0}to{transform:scale(1);opacity:1}}
.nm-modal__close{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;border:none;background:var(--sand);color:var(--ink);font-size:22px;line-height:1;cursor:pointer}
.nm-modal__close:hover{background:var(--rope)}
.nm-em-cat{color:var(--crest-deep);margin:0 0 6px}
.nm-em-title{font:700 clamp(24px,3vw,32px)/1.1 var(--f-head);margin:0 0 10px;text-transform:none}
.nm-em-when{font-weight:600;color:var(--ink);margin:0 0 4px}
.nm-em-venue{color:var(--drift);margin:0 0 16px}
.nm-em-venue a{color:var(--crest-deep)}
.nm-em-desc{margin:0 0 16px;line-height:1.6}
.nm-em-cost{font-weight:600;color:var(--ink)}
.nm-em-link{margin-bottom:16px}
.nm-em-map{width:100%;height:260px;border-radius:4px;overflow:hidden;background:var(--sand);margin-top:8px}