/* Timeline Styles - Optimized for Performance */
/* Performance tip: Use CSS custom properties for better performance and maintainability */
:root {
    --timeline-pixels-per-hour: 60px;
    --timeline-mobile-pixels-per-hour: 50px;
    --timeline-separator-height: 60px;
    --timeline-mobile-separator-height: 50px;
    --timeline-task-padding: 12px 16px;
    --timeline-mobile-task-padding: 8px 12px;
}

/* Performance tip: Use transform instead of changing layout properties for animations */
.task_tracker_timeline_container {
    width: 100%;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    /* Performance tip: Enable hardware acceleration */
    will-change: transform;
    transform: translateZ(0);
}

.task_tracker_timeline_day {
    border-bottom: 1px solid #e5e7eb;
}

.task_tracker_timeline_day:last-child {
    border-bottom: none;
}

/* Day Separator in Timeline */
.task_tracker_timeline_day_separator::before {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 20px;
    background: #d1d5db;
}

/* Centered Date Info - Similar to datetime_section but centered */
.task_tracker_separator_date_info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.task_tracker_separator_date_row_3 {
    display: flex;
    justify-content: center;
    align-items: center;
}

.task_tracker_timeline_hour:last-child {
    border-bottom: none;
}

.task_tracker_timeline_hour::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 20px;
    background: #d1d5db;
}

.task_tracker_timeline_task:hover {
    background: #1a1d28;
    /* Performance tip: Use transform instead of changing layout properties */
    transform: translateY(-1px) translateZ(0);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

/* Timeline Layout */
.task_tracker_timeline_day {
    display: flex;
}

/* Responsive Timeline */
@media (max-width: 768px) {
}

/* FullCalendar custom styles */
/* Responsive calendar */
@media (max-width: 768px) {
}

@media (max-width: 576px) {
}

/* FullCalendar Timeline Design Styles */
.task_tracker_calendar_container:has(.touchpoint-container) {
    margin-top: 0;

    background: transparent;
}

/* List of Tasks Container */
.task_tracker_list_of_tasks {
    width: 100%;
    background: #fff;
    border-radius: 8px;
    overflow: visible;
}

/* Time Row Styles */
.task_tracker_time_row_1 {
    margin-bottom: 10px;
}

.task_tracker_time_row_2 {
    margin-bottom: 0;
}