.employee-risk-profile-card { display: grid; gap: 14px; } .employee-risk-profile-head { margin-bottom: 0; } .employee-risk-profile-badges { display: inline-flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px; } .ai-assist-badge, .profile-level-pill { min-height: 26px; display: inline-flex; align-items: center; gap: 6px; padding: 0 10px; border: 1px solid #dbeafe; border-radius: 4px; background: #f8fafc; color: #2563eb; font-size: 12px; font-weight: 800; white-space: nowrap; } .ai-assist-badge i { font-size: 14px; } .profile-level-pill.normal { border-color: #bbf7d0; background: #f0fdf4; color: #15803d; } .profile-level-pill.watch { border-color: #bfdbfe; background: #eff6ff; color: #2563eb; } .profile-level-pill.medium { border-color: #fed7aa; background: #fff7ed; color: #c2410c; } .profile-level-pill.high { border-color: #fecaca; background: #fef2f2; color: #b91c1c; } .employee-risk-state { min-height: 92px; display: flex; align-items: center; justify-content: center; gap: 8px; border: 1px dashed #cbd5e1; border-radius: 4px; background: #f8fafc; color: #64748b; font-size: 13px; font-weight: 750; } .employee-risk-state.error { border-color: #fecaca; background: #fef2f2; color: #b91c1c; } .employee-risk-body { display: grid; gap: 12px; } .employee-risk-decision { display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(140px, auto); gap: 14px; align-items: center; padding: 14px; border: 1px solid #dbeafe; border-radius: 4px; background: linear-gradient(180deg, #f8fbff 0%, #ffffff 100%); } .employee-risk-decision.watch { border-color: #bfdbfe; } .employee-risk-decision.medium { border-color: #fed7aa; background: linear-gradient(180deg, #fffaf5 0%, #ffffff 100%); } .employee-risk-decision.high { border-color: #fecaca; background: linear-gradient(180deg, #fff7f7 0%, #ffffff 100%); } .employee-risk-score { width: 76px; height: 76px; display: grid; place-items: center; align-content: center; border: 1px solid #bfdbfe; border-radius: 50%; background: #eff6ff; color: #2563eb; } .employee-risk-decision.normal .employee-risk-score { border-color: #bbf7d0; background: #f0fdf4; color: #15803d; } .employee-risk-decision.medium .employee-risk-score { border-color: #fed7aa; background: #fff7ed; color: #c2410c; } .employee-risk-decision.high .employee-risk-score { border-color: #fecaca; background: #fef2f2; color: #b91c1c; } .employee-risk-score strong { color: inherit; font-size: 25px; font-weight: 900; line-height: 1; } .employee-risk-score span { margin-top: 4px; color: inherit; font-size: 11px; font-weight: 800; } .employee-risk-decision-copy, .employee-risk-action { min-width: 0; display: grid; gap: 5px; } .employee-risk-decision-copy span, .employee-risk-action span, .employee-risk-section-head span, .employee-risk-meta-grid span { color: #64748b; font-size: 12px; font-weight: 800; } .employee-risk-decision-copy strong { color: #0f172a; font-size: 16px; font-weight: 850; } .employee-risk-decision-copy p { margin: 0; color: #334155; font-size: 13px; line-height: 1.65; } .employee-risk-action { padding-left: 14px; border-left: 1px solid #e2e8f0; } .employee-risk-action strong { color: #0f172a; font-size: 14px; font-weight: 850; line-height: 1.45; } .employee-risk-meta-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; } .employee-risk-meta-grid article { min-width: 0; display: grid; gap: 5px; padding: 10px 12px; border: 1px solid #e2e8f0; border-radius: 4px; background: #f8fafc; } .employee-risk-meta-grid strong { min-width: 0; color: #0f172a; font-size: 13px; font-weight: 850; overflow-wrap: anywhere; } .employee-risk-analysis-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 12px; } .employee-risk-section { min-width: 0; display: grid; gap: 10px; padding: 12px; border: 1px solid #e2e8f0; border-radius: 4px; background: #fff; } .employee-risk-section-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; } .employee-risk-section-head small { color: #94a3b8; font-size: 11px; font-weight: 700; } .employee-risk-advice-list, .employee-risk-evidence-list, .employee-risk-profile-evidence { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; } .employee-risk-advice-list li { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 8px; align-items: flex-start; padding: 10px; border: 1px solid #e2e8f0; border-radius: 4px; background: #f8fafc; } .employee-risk-advice-list i { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 4px; background: #eff6ff; color: #2563eb; font-size: 15px; } .employee-risk-advice-list li.normal i { background: #f0fdf4; color: #15803d; } .employee-risk-advice-list li.medium i { background: #fff7ed; color: #c2410c; } .employee-risk-advice-list li.high i { background: #fef2f2; color: #b91c1c; } .employee-risk-advice-list span { display: block; color: #0f172a; font-size: 13px; font-weight: 760; line-height: 1.55; } .employee-risk-advice-list strong { display: inline-block; margin-top: 4px; color: #64748b; font-size: 12px; font-weight: 800; } .employee-risk-evidence-list li { display: grid; grid-template-columns: 82px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 9px 0; border-bottom: 1px solid #edf2f7; } .employee-risk-evidence-list li:last-child { border-bottom: 0; } .employee-risk-evidence-list span, .employee-risk-evidence-list em, .employee-risk-profile-evidence span { color: #64748b; font-size: 12px; font-style: normal; font-weight: 760; } .employee-risk-evidence-list strong { min-width: 0; color: #0f172a; font-size: 13px; font-weight: 820; overflow-wrap: anywhere; } .employee-risk-evidence-list small { grid-column: 2 / 4; color: #94a3b8; font-size: 11px; line-height: 1.45; } .employee-risk-dimension-list { display: grid; gap: 9px; } .employee-risk-dimension { display: grid; grid-template-columns: minmax(120px, .65fr) minmax(0, 1fr) 56px; gap: 10px; align-items: center; } .employee-risk-dimension > div:first-child { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 8px; } .employee-risk-dimension span, .employee-risk-dimension small { color: #64748b; font-size: 12px; font-weight: 760; } .employee-risk-dimension strong { color: #0f172a; font-size: 13px; font-weight: 850; } .employee-risk-dimension-track { height: 7px; overflow: hidden; border-radius: 999px; background: #e2e8f0; } .employee-risk-dimension-track i { display: block; height: 100%; border-radius: inherit; background: var(--theme-primary-active); } .employee-risk-profile-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .employee-risk-profile { min-width: 0; display: grid; gap: 10px; padding: 11px; border: 1px solid #e2e8f0; border-radius: 4px; background: #f8fafc; } .employee-risk-profile-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; } .employee-risk-profile-title div { min-width: 0; display: grid; gap: 3px; } .employee-risk-profile-title span { color: #0f172a; font-size: 13px; font-weight: 850; } .employee-risk-profile-title small { color: #64748b; font-size: 11px; font-weight: 760; } .employee-risk-profile-title > strong { min-width: 38px; min-height: 28px; display: grid; place-items: center; border: 1px solid #dbeafe; border-radius: 4px; background: #eff6ff; color: #2563eb; font-size: 14px; font-weight: 900; } .employee-risk-profile-title > strong.normal { border-color: #bbf7d0; background: #f0fdf4; color: #15803d; } .employee-risk-profile-title > strong.medium { border-color: #fed7aa; background: #fff7ed; color: #c2410c; } .employee-risk-profile-title > strong.high { border-color: #fecaca; background: #fef2f2; color: #b91c1c; } .employee-risk-profile-evidence li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 7px; border-top: 1px solid #e2e8f0; } .employee-risk-profile-evidence strong { color: #0f172a; font-size: 12px; font-weight: 820; } .employee-risk-tags { display: flex; flex-wrap: wrap; gap: 7px; } .employee-risk-tag { min-height: 26px; display: inline-flex; align-items: center; gap: 7px; padding: 0 9px; border: 1px solid #dbeafe; border-radius: 4px; background: #f8fafc; color: #334155; font-size: 12px; font-weight: 800; } .employee-risk-tag strong { color: inherit; font-size: 11px; } .employee-risk-tag.risk { border-color: #fed7aa; background: #fff7ed; color: #c2410c; } .employee-risk-tag.behavior { border-color: #bfdbfe; background: #eff6ff; color: #2563eb; } .employee-risk-tag.positive { border-color: #bbf7d0; background: #f0fdf4; color: #15803d; } .employee-risk-muted { margin: 0; color: #94a3b8; font-size: 12px; line-height: 1.6; } @media (max-width: 1180px) { .employee-risk-decision, .employee-risk-analysis-grid, .employee-risk-profile-list { grid-template-columns: 1fr; } .employee-risk-action { padding-left: 0; padding-top: 12px; border-left: 0; border-top: 1px solid #e2e8f0; } } @media (max-width: 760px) { .employee-risk-meta-grid, .employee-risk-dimension { grid-template-columns: 1fr; } .employee-risk-profile-head, .employee-risk-section-head { align-items: flex-start; flex-direction: column; } .employee-risk-evidence-list li { grid-template-columns: 1fr; } .employee-risk-evidence-list small { grid-column: auto; } }