.class-selector-card {
    cursor: pointer;
    transition: all 0.25s ease-in-out;
    border: 2px solid transparent;
}
.class-selector-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.08);
}
.class-selector-card.active {
    border-color: #2DB37E;
    background: #F0FDF4;
    box-shadow: 0 8px 24px rgba(45, 179, 126, 0.15);
}
.class-selector-card.monthly-card {
    background: linear-gradient(145deg, #FFFBEB 0%, #FEF3C7 100%);
    border-color: #F59E0B;
}
.class-selector-card.monthly-card.active {
    border-color: #D97706;
    box-shadow: 0 8px 24px rgba(245, 158, 11, 0.25);
}
.calendar-legend-dot {
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    margin-right: 6px;
    vertical-align: middle;
}
.bg-attended-orange {
    background-color: #FF7A5A !important;
    color: #FFFFFF !important;
}
.attended-event {
    background: linear-gradient(135deg, #FF7A5A 0%, #F95738 100%) !important;
    border: 1px solid #E86140 !important;
    color: #FFFFFF !important;
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(255, 122, 90, 0.4);
    border-radius: 6px !important;
    cursor: pointer !important;
    margin-bottom: 3px !important;
}
.attended-event:hover {
    box-shadow: 0 4px 10px rgba(255, 122, 90, 0.5) !important;
}
.attended-confirmed-event {
    background: linear-gradient(135deg, #198754 0%, #157347 100%) !important;
    border: 1px solid #0f5132 !important;
    color: #FFFFFF !important;
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(25, 135, 84, 0.4);
    border-radius: 6px !important;
    cursor: pointer !important;
    margin-bottom: 3px !important;
}
.attended-confirmed-event:hover {
    box-shadow: 0 4px 10px rgba(25, 135, 84, 0.5) !important;
}
.schedule-event {
    background-color: #EBF9F3 !important;
    border: 1px solid #5BE3AB !important;
    color: #125738 !important;
    font-weight: 500;
    border-radius: 6px !important;
    cursor: pointer !important;
    margin-bottom: 3px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.schedule-event:hover {
    border-color: #2DB37E !important;
    background-color: #DCFCE7 !important;
    box-shadow: 0 2px 6px rgba(45, 179, 126, 0.25) !important;
}
.special-event {
    cursor: pointer !important;
    border-radius: 6px !important;
    font-weight: 500;
    margin-bottom: 3px !important;
}
.fc-daygrid-day {
    cursor: pointer;
    transition: background-color 0.15s ease-in-out;
}
.fc-daygrid-day:hover {
    background-color: rgba(45, 179, 126, 0.08) !important;
}
.fc-day-attended {
    background-color: rgba(255, 122, 90, 0.12) !important;
}
.fc-day-attended:hover {
    background-color: rgba(255, 122, 90, 0.22) !important;
}
.fc-custom-event-card {
    font-size: 0.74rem;
    line-height: 1.35;
    white-space: normal;
    word-break: break-word;
    padding: 3px 4px;
}
.fc-event-time-line {
    font-size: 0.76rem;
    margin-bottom: 1px;
    font-weight: 600;
}
.fc-event-teacher-line {
    font-size: 0.72rem;
    margin-bottom: 1px;
}
.fc-event-arena-line {
    font-size: 0.70rem;
    opacity: 0.9;
}
.fc-daygrid-event {
    white-space: normal !important;
    align-items: flex-start !important;
    margin: 2px 2px !important;
}
.fc-daygrid-day-frame {
    min-height: 110px;
}
.time-chip {
    min-width: 60px;
    font-weight: 600;
    transition: all 0.15s ease;
}
.time-chip.active, .time-chip:hover {
    background-color: #2DB37E !important;
    color: #FFFFFF !important;
    border-color: #2DB37E !important;
}
.slot-card-radio {
    cursor: pointer;
    transition: all 0.15s ease;
}
.slot-card-radio:hover {
    background-color: #F0FDF4;
    border-color: #2DB37E !important;
}

.legend-schedule { background-color: var(--brand-green-light); }
.legend-booked { background-color: var(--brand-orange); }
.legend-confirmed { background-color: #198754; }