/* 작업관리 시스템 공통 스타일 */ @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap'); body { font-family: 'Noto Sans KR', sans-serif; background-color: #f8f9fa; } /* 네비게이션 스타일 */ .navbar-brand { font-weight: 700; font-size: 1.5rem; } .nav-link { font-weight: 500; transition: all 0.3s ease; } .nav-link:hover { transform: translateY(-1px); } .nav-link.active { background-color: rgba(255, 255, 255, 0.1); border-radius: 5px; } /* 카드 스타일 */ .card { border: none; border-radius: 15px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08); transition: transform 0.3s ease, box-shadow 0.3s ease; } .card:hover { transform: translateY(-2px); box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15); } .card-header { background-color: #fff; border-bottom: 2px solid #f8f9fa; border-radius: 15px 15px 0 0 !important; font-weight: 600; } /* 통계 카드 */ .card.bg-primary, .card.bg-success, .card.bg-warning, .card.bg-info { background: linear-gradient(135deg, var(--bs-primary) 0%, #764ba2 100%) !important; } .card.bg-success { background: linear-gradient(135deg, var(--bs-success) 0%, #56ab2f 100%) !important; } .card.bg-warning { background: linear-gradient(135deg, var(--bs-warning) 0%, #f093fb 100%) !important; } .card.bg-info { background: linear-gradient(135deg, var(--bs-info) 0%, #4facfe 100%) !important; } /* 버튼 스타일 */ .btn { border-radius: 10px; font-weight: 500; transition: all 0.3s ease; } .btn:hover { transform: translateY(-1px); } .btn-primary { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); border: none; } .btn-success { background: linear-gradient(135deg, #56ab2f 0%, #a8e6cf 100%); border: none; } .btn-warning { background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%); border: none; } .btn-info { background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%); border: none; } /* 테이블 스타일 */ .table { border-radius: 10px; overflow: hidden; } .table thead th { background-color: #f8f9fa; border: none; font-weight: 600; color: #495057; } .table tbody tr { transition: all 0.3s ease; } .table tbody tr:hover { background-color: #f8f9fa; transform: scale(1.01); } /* 폼 스타일 */ .form-control, .form-select { border-radius: 10px; border: 2px solid #e9ecef; transition: all 0.3s ease; } .form-control:focus, .form-select:focus { border-color: #667eea; box-shadow: 0 0 0 0.2rem rgba(102, 126, 234, 0.25); } /* 모달 스타일 */ .modal-content { border-radius: 15px; border: none; box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1); } .modal-header { border-bottom: 2px solid #f8f9fa; border-radius: 15px 15px 0 0; } .modal-footer { border-top: 2px solid #f8f9fa; border-radius: 0 0 15px 15px; } /* 배지 스타일 */ .badge { border-radius: 20px; font-weight: 500; padding: 0.5em 1em; } /* 직종별 배지 색상 */ .badge.job-welder { background-color: #ff6b6b; } .badge.job-plumber { background-color: #4ecdc4; } /* 상태별 배지 색상 */ .badge.status-active { background-color: #51cf66; } .badge.status-inactive { background-color: #868e96; } .badge.status-completed { background-color: #51cf66; } .badge.status-in-progress { background-color: #339af0; } .badge.status-planned { background-color: #ffd43b; color: #495057; } .badge.status-cancelled { background-color: #868e96; } /* 우선순위별 배지 색상 */ .badge.priority-low { background-color: #51cf66; } .badge.priority-normal { background-color: #339af0; } .badge.priority-high { background-color: #ff8cc8; } .badge.priority-urgent { background-color: #ff6b6b; } /* 심각도별 배지 색상 */ .badge.severity-low { background-color: #51cf66; } .badge.severity-medium { background-color: #ffd43b; color: #495057; } .badge.severity-high { background-color: #ff8cc8; } .badge.severity-critical { background-color: #ff6b6b; } /* 토스트 스타일 */ .toast { border-radius: 10px; border: none; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2); } /* 반응형 스타일 */ @media (max-width: 768px) { .container-fluid { padding-left: 15px; padding-right: 15px; } .card-body { padding: 1rem; } .btn { font-size: 0.9rem; } .table-responsive { font-size: 0.9rem; } } /* 로딩 애니메이션 */ @keyframes pulse { 0% { opacity: 1; } 50% { opacity: 0.5; } 100% { opacity: 1; } } .loading { animation: pulse 1.5s ease-in-out infinite; } /* 스크롤바 스타일 */ ::-webkit-scrollbar { width: 8px; } ::-webkit-scrollbar-track { background: #f1f1f1; border-radius: 10px; } ::-webkit-scrollbar-thumb { background: #888; border-radius: 10px; } ::-webkit-scrollbar-thumb:hover { background: #555; }