/* Vana Event Calendar Styles */
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700;900&display=swap');

.vec-wrap * { box-sizing: border-box; font-family: 'Lato', sans-serif; }
.vec-wrap { width: 100%; }

.vec-header { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.vec-month-label { font-size: 20px; font-weight: 700; color: #1a1a1a; margin: 0; }
.vec-nav {
  background: none; border: 1px solid #ddd; cursor: pointer;
  width: 30px; height: 30px; border-radius: 50%; font-size: 16px;
  color: #555; display: inline-flex; align-items: center; justify-content: center;
}
.vec-nav:hover { background: #f5f5f5; }

.vec-table-wrap { overflow-x: auto; }
.vec-grid { width: 100%; border-collapse: collapse; table-layout: fixed; }
.vec-grid th {
  font-size: 11px; font-weight: 700; color: #888; text-align: left;
  padding: 8px; border: 1px solid #e5e5e5; background: #fafafa;
  text-transform: uppercase; letter-spacing: 0.5px;
}
.vec-grid td {
  vertical-align: top; border: 1px solid #e5e5e5;
  padding: 0; height: 120px; width: 14.28%;
}

.vec-cell-inner { padding: 6px 8px; height: 100%; background: #fff; }
.vec-inactive .vec-cell-inner { background: #fafafa; }
.vec-day-num { font-size: 12px; color: #999; margin-bottom: 4px; }
.vec-inactive .vec-day-num { color: #ccc; }

/* Event cell — full bg color */
.vec-event { padding: 6px 8px; height: 100%; display: flex; flex-direction: column; }
.vec-event-day { font-size: 12px; font-weight: 700; color: #fff; margin-bottom: 3px; }
.vec-event-cat { font-size: 9px; font-weight: 700; letter-spacing: 0.6px; text-transform: uppercase; color: rgba(255,255,255,0.72); margin-bottom: 4px; }
.vec-etitle    { font-size: 11px; font-weight: 700; line-height: 1.3; color: #fff; margin-bottom: 2px; }
.vec-esub      { font-size: 10px; line-height: 1.3; color: rgba(255,255,255,0.82); margin-bottom: 3px; }
.vec-etime     { font-size: 10px; color: rgba(255,255,255,0.72); margin-top: auto; }

/* Category colors */
.cat-parent    { background: #8B5E3C; }
.cat-student   { background: #C9A84C; }
.cat-daylife   { background: #C4687A; }
.cat-community { background: #3A6EA8; }
.cat-other     { background: #A89B5E; }

/* Student uses dark text (light gold bg) */
.cat-student .vec-event-day,
.cat-student .vec-event-cat,
.cat-student .vec-etitle { color: #3a2500; }
.cat-student .vec-esub,
.cat-student .vec-etime  { color: rgba(58,37,0,0.7); }

/* Legend */
.vec-legend { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 16px; padding-top: 12px; border-top: 1px solid #eee; }
.vec-leg-item { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #555; }
.vec-dot { width: 14px; height: 14px; border-radius: 3px; flex-shrink: 0; display: inline-block; }

@media (max-width: 640px) {
  .vec-grid th  { font-size: 9px; padding: 4px; }
  .vec-grid td  { height: auto; min-height: 80px; }
  .vec-etitle   { font-size: 9px; }
  .vec-esub, .vec-etime { display: none; }
}