/* =========================================================
   HSE Terpadu — komponen tambahan di atas tema template Nexus (style.css)
   ========================================================= */
.fw-700{ font-weight:700; }
.badge-soft-orange{ background: rgba(251,122,60,.15); color:#e0601f; }
.badge-soft-extreme{ background:#c2123f; color:#fff; }
.bg-soft-orange{ background: rgba(251,122,60,.15) !important; color:#e0601f !important; }
.text-orange{ color:#e0601f !important; }
.nav-menu .nav-link .nav-badge{ font-size:.68rem; }
.nav-menu .nav-link{ white-space:normal; }
.nav-menu .nav-link .nav-label{ line-height:1.25; }

.stat-link .card{ transition: transform .15s ease, box-shadow .15s ease; }
.stat-link:hover .card{ transform: translateY(-2px); box-shadow: var(--shadow-pop); }
.stat-card .stat-icon.bg-soft-primary{ color: var(--brand-primary) !important; }
.stat-card .stat-icon.bg-soft-success{ color: var(--brand-success) !important; }
.stat-card .stat-icon.bg-soft-info{ color: var(--brand-info) !important; }
.stat-card .stat-icon.bg-soft-warning{ color:#d78500 !important; }
.stat-card .stat-icon.bg-soft-danger{ color: var(--brand-danger) !important; }
.stat-card .stat-icon.bg-soft-orange{ color:#e0601f !important; }

.notif-unread{ background: rgba(106,95,219,.07); }
.risk-result .badge{ font-size:.85rem; padding:.55rem .8rem; }

/* Tab navigasi (gaya template) */
.nav-tabs-soft{ border-bottom:1px solid var(--border-color); gap:.25rem; flex-wrap:nowrap; overflow-x:auto; overflow-y:hidden; }
.nav-tabs-soft .nav-link{ border:0; border-bottom:2px solid transparent; color: var(--sidebar-text); font-weight:600; font-size:.84rem; padding:.7rem 1rem; white-space:nowrap; border-radius:0; }
.nav-tabs-soft .nav-link:hover{ color: var(--brand-primary); }
.nav-tabs-soft .nav-link.active{ color: var(--brand-primary); border-bottom-color: var(--brand-primary); background:transparent; }

/* Gerbang kesiapan PTW */
.gate-list{ list-style:none; margin:0; padding:0; }
.gate-list li{ display:flex; gap:.75rem; align-items:flex-start; padding:.6rem 0; border-bottom:1px dashed var(--border-color); }
.gate-list li:last-child{ border-bottom:0; }
.gate-ico{ width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.85rem; }
.gate-ok{ background: rgba(47,191,113,.15); color: var(--brand-success); }
.gate-no{ background: rgba(255,77,106,.14); color: var(--brand-danger); }
.gate-na{ background: rgba(138,143,163,.15); color: var(--text-muted-2); }

/* Peta panas risiko per work area */
.heat-grid{ display:grid; grid-template-columns: repeat(auto-fill, minmax(150px,1fr)); gap:.6rem; }
.heat-cell{ border-radius:.7rem; padding:.7rem .8rem; color:#fff; font-size:.78rem; min-height:78px; display:flex; flex-direction:column; justify-content:space-between; }
.heat-cell .hc-n{ font-size:1.25rem; font-weight:700; line-height:1; }
.heat-none{ background: var(--body-bg); color: var(--text-muted-2); border:1px dashed var(--border-color); }

/* Wizard */
.wizard-steps{ display:flex; gap:.5rem; margin-bottom:1.25rem; flex-wrap:wrap; }
.wizard-steps .ws{ display:flex; align-items:center; gap:.5rem; padding:.45rem .9rem .45rem .45rem; border-radius:2rem; background: var(--surface); border:1px solid var(--border-color); font-weight:600; font-size:.82rem; color: var(--text-muted-2); cursor:pointer; }
.wizard-steps .ws .n{ width:26px;height:26px;border-radius:50%;background: var(--body-bg);display:flex;align-items:center;justify-content:center;font-size:.78rem; }
.wizard-steps .ws.active{ color: var(--brand-primary); border-color: var(--brand-primary); }
.wizard-steps .ws.active .n{ background: var(--brand-primary); color:#fff; }
.wizard-steps .ws.done .n{ background: var(--brand-success); color:#fff; }
.wizard-pane{ display:none; }
.wizard-pane.active{ display:block; }

.progress.thin{ height:6px; border-radius:6px; background: var(--body-bg); }
.kv-list dt{ color: var(--text-muted-2); font-weight:500; font-size:.78rem; }
.kv-list dd{ margin-bottom:.75rem; }
.pre-wrap{ white-space:pre-wrap; }
.photo-thumb{ width:100%; max-height:340px; object-fit:contain; border-radius:.7rem; background: var(--body-bg); }
.qr-box{ background:#fff; padding:14px; border-radius:.8rem; display:inline-block; border:1px solid var(--border-color); }
.qr-box svg{ display:block; width:100%; height:auto; }
.table-hover tbody tr:hover > *{ --bs-table-bg-state: rgba(106,95,219,.04); }
.sticky-actions{ position:sticky; bottom:0; background: var(--surface); border-top:1px solid var(--border-color); padding:.75rem 1rem; z-index:5; }
.cell-clip{ max-width:260px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.legend-dot{ width:10px;height:10px;border-radius:3px;display:inline-block;margin-right:.35rem; }

/* Navigasi bawah mobile */
.mobile-bottom-nav{ display:none; }
@media (max-width: 991.98px){
  .mobile-bottom-nav{
    display:grid; grid-template-columns: repeat(5, 1fr); align-items:center;
    position:fixed; left:0; right:0; bottom:0; z-index:1035; height:64px;
    background: var(--header-bg); border-top:1px solid var(--border-color);
    box-shadow: 0 -4px 20px rgba(30,34,60,.08); padding-bottom: env(safe-area-inset-bottom);
  }
  .mobile-bottom-nav .bn-item{ display:flex; flex-direction:column; align-items:center; gap:2px; font-size:.68rem; color: var(--text-muted-2); font-weight:600; padding:.3rem 0; }
  .mobile-bottom-nav .bn-item i{ font-size:1.2rem; }
  .mobile-bottom-nav .bn-item.active{ color: var(--brand-primary); }
  .mobile-bottom-nav .bn-fab{
    width:54px;height:54px;border-radius:50%;border:0;margin:-24px auto 0;
    background: linear-gradient(135deg, var(--brand-primary), var(--brand-pink)); color:#fff; font-size:1.5rem;
    box-shadow: 0 6px 18px rgba(106,95,219,.45); display:flex;align-items:center;justify-content:center;
  }
  .page-body{ padding-bottom: 5.5rem; }
  .page-footer-bar{ margin-bottom: 64px; }
}

/* Halaman login */
.auth-hse-visual{ background: linear-gradient(155deg, #6a5fdb, #423aa8 55%, #1f6f5c); color:#fff; position:relative; overflow:hidden; }
.auth-hse-visual .deco-circle{ position:absolute; border-radius:50%; background: rgba(255,255,255,.08); }
.auth-hse-visual .feat{ display:flex; gap:.75rem; align-items:flex-start; margin-bottom:1rem; text-align:left; }
.auth-hse-visual .feat i{ font-size:1.2rem; opacity:.9; }

/* Cetak */
@media print{
  .app-sidebar,.app-header,.mobile-bottom-nav,.page-footer-bar,.no-print,.sidebar-backdrop{ display:none !important; }
  .app-content{ margin-left:0 !important; }
  .page-body{ padding:0 !important; }
  body{ background:#fff !important; }
  .card{ box-shadow:none !important; break-inside:avoid; }
}