/* ===================================
   DAY CALENDAR COMPONENT
   ===================================
   
   24-hour day calendar with time slots.
*/

.day-calendar {
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    height: 100%;
}

.calendar-hour-block {
    display: flex;
    border-bottom: var(--border-width-1) solid var(--border-subtle);
    min-height: var(--space-15);
}

.hour-label {
    width: var(--space-15);
    padding: var(--space-3);
    font-size: var(--text-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-align: right;
    flex-shrink: 0;
    border-right: var(--border-width-1) solid var(--border-subtle);
}

.time-slot {
    flex: 1;
    position: relative;
    border-bottom: 1px dashed var(--border-subtle);
}

.time-slot:last-child {
    border-bottom: none;
}

.drop-zone {
    width: 100%;
    height: 100%;
    min-height: 15px;
}

.drop-zone.drag-over {
    background: var(--color-primary-light);
    border: 2px dashed var(--color-primary);
}