.safety-module { min-width:0; padding:28px 30px 36px; color:#182a30; }.safety-toolbar { display:grid; grid-template-columns:minmax(300px,1.45fr) minmax(160px,.5fr) minmax(160px,.5fr) auto; gap:14px; align-items:stretch; margin-bottom:20px; }.safety-search,.safety-filter { display:flex; min-width:0; min-height:52px; align-items:center; gap:10px; padding:0 16px; border:1px solid #d8e4e2; border-radius:14px; background:#fff; }.safety-search svg { width:20px; height:20px; color:#71858c; }.safety-search input,.safety-filter select { width:100%; min-width:0; border:0; outline:0; background:transparent; color:#243a41; font:inherit; }.safety-filter span { flex:0 0 auto; color:#7a8d93; font-size:13px; }
.safety-metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); overflow:hidden; margin-bottom:20px; border:1px solid #dce7e5; border-radius:18px; background:#fff; box-shadow:0 8px 26px rgba(25,59,62,.055); }.safety-metric { display:flex; min-width:0; min-height:112px; align-items:center; gap:16px; padding:22px 24px; border-right:1px solid #e1eae8; }.safety-metric:last-child { border-right:0; }.safety-metric > span { display:grid; width:48px; height:48px; flex:0 0 auto; place-items:center; border-radius:16px; background:#edf8f6; color:#168c80; }.safety-metric > span svg { width:23px; height:23px; }.safety-metric.open > span { background:#fff6e9; color:#d98221; }.safety-metric.urgent > span,.safety-metric.overdue > span { background:#fff0ef; color:#d84743; }.safety-metric.closed > span { background:#ecf8f6; color:#168c80; }.safety-metric small { display:block; color:#778a90; font-size:13px; }.safety-metric strong { display:block; margin-top:5px; color:#173138; font-size:28px; line-height:1; }.safety-metric em { margin-left:4px; color:#71858c; font-size:13px; font-style:normal; }
.safety-workspace { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(390px,.72fr); gap:18px; align-items:start; }.safety-panel { min-width:0; overflow:hidden; border:1px solid #dce7e5; border-radius:18px; background:#fff; box-shadow:0 8px 26px rgba(25,59,62,.05); }.safety-panel-head { display:flex; min-height:82px; align-items:center; justify-content:space-between; gap:18px; padding:18px 22px; border-bottom:1px solid #e4eceb; }.safety-panel-head h2 { margin:0; font-size:20px; }.safety-panel-head p { margin:5px 0 0; color:#7a8d93; font-size:13px; }.safety-panel-head > strong { color:#168c80; white-space:nowrap; }.safety-list { min-height:350px; }.safety-row { display:grid; grid-template-columns:minmax(220px,1fr) 100px 105px 108px 22px; gap:13px; align-items:center; width:100%; min-height:102px; padding:16px 18px; border:0; border-bottom:1px solid #e8efee; background:#fff; color:inherit; text-align:left; cursor:pointer; }.safety-row:hover { background:#f8fbfa; }.safety-row.active { box-shadow:inset 4px 0 #168c80; background:#f1f8f6; }.safety-row-main { display:grid; min-width:0; grid-template-columns:42px minmax(0,1fr); gap:12px; align-items:center; }.safety-row-icon { display:grid; width:42px; height:42px; place-items:center; border-radius:14px; background:#f1f5f4; color:#64777d; }.safety-row-icon.severity-medium { background:#fff6e9; color:#d98221; }.safety-row-icon.severity-high,.safety-row-icon.severity-urgent { background:#fff0ef; color:#d84743; }.safety-row-icon svg { width:21px; height:21px; }.safety-row span { min-width:0; }.safety-row strong { display:block; overflow:hidden; color:#314a51; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }.safety-row-main strong { color:#20363c; font-size:15px; }.safety-row small { display:block; overflow:hidden; margin-top:5px; color:#87979c; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.safety-row-arrow { width:18px; height:18px; color:#91a2a6; }
.safety-badge { display:inline-flex; align-items:center; min-height:26px; padding:0 9px; border-radius:999px; font-size:12px; font-weight:800; white-space:nowrap; }.safety-badge.severity-low { background:#eef2f3; color:#64777d; }.safety-badge.severity-medium,.status-reported { background:#fff5e6; color:#bb6d12; }.safety-badge.severity-high,.safety-badge.severity-urgent { background:#fff0ef; color:#c94440; }.status-rectifying { background:#edf4ff; color:#3975b9; }.status-review { background:#f3efff; color:#7950b6; }.status-closed { background:#ecf8f6; color:#137d72; }.safety-danger { color:#d84743 !important; }
.safety-detail-panel { position:sticky; top:18px; min-height:540px; max-height:calc(100vh - 178px); overflow-y:auto; }.safety-detail-empty,.safety-empty { display:grid; min-height:340px; place-items:center; align-content:center; padding:34px; color:#7a8d93; text-align:center; }.safety-detail-empty > span,.safety-empty > span { display:grid; width:60px; height:60px; place-items:center; border-radius:20px; background:#edf8f6; color:#168c80; }.safety-detail-empty svg,.safety-empty svg { width:27px; height:27px; }.safety-detail-empty h3,.safety-empty h3 { margin:16px 0 5px; color:#2d444b; }.safety-detail-empty p,.safety-empty p { margin:0; }.safety-detail-content { padding:24px; }.safety-detail-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding-bottom:18px; border-bottom:1px solid #e4eceb; }.safety-detail-head p { margin:0 0 5px; color:#168c80; font-size:12px; font-weight:800; }.safety-detail-head h2 { margin:0; color:#1e353b; font-size:21px; line-height:1.35; }.safety-detail-actions { display:flex; flex-wrap:wrap; gap:10px; padding:16px 0; }.safety-risk-banner { display:flex; align-items:center; gap:12px; margin-bottom:18px; padding:15px 16px; border-radius:14px; background:#f2f7f6; }.safety-risk-banner > span { display:grid; width:40px; height:40px; place-items:center; border-radius:12px; background:#e7f2f0; color:#168c80; }.safety-risk-banner > span svg { width:20px; height:20px; }.safety-risk-banner.severity-medium { background:#fff8ed; }.safety-risk-banner.severity-medium > span { background:#ffefd5; color:#c67517; }.safety-risk-banner.severity-high,.safety-risk-banner.severity-urgent { background:#fff3f2; }.safety-risk-banner.severity-high > span,.safety-risk-banner.severity-urgent > span { background:#ffe2e0; color:#d84743; }.safety-risk-banner small,.safety-risk-banner strong { display:block; }.safety-risk-banner small { color:#7d8f94; font-size:11px; }.safety-risk-banner strong { margin-top:3px; }.safety-risk-banner > p { margin:0 0 0 auto; color:#657980; font-size:12px; font-weight:700; }.safety-detail-meta { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:0; padding:0 0 18px; border-bottom:1px solid #e4eceb; }.safety-detail-meta div { min-width:0; }.safety-detail-meta dt { color:#819298; font-size:12px; }.safety-detail-meta dd { overflow-wrap:anywhere; margin:5px 0 0; color:#30474e; font-size:14px; font-weight:700; }.safety-detail-section { padding:18px 0 0; }.safety-detail-section h3 { margin:0 0 10px; font-size:15px; }.safety-detail-section > p { margin:0; color:#556a71; line-height:1.75; white-space:pre-wrap; }.safety-detail-section > small { display:block; margin-top:8px; color:#839499; font-size:11px; }.safety-detail-section.rectification,.safety-detail-section.review-close,.safety-detail-section.review-return { margin-top:18px; padding:16px; border-radius:14px; background:#edf8f6; }.safety-detail-section.review-return { background:#fff5e6; }.safety-attachment-links { display:flex; flex-wrap:wrap; gap:8px; padding-top:12px; }.safety-attachment-links a { display:inline-flex; align-items:center; gap:7px; max-width:100%; padding:8px 10px; border-radius:10px; background:#f2f7f6; color:#167e74; text-decoration:none; }.safety-attachment-links svg { width:16px; height:16px; }.safety-attachment-links span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.safety-timeline > div { display:grid; grid-template-columns:12px minmax(0,1fr); gap:10px; position:relative; padding:0 0 18px; }.safety-timeline > div:not(:last-child)::after { position:absolute; top:12px; bottom:0; left:5px; width:1px; background:#dce7e5; content:""; }.safety-timeline i { z-index:1; width:11px; height:11px; margin-top:4px; border:3px solid #cae8e3; border-radius:50%; background:#168c80; }.safety-timeline span { min-width:0; }.safety-timeline strong { color:#334c53; font-size:13px; }.safety-timeline small { float:right; color:#8a999e; font-size:11px; }.safety-timeline p { margin:6px 0 0; color:#61757b; font-size:13px; line-height:1.55; white-space:pre-wrap; }
.safety-editor-dialog { width:min(1040px,calc(100vw - 32px)); }.safety-rectification-dialog,.safety-review-dialog { width:min(900px,calc(100vw - 32px)); }.safety-dialog-scroll { overflow-y:auto; max-height:calc(100vh - 210px); padding:26px 34px 28px; }.safety-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }.safety-form-grid .safety-span-2 { grid-column:1/-1; }.safety-submit-review { display:flex; align-items:center; gap:12px; padding:14px 16px; border:1px solid #dce7e5; border-radius:13px; background:#f8fbfa; cursor:pointer; }.safety-submit-review input { width:20px; height:20px; accent-color:#168c80; }.safety-submit-review span,.safety-submit-review strong,.safety-submit-review small { display:block; }.safety-submit-review small { margin-top:3px; color:#7d8f94; font-size:11px; }.safety-upload-section { margin-top:22px; padding-top:20px; border-top:1px solid #e1eae8; }.safety-upload-section > div:first-child { display:flex; justify-content:space-between; gap:14px; margin-bottom:12px; }.safety-upload-section strong { color:#30474e; }.safety-upload-section span { color:#819298; font-size:12px; }.safety-upload-box { display:flex; position:relative; min-height:74px; align-items:center; justify-content:center; gap:10px; border:1px dashed #86c5bc; border-radius:14px; background:#f8fcfb; color:#168c80; cursor:pointer; }.safety-upload-box input { position:absolute; width:1px; height:1px; opacity:0; }.safety-upload-box svg { width:21px; height:21px; }.safety-upload-box span { color:#168c80; font-size:14px; font-weight:800; }.safety-upload-preview { display:grid; gap:8px; margin-top:10px; }.safety-upload-item { display:grid; grid-template-columns:42px minmax(0,1fr) 34px; gap:10px; align-items:center; padding:9px; border:1px solid #e1eae8; border-radius:12px; }.safety-upload-item > span { display:grid; width:42px; height:42px; overflow:hidden; place-items:center; border-radius:9px; background:#eef7f5; color:#168c80; }.safety-upload-item img { width:100%; height:100%; object-fit:cover; }.safety-upload-item svg { width:19px; height:19px; }.safety-upload-item strong,.safety-upload-item small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.safety-upload-item small { margin-top:3px; color:#8b9a9f; font-size:11px; }.safety-upload-item button { display:grid; width:32px; height:32px; place-items:center; border:0; border-radius:8px; background:transparent; color:#7c8d92; }.safety-upload-item button:hover { background:#fff0ef; color:#d84743; }.safety-review-summary { margin-bottom:22px; padding:16px; border-radius:14px; background:#f2f8f7; }.safety-review-summary strong { display:block; margin-bottom:7px; }.safety-review-summary p { margin:0; color:#556a71; line-height:1.7; white-space:pre-wrap; }
@media(max-width:1220px){.safety-toolbar{grid-template-columns:minmax(260px,1fr) minmax(150px,.45fr) minmax(150px,.45fr)}.safety-toolbar>.btn{grid-column:3}.safety-workspace{grid-template-columns:minmax(0,1.25fr) minmax(350px,.75fr)}.safety-row{grid-template-columns:minmax(0,1fr) 105px 108px 22px}.safety-row>span:nth-child(2){display:none}.safety-row>span:nth-child(3),.safety-row>span:nth-child(4){display:block}.safety-metric{padding:18px}}
@media(max-width:940px){.safety-module{padding:18px 16px 28px}.safety-toolbar{grid-template-columns:1fr 1fr}.safety-search{grid-column:1/-1}.safety-toolbar>.btn{grid-column:auto}.safety-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.safety-metric{min-height:92px;border-bottom:1px solid #e1eae8}.safety-workspace{grid-template-columns:1fr}.safety-detail-panel{position:static;max-height:none}.safety-row{grid-template-columns:minmax(0,1fr) 105px 22px}.safety-row>span:nth-child(3){display:block}.safety-row>span:nth-child(4){display:none}.safety-dialog-scroll{max-height:calc(100dvh - 185px);padding:22px 20px}}
@media(max-width:620px){.safety-module{padding:14px 12px 24px}.safety-toolbar{grid-template-columns:1fr}.safety-search,.safety-filter,.safety-toolbar>.btn{grid-column:1}.safety-metric-grid{gap:10px;overflow:visible;border:0;background:transparent;box-shadow:none}.safety-metric{min-height:92px;padding:14px;border:1px solid #dce7e5!important;border-radius:15px;background:#fff}.safety-metric>span{width:40px;height:40px;border-radius:13px}.safety-metric strong{font-size:23px}.safety-panel-head{padding:16px}.safety-row{min-height:92px;grid-template-columns:minmax(0,1fr) 22px;padding:14px}.safety-row>span:nth-child(2),.safety-row>span:nth-child(3),.safety-row>span:nth-child(4){display:none}.safety-row-main{grid-template-columns:38px minmax(0,1fr)}.safety-row-icon{width:38px;height:38px}.safety-detail-content{padding:19px}.safety-detail-meta{grid-template-columns:1fr}.safety-risk-banner{align-items:flex-start}.safety-risk-banner>p{max-width:100px;text-align:right}.safety-form-grid{grid-template-columns:1fr}.safety-form-grid .safety-span-2{grid-column:auto}.safety-editor-dialog,.safety-rectification-dialog,.safety-review-dialog{width:100%;max-width:none;margin:0;border-radius:18px 18px 0 0}.safety-dialog-scroll{padding:18px 16px 28px}.safety-upload-section>div:first-child{display:block}.safety-upload-section>div:first-child span{display:block;margin-top:5px}.safety-timeline small{float:none;display:block;margin-top:3px}}
