@import url('https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible+Next:wght@400;500;600;700&display=swap'); * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: 'Atkinson Hyperlegible Next', -apple-system, BlinkMacSystemFont, sans-serif; } /* Custom scrollbar */ ::-webkit-scrollbar { width: 8px; height: 8px; } ::-webkit-scrollbar-track { background: #f1f5f9; } ::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; } ::-webkit-scrollbar-thumb:hover { background: #94a3b8; } /* PTO Background Pattern */ .pto-pattern { background-image: linear-gradient(45deg, #f5f5f5 25%, transparent 25%), linear-gradient(-45deg, #f5f5f5 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #f5f5f5 75%), linear-gradient(-45deg, transparent 75%, #f5f5f5 75%); background-size: 20px 20px; background-position: 0 0, 0 10px, 10px -10px, -10px 0px; } /* On-call Background */ .on-call-bg { background-color: #fef9c3; } /* Holiday Background */ .holiday-bg { background-color: #dbeafe; } /* Conference Background */ .conference-bg { background-color: #f3e8ff; } /* Status Indicator Colors */ .status-complete { background-color: #10b981; } .status-in-progress { background-color: #3b82f6; } .status-blocked { background-color: #f59e0b; } .status-not-started { background-color: #6b7280; } /* Cell Selection */ .cell-selected { border: 2px solid #0ea5e9 !important; box-shadow: 0 0 0 1px #0ea5e9; } /* Drag and Drop Styles */ .drag-over-valid { border: 2px solid #10b981 !important; } .drag-over-invalid { border: 2px solid #ef4444 !important; } .dragging { opacity: 0.5; } /* Dependency Lines */ .dependency-line { stroke: #6b7280; stroke-width: 2; marker-end: url(#arrowhead); } /* Sprint Boundary Lines */ .sprint-boundary { border-top: 3px solid #3b82f6; } /* Conflict Indicators */ .conflict-indicator { position: absolute; top: 2px; right: 2px; width: 12px; height: 12px; background-color: #ef4444; border-radius: 50%; } /* Task Item Styles */ .task-item { position: relative; transition: all 0.2s ease; } .task-item:hover { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); transform: translateY(-1px); } /* More indicator */ .more-indicator { background: rgba(243, 244, 246, 0.8); border-radius: 4px; padding: 2px 4px; } /* Command Panel Animation */ .command-panel-enter { transform: translateX(100%); } .command-panel-enter-active { transform: translateX(0); transition: transform 300ms ease-in-out; } .command-panel-exit { transform: translateX(0); } .command-panel-exit-active { transform: translateX(100%); transition: transform 300ms ease-in-out; } /* Task Stack Animation */ .task-stack-enter { opacity: 0; transform: translateY(-10px); } .task-stack-enter-active { opacity: 1; transform: translateY(0); transition: opacity 200ms, transform 200ms; } /* Responsive Adjustments */ @media (max-width: 1024px) { .calendar-grid { font-size: 12px; } .team-member-column { min-width: 150px; } } @media (max-width: 768px) { .calendar-grid { font-size: 11px; } .team-member-column { min-width: 120px; } } /* Print Styles */ @media print { .command-panel, .floating-action-btn { display: none !important; } .calendar-grid { break-inside: avoid; } } /* Team Member Header */ .team-member-header { background: white; border-right: 1px solid #e5e7eb; padding: 0.75rem 1rem; font-weight: 600; color: #1f2937; display: flex; align-items: center; justify-content: space-between; position: sticky; top: 0; z-index: 10; } /* Cell Styles */ .cell { background: white; border-right: 1px solid #e5e7eb; padding: 0.25rem; min-height: 4rem; position: relative; transition: all 0.2s ease; overflow: hidden; } /* Column Resizing */ .team-member-header { position: relative; cursor: col-resize; user-select: none; } .team-member-header::after { content: ''; position: absolute; right: 0; top: 0; bottom: 0; width: 4px; background: transparent; cursor: col-resize; } .team-member-header:hover::after { background: #0ea5e9; } /* Task Item Styling */ .task-item { max-height: 48px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-bottom: 4px; font-size: 14px; } .task-title { font-weight: 500; line-height: 1.3; } .status-indicator { width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px; flex-shrink: 0; } .time-estimate { font-size: 10px; color: #64748b; } .link-count { font-size: 10px; } .cell:hover { background-color: #f9fafb; } /* Status Colors */ .status-complete { background-color: #10b981; } .status-in-progress { background-color: #3b82f6; } .status-blocked { background-color: #f59e0b; } .status-not-started { background-color: #6b7280; } /* Date Column */ .sticky.left-0 { background: #f8f9fa; font-weight: 500; color: #374151; }