/* ─── Events Page ─── */

/* Empty state */
.ev-empty {
 text-align: center;
 padding: 80px 24px;
 color: var(--nca-text-muted);
}

.ev-empty svg {
 width: 48px;
 height: 48px;
 margin: 0 auto 16px;
 opacity: 0.25;
}

.ev-empty p {
 font-size: 14px;
}

/* Card grid */
.ev-grid {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 20px;
}

/* Event card */
.ev-card {
 background: var(--nca-white);
 border-radius: var(--border-radius-lg);
 overflow: hidden;
 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.03);
 transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.4s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.4s ease;
 display: flex;
 flex-direction: column;
 cursor: pointer;
 position: relative;
 border: 1px solid rgba(0, 0, 0, 0.04);
 text-decoration: none;
 color: inherit;
}

.ev-card:hover {
 box-shadow: 0 8px 24px rgba(122, 30, 101, 0.1), 0 16px 48px rgba(0, 0, 0, 0.08);
 transform: translateY(-6px);
 border-color: rgba(122, 30, 101, 0.15);
}

.ev-card__img-wrap {
 position: relative;
 aspect-ratio: 16 / 10;
 overflow: hidden;
 background: var(--nca-border-light);
}

.ev-card__img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 transition: transform 0.5s ease;
}

.ev-card:hover .ev-card__img {
 transform: scale(1.08);
 filter: brightness(1.03);
}

.ev-card__img--placeholder {
 display: flex;
 align-items: center;
 justify-content: center;
 background: linear-gradient(135deg, var(--nca-purple), var(--nca-magenta));
}

.ev-card__img--placeholder svg {
 width: 36px;
 height: 36px;
 color: rgba(255, 255, 255, 0.3);
}

.ev-card__badge {
 position: absolute;
 top: 12px;
 left: 12px;
 display: inline-flex;
 align-items: center;
 gap: 6px;
 padding: 5px 12px;
 border-radius: 20px;
 font-size: 11px;
 font-weight: 700;
 color: #fff;
 backdrop-filter: blur(8px);
 -webkit-backdrop-filter: blur(8px);
 transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.ev-card:hover .ev-card__badge {
 transform: scale(1.06);
}

.ev-card__badge--ongoing {
 background: rgba(34, 197, 94, 0.85);
 box-shadow: 0 2px 8px rgba(34, 197, 94, 0.3);
}

.ev-card__badge--upcoming {
 background: rgba(59, 130, 246, 0.85);
 box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3);
}

.ev-card__date-badge {
 position: absolute;
 top: 12px;
 right: 12px;
 display: flex;
 flex-direction: column;
 align-items: center;
 padding: 8px 12px;
 border-radius: var(--border-radius-md);
 background: var(--nca-purple);
 box-shadow: 0 4px 16px rgba(122, 30, 101, 0.3);
 line-height: 1;
 transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.ev-card:hover .ev-card__date-badge {
 transform: scale(1.08) translateY(-2px);
 box-shadow: 0 6px 20px rgba(122, 30, 101, 0.4);
}

.ev-card__date-day {
 font-size: 22px;
 font-weight: 800;
 color: #fff;
}

.ev-card__date-mon {
 font-size: 10px;
 font-weight: 700;
 text-transform: uppercase;
 color: rgba(255, 255, 255, 0.85);
 letter-spacing: 0.5px;
 margin-top: 2px;
}

.ev-card__body {
 padding: 16px 18px 18px;
 display: flex;
 flex-direction: column;
 gap: 8px;
 flex: 1;
}

.ev-card__meta {
 display: flex;
 align-items: center;
 gap: 8px;
 flex-wrap: wrap;
}

.ev-card__cat {
 font-size: 10px;
 font-weight: 700;
 text-transform: uppercase;
 letter-spacing: 0.5px;
 padding: 3px 10px;
 border-radius: 20px;
 color: var(--nca-purple);
 background: rgba(122, 30, 101, 0.06);
}

.ev-card__date {
 font-size: 11px;
 color: var(--nca-text-muted);
 font-weight: 500;
}

.ev-card__title {
 font-size: 15px;
 font-weight: 700;
 color: var(--nca-text-dark);
 line-height: 1.3;
 margin: 0;
}

.ev-card__location {
 display: flex;
 align-items: center;
 gap: 5px;
 font-size: 12px;
 color: var(--nca-text-muted);
}

.ev-card__location svg {
 width: 13px;
 height: 13px;
 flex-shrink: 0;
 stroke: var(--nca-magenta);
}

.ev-card__footer {
 display: flex;
 align-items: center;
 justify-content: space-between;
 margin-top: auto;
 padding-top: 10px;
 border-top: 1px solid var(--nca-border-light);
 transition: border-color 0.4s ease;
}

.ev-card:hover .ev-card__footer {
 border-color: rgba(122, 30, 101, 0.15);
}

.ev-card__time {
 display: inline-flex;
 align-items: center;
 gap: 5px;
 font-size: 12px;
 color: var(--nca-text-muted);
 font-weight: 500;
}

.ev-card__time svg {
 width: 13px;
 height: 13px;
}

.ev-card__arrow {
 color: var(--nca-text-muted);
 opacity: 0;
 transform: translateX(-8px);
 transition: all 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.ev-card:hover .ev-card__arrow {
 opacity: 1;
 transform: translateX(0);
 color: var(--nca-magenta);
}

.ev-card__arrow svg {
 width: 16px;
 height: 16px;
}

/* Past events */
.ev-card--past {
 opacity: 0.7;
}

.ev-card--past:hover {
 opacity: 1;
}

/* ─── Responsive ─── */

@media (max-width: 960px) {
 .ev-grid {
  grid-template-columns: repeat(2, 1fr);
 }
}

@media (max-width: 640px) {
 .ev-grid {
  grid-template-columns: 1fr;
  gap: 16px;
 }

 .ev-card__title {
  font-size: 14px;
 }
}
