body { background-color: #f8fafc; font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; color: #0f172a; font-size: 0.875rem; } .navbar { background-color: #ffffff; border-bottom: 1px solid #e2e8f0; padding: 0.75rem 1.5rem; } .navbar-brand { font-weight: 700; color: #0f172a; letter-spacing: -0.025em; } .nav-link { color: #475569; font-weight: 500; } .nav-link:hover { color: #3b82f6; } .dropdown-menu { border: 1px solid #e2e8f0; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1); border-radius: 0.375rem; padding: 0.5rem; } .dropdown-item { border-radius: 0.25rem; padding: 0.5rem 0.75rem; color: #475569; } .dropdown-item:hover { background-color: #f1f5f9; color: #3b82f6; } .card { background-color: #ffffff; border: 1px solid #e2e8f0; border-radius: 0.375rem; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); } .card-header { background-color: #ffffff; border-bottom: 1px solid #e2e8f0; padding: 1rem 1.5rem; font-weight: 600; } .btn-primary { background-color: #3b82f6; border-color: #3b82f6; color: #ffffff !important; font-weight: 500; } .btn-primary:hover { background-color: #2563eb; border-color: #2563eb; } .table { margin-bottom: 0; } .table th { background-color: #f8fafc; color: #64748b; text-transform: uppercase; font-size: 0.75rem; font-weight: 600; letter-spacing: 0.05em; padding: 0.75rem 1.5rem; border-top: none; } .table td { padding: 1rem 1.5rem; vertical-align: middle; } .status-badge { padding: 0.25rem 0.5rem; border-radius: 9999px; font-size: 0.75rem; font-weight: 600; } .status-active { background-color: #dcfce7; color: #166534; } .status-on-hold { background-color: #fef9c3; color: #854d0e; } .status-completed { background-color: #dbeafe; color: #1e40af; } .activity-feed { list-style: none; padding: 0; } .activity-item { padding: 0.75rem 0; border-bottom: 1px solid #f1f5f9; } .activity-item:last-child { border-bottom: none; } .activity-time { font-size: 0.75rem; color: #94a3b8; } /* Filter Sidebar Styles */ .filter-sidebar { transition: all 0.3s ease; width: 300px; position: relative; } .filter-sidebar.collapsed { width: 0; overflow: hidden; padding: 0; margin: 0; border: none; opacity: 0; } .filter-toggle-btn { position: absolute; left: -40px; top: 10px; z-index: 10; background: #ffffff; border: 1px solid #e2e8f0; border-radius: 4px 0 0 4px; padding: 5px 10px; cursor: pointer; box-shadow: -2px 0 5px rgba(0,0,0,0.05); } .filter-card { position: sticky; top: 90px; } .extra-small { font-size: 0.7rem; } /* Calendar Styles */ .calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; background-color: #e2e8f0; border: 1px solid #e2e8f0; border-radius: 0.375rem; overflow: hidden; } .calendar-day { background-color: #ffffff; min-height: 100px; padding: 0.75rem; position: relative; transition: background-color 0.2s; } .calendar-day:hover { background-color: #f8fafc; } .calendar-header-day { background-color: #f1f5f9; text-align: center; padding: 0.75rem; font-weight: 700; text-transform: uppercase; font-size: 0.75rem; color: #64748b; letter-spacing: 0.05em; } .day-number { font-weight: 600; color: #94a3b8; font-size: 0.875rem; } .day-hours { position: absolute; bottom: 0.75rem; right: 0.75rem; font-size: 1.125rem; font-weight: 700; color: #3b82f6; } .other-month { background-color: #f8fafc; } .other-month .day-number { color: #e2e8f0; }