/* Performance v13 — average score model, no points */
.perf-period-controls{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 14px}
.perf-period-btn{border:1px solid #cbd5e1;background:#f8fafc;color:#334155;border-radius:999px;padding:8px 14px;font-weight:700;font-size:12px;cursor:pointer;min-height:38px}
.perf-period-btn.active{background:#0f5cad;color:#fff;border-color:#0f5cad}
.perf-color-dot{display:inline-block;width:10px;height:10px;border-radius:999px;margin-right:7px;vertical-align:middle;box-shadow:0 0 0 2px rgba(15,92,173,.12)}
.perf-score-meter{height:8px;background:#eef2f7;border-radius:999px;overflow:hidden;margin-top:7px;max-width:360px}
.perf-score-fill{display:block;height:100%;border-radius:999px;transition:width .25s ease}
.perf-chart-card{height:320px;background:var(--card,#fff);border:1px solid #e6edf3;border-radius:12px;padding:12px;margin-top:8px}
.perf-chart-card canvas{width:100%!important;height:100%!important}
body.dark-mode .perf-period-btn{background:#1e293b;border-color:#334155;color:#cbd5e1}
body.dark-mode .perf-period-btn.active{background:#0f5cad;color:#fff;border-color:#0f5cad}
body.dark-mode .perf-chart-card{background:#1e293b;border-color:#334155}
body.dark-mode .perf-score-meter{background:#334155}

/* Performance quality chips — criteria breakdown per officer */
.perf-chip{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;color:var(--text-soft,#475569);background:var(--chip-bg,#f1f5f9);padding:3px 9px;border-radius:14px;white-space:nowrap}
body.dark-mode .perf-chip{background:rgba(148,163,184,0.15);color:#cbd5e1}
.perf-quality{font-size:12px}
.perf-criteria-legend{background:var(--card-bg,#fff);border:1px solid var(--border-light,#e5e7eb);border-radius:12px;padding:14px 16px;margin-bottom:16px;font-size:13px;line-height:1.6}
.perf-criteria-legend h4{margin:0 0 8px;font-size:14px;display:flex;align-items:center;gap:6px}
.perf-criteria-legend .crit-row{display:flex;justify-content:space-between;gap:10px;padding:3px 0;border-bottom:1px dashed var(--border-light,#eef2f7)}
.perf-criteria-legend .crit-row:last-child{border-bottom:none}
.perf-criteria-legend .crit-weight{font-weight:700;color:var(--accent,#0f5cad)}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:"Lato",system-ui,sans-serif;background:#e9edf5;color:#1e293b;-webkit-font-smoothing:antialiased}
:root{--primary-start:#007b8f;--primary-end:#0063c7;--card-bg:#ffffff;--card-border:rgba(15,23,42,0.06);--surface-soft:#f5f7fb;--nav-bg:#ffffff;--accent-green:#00b36b;--accent-orange:#ff8f2c;--accent-red:#e4363a;--accent-blue:#1c84ff;--text-main:#111827;--text-soft:#6b7280;--shadow-soft:0 16px 30px rgba(15,23,42,0.12);--radius-large:28px;--radius-card:18px}
body.dark-mode{background:radial-gradient(circle at top,#0f172a,#020617 52%);color:#e5e7eb}
body.dark-mode .app-header{box-shadow:0 18px 40px rgba(0,0,0,0.6)}
body.dark-mode .content-area{background:linear-gradient(180deg,#020617 0%,#020617 100%)}
body.dark-mode .home-card,body.dark-mode .obs-summary-bar,body.dark-mode .obs-filters,body.dark-mode .library-card,body.dark-mode .tool-card,body.dark-mode .admin-card{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2);color:#e5e7eb}
body.dark-mode .accordion{background:linear-gradient(90deg,#020617 0%,#111827 100%);color:#e5e7eb}
body.dark-mode .panel{background:rgba(15,23,42,0.96);color:#e5e7eb}
body.dark-mode .nav-bar{background:linear-gradient(180deg,rgba(30,41,59,0.98) 0%,rgba(15,23,42,0.98) 100%);box-shadow:0 -10px 40px rgba(0,0,0,0.5);border-color:rgba(148,163,184,0.2)}
body.dark-mode .nav-button{color:#94a3b8}
body.dark-mode .nav-button:hover{background:rgba(14,165,233,0.15);color:#38bdf8}
body.dark-mode .nav-button.active{background:linear-gradient(135deg,#0891b2,#0ea5e9);color:#fff}
body.dark-mode .nav-button[data-tab="HomeTab"] .nav-icon{color:#4ade80}
body.dark-mode .nav-button[data-tab="ObservationsTab"] .nav-icon{color:#60a5fa}
body.dark-mode .nav-button[data-tab="PermitsTab"] .nav-icon{color:#fbbf24}
body.dark-mode .nav-button[data-tab="EquipmentTab"] .nav-icon{color:#a78bfa}
body.dark-mode .nav-button[data-tab="MoreTab"] .nav-icon{color:#94a3b8}
body.dark-mode .nav-button.active .nav-icon{color:#fff}
body.dark-mode .obs-card{background:rgba(15,23,42,0.96);color:#e5e7eb;border-color:rgba(148,163,184,0.3)}
body.dark-mode .modal-content{background:#1e293b;color:#e5e7eb}
body.dark-mode input,body.dark-mode select,body.dark-mode textarea{background:#0f172a;color:#e5e7eb;border-color:rgba(148,163,184,0.4)}
body.dark-mode .more-menu{background:rgba(30,41,59,0.95);border-color:rgba(148,163,184,0.25);backdrop-filter:blur(12px)}
body.dark-mode .more-menu button{color:#e5e7eb}
body.dark-mode .more-menu button:hover{background:linear-gradient(135deg,rgba(59,130,246,0.15),rgba(14,165,233,0.15))}
body.dark-mode .tool-section{background:rgba(15,23,42,0.96);color:#e5e7eb}
body.dark-mode .tool-section table{color:#e5e7eb}
body.dark-mode .tool-section td,body.dark-mode .tool-section th{border-color:rgba(148,163,184,0.3)}
.app-container{max-width:1280px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column}
.app-header{margin:.75rem .75rem 0;padding:1rem 1.25rem;border-radius:999px;background:linear-gradient(90deg,var(--primary-start),var(--primary-end));color:#fff;display:flex;align-items:center;justify-content:space-between;box-shadow:0 18px 35px rgba(15,23,42,0.35);position:sticky;top:0;z-index:30}
.header-title-area{display:flex;align-items:center;gap:.75rem}
.header-logo{width:46px;height:46px;border-radius:999px;object-fit:cover;background:#fff;padding:3px;box-shadow:0 0 0 2px rgba(255,255,255,0.5)}
.header-text h1{font-family:"Poppins",sans-serif;font-size:1.1rem;font-weight:700;line-height:1.2}
.header-subtitle{font-size:.75rem;opacity:.9;margin-top:.1rem}
.header-actions{display:flex;align-items:center;gap:.5rem}
.points-display{display:flex;align-items:center;gap:.3rem;background:rgba(255,255,255,0.2);padding:.3rem .6rem;border-radius:999px;font-size:.8rem;font-weight:600}
.points-display i{color:#fbbf24}
.mode-toggle,.news-toggle,.logout-btn{width:38px;height:38px;border-radius:999px;border:2px solid rgba(255,255,255,0.5);background:rgba(15,23,42,0.25);display:flex;align-items:center;justify-content:center;color:#ffeaa7;cursor:pointer;transition:transform .2s,box-shadow .2s}
.mode-toggle:hover,.news-toggle:hover,.logout-btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(0,0,0,0.35)}
.logout-btn{color:#f87171;border-color:#f87171}
.content-area{flex:1;overflow-y:auto;padding:.5rem .75rem 5.5rem}
.tab-content{display:none}
.tab-content.active{display:block}
.nav-bar{position:fixed;bottom:0;left:0;right:0;margin:.75rem;padding:.35rem .5rem;border-radius:999px;background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%);display:flex;align-items:center;justify-content:space-between;gap:.35rem;box-shadow:0 -8px 40px rgba(15,23,42,0.18),0 -2px 10px rgba(15,23,42,0.08);z-index:40;border:1px solid rgba(148,163,184,0.15)}
.nav-button{flex:1;border-radius:20px;border:none;padding:.55rem .4rem .4rem;background:transparent;color:#64748b;font-size:.7rem;font-weight:600;display:flex;flex-direction:column;align-items:center;gap:.2rem;cursor:pointer;transition:all .25s ease}
.nav-button .nav-icon{font-size:1.15rem;transition:all .25s ease}
.nav-button:hover{color:#0ea5e9;background:rgba(14,165,233,0.08)}
.nav-button:hover .nav-icon{transform:scale(1.1)}
.nav-button.active{background:linear-gradient(135deg,#0891b2,#0ea5e9);color:#fff;transform:translateY(-2px);box-shadow:0 4px 15px rgba(14,165,233,0.35)}
.nav-button.active .nav-icon{transform:scale(1.05)}
.nav-button[data-tab="HomeTab"] .nav-icon{color:#22c55e}
.nav-button[data-tab="ObservationsTab"] .nav-icon{color:#3b82f6}
.nav-button[data-tab="PermitsTab"] .nav-icon{color:#f59e0b}
.nav-button[data-tab="EquipmentTab"] .nav-icon{color:#8b5cf6}
.nav-button[data-tab="MoreTab"] .nav-icon{color:#64748b}
.nav-button.active .nav-icon{color:#fff}
.more-menu{position:fixed;bottom:5.5rem;right:.75rem;background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%);border-radius:24px;box-shadow:0 20px 60px rgba(15,23,42,0.25),0 8px 20px rgba(15,23,42,0.1);padding:.75rem;z-index:50;border:1px solid rgba(148,163,184,0.15);min-width:220px;backdrop-filter:blur(16px)}
.more-menu::before{content:'';position:absolute;bottom:-8px;right:24px;width:16px;height:16px;background:#fff;transform:rotate(45deg);box-shadow:3px 3px 6px rgba(15,23,42,0.08);border-right:1px solid rgba(148,163,184,0.15);border-bottom:1px solid rgba(148,163,184,0.15)}
.more-menu button{display:flex;align-items:center;gap:.85rem;width:100%;padding:.85rem 1rem;border:none;background:none;font-size:.9rem;cursor:pointer;border-radius:16px;font-weight:600;transition:all .2s;color:#334155}
.more-menu button:hover{background:linear-gradient(135deg,rgba(14,165,233,0.12),rgba(6,182,212,0.08));transform:translateX(4px);color:#0891b2}
.more-menu button i{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:10px;font-size:.95rem;box-shadow:0 3px 8px rgba(0,0,0,0.12)}
.more-menu button:nth-child(1) i{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff}
.more-menu button:nth-child(2) i{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}
.more-menu button:nth-child(3) i{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}
.more-menu button:nth-child(4) i{background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff}
.more-menu button:nth-child(5) i{background:linear-gradient(135deg,#ec4899,#db2777);color:#fff}
.more-menu button:nth-child(6) i{background:linear-gradient(135deg,#64748b,#475569);color:#fff}
.more-menu button:nth-child(7) i{background:linear-gradient(135deg,#14b8a6,#0d9488);color:#fff}
.more-menu button:nth-child(8) i{background:linear-gradient(135deg,#0891b2,#0e7490);color:#fff}
.more-menu .admin-menu-btn{border-top:1px solid rgba(148,163,184,0.2);margin-top:.5rem;padding-top:1rem}
.more-menu .admin-menu-btn i{background:linear-gradient(135deg,#0891b2,#0284c7)!important;color:#fff}
.home-kpi-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-bottom:.9rem}
.home-kpi-card{border-radius:20px;padding:.7rem .9rem;color:#fff;box-shadow:0 12px 26px rgba(0,0,0,0.2)}
.home-kpi-card.kpi-green{background:linear-gradient(135deg,#15803d,#22c55e)}
.home-kpi-card.kpi-blue{background:linear-gradient(135deg,#0369a1,#0ea5e9)}
.home-kpi-card.kpi-orange{background:linear-gradient(135deg,#c2410c,#f97316)}
.home-kpi-label{font-size:.65rem;text-transform:uppercase;letter-spacing:.04em;opacity:.95}
.home-kpi-value{font-size:1.4rem;font-weight:700;margin-top:.15rem}
.month-color-section{background:linear-gradient(135deg,rgba(15,23,42,0.03) 0%,rgba(30,64,175,0.06) 100%);border-radius:16px;padding:.75rem 1rem;margin:.5rem 0 .85rem;border:1px solid rgba(99,102,241,0.15);display:flex;align-items:center;justify-content:space-between;gap:.75rem;cursor:pointer;transition:all .2s ease}
.month-color-section:hover{background:linear-gradient(135deg,rgba(15,23,42,0.05) 0%,rgba(30,64,175,0.1) 100%);transform:translateY(-1px);box-shadow:0 6px 20px rgba(15,23,42,0.12)}
.month-color-left{display:flex;align-items:center;gap:.65rem}
.month-color-label{font-size:.75rem;color:var(--text-soft);text-transform:uppercase;letter-spacing:.08em;font-weight:600}
.month-color-badge{padding:.5rem 1.4rem;border-radius:14px;font-weight:800;font-size:1rem;text-transform:uppercase;letter-spacing:.8px;box-shadow:0 6px 20px rgba(0,0,0,0.25),inset 0 1px 0 rgba(255,255,255,0.3);display:inline-flex;align-items:center;gap:.6rem;position:relative;overflow:hidden;transition:all .2s ease}
.month-color-badge::after{content:'';position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,0.2) 0%,rgba(255,255,255,0) 100%);pointer-events:none}
.month-color-badge.color-red{background:linear-gradient(145deg,#f87171 0%,#ef4444 30%,#dc2626 70%,#b91c1c 100%);color:#fff;border:none;text-shadow:0 1px 2px rgba(0,0,0,0.2)}
.month-color-badge.color-blue{background:linear-gradient(145deg,#60a5fa 0%,#3b82f6 30%,#2563eb 70%,#1d4ed8 100%);color:#fff;border:none;text-shadow:0 1px 2px rgba(0,0,0,0.2)}
.month-color-badge.color-green{background:linear-gradient(145deg,#4ade80 0%,#22c55e 30%,#16a34a 70%,#15803d 100%);color:#fff;border:none;text-shadow:0 1px 2px rgba(0,0,0,0.2)}
.month-color-badge.color-yellow{background:linear-gradient(145deg,#facc15 0%,#eab308 30%,#ca8a04 70%,#a16207 100%);color:#fff;border:none;text-shadow:0 1px 2px rgba(0,0,0,0.2)}
.month-color-badge.color-white{background:linear-gradient(145deg,#ffffff 0%,#f8fafc 30%,#e2e8f0 70%,#cbd5e1 100%);color:#334155;border:1px solid #cbd5e1;text-shadow:none}
.month-color-hint{font-size:.7rem;color:var(--text-soft);display:flex;align-items:center;gap:.35rem;opacity:.7}
.month-color-hint i{font-size:.65rem}
.color-schedule-modal{position:fixed;inset:0;background:rgba(15,23,42,0.85);z-index:200;display:none;align-items:center;justify-content:center;padding:1rem;backdrop-filter:blur(4px)}
.color-schedule-modal.active{display:flex}
.color-schedule-content{background:#fff;border-radius:20px;width:100%;max-width:400px;max-height:85vh;overflow:hidden;box-shadow:0 25px 60px rgba(0,0,0,0.4)}
.color-schedule-header{background:linear-gradient(135deg,#1e3a5f 0%,#0f172a 100%);color:#fff;padding:1.2rem 1.5rem;display:flex;align-items:center;justify-content:space-between}
.color-schedule-header h3{font-size:1.1rem;font-weight:700;display:flex;align-items:center;gap:.5rem}
.color-schedule-close{width:36px;height:36px;border-radius:50%;border:none;background:rgba(255,255,255,0.15);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;transition:all .2s}
.color-schedule-close:hover{background:rgba(255,255,255,0.25);transform:scale(1.1)}
.color-schedule-body{padding:1.25rem;overflow-y:auto;max-height:calc(85vh - 80px)}
.color-schedule-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}
.color-month-card{background:var(--card-bg);border-radius:14px;padding:.75rem;text-align:center;border:1px solid var(--card-border);transition:all .2s}
.color-month-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,0.1)}
.color-month-name{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-soft);margin-bottom:.5rem}
.color-month-badge{width:36px;height:36px;border-radius:10px;margin:0 auto;display:flex;align-items:center;justify-content:center;font-size:.9rem;color:#fff;box-shadow:0 4px 10px rgba(0,0,0,0.2)}
.color-month-badge.bg-green{background:linear-gradient(145deg,#22c55e,#16a34a)}
.color-month-badge.bg-red{background:linear-gradient(145deg,#ef4444,#dc2626)}
.color-month-badge.bg-blue{background:linear-gradient(145deg,#3b82f6,#2563eb)}
.color-month-badge.bg-yellow{background:linear-gradient(145deg,#eab308,#ca8a04)}
.color-schedule-legend{margin-top:1.25rem;padding-top:1rem;border-top:1px solid var(--card-border)}
.color-schedule-legend h4{font-size:.8rem;font-weight:600;color:var(--text-soft);margin-bottom:.75rem;text-transform:uppercase;letter-spacing:.05em}
.legend-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}
.legend-item{display:flex;align-items:center;gap:.5rem;font-size:.75rem;color:var(--text-main)}
.legend-dot{width:14px;height:14px;border-radius:4px}
.legend-dot.green{background:#22c55e}
.legend-dot.red{background:#ef4444}
.legend-dot.blue{background:#3b82f6}
.legend-dot.yellow{background:#eab308}
.color-month-card.current-month{background:linear-gradient(135deg,rgba(59,130,246,0.1) 0%,rgba(99,102,241,0.15) 100%);border:2px solid #3b82f6;transform:scale(1.05);box-shadow:0 8px 25px rgba(59,130,246,0.25)}
.color-month-card.current-month .color-month-name{color:#3b82f6;font-weight:700}
.color-month-card.current-month::after{content:'Current';position:absolute;top:-8px;right:-8px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;font-size:.55rem;padding:.2rem .4rem;border-radius:6px;font-weight:600;text-transform:uppercase;letter-spacing:.03em}
.color-month-card{position:relative}
.home-card{background:var(--card-bg);border-radius:var(--radius-card);margin-bottom:.9rem;border:1px solid var(--card-border);padding:.85rem .95rem;box-shadow:0 8px 22px rgba(15,23,42,0.06)}
.home-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.45rem}
.home-card-header h3{font-size:.95rem;font-weight:700;display:flex;align-items:center;gap:.4rem}
.home-card-header i{color:var(--accent-orange)}
.highlight-card{border-left:4px solid #fbbf24;background:radial-gradient(circle at top left,#fffbeb,#fef9c3)}
.link-button{border:none;background:transparent;color:var(--accent-orange);font-size:.75rem;cursor:pointer;text-transform:uppercase;letter-spacing:.08em}
.accordion{width:100%;border:none;text-align:left;padding:.7rem .9rem;margin-top:.45rem;border-radius:18px;background:linear-gradient(90deg,var(--primary-start),var(--primary-end));color:#fff;font-size:.85rem;font-weight:600;display:flex;align-items:center;gap:.6rem;cursor:pointer;box-shadow:0 10px 24px rgba(15,23,42,0.35)}
.accordion i{width:22px;text-align:center}
.panel{padding:.6rem .85rem .8rem;border-radius:0 0 16px 16px;background:rgba(248,250,252,0.98);border:1px solid rgba(148,163,184,0.35);border-top:none;display:none;font-size:.82rem;margin-bottom:.3rem;max-height:260px;overflow-y:auto}
.panel ol,.panel ul{padding-left:1.35rem;margin-bottom:.25rem}
.panel li{margin-bottom:.25rem}
.gps-btn{margin-top:.5rem;padding:.45rem .7rem;border-radius:999px;border:none;background:#0ea5e9;color:#fff;font-size:.8rem;display:inline-flex;align-items:center;gap:.35rem;cursor:pointer}
.gps-result{margin-top:.35rem;font-size:.78rem;color:var(--text-soft)}
.links-list{list-style:none;padding:0}
.links-list li{margin-bottom:.4rem}
.links-list a{color:var(--accent-blue);text-decoration:none}
.obs-summary-bar{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-bottom:.9rem}
.obs-summary-item{padding:.65rem .7rem;border-radius:18px;color:#fff;text-align:left;box-shadow:0 10px 22px rgba(0,0,0,0.3)}
.obs-summary-item.summary-purple{background:linear-gradient(135deg,#312e81,#6366f1)}
.obs-summary-item.summary-green{background:linear-gradient(135deg,#15803d,#22c55e)}
.obs-summary-item.summary-red{background:linear-gradient(135deg,#991b1b,#ef4444)}
.obs-summary-item.summary-blue{background:linear-gradient(135deg,#0369a1,#0ea5e9)}
.obs-summary-item.summary-orange{background:linear-gradient(135deg,#c2410c,#f97316)}
.obs-summary-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em}
.obs-summary-value{font-size:1.25rem;font-weight:700}
.obs-filters{background:var(--card-bg);border-radius:20px;padding:.8rem;border:1px solid var(--card-border);box-shadow:0 8px 18px rgba(15,23,42,0.06);margin-bottom:.9rem}
.obs-filter-row{display:flex;gap:.45rem;margin-bottom:.5rem}
.obs-filter-chip{flex:1;padding:.45rem .35rem;border-radius:999px;border:none;background:#020617;color:#e5e7eb;font-size:.75rem;cursor:pointer;opacity:.55}
.obs-filter-chip.active{background:#22c55e;color:#fff;opacity:1}
.obs-filter-row select,.obs-filter-row input[type="text"]{flex:1;border-radius:999px;border:1px solid rgba(148,163,184,0.7);padding:.4rem .6rem;font-size:.8rem}
#observationsList,#permitsList,#equipmentList,#tbtList{display:flex;flex-direction:column;gap:.5rem}
.obs-card{position:relative;overflow:hidden;border-radius:18px;background:linear-gradient(135deg,#f9fafb,#e5edf9);color:var(--text-main);padding:.55rem .7rem .65rem .9rem;border:1px solid var(--card-border);box-shadow:0 8px 18px rgba(15,23,42,0.08);cursor:pointer;transition:transform .12s,box-shadow .12s}
.obs-card:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(15,23,42,0.14)}
.obs-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#cbd5f5}
.obs-card.risk-high::before{background:#ef4444}
.obs-card.risk-medium::before{background:#f97316}
.obs-card.risk-low::before{background:#22c55e}
.obs-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.2rem}
.obs-card-badges{display:flex;align-items:center;gap:.3rem}
.badge{border-radius:999px;padding:.12rem .55rem;font-size:.7rem;font-weight:600}
.badge-high{background:#cc2900;color:#fff}
.badge-medium{background:#ff6600;color:#fff}
.badge-low{background:#00b300;color:#fff}
.status-pill{border-radius:999px;padding:.12rem .55rem;font-size:.7rem;font-weight:600}
.status-pill.status-open{background:#00b300;color:#fff}
.status-pill.status-closed{background:#cc2900;color:#fff}
.obs-card-title{font-size:.82rem;font-weight:600}
.obs-card-date{font-size:.75rem;opacity:.85}
.obs-description{font-size:.78rem;color:var(--text-soft);margin-top:.2rem}
.obs-chip-row{display:flex;flex-wrap:wrap;gap:.25rem;font-size:.7rem;margin-top:.3rem}
.obs-chip{border-radius:999px;padding:.12rem .45rem;border:1px solid rgba(148,163,184,0.7);background:rgba(148,163,184,0.1)}
.obs-open-sheet-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem 1rem;border-radius:999px;background:linear-gradient(90deg,var(--primary-start),var(--primary-end));color:#fff;font-size:.8rem;font-weight:600;border:none;cursor:pointer;box-shadow:0 8px 20px rgba(0,0,0,0.2)}
.modal{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.6);z-index:100;align-items:center;justify-content:center;padding:1rem}
.modal.show{display:flex}
.modal-content{background:#fff;border-radius:20px;padding:1.2rem;max-width:500px;width:100%;max-height:85vh;overflow-y:auto;position:relative}
.modal-content h2{display:flex;align-items:center;gap:.5rem;font-size:1.1rem;margin-bottom:1rem}
.modal-content h2 i{color:var(--accent-orange)}
.close-btn{position:absolute;top:.8rem;right:.8rem;width:32px;height:32px;border-radius:999px;border:none;background:rgba(148,163,184,0.2);font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center}
.auth-modal{text-align:center}
.auth-tabs{display:flex;gap:.5rem;margin-bottom:1rem}
.auth-tab{flex:1;padding:.5rem;border:none;background:rgba(148,163,184,0.2);border-radius:999px;cursor:pointer;font-weight:600}
.auth-tab.active{background:linear-gradient(90deg,var(--primary-start),var(--primary-end));color:#fff}
.auth-form{display:flex;flex-direction:column;gap:.6rem}
.auth-form input{padding:.6rem .8rem;border:1px solid rgba(148,163,184,0.5);border-radius:12px;font-size:.9rem}
.password-field-wrapper{position:relative;display:flex;align-items:center}
.password-field-wrapper input{width:100%;padding-right:2.6rem}
.password-toggle-btn{position:absolute;right:.6rem;top:50%;transform:translateY(-50%);background:none;border:none;padding:.3rem;cursor:pointer;color:#64748b;display:flex;align-items:center;justify-content:center;line-height:1}
.password-toggle-btn:hover{color:#334155}
.password-toggle-btn:focus{outline:none}
.auth-submit-btn{padding:.6rem;border:none;border-radius:12px;background:linear-gradient(90deg,var(--primary-start),var(--primary-end));color:#fff;font-weight:600;cursor:pointer}
.auth-error{color:#ef4444;font-size:.8rem;min-height:1.2rem}
.form-modal form{display:flex;flex-direction:column;gap:.75rem}
.form-modal input,.form-modal select,.form-modal textarea{padding:.65rem .9rem;border:1px solid rgba(148,163,184,0.3);border-radius:12px;font-size:.85rem;background:linear-gradient(135deg,rgba(248,250,252,0.8),rgba(241,245,249,0.6));transition:all .25s}
.form-modal input:focus,.form-modal select:focus,.form-modal textarea:focus{border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,0.1);outline:none;background:#fff}
.form-modal .form-row{display:flex;gap:.75rem}
.form-modal .form-row>*{flex:1}
.form-modal label{font-size:.75rem;color:#475569;margin-bottom:.3rem;display:flex;align-items:center;gap:.4rem;font-weight:500}
.form-modal label i{color:#3b82f6;font-size:.7rem}
.form-modal h2{display:flex;align-items:center;gap:.6rem;font-size:1.15rem;margin-bottom:.75rem;padding-bottom:.75rem;border-bottom:2px solid;border-image:linear-gradient(90deg,#3b82f6,#8b5cf6) 1}
.form-modal h2 i{background:linear-gradient(135deg,#3b82f6,#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-size:1.1rem}
.file-upload-area{border:2px dashed rgba(148,163,184,0.5);border-radius:12px;padding:.6rem;text-align:center}
.file-upload-area label{font-size:.8rem;color:var(--text-soft);display:block;margin-bottom:.3rem}
.file-upload-area input{font-size:.75rem}
.evidence-upload-section{margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(148,163,184,0.2)}
.evidence-label{font-size:.9rem!important;color:#1e3a5f!important;font-weight:600;display:flex;align-items:center;gap:.4rem}
.evidence-label i{color:#3b82f6}
.evidence-hint{font-size:.75rem;color:var(--text-soft);margin:.3rem 0 .6rem}
.evidence-dropzone{border:2px dashed rgba(59,130,246,0.4);background:linear-gradient(135deg,rgba(59,130,246,0.05),rgba(14,165,233,0.05));border-radius:16px;padding:1.5rem;display:flex;flex-direction:column;align-items:center;gap:.5rem;cursor:pointer;transition:all .2s;position:relative;overflow:hidden}
.evidence-dropzone:hover,.evidence-dropzone.dragover{border-color:#3b82f6;background:linear-gradient(135deg,rgba(59,130,246,0.1),rgba(14,165,233,0.1))}
.evidence-dropzone i{font-size:2rem;color:#3b82f6;pointer-events:none}
.evidence-dropzone span{font-size:.85rem;color:var(--text-main);pointer-events:none}
.evidence-dropzone .upload-formats{font-size:.7rem;color:var(--text-soft);opacity:.8;pointer-events:none}
.evidence-dropzone input[type="file"]{position:absolute;width:100%;height:100%;opacity:0;cursor:pointer;top:0;left:0}
.evidence-list{margin-top:.75rem}
.evidence-list .attachment-preview-item{background:linear-gradient(135deg,rgba(59,130,246,0.08),rgba(14,165,233,0.08));border:1px solid rgba(59,130,246,0.2);border-radius:10px;padding:.5rem .75rem;margin-bottom:.4rem}
.evidence-list .attachment-preview-item i{color:#3b82f6}
.evidence-section{background:linear-gradient(135deg,rgba(59,130,246,0.05),rgba(14,165,233,0.05));border-radius:12px;padding:1rem;margin-top:1rem;border:1px solid rgba(59,130,246,0.15)}
.evidence-section h4{color:#1e3a5f;font-size:.9rem;display:flex;align-items:center;gap:.4rem;margin-bottom:.3rem}
.evidence-section h4 i{color:#3b82f6}
.evidence-desc{font-size:.75rem;color:var(--text-soft);margin-bottom:.75rem}
.evidence-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.75rem}
.evidence-item{background:#fff;border-radius:10px;padding:.75rem;border:1px solid rgba(148,163,184,0.2);display:flex;align-items:center;gap:.6rem;transition:all .2s}
.evidence-item:hover{border-color:#3b82f6;box-shadow:0 4px 12px rgba(59,130,246,0.15)}
.evidence-item-icon{width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1rem}
.evidence-item-icon.pdf{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}
.evidence-item-icon.doc{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}
.evidence-item-icon.img{background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff}
.evidence-item-icon.default{background:linear-gradient(135deg,#6b7280,#4b5563);color:#fff}
.evidence-item-info{flex:1;min-width:0}
.evidence-item-name{font-size:.8rem;font-weight:500;color:var(--text-main);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.evidence-item-size{font-size:.7rem;color:var(--text-soft)}
.evidence-item a{color:#3b82f6;text-decoration:none}
.submit-btn{padding:.6rem;border:none;border-radius:12px;background:linear-gradient(90deg,#15803d,#22c55e);color:#fff;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.4rem}
.table-scroll{overflow-x:auto}
.emergency-table{width:100%;border-collapse:collapse;font-size:.8rem}
.emergency-table th,.emergency-table td{padding:.4rem .5rem;border-bottom:1px solid rgba(148,163,184,0.3);text-align:left}
.emergency-table th{background:rgba(148,163,184,0.1);font-weight:600}
.emergency-table a{color:var(--accent-blue);text-decoration:none}
.library-grid,.tools-grid,.admin-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;margin-bottom:1rem}
.library-card,.tool-card,.admin-card{background:var(--card-bg);border-radius:16px;padding:1.25rem 1rem;text-align:center;cursor:pointer;border:1px solid var(--card-border);box-shadow:0 8px 20px rgba(0,0,0,0.06);transition:all .2s ease}
.library-card:hover,.tool-card:hover,.admin-card:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(0,0,0,0.12);border-color:var(--accent-blue)}
.library-card i,.tool-card i,.admin-card i{font-size:2rem;margin-bottom:.6rem;display:block}
.library-card i{font-size:2.2rem;margin-bottom:.75rem;background:linear-gradient(135deg,#3b82f6,#6366f1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.library-card h3{font-size:1rem;font-weight:700;margin-bottom:.4rem;color:var(--text-main)}
.library-card p{font-size:.8rem;color:var(--text-soft);line-height:1.5}
.library-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;border-radius:16px 16px 0 0;opacity:0;transition:opacity .2s}
.library-card{position:relative;overflow:hidden;padding:1.5rem 1.25rem}
.library-card:hover::before{opacity:1}
.library-card:nth-child(1) i{background:linear-gradient(135deg,#22c55e,#16a34a);-webkit-background-clip:text;background-clip:text}
.library-card:nth-child(1)::before{background:linear-gradient(90deg,#22c55e,#16a34a)}
.library-card:nth-child(2) i{background:linear-gradient(135deg,#f59e0b,#d97706);-webkit-background-clip:text;background-clip:text}
.library-card:nth-child(2)::before{background:linear-gradient(90deg,#f59e0b,#d97706)}
.library-card:nth-child(3) i{background:linear-gradient(135deg,#ef4444,#dc2626);-webkit-background-clip:text;background-clip:text}
.library-card:nth-child(3)::before{background:linear-gradient(90deg,#ef4444,#dc2626)}
.library-card:nth-child(4) i{background:linear-gradient(135deg,#3b82f6,#2563eb);-webkit-background-clip:text;background-clip:text}
.library-card:nth-child(4)::before{background:linear-gradient(90deg,#3b82f6,#2563eb)}
.library-card:nth-child(5) i{background:linear-gradient(135deg,#8b5cf6,#7c3aed);-webkit-background-clip:text;background-clip:text}
.library-card:nth-child(5)::before{background:linear-gradient(90deg,#8b5cf6,#7c3aed)}
.tool-card span,.admin-card span{font-size:.8rem;font-weight:600}
#libraryContent{margin-top:1rem}
.back-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .8rem;border:none;border-radius:999px;background:rgba(148,163,184,0.2);font-size:.8rem;cursor:pointer;margin-bottom:.6rem}
#librarySearch{width:100%;padding:.5rem .8rem;border:1px solid rgba(148,163,184,0.5);border-radius:999px;margin-bottom:.8rem;font-size:.85rem}
#libraryList{display:flex;flex-direction:column;gap:.5rem}
.library-item{padding:.6rem .8rem;background:var(--card-bg);border-radius:12px;border:1px solid var(--card-border);display:flex;align-items:center;justify-content:space-between}
.library-item-title{font-size:.85rem;font-weight:500}
.library-item a{color:var(--accent-blue);font-size:.8rem}
.tool-section{background:var(--card-bg);border-radius:16px;padding:1rem;margin-top:.8rem;border:1px solid var(--card-border)}
.tool-section h3{display:flex;align-items:center;gap:.5rem;font-size:1rem;margin-bottom:.8rem}
.tool-section h3 i{color:var(--accent-orange)}
.calculator-form{display:flex;flex-direction:column;gap:.5rem}
.calculator-form label{font-size:.8rem;color:var(--text-soft)}
.calculator-form input{padding:.5rem;border:1px solid rgba(148,163,184,0.5);border-radius:10px;font-size:.9rem}
.result-card{background:rgba(148,163,184,0.1);border-radius:12px;padding:.8rem;text-align:center;margin-top:.5rem}
.result-label{font-size:.75rem;color:var(--text-soft);text-transform:uppercase}
.result-value{font-size:1.5rem;font-weight:700;margin:.2rem 0}
.result-status{font-size:.8rem}
.wind-limits{margin-top:.8rem;font-size:.8rem}
.wind-limits h4{margin-bottom:.4rem}
.wind-limits ul{padding-left:1.2rem}
.wind-limits li{margin-bottom:.3rem}
.training-matrix table,.risk-matrix table{width:100%;border-collapse:collapse;font-size:.75rem}
.training-matrix th,.training-matrix td,.risk-matrix th,.risk-matrix td{padding:.4rem;border:1px solid rgba(148,163,184,0.3);text-align:center}
.training-matrix th,.risk-matrix th{background:rgba(148,163,184,0.15);font-weight:600}
.risk-low{background:#dcfce7;color:#15803d}
.risk-medium{background:#fef9c3;color:#b45309}
.risk-high{background:#fee2e2;color:#b91c1c}
.risk-extreme{background:#7c2d12;color:#fff}
.life-saving-rules{display:flex;flex-direction:column;gap:.5rem}
.rule-item{display:flex;align-items:center;gap:.5rem;padding:.5rem;background:rgba(148,163,184,0.1);border-radius:10px;font-size:.8rem}
.rule-item i{color:#22c55e}
.challenges-intro{font-size:.85rem;color:var(--text-soft);margin-bottom:.8rem}
#challengesList{display:flex;flex-direction:column;gap:.5rem}
.challenge-card{background:rgba(148,163,184,0.1);border-radius:12px;padding:.8rem;display:flex;justify-content:space-between;align-items:center}
.challenge-info h4{font-size:.85rem;margin-bottom:.2rem}
.challenge-info p{font-size:.75rem;color:var(--text-soft)}
.challenge-points{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff;padding:.3rem .6rem;border-radius:999px;font-size:.75rem;font-weight:600}
.challenge-complete-btn{padding:.4rem .8rem;border:none;border-radius:999px;background:linear-gradient(90deg,var(--primary-start),var(--primary-end));color:#fff;font-size:.75rem;cursor:pointer;margin-top:.4rem}
.challenge-completed{color:#22c55e;font-size:.8rem;font-weight:600}
.challenge-badge{display:inline-flex;align-items:center;gap:.3rem;margin-top:.4rem;padding:.25rem .6rem;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff;border-radius:999px;font-size:.7rem;font-weight:600}
.challenge-badge i{font-size:.75rem}
.challenge-badge-admin{display:inline-flex;align-items:center;gap:.3rem;padding:.2rem .5rem;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff;border-radius:999px;font-size:.65rem;font-weight:600}
.challenge-badge-admin i{font-size:.65rem}
.no-badge{font-size:.65rem;color:var(--text-soft);font-style:italic}
.admin-challenge-item{padding:.8rem;background:var(--card-bg);border-radius:12px;border:1px solid var(--card-border);margin-bottom:.5rem}
.challenge-main-info strong{font-size:.9rem}
.challenge-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:.5rem}
.leaderboard-mini-item{display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem}
.leaderboard-medal{width:32px;height:32px;border-radius:999px;display:flex;align-items:center;justify-content:center;font-size:.9rem}
.medal-gold{background:#fef3c7;color:#b45309}
.medal-silver{background:#e5e7eb;color:#4b5563}
.medal-bronze{background:#ffedd5;color:#92400e}
.leaderboard-name{font-weight:600;font-size:.85rem}
.leaderboard-points{font-size:.75rem;color:var(--text-soft)}
.leaderboard-row{display:flex;align-items:center;gap:.5rem;padding:.4rem 0;border-bottom:1px solid rgba(148,163,184,0.2)}
.leaderboard-rank{width:2rem;font-weight:600;color:var(--text-soft)}
.leaderboard-row-name{flex:1;font-weight:500}
.leaderboard-row-points{font-size:.8rem;color:#0f766e;font-weight:500}
.news-item{padding:.6rem;background:rgba(148,163,184,0.1);border-radius:12px;margin-bottom:.5rem}
.news-item.priority-urgent{border-left:4px solid #ef4444}
.news-item.priority-important{border-left:4px solid #f59e0b}
.news-item h4{font-size:.9rem;margin-bottom:.2rem}
.news-item p{font-size:.8rem;color:var(--text-soft)}
.news-item .news-meta{font-size:.7rem;color:var(--text-soft);margin-top:.3rem}
@media(min-width:768px){.home-kpi-row{grid-template-columns:repeat(4,1fr)}.library-grid,.tools-grid{grid-template-columns:repeat(4,1fr)}.modal-content{max-width:600px}}
.pending-badge{position:absolute;top:-4px;right:-4px;background:#ef4444;color:#fff;font-size:.65rem;padding:.15rem .4rem;border-radius:999px;font-weight:600;min-width:1.2rem;text-align:center}

.admin-section{margin-bottom:1.5rem;padding:1rem;border-radius:16px;border-left:4px solid transparent}
.admin-section-header{margin-bottom:1rem}
.admin-section-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:12px;font-size:.9rem;font-weight:700;color:#fff;box-shadow:0 4px 12px rgba(0,0,0,0.15)}
.admin-section-badge i{font-size:1rem}

.admin-section-blue{background:linear-gradient(135deg,rgba(59,130,246,0.08),rgba(59,130,246,0.02));border-left-color:#3b82f6}
.admin-badge-blue{background:linear-gradient(135deg,#3b82f6,#2563eb)}

.admin-section-green{background:linear-gradient(135deg,rgba(34,197,94,0.08),rgba(34,197,94,0.02));border-left-color:#22c55e}
.admin-badge-green{background:linear-gradient(135deg,#22c55e,#16a34a)}

.admin-section-orange{background:linear-gradient(135deg,rgba(249,115,22,0.08),rgba(249,115,22,0.02));border-left-color:#f97316}
.admin-badge-orange{background:linear-gradient(135deg,#f97316,#ea580c)}

.admin-card{position:relative;transition:all .2s}
.admin-card-blue i{color:#3b82f6}
.admin-card-blue:hover{border-color:#3b82f6;box-shadow:0 4px 16px rgba(59,130,246,0.2)}
.admin-card-green i{color:#22c55e}
.admin-card-green:hover{border-color:#22c55e;box-shadow:0 4px 16px rgba(34,197,94,0.2)}
.admin-card-orange i{color:#f97316}
.admin-card-orange:hover{border-color:#f97316;box-shadow:0 4px 16px rgba(249,115,22,0.2)}

body.dark-mode .admin-section-blue{background:linear-gradient(135deg,rgba(59,130,246,0.15),rgba(59,130,246,0.05))}
body.dark-mode .admin-section-green{background:linear-gradient(135deg,rgba(34,197,94,0.15),rgba(34,197,94,0.05))}
body.dark-mode .admin-section-orange{background:linear-gradient(135deg,rgba(249,115,22,0.15),rgba(249,115,22,0.05))}
body.dark-mode .admin-badge-blue{background:linear-gradient(135deg,#60a5fa,#3b82f6)}
body.dark-mode .admin-badge-green{background:linear-gradient(135deg,#4ade80,#22c55e)}
body.dark-mode .admin-badge-orange{background:linear-gradient(135deg,#fb923c,#f97316)}
body.dark-mode .admin-card-blue i{color:#60a5fa}
body.dark-mode .admin-card-green i{color:#4ade80}
body.dark-mode .admin-card-orange i{color:#fb923c}
body.dark-mode .admin-card-blue:hover{border-color:#60a5fa;box-shadow:0 4px 16px rgba(96,165,250,0.3)}
body.dark-mode .admin-card-green:hover{border-color:#4ade80;box-shadow:0 4px 16px rgba(74,222,128,0.3)}
body.dark-mode .admin-card-orange:hover{border-color:#fb923c;box-shadow:0 4px 16px rgba(251,146,60,0.3)}

.section-header{margin-bottom:1rem}
.section-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1.2rem;border-radius:14px;font-size:1rem;font-weight:700;color:#fff;box-shadow:0 4px 14px rgba(0,0,0,0.2)}
.section-badge i{font-size:1.1rem}

.section-badge-violet{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}
.section-badge-purple{background:linear-gradient(135deg,#a855f7,#9333ea)}
.section-badge-coral{background:linear-gradient(135deg,#f87171,#ef4444)}
.section-badge-orange{background:linear-gradient(135deg,#f97316,#ea580c)}
.section-badge-blue{background:linear-gradient(135deg,#3b82f6,#2563eb)}
.section-badge-red{background:linear-gradient(135deg,#ef4444,#dc2626)}

body.dark-mode .section-badge-violet{background:linear-gradient(135deg,#a78bfa,#8b5cf6)}
body.dark-mode .section-badge-purple{background:linear-gradient(135deg,#c084fc,#a855f7)}
body.dark-mode .section-badge-coral{background:linear-gradient(135deg,#fca5a5,#f87171)}
body.dark-mode .section-badge-orange{background:linear-gradient(135deg,#fb923c,#f97316)}
body.dark-mode .section-badge-blue{background:linear-gradient(135deg,#60a5fa,#3b82f6)}
body.dark-mode .section-badge-red{background:linear-gradient(135deg,#f87171,#ef4444)}

.admin-menu-btn{background:linear-gradient(135deg,#ef4444,#dc2626)!important;color:#fff!important;border-radius:10px!important}
.admin-menu-btn i{color:#fff!important}
body.dark-mode .admin-menu-btn{background:linear-gradient(135deg,#f87171,#ef4444)!important}

.admin-list{display:flex;flex-direction:column;gap:.5rem;margin-top:.8rem}
.admin-user-item{display:flex;justify-content:space-between;align-items:center;padding:.8rem;background:var(--card-bg);border-radius:12px;border:1px solid var(--card-border);flex-wrap:wrap;gap:.5rem}
.admin-user-item .user-info{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}
.admin-user-item .user-id{font-size:.75rem;color:var(--text-soft);background:rgba(148,163,184,0.15);padding:.15rem .4rem;border-radius:4px}
.admin-user-item .user-date{font-size:.7rem;color:var(--text-soft)}
.admin-user-item .user-points{font-size:.75rem;color:#0f766e;font-weight:600}
.admin-user-item .user-role{font-size:.65rem}
.admin-user-item .user-actions{display:flex;gap:.4rem;flex-wrap:wrap}
.btn{padding:.4rem .7rem;border:none;border-radius:8px;font-size:.75rem;cursor:pointer;display:inline-flex;align-items:center;gap:.3rem;background:rgba(148,163,184,0.2);transition:background .15s}
.btn:hover{background:rgba(148,163,184,0.35)}
.btn-success{background:#22c55e;color:#fff}
.btn-success:hover{background:#16a34a}
.btn-danger{background:#ef4444;color:#fff}
.btn-danger:hover{background:#dc2626}
.btn-primary{background:linear-gradient(90deg,var(--primary-start),var(--primary-end));color:#fff}
.btn-sm{padding:.3rem .5rem;font-size:.7rem}
.badge{padding:.15rem .4rem;border-radius:4px;font-size:.65rem;font-weight:600}
.badge-success{background:#dcfce7;color:#15803d}
.badge-warning{background:#fef3c7;color:#b45309}
.badge-primary{background:#dbeafe;color:#1d4ed8}
.badge-secondary{background:#e5e7eb;color:#4b5563}
.no-data{text-align:center;padding:1.5rem;color:var(--text-soft);font-size:.9rem}
.form-group{margin-bottom:.4rem}
.form-group>label{display:block;font-size:.75rem;color:var(--text-soft);margin-bottom:.25rem;font-weight:600}
.area-select-wrapper{display:flex;gap:.4rem}
.area-select-wrapper select{flex:1}
.add-new-btn{width:38px;height:38px;border-radius:12px;border:1px solid rgba(148,163,184,0.5);background:var(--card-bg);color:var(--accent-blue);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.9rem}
.add-new-btn:hover{background:rgba(148,163,184,0.15)}
.add-new-input{display:flex;gap:.4rem;margin-top:.4rem}
.add-new-input input{flex:1}
.btn-add-area,.btn-cancel-area{padding:.4rem .6rem;border:none;border-radius:8px;font-size:.75rem;cursor:pointer}
.btn-add-area{background:#22c55e;color:#fff}
.btn-cancel-area{background:rgba(148,163,184,0.3);color:var(--text-main)}
.observation-class-toggle{margin:.5rem 0}
.observation-class-toggle>label{display:block;font-size:.75rem;color:var(--text-soft);margin-bottom:.35rem;font-weight:600}
.toggle-buttons{display:flex;gap:.4rem}
.toggle-btn{flex:1;padding:.6rem;border:2px solid transparent;border-radius:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.4rem;font-size:.85rem;font-weight:600;transition:all .2s}
.toggle-btn.positive{background:rgba(34,197,94,0.1);color:#15803d;border-color:rgba(34,197,94,0.3)}
.toggle-btn.positive:hover,.toggle-btn.positive.active{background:#22c55e;color:#fff;border-color:#22c55e}
.toggle-btn.negative{background:rgba(239,68,68,0.1);color:#b91c1c;border-color:rgba(239,68,68,0.3)}
.toggle-btn.negative:hover,.toggle-btn.negative.active{background:#ef4444;color:#fff;border-color:#ef4444}
.injury-section{background:rgba(239,68,68,0.05);border:1px solid rgba(239,68,68,0.2);border-radius:12px;padding:.8rem;margin:.5rem 0}
.section-label{display:block;font-size:.8rem;color:#b91c1c;font-weight:600;margin-bottom:.6rem}
.injury-section select{width:100%;margin-bottom:.4rem}
.obs-card.class-positive::before{background:#22c55e}
.obs-card.class-negative::before{background:#ef4444}
body.dark-mode .add-new-btn{background:#1e293b;border-color:rgba(148,163,184,0.4)}
body.dark-mode .btn-cancel-area{background:rgba(148,163,184,0.2);color:#e5e7eb}
body.dark-mode .injury-section{background:rgba(239,68,68,0.1);border-color:rgba(239,68,68,0.3)}
body.dark-mode .toggle-btn.positive{background:rgba(34,197,94,0.15);border-color:rgba(34,197,94,0.4)}
body.dark-mode .toggle-btn.negative{background:rgba(239,68,68,0.15);border-color:rgba(239,68,68,0.4)}
.import-progress{padding:1.5rem;text-align:center;color:var(--text-soft)}
.import-progress i{font-size:1.5rem;margin-bottom:.5rem;display:block;color:var(--accent-blue)}
.import-result{background:rgba(34,197,94,0.1);border:1px solid rgba(34,197,94,0.3);border-radius:16px;padding:1rem;margin:1rem 0}
.import-stat{padding:.5rem 0;border-bottom:1px solid rgba(148,163,184,0.2);font-size:.9rem}
.import-stat:last-child{border-bottom:none}
.import-stat strong{color:var(--accent-green);margin-right:.4rem}
.view-details-modal{max-width:600px}
.view-details-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;padding-right:2.5rem}
.view-details-header h2{margin:0}
.print-btn{display:flex;align-items:center;gap:.4rem;padding:.5rem 1rem;border-radius:999px;border:none;background:linear-gradient(90deg,var(--primary-start),var(--primary-end));color:#fff;font-size:.8rem;font-weight:600;cursor:pointer;box-shadow:0 4px 12px rgba(0,0,0,0.2)}
.print-btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(0,0,0,0.25)}
.view-details-body{font-size:.9rem}
.detail-section{margin-bottom:1rem;padding:.8rem;background:rgba(148,163,184,0.08);border-radius:12px}
.detail-section-title{font-weight:700;font-size:.85rem;color:var(--primary-start);margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem}
.detail-row{display:flex;justify-content:space-between;padding:.35rem 0;border-bottom:1px solid rgba(148,163,184,0.15)}
.detail-row:last-child{border-bottom:none}
.detail-label{font-weight:600;color:var(--text-soft);font-size:.8rem}
.detail-value{font-size:.85rem;text-align:right;max-width:60%}
.detail-full-row{padding:.35rem 0}
.detail-full-row .detail-label{margin-bottom:.25rem}
.detail-full-row .detail-value{text-align:left;max-width:100%;white-space:pre-wrap}
.detail-images{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.5rem;margin-top:.5rem}
.detail-images img{width:100%;height:80px;object-fit:cover;border-radius:8px;cursor:pointer;border:1px solid rgba(148,163,184,0.3)}
.detail-images img:hover{transform:scale(1.02);box-shadow:0 4px 12px rgba(0,0,0,0.2)}
.detail-status-badge{display:inline-block;padding:.25rem .6rem;border-radius:999px;font-weight:600;font-size:.75rem}
.detail-status-open{background:#dcfce7;color:#15803d}
.detail-status-closed{background:#fee2e2;color:#b91c1c}
.detail-risk-high{background:#fee2e2;color:#b91c1c}
.detail-risk-medium{background:#fff7ed;color:#c2410c}
.detail-risk-low{background:#dcfce7;color:#15803d}
.detail-class-positive{background:#dcfce7;color:#15803d}
.detail-class-negative{background:#fee2e2;color:#b91c1c}
body.dark-mode .detail-section{background:rgba(148,163,184,0.12)}
body.dark-mode .detail-row{border-color:rgba(148,163,184,0.2)}
body.dark-mode .detail-label{color:#94a3b8}
.areas-chart-container{position:relative;width:100%;max-width:280px;margin:0 auto;padding:.5rem 0}
.chart-no-data{text-align:center;padding:1.5rem;color:var(--text-soft);font-size:.85rem}
.weather-card{border-left:4px solid #f97316}
.weather-content{padding:.3rem 0}
.tbt-of-day-card{position:relative;border-left:4px solid #8b5cf6;background:linear-gradient(135deg,rgba(139,92,246,0.05) 0%,rgba(168,85,247,0.08) 100%);overflow:visible}
.tbt-of-day-badge{position:absolute;top:-.6rem;right:1rem;background:linear-gradient(135deg,#8b5cf6,#a855f7);color:#fff;font-size:.65rem;font-weight:700;padding:.35rem .75rem;border-radius:999px;display:flex;align-items:center;gap:.35rem;box-shadow:0 4px 12px rgba(139,92,246,0.4);text-transform:uppercase;letter-spacing:.05em}
.tbt-of-day-badge i{font-size:.6rem}
.tbt-of-day-content{display:flex;align-items:center;gap:.85rem;padding:.5rem 0}
.tbt-of-day-icon{width:52px;height:52px;border-radius:14px;background:linear-gradient(135deg,#8b5cf6,#a855f7);display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.4rem;box-shadow:0 6px 18px rgba(139,92,246,0.35);flex-shrink:0;overflow:hidden}
.tbt-of-day-info{flex:1;min-width:0}
.tbt-of-day-title{font-size:.95rem;font-weight:700;color:var(--text-main);line-height:1.3;margin-bottom:.2rem;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.tbt-of-day-subtitle{font-size:.7rem;color:var(--text-soft);text-transform:uppercase;letter-spacing:.05em}
.tbt-of-day-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.55rem 1rem;border-radius:999px;background:linear-gradient(135deg,#8b5cf6,#a855f7);color:#fff;font-size:.75rem;font-weight:600;text-decoration:none;box-shadow:0 4px 14px rgba(139,92,246,0.35);transition:all .2s;flex-shrink:0;border:none;cursor:pointer}
.tbt-of-day-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(139,92,246,0.45)}
.tbt-of-day-btn i{font-size:.7rem}
.tbt-loading{text-align:center;color:var(--text-soft);padding:.5rem}
body.dark-mode .tbt-of-day-card{background:linear-gradient(135deg,rgba(139,92,246,0.1) 0%,rgba(168,85,247,0.15) 100%)}
body.dark-mode .tbt-of-day-title{color:#e5e7eb}
.tbt-of-day-card .home-card-header i{color:#8b5cf6}
.document-viewer-modal{position:fixed;inset:0;background:rgba(15,23,42,0.9);z-index:200;display:none;align-items:center;justify-content:center;padding:1rem;backdrop-filter:blur(4px)}
.document-viewer-container{background:var(--card-bg);border-radius:16px;width:100%;max-width:900px;height:85vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 25px 60px rgba(0,0,0,0.5)}
.document-viewer-header{background:linear-gradient(135deg,#8b5cf6,#a855f7);color:#fff;padding:1rem 1.25rem;display:flex;align-items:center;justify-content:space-between}
.document-viewer-header h3{font-size:1rem;font-weight:700;display:flex;align-items:center;gap:.5rem;margin:0}
.document-viewer-close{width:36px;height:36px;border-radius:50%;border:none;background:rgba(255,255,255,0.2);color:#fff;cursor:pointer;font-size:1.2rem;display:flex;align-items:center;justify-content:center;transition:all .2s}
.document-viewer-close:hover{background:rgba(255,255,255,0.3);transform:scale(1.1)}
.document-viewer-body{flex:1;background:#f1f5f9;overflow:hidden}
.document-viewer-body iframe{width:100%;height:100%;border:none}
body.dark-mode .document-viewer-container{background:#1e293b}
body.dark-mode .document-viewer-body{background:#0f172a}
.weather-loading{text-align:center;color:var(--text-soft);padding:1rem}
.weather-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.weather-main{display:flex;align-items:center;gap:.75rem}
.weather-temp-big{font-size:2.2rem;font-weight:700;line-height:1}
.weather-feels{font-size:.75rem;color:var(--text-soft)}
.weather-icon{font-size:2rem;color:#f97316}
.weather-info-row{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:.6rem}
.weather-info-item{display:flex;align-items:center;gap:.4rem;font-size:.8rem;background:rgba(148,163,184,0.1);padding:.35rem .6rem;border-radius:999px}
.weather-info-item i{color:var(--accent-blue);font-size:.75rem}
.heat-stress-box{margin-top:.75rem;padding:.6rem .8rem;border-radius:14px;display:flex;align-items:center;gap:.6rem}
.heat-stress-box.level-low{background:#dcfce7;border:1px solid #22c55e}
.heat-stress-box.level-moderate{background:#fef9c3;border:1px solid #eab308}
.heat-stress-box.level-high{background:#fed7aa;border:1px solid #f97316}
.heat-stress-box.level-extreme{background:#fee2e2;border:1px solid #ef4444}
.heat-stress-icon{font-size:1.5rem}
.heat-stress-box.level-low .heat-stress-icon{color:#15803d}
.heat-stress-box.level-moderate .heat-stress-icon{color:#ca8a04}
.heat-stress-box.level-high .heat-stress-icon{color:#ea580c}
.heat-stress-box.level-extreme .heat-stress-icon{color:#dc2626}
.heat-stress-details{flex:1}
.heat-stress-title{font-weight:700;font-size:.85rem}
.heat-stress-box.level-low .heat-stress-title{color:#15803d}
.heat-stress-box.level-moderate .heat-stress-title{color:#ca8a04}
.heat-stress-box.level-high .heat-stress-title{color:#ea580c}
.heat-stress-box.level-extreme .heat-stress-title{color:#dc2626}
.heat-stress-desc{font-size:.75rem;color:var(--text-soft);margin-top:.15rem}
.weather-location{font-size:.7rem;color:var(--text-soft);margin-top:.5rem;display:flex;align-items:center;gap:.3rem}
body.dark-mode .weather-info-item{background:rgba(148,163,184,0.15)}
body.dark-mode .heat-stress-box.level-low{background:rgba(34,197,94,0.15);border-color:rgba(34,197,94,0.4)}
body.dark-mode .heat-stress-box.level-moderate{background:rgba(234,179,8,0.15);border-color:rgba(234,179,8,0.4)}
body.dark-mode .heat-stress-box.level-high{background:rgba(249,115,22,0.15);border-color:rgba(249,115,22,0.4)}
body.dark-mode .heat-stress-box.level-extreme{background:rgba(239,68,68,0.15);border-color:rgba(239,68,68,0.4)}
.header-badge{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:999px;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff;font-size:1rem}
.settings-profile-section{margin-bottom:1rem}
.settings-profile-card{background:var(--card-bg);border-radius:var(--radius-card);padding:1.2rem;display:flex;align-items:center;gap:1rem;border:1px solid var(--card-border);box-shadow:0 8px 22px rgba(15,23,42,0.06)}
.profile-picture-container{position:relative;width:80px;height:80px}
.profile-picture{width:80px;height:80px;border-radius:50%;object-fit:cover;border:3px solid var(--accent-blue)}
.profile-picture-edit{position:absolute;bottom:0;right:0;width:28px;height:28px;border-radius:50%;background:var(--accent-blue);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.75rem;box-shadow:0 2px 8px rgba(0,0,0,0.2)}
.profile-picture-edit:hover{transform:scale(1.1)}
.profile-info{flex:1}
.profile-name{font-size:1.1rem;font-weight:700;margin-bottom:.2rem}
.profile-id{font-size:.8rem;color:var(--text-soft)}
.profile-role{display:inline-block;margin-top:.4rem;padding:.2rem .6rem;border-radius:999px;font-size:.7rem;font-weight:600;background:linear-gradient(90deg,var(--primary-start),var(--primary-end));color:#fff}
.profile-badges-row{display:flex;flex-wrap:wrap;gap:.4rem;margin:.4rem 0}
.profile-badge{display:inline-flex;align-items:center;gap:.3rem;padding:.25rem .6rem;border-radius:999px;font-size:.7rem;font-weight:500;text-decoration:none;transition:all .2s}
.profile-badge i{font-size:.65rem}
.profile-badge.badge-id{background:rgba(59,130,246,0.12);color:#2563eb;border:1px solid rgba(59,130,246,0.3)}
.profile-badge.badge-phone{background:rgba(34,197,94,0.12);color:#16a34a;border:1px solid rgba(34,197,94,0.3);cursor:pointer}
.profile-badge.badge-phone:hover{background:rgba(34,197,94,0.25);transform:translateY(-1px)}
.profile-badge.badge-email{background:rgba(249,115,22,0.12);color:#ea580c;border:1px solid rgba(249,115,22,0.3);cursor:pointer}
.profile-badge.badge-email:hover{background:rgba(249,115,22,0.25);transform:translateY(-1px)}
.profile-badge.not-set{opacity:.5;cursor:default;pointer-events:none}
.profile-bio-row{display:flex;align-items:flex-start;gap:.4rem;margin-top:.4rem;font-size:.75rem;color:var(--text-soft);font-style:italic}
.profile-bio-row i{font-size:.6rem;margin-top:.15rem;opacity:.5}
.profile-bio-row span{line-height:1.3}
body.dark-mode .profile-badge.badge-id{background:rgba(59,130,246,0.2);border-color:rgba(59,130,246,0.4)}
body.dark-mode .profile-badge.badge-phone{background:rgba(34,197,94,0.2);border-color:rgba(34,197,94,0.4)}
body.dark-mode .profile-badge.badge-email{background:rgba(249,115,22,0.2);border-color:rgba(249,115,22,0.4)}
.edit-profile-btn{margin-top:.8rem;width:100%;padding:.6rem;border:none;border-radius:12px;background:linear-gradient(135deg,var(--primary-start),var(--primary-end));color:#fff;font-size:.85rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .2s}
.edit-profile-btn:hover{opacity:.9;transform:translateY(-1px)}
.settings-section{background:var(--card-bg);border-radius:var(--radius-card);padding:1rem;margin-bottom:1rem;border:1px solid var(--card-border);box-shadow:0 8px 22px rgba(15,23,42,0.06)}
.settings-section h3{font-size:.9rem;font-weight:700;margin-bottom:.8rem;display:flex;align-items:center;gap:.4rem;color:var(--text-main)}
.settings-section h3 i{color:var(--accent-orange)}
.badges-container{display:flex;flex-wrap:wrap;gap:.6rem}
.badge-item{display:flex;flex-direction:column;align-items:center;padding:.6rem .8rem;background:rgba(251,191,36,0.1);border:1px solid rgba(251,191,36,0.3);border-radius:12px;min-width:80px}
.badge-item i{font-size:1.5rem;color:#f59e0b;margin-bottom:.3rem}
.badge-item span{font-size:.7rem;font-weight:600;text-align:center}
.no-badges{color:var(--text-soft);font-size:.85rem;padding:.5rem 0}
.points-level-card{display:flex;gap:1rem}
.points-info,.level-info{flex:1;text-align:center;padding:.8rem;border-radius:14px}
.points-info{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff}
.level-info{background:linear-gradient(135deg,var(--primary-start),var(--primary-end));color:#fff}
.points-value,.level-value{font-size:1.8rem;font-weight:700}
.points-label,.level-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;opacity:.9}
.settings-option{display:flex;align-items:center;justify-content:space-between;padding:.7rem;background:rgba(148,163,184,0.08);border-radius:12px;cursor:pointer;transition:background .2s}
.settings-option:hover{background:rgba(148,163,184,0.15)}
.settings-option-info{display:flex;align-items:center;gap:.6rem;font-size:.9rem}
.settings-option-icon{font-size:1rem;color:var(--accent-blue);width:24px;text-align:center}
.settings-toggle{width:48px;height:26px;border-radius:999px;background:rgba(148,163,184,0.4);padding:2px;transition:background .2s;position:relative}
.settings-toggle.active{background:#22c55e}
.toggle-slider{width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 4px rgba(0,0,0,0.2);transition:transform .2s}
.settings-toggle.active .toggle-slider{transform:translateX(22px)}
.settings-logout-btn{width:100%;padding:.8rem;border:none;border-radius:12px;background:#ef4444;color:#fff;font-size:.9rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:background .2s}
.settings-logout-btn:hover{background:#dc2626}
body.dark-mode .settings-profile-card,body.dark-mode .settings-section{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2);color:#e5e7eb}
body.dark-mode .badge-item{background:rgba(251,191,36,0.15);border-color:rgba(251,191,36,0.4)}
body.dark-mode .settings-option{background:rgba(148,163,184,0.12)}
body.dark-mode .settings-option:hover{background:rgba(148,163,184,0.2)}
@media print{
  .modal{position:static!important;display:block!important;background:none!important}
  .modal-content{max-width:100%!important;max-height:none!important;box-shadow:none!important;padding:0!important;border:none!important}
  .view-details-header .close-btn,.view-details-header .print-btn,.app-header,.nav-bar{display:none!important}
  .view-details-body{padding:1rem}
  .no-print{display:none!important}
  .close-observation-section{display:none!important}
  .admin-actions-section{display:none!important}
  .ca-actions{display:none!important}
  .ca-update-form{display:none!important}
  .ca-save-btn{display:none!important}
  button{display:none!important}
  .btn{display:none!important}
  .close-obs-action-btn{display:none!important}
  .admin-delete-btn{display:none!important}
  .admin-action-buttons{display:none!important}
  div.admin-actions-section{display:none!important}
  .detail-section.admin-actions-section{display:none!important}
  [class*="admin"]{display:none!important}
  .view-details-header{background:none!important;border-bottom:2px solid #333!important;padding-bottom:0.5rem!important;margin-bottom:1rem!important}
  .view-details-header h2{color:#000!important;font-size:1.5rem!important}
  .detail-section{page-break-inside:avoid;border:1px solid #ccc!important;margin-bottom:1rem!important;background:#fff!important}
  .detail-section-title{background:#f0f0f0!important;color:#000!important;border-bottom:1px solid #ccc!important}
  .detail-row,.detail-full-row{border-bottom:1px solid #eee!important}
  .detail-label{color:#333!important;font-weight:600!important}
  .detail-value{color:#000!important}
  .detail-status-badge{border:1px solid #333!important;background:#fff!important;color:#000!important}
}
.before-after-section{background:linear-gradient(135deg,rgba(59,130,246,0.05),rgba(34,197,94,0.05));border:1px solid rgba(59,130,246,0.2)}
.before-after-container{display:flex;gap:.5rem;align-items:stretch}
.before-after-column{flex:1;min-width:0}
.before-after-label{text-align:center;font-weight:700;font-size:.75rem;padding:.5rem;border-radius:8px;margin-bottom:.5rem}
.before-after-column:first-child .before-after-label{background:rgba(239,68,68,0.12);color:#dc2626}
.before-after-column:last-child .before-after-label{background:rgba(34,197,94,0.12);color:#16a34a}
.before-after-divider{display:flex;align-items:center;justify-content:center;padding:0 .3rem;color:var(--text-soft);font-size:1.2rem}
.before-after-images{display:flex;flex-direction:column;gap:.4rem}
.before-after-images img{width:100%;border-radius:8px;cursor:pointer;transition:transform .2s;border:2px solid var(--card-border)}
.before-after-images img:hover{transform:scale(1.02)}
.corrective-action-section{background:linear-gradient(135deg,rgba(251,191,36,0.08),rgba(249,115,22,0.08));border:1px solid rgba(251,191,36,0.3)}
.ca-status-badge{display:inline-block;padding:.25rem .6rem;border-radius:999px;font-size:.75rem;font-weight:600}
.ca-status-badge.ca-notstarted{background:rgba(148,163,184,0.2);color:#64748b}
.ca-status-badge.ca-inprogress{background:rgba(59,130,246,0.15);color:#2563eb}
.ca-status-badge.ca-completed{background:rgba(34,197,94,0.15);color:#16a34a}
.ca-actions{display:flex;gap:.4rem;margin-top:.8rem;flex-wrap:wrap}
.ca-btn{padding:.4rem .7rem;border:none;border-radius:8px;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s;opacity:.6}
.ca-btn:hover{opacity:1}
.ca-btn.active{opacity:1;box-shadow:0 2px 8px rgba(0,0,0,0.15)}
.ca-btn-notstarted{background:rgba(148,163,184,0.2);color:#64748b}
.ca-btn-notstarted.active{background:#94a3b8;color:#fff}
.ca-btn-inprogress{background:rgba(59,130,246,0.15);color:#2563eb}
.ca-btn-inprogress.active{background:#3b82f6;color:#fff}
.ca-btn-completed{background:rgba(34,197,94,0.15);color:#16a34a}
.ca-btn-completed.active{background:#22c55e;color:#fff}
.ca-update-form{display:flex;gap:.4rem;margin-top:.6rem;flex-wrap:wrap;align-items:center}
.ca-update-form input{flex:1;min-width:100px;padding:.45rem .6rem;border:1px solid var(--card-border);border-radius:8px;font-size:.8rem;background:var(--card-bg)}
.ca-save-btn{padding:.45rem .8rem;border:none;border-radius:8px;background:var(--accent-blue);color:#fff;font-size:.8rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.3rem;transition:background .2s}
.ca-save-btn:hover{background:#2563eb}
body.dark-mode .before-after-section{background:rgba(59,130,246,0.08);border-color:rgba(59,130,246,0.3)}
body.dark-mode .corrective-action-section{background:rgba(251,191,36,0.1);border-color:rgba(251,191,36,0.35)}
body.dark-mode .ca-update-form input{background:rgba(15,23,42,0.5);border-color:rgba(148,163,184,0.3);color:#e5e7eb}
.admin-actions-section{background:linear-gradient(135deg,rgba(239,68,68,0.08),rgba(220,38,38,0.08));border:1px solid rgba(239,68,68,0.3);margin-top:1rem}
.admin-action-buttons{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.6rem}
.admin-delete-btn{padding:.6rem 1rem;border:none;border-radius:10px;background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;font-size:.85rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.4rem;transition:all .2s;box-shadow:0 4px 12px rgba(239,68,68,0.3)}
.admin-delete-btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(239,68,68,0.4)}
.admin-delete-btn i{font-size:.9rem}
.close-observation-section{background:linear-gradient(135deg,rgba(34,197,94,0.08),rgba(22,163,74,0.08));border:1px solid rgba(34,197,94,0.3);margin-top:1rem}
.close-obs-action-btn{width:100%;padding:.7rem 1rem;border:none;border-radius:10px;background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;font-size:.9rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .2s;box-shadow:0 4px 12px rgba(34,197,94,0.3)}
.close-obs-action-btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(34,197,94,0.4)}
body.dark-mode .close-observation-section{background:rgba(34,197,94,0.1);border-color:rgba(34,197,94,0.35)}
body.dark-mode .admin-actions-section{background:rgba(239,68,68,0.1);border-color:rgba(239,68,68,0.35)}
.challenge-type-tabs{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap}
.challenge-tab{padding:.5rem 1rem;border:none;border-radius:20px;background:rgba(59,130,246,0.1);color:var(--accent-blue);font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:.3rem}
.challenge-tab:hover{background:rgba(59,130,246,0.2)}
.challenge-tab.active{background:var(--accent-blue);color:#fff}
.challenge-card{background:var(--card-bg);border-radius:12px;padding:1rem;margin-bottom:.8rem;border:1px solid var(--card-border);transition:all .2s}
.challenge-card:hover{border-color:var(--accent-blue);box-shadow:0 4px 12px rgba(59,130,246,0.1)}
.challenge-card.completed{opacity:.7;border-color:rgba(34,197,94,0.4);background:rgba(34,197,94,0.05)}
.challenge-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}
.challenge-title{font-weight:600;font-size:.95rem;color:var(--text-main)}
.challenge-points{color:var(--accent-orange);font-weight:600;font-size:.85rem;display:flex;align-items:center;gap:.3rem}
.challenge-description{font-size:.85rem;color:var(--text-soft);margin-bottom:.6rem}
.challenge-badge{font-size:.8rem;color:#8b5cf6;margin-bottom:.6rem}
.challenge-badge i{margin-right:.3rem}
.challenge-complete-btn{width:100%;padding:.6rem;border:none;border-radius:8px;background:linear-gradient(135deg,var(--accent-blue),#2563eb);color:#fff;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:.4rem}
.challenge-complete-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(59,130,246,0.3)}
.challenge-status.completed{color:#16a34a;font-weight:600;font-size:.85rem;display:flex;align-items:center;gap:.3rem;justify-content:center;padding:.4rem}
.no-challenges{text-align:center;padding:2rem;color:var(--text-soft)}
.no-challenges i{font-size:2rem;margin-bottom:.5rem;display:block;opacity:.5}
.challenge-complete-form h4{margin-bottom:.5rem;color:var(--text-main)}
.challenge-complete-form p{color:var(--text-soft);font-size:.85rem;margin-bottom:1rem}
.challenge-complete-form .upload-area{margin-bottom:1rem}
.challenge-complete-form .evidence-preview{margin-top:.5rem}
.challenge-complete-form .evidence-preview img{max-width:100%;border-radius:8px}
.challenge-form-buttons{display:flex;gap:.5rem;justify-content:flex-end;margin-top:1rem}
.btn-cancel{padding:.5rem 1rem;border:1px solid var(--card-border);border-radius:8px;background:transparent;color:var(--text-soft);cursor:pointer}
.btn-submit{padding:.5rem 1rem;border:none;border-radius:8px;background:var(--accent-blue);color:#fff;cursor:pointer;display:flex;align-items:center;gap:.3rem}
.quiz-intro{color:var(--text-soft);font-size:.9rem;margin-bottom:1rem}
.quiz-start-panel{text-align:center;padding:1.5rem}
.quiz-info{margin-bottom:1.5rem}
.quiz-icon{font-size:3rem;color:var(--accent-blue);margin-bottom:1rem}
.quiz-info h4{font-size:1.2rem;margin-bottom:.5rem;color:var(--text-main)}
.quiz-info p{color:var(--text-soft);font-size:.9rem;margin-bottom:.3rem}
.quiz-start-btn{padding:.8rem 2rem;border:none;border-radius:12px;background:linear-gradient(135deg,var(--accent-blue),#2563eb);color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:.5rem}
.quiz-start-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(59,130,246,0.3)}
.quiz-progress{height:6px;background:rgba(59,130,246,0.15);border-radius:999px;overflow:hidden;margin-bottom:.5rem}
.quiz-progress-bar{height:100%;background:linear-gradient(90deg,var(--accent-blue),#2563eb);border-radius:999px;transition:width .3s}
.quiz-progress-text{text-align:center;font-size:.85rem;color:var(--text-soft);margin-bottom:1rem}
.quiz-question-card{background:var(--card-bg);border-radius:12px;padding:1.2rem;border:1px solid var(--card-border)}
.quiz-category{font-size:.75rem;color:var(--accent-blue);margin-bottom:.6rem;display:flex;align-items:center;gap:.3rem}
.quiz-question-text{font-size:1rem;font-weight:600;color:var(--text-main);margin-bottom:1rem;line-height:1.5}
.quiz-options{display:flex;flex-direction:column;gap:.5rem}
.quiz-option{display:flex;align-items:center;gap:.6rem;padding:.8rem;border:1px solid var(--card-border);border-radius:10px;background:var(--card-bg);text-align:left;cursor:pointer;transition:all .2s;font-size:.9rem;color:var(--text-main)}
.quiz-option:hover{border-color:var(--accent-blue);background:rgba(59,130,246,0.05)}
.option-letter{display:inline-flex;align-items:center;justify-content:center;width:1.6rem;height:1.6rem;border-radius:50%;background:rgba(59,130,246,0.1);color:var(--accent-blue);font-weight:600;font-size:.8rem}
.quiz-results-card{background:var(--card-bg);border-radius:12px;padding:1.5rem;border:1px solid var(--card-border)}
.quiz-score-display{text-align:center;margin-bottom:1.5rem}
.quiz-emoji{font-size:3rem;margin-bottom:.5rem}
.quiz-score{font-size:2.5rem;font-weight:700;color:var(--text-main)}
.quiz-percentage{color:var(--text-soft);font-size:.9rem;margin-bottom:.5rem}
.quiz-points-earned{color:var(--accent-orange);font-weight:600;display:flex;align-items:center;justify-content:center;gap:.3rem}
.quiz-results-details h4{margin-bottom:.8rem;color:var(--text-main)}
.quiz-result-item{display:flex;gap:.6rem;padding:.6rem;border-radius:8px;margin-bottom:.5rem}
.quiz-result-item.correct{background:rgba(34,197,94,0.1)}
.quiz-result-item.incorrect{background:rgba(239,68,68,0.1)}
.quiz-result-item .result-icon{font-size:1.1rem}
.quiz-result-item.correct .result-icon{color:#16a34a}
.quiz-result-item.incorrect .result-icon{color:#dc2626}
.result-answer{font-size:.85rem;color:var(--text-main)}
.result-explanation{font-size:.8rem;color:var(--text-soft);margin-top:.2rem}
.quiz-done-btn{width:100%;padding:.7rem;border:none;border-radius:10px;background:var(--accent-blue);color:#fff;font-size:.9rem;font-weight:600;cursor:pointer;margin-top:1rem;display:flex;align-items:center;justify-content:center;gap:.4rem}
.quiz-history{margin-top:1.5rem;text-align:left}
.quiz-history h4{font-size:.9rem;margin-bottom:.5rem;color:var(--text-main)}
.quiz-history-list{display:flex;flex-direction:column;gap:.3rem}
.quiz-history-item{display:flex;justify-content:space-between;padding:.4rem .6rem;background:rgba(59,130,246,0.05);border-radius:6px;font-size:.8rem}
.quiz-history-date{color:var(--text-soft)}
.quiz-history-score{color:var(--accent-blue);font-weight:600}
.quiz-history-empty{color:var(--text-soft);font-size:.85rem;text-align:center}
.no-quiz{text-align:center;padding:2rem;color:var(--text-soft)}
.no-quiz i{font-size:2rem;margin-bottom:.5rem;display:block;opacity:.5}
.admin-challenge-item{background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;padding:1rem;margin-bottom:.8rem;transition:all .2s}
.admin-challenge-item:hover{border-color:var(--accent-blue);box-shadow:0 4px 12px rgba(59,130,246,0.1)}
.admin-challenge-actions{display:flex;gap:.5rem;margin-top:.8rem;flex-wrap:wrap}
.btn-edit{padding:.4rem .8rem;border:1px solid var(--accent-blue);border-radius:8px;background:transparent;color:var(--accent-blue);font-size:.8rem;cursor:pointer;display:flex;align-items:center;gap:.3rem;transition:all .2s}
.btn-edit:hover{background:var(--accent-blue);color:#fff}
.btn-delete{padding:.4rem .8rem;border:1px solid #ef4444;border-radius:8px;background:transparent;color:#ef4444;font-size:.8rem;cursor:pointer;display:flex;align-items:center;gap:.3rem;transition:all .2s}
.btn-delete:hover{background:#ef4444;color:#fff}
.challenge-type-badge{padding:.2rem .5rem;border-radius:10px;font-size:.7rem;font-weight:600;text-transform:uppercase}
.challenge-type-badge.type-daily{background:rgba(59,130,246,0.15);color:#2563eb}
.challenge-type-badge.type-weekly{background:rgba(139,92,246,0.15);color:#7c3aed}
.challenge-type-badge.type-monthly{background:rgba(249,115,22,0.15);color:#ea580c}
.status-active{color:#16a34a;font-weight:600;font-size:.8rem}
.status-inactive{color:#94a3b8;font-weight:600;font-size:.8rem}
.challenge-tabs{display:flex;gap:.5rem;margin-bottom:.5rem;flex-wrap:wrap}
.challenge-badge-admin{display:flex;align-items:center;gap:.3rem;font-size:.8rem;color:#8b5cf6}
.admin-list{display:flex;flex-direction:column;gap:.5rem}
.no-data{text-align:center;padding:2rem;color:var(--text-soft);font-size:.9rem}
.admin-quiz-item{background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;padding:1rem;margin-bottom:.5rem;transition:all .2s}
.admin-quiz-item:hover{border-color:var(--accent-blue);box-shadow:0 4px 12px rgba(59,130,246,0.1)}
.quiz-main-info{margin-bottom:.6rem}
.quiz-category-badge{display:inline-block;padding:.2rem .5rem;border-radius:10px;font-size:.7rem;font-weight:600;background:rgba(139,92,246,0.15);color:#7c3aed;margin-bottom:.4rem}
.quiz-question-preview{font-size:.9rem;color:var(--text-main);margin-bottom:.4rem;line-height:1.4}
.quiz-answer-preview{display:flex;gap:.8rem;align-items:center;flex-wrap:wrap}
.correct-answer{font-size:.8rem;color:#16a34a;font-weight:600}
.admin-quiz-actions{display:flex;gap:.5rem;flex-wrap:wrap}
.registry-modal{width:95%;max-width:1000px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column}
.registry-controls{display:flex;gap:.8rem;margin-bottom:1rem;flex-wrap:wrap;align-items:center}
.registry-controls input{flex:1;min-width:200px;padding:.6rem 1rem;border:1px solid var(--card-border);border-radius:8px;background:var(--input-bg);color:var(--text-main);font-size:.9rem}
.export-btn{padding:.6rem 1rem;border:none;border-radius:8px;background:#16a34a;color:#fff;font-size:.85rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.4rem;transition:all .2s}
.export-btn:hover{background:#15803d}
.registry-table-container{flex:1;overflow:auto;max-height:60vh;border:1px solid var(--card-border);border-radius:8px}
.registry-table{width:100%;border-collapse:collapse;font-size:.85rem}
.registry-table th{position:sticky;top:0;background:var(--accent-blue);color:#fff;padding:.7rem .6rem;text-align:left;font-weight:600;white-space:nowrap}
.registry-table td{padding:.6rem;border-bottom:1px solid var(--card-border);vertical-align:top}
.registry-table tr:nth-child(even){background:rgba(59,130,246,0.03)}
.registry-table tr:hover{background:rgba(59,130,246,0.08)}
.registry-actions{display:flex;gap:.3rem;flex-wrap:nowrap}
.registry-actions button{padding:.3rem .5rem;border-radius:6px;font-size:.75rem;cursor:pointer;display:flex;align-items:center;gap:.2rem;white-space:nowrap}
.registry-view-btn{border:1px solid var(--accent-blue);background:transparent;color:var(--accent-blue)}
.registry-view-btn:hover{background:var(--accent-blue);color:#fff}
.registry-delete-btn{border:1px solid #ef4444;background:transparent;color:#ef4444}
.registry-delete-btn:hover{background:#ef4444;color:#fff}
.registry-pagination{display:flex;justify-content:center;gap:.5rem;margin-top:1rem;flex-wrap:wrap}
.registry-pagination button{padding:.4rem .8rem;border:1px solid var(--card-border);border-radius:6px;background:var(--card-bg);color:var(--text-main);font-size:.8rem;cursor:pointer}
.registry-pagination button.active{background:var(--accent-blue);color:#fff;border-color:var(--accent-blue)}
.registry-pagination button:hover:not(.active){background:rgba(59,130,246,0.1)}
.registry-status-open{color:#f59e0b;font-weight:600}
.registry-status-closed{color:#16a34a;font-weight:600}
.registry-risk-high{color:#ef4444;font-weight:600}
.registry-risk-medium{color:#f59e0b;font-weight:600}
.registry-risk-low{color:#16a34a;font-weight:600}
.settings-tabs{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap;border-bottom:1px solid var(--card-border);padding-bottom:.8rem;position:relative;z-index:1}
.settings-tab-btn,.calendar-settings-tab-btn{padding:.5rem 1rem;border:1px solid var(--card-border);border-radius:8px;background:var(--card-bg);color:var(--text-main);font-size:.8rem;cursor:pointer;transition:all .2s;position:relative;z-index:2}
.settings-tab-btn.active,.calendar-settings-tab-btn.active{background:var(--accent-blue);color:#fff;border-color:var(--accent-blue)}
.settings-tab-btn:hover:not(.active),.calendar-settings-tab-btn:hover:not(.active){background:rgba(59,130,246,0.1)}
.admin-modal-content{max-height:60vh;overflow-y:auto;padding:.5rem 0}
.admin-modal-content .admin-list{display:flex;flex-direction:column;gap:.5rem}
.admin-modal-content .admin-user-item{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;padding:.75rem;background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;gap:.5rem}
.admin-modal-content .user-info{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;flex:1}
.admin-modal-content .user-info strong{color:var(--text-main)}
.admin-modal-content .user-id{font-size:.8rem;color:var(--text-soft)}
.admin-modal-content .user-date{font-size:.75rem;color:var(--text-soft)}
.admin-modal-content .user-actions{display:flex;flex-wrap:wrap;gap:.4rem}
.admin-modal-content .btn{padding:.4rem .8rem;border-radius:8px;font-size:.75rem;cursor:pointer;border:none;transition:all .2s}
.admin-modal-content .btn-sm{padding:.35rem .6rem}
.admin-modal-content .btn-success{background:#22c55e;color:#fff}
.admin-modal-content .btn-success:hover{background:#16a34a}
.admin-modal-content .btn-danger{background:#ef4444;color:#fff}
.admin-modal-content .btn-danger:hover{background:#dc2626}
.admin-modal-content .btn-primary{background:var(--accent-blue);color:#fff}
.admin-modal-content .btn-primary:hover{background:#2563eb}
.admin-modal-content .no-data{text-align:center;padding:2rem;color:var(--text-soft)}
.settings-add-row{display:flex;gap:.5rem;margin-bottom:1rem}
.settings-add-row input{flex:1;padding:.6rem 1rem;border:1px solid var(--card-border);border-radius:8px;background:var(--input-bg);color:var(--text-main);font-size:.9rem}
.settings-add-row button{white-space:nowrap}
.settings-list{display:flex;flex-direction:column;gap:.5rem;max-height:300px;overflow-y:auto}
.settings-item{display:flex;justify-content:space-between;align-items:center;padding:.6rem 1rem;background:var(--card-bg);border:1px solid var(--card-border);border-radius:8px;transition:all .2s}
.settings-item:hover{border-color:var(--accent-blue)}
.settings-item-name{font-size:.9rem;color:var(--text-main)}
.settings-item-actions{display:flex;gap:.4rem}
.settings-item-edit{padding:.3rem .6rem;border:1px solid #3b82f6;border-radius:6px;background:transparent;color:#3b82f6;font-size:.75rem;cursor:pointer;display:flex;align-items:center;gap:.2rem;transition:all .2s}
.settings-item-edit:hover{background:#3b82f6;color:#fff}
.settings-item-delete{padding:.3rem .6rem;border:1px solid #ef4444;border-radius:6px;background:transparent;color:#ef4444;font-size:.75rem;cursor:pointer;display:flex;align-items:center;gap:.2rem;transition:all .2s}
.settings-item-delete:hover{background:#ef4444;color:#fff}
.settings-item-save{padding:.3rem .6rem;border:1px solid #22c55e;border-radius:6px;background:transparent;color:#22c55e;font-size:.75rem;cursor:pointer;display:flex;align-items:center;gap:.2rem;transition:all .2s}
.settings-item-save:hover{background:#22c55e;color:#fff}
.settings-item-cancel{padding:.3rem .6rem;border:1px solid #6b7280;border-radius:6px;background:transparent;color:#6b7280;font-size:.75rem;cursor:pointer;display:flex;align-items:center;gap:.2rem;transition:all .2s}
.settings-item-cancel:hover{background:#6b7280;color:#fff}
.settings-edit-input{flex:1;padding:.4rem .6rem;border:1px solid var(--accent-blue);border-radius:6px;font-size:.9rem;background:var(--card-bg);color:var(--text-main)}
.settings-empty{text-align:center;padding:2rem;color:var(--text-soft);font-size:.9rem}
.stats-period-toggle{display:flex;gap:.4rem;margin-bottom:.75rem;justify-content:center}
.period-btn{padding:.45rem .9rem;border:1px solid var(--card-border);border-radius:999px;background:var(--card-bg);color:var(--text-main);font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s}
.period-btn:hover{border-color:var(--accent-blue);background:rgba(59,130,246,0.08)}
.period-btn.active{background:linear-gradient(135deg,var(--primary-start),var(--primary-end));color:#fff;border-color:transparent;box-shadow:0 4px 12px rgba(0,123,143,0.3)}
body.dark-mode .period-btn{background:rgba(15,23,42,0.8);color:#e5e7eb;border-color:rgba(148,163,184,0.3)}
body.dark-mode .period-btn:hover{border-color:var(--accent-blue);background:rgba(59,130,246,0.15)}
body.dark-mode .period-btn.active{background:linear-gradient(135deg,var(--primary-start),var(--primary-end));color:#fff}
.section-desc{color:var(--text-soft);font-size:.85rem;margin-bottom:1rem}
.verification-stats{display:flex;gap:1rem;margin-bottom:1rem}
.verification-stat-card{background:linear-gradient(135deg,var(--primary-start),var(--primary-end));color:#fff;padding:1rem 1.5rem;border-radius:16px;text-align:center;flex:1;box-shadow:0 8px 20px rgba(0,123,143,0.3)}
.verification-stat-card .stat-number{font-size:2rem;font-weight:700;display:block}
.verification-stat-card .stat-label{font-size:.8rem;opacity:.9}
.verification-list{display:flex;flex-direction:column;gap:.75rem}
.verification-card{display:flex;gap:1rem;background:var(--card-bg);border:1px solid var(--card-border);border-radius:16px;padding:.75rem;cursor:pointer;transition:all .2s}
.verification-card:hover{border-color:var(--accent-blue);box-shadow:0 4px 12px rgba(59,130,246,0.15)}
.verification-card-left{flex-shrink:0}
.verification-thumb{width:70px;height:70px;object-fit:cover;border-radius:12px}
.verification-thumb-placeholder{width:70px;height:70px;background:var(--surface-soft);border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--text-soft);font-size:1.5rem}
.verification-card-right{flex:1;display:flex;flex-direction:column;justify-content:center;gap:.2rem}
.verification-card-header{display:flex;justify-content:space-between;align-items:center}
.verification-id{font-weight:700;color:var(--text-main)}
.verification-card-area{font-size:.9rem;font-weight:600;color:var(--text-main)}
.verification-card-date{font-size:.75rem;color:var(--text-soft)}
.verification-card-assignee{font-size:.75rem;color:var(--text-soft)}
.verification-card-assignee i{margin-right:.3rem}
.verification-action-section{background:linear-gradient(135deg,rgba(59,130,246,0.05),rgba(14,165,233,0.05));border:1px solid rgba(59,130,246,0.2);border-radius:12px;padding:1rem}
.verification-buttons{display:flex;gap:.75rem;margin-top:1rem}
.verify-btn{flex:1;padding:.75rem 1rem;border:none;border-radius:12px;font-size:.9rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .2s}
.approve-btn{background:linear-gradient(135deg,#15803d,#22c55e);color:#fff}
.approve-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(34,197,94,0.4)}
.reject-btn{background:linear-gradient(135deg,#b91c1c,#ef4444);color:#fff}
.reject-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(239,68,68,0.4)}
.menu-badge{background:#ef4444;color:#fff;font-size:.7rem;font-weight:700;padding:.15rem .4rem;border-radius:999px;margin-left:.4rem}
body.dark-mode .verification-card{background:rgba(15,23,42,0.96);color:#e5e7eb;border-color:rgba(148,163,184,0.3)}
body.dark-mode .verification-thumb-placeholder{background:rgba(15,23,42,0.8)}
body.dark-mode .verification-action-section{background:rgba(59,130,246,0.1);border-color:rgba(59,130,246,0.3)}
.quick-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;margin-bottom:1rem}
.quick-action-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;padding:1rem .5rem;border:none;border-radius:16px;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s;min-height:80px;box-shadow:0 4px 12px rgba(0,0,0,0.15)}
.quick-action-btn i{font-size:1.5rem}
.quick-action-btn span{text-align:center;line-height:1.2}
.action-hazard{background:linear-gradient(135deg,#dc2626,#ef4444);color:#fff}
.action-hazard:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(239,68,68,0.4)}
.action-reports{background:linear-gradient(135deg,#0369a1,#0ea5e9);color:#fff}
.action-reports:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(14,165,233,0.4)}
.action-tasks{background:linear-gradient(135deg,#c2410c,#f97316);color:#fff}
.action-tasks:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(249,115,22,0.4)}
.action-emergency{background:linear-gradient(135deg,#15803d,#22c55e);color:#fff}
.action-emergency:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(34,197,94,0.4)}
@media (max-width:480px){.quick-actions{grid-template-columns:repeat(2,1fr);gap:.5rem}.quick-action-btn{min-height:70px;padding:.8rem .4rem}.quick-action-btn i{font-size:1.3rem}.quick-action-btn span{font-size:.7rem}}
.submit-btn,.auth-submit-btn,.verify-btn,.ca-btn,.challenge-complete-btn{min-height:48px;font-size:1rem}
input,select,textarea{min-height:48px;font-size:16px}
.obs-filter-chip,.period-btn,.settings-tab-btn{min-height:40px;padding:.5rem 1rem}
.nav-button{min-height:56px}
.obs-card,.verification-card,.permit-card,.equipment-card{min-height:80px;padding:1rem}
.photo-capture-row{display:flex;gap:.5rem;margin-bottom:.75rem}
.take-photo-btn,.upload-photo-btn{flex:1;padding:.75rem;border:none;border-radius:12px;font-size:.85rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.4rem;min-height:50px}
.take-photo-btn{background:linear-gradient(135deg,#0369a1,#0ea5e9);color:#fff}
.take-photo-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(14,165,233,0.4)}
.upload-photo-btn{background:var(--surface-soft);color:var(--text-main);border:1px solid var(--card-border)}
.upload-photo-btn:hover{border-color:var(--accent-blue)}
.photo-preview-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}
.photo-preview-item{position:relative;aspect-ratio:1;border-radius:8px;overflow:hidden}
.photo-preview-item img{width:100%;height:100%;object-fit:cover}
.photo-preview-remove{position:absolute;top:4px;right:4px;width:24px;height:24px;border-radius:50%;background:#ef4444;color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.7rem}
body.dark-mode .upload-photo-btn{background:rgba(15,23,42,0.8);color:#e5e7eb;border-color:rgba(148,163,184,0.3)}
.leaderboard-avatar{width:40px;height:40px;border-radius:50%;object-fit:cover;flex-shrink:0}
.default-avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem;flex-shrink:0}
.level-badge{display:inline-block;padding:.15rem .5rem;border-radius:999px;font-size:.65rem;font-weight:700;text-transform:uppercase;margin-left:.3rem;vertical-align:middle}
.level-bronze{background:linear-gradient(135deg,#cd7f32,#d4a574);color:#fff}
.level-silver{background:linear-gradient(135deg,#9ca3af,#d1d5db);color:#374151}
.level-gold{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#78350f}
.level-platinum{background:linear-gradient(135deg,#06b6d4,#0891b2);color:#fff}
.leaderboard-mini-item{display:flex;align-items:center;gap:.6rem;padding:.5rem 0;border-bottom:1px solid var(--card-border)}
.leaderboard-mini-item:last-child{border-bottom:none}
.leaderboard-mini-item.clickable{cursor:pointer;transition:all .2s;padding:.5rem;margin:-.5rem;border-radius:10px}
.leaderboard-mini-item.clickable:hover{background:rgba(59,130,246,0.08);transform:translateX(4px)}
.leaderboard-row{display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:12px;margin-bottom:.5rem;background:var(--surface-soft);border:1px solid var(--card-border)}
.leaderboard-row.clickable{cursor:pointer;transition:all .2s}
.leaderboard-row.clickable:hover{background:linear-gradient(135deg,rgba(59,130,246,0.1),rgba(14,165,233,0.08));transform:translateY(-2px);box-shadow:0 4px 12px rgba(59,130,246,0.15);border-color:rgba(59,130,246,0.3)}
.leaderboard-rank{font-weight:700;color:var(--accent-blue);min-width:35px}
.leaderboard-row-info{flex:1;display:flex;flex-direction:column;gap:.1rem}
.leaderboard-row-name{font-weight:600;font-size:.9rem}
.leaderboard-row-points{font-weight:700;color:var(--accent-orange);white-space:nowrap}
body.dark-mode .leaderboard-row{background:rgba(15,23,42,0.6);border-color:rgba(148,163,184,0.2)}

.image-viewer-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.95);z-index:9999;align-items:center;justify-content:center;padding:1rem}
.image-viewer-img{max-width:95%;max-height:90vh;object-fit:contain;border-radius:8px;box-shadow:0 8px 40px rgba(0,0,0,0.5)}
.image-viewer-close{position:fixed;top:1rem;right:1rem;width:48px;height:48px;border-radius:50%;border:none;background:rgba(255,255,255,0.15);color:#fff;font-size:2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;z-index:10000}
.image-viewer-close:hover{background:rgba(255,255,255,0.25);transform:scale(1.1)}
.detail-images img,.before-after-images img,.evidence-gallery img{cursor:pointer;transition:transform .2s,box-shadow .2s}
.detail-images img:hover,.before-after-images img:hover,.evidence-gallery img:hover{transform:scale(1.05);box-shadow:0 4px 12px rgba(0,0,0,0.25)}
.evidence-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.5rem}
.evidence-img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px}

.emergency-modal-content{max-width:700px;padding:0;overflow-y:auto;border-radius:24px;max-height:90vh}
.emergency-close-btn{position:absolute;top:1rem;right:1rem;z-index:10;background:rgba(255,255,255,0.2);border:none;color:#fff;width:36px;height:36px;border-radius:50%;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
.emergency-close-btn:hover{background:rgba(255,255,255,0.3);transform:scale(1.1)}
.emergency-header{background:linear-gradient(135deg,#dc2626,#b91c1c);padding:1.5rem;display:flex;align-items:center;gap:1rem;position:relative;overflow:hidden}
.emergency-header::before{content:'';position:absolute;top:-50%;right:-20%;width:200px;height:200px;background:rgba(255,255,255,0.1);border-radius:50%}
.emergency-header::after{content:'';position:absolute;bottom:-30%;left:-10%;width:150px;height:150px;background:rgba(255,255,255,0.05);border-radius:50%}
.emergency-header-icon{width:60px;height:60px;background:rgba(255,255,255,0.2);border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:1.8rem;color:#fff;position:relative;z-index:1;overflow:hidden}
.emergency-header-text{position:relative;z-index:1}
.emergency-header-text h2{color:#fff;font-size:1.4rem;font-weight:700;margin:0}
.emergency-header-text p{color:rgba(255,255,255,0.9);font-size:.85rem;margin-top:.25rem}
.emergency-priority-section{padding:1rem;background:linear-gradient(180deg,#fef2f2,#fff);display:flex;flex-direction:column;gap:.75rem}
.emergency-priority-card{display:flex;align-items:center;gap:1rem;padding:1rem;background:#fff;border-radius:16px;box-shadow:0 4px 15px rgba(220,38,38,0.15);border:2px solid #fecaca;cursor:pointer;transition:all .2s}
.emergency-priority-card:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(220,38,38,0.25);border-color:#f87171}
.emergency-priority-card.clinic{border-color:#bbf7d0;box-shadow:0 4px 15px rgba(34,197,94,0.15)}
.emergency-priority-card.clinic:hover{border-color:#4ade80;box-shadow:0 8px 25px rgba(34,197,94,0.25)}
.emergency-priority-card.clinic .priority-icon{background:linear-gradient(135deg,#22c55e,#16a34a)}
.priority-icon{width:50px;height:50px;background:linear-gradient(135deg,#ef4444,#dc2626);border-radius:14px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.3rem;flex-shrink:0;overflow:hidden}
.priority-info{flex:1;display:flex;flex-direction:column;gap:.2rem}
.priority-label{font-weight:700;font-size:.95rem;color:#1e293b;text-transform:uppercase;letter-spacing:.02em}
.priority-number{font-size:1.1rem;font-weight:700;color:#dc2626}
.emergency-priority-card.clinic .priority-number{color:#16a34a}
.priority-action{color:#94a3b8;font-size:1rem}
.emergency-section{padding:1rem}
.emergency-section-header{display:flex;align-items:center;gap:.6rem;font-weight:700;font-size:.95rem;color:#475569;margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:2px solid #e2e8f0}
.emergency-section-header i{color:#3b82f6}
.emergency-section-header.external i{color:#8b5cf6}
.emergency-contacts-grid{display:flex;flex-direction:column;gap:.75rem}
.emergency-contact-card{background:#fff;border-radius:14px;border:1px solid #e2e8f0;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,0.04)}
.contact-category{padding:.6rem .9rem;font-weight:700;font-size:.8rem;color:#fff;display:flex;align-items:center;gap:.5rem}
.emergency-contact-card.management .contact-category{background:linear-gradient(135deg,#6366f1,#4f46e5)}
.emergency-contact-card.hsse .contact-category{background:linear-gradient(135deg,#f97316,#ea580c)}
.emergency-contact-card.engineering .contact-category{background:linear-gradient(135deg,#0ea5e9,#0284c7)}
.emergency-contact-card.medical .contact-category{background:linear-gradient(135deg,#22c55e,#16a34a)}
.emergency-contact-card.operations .contact-category{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}
.contact-item{display:flex;flex-wrap:wrap;align-items:center;padding:.6rem .9rem;border-bottom:1px solid #f1f5f9;cursor:pointer;transition:background .2s}
.contact-item:last-child{border-bottom:none}
.contact-item:hover{background:#f8fafc}
.contact-name{font-weight:600;font-size:.85rem;color:#1e293b;flex:1;min-width:120px}
.contact-role{font-size:.75rem;color:#64748b;flex:1;min-width:100px}
.contact-phone{font-weight:600;font-size:.8rem;color:#3b82f6;display:flex;align-items:center;gap:.3rem;white-space:nowrap}
.contact-phone i{font-size:.7rem}
.external-section{background:#faf5ff;border-top:1px solid #e9d5ff}
.external-services-grid{display:flex;flex-direction:column;gap:.75rem}
.external-service-card{background:#fff;border-radius:14px;border:1px solid #e2e8f0;overflow:hidden}
.service-category{padding:.6rem .9rem;font-weight:700;font-size:.8rem;color:#fff;display:flex;align-items:center;gap:.5rem}
.external-service-card.hospitals .service-category{background:linear-gradient(135deg,#ec4899,#db2777)}
.external-service-card.government .service-category{background:linear-gradient(135deg,#6366f1,#4f46e5)}
.service-item{display:flex;align-items:center;justify-content:space-between;padding:.6rem .9rem;border-bottom:1px solid #f1f5f9;cursor:pointer;transition:background .2s}
.service-item:last-child{border-bottom:none}
.service-item:hover{background:#f8fafc}
.service-name{font-weight:500;font-size:.85rem;color:#374151}
.service-phone{font-weight:600;font-size:.85rem;color:#8b5cf6;display:flex;align-items:center;gap:.3rem}
.service-phone i{font-size:.7rem}
.govt-service{display:flex;align-items:center;gap:.75rem;padding:.75rem .9rem;border-bottom:1px solid #f1f5f9;cursor:pointer;transition:all .2s}
.govt-service:last-child{border-bottom:none}
.govt-service:hover{background:#f8fafc;transform:translateX(4px)}
.govt-icon{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.1rem;overflow:hidden}
.govt-icon.fire{background:linear-gradient(135deg,#ef4444,#dc2626)}
.govt-icon.ambulance{background:linear-gradient(135deg,#22c55e,#16a34a)}
.govt-icon.police{background:linear-gradient(135deg,#3b82f6,#2563eb)}
.govt-icon.traffic{background:linear-gradient(135deg,#f97316,#ea580c)}
.govt-info{flex:1;display:flex;flex-direction:column;gap:.15rem}
.govt-name{font-weight:500;font-size:.85rem;color:#374151}
.govt-number{font-weight:700;font-size:1.2rem;color:#1e293b}

body.dark-mode .emergency-modal-content{background:#1e293b}
body.dark-mode .emergency-header{background:linear-gradient(135deg,#991b1b,#7f1d1d)}
body.dark-mode .emergency-priority-section{background:linear-gradient(180deg,rgba(127,29,29,0.3),#1e293b)}
body.dark-mode .emergency-priority-card{background:#0f172a;border-color:rgba(248,113,113,0.4);box-shadow:0 4px 15px rgba(0,0,0,0.3)}
body.dark-mode .emergency-priority-card:hover{background:#1e293b;border-color:#f87171;box-shadow:0 8px 25px rgba(220,38,38,0.3)}
body.dark-mode .emergency-priority-card.clinic{border-color:rgba(74,222,128,0.4);box-shadow:0 4px 15px rgba(0,0,0,0.3)}
body.dark-mode .emergency-priority-card.clinic:hover{border-color:#4ade80;box-shadow:0 8px 25px rgba(34,197,94,0.3)}
body.dark-mode .priority-label{color:#f1f5f9}
body.dark-mode .priority-number{color:#fca5a5}
body.dark-mode .emergency-priority-card.clinic .priority-number{color:#86efac}
body.dark-mode .priority-action{color:#64748b}
body.dark-mode .emergency-section{background:#1e293b}
body.dark-mode .emergency-section-header{color:#cbd5e1;border-color:#334155}
body.dark-mode .emergency-contacts-grid{background:transparent}
body.dark-mode .emergency-contact-card{background:#0f172a;border-color:#334155;box-shadow:0 2px 8px rgba(0,0,0,0.2)}
body.dark-mode .contact-item{border-color:#1e293b}
body.dark-mode .contact-item:hover{background:#1e293b}
body.dark-mode .contact-name{color:#f1f5f9}
body.dark-mode .contact-role{color:#94a3b8}
body.dark-mode .contact-phone{color:#60a5fa}
body.dark-mode .external-section{background:rgba(139,92,246,0.08);border-color:#334155}
body.dark-mode .external-services-grid{background:transparent}
body.dark-mode .external-service-card{background:#0f172a;border-color:#334155;box-shadow:0 2px 8px rgba(0,0,0,0.2)}
body.dark-mode .service-item{border-color:#1e293b}
body.dark-mode .service-item:hover{background:#1e293b}
body.dark-mode .service-name{color:#e2e8f0}
body.dark-mode .service-phone{color:#a78bfa}
body.dark-mode .govt-service{border-color:#1e293b}
body.dark-mode .govt-service:hover{background:#1e293b}
body.dark-mode .govt-name{color:#e2e8f0}
body.dark-mode .govt-number{color:#f1f5f9}

@media (max-width:768px){
.emergency-modal-content{max-width:95%;width:95%;margin:1rem;border-radius:16px;max-height:90vh}
.emergency-header{padding:1.25rem}
.emergency-header-icon{width:50px;height:50px;font-size:1.5rem;border-radius:12px}
.emergency-header-text h2{font-size:1.2rem}
.emergency-header-text p{font-size:.8rem}
.emergency-priority-section{padding:.75rem}
.emergency-priority-card{padding:.75rem;gap:.75rem;border-radius:12px}
.priority-icon{width:42px;height:42px;font-size:1.1rem;border-radius:10px}
.priority-label{font-size:.85rem}
.priority-number{font-size:1rem}
.emergency-section{padding:.75rem}
.emergency-section-header{font-size:.85rem;gap:.5rem}
.contact-category,.service-category{padding:.5rem .75rem;font-size:.75rem}
.contact-item{padding:.5rem .75rem}
.contact-name{font-size:.8rem}
.contact-role{font-size:.7rem}
.contact-phone{font-size:.75rem}
.service-item{padding:.5rem .75rem}
.service-name{font-size:.8rem}
.service-phone{font-size:.8rem}
.govt-service{padding:.6rem .75rem;gap:.6rem}
.govt-icon{width:36px;height:36px;font-size:1rem;border-radius:10px}
.govt-name{font-size:.8rem}
.govt-number{font-size:1rem}
}

@media (max-width:480px){
.emergency-modal-content{max-width:100%;width:100%;margin:0;border-radius:0;max-height:100vh;height:100vh}
.emergency-header{padding:1rem}
.emergency-header::before,.emergency-header::after{display:none}
.emergency-header-icon{width:44px;height:44px;font-size:1.3rem;border-radius:10px}
.emergency-header-text h2{font-size:1.1rem}
.emergency-header-text p{font-size:.75rem}
.emergency-close-btn{width:32px;height:32px;font-size:1.2rem;top:.75rem;right:.75rem}
.emergency-priority-section{padding:.6rem;gap:.5rem}
.emergency-priority-card{padding:.6rem;gap:.6rem;border-radius:10px}
.priority-icon{width:38px;height:38px;font-size:1rem;border-radius:8px}
.priority-info{gap:.1rem}
.priority-label{font-size:.8rem}
.priority-number{font-size:.9rem}
.priority-action{font-size:.85rem}
.emergency-section{padding:.6rem}
.emergency-section-header{font-size:.8rem;margin-bottom:.5rem;padding-bottom:.4rem}
.emergency-contacts-grid,.external-services-grid{gap:.5rem}
.emergency-contact-card,.external-service-card{border-radius:10px}
.contact-category,.service-category{padding:.4rem .6rem;font-size:.7rem}
.contact-item{flex-direction:column;align-items:flex-start;gap:.25rem;padding:.5rem .6rem}
.contact-name,.contact-role{min-width:unset;width:100%}
.contact-name{font-size:.78rem}
.contact-role{font-size:.68rem}
.contact-phone{margin-top:.15rem;font-size:.75rem}
.service-item{padding:.5rem .6rem}
.service-name{font-size:.78rem}
.service-phone{font-size:.78rem}
.govt-service{padding:.5rem .6rem;gap:.5rem}
.govt-icon{width:32px;height:32px;font-size:.9rem;border-radius:8px}
.govt-name{font-size:.75rem}
.govt-number{font-size:.9rem}
}

.about-btn{width:100%;padding:.8rem;border:none;border-radius:12px;background:linear-gradient(135deg,#3b82f6,#6366f1);color:#fff;font-size:.9rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .2s;margin-top:.75rem}
.about-btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(99,102,241,0.3)}
.about-modal-content{max-width:400px;padding:0;overflow:hidden;border-radius:24px;text-align:center}
.about-header{background:linear-gradient(135deg,#3b82f6,#6366f1);padding:2rem 1.5rem;position:relative;overflow:hidden}
.about-header::before{content:'';position:absolute;top:-50%;right:-20%;width:200px;height:200px;background:rgba(255,255,255,0.1);border-radius:50%}
.about-header::after{content:'';position:absolute;bottom:-30%;left:-10%;width:150px;height:150px;background:rgba(255,255,255,0.05);border-radius:50%}
.about-logo{width:80px;height:80px;border-radius:20px;object-fit:cover;margin-bottom:1rem;box-shadow:0 8px 24px rgba(0,0,0,0.2);position:relative;z-index:1}
.about-title{color:#fff;font-size:1.4rem;font-weight:700;margin:0;position:relative;z-index:1}
.about-version{color:rgba(255,255,255,0.9);font-size:.85rem;margin-top:.3rem;position:relative;z-index:1}
.about-body{padding:1.5rem}
.about-section{margin-bottom:1.25rem}
.about-section:last-child{margin-bottom:0}
.about-section-title{font-size:.75rem;color:#64748b;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem;font-weight:600}
.about-org{font-size:.9rem;font-weight:600;color:#1e293b}
.about-project{font-size:.8rem;color:#64748b;margin-top:.2rem}
.developers-list{display:flex;flex-direction:column;gap:.6rem}
.developer-card{display:flex;align-items:center;gap:.75rem;padding:.6rem;background:#f8fafc;border-radius:12px;transition:all .2s}
.developer-card:hover{background:#f1f5f9;transform:translateX(4px)}
.developer-avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#6366f1,#8b5cf6);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:.9rem;flex-shrink:0}
.developer-avatar-img{width:40px;height:40px;border-radius:50%;object-fit:cover;flex-shrink:0;border:2px solid #e2e8f0}
.developer-info{flex:1;text-align:left}
.developer-name{font-weight:600;font-size:.85rem;color:#1e293b}
.developer-id{font-size:.7rem;color:#64748b}
.developer-linkedin{width:32px;height:32px;border-radius:8px;background:#0a66c2;color:#fff;display:flex;align-items:center;justify-content:center;font-size:.9rem;text-decoration:none;transition:all .2s;flex-shrink:0}
.developer-linkedin:hover{background:#004182;transform:scale(1.1)}
.about-copyright{font-size:.75rem;color:#94a3b8;padding-top:1rem;border-top:1px solid #e2e8f0}
body.dark-mode .about-modal-content{background:#1e293b}
body.dark-mode .about-body{background:#1e293b}
body.dark-mode .about-section-title{color:#94a3b8}
body.dark-mode .about-org{color:#f1f5f9}
body.dark-mode .about-project{color:#94a3b8}
body.dark-mode .developer-card{background:#0f172a}
body.dark-mode .developer-card:hover{background:#1e293b}
body.dark-mode .developer-name{color:#f1f5f9}
body.dark-mode .developer-id{color:#94a3b8}
body.dark-mode .about-copyright{color:#64748b;border-color:#334155}
body.dark-mode .library-card:nth-child(1) i{background:linear-gradient(135deg,#4ade80,#22c55e);-webkit-background-clip:text;background-clip:text}
body.dark-mode .library-card:nth-child(2) i{background:linear-gradient(135deg,#fbbf24,#f59e0b);-webkit-background-clip:text;background-clip:text}
body.dark-mode .library-card:nth-child(3) i{background:linear-gradient(135deg,#f87171,#ef4444);-webkit-background-clip:text;background-clip:text}
body.dark-mode .library-card:nth-child(4) i{background:linear-gradient(135deg,#60a5fa,#3b82f6);-webkit-background-clip:text;background-clip:text}
body.dark-mode .library-card:nth-child(5) i{background:linear-gradient(135deg,#a78bfa,#8b5cf6);-webkit-background-clip:text;background-clip:text}

.permit-areas-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.6rem;margin-bottom:.9rem;padding:.75rem;background:var(--card-bg);border-radius:16px;border:1px solid var(--card-border);box-shadow:0 6px 16px rgba(15,23,42,0.05)}
.permit-area-box{position:relative;padding:.65rem .5rem;border-radius:12px;text-align:center;cursor:pointer;transition:all .2s;border:2px solid transparent;min-height:70px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.permit-area-box.area-red{background:linear-gradient(135deg,#fee2e2,#fecaca);border-color:#f87171;color:#b91c1c}
.permit-area-box.area-green{background:linear-gradient(135deg,#dcfce7,#bbf7d0);border-color:#22c55e;color:#15803d}
.permit-area-box.area-active{box-shadow:0 0 0 3px rgba(59,130,246,0.5);transform:scale(1.02)}
.permit-area-box:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,0.15)}
.permit-area-name{font-size:.72rem;font-weight:600;line-height:1.2;word-break:break-word;margin-bottom:.25rem}
.permit-area-count{position:absolute;top:-.35rem;right:-.35rem;min-width:22px;height:22px;padding:0 .4rem;border-radius:999px;font-size:.7rem;font-weight:700;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,0.2)}
.permit-area-box.area-green .permit-area-count{background:#15803d;color:#fff}
.permit-area-box.area-red .permit-area-count{background:#dc2626;color:#fff}
.permit-areas-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem;padding:0 .25rem}
.permit-areas-title{font-size:.8rem;font-weight:600;color:var(--text-main);display:flex;align-items:center;gap:.4rem}
.permit-areas-title i{color:#6366f1}
.permit-areas-clear{font-size:.7rem;color:#3b82f6;cursor:pointer;padding:.25rem .5rem;border-radius:999px;background:rgba(59,130,246,0.1);border:none}
.permit-areas-clear:hover{background:rgba(59,130,246,0.2)}
body.dark-mode .permit-areas-grid{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2)}
body.dark-mode .permit-area-box.area-red{background:linear-gradient(135deg,#450a0a,#7f1d1d);border-color:#ef4444;color:#fca5a5}
body.dark-mode .permit-area-box.area-green{background:linear-gradient(135deg,#052e16,#14532d);border-color:#22c55e;color:#86efac}
body.dark-mode .permit-areas-title{color:#e5e7eb}

.areas-grid-wrapper{margin-bottom:.9rem}
.areas-grid-toggle{display:flex;justify-content:space-between;align-items:center;padding:.6rem .75rem;background:var(--card-bg);border-radius:12px 12px 0 0;border:1px solid var(--card-border);border-bottom:none;cursor:pointer;transition:all .2s}
.areas-grid-toggle:hover{background:rgba(99,102,241,0.05)}
.areas-grid-toggle.collapsed{border-radius:12px;border-bottom:1px solid var(--card-border)}
.areas-grid-toggle-left{display:flex;align-items:center;gap:.5rem}
.areas-grid-toggle-title{font-size:.8rem;font-weight:600;color:var(--text-main)}
.areas-grid-toggle-title i{color:#6366f1;margin-right:.3rem}
.areas-grid-toggle-arrow{width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:6px;background:rgba(99,102,241,0.1);color:#6366f1;transition:all .3s ease}
.areas-grid-toggle-arrow i{font-size:.7rem;transition:transform .3s ease}
.areas-grid-toggle.collapsed .areas-grid-toggle-arrow i{transform:rotate(-90deg)}
.areas-grid-content{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.6rem;padding:.75rem;background:var(--card-bg);border-radius:0 0 12px 12px;border:1px solid var(--card-border);border-top:none;box-shadow:0 6px 16px rgba(15,23,42,0.05);overflow:hidden;transition:all .3s ease;max-height:500px}
.areas-grid-content.collapsed{max-height:0;padding:0 .75rem;border:none;opacity:0}
.areas-grid-clear{font-size:.7rem;color:#3b82f6;cursor:pointer;padding:.25rem .5rem;border-radius:999px;background:rgba(59,130,246,0.1);border:none;margin-left:auto;margin-right:.5rem}
.areas-grid-clear:hover{background:rgba(59,130,246,0.2)}
body.dark-mode .areas-grid-toggle{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2)}
body.dark-mode .areas-grid-toggle:hover{background:rgba(99,102,241,0.1)}
body.dark-mode .areas-grid-content{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2)}
body.dark-mode .areas-grid-toggle-title{color:#e5e7eb}

.training-matrix-container{background:var(--card-bg);border-radius:var(--radius-card);padding:1rem;border:1px solid var(--card-border);box-shadow:0 8px 22px rgba(15,23,42,0.06)}
.training-role-selector{margin-bottom:1rem}
.training-role-selector label{display:flex;align-items:center;gap:.4rem;font-size:.85rem;font-weight:600;margin-bottom:.5rem;color:var(--text-main)}
.training-role-selector label i{color:#6366f1}
.training-role-selector select{width:100%;padding:.65rem .9rem;border-radius:12px;border:1px solid rgba(148,163,184,0.5);font-size:.9rem;background:var(--card-bg);color:var(--text-main);cursor:pointer;transition:all .2s}
.training-role-selector select:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,0.15)}
.training-list-container{min-height:120px}
.training-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 1rem;color:var(--text-soft);text-align:center}
.training-empty-state i{font-size:2.5rem;opacity:.5;margin-bottom:.75rem}
.training-empty-state p{font-size:.85rem}
.training-list{display:flex;flex-direction:column;gap:.5rem}
.training-item{display:flex;align-items:center;justify-content:space-between;padding:.65rem .85rem;background:linear-gradient(135deg,#f8fafc,#f1f5f9);border-radius:12px;border:1px solid rgba(148,163,184,0.2);transition:all .2s}
.training-item:hover{transform:translateX(4px);box-shadow:0 4px 12px rgba(0,0,0,0.08)}
.training-item-name{font-size:.85rem;font-weight:500;color:var(--text-main);flex:1}
.training-item-validity{display:flex;align-items:center;gap:.35rem;padding:.25rem .65rem;border-radius:999px;font-size:.72rem;font-weight:600}
.training-item-validity.validity-2yr{background:linear-gradient(135deg,#dcfce7,#bbf7d0);color:#15803d}
.training-item-validity.validity-1yr{background:linear-gradient(135deg,#fef3c7,#fde68a);color:#b45309}
.training-item-validity i{font-size:.65rem}
.training-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(148,163,184,0.2)}
.training-stat{text-align:center;padding:.5rem}
.training-stat .stat-number{font-size:1.4rem;font-weight:700;display:block}
.training-stat:nth-child(1) .stat-number{color:#6366f1}
.training-stat:nth-child(2) .stat-number{color:#15803d}
.training-stat:nth-child(3) .stat-number{color:#f59e0b}
.training-stat .stat-label{font-size:.7rem;color:var(--text-soft);text-transform:uppercase;letter-spacing:.03em}
body.dark-mode .training-matrix-container{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2)}
body.dark-mode .training-role-selector select{background:#0f172a;border-color:rgba(148,163,184,0.4);color:#e5e7eb}
body.dark-mode .training-item{background:linear-gradient(135deg,#1e293b,#0f172a);border-color:rgba(148,163,184,0.2)}
body.dark-mode .training-item-name{color:#e5e7eb}
body.dark-mode .training-stats{border-color:rgba(148,163,184,0.2)}

.admin-section-purple{border-left:4px solid #8b5cf6;margin-bottom:1rem}
.admin-badge-purple{background:linear-gradient(135deg,#8b5cf6,#6366f1);color:#fff;padding:.4rem .8rem;border-radius:999px;font-size:.8rem;font-weight:600;display:inline-flex;align-items:center;gap:.4rem}
.admin-card-purple{background:linear-gradient(135deg,rgba(139,92,246,0.1),rgba(99,102,241,0.1));border:1px solid rgba(139,92,246,0.3);color:#8b5cf6}
.admin-card-purple:hover{background:linear-gradient(135deg,rgba(139,92,246,0.2),rgba(99,102,241,0.2));transform:translateY(-2px);box-shadow:0 8px 20px rgba(139,92,246,0.2)}
.admin-card-purple i{color:#8b5cf6}
body.dark-mode .admin-card-purple{background:linear-gradient(135deg,rgba(139,92,246,0.15),rgba(99,102,241,0.15));border-color:rgba(139,92,246,0.4);color:#a78bfa}
body.dark-mode .admin-card-purple i{color:#a78bfa}

.admin-section-indigo{border-left:4px solid #4f46e5;margin-bottom:1rem}
.admin-badge-indigo{background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;padding:.4rem .8rem;border-radius:999px;font-size:.8rem;font-weight:600;display:inline-flex;align-items:center;gap:.4rem}
.admin-card-indigo{background:linear-gradient(135deg,rgba(79,70,229,0.1),rgba(99,102,241,0.1));border:1px solid rgba(79,70,229,0.3);color:#4f46e5}
.admin-card-indigo:hover{background:linear-gradient(135deg,rgba(79,70,229,0.2),rgba(99,102,241,0.2));transform:translateY(-2px);box-shadow:0 8px 20px rgba(79,70,229,0.2)}
.admin-card-indigo i{color:#4f46e5}
body.dark-mode .admin-card-indigo{background:linear-gradient(135deg,rgba(79,70,229,0.15),rgba(99,102,241,0.15));border-color:rgba(79,70,229,0.4);color:#818cf8}
body.dark-mode .admin-card-indigo i{color:#818cf8}

.doc-admin-form{display:flex;gap:.5rem;margin-bottom:.75rem;flex-wrap:wrap;padding:.75rem;background:rgba(248,250,252,0.5);border-radius:12px;border:1px solid var(--card-border)}
.doc-admin-form input,.doc-admin-form select{flex:1;min-width:120px;padding:.5rem .75rem;border-radius:10px;border:1px solid rgba(148,163,184,0.5);font-size:.85rem;background:#fff}
.doc-admin-form button{padding:.5rem 1rem;border-radius:10px;border:none;background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap}
.doc-admin-form button:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(79,70,229,0.3)}
.doc-admin-form button.cancel-btn{background:linear-gradient(135deg,#ef4444,#dc2626)}
.doc-filter-bar{margin-bottom:.75rem;padding:.5rem .75rem;background:rgba(248,250,252,0.5);border-radius:10px;border:1px solid var(--card-border)}
.doc-filter-bar select{width:100%;padding:.5rem;border-radius:8px;border:1px solid rgba(148,163,184,0.5);font-size:.85rem;background:#fff}
.doc-items-list{display:flex;flex-direction:column;gap:.5rem;max-height:400px;overflow-y:auto}
.doc-item{display:flex;align-items:center;justify-content:space-between;padding:.65rem .85rem;background:linear-gradient(135deg,#f8fafc,#f1f5f9);border-radius:12px;border:1px solid rgba(148,163,184,0.2);transition:all .2s}
.doc-item:hover{transform:translateX(4px);box-shadow:0 4px 12px rgba(0,0,0,0.08)}
.doc-item-info{display:flex;align-items:center;gap:.5rem;flex:1;overflow:hidden}
.doc-item-icon{width:32px;height:32px;border-radius:8px;background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.8rem;flex-shrink:0}
.doc-item-details{flex:1;overflow:hidden}
.doc-item-name{font-size:.85rem;font-weight:500;color:var(--text-main);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.doc-item-category{font-size:.7rem;color:var(--text-soft)}
.doc-item-actions{display:flex;gap:.35rem}
.doc-item-btn{width:30px;height:30px;border-radius:8px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.8rem;transition:all .2s}
.doc-item-btn.edit-btn{background:rgba(59,130,246,0.1);color:#3b82f6}
.doc-item-btn.edit-btn:hover{background:rgba(59,130,246,0.2)}
.doc-item-btn.delete-btn{background:rgba(239,68,68,0.1);color:#ef4444}
.doc-item-btn.delete-btn:hover{background:rgba(239,68,68,0.2)}
body.dark-mode .doc-admin-form{background:rgba(15,23,42,0.5);border-color:rgba(148,163,184,0.2)}
body.dark-mode .doc-admin-form input,body.dark-mode .doc-admin-form select{background:#0f172a;border-color:rgba(148,163,184,0.4);color:#e5e7eb}
body.dark-mode .doc-filter-bar{background:rgba(15,23,42,0.5);border-color:rgba(148,163,184,0.2)}
body.dark-mode .doc-filter-bar select{background:#0f172a;border-color:rgba(148,163,184,0.4);color:#e5e7eb}
body.dark-mode .doc-item{background:linear-gradient(135deg,#1e293b,#0f172a);border-color:rgba(148,163,184,0.2)}
body.dark-mode .doc-item-name{color:#e5e7eb}

.training-admin-list{display:flex;flex-direction:column;gap:.5rem;margin-top:.75rem}
.training-admin-item{display:flex;align-items:center;justify-content:space-between;padding:.6rem .85rem;background:var(--card-bg);border-radius:12px;border:1px solid var(--card-border)}
.training-admin-item-name{font-size:.85rem;font-weight:500;flex:1}
.training-admin-item-validity{font-size:.75rem;color:#6366f1;margin-right:.75rem}
.training-admin-actions{display:flex;gap:.35rem}
.training-admin-btn{width:30px;height:30px;border-radius:8px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.8rem;transition:all .2s}
.training-admin-btn.edit-btn{background:rgba(59,130,246,0.1);color:#3b82f6}
.training-admin-btn.edit-btn:hover{background:rgba(59,130,246,0.2)}
.training-admin-btn.delete-btn{background:rgba(239,68,68,0.1);color:#ef4444}
.training-admin-btn.delete-btn:hover{background:rgba(239,68,68,0.2)}
.training-admin-add-form{display:flex;gap:.5rem;margin-bottom:.75rem;flex-wrap:wrap}
.training-admin-add-form input,.training-admin-add-form select{flex:1;min-width:120px;padding:.5rem .75rem;border-radius:10px;border:1px solid rgba(148,163,184,0.5);font-size:.85rem}
.training-admin-add-form button{padding:.5rem 1rem;border-radius:10px;border:none;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap}
.training-admin-add-form button:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(99,102,241,0.3)}
.training-assignments-container{margin-top:.75rem}
.training-assignments-role-select{margin-bottom:.75rem}
.training-assignments-role-select select{width:100%;padding:.5rem .75rem;border-radius:10px;border:1px solid rgba(148,163,184,0.5);font-size:.85rem}
.training-assignments-checkboxes{display:flex;flex-direction:column;gap:.4rem;max-height:300px;overflow-y:auto;padding:.5rem;background:rgba(248,250,252,0.5);border-radius:12px;border:1px solid var(--card-border)}
.training-assignment-item{display:flex;align-items:center;gap:.5rem;padding:.4rem .6rem;border-radius:8px;transition:background .2s}
.training-assignment-item:hover{background:rgba(99,102,241,0.05)}
.training-assignment-item input[type="checkbox"]{width:18px;height:18px;accent-color:#6366f1;cursor:pointer}
.training-assignment-item label{font-size:.85rem;cursor:pointer;flex:1}
.training-assignment-item .validity-tag{font-size:.7rem;padding:.15rem .4rem;border-radius:999px;background:rgba(99,102,241,0.1);color:#6366f1}
.training-assignments-save{margin-top:.75rem;padding:.5rem 1.5rem;border-radius:10px;border:none;background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s}
.training-assignments-save:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(34,197,94,0.3)}
body.dark-mode .training-admin-item{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2);color:#e5e7eb}
body.dark-mode .training-admin-add-form input,body.dark-mode .training-admin-add-form select{background:#0f172a;border-color:rgba(148,163,184,0.4);color:#e5e7eb}
body.dark-mode .training-assignments-checkboxes{background:rgba(15,23,42,0.5);border-color:rgba(148,163,184,0.2)}
body.dark-mode .training-assignment-item label{color:#e5e7eb}

.training-admin-btn.assign-btn{background:rgba(139,92,246,0.1);color:#8b5cf6;width:auto;padding:0 .6rem;font-size:.7rem;gap:.25rem}
.training-admin-btn.assign-btn:hover{background:rgba(139,92,246,0.2)}
.inline-assignments-panel{margin:.5rem 0;padding:1rem;background:linear-gradient(135deg,rgba(139,92,246,0.05),rgba(99,102,241,0.05));border:1px solid rgba(139,92,246,0.3);border-radius:12px;animation:slideDown .2s ease-out}
@keyframes slideDown{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
.inline-assignments-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}
.inline-assignments-header h4{font-size:.9rem;font-weight:600;color:#8b5cf6;margin:0}
.close-inline-panel{width:28px;height:28px;border-radius:8px;border:none;background:rgba(239,68,68,0.1);color:#ef4444;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.8rem}
.close-inline-panel:hover{background:rgba(239,68,68,0.2)}
.inline-assignments-checkboxes{display:flex;flex-direction:column;gap:.4rem;max-height:250px;overflow-y:auto;padding:.5rem;background:rgba(248,250,252,0.5);border-radius:10px;border:1px solid var(--card-border)}
.inline-assignments-actions{display:flex;gap:.5rem;margin-top:.75rem;justify-content:flex-end}
.inline-cancel-btn{padding:.5rem 1rem;border-radius:10px;border:1px solid rgba(148,163,184,0.5);background:transparent;color:var(--text-soft);font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s}
.inline-cancel-btn:hover{background:rgba(148,163,184,0.1)}
body.dark-mode .inline-assignments-panel{background:linear-gradient(135deg,rgba(139,92,246,0.08),rgba(99,102,241,0.08));border-color:rgba(139,92,246,0.4)}
body.dark-mode .inline-assignments-checkboxes{background:rgba(15,23,42,0.5);border-color:rgba(148,163,184,0.2)}
body.dark-mode .inline-assignments-header h4{color:#a78bfa}

.tools-categories{display:flex;flex-direction:column;gap:1.25rem}
#toolsGrid{display:flex!important}
#toolsGrid[style*="display: grid"],#toolsGrid[style*="display:grid"]{display:flex!important}
.tools-category{background:var(--card-bg);border-radius:20px;border:1px solid var(--card-border);overflow:hidden;box-shadow:0 4px 16px rgba(15,23,42,0.06)}
.tools-category-featured{background:linear-gradient(135deg,#fff7ed 0%,#ffedd5 100%);border:2px solid #f97316}
.tools-category-header{display:flex;align-items:center;gap:.65rem;padding:.85rem 1rem;background:linear-gradient(135deg,rgba(14,165,233,0.08),rgba(6,182,212,0.05));border-bottom:1px solid var(--card-border);font-size:.85rem;font-weight:700;color:#0891b2}
.tools-category-header i{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,#0891b2,#0ea5e9);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.8rem}
.tools-category .tools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:.65rem;padding:1rem}
.tool-card{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:.85rem .65rem;border-radius:14px;background:var(--card-bg);border:1px solid rgba(148,163,184,0.15);box-shadow:0 4px 12px rgba(15,23,42,0.04);cursor:pointer;transition:all .25s ease;min-height:85px}
.tool-card:hover{transform:translateY(-3px);box-shadow:0 10px 25px rgba(15,23,42,0.1);border-color:rgba(14,165,233,0.3)}
.tool-card span{font-size:.7rem;font-weight:600;text-align:center;color:var(--text-main);margin-top:.4rem;line-height:1.25}
.tool-card-icon-wrap{width:50px;height:48px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:.9rem;color:#fff;box-shadow:0 3px 8px rgba(0,0,0,0.12);overflow:hidden;flex-shrink:0}
.tool-card-icon-wrap i{max-width:100%;max-height:100%}
.tool-card-icon-wrap.featured{background:linear-gradient(135deg,#f97316,#ea580c);width:50px;height:48px;font-size:1rem}
.tool-card-icon-wrap.emergency{background:linear-gradient(135deg,#10b981,#059669)}
.tool-card-icon-wrap.medical{background:linear-gradient(135deg,#ef4444,#dc2626)}
.tool-card-icon-wrap.blue{background:linear-gradient(135deg,#3b82f6,#2563eb)}
.tool-card-icon-wrap.danger{background:linear-gradient(135deg,#dc2626,#b91c1c)}
.tool-card-icon-wrap.orange{background:linear-gradient(135deg,#f97316,#ea580c)}
.tool-card-icon-wrap.warning{background:linear-gradient(135deg,#f59e0b,#d97706)}
.tool-card-icon-wrap.pink{background:linear-gradient(135deg,#ec4899,#db2777)}
.tool-card-icon-wrap.cyan{background:linear-gradient(135deg,#06b6d4,#0891b2)}
.tool-card-icon-wrap.purple{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}
.tool-card-icon-wrap.teal{background:linear-gradient(135deg,#14b8a6,#0d9488)}
.tool-card-icon-wrap.success{background:linear-gradient(135deg,#22c55e,#16a34a)}
.tool-card-icon-wrap.slate{background:linear-gradient(135deg,#64748b,#475569)}
.tool-card-icon-wrap.indigo{background:linear-gradient(135deg,#6366f1,#4f46e5)}
.tool-card-icon-wrap.navy{background:linear-gradient(135deg,#1e3a5f,#0f172a)}
.tool-card-icon-wrap.lime{background:linear-gradient(135deg,#84cc16,#65a30d)}
.tool-card.tool-card-featured{flex-direction:row;gap:.85rem;padding:1rem 1.25rem;min-height:auto;background:transparent;border:none;box-shadow:none}
.tool-card.tool-card-featured:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(249,115,22,0.2)}
.tool-card-content{display:flex;flex-direction:column;align-items:flex-start;gap:.25rem}
.tool-card-title{font-size:.95rem;font-weight:700;color:#c2410c}
.tool-badge{background:linear-gradient(135deg,#f97316,#ea580c);color:#fff;font-size:.6rem;padding:3px 8px;border-radius:10px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
body.dark-mode .tools-category{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2)}
body.dark-mode .tools-category-featured{background:linear-gradient(135deg,rgba(249,115,22,0.15),rgba(234,88,12,0.1));border-color:#f97316}
body.dark-mode .tools-category-header{background:linear-gradient(135deg,rgba(14,165,233,0.12),rgba(6,182,212,0.08));border-color:rgba(148,163,184,0.2);color:#38bdf8}
body.dark-mode .tool-card{background:rgba(30,41,59,0.8);border-color:rgba(148,163,184,0.15)}
body.dark-mode .tool-card span{color:#e5e7eb}
body.dark-mode .tool-card-title{color:#fdba74}

.ppe-tasks-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem;margin-bottom:1rem}
.ppe-task-card{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1rem;border-radius:16px;background:var(--card-bg);border:2px solid var(--card-border);cursor:pointer;transition:all .25s ease;text-align:center}
.ppe-task-card:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(15,23,42,0.15);border-color:rgba(20,184,166,0.4)}
.ppe-task-card.selected{border-color:#14b8a6;background:linear-gradient(135deg,rgba(20,184,166,0.08),rgba(13,148,136,0.08));box-shadow:0 8px 24px rgba(20,184,166,0.2)}
.ppe-task-icon{width:48px;height:48px;border-radius:14px;background:linear-gradient(135deg,#14b8a6,#0d9488);display:flex;align-items:center;justify-content:center;font-size:1.3rem;color:#fff;overflow:hidden;flex-shrink:0}
.ppe-task-card span{font-size:.8rem;font-weight:600;color:var(--text-main)}
.ppe-results-container{margin-top:1rem;animation:fadeIn .3s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.ppe-results-section{margin-bottom:1rem}
.ppe-section-title{font-size:.9rem;font-weight:700;color:var(--text-main);margin-bottom:.75rem;display:flex;align-items:center;gap:.5rem}
.ppe-section-title i{color:#14b8a6}
.ppe-items-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.65rem}
.ppe-item-card{display:flex;align-items:center;gap:.75rem;padding:.85rem 1rem;border-radius:14px;background:var(--card-bg);border:1px solid var(--card-border);transition:all .2s}
.ppe-item-card.mandatory{border-left:4px solid #14b8a6;background:linear-gradient(90deg,rgba(20,184,166,0.06),transparent)}
.ppe-item-card.task-ppe{border-left:4px solid #f59e0b;background:linear-gradient(90deg,rgba(245,158,11,0.06),transparent)}
.ppe-item-icon{width:42px;height:42px;border-radius:12px;background:linear-gradient(135deg,#14b8a6,#0d9488);display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.1rem;flex-shrink:0;overflow:hidden}
.ppe-item-card.task-ppe .ppe-item-icon{background:linear-gradient(135deg,#f59e0b,#d97706)}
.ppe-item-info{display:flex;flex-direction:column;gap:.15rem}
.ppe-item-name{font-size:.85rem;font-weight:600;color:var(--text-main)}
.ppe-item-desc{font-size:.72rem;color:var(--text-soft)}
.ppe-aramco-note{display:flex;align-items:flex-start;gap:.6rem;padding:.85rem 1rem;border-radius:12px;background:linear-gradient(135deg,rgba(59,130,246,0.08),rgba(99,102,241,0.08));border:1px solid rgba(59,130,246,0.2);margin-top:1rem}
.ppe-aramco-note i{color:#3b82f6;font-size:1rem;margin-top:.1rem}
.ppe-aramco-note span{font-size:.8rem;color:var(--text-soft);line-height:1.5}
body.dark-mode .ppe-task-card{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2)}
body.dark-mode .ppe-task-card.selected{background:linear-gradient(135deg,rgba(20,184,166,0.15),rgba(13,148,136,0.15))}
body.dark-mode .ppe-task-card span{color:#e5e7eb}
body.dark-mode .ppe-item-card{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2)}
body.dark-mode .ppe-item-name{color:#e5e7eb}
body.dark-mode .ppe-section-title{color:#e5e7eb}

.ppe-body-zone-section{margin-bottom:1.25rem;padding:1rem;border-radius:16px;background:linear-gradient(135deg,rgba(59,130,246,0.06),rgba(14,165,233,0.06));border:1px solid rgba(59,130,246,0.2)}
.ppe-body-zone-title{font-size:.9rem;font-weight:700;color:var(--text-main);margin-bottom:.85rem;display:flex;align-items:center;gap:.5rem}
.ppe-body-zone-title i{color:#3b82f6}
.ppe-body-diagram{display:flex;flex-direction:column;gap:.65rem}
.ppe-zone-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.65rem}
.ppe-zone-item{display:flex;align-items:center;gap:.65rem;padding:.7rem .85rem;border-radius:12px;background:var(--card-bg);border:1px solid var(--card-border);transition:all .2s}
.ppe-zone-item:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(15,23,42,0.1)}
.ppe-zone-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:#fff;flex-shrink:0;overflow:hidden}
.zone-head .ppe-zone-icon{background:linear-gradient(135deg,#f59e0b,#d97706)}
.zone-eyes .ppe-zone-icon{background:linear-gradient(135deg,#3b82f6,#2563eb)}
.zone-ears .ppe-zone-icon{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}
.zone-respiratory .ppe-zone-icon{background:linear-gradient(135deg,#06b6d4,#0891b2)}
.zone-body .ppe-zone-icon{background:linear-gradient(135deg,#22c55e,#16a34a)}
.zone-fall .ppe-zone-icon{background:linear-gradient(135deg,#ef4444,#dc2626)}
.zone-hands .ppe-zone-icon{background:linear-gradient(135deg,#f97316,#ea580c)}
.zone-feet .ppe-zone-icon{background:linear-gradient(135deg,#6366f1,#4f46e5)}
.ppe-zone-info{display:flex;flex-direction:column;gap:.1rem;min-width:0}
.ppe-zone-name{font-size:.8rem;font-weight:700;color:var(--text-main)}
.ppe-zone-items{font-size:.68rem;color:var(--text-soft);line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ppe-task-selector-title{font-size:.9rem;font-weight:700;color:var(--text-main);margin-bottom:.75rem;display:flex;align-items:center;gap:.5rem}
.ppe-task-selector-title i{color:#14b8a6}
.ppe-task-icon.general{background:linear-gradient(135deg,#14b8a6,#0d9488)}
.ppe-task-icon.chemical{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}
.ppe-task-icon.noise{background:linear-gradient(135deg,#f59e0b,#d97706)}
.ppe-task-icon.heights{background:linear-gradient(135deg,#ef4444,#dc2626)}
.ppe-task-icon.confined{background:linear-gradient(135deg,#06b6d4,#0891b2)}
.ppe-task-icon.welding{background:linear-gradient(135deg,#f97316,#ea580c)}
.ppe-task-icon.blasting{background:linear-gradient(135deg,#ec4899,#db2777)}
.ppe-task-icon.excavation{background:linear-gradient(135deg,#84cc16,#65a30d)}
body.dark-mode .ppe-body-zone-section{background:linear-gradient(135deg,rgba(59,130,246,0.1),rgba(14,165,233,0.1))}
body.dark-mode .ppe-body-zone-title{color:#e5e7eb}
body.dark-mode .ppe-zone-item{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2)}
body.dark-mode .ppe-zone-name{color:#e5e7eb}
body.dark-mode .ppe-task-selector-title{color:#e5e7eb}

.noise-meter-container{background:var(--card-bg);border-radius:20px;padding:1.5rem;border:1px solid var(--card-border);box-shadow:0 10px 30px rgba(15,23,42,0.08);transition:all .3s ease}
.noise-meter-container.active{border-color:rgba(34,197,94,0.4)}
.noise-meter-container.active.moderate{border-color:rgba(245,158,11,0.4)}
.noise-meter-container.active.danger{border-color:rgba(239,68,68,0.4);box-shadow:0 10px 30px rgba(239,68,68,0.15)}
.noise-meter-container.active.extreme{border-color:rgba(220,38,38,0.6);box-shadow:0 10px 30px rgba(220,38,38,0.25);animation:pulseRed 1s ease-in-out infinite}
@keyframes pulseRed{0%,100%{box-shadow:0 10px 30px rgba(220,38,38,0.25)}50%{box-shadow:0 10px 40px rgba(220,38,38,0.4)}}
.noise-meter-display{text-align:center;margin-bottom:1.25rem}
.noise-db-display{margin-bottom:1rem}
.noise-db-value{font-size:4rem;font-weight:800;background:linear-gradient(135deg,#22c55e,#14b8a6);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1}
.noise-meter-container.active.moderate .noise-db-value{background:linear-gradient(135deg,#f59e0b,#d97706);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.noise-meter-container.active.danger .noise-db-value,.noise-meter-container.active.extreme .noise-db-value{background:linear-gradient(135deg,#ef4444,#dc2626);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.noise-db-unit{font-size:1.5rem;font-weight:600;color:var(--text-soft);margin-left:.25rem}
.noise-meter-bar-container{max-width:100%;margin:0 auto}
.noise-meter-bar-bg{height:16px;border-radius:999px;background:linear-gradient(90deg,#22c55e 0%,#22c55e 40%,#f59e0b 55%,#ef4444 70%,#dc2626 100%);position:relative;overflow:hidden;box-shadow:inset 0 2px 6px rgba(0,0,0,0.15)}
.noise-db-bar{height:100%;border-radius:999px;background:rgba(255,255,255,0.95);position:absolute;right:0;top:0;transition:width .1s ease-out;box-shadow:-4px 0 12px rgba(0,0,0,0.2)}
.noise-db-bar.safe{background:rgba(255,255,255,0.9)}
.noise-db-bar.moderate{background:rgba(255,255,255,0.9)}
.noise-db-bar.danger{background:rgba(255,255,255,0.9)}
.noise-db-bar.extreme{background:rgba(255,255,255,0.9)}
.noise-meter-scale{display:flex;justify-content:space-between;margin-top:.35rem;font-size:.7rem;color:var(--text-soft);padding:0 .25rem}
.noise-meter-scale .scale-warning{color:#ef4444;font-weight:700}
.noise-status-container{text-align:center;margin-bottom:1.25rem}
.noise-status-text{font-size:1.3rem;font-weight:700;color:var(--text-soft);margin-bottom:.35rem}
.noise-status-text.safe{color:#22c55e}
.noise-status-text.moderate{color:#f59e0b}
.noise-status-text.danger{color:#ef4444}
.noise-status-text.extreme{color:#dc2626;animation:blink .5s ease-in-out infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.5}}
.noise-status-desc{font-size:.85rem;color:var(--text-soft);line-height:1.5;max-width:400px;margin:0 auto}
.noise-controls{display:flex;justify-content:center;gap:.75rem}
.noise-control-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 1.75rem;border-radius:14px;border:none;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .25s ease}
.noise-control-btn.start{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;box-shadow:0 6px 20px rgba(34,197,94,0.3)}
.noise-control-btn.start:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(34,197,94,0.4)}
.noise-control-btn.stop{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;box-shadow:0 6px 20px rgba(239,68,68,0.3)}
.noise-control-btn.stop:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(239,68,68,0.4)}
.noise-reference-card{margin-top:1.25rem;padding:1rem;border-radius:16px;background:linear-gradient(135deg,rgba(59,130,246,0.06),rgba(14,165,233,0.06));border:1px solid rgba(59,130,246,0.2)}
.noise-reference-card h4{font-size:.9rem;font-weight:700;color:var(--text-main);margin-bottom:.75rem;display:flex;align-items:center;gap:.5rem}
.noise-reference-card h4 i{color:#3b82f6}
.noise-reference-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.65rem}
.noise-ref-item{padding:.65rem;border-radius:10px;text-align:center;background:var(--card-bg);border:1px solid var(--card-border)}
.noise-ref-item.safe{border-color:rgba(34,197,94,0.3);background:linear-gradient(135deg,rgba(34,197,94,0.08),rgba(34,197,94,0.02))}
.noise-ref-item.danger{border-color:rgba(239,68,68,0.3);background:linear-gradient(135deg,rgba(239,68,68,0.08),rgba(239,68,68,0.02))}
.noise-ref-item.extreme{border-color:rgba(220,38,38,0.4);background:linear-gradient(135deg,rgba(220,38,38,0.1),rgba(220,38,38,0.03))}
.noise-ref-level{display:block;font-size:1rem;font-weight:700;margin-bottom:.2rem}
.noise-ref-item.safe .noise-ref-level{color:#22c55e}
.noise-ref-item.danger .noise-ref-level{color:#ef4444}
.noise-ref-item.extreme .noise-ref-level{color:#dc2626}
.noise-ref-desc{font-size:.7rem;color:var(--text-soft);line-height:1.4}
.noise-note{font-size:.75rem;color:var(--text-soft);margin-top:.75rem;text-align:center;font-style:italic}
body.dark-mode .noise-meter-container{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2)}
body.dark-mode .noise-reference-card{background:linear-gradient(135deg,rgba(59,130,246,0.1),rgba(14,165,233,0.1))}
body.dark-mode .noise-reference-card h4{color:#e5e7eb}
body.dark-mode .noise-ref-item{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2)}

.tools-full-view{padding:0}
.tools-full-view .back-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1rem;border-radius:12px;border:none;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;font-size:.85rem;font-weight:600;cursor:pointer;margin-bottom:1rem;transition:all .2s}
.tools-full-view .back-btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(59,130,246,0.3)}
.pro-tool-container{padding:.5rem 0}
.pro-tool-desc{color:var(--text-soft);margin-bottom:1.25rem;font-size:.9rem;line-height:1.5}
.pro-tool-note{margin-top:1.5rem;padding:1rem;border-radius:12px;background:linear-gradient(135deg,rgba(59,130,246,0.08),rgba(14,165,233,0.08));border:1px solid rgba(59,130,246,0.2);display:flex;align-items:flex-start;gap:.75rem;font-size:.8rem;color:var(--text-soft)}
.pro-tool-note i{color:#3b82f6;margin-top:.15rem}
.pro-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;border-radius:12px;border:none;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;font-size:.9rem;font-weight:600;cursor:pointer;margin-top:1rem}
.pro-btn.secondary{background:linear-gradient(135deg,#6b7280,#4b5563)}
.fire-ext-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem}
.fire-ext-card{border-radius:14px;overflow:hidden;border:1px solid var(--card-border);background:var(--card-bg)}
.fire-ext-header{padding:.75rem 1rem;display:flex;align-items:center;gap:.75rem}
.fire-class-badge{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.1rem;color:#fff}
.class-a .fire-class-badge{background:#22c55e}
.class-b .fire-class-badge{background:#ef4444}
.class-c .fire-class-badge{background:#3b82f6}
.class-d .fire-class-badge{background:#f59e0b}
.class-k .fire-class-badge{background:#8b5cf6}
.class-a .fire-ext-header{background:linear-gradient(135deg,rgba(34,197,94,0.15),rgba(34,197,94,0.05))}
.class-b .fire-ext-header{background:linear-gradient(135deg,rgba(239,68,68,0.15),rgba(239,68,68,0.05))}
.class-c .fire-ext-header{background:linear-gradient(135deg,rgba(59,130,246,0.15),rgba(59,130,246,0.05))}
.class-d .fire-ext-header{background:linear-gradient(135deg,rgba(245,158,11,0.15),rgba(245,158,11,0.05))}
.class-k .fire-ext-header{background:linear-gradient(135deg,rgba(139,92,246,0.15),rgba(139,92,246,0.05))}
.fire-ext-header h4{font-size:.85rem;font-weight:600}
.fire-ext-body{padding:1rem}
.fire-ext-body p{font-size:.8rem;color:var(--text-soft);margin-bottom:.75rem}
.ext-type{font-size:.8rem;font-weight:600;margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem}
.ext-color{font-size:.75rem;padding:.3rem .6rem;border-radius:6px;margin-bottom:.3rem;display:inline-block}
.ext-color.water{background:#fee2e2;color:#b91c1c}
.ext-color.foam{background:#fef3c7;color:#b45309}
.ext-color.co2{background:#1f2937;color:#fff}
.ext-color.powder{background:#dbeafe;color:#1d4ed8}
.ext-color.wet-chem{background:#fef9c3;color:#a16207}
.ext-warning{font-size:.75rem;padding:.5rem;border-radius:8px;background:#fef2f2;color:#dc2626;margin-top:.5rem;display:flex;align-items:center;gap:.4rem}

.pass-technique-section{margin-bottom:1.5rem;padding:1.25rem;border-radius:16px;background:linear-gradient(135deg,rgba(239,68,68,0.08),rgba(245,158,11,0.08));border:2px solid rgba(239,68,68,0.2)}
.pass-technique-section h4{font-size:1rem;font-weight:700;color:#dc2626;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}
.pass-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem}
@media(max-width:600px){.pass-steps{grid-template-columns:repeat(2,1fr)}}
.pass-step{display:flex;flex-direction:column;align-items:center;padding:1rem .5rem;border-radius:12px;background:var(--card-bg);border:1px solid var(--card-border);text-align:center}
.pass-icon{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#ef4444,#f97316);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.25rem;margin-bottom:.5rem;overflow:hidden}
.pass-letter{font-size:1.5rem;font-weight:800;color:#ef4444;margin-bottom:.25rem}
.pass-text strong{display:block;font-size:.75rem;color:var(--text-main)}
.pass-text span{font-size:.65rem;color:var(--text-soft)}

.fire-class-symbol{width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.2rem;color:#fff;flex-shrink:0}
.fire-class-symbol.triangle{background:#22c55e;clip-path:polygon(50% 0%,0% 100%,100% 100%)}
.fire-class-symbol.square{background:#ef4444;border-radius:4px}
.fire-class-symbol.circle{background:#3b82f6;border-radius:50%}
.fire-class-symbol.star{background:#f59e0b;clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
.fire-class-symbol.hexagon{background:#8b5cf6;clip-path:polygon(25% 0%,75% 0%,100% 50%,75% 100%,25% 100%,0% 50%)}

.fire-materials{display:flex;gap:.5rem;margin-bottom:.75rem;flex-wrap:wrap}
.material-icon{width:36px;height:36px;border-radius:8px;background:rgba(0,0,0,0.05);display:flex;align-items:center;justify-content:center;color:var(--text-soft);font-size:.9rem}
body.dark-mode .material-icon{background:rgba(255,255,255,0.08)}

.ext-types-row{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.5rem}
.ext-canister{display:flex;flex-direction:column;align-items:center;padding:.5rem;border-radius:8px;min-width:60px;text-align:center}
.ext-canister i{font-size:1.5rem;margin-bottom:.25rem}
.ext-canister span{font-size:.6rem;font-weight:600}
.ext-canister.water{background:#fee2e2;color:#dc2626}
.ext-canister.foam{background:#fef3c7;color:#b45309}
.ext-canister.abc{background:linear-gradient(180deg,#dbeafe 50%,#fee2e2 50%);color:#1e40af}
.ext-canister.co2{background:#1f2937;color:#fff}
.ext-canister.powder{background:#dbeafe;color:#1d4ed8}
.ext-canister.special{background:#fef9c3;color:#a16207}
.ext-canister.wetchem{background:#fef08a;color:#a16207}

.extinguisher-color-guide{margin-top:1.5rem;padding:1rem;border-radius:12px;background:var(--surface-soft);border:1px solid var(--card-border)}
.extinguisher-color-guide h4{font-size:.85rem;font-weight:600;margin-bottom:.75rem;display:flex;align-items:center;gap:.5rem;color:var(--text-main)}
.color-guide-row{display:flex;flex-wrap:wrap;gap:.5rem}
.color-label{display:flex;align-items:center;gap:.4rem;font-size:.75rem;font-weight:500;padding:.4rem .65rem;border-radius:6px;background:var(--card-bg);border:1px solid var(--card-border)}
.color-band{width:12px;height:12px;border-radius:3px}
.water-label .color-band{background:#dc2626}
.foam-label .color-band{background:#fef3c7;border:1px solid #d97706}
.powder-label .color-band{background:#2563eb}
.co2-label .color-band{background:#1f2937}
.wetchem-label .color-band{background:#fde047}

.barricade-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}
.barricade-card{border-radius:14px;overflow:hidden;border:2px solid}
.barricade-card.danger{border-color:#dc2626}
.barricade-card.warning{border-color:#f97316}
.barricade-card.caution{border-color:#eab308}
.barricade-card.info{border-color:#3b82f6}
.barricade-header{padding:.75rem 1rem;display:flex;align-items:center;gap:.75rem;color:#fff}
.barricade-card.danger .barricade-header{background:#dc2626}
.barricade-card.warning .barricade-header{background:#f97316}
.barricade-card.caution .barricade-header{background:#eab308;color:#1f2937}
.barricade-card.info .barricade-header{background:#3b82f6}
.barricade-header h4{font-size:.9rem}
.barricade-body{padding:1rem;background:var(--card-bg)}
.barricade-body p{font-size:.8rem;margin-bottom:.5rem}
.barricade-body ul{font-size:.75rem;color:var(--text-soft);padding-left:1.2rem;margin-bottom:.75rem}
.barricade-body li{margin-bottom:.25rem}
.barricade-tape{text-align:center;padding:.5rem;border-radius:6px;font-size:.7rem;font-weight:700;letter-spacing:.05em}
.danger-tape{background:#fecaca;color:#dc2626}
.warning-tape{background:#fed7aa;color:#c2410c}
.caution-tape{background:#fef08a;color:#a16207}
.info-tape{background:#dbeafe;color:#1d4ed8}
.ghs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.75rem}
.ghs-card{text-align:center;padding:1rem;border-radius:12px;border:1px solid var(--card-border);background:var(--card-bg)}
.ghs-pictogram{width:60px;height:60px;margin:0 auto .5rem;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;transform:rotate(45deg);border:3px solid}
.ghs-pictogram i{transform:rotate(-45deg)}
.ghs-pictogram.explosive{background:#fee2e2;border-color:#dc2626;color:#dc2626}
.ghs-pictogram.flammable{background:#fee2e2;border-color:#dc2626;color:#dc2626}
.ghs-pictogram.oxidizer{background:#fef9c3;border-color:#ca8a04;color:#ca8a04}
.ghs-pictogram.compressed{background:#f3f4f6;border-color:#1f2937;color:#1f2937}
.ghs-pictogram.corrosive{background:#f3f4f6;border-color:#1f2937;color:#1f2937}
.ghs-pictogram.toxic{background:#fee2e2;border-color:#dc2626;color:#dc2626}
.ghs-pictogram.irritant{background:#fef9c3;border-color:#ca8a04;color:#ca8a04}
.ghs-pictogram.health{background:#fee2e2;border-color:#dc2626;color:#dc2626}
.ghs-pictogram.environment{background:#dcfce7;border-color:#16a34a;color:#16a34a}
.ghs-card h4{font-size:.8rem;font-weight:600;margin-bottom:.25rem}
.ghs-card p{font-size:.7rem;color:var(--text-soft)}
.ghs-signal-words{display:flex;gap:1rem;margin-top:1rem;justify-content:center}
.signal-danger{padding:.5rem 1rem;border-radius:8px;background:#dc2626;color:#fff;font-size:.8rem}
.signal-warning{padding:.5rem 1rem;border-radius:8px;background:#f97316;color:#fff;font-size:.8rem}
.gas-table-container{overflow-x:auto;margin-bottom:1rem}
.gas-table{width:100%;border-collapse:collapse;font-size:.75rem}
.gas-table th,.gas-table td{padding:.6rem .5rem;text-align:left;border:1px solid var(--card-border)}
.gas-table th{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;font-weight:600}
.gas-table tr:nth-child(even){background:rgba(59,130,246,0.05)}
.alarm-cell{background:#fef3c7;color:#b45309;font-weight:600}
.gas-legend{display:flex;flex-wrap:wrap;gap:.75rem;font-size:.75rem;color:var(--text-soft)}
.legend-item{padding:.4rem .7rem;background:var(--surface-soft);border-radius:6px}
.five-whys-container{max-width:600px}
.incident-input-section{margin-bottom:1.25rem}
.incident-input-section label{display:block;font-weight:600;margin-bottom:.5rem;font-size:.85rem}
.incident-input-section textarea{width:100%;border-radius:10px;border:1px solid var(--card-border);padding:.75rem;font-size:.85rem;resize:vertical}
.whys-section{display:flex;flex-direction:column;gap:.75rem}
.why-item label{display:flex;align-items:center;gap:.5rem;font-size:.85rem;margin-bottom:.35rem}
.why-number{width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.75rem}
.why-item input{width:100%;border-radius:10px;border:1px solid var(--card-border);padding:.65rem .75rem;font-size:.85rem}
.root-cause-section{margin-top:1.25rem;padding:1rem;border-radius:12px;background:linear-gradient(135deg,rgba(34,197,94,0.1),rgba(34,197,94,0.05));border:1px solid rgba(34,197,94,0.3)}
.root-cause-section h4{font-size:.9rem;font-weight:600;margin-bottom:.5rem;color:#16a34a;display:flex;align-items:center;gap:.5rem}
.root-cause-display{font-weight:600;font-size:1rem;color:#15803d;padding:.5rem;background:rgba(255,255,255,0.5);border-radius:8px;margin-bottom:.75rem}
.corrective-action label{display:block;font-size:.85rem;font-weight:600;margin-bottom:.35rem}
.corrective-action textarea{width:100%;border-radius:10px;border:1px solid var(--card-border);padding:.65rem;font-size:.85rem}
.emergency-flowchart{max-width:600px}
.emergency-step{display:flex;align-items:flex-start;gap:1rem;padding:1rem;border-radius:12px;margin-bottom:.25rem}
.step-number{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1rem;color:#fff;flex-shrink:0}
.step-alert{background:linear-gradient(135deg,rgba(239,68,68,0.1),rgba(239,68,68,0.05));border:1px solid rgba(239,68,68,0.3)}
.step-alert .step-number{background:#ef4444}
.step-assess{background:linear-gradient(135deg,rgba(245,158,11,0.1),rgba(245,158,11,0.05));border:1px solid rgba(245,158,11,0.3)}
.step-assess .step-number{background:#f59e0b}
.step-call{background:linear-gradient(135deg,rgba(34,197,94,0.1),rgba(34,197,94,0.05));border:1px solid rgba(34,197,94,0.3)}
.step-call .step-number{background:#22c55e}
.step-content h4{font-size:.9rem;font-weight:600;display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem}
.step-content p{font-size:.8rem;color:var(--text-soft)}
.flow-arrow{text-align:center;color:var(--text-soft);font-size:1.25rem;margin:.25rem 0}
.emergency-contacts{margin-top:.5rem;font-size:.8rem}
.contact-item{padding:.25rem 0}
.emergency-types-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.75rem;margin-top:1rem}
.emergency-type-card{padding:1rem;border-radius:12px;border:1px solid var(--card-border)}
.emergency-type-card h5{font-size:.85rem;font-weight:600;margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem}
.emergency-type-card ol{font-size:.75rem;color:var(--text-soft);padding-left:1.2rem}
.emergency-type-card li{margin-bottom:.2rem}
.emergency-type-card.fire{border-color:#ef4444;background:rgba(239,68,68,0.05)}
.emergency-type-card.fire h5{color:#dc2626}
.emergency-type-card.injury{border-color:#f59e0b;background:rgba(245,158,11,0.05)}
.emergency-type-card.injury h5{color:#d97706}
.emergency-type-card.spill{border-color:#8b5cf6;background:rgba(139,92,246,0.05)}
.emergency-type-card.spill h5{color:#7c3aed}
.emergency-type-card.gas{border-color:#6b7280;background:rgba(107,114,128,0.05)}
.emergency-type-card.gas h5{color:#4b5563}
.first-aid-checklist{max-width:600px}
.checklist-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}
.checklist-header h4{font-size:.95rem;font-weight:600;display:flex;align-items:center;gap:.5rem}
.checklist-progress{font-size:.85rem;font-weight:600;color:#3b82f6}
.checklist-items{margin-bottom:1rem}
.checklist-category{margin-bottom:1rem}
.checklist-category h5{font-size:.85rem;font-weight:600;margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem;color:var(--text-main)}
.checklist-item{display:flex;align-items:center;gap:.5rem;padding:.4rem .5rem;border-radius:8px;font-size:.8rem;cursor:pointer;transition:background .15s}
.checklist-item:hover{background:rgba(59,130,246,0.05)}
.checklist-item input{width:18px;height:18px;accent-color:#22c55e}
.checklist-status{padding:.75rem;border-radius:10px;text-align:center;font-size:.85rem;background:var(--surface-soft);display:flex;align-items:center;justify-content:center;gap:.5rem}
.meeting-timer-container{text-align:center;margin-bottom:1.5rem}
.timer-display{margin-bottom:1.25rem}
.timer-circle{width:180px;height:180px;border-radius:50%;border:8px solid #22c55e;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0 auto;transition:border-color .3s}
.timer-time{font-size:3rem;font-weight:800;color:var(--text-main)}
.timer-label{font-size:.85rem;color:var(--text-soft)}
.timer-controls{display:flex;justify-content:center;gap:.75rem;margin-bottom:1rem}
.timer-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;border-radius:12px;border:none;font-size:.9rem;font-weight:600;cursor:pointer}
.timer-btn.start{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff}
.timer-btn.pause{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}
.timer-btn.reset{background:linear-gradient(135deg,#6b7280,#4b5563);color:#fff}
.timer-presets{display:flex;justify-content:center;gap:.5rem}
.preset-btn{padding:.5rem 1rem;border-radius:8px;border:1px solid var(--card-border);background:var(--card-bg);font-size:.8rem;cursor:pointer;transition:all .15s}
.preset-btn.active,.preset-btn:hover{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-color:transparent}
.tbt-topic-section{margin-bottom:1.5rem}
.tbt-topic-section h4{font-size:.95rem;font-weight:600;margin-bottom:.75rem;display:flex;align-items:center;gap:.5rem}
.tbt-topic-card{padding:1rem;border-radius:12px;background:linear-gradient(135deg,rgba(34,197,94,0.1),rgba(34,197,94,0.05));border:1px solid rgba(34,197,94,0.3);margin-bottom:.75rem}
.topic-title{font-size:1rem;font-weight:700;color:#16a34a;margin-bottom:.5rem}
.topic-points ul{padding-left:1.2rem;font-size:.85rem;color:var(--text-soft)}
.topic-points li{margin-bottom:.25rem}
.meeting-checklist{padding:1rem;border-radius:12px;background:var(--surface-soft)}
.meeting-checklist h4{font-size:.9rem;font-weight:600;margin-bottom:.75rem}
.meeting-check{display:flex;align-items:center;gap:.5rem;padding:.35rem 0;font-size:.85rem}
.meeting-check input{width:18px;height:18px;accent-color:#22c55e}
body.dark-mode .fire-ext-card,body.dark-mode .barricade-body,body.dark-mode .ghs-card,body.dark-mode .emergency-type-card{background:rgba(15,23,42,0.96)}
body.dark-mode .gas-table th{background:linear-gradient(135deg,#1d4ed8,#1e40af)}
body.dark-mode .gas-table tr:nth-child(even){background:rgba(59,130,246,0.1)}
body.dark-mode .timer-time{color:#e5e7eb}
body.dark-mode .meeting-checklist{background:rgba(15,23,42,0.6)}

.notification-bell-wrapper{position:relative}
.notification-bell{width:38px;height:38px;border-radius:999px;border:2px solid rgba(255,255,255,0.5);background:rgba(15,23,42,0.25);display:flex;align-items:center;justify-content:center;color:#fbbf24;cursor:pointer;transition:transform .2s}
.notification-bell:hover{transform:translateY(-1px)}
.notification-badge{position:absolute;top:-2px;right:-2px;min-width:18px;height:18px;border-radius:999px;background:#ef4444;color:#fff;font-size:.65rem;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 4px}
.notifications-dropdown{position:absolute;top:48px;right:0;width:300px;max-height:400px;background:#fff;border-radius:16px;box-shadow:0 10px 40px rgba(0,0,0,0.25);z-index:100;overflow:hidden}
.notifications-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:linear-gradient(90deg,var(--primary-start),var(--primary-end));color:#fff}
.notifications-header h4{font-size:.9rem;margin:0}
.notifications-header button{background:none;border:none;color:#fff;font-size:.75rem;cursor:pointer;text-decoration:underline}
.notifications-list{max-height:340px;overflow-y:auto}
.notification-item{display:flex;gap:.75rem;padding:.75rem 1rem;border-bottom:1px solid var(--card-border);cursor:pointer;transition:background .2s}
.notification-item:hover{background:var(--surface-soft)}
.notification-item.unread{background:rgba(59,130,246,0.05);border-left:3px solid #3b82f6}
.notification-item.read{opacity:.7}
.notification-item.urgent{border-left:3px solid #dc2626}
.notification-item.urgent.unread{background:rgba(220,38,38,0.05)}
.notification-item.high{border-left:3px solid #f59e0b}
.notification-item.high.unread{background:rgba(245,158,11,0.05)}
.notification-item i{font-size:1rem;margin-top:.15rem;color:var(--text-soft)}
.notification-item.urgent i{color:#dc2626}
.notification-item.high i{color:#f59e0b}
.notification-content{flex:1;min-width:0}
.notification-content strong{display:block;font-size:.85rem;font-weight:600;color:var(--text-main);margin-bottom:.15rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.notification-content p{font-size:.8rem;color:var(--text-soft);margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.notification-content small{font-size:.7rem;color:var(--text-muted);margin-top:.25rem;display:block}
.notification-item .notification-message{font-size:.85rem;color:var(--text-main);margin-bottom:.25rem}
.notification-item .notification-time{font-size:.7rem;color:var(--text-soft)}
.no-notifications{text-align:center;padding:2rem;color:var(--text-soft);font-size:.9rem}
body.dark-mode .notifications-dropdown{background:#1e293b}
body.dark-mode .notification-item{border-color:rgba(148,163,184,0.2)}
body.dark-mode .notification-item:hover{background:rgba(59,130,246,0.1)}

.calendar-container{background:var(--card-bg);border-radius:20px;padding:1.25rem;border:1px solid var(--card-border);margin-bottom:1rem;box-shadow:0 8px 30px rgba(0,0,0,0.08);position:relative;overflow:hidden}
.calendar-container::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#3b82f6,#8b5cf6,#ec4899,#f59e0b,#22c55e);opacity:.8}
.calendar-view-switcher{display:flex;gap:.5rem;margin-bottom:1rem}
.calendar-view-btn{flex:1;padding:.6rem;border:none;background:rgba(148,163,184,0.15);border-radius:12px;font-size:.8rem;font-weight:600;cursor:pointer;transition:all .25s;display:flex;align-items:center;justify-content:center;gap:.4rem}
.calendar-view-btn i{font-size:.75rem;opacity:.7}
.calendar-view-btn.active{background:linear-gradient(135deg,var(--primary-start),var(--primary-end));color:#fff;box-shadow:0 4px 15px rgba(0,123,143,0.3)}
.calendar-view-btn:hover:not(.active){background:rgba(59,130,246,0.1);transform:translateY(-1px)}
.calendar-filters{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap}
.calendar-filters select,.calendar-filters input{flex:1;min-width:100px;padding:.5rem;border-radius:10px;border:1px solid var(--card-border);font-size:.8rem}
.calendar-header{display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:1rem;padding:.5rem 0}
.calendar-header h4{font-size:1.1rem;font-weight:700;min-width:180px;text-align:center;background:linear-gradient(135deg,#1e3a5f,#3b82f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.calendar-nav-btn{width:40px;height:40px;border-radius:12px;border:none;background:linear-gradient(135deg,rgba(59,130,246,0.1),rgba(139,92,246,0.1));cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .25s;color:var(--text-main)}
.calendar-nav-btn:hover{background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff;transform:scale(1.05);box-shadow:0 4px 15px rgba(59,130,246,0.3)}
.calendar-today-btn{padding:.5rem 1rem;border-radius:10px;border:none;background:linear-gradient(135deg,#f59e0b,#f97316);color:#fff;font-size:.8rem;font-weight:600;cursor:pointer;box-shadow:0 4px 12px rgba(245,158,11,0.3);transition:all .25s}
.calendar-today-btn:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(245,158,11,0.4)}
.calendar-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;margin-bottom:6px;background:linear-gradient(135deg,rgba(59,130,246,0.05),rgba(139,92,246,0.05));border-radius:10px;padding:.25rem}
.calendar-weekdays div{text-align:center;font-size:.7rem;font-weight:700;color:#64748b;padding:.5rem 0;text-transform:uppercase;letter-spacing:.5px}
.calendar-weekdays div:nth-child(6),.calendar-weekdays div:nth-child(7){color:#f59e0b}
.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.calendar-day{min-height:75px;padding:.35rem;border-radius:10px;background:linear-gradient(135deg,rgba(248,250,252,0.8),rgba(241,245,249,0.6));cursor:pointer;transition:all .25s;position:relative;border:1px solid transparent}
.calendar-day:hover{background:linear-gradient(135deg,rgba(59,130,246,0.08),rgba(139,92,246,0.08));border-color:rgba(59,130,246,0.2);transform:scale(1.02)}
.calendar-day.other-month{opacity:.35;background:rgba(148,163,184,0.1)}
.calendar-day.today{border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,#3b82f6,#8b5cf6) border-box;box-shadow:0 4px 15px rgba(59,130,246,0.2)}
.calendar-day.today .day-number{background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:.7rem}
.calendar-day .day-number{font-size:.75rem;font-weight:700;margin-bottom:.3rem;color:#334155}
.calendar-day .day-events{display:flex;flex-direction:column;gap:3px}
.calendar-event-dot{height:7px;border-radius:4px;margin-bottom:1px;box-shadow:0 2px 4px rgba(0,0,0,0.1)}
.calendar-event-item{font-size:.6rem;padding:3px 5px;border-radius:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff;cursor:pointer;font-weight:500;box-shadow:0 2px 6px rgba(0,0,0,0.15)}
.event-type-meeting,.calendar-event-dot.meeting{background:linear-gradient(135deg,#3b82f6,#2563eb)}
.event-type-walkthrough,.calendar-event-dot.walkthrough{background:linear-gradient(135deg,#22c55e,#16a34a)}
.event-type-drill,.calendar-event-dot.drill{background:linear-gradient(135deg,#f59e0b,#d97706)}
.event-type-campaign,.calendar-event-dot.campaign{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}
.event-type-holiday,.calendar-event-dot.holiday{background:linear-gradient(135deg,#ef4444,#dc2626)}
.event-type-safety-meeting,.calendar-event-dot.safety-meeting{background:linear-gradient(135deg,#06b6d4,#0891b2)}
.event-type-training,.calendar-event-dot.training{background:linear-gradient(135deg,#ec4899,#db2777)}
.event-type-inspection,.calendar-event-dot.inspection{background:linear-gradient(135deg,#14b8a6,#0d9488)}
.event-type-audit,.calendar-event-dot.audit{background:linear-gradient(135deg,#6366f1,#4f46e5)}
.event-type-toolbox-talk,.calendar-event-dot.toolbox-talk{background:linear-gradient(135deg,#78716c,#57534e)}
.event-type-badge{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .75rem;border-radius:999px;font-size:.75rem;font-weight:600;color:#fff;box-shadow:0 2px 8px rgba(0,0,0,0.15)}
.event-type-badge::before{font-family:'Font Awesome 6 Free';font-weight:900;font-size:.7rem}
.event-type-badge.meeting{background:linear-gradient(135deg,#3b82f6,#2563eb)}
.event-type-badge.meeting::before{content:'\f500'}
.event-type-badge.walkthrough{background:linear-gradient(135deg,#22c55e,#16a34a)}
.event-type-badge.walkthrough::before{content:'\f554'}
.event-type-badge.drill{background:linear-gradient(135deg,#f59e0b,#d97706)}
.event-type-badge.drill::before{content:'\f0f3'}
.event-type-badge.campaign{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}
.event-type-badge.campaign::before{content:'\f0a1'}
.event-type-badge.holiday{background:linear-gradient(135deg,#ef4444,#dc2626)}
.event-type-badge.holiday::before{content:'\f5a0'}
.event-type-badge.safety-meeting{background:linear-gradient(135deg,#06b6d4,#0891b2)}
.event-type-badge.safety-meeting::before{content:'\f21d'}
.event-type-badge.training{background:linear-gradient(135deg,#ec4899,#db2777)}
.event-type-badge.training::before{content:'\f19d'}
.event-type-badge.inspection{background:linear-gradient(135deg,#14b8a6,#0d9488)}
.event-type-badge.inspection::before{content:'\f002'}
.event-type-badge.audit{background:linear-gradient(135deg,#6366f1,#4f46e5)}
.event-type-badge.audit::before{content:'\f46d'}
.event-type-badge.toolbox-talk{background:linear-gradient(135deg,#78716c,#57534e)}
.event-type-badge.toolbox-talk::before{content:'\f7d9'}
.status-pill.status-pending{background:linear-gradient(135deg,#fef3c7,#fde68a);color:#b45309;border:1px solid rgba(245,158,11,0.3)}
.status-pill.status-approved{background:linear-gradient(135deg,#dcfce7,#bbf7d0);color:#15803d;border:1px solid rgba(34,197,94,0.3)}
.status-pill.status-completed{background:linear-gradient(135deg,#dcfce7,#bbf7d0);color:#15803d;border:1px solid rgba(34,197,94,0.3)}
.status-pill.status-overdue{background:linear-gradient(135deg,#fee2e2,#fecaca);color:#dc2626;border:1px solid rgba(239,68,68,0.3);animation:pulseOverdue 2s infinite}
.status-pill.status-upcoming{background:linear-gradient(135deg,#dbeafe,#bfdbfe);color:#2563eb;border:1px solid rgba(59,130,246,0.3)}
@keyframes pulseOverdue{0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,0.4)}50%{box-shadow:0 0 0 4px rgba(239,68,68,0)}}
.calendar-week-view,.calendar-day-view{min-height:300px}
.week-view-container{display:grid;grid-template-columns:repeat(7,1fr);gap:.5rem}
.week-day-column{background:linear-gradient(135deg,rgba(248,250,252,0.9),rgba(241,245,249,0.7));border-radius:12px;padding:.6rem;min-height:200px;border:1px solid rgba(148,163,184,0.1)}
.week-day-header{font-size:.75rem;font-weight:700;text-align:center;padding:.6rem 0;border-bottom:1px solid rgba(148,163,184,0.15);margin-bottom:.5rem;color:#475569}
.week-day-header.today{color:#fff;background:linear-gradient(135deg,#3b82f6,#8b5cf6);border-radius:8px;margin:-0.6rem -0.6rem 0.5rem;padding:.7rem 0}
.day-view-container{background:linear-gradient(135deg,rgba(248,250,252,0.9),rgba(241,245,249,0.7));border-radius:16px;padding:1.25rem;min-height:300px;border:1px solid rgba(148,163,184,0.1)}
.day-view-header{font-size:1.1rem;font-weight:700;margin-bottom:1rem;text-align:center;background:linear-gradient(135deg,#1e3a5f,#3b82f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.day-event-item{padding:.9rem 1rem;background:#fff;border-radius:12px;margin-bottom:.6rem;border-left:4px solid #3b82f6;cursor:pointer;box-shadow:0 4px 12px rgba(0,0,0,0.06);transition:all .25s}
.day-event-item:hover{transform:translateX(4px);box-shadow:0 6px 18px rgba(0,0,0,0.1)}
.day-event-item.meeting{border-left-color:#3b82f6;background:linear-gradient(to right,rgba(59,130,246,0.05),#fff)}
.day-event-item.walkthrough{border-left-color:#22c55e;background:linear-gradient(to right,rgba(34,197,94,0.05),#fff)}
.day-event-item.drill{border-left-color:#f59e0b;background:linear-gradient(to right,rgba(245,158,11,0.05),#fff)}
.day-event-item.campaign{border-left-color:#8b5cf6;background:linear-gradient(to right,rgba(139,92,246,0.05),#fff)}
.day-event-item.holiday{border-left-color:#ef4444;background:linear-gradient(to right,rgba(239,68,68,0.05),#fff)}
.day-event-item.safety-meeting{border-left-color:#06b6d4;background:linear-gradient(to right,rgba(6,182,212,0.05),#fff)}
.day-event-item.training{border-left-color:#ec4899;background:linear-gradient(to right,rgba(236,72,153,0.05),#fff)}
.day-event-item.inspection{border-left-color:#14b8a6;background:linear-gradient(to right,rgba(20,184,166,0.05),#fff)}
.day-event-item.audit{border-left-color:#6366f1;background:linear-gradient(to right,rgba(99,102,241,0.05),#fff)}
.day-event-item.toolbox-talk{border-left-color:#78716c;background:linear-gradient(to right,rgba(120,113,108,0.05),#fff)}
.day-event-item .event-title{font-weight:600;font-size:.9rem;margin-bottom:.3rem;color:#1e293b}
.day-event-item .event-meta{font-size:.75rem;color:#64748b;display:flex;align-items:center;gap:.5rem}
.day-event-item .event-meta i{font-size:.65rem;opacity:.7}
.calendar-list-view{overflow-x:auto;border-radius:12px;border:1px solid rgba(148,163,184,0.15)}
.calendar-list-table{width:100%;border-collapse:collapse;font-size:.85rem}
.calendar-list-table th,.calendar-list-table td{padding:.9rem 1rem;text-align:left;border-bottom:1px solid rgba(148,163,184,0.1)}
.calendar-list-table th{background:linear-gradient(135deg,rgba(59,130,246,0.08),rgba(139,92,246,0.08));font-weight:700;color:#334155;text-transform:uppercase;font-size:.75rem;letter-spacing:.5px}
.calendar-list-table th:first-child{border-radius:12px 0 0 0}
.calendar-list-table th:last-child{border-radius:0 12px 0 0}
.calendar-list-table tbody tr{cursor:pointer;transition:all .2s}
.calendar-list-table tbody tr:hover{background:linear-gradient(to right,rgba(59,130,246,0.05),transparent);transform:translateX(2px)}
.calendar-list-table tbody tr:nth-child(even){background:rgba(248,250,252,0.5)}
.calendar-fab{position:fixed;bottom:6rem;right:1.5rem;width:60px;height:60px;border-radius:16px;background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff;border:none;font-size:1.6rem;cursor:pointer;box-shadow:0 8px 25px rgba(59,130,246,0.4);display:flex;align-items:center;justify-content:center;z-index:30;transition:all .3s}
.calendar-fab:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 12px 35px rgba(59,130,246,0.5)}
.calendar-fab::after{content:'';position:absolute;width:100%;height:100%;border-radius:16px;background:linear-gradient(135deg,#3b82f6,#8b5cf6);z-index:-1;opacity:0;animation:fabPulse 2s infinite}
@keyframes fabPulse{0%{transform:scale(1);opacity:.4}100%{transform:scale(1.4);opacity:0}}
.calendar-export-section{display:flex;gap:.75rem;margin-top:1.5rem;justify-content:center;flex-wrap:wrap}
.calendar-export-section .btn{padding:.6rem 1.2rem;font-size:.85rem;display:inline-flex;align-items:center;gap:.5rem;border-radius:8px;cursor:pointer;transition:all .2s}
.calendar-export-section .btn-secondary{background:var(--surface-soft);color:var(--text-main);border:1px solid var(--card-border)}
.calendar-export-section .btn-secondary:hover{background:var(--primary-start);color:#fff;border-color:var(--primary-start)}
.view-event-modal{max-width:450px}
.view-event-header{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid var(--card-border)}
.view-event-header h2{font-size:1.1rem;margin:0;flex:1}
.view-event-body{margin-bottom:1rem}
.event-detail-row{display:flex;align-items:center;gap:.75rem;padding:.5rem 0;font-size:.9rem}
.event-detail-row i{width:20px;color:var(--text-soft)}
.event-attachments-section{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--card-border)}
.event-attachments-section h4{font-size:.9rem;margin-bottom:.75rem}
.event-attachments-list{display:flex;flex-wrap:wrap;gap:.5rem}
.attachment-link{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .75rem;background:var(--surface-soft);border-radius:8px;font-size:.8rem;color:var(--text-main);text-decoration:none}
.attachment-link:hover{background:rgba(59,130,246,0.1)}
.attachment-link i{color:var(--accent-blue)}
.view-event-actions{display:flex;gap:.5rem;flex-wrap:wrap;padding-top:1rem;border-top:1px solid var(--card-border)}
.btn-edit,.btn-approve,.btn-complete,.btn-delete{flex:1;padding:.6rem 1rem;border-radius:10px;border:none;font-size:.85rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.4rem}
.btn-edit{background:#3b82f6;color:#fff}
.btn-approve{background:#22c55e;color:#fff}
.btn-complete{background:#0ea5e9;color:#fff}
.btn-delete{background:#ef4444;color:#fff}
.attachments-preview{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}
.attachment-preview-item{display:flex;align-items:center;gap:.4rem;padding:.3rem .6rem;background:var(--surface-soft);border-radius:6px;font-size:.75rem}
.attachment-preview-item i{color:var(--accent-blue)}
.form-actions{display:flex;gap:.75rem;margin-top:1.25rem;padding-top:1rem;border-top:1px solid rgba(148,163,184,0.15)}
.btn-cancel{flex:1;padding:.75rem;border-radius:12px;border:1px solid rgba(148,163,184,0.3);background:linear-gradient(135deg,rgba(248,250,252,0.9),rgba(241,245,249,0.7));font-size:.9rem;cursor:pointer;font-weight:500;color:#475569;transition:all .25s}
.btn-cancel:hover{background:linear-gradient(135deg,rgba(239,68,68,0.08),rgba(239,68,68,0.03));border-color:rgba(239,68,68,0.3);color:#dc2626}
.btn-submit{flex:1;padding:.75rem;border-radius:12px;border:none;background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff;font-size:.9rem;font-weight:600;cursor:pointer;box-shadow:0 4px 15px rgba(59,130,246,0.3);transition:all .25s;display:flex;align-items:center;justify-content:center;gap:.5rem}
.btn-submit:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(59,130,246,0.4)}
.btn-submit i{font-size:.85rem}
.event-status-display{padding:.5rem;background:var(--surface-soft);border-radius:8px;display:flex;align-items:center;gap:.5rem}
body.dark-mode .calendar-container{background:rgba(15,23,42,0.96);border-color:rgba(59,130,246,0.2)}
body.dark-mode .calendar-container::before{opacity:.6}
body.dark-mode .calendar-day{background:rgba(30,41,59,0.8);border-color:transparent}
body.dark-mode .calendar-day:hover{background:rgba(59,130,246,0.2);border-color:rgba(59,130,246,0.3)}
body.dark-mode .calendar-day .day-number{color:#e2e8f0}
body.dark-mode .calendar-day.today{background:linear-gradient(rgba(30,41,59,0.9),rgba(30,41,59,0.9)) padding-box,linear-gradient(135deg,#3b82f6,#8b5cf6) border-box}
body.dark-mode .calendar-weekdays{background:rgba(30,41,59,0.6)}
body.dark-mode .calendar-weekdays div{color:#94a3b8}
body.dark-mode .calendar-header h4{background:linear-gradient(135deg,#60a5fa,#a78bfa);-webkit-background-clip:text;background-clip:text}
body.dark-mode .week-day-column{background:rgba(30,41,59,0.8);border-color:rgba(59,130,246,0.1)}
body.dark-mode .week-day-header{color:#94a3b8}
body.dark-mode .day-view-container{background:rgba(30,41,59,0.8);border-color:rgba(59,130,246,0.1)}
body.dark-mode .day-view-header{background:linear-gradient(135deg,#60a5fa,#a78bfa);-webkit-background-clip:text;background-clip:text}
body.dark-mode .day-event-item{background:rgba(15,23,42,0.95);box-shadow:0 4px 15px rgba(0,0,0,0.2)}
body.dark-mode .day-event-item .event-title{color:#e2e8f0}
body.dark-mode .day-event-item .event-meta{color:#94a3b8}
body.dark-mode .calendar-list-table th{background:rgba(30,41,59,0.9);color:#e2e8f0}
body.dark-mode .calendar-list-table tbody tr:nth-child(even){background:rgba(30,41,59,0.4)}
body.dark-mode .calendar-list-view{border-color:rgba(59,130,246,0.15)}
body.dark-mode .form-modal input,body.dark-mode .form-modal select,body.dark-mode .form-modal textarea{background:rgba(30,41,59,0.8);border-color:rgba(148,163,184,0.2);color:#e2e8f0}
body.dark-mode .form-modal input:focus,body.dark-mode .form-modal select:focus,body.dark-mode .form-modal textarea:focus{background:rgba(15,23,42,0.9);border-color:#3b82f6}
body.dark-mode .form-modal label{color:#94a3b8}
body.dark-mode .btn-cancel{background:rgba(30,41,59,0.8);border-color:rgba(148,163,184,0.2);color:#94a3b8}
.calendar-settings-btn{width:36px;height:36px;border-radius:50%;border:none;background:var(--surface-soft);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;margin-left:.5rem}
.calendar-settings-btn:hover{background:var(--primary-start);color:#fff}
.calendar-settings-panel{background:var(--card-bg);border-radius:var(--radius-card);padding:1rem;border:1px solid var(--card-border);margin-top:1rem;box-shadow:0 8px 24px rgba(0,0,0,0.1)}
.settings-panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid var(--card-border)}
.settings-panel-header h3{font-size:1rem;display:flex;align-items:center;gap:.5rem;margin:0}
.settings-panel-header h3 i{color:var(--primary-start)}
.close-settings-btn{width:32px;height:32px;border-radius:50%;border:none;background:rgba(148,163,184,0.2);cursor:pointer;display:flex;align-items:center;justify-content:center}
.settings-panel-tabs{display:flex;gap:.5rem;margin-bottom:1rem}
.settings-tab-btn{flex:1;padding:.6rem;border:none;background:rgba(148,163,184,0.2);border-radius:10px;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s}
.settings-tab-btn.active{background:linear-gradient(90deg,var(--primary-start),var(--primary-end));color:#fff}
.settings-tab-content{display:none}
.settings-tab-content.active{display:block}
.categories-list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem;max-height:300px;overflow-y:auto}
.category-item{display:flex;align-items:center;gap:.75rem;padding:.6rem .75rem;background:var(--surface-soft);border-radius:10px;border:1px solid var(--card-border)}
.category-color{width:24px;height:24px;border-radius:6px;border:1px solid rgba(0,0,0,0.1)}
.category-icon{width:24px;text-align:center;color:var(--text-soft)}
.category-name{flex:1;font-size:.9rem;font-weight:500}
.category-actions{display:flex;gap:.25rem}
.category-actions button{width:28px;height:28px;border-radius:6px;border:none;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
.category-actions button:hover{background:rgba(148,163,184,0.3)}
.category-actions .delete-btn:hover{background:rgba(239,68,68,0.2);color:#ef4444}
.add-category-btn{width:100%;padding:.6rem;border:2px dashed var(--card-border);border-radius:10px;background:none;cursor:pointer;font-size:.85rem;color:var(--text-soft);display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .2s}
.add-category-btn:hover{border-color:var(--primary-start);color:var(--primary-start)}
.add-category-form{padding:1rem;background:var(--surface-soft);border-radius:10px;margin-top:.75rem}
.add-category-form input[type="text"],.add-category-form select{width:100%;padding:.5rem;border:1px solid var(--card-border);border-radius:8px;margin-bottom:.5rem;font-size:.85rem}
.add-category-form input[type="color"]{width:100%;height:40px;padding:0;border:1px solid var(--card-border);border-radius:8px;margin-bottom:.5rem;cursor:pointer}
.category-form-actions{display:flex;gap:.5rem;margin-top:.5rem}
.category-form-actions button{flex:1;padding:.5rem;border-radius:8px;border:1px solid var(--card-border);background:none;cursor:pointer;font-size:.85rem}
.category-form-actions .btn-save{background:linear-gradient(90deg,var(--primary-start),var(--primary-end));color:#fff;border:none}
.settings-group{margin-bottom:1.25rem}
.settings-toggle{display:flex;align-items:center;justify-content:space-between;padding:.6rem 0;border-bottom:1px solid var(--card-border);cursor:pointer}
.settings-toggle span:first-child{font-size:.9rem}
.settings-toggle input{display:none}
.toggle-slider{width:44px;height:24px;background:rgba(148,163,184,0.4);border-radius:12px;position:relative;transition:background .2s}
.toggle-slider::after{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;background:#fff;border-radius:50%;transition:transform .2s;box-shadow:0 2px 4px rgba(0,0,0,0.2)}
.settings-toggle input:checked + .toggle-slider{background:var(--primary-start)}
.settings-toggle input:checked + .toggle-slider::after{transform:translateX(20px)}
.settings-field{display:flex;align-items:center;justify-content:space-between;padding:.6rem 0;border-bottom:1px solid var(--card-border)}
.settings-field span{font-size:.9rem}
.settings-field select,.settings-field input{width:120px;padding:.4rem;border:1px solid var(--card-border);border-radius:8px;font-size:.85rem}
.save-settings-btn{width:100%;padding:.75rem;border:none;border-radius:10px;background:linear-gradient(90deg,var(--primary-start),var(--primary-end));color:#fff;font-size:.9rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:1rem}
.save-settings-btn:hover{opacity:.9}
body.dark-mode .calendar-settings-panel{background:rgba(15,23,42,0.96)}
body.dark-mode .category-item{background:rgba(30,41,59,0.8)}
body.dark-mode .add-category-form{background:rgba(30,41,59,0.8)}
@media(max-width:600px){.calendar-weekdays div{font-size:.6rem}.calendar-day{min-height:50px}.calendar-event-item{display:none}.calendar-day .day-events{flex-direction:row;flex-wrap:wrap}.week-view-container{grid-template-columns:repeat(3,1fr)}.calendar-filters{flex-direction:column}.calendar-filters select,.calendar-filters input{width:100%}}

/* ===== EXCAVATION MODULE STYLES ===== */
.section-badge-brown{background:linear-gradient(135deg,#92400e,#d97706)}
.excavation-sub-nav{display:flex;gap:.5rem;overflow-x:auto;padding:.5rem 0;margin-bottom:1rem}
.excavation-nav-btn{display:flex;align-items:center;gap:.4rem;padding:.6rem 1rem;border-radius:10px;border:1px solid var(--card-border);background:var(--card-bg);color:var(--text-main);font-size:.85rem;font-weight:500;cursor:pointer;white-space:nowrap;transition:all .2s}
.excavation-nav-btn:hover{border-color:var(--primary-start);color:var(--primary-start)}
.excavation-nav-btn.active{background:linear-gradient(135deg,#92400e,#d97706);color:#fff;border-color:transparent}
.excavation-nav-btn i{font-size:.9rem}
.excavation-section{animation:fadeIn .3s ease}
.excavation-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem;margin-bottom:1rem}
.excavation-stat-card{display:flex;align-items:center;gap:.75rem;padding:1rem;border-radius:12px;background:var(--card-bg);border:1px solid var(--card-border);box-shadow:var(--card-shadow)}
.excavation-stat-card i{font-size:1.5rem;opacity:.7}
.excavation-stat-card .stat-content{display:flex;flex-direction:column}
.excavation-stat-card .stat-number{font-size:1.5rem;font-weight:700}
.excavation-stat-card .stat-label{font-size:.75rem;color:var(--text-soft)}
.excavation-stat-card.stat-total{border-left:4px solid #3b82f6}
.excavation-stat-card.stat-total i{color:#3b82f6}
.excavation-stat-card.stat-compliant{border-left:4px solid #22c55e}
.excavation-stat-card.stat-compliant i{color:#22c55e}
.excavation-stat-card.stat-action{border-left:4px solid #f59e0b}
.excavation-stat-card.stat-action i{color:#f59e0b}
.excavation-stat-card.stat-stop{border-left:4px solid #ef4444}
.excavation-stat-card.stat-stop i{color:#ef4444}
.excavation-list-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}
.excavation-list-header h3{font-size:1rem;margin:0;display:flex;align-items:center;gap:.5rem}
.add-excavation-btn{display:flex;align-items:center;gap:.4rem;padding:.6rem 1rem;border-radius:10px;border:none;background:linear-gradient(135deg,#92400e,#d97706);color:#fff;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s}
.add-excavation-btn:hover{opacity:.9;transform:translateY(-1px)}
.excavation-filters{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap}
.excavation-filters select,.excavation-filters input{flex:1;min-width:120px;padding:.5rem;border:1px solid var(--card-border);border-radius:10px;font-size:.85rem;background:var(--card-bg)}
.excavations-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem}
.excavation-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;padding:1rem;cursor:pointer;transition:all .2s;box-shadow:var(--card-shadow)}
.excavation-card:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(0,0,0,0.15);border-color:var(--primary-start)}
.excavation-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem}
.excavation-card-header h4{margin:0;font-size:1rem}
.excavation-status{padding:.25rem .6rem;border-radius:20px;font-size:.7rem;font-weight:600;text-transform:uppercase}
.excavation-status.status-active{background:rgba(34,197,94,0.15);color:#22c55e}
.excavation-status.status-completed{background:rgba(59,130,246,0.15);color:#3b82f6}
.excavation-status.status-suspended{background:rgba(239,68,68,0.15);color:#ef4444}
.excavation-card-body{margin-bottom:.75rem}
.excavation-card-body p{margin:0 0 .4rem;font-size:.85rem;color:var(--text-soft);display:flex;align-items:center;gap:.5rem}
.excavation-card-body p i{width:16px;color:var(--text-soft)}
.excavation-card-footer{display:flex;align-items:center;justify-content:space-between;padding-top:.75rem;border-top:1px solid var(--card-border)}
.compliance-badge{padding:.25rem .6rem;border-radius:20px;font-size:.7rem;font-weight:600}
.compliance-badge.status-compliant{background:rgba(34,197,94,0.15);color:#22c55e}
.compliance-badge.status-action{background:rgba(245,158,11,0.15);color:#f59e0b}
.compliance-badge.status-stop{background:rgba(239,68,68,0.15);color:#ef4444}
.excavation-date{font-size:.75rem;color:var(--text-soft);display:flex;align-items:center;gap:.4rem}
.excavation-form-container{background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;padding:1.5rem}
.excavation-form-container h3{font-size:1.1rem;margin:0 0 .5rem;display:flex;align-items:center;gap:.5rem}
.form-description{font-size:.85rem;color:var(--text-soft);margin-bottom:1.5rem}
.form-section{margin-bottom:1.5rem;padding:1rem;background:var(--surface-soft);border-radius:10px}
.form-section h4{margin:0 0 1rem;font-size:.95rem;display:flex;align-items:center;gap:.5rem;color:var(--text-main)}
.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem}
.form-group{display:flex;flex-direction:column;gap:.4rem;margin-bottom:.75rem;position:relative}
.form-group label{font-size:.8rem;font-weight:500;color:var(--text-soft)}
.form-group input,.form-group select,.form-group textarea{padding:.6rem;border:1px solid var(--card-border);border-radius:8px;font-size:.9rem;background:var(--card-bg);color:var(--text-main)}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--primary-start);outline:none}
.form-hint{font-size:.7rem;color:var(--text-soft)}
.gps-btn{position:absolute;right:.5rem;top:50%;transform:translateY(25%);padding:.4rem .6rem;border:none;border-radius:6px;background:linear-gradient(135deg,#3b82f6,#0ea5e9);color:#fff;cursor:pointer}
.csm-alert{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem 1rem;border-radius:10px;margin-bottom:1rem}
.csm-alert i{font-size:1.1rem;flex-shrink:0;margin-top:.1rem}
.csm-alert span{font-size:.85rem;line-height:1.4}
.csm-alert-warning{background:rgba(245,158,11,0.1);border:1px solid rgba(245,158,11,0.3);color:#d97706}
.csm-alert-info{background:rgba(59,130,246,0.1);border:1px solid rgba(59,130,246,0.3);color:#3b82f6}
.csm-alert-danger{background:rgba(239,68,68,0.1);border:1px solid rgba(239,68,68,0.3);color:#ef4444}
.csm-recommendations{padding:1rem;background:var(--surface-soft);border-radius:10px;margin:1rem 0}
.csm-recommendations h4{margin:0 0 1rem;font-size:.95rem;display:flex;align-items:center;gap:.5rem}
.csm-rec{display:flex;align-items:flex-start;gap:.5rem;padding:.6rem;border-radius:8px;margin-bottom:.5rem;font-size:.85rem}
.csm-rec i{flex-shrink:0;margin-top:.1rem}
.csm-rec-success{background:rgba(34,197,94,0.1);color:#22c55e}
.csm-rec-info{background:rgba(59,130,246,0.1);color:#3b82f6}
.csm-rec-warning{background:rgba(245,158,11,0.1);color:#d97706}
.csm-rec-danger{background:rgba(239,68,68,0.1);color:#ef4444}
.form-actions{display:flex;gap:.75rem;margin-top:1.5rem;justify-content:flex-end}
.btn-cancel{padding:.6rem 1.5rem;border-radius:10px;border:1px solid var(--card-border);background:none;color:var(--text-main);font-size:.9rem;cursor:pointer}
.btn-cancel:hover{background:var(--surface-soft)}
.btn-submit{padding:.6rem 1.5rem;border-radius:10px;border:none;background:linear-gradient(135deg,#92400e,#d97706);color:#fff;font-size:.9rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.5rem}
.btn-submit:hover{opacity:.9}
.inspection-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}
.inspection-header h3{margin:0;display:flex;align-items:center;gap:.5rem}
.add-inspection-btn{display:flex;align-items:center;gap:.4rem;padding:.5rem 1rem;border-radius:10px;border:none;background:#22c55e;color:#fff;font-size:.85rem;font-weight:600;cursor:pointer}
.inspection-filters,.permit-filters{margin:1rem 0}
.inspection-filters select,.permit-filters select{width:100%;max-width:300px;padding:.5rem;border:1px solid var(--card-border);border-radius:10px;font-size:.9rem}
.inspections-list,.excavation-permits-list{display:flex;flex-direction:column;gap:.75rem}
.inspection-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;padding:1rem;border-left:4px solid #3b82f6}
.inspection-card.status-pass{border-left-color:#22c55e}
.inspection-card.status-conditional{border-left-color:#f59e0b}
.inspection-card.status-fail{border-left-color:#ef4444}
.inspection-card-header{display:flex;justify-content:space-between;margin-bottom:.75rem}
.inspection-date{font-size:.9rem;font-weight:600}
.inspection-status{padding:.2rem .5rem;border-radius:6px;font-size:.75rem;font-weight:600;background:var(--surface-soft)}
.inspection-card-body{font-size:.85rem}
.inspection-card-body p{margin:0 0 .5rem}
.inspection-readings{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:.5rem;padding:.5rem;background:var(--surface-soft);border-radius:8px;font-size:.8rem}
.inspection-readings span{display:flex;align-items:center;gap:.25rem}
.corrective-actions{color:#f59e0b;font-style:italic}
.permit-card{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px}
.permit-card.permit-approved{border-left:4px solid #22c55e}
.permit-card.permit-pending{border-left:4px solid #f59e0b}
.permit-card.permit-required{border-left:4px solid #ef4444}
.permit-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:var(--surface-soft);font-size:1.2rem;color:var(--text-soft)}
.permit-info{flex:1}
.permit-info h4{margin:0 0 .25rem;font-size:.95rem}
.permit-info p{margin:0;font-size:.8rem;color:var(--text-soft)}
.permit-status{display:inline-block;margin-top:.4rem;padding:.2rem .5rem;border-radius:6px;font-size:.7rem;font-weight:600;background:var(--surface-soft);text-transform:uppercase}
.excavation-tools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem;margin-top:1rem}
.exc-tool-card{display:flex;flex-direction:column;align-items:center;padding:1.5rem;background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;cursor:pointer;text-align:center;transition:all .2s}
.exc-tool-card:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(0,0,0,0.15);border-color:#d97706}
.exc-tool-card i{font-size:2rem;color:#d97706;margin-bottom:.75rem}
.exc-tool-card span{font-weight:600;font-size:.95rem;margin-bottom:.25rem}
.exc-tool-card p{font-size:.8rem;color:var(--text-soft);margin:0}
.excavation-inspection-modal{max-width:600px}
.inspection-checklist{margin:1rem 0;padding:1rem;background:var(--surface-soft);border-radius:10px}
.inspection-checklist h4{margin:0 0 1rem;font-size:.95rem;display:flex;align-items:center;gap:.5rem}
.checklist-item{display:flex;align-items:center;justify-content:space-between;padding:.5rem 0;border-bottom:1px solid var(--card-border)}
.checklist-item:last-child{border-bottom:none}
.checklist-item label{font-size:.85rem;flex:1}
.checklist-item select{width:180px;padding:.4rem;border:1px solid var(--card-border);border-radius:8px;font-size:.8rem}
.view-excavation-modal{max-width:700px}
.view-excavation-status{display:flex;gap:.75rem;margin:1rem 0}
.view-excavation-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin:1rem 0}
.view-section{padding:1rem;background:var(--surface-soft);border-radius:10px}
.view-section h4{margin:0 0 .75rem;font-size:.9rem;display:flex;align-items:center;gap:.5rem;color:var(--primary-start)}
.view-section p{margin:0 0 .4rem;font-size:.85rem}
.view-excavation-actions{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--card-border)}
.btn-inspection{background:#0ea5e9;color:#fff;padding:.6rem 1rem;border-radius:10px;border:none;font-size:.85rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.4rem}
.btn-suspend{background:#f59e0b;color:#fff;padding:.6rem 1rem;border-radius:10px;border:none;font-size:.85rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.4rem}
.mini-inspection-card{display:flex;align-items:center;justify-content:space-between;padding:.5rem .75rem;background:var(--card-bg);border-radius:8px;margin-bottom:.4rem;font-size:.8rem;border-left:3px solid #3b82f6}
.mini-inspection-card.status-pass{border-left-color:#22c55e}
.mini-inspection-card.status-conditional{border-left-color:#f59e0b}
.mini-inspection-card.status-fail{border-left-color:#ef4444}
.mini-inspection-card .insp-status{padding:.15rem .4rem;border-radius:4px;font-size:.7rem;font-weight:600;background:var(--surface-soft);text-transform:uppercase}
.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;color:var(--text-soft);text-align:center}
.empty-state i{font-size:2.5rem;margin-bottom:.75rem;opacity:.5}
.empty-state-mini{text-align:center;padding:1rem;color:var(--text-soft);font-size:.85rem}
.exc-tool-modal-content{max-width:500px}
.tool-content{padding:1rem 0}
.tool-content ul{margin:.75rem 0;padding-left:1.5rem}
.tool-content li{margin-bottom:.5rem;font-size:.9rem}
.csm-table{width:100%;border-collapse:collapse;font-size:.85rem;margin:1rem 0}
.csm-table th,.csm-table td{padding:.6rem;text-align:left;border:1px solid var(--card-border)}
.csm-table th{background:var(--surface-soft);font-weight:600}
.csm-note{font-size:.8rem;color:var(--text-soft);font-style:italic;margin-top:.75rem}
.slope-calc{display:flex;flex-direction:column;gap:.75rem}
.slope-calc label{font-size:.85rem;font-weight:500}
.slope-calc select,.slope-calc input{padding:.5rem;border:1px solid var(--card-border);border-radius:8px;font-size:.9rem}
.slope-result{padding:1rem;background:rgba(34,197,94,0.1);border-radius:10px;margin-top:.75rem}
.slope-result p{margin:0 0 .5rem;font-size:.9rem}
.loading-text{text-align:center;padding:2rem;color:var(--text-soft);font-size:.9rem}
@media(max-width:768px){.excavation-stats-grid{grid-template-columns:repeat(2,1fr)}.view-excavation-grid{grid-template-columns:1fr}.excavation-sub-nav{padding:.25rem 0}.excavation-nav-btn{padding:.5rem .75rem;font-size:.8rem}.form-row{grid-template-columns:1fr}.excavations-list{grid-template-columns:1fr}.excavation-tools-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.excavation-stats-grid{grid-template-columns:1fr}.excavation-tools-grid{grid-template-columns:1fr}.checklist-item{flex-direction:column;align-items:flex-start;gap:.4rem}.checklist-item select{width:100%}}

.tool-description{font-size:.85rem;color:var(--text-soft);margin-bottom:1rem}
.heat-stress-calculator{margin-bottom:1.5rem}
.heat-input-section{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-bottom:1rem}
.heat-input-group{display:flex;flex-direction:column;gap:.4rem}
.heat-input-group label{font-size:.85rem;font-weight:500;display:flex;align-items:center;gap:.4rem}
.heat-input-group label i{color:#f97316}
.heat-input-group input{padding:.65rem .75rem;border:1px solid var(--card-border);border-radius:10px;font-size:1rem}
.heat-result-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:14px;padding:1rem;border-left:4px solid #6b7280;transition:all .3s}
.heat-result-card.category-safe{border-left-color:#22c55e;background:linear-gradient(135deg,rgba(34,197,94,0.05),transparent)}
.heat-result-card.category-caution{border-left-color:#eab308;background:linear-gradient(135deg,rgba(234,179,8,0.05),transparent)}
.heat-result-card.category-extreme-caution{border-left-color:#f97316;background:linear-gradient(135deg,rgba(249,115,22,0.05),transparent)}
.heat-result-card.category-danger{border-left-color:#ef4444;background:linear-gradient(135deg,rgba(239,68,68,0.08),transparent)}
.heat-result-card.category-extreme-danger{border-left-color:#b91c1c;background:linear-gradient(135deg,rgba(185,28,28,0.1),transparent)}
.heat-result-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.75rem}
.heat-index-display{display:flex;flex-direction:column}
.heat-index-label{font-size:.75rem;color:var(--text-soft);text-transform:uppercase;letter-spacing:.05em}
.heat-index-value{font-size:2rem;font-weight:700;color:#1e293b}
.heat-category-badge{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:999px;font-size:.85rem;font-weight:600;background:var(--surface-soft);border:2px solid var(--card-border)}
.heat-category-badge i{font-size:1rem}
.heat-details{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--card-border)}
.heat-detail-row{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-bottom:1rem}
.heat-detail-item{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem;background:var(--surface-soft);border-radius:10px}
.heat-detail-item i{font-size:1.25rem;color:#0ea5e9;margin-top:.1rem}
.heat-detail-item.work-rest i{color:#8b5cf6}
.heat-detail-item.water i{color:#06b6d4}
.detail-content{display:flex;flex-direction:column;gap:.15rem}
.detail-label{font-size:.75rem;color:var(--text-soft);text-transform:uppercase}
.detail-value{font-size:.9rem;font-weight:600}
.heat-symptoms-section{margin-bottom:1rem}
.heat-symptoms-section h4{font-size:.85rem;font-weight:600;margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem;color:#f59e0b}
.symptoms-list{display:flex;flex-wrap:wrap;gap:.5rem}
.symptom-tag{display:inline-flex;align-items:center;gap:.3rem;padding:.35rem .65rem;background:rgba(245,158,11,0.1);color:#d97706;border-radius:999px;font-size:.8rem;font-weight:500}
.symptom-tag i{font-size:.7rem}
.heat-actions-section h4{font-size:.85rem;font-weight:600;margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem;color:#22c55e}
.actions-list{margin:0;padding-left:1.25rem;font-size:.85rem}
.actions-list li{margin-bottom:.4rem}
.actions-list.emergency{color:#b91c1c;font-weight:500}
.actions-list.emergency li::marker{color:#b91c1c}
.heat-reference-table{margin-bottom:1.5rem}
.heat-reference-table h4{font-size:.9rem;font-weight:600;margin-bottom:.75rem;display:flex;align-items:center;gap:.5rem}
.heat-table-wrapper{overflow-x:auto;border-radius:10px;border:1px solid var(--card-border)}
.heat-category-table{width:100%;border-collapse:collapse;font-size:.85rem}
.heat-category-table th,.heat-category-table td{padding:.6rem .75rem;text-align:left;border-bottom:1px solid var(--card-border)}
.heat-category-table th{background:var(--surface-soft);font-weight:600;font-size:.75rem;text-transform:uppercase;letter-spacing:.03em}
.heat-category-table tbody tr:last-child td{border-bottom:none}
.cat-badge{display:inline-block;padding:.25rem .6rem;border-radius:6px;font-size:.75rem;font-weight:600}
.cat-badge.cat-1{background:rgba(234,179,8,0.15);color:#b45309}
.cat-badge.cat-2{background:rgba(249,115,22,0.15);color:#c2410c}
.cat-badge.cat-3{background:rgba(239,68,68,0.15);color:#dc2626}
.cat-badge.cat-4{background:rgba(185,28,28,0.2);color:#991b1b}
.heat-illness-guide{margin-bottom:1rem}
.heat-illness-guide h4{font-size:.9rem;font-weight:600;margin-bottom:.75rem;display:flex;align-items:center;gap:.5rem}
.illness-cards{display:flex;flex-direction:column;gap:.75rem}
.illness-card{padding:1rem;border-radius:12px;border-left:4px solid #6b7280}
.illness-card.cramps{background:rgba(234,179,8,0.08);border-left-color:#eab308}
.illness-card.exhaustion{background:rgba(249,115,22,0.08);border-left-color:#f97316}
.illness-card.stroke{background:rgba(239,68,68,0.1);border-left-color:#ef4444}
.illness-header{display:flex;align-items:center;gap:.5rem;font-weight:600;font-size:.95rem;margin-bottom:.5rem}
.illness-card.cramps .illness-header{color:#b45309}
.illness-card.cramps .illness-header i{color:#eab308}
.illness-card.exhaustion .illness-header{color:#c2410c}
.illness-card.exhaustion .illness-header i{color:#f97316}
.illness-card.stroke .illness-header{color:#dc2626}
.illness-card.stroke .illness-header i{color:#ef4444}
.illness-symptoms{font-size:.85rem;margin-bottom:.5rem;color:var(--text-main)}
.illness-action{font-size:.8rem;padding:.5rem .75rem;background:rgba(34,197,94,0.1);color:#15803d;border-radius:8px;font-weight:500}
.illness-action.emergency{background:rgba(239,68,68,0.15);color:#b91c1c}
@media(max-width:600px){.heat-input-section{grid-template-columns:1fr}.heat-detail-row{grid-template-columns:1fr}.heat-result-header{flex-direction:column;align-items:flex-start}}

.wind-calculator{margin-bottom:1.5rem}
.wind-input-section{margin-bottom:1rem}
.wind-input-group{display:flex;flex-direction:column;gap:.4rem}
.wind-input-group label{font-size:.85rem;font-weight:500;display:flex;align-items:center;gap:.4rem}
.wind-input-group label i{color:#0ea5e9}
.wind-input-row{display:flex;align-items:center;gap:.5rem}
.wind-input-row input{flex:1;padding:.65rem .75rem;border:1px solid var(--card-border);border-radius:10px;font-size:1rem;max-width:200px}
.wind-unit{font-size:.9rem;color:var(--text-soft);font-weight:500}
.wind-result-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:14px;padding:1rem;border-left:4px solid #6b7280;transition:all .3s}
.wind-result-card.wind-safe{border-left-color:#22c55e;background:linear-gradient(135deg,rgba(34,197,94,0.05),transparent)}
.wind-result-card.wind-caution{border-left-color:#f59e0b;background:linear-gradient(135deg,rgba(245,158,11,0.05),transparent)}
.wind-result-card.wind-restricted{border-left-color:#ef4444;background:linear-gradient(135deg,rgba(239,68,68,0.08),transparent)}
.wind-result-card.wind-danger{border-left-color:#b91c1c;background:linear-gradient(135deg,rgba(185,28,28,0.1),transparent)}
.wind-result-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.75rem}
.wind-status-display{display:flex;flex-direction:column}
.wind-status-label{font-size:.75rem;color:var(--text-soft);text-transform:uppercase;letter-spacing:.05em}
.wind-status-value{font-size:1.75rem;font-weight:700;color:#6b7280}
.wind-speed-display{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:var(--surface-soft);border-radius:999px;font-size:.9rem;color:var(--text-soft)}
.wind-speed-display i{color:#0ea5e9}
.wind-restrictions-section{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--card-border)}
.wind-restriction-item{display:flex;align-items:center;gap:.5rem;padding:.75rem;border-radius:10px;font-size:.9rem;font-weight:500;margin-bottom:1rem}
.wind-restriction-item i{font-size:1rem}
.crane-operations-status{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}
.crane-op-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;background:var(--surface-soft);border-radius:10px;border:2px solid transparent;transition:all .2s}
.crane-op-item.allowed{border-color:rgba(34,197,94,0.3);background:rgba(34,197,94,0.05)}
.crane-op-item.suspended{border-color:rgba(239,68,68,0.3);background:rgba(239,68,68,0.05)}
.crane-op-item i{font-size:1.25rem;color:var(--text-soft)}
.crane-op-item.allowed i{color:#22c55e}
.crane-op-item.suspended i{color:#ef4444}
.crane-op-info{display:flex;flex-direction:column;gap:.1rem}
.crane-op-label{font-size:.75rem;color:var(--text-soft);text-transform:uppercase}
.crane-op-status{font-size:.9rem;font-weight:600}
.wind-limits-reference{margin-bottom:1.5rem}
.wind-limits-reference h4{font-size:.9rem;font-weight:600;margin-bottom:.75rem;display:flex;align-items:center;gap:.5rem;color:#ef4444}
.wind-limits-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-bottom:1.5rem}
.wind-limit-card{display:flex;align-items:flex-start;gap:.75rem;padding:1rem;border-radius:12px;border:1px solid var(--card-border)}
.wind-limit-card.crane-limit{background:linear-gradient(135deg,rgba(14,165,233,0.08),transparent);border-left:4px solid #0ea5e9}
.wind-limit-card.manbasket-limit{background:linear-gradient(135deg,rgba(139,92,246,0.08),transparent);border-left:4px solid #8b5cf6}
.limit-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:10px;font-size:1.1rem;overflow:hidden}
.crane-limit .limit-icon{background:rgba(14,165,233,0.15);color:#0ea5e9}
.manbasket-limit .limit-icon{background:rgba(139,92,246,0.15);color:#8b5cf6}
.limit-info{display:flex;flex-direction:column;gap:.25rem;flex:1}
.limit-title{font-size:.85rem;font-weight:600;color:var(--text-main)}
.limit-value{font-size:1.1rem;font-weight:700;color:#ef4444}
.limit-mph{font-size:.85rem;font-weight:500;color:var(--text-soft)}
.limit-note{font-size:.75rem;color:var(--text-soft)}
.wind-restrictions-table{margin-top:1rem}
.wind-restrictions-table h5{font-size:.85rem;font-weight:600;margin-bottom:.5rem}
.wind-table{width:100%;border-collapse:collapse;font-size:.85rem;border:1px solid var(--card-border);border-radius:10px;overflow:hidden}
.wind-table th,.wind-table td{padding:.6rem .75rem;text-align:left;border-bottom:1px solid var(--card-border)}
.wind-table th{background:var(--surface-soft);font-weight:600;font-size:.75rem;text-transform:uppercase;letter-spacing:.03em}
.wind-table tbody tr:last-child td{border-bottom:none}
.wind-badge{display:inline-block;padding:.2rem .5rem;border-radius:4px;font-size:.7rem;font-weight:700;text-transform:uppercase}
.wind-badge.safe{background:rgba(34,197,94,0.15);color:#15803d}
.wind-badge.caution{background:rgba(245,158,11,0.15);color:#b45309}
.wind-badge.restricted{background:rgba(239,68,68,0.15);color:#dc2626}
.wind-badge.danger{background:rgba(185,28,28,0.2);color:#991b1b}
@media(max-width:600px){.wind-limits-grid{grid-template-columns:1fr}.crane-operations-status{grid-template-columns:1fr}}

/* Home Page Improved Sections */
.emergency-reporting-card{border-left:4px solid #ef4444}
.emergency-steps-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;margin-bottom:1rem}
.emergency-step{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem;background:var(--surface-soft);border-radius:10px;transition:transform .2s}
.emergency-step:hover{transform:translateY(-2px)}
.step-number{width:32px;height:32px;background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem;flex-shrink:0}
.step-content{flex:1}
.step-title{font-weight:600;font-size:.9rem;color:var(--text-main);margin-bottom:.15rem}
.step-desc{font-size:.8rem;color:var(--text-soft)}
.emergency-actions{display:flex;gap:.75rem;flex-wrap:wrap}
.emergency-actions .gps-btn,.emergency-call-btn{flex:1;min-width:140px;padding:.75rem 1rem;border-radius:10px;font-size:.9rem;font-weight:600;display:flex;align-items:center;justify-content:center;gap:.5rem;cursor:pointer;border:none;transition:all .2s}
.emergency-actions .gps-btn{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}
.emergency-call-btn{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}
.emergency-actions .gps-btn:hover,.emergency-call-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.15)}

.safety-responsibilities-card{border-left:4px solid #8b5cf6}
.responsibilities-summary{display:flex;justify-content:space-between;gap:.75rem;margin-bottom:1rem}
.resp-category{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;padding:.75rem;background:var(--surface-soft);border-radius:10px;transition:all .2s}
.resp-category.clickable{cursor:pointer}
.resp-category.clickable:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.1)}
.resp-category.clickable:active{transform:translateY(0)}
.resp-category-icon{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.1rem;margin-bottom:.5rem;overflow:hidden}
.resp-category-icon.reporting{background:linear-gradient(135deg,rgba(239,68,68,0.15),rgba(239,68,68,0.25));color:#ef4444}
.resp-category-icon.monitoring{background:linear-gradient(135deg,rgba(14,165,233,0.15),rgba(14,165,233,0.25));color:#0ea5e9}
.resp-category-icon.compliance{background:linear-gradient(135deg,rgba(34,197,94,0.15),rgba(34,197,94,0.25));color:#22c55e}
.resp-category-title{font-weight:600;font-size:.85rem;color:var(--text-main)}
.resp-category-count{font-size:.75rem;color:var(--text-soft)}
.responsibilities-full{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--card-border)}
.resp-section{margin-bottom:1rem}
.resp-section:last-child{margin-bottom:0}
.resp-section-header{display:flex;align-items:center;gap:.5rem;font-weight:600;font-size:.9rem;margin-bottom:.5rem;padding:.5rem .75rem;border-radius:8px;background:var(--surface-soft)}
.resp-section-header i{color:var(--primary)}
.resp-list{list-style:none;padding:0;margin:0}
.resp-list li{position:relative;padding:.4rem 0 .4rem 1.5rem;font-size:.85rem;color:var(--text-main);border-bottom:1px solid var(--card-border)}
.resp-list li:last-child{border-bottom:none}
.resp-list li::before{content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;left:0;color:#22c55e;font-size:.75rem}

.useful-links-card{border-left:4px solid #0ea5e9}
.useful-links-grid{display:flex;flex-direction:column;gap:.75rem}
.useful-link-item{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--surface-soft);border-radius:12px;text-decoration:none;color:inherit;transition:all .2s;border:1px solid transparent}
.useful-link-item:hover{transform:translateY(-2px);border-color:var(--primary);box-shadow:0 4px 12px rgba(0,0,0,0.1)}
.link-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;flex-shrink:0;overflow:hidden}
.link-icon.csm{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff}
.link-icon.handbook{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}
.link-info{flex:1}
.link-title{font-weight:600;font-size:.95rem;color:var(--text-main)}
.link-desc{font-size:.8rem;color:var(--text-soft)}
.useful-link-item > .fa-external-link-alt{color:var(--text-soft);font-size:.9rem}

.home-about-link{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:1rem;margin-top:1rem;color:var(--text-soft);font-size:.9rem;cursor:pointer;border-radius:10px;transition:all .2s}
.home-about-link:hover{background:var(--surface-soft);color:var(--primary)}
.home-about-link i{font-size:1rem}

@media(max-width:600px){
.emergency-steps-grid{grid-template-columns:1fr}
.responsibilities-summary{flex-direction:column}
.resp-category{flex-direction:row;gap:1rem;text-align:left}
.resp-category-icon{margin-bottom:0}
}

/* Interactive Risk Calculator */
.risk-calculator{margin-bottom:1.5rem}
.risk-calc-inputs{display:flex;flex-direction:column;gap:1.5rem;margin-bottom:1.5rem}
.risk-input-group label{display:flex;align-items:center;gap:.5rem;font-weight:600;font-size:.95rem;margin-bottom:.75rem}
.risk-input-group label i{color:var(--primary)}
.risk-options{display:flex;flex-direction:column;gap:.5rem}
.risk-option{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:var(--surface-soft);border:2px solid transparent;border-radius:12px;cursor:pointer;text-align:left;transition:all .2s}
.risk-option:hover{border-color:var(--primary);transform:translateX(4px)}
.risk-option.selected{border-color:var(--primary);background:rgba(59,130,246,0.1)}
.option-value{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:var(--card-bg);border-radius:50%;font-weight:700;font-size:.9rem;color:var(--primary);flex-shrink:0}
.risk-option.selected .option-value{background:var(--primary);color:#fff}
.option-label{font-weight:600;font-size:.9rem;color:var(--text-main);min-width:100px}
.option-desc{font-size:.8rem;color:var(--text-soft);flex:1}
.risk-result-display{padding:1.5rem;border-radius:14px;background:var(--surface-soft);border:2px solid var(--card-border);text-align:center}
.risk-result-placeholder{display:flex;flex-direction:column;align-items:center;gap:.75rem;color:var(--text-soft)}
.risk-result-placeholder i{font-size:2rem;opacity:.5}
.risk-result-card{animation:fadeIn .3s ease}
.risk-result-header{display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:1rem}
.risk-level-badge{padding:.75rem 1.5rem;border-radius:12px;font-weight:700;font-size:1.5rem;text-transform:uppercase}
.risk-level-badge.low{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff}
.risk-level-badge.medium{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}
.risk-level-badge.high{background:linear-gradient(135deg,#f97316,#ea580c);color:#fff}
.risk-level-badge.extreme{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}
.risk-score-display{display:flex;flex-direction:column;align-items:center}
.risk-score-label{font-size:.75rem;color:var(--text-soft);text-transform:uppercase}
.risk-score-value{font-size:1.5rem;font-weight:700}
.risk-action-required{margin-top:1rem;padding:.75rem 1rem;border-radius:10px;font-size:.9rem;font-weight:500}
.risk-action-required.low{background:rgba(34,197,94,0.1);color:#15803d}
.risk-action-required.medium{background:rgba(245,158,11,0.1);color:#b45309}
.risk-action-required.high{background:rgba(249,115,22,0.1);color:#c2410c}
.risk-action-required.extreme{background:rgba(239,68,68,0.15);color:#b91c1c}
.risk-matrix-reference{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--card-border)}
.risk-matrix-reference h4{font-size:.95rem;font-weight:600;display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}
.risk-matrix-grid{display:flex;flex-direction:column;gap:2px;margin-bottom:1rem;overflow-x:auto}
.matrix-header-row,.matrix-row{display:grid;grid-template-columns:120px repeat(5,1fr);gap:2px}
.matrix-corner,.matrix-header,.matrix-label,.matrix-cell{padding:.5rem .25rem;text-align:center;font-size:.75rem;border-radius:4px}
.matrix-corner{background:transparent}
.matrix-header{background:var(--surface-soft);font-weight:600}
.matrix-header small{display:block;font-size:.65rem;font-weight:400;color:var(--text-soft)}
.matrix-label{background:var(--surface-soft);font-weight:600;text-align:left;padding-left:.5rem;font-size:.7rem}
.matrix-cell{font-weight:700;color:#fff;cursor:pointer;transition:transform .2s}
.matrix-cell:hover{transform:scale(1.1);z-index:1}
.matrix-cell.highlighted{box-shadow:0 0 0 3px var(--primary),0 0 0 5px rgba(59,130,246,0.3);transform:scale(1.15);z-index:2}
.matrix-cell.risk-low{background:#22c55e}
.matrix-cell.risk-medium{background:#f59e0b}
.matrix-cell.risk-high{background:#f97316}
.matrix-cell.risk-extreme{background:#ef4444}
.risk-legend{display:flex;flex-wrap:wrap;gap:.75rem 1.5rem}
.legend-item{display:flex;align-items:center;gap:.5rem;font-size:.8rem}
.legend-box{width:16px;height:16px;border-radius:4px}
.legend-box.risk-low{background:#22c55e}
.legend-box.risk-medium{background:#f59e0b}
.legend-box.risk-high{background:#f97316}
.legend-box.risk-extreme{background:#ef4444}
@media(max-width:600px){.matrix-header-row,.matrix-row{grid-template-columns:80px repeat(5,1fr)}.matrix-label{font-size:.6rem}.option-desc{display:none}.risk-legend{flex-direction:column;gap:.5rem}}

/* Weather Schedule Row */
.weather-schedule-row{display:flex;flex-direction:column;gap:.5rem;margin-top:.75rem;padding:.75rem;background:var(--surface-soft);border-radius:12px}
.weather-schedule-item{display:flex;align-items:center;gap:.5rem;font-size:.85rem;color:var(--text-main)}
.weather-schedule-item i{width:20px;text-align:center}
.weather-schedule-item strong{font-weight:600}

/* View Details Button */
.view-heat-details-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;padding:.6rem 1rem;margin-top:.75rem;border-radius:10px;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s}
.view-heat-details-btn:hover{opacity:.85;transform:translateY(-1px)}

/* Heat Details Modal */
.heat-details-modal{position:fixed;top:0;left:0;right:0;bottom:0;z-index:100;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:all .3s}
.heat-details-modal.active{opacity:1;visibility:visible}
.heat-details-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);backdrop-filter:blur(4px)}
.heat-details-content{position:relative;width:90%;max-width:450px;max-height:85vh;overflow-y:auto;background:#fff;border-radius:20px;padding:1.5rem;box-shadow:0 20px 60px rgba(0,0,0,0.3);transform:translateY(20px);transition:transform .3s}
.heat-details-modal.active .heat-details-content{transform:translateY(0)}
.heat-details-close{position:absolute;top:1rem;right:1rem;width:36px;height:36px;border-radius:50%;border:none;background:var(--surface-soft);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--text-soft);transition:all .2s}
.heat-details-close:hover{background:var(--accent-red);color:#fff}
.heat-details-header{display:flex;align-items:center;gap:1rem;padding:1rem;border-radius:12px;margin-bottom:1.5rem}
.heat-details-header h3{font-size:1.25rem;font-weight:700;margin:0}
.heat-details-header p{font-size:.9rem;color:var(--text-soft);margin:0}
.heat-details-section{margin-bottom:1.25rem}
.heat-details-section h4{font-size:.9rem;font-weight:600;display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem;color:var(--text-main)}
.heat-details-section h4 i{color:var(--accent-blue)}
.heat-info-card{background:var(--surface-soft);padding:.75rem 1rem;border-radius:10px}
.heat-info-value{font-weight:600;font-size:1rem}
.heat-symptoms-grid{display:flex;flex-wrap:wrap;gap:.5rem}
.heat-symptom-tag{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .75rem;background:rgba(239,68,68,0.1);color:#ef4444;border-radius:20px;font-size:.8rem}
.heat-symptom-tag i{font-size:.4rem}
.heat-actions-list{list-style:none;padding:0;margin:0}
.heat-actions-list li{display:flex;align-items:flex-start;gap:.5rem;padding:.5rem 0;font-size:.9rem;border-bottom:1px solid var(--card-border)}
.heat-actions-list li:last-child{border-bottom:none}
.heat-actions-list li i{margin-top:3px;flex-shrink:0}

body.dark-mode .heat-details-content{background:#1e293b}
body.dark-mode .heat-info-card{background:#0f172a}

/* Challenge Points - White Text */
.challenge-points{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff!important;padding:.4rem .8rem;border-radius:999px;font-size:.85rem;font-weight:700;white-space:nowrap}

/* TikTok-style Learning Videos */
/* Document Viewer Modal */
.doc-viewer-modal{max-width:95vw;width:95vw;height:90vh;padding:0;display:flex;flex-direction:column;overflow:hidden}
.doc-viewer-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:linear-gradient(135deg,#1e3a5f,#2d5a87);border-bottom:1px solid rgba(255,255,255,0.1)}
.doc-viewer-title{font-size:1rem;font-weight:600;color:#fff;display:flex;align-items:center;gap:.5rem}
.doc-viewer-actions{display:flex;gap:.5rem}
.doc-viewer-btn{width:36px;height:36px;border-radius:8px;border:none;background:rgba(255,255,255,0.15);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;text-decoration:none}
.doc-viewer-btn:hover{background:rgba(255,255,255,0.25);transform:scale(1.05)}
.doc-viewer-content{flex:1;overflow:hidden;background:#f1f5f9}
.doc-viewer-content iframe{width:100%;height:100%;border:none}

.learning-videos-container{position:fixed;top:0;left:0;right:0;bottom:0;background:#f5f5f5;z-index:200;display:none}
.learning-videos-container.active{display:flex;flex-direction:column}
.learning-videos-header{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:1rem;z-index:10;background:linear-gradient(180deg,rgba(245,245,245,0.95) 0%,rgba(245,245,245,0.8) 100%)}
.learning-videos-back{width:40px;height:40px;border-radius:50%;border:none;background:rgba(0,0,0,0.1);color:#1e293b;font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(10px)}
.learning-videos-back:hover{background:rgba(0,0,0,0.15)}
.learning-videos-title{color:#1e293b;font-size:1rem;font-weight:600}
.learning-videos-scroll{flex:1;overflow-y:scroll;scroll-snap-type:y mandatory;-webkit-overflow-scrolling:touch}
.video-slide{height:100vh;width:100%;scroll-snap-align:start;position:relative;display:flex;align-items:center;justify-content:center;background:#f5f5f5}
.video-slide iframe{width:100%;height:100%;border:none}
.video-info{position:absolute;bottom:80px;left:0;right:0;padding:1rem;color:#1e293b;text-shadow:none}
.video-info h4{font-size:1rem;font-weight:600;margin-bottom:.5rem}
.video-info p{font-size:.85rem;opacity:.8}
.video-indicator{position:absolute;right:1rem;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:.5rem}
.video-dot{width:8px;height:8px;border-radius:50%;background:rgba(0,0,0,0.2)}
.video-dot.active{background:#1e293b}
.swipe-hint{display:none}

/* Enhanced Learning Videos UI - Light Theme */
.lv-loading,.lv-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:rgba(30,41,59,0.7);gap:1rem;text-align:center;padding:2rem}
.lv-loading i,.lv-empty i{font-size:3rem;opacity:0.5}
.lv-categories-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem;padding:5rem 1rem 2rem;max-width:800px;margin:0 auto}
.lv-category-card{border-radius:16px;padding:1.5rem 1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.75rem;cursor:pointer;transition:all 0.3s ease;box-shadow:0 4px 15px rgba(0,0,0,0.1);min-height:140px}
.lv-category-card:hover{transform:translateY(-5px) scale(1.02);box-shadow:0 8px 25px rgba(0,0,0,0.15)}
.lv-category-card:active{transform:scale(0.98)}
.lv-cat-icon{width:50px;height:50px;background:rgba(255,255,255,0.3);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:#fff;backdrop-filter:blur(10px);overflow:hidden}
.lv-cat-name{font-size:0.95rem;font-weight:600;color:#fff;text-align:center;text-shadow:0 1px 3px rgba(0,0,0,0.3)}
.lv-cat-count{font-size:0.75rem;color:rgba(255,255,255,0.9);background:rgba(0,0,0,0.2);padding:0.25rem 0.75rem;border-radius:20px}
.lv-video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem;padding:5rem 1rem 2rem;max-width:1200px;margin:0 auto}
.lv-video-card{background:#fff;border-radius:16px;overflow:hidden;cursor:pointer;transition:all 0.3s ease;box-shadow:0 2px 10px rgba(0,0,0,0.08);border:1px solid rgba(0,0,0,0.06)}
.lv-video-card:hover{transform:translateY(-5px);box-shadow:0 10px 30px rgba(0,0,0,0.12)}
.lv-video-thumb{height:160px;background-size:cover;background-position:center;position:relative}
.lv-play-overlay{position:absolute;inset:0;background:rgba(0,0,0,0.3);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity 0.3s ease}
.lv-play-overlay i{font-size:3rem;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,0.5)}
.lv-video-card:hover .lv-play-overlay{opacity:1}
.lv-video-details{padding:1rem}
.lv-video-title{font-size:0.95rem;font-weight:600;color:#1e293b;margin-bottom:0.5rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lv-video-desc{font-size:0.8rem;color:rgba(30,41,59,0.7);margin-bottom:0.5rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lv-video-meta{display:flex;align-items:center;gap:0.75rem}
.lv-comment-count{font-size:0.8rem;color:rgba(30,41,59,0.6);display:flex;align-items:center;gap:0.25rem}
.lv-player-view{padding-top:60px;overflow-y:auto;height:100%}
.lv-player-wrapper{width:100%;max-width:900px;margin:0 auto;aspect-ratio:16/9;background:#000}
.lv-player-wrapper iframe{width:100%;height:100%;border:none}
.lv-video-info-panel{max-width:900px;margin:1rem auto;padding:1rem;background:#fff;border-radius:12px;box-shadow:0 2px 10px rgba(0,0,0,0.08);border:1px solid rgba(0,0,0,0.06)}
.lv-video-info-panel h3{color:#1e293b;font-size:1.1rem;margin-bottom:0.5rem}
.lv-video-info-panel p{color:rgba(30,41,59,0.7);font-size:0.9rem}
.lv-cat-badge{display:inline-block;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;font-size:0.75rem;padding:0.25rem 0.75rem;border-radius:20px;margin-bottom:0.5rem}
.lv-comments-section{max-width:900px;margin:1rem auto;padding:1rem;background:#fff;border-radius:12px;box-shadow:0 2px 10px rgba(0,0,0,0.08);border:1px solid rgba(0,0,0,0.06)}
.lv-comments-section h4{color:#1e293b;font-size:1rem;margin-bottom:1rem;display:flex;align-items:center;gap:0.5rem}
.lv-comment-form{display:flex;gap:0.75rem;margin-bottom:1rem}
.lv-comment-form textarea{flex:1;background:#f8fafc;border:1px solid rgba(0,0,0,0.1);border-radius:8px;padding:0.75rem;color:#1e293b;font-size:0.9rem;resize:none}
.lv-comment-form textarea::placeholder{color:rgba(30,41,59,0.5)}
.lv-comment-form button{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border:none;padding:0.75rem 1.25rem;border-radius:8px;cursor:pointer;font-weight:600;display:flex;align-items:center;gap:0.5rem;transition:transform 0.2s}
.lv-comment-form button:hover{transform:scale(1.05)}
.lv-login-hint{color:rgba(30,41,59,0.5);font-size:0.85rem;text-align:center;padding:1rem}
.lv-comments-list{display:flex;flex-direction:column;gap:0.75rem}
.lv-comment-item{display:flex;gap:0.75rem;padding:0.75rem;background:#f8fafc;border-radius:10px}
.lv-comment-avatar{width:40px;height:40px;border-radius:50%;overflow:hidden;flex-shrink:0;background:rgba(0,0,0,0.05);display:flex;align-items:center;justify-content:center}
.lv-comment-avatar img{width:100%;height:100%;object-fit:cover}
.lv-comment-avatar i{font-size:1.5rem;color:rgba(30,41,59,0.4)}
.lv-comment-content{flex:1}
.lv-comment-header{display:flex;align-items:center;gap:0.5rem;margin-bottom:0.25rem}
.lv-comment-author{font-weight:600;color:#1e293b;font-size:0.85rem}
.lv-comment-time{font-size:0.75rem;color:rgba(30,41,59,0.5)}
.lv-comment-delete{background:none;border:none;color:rgba(30,41,59,0.4);cursor:pointer;padding:0.25rem;margin-left:auto;transition:color 0.2s}
.lv-comment-delete:hover{color:#ef4444}
.lv-comment-content p{color:rgba(30,41,59,0.85);font-size:0.9rem;margin:0}
.lv-no-comments,.lv-error{text-align:center;color:rgba(30,41,59,0.5);padding:2rem;display:flex;flex-direction:column;align-items:center;gap:0.5rem}
.lv-loading-small{text-align:center;color:rgba(30,41,59,0.5);padding:1rem}

/* First Aid Kit Professional Card-Based Styling */
.first-aid-header-card{display:flex;align-items:center;gap:1rem;padding:1.25rem;background:linear-gradient(135deg,var(--accent-red) 0%,#b91c1c 100%);border-radius:var(--radius-card);margin-bottom:1.5rem;color:#fff;box-shadow:0 4px 15px rgba(228,54,58,0.3)}
.fa-kit-icon{width:60px;height:60px;border-radius:14px;background:rgba(255,255,255,0.2);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.fa-kit-icon i{font-size:1.75rem;color:#fff}
.fa-kit-info{flex:1}
.fa-kit-info h4{font-size:1.1rem;font-weight:700;margin:0 0 .25rem 0;color:#fff}
.fa-kit-info p{font-size:.85rem;opacity:.9;margin:0}
.fa-kit-status{flex-shrink:0}
.fa-progress-ring{position:relative;width:56px;height:56px}
.fa-progress-ring svg{width:56px;height:56px;transform:rotate(-90deg)}
.fa-progress-bg{fill:none;stroke:rgba(255,255,255,0.2);stroke-width:3}
.fa-progress-bar{fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;transition:stroke-dasharray .5s ease}
.fa-progress-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:.85rem;font-weight:700;color:#fff}

.first-aid-checklist{max-width:100%}
.checklist-items{display:flex;flex-direction:column;gap:1rem}
.checklist-category{background:var(--card-bg);border-radius:14px;border:1px solid var(--card-border);overflow:hidden;box-shadow:var(--shadow-soft)}
.category-header{display:flex;align-items:center;gap:.75rem;padding:1rem;background:var(--surface-soft);border-bottom:1px solid var(--card-border)}
.category-icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.9rem;flex-shrink:0;overflow:hidden}
.category-header h5{font-size:.9rem;font-weight:600;margin:0;color:var(--text-main)}

.checklist-category.wound-care .category-icon{background:linear-gradient(135deg,#ec4899,#db2777)}
.checklist-category.taping .category-icon{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}
.checklist-category.eye-care .category-icon{background:linear-gradient(135deg,var(--accent-blue),#2563eb)}
.checklist-category.burn-care .category-icon{background:linear-gradient(135deg,var(--accent-orange),#d97706)}
.checklist-category.trauma .category-icon{background:linear-gradient(135deg,var(--accent-red),#dc2626)}
.checklist-category.tools .category-icon{background:linear-gradient(135deg,#6b7280,#4b5563)}
.checklist-category.ppe-medical .category-icon{background:linear-gradient(135deg,var(--accent-green),#16a34a)}
.checklist-category.additional .category-icon{background:linear-gradient(135deg,#06b6d4,#0891b2)}

.checklist-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;border-bottom:1px solid var(--card-border);transition:background .2s;background:var(--card-bg)}
.checklist-item:last-child{border-bottom:none}
.checklist-item:hover{background:var(--surface-soft)}
.checklist-item input[type="checkbox"]{width:20px;height:20px;accent-color:var(--accent-green);cursor:pointer;flex-shrink:0}
.item-text{flex:1;font-size:.85rem;color:var(--text-main)}
.item-qty{padding:.25rem .6rem;background:rgba(28,132,255,0.1);color:var(--accent-blue);border-radius:6px;font-size:.75rem;font-weight:600;flex-shrink:0}

.checklist-status{display:flex;align-items:center;gap:.75rem;padding:1rem;border-radius:12px;margin:1.25rem 0;background:linear-gradient(135deg,rgba(255,143,44,0.1),rgba(255,143,44,0.05));border:1px solid rgba(255,143,44,0.3)}
.checklist-status.complete{background:linear-gradient(135deg,rgba(0,179,107,0.1),rgba(0,179,107,0.05));border-color:rgba(0,179,107,0.3)}
.status-icon{width:40px;height:40px;border-radius:10px;background:var(--accent-orange);display:flex;align-items:center;justify-content:center;color:#fff;font-size:1rem;flex-shrink:0;overflow:hidden}
.checklist-status.complete .status-icon{background:var(--accent-green)}
.status-text{flex:1}
.status-text strong{display:block;font-size:.9rem;color:var(--text-main);margin-bottom:.15rem}
.status-text span{font-size:.8rem;color:var(--text-soft)}

.checklist-actions{display:flex;gap:.75rem;flex-wrap:wrap}
.fa-action-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;border-radius:12px;border:none;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s}
.fa-action-btn.reset{background:var(--surface-soft);color:var(--text-main)}
.fa-action-btn.reset:hover{background:rgba(107,114,128,0.2)}
.fa-action-btn.print{background:linear-gradient(135deg,var(--accent-blue),#2563eb);color:#fff}
.fa-action-btn.print:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(28,132,255,0.3)}

.fa-standards-card{background:var(--surface-soft);border-radius:14px;border:1px solid var(--card-border);padding:.25rem;margin-top:1.5rem}
.fa-standard-row{display:flex;align-items:center;gap:.75rem;padding:.75rem}
.fa-standard-row:not(:last-child){border-bottom:1px solid var(--card-border)}
.fa-standard-icon{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--accent-blue),#2563eb);display:flex;align-items:center;justify-content:center;color:#fff;font-size:.9rem;flex-shrink:0;overflow:hidden}
.fa-standard-info{flex:1}
.fa-standard-info strong{display:block;font-size:.85rem;color:var(--text-main);margin-bottom:.1rem}
.fa-standard-info span{font-size:.75rem;color:var(--text-soft)}

/* First Aid Kit Dark Mode */
body.dark-mode .first-aid-header-card{box-shadow:0 4px 15px rgba(0,0,0,0.5)}
body.dark-mode .checklist-category{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2);box-shadow:0 8px 20px rgba(0,0,0,0.3)}
body.dark-mode .category-header{background:rgba(30,41,59,0.8);border-color:rgba(148,163,184,0.15)}
body.dark-mode .category-header h5{color:#e5e7eb}
body.dark-mode .checklist-item{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.15)}
body.dark-mode .checklist-item:hover{background:rgba(59,130,246,0.1)}
body.dark-mode .item-text{color:#e5e7eb}
body.dark-mode .item-qty{background:rgba(28,132,255,0.2);color:#60a5fa}
body.dark-mode .checklist-status{background:rgba(255,143,44,0.15);border-color:rgba(255,143,44,0.4)}
body.dark-mode .checklist-status.complete{background:rgba(0,179,107,0.15);border-color:rgba(0,179,107,0.4)}
body.dark-mode .status-text strong{color:#e5e7eb}
body.dark-mode .status-text span{color:#94a3b8}
body.dark-mode .fa-action-btn.reset{background:rgba(107,114,128,0.3);color:#e5e7eb}
body.dark-mode .fa-action-btn.reset:hover{background:rgba(107,114,128,0.5)}
body.dark-mode .fa-standards-card{background:rgba(30,41,59,0.8);border-color:rgba(148,163,184,0.2)}
body.dark-mode .fa-standard-row{border-color:rgba(148,163,184,0.15)}
body.dark-mode .fa-standard-info strong{color:#e5e7eb}
body.dark-mode .fa-standard-info span{color:#94a3b8}

/* ========== DAILY REPORTS STYLES ========== */
.section-badge-orange{background:linear-gradient(135deg,#f97316,#ea580c)}

.daily-report-actions{padding:0 1rem 1rem;display:flex;justify-content:center}
.add-daily-report-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:linear-gradient(135deg,#f97316,#ea580c);color:#fff;border:none;border-radius:12px;font-size:.9rem;font-weight:600;cursor:pointer;box-shadow:0 4px 12px rgba(249,115,22,0.3);transition:all .2s}
.add-daily-report-btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(249,115,22,0.4)}

.daily-report-filters{padding:0 1rem 1rem}
.daily-report-filters .obs-filter-row{margin-bottom:.5rem}
.daily-report-filters select{width:100%;padding:.6rem;border-radius:10px;border:1px solid var(--card-border);background:var(--card-bg);color:var(--text-main);font-size:.85rem}

.daily-reports-list{padding:0 1rem 2rem}
.daily-report-card{background:var(--card-bg);border-radius:14px;border:1px solid var(--card-border);margin-bottom:.75rem;padding:1rem;cursor:pointer;transition:all .2s;box-shadow:var(--shadow-soft)}
.daily-report-card:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,0.1)}
.report-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}
.report-date{font-size:.8rem;color:var(--text-soft);display:flex;align-items:center;gap:.35rem}
.report-date i{color:#f97316}
.report-area-badge{background:linear-gradient(135deg,#f97316,#ea580c);color:#fff;padding:.25rem .6rem;border-radius:8px;font-size:.7rem;font-weight:600;max-width:50%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.report-card-body{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem}
.report-stat{display:flex;flex-direction:column;align-items:center;gap:.15rem}
.report-stat i{font-size:1.2rem;color:#f97316}
.report-stat .stat-value{font-size:1.5rem;font-weight:700;color:var(--text-main)}
.report-stat .stat-label{font-size:.7rem;color:var(--text-soft)}
.report-stat .stat-detail{font-size:.7rem;color:var(--text-soft);background:var(--surface-soft);padding:.2rem .5rem;border-radius:6px;margin-bottom:.2rem}
.report-card-footer{display:flex;justify-content:space-between;align-items:center;padding-top:.5rem;border-top:1px solid var(--card-border)}
.report-card-footer .updated-by{font-size:.7rem;color:var(--text-soft)}
.report-card-footer .view-details{color:#f97316}

/* Daily Report Modal */
.daily-report-modal{max-width:600px;max-height:90vh;overflow-y:auto}
.daily-report-section{background:var(--surface-soft);border-radius:12px;padding:1rem;margin-bottom:1rem}
.daily-report-section .section-title{display:flex;align-items:center;gap:.5rem;font-weight:600;color:var(--text-main);margin-bottom:.75rem;font-size:.9rem}
.daily-report-section .section-title i{color:#f97316}

.form-row{display:flex;gap:.75rem}
.form-row.triple{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.75rem}
.form-row .form-group{flex:1}
.form-group label{display:block;font-size:.75rem;color:var(--text-soft);margin-bottom:.35rem;font-weight:500}
.form-group input,.form-group select{width:100%;padding:.6rem;border:1px solid var(--card-border);border-radius:10px;background:var(--card-bg);color:var(--text-main);font-size:.85rem}

.equipment-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;max-height:250px;overflow-y:auto;padding-right:.25rem}
.equipment-input-row{display:flex;align-items:center;justify-content:space-between;background:var(--card-bg);padding:.4rem .6rem;border-radius:8px;border:1px solid var(--card-border)}
.equipment-input-row label{font-size:.75rem;color:var(--text-main);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.equipment-input-row input{width:50px;padding:.35rem;text-align:center;border:1px solid var(--card-border);border-radius:6px;background:var(--surface-soft);color:var(--text-main);font-size:.8rem}
.equipment-input-row input:focus{border-color:#f97316;outline:none}

.autofill-notice{display:flex;align-items:center;gap:.5rem;padding:.6rem 1rem;border-radius:10px;font-size:.8rem;margin-bottom:1rem}
.autofill-notice.success{background:rgba(16,185,129,0.1);color:#059669;border:1px solid rgba(16,185,129,0.3)}
.autofill-notice.info{background:rgba(59,130,246,0.1);color:#2563eb;border:1px solid rgba(59,130,246,0.3)}

/* View Daily Report Modal */
.daily-report-view-modal{max-width:550px}
.daily-report-view-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid var(--card-border)}
.daily-report-view-header h2{font-size:1rem;margin:0}
.print-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem 1rem;background:#f97316;color:#fff;border:none;border-radius:8px;font-size:.8rem;cursor:pointer;font-weight:500}
.print-btn:hover{background:#ea580c}

.dr-view-section{background:var(--surface-soft);border-radius:10px;padding:.75rem 1rem;margin-bottom:.75rem}
.dr-view-row{display:flex;justify-content:space-between;padding:.25rem 0}
.dr-label{color:var(--text-soft);font-size:.8rem}
.dr-value{color:var(--text-main);font-weight:500;font-size:.85rem}
.dr-section-title{font-weight:600;color:var(--text-main);margin-bottom:.5rem;font-size:.85rem;display:flex;align-items:center;gap:.4rem}
.dr-section-title i{color:#f97316}
.dr-stats-row{display:flex;gap:.75rem}
.dr-stat-box{flex:1;text-align:center;background:var(--card-bg);padding:.5rem;border-radius:8px;border:1px solid var(--card-border)}
.dr-stat-box.cat{border-color:#f97316}
.dr-stat-box.rental{border-color:#8b5cf6}
.dr-stat-box .stat-num{font-size:1.25rem;font-weight:700;color:var(--text-main);display:block}
.dr-stat-box .stat-txt{font-size:.7rem;color:var(--text-soft)}
.dr-equip-list{display:grid;grid-template-columns:1fr 1fr;gap:.4rem}
.dr-equip-item{display:flex;justify-content:space-between;align-items:center;background:var(--card-bg);padding:.35rem .6rem;border-radius:6px;font-size:.8rem}
.dr-equip-item .eq-name{color:var(--text-main)}
.dr-equip-item .eq-qty{font-weight:600;color:#f97316;background:rgba(249,115,22,0.1);padding:.15rem .4rem;border-radius:4px}
.dr-view-footer{font-size:.7rem;color:var(--text-soft);text-align:right;margin-top:.75rem}

/* Area Summary Dashboard in Profile */
.area-assignment-section{margin-bottom:1rem}
.area-select-container{margin-bottom:1rem}
.area-select-container select{width:100%;padding:.7rem 1rem;border:1px solid var(--card-border);border-radius:12px;background:var(--card-bg);color:var(--text-main);font-size:.9rem}

.area-summary-dashboard{background:linear-gradient(135deg,rgba(249,115,22,0.08),rgba(249,115,22,0.02));border:1px solid rgba(249,115,22,0.2);border-radius:14px;padding:1rem;margin-top:.5rem}
.area-summary-title{font-weight:600;color:var(--text-main);font-size:.9rem;margin-bottom:.75rem;display:flex;align-items:center;gap:.5rem}
.area-summary-title i{color:#f97316}
.area-summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.area-summary-card{background:var(--card-bg);border-radius:12px;padding:.75rem;text-align:center;box-shadow:var(--shadow-soft);transition:transform .2s,box-shadow .2s}
.area-summary-card.clickable{cursor:pointer}
.area-summary-card.clickable:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.15)}
.area-summary-card.clickable:active{transform:translateY(0)}
.area-summary-card .summary-icon{font-size:1.1rem;margin-bottom:.35rem}
.area-summary-card .summary-value{font-size:1.5rem;font-weight:700;color:var(--text-main)}
.area-summary-card .summary-label{font-size:.7rem;color:var(--text-soft);margin-top:.1rem}
.area-summary-card.summary-blue .summary-icon{color:#3b82f6}
.area-summary-card.summary-red .summary-icon{color:#ef4444}
.area-summary-card.summary-green .summary-icon{color:#10b981}
.area-summary-card.summary-orange .summary-icon{color:#f97316}

.area-equipment-details{background:var(--surface-soft);border-radius:10px;padding:.6rem .75rem;margin-top:.75rem}
.equipment-breakdown-title{font-size:.75rem;color:var(--text-soft);margin-bottom:.4rem;font-weight:500}
.equipment-breakdown-row{display:flex;justify-content:space-between;padding:.25rem 0;font-size:.8rem}
.equipment-breakdown-row .eq-label{color:var(--text-main)}
.equipment-breakdown-row .eq-value{font-weight:600;color:#f97316}

.no-report-today{display:flex;flex-direction:column;align-items:center;gap:.5rem;background:rgba(251,191,36,0.1);border:1px solid rgba(251,191,36,0.3);border-radius:10px;padding:.75rem;margin-top:.75rem;font-size:.8rem;color:#b45309;text-align:center}
.no-report-today button{background:#f97316;color:#fff;border:none;padding:.4rem .8rem;border-radius:8px;font-size:.75rem;font-weight:500;cursor:pointer}
.no-report-today button:hover{background:#ea580c}

.no-data-message{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1rem;color:var(--text-soft);text-align:center}
.no-data-message i{font-size:2.5rem;margin-bottom:.75rem;opacity:.4}
.no-data-message p{font-size:.9rem}

/* Dark mode overrides */
body.dark-mode .daily-report-card{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2)}
body.dark-mode .daily-report-card:hover{box-shadow:0 6px 16px rgba(0,0,0,0.4)}
body.dark-mode .daily-report-section{background:rgba(30,41,59,0.8)}
body.dark-mode .equipment-input-row{background:rgba(15,23,42,0.8);border-color:rgba(148,163,184,0.2)}
body.dark-mode .dr-view-section{background:rgba(30,41,59,0.8)}
body.dark-mode .dr-stat-box{background:rgba(15,23,42,0.8);border-color:rgba(148,163,184,0.2)}
body.dark-mode .dr-equip-item{background:rgba(15,23,42,0.8)}
body.dark-mode .area-summary-dashboard{background:rgba(249,115,22,0.08);border-color:rgba(249,115,22,0.3)}
body.dark-mode .area-summary-card{background:rgba(15,23,42,0.96);box-shadow:0 4px 12px rgba(0,0,0,0.3)}
body.dark-mode .area-equipment-details{background:rgba(30,41,59,0.8)}
body.dark-mode .no-report-today{background:rgba(251,191,36,0.15);border-color:rgba(251,191,36,0.4);color:#fbbf24}

/* Print Reports Button */
.daily-report-actions{display:flex;gap:.75rem;flex-wrap:wrap}
.print-reports-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border:none;border-radius:12px;font-size:.85rem;font-weight:600;cursor:pointer;box-shadow:0 4px 12px rgba(59,130,246,0.3);transition:all .2s}
.print-reports-btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(59,130,246,0.4)}

/* Enhanced Location Sharing Section */
.location-share-section{background:linear-gradient(135deg,rgba(16,185,129,0.1),rgba(16,185,129,0.02));border:1px solid rgba(16,185,129,0.3);border-radius:14px;margin-bottom:1rem;overflow:hidden}
.location-share-header{display:flex;align-items:center;gap:.75rem;padding:1rem;cursor:pointer;transition:background .2s}
.location-share-header:hover{background:rgba(16,185,129,0.05)}
.location-share-icon{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,#10b981,#059669);display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.1rem;flex-shrink:0;overflow:hidden}
.location-share-text{flex:1}
.location-share-text .loc-title{display:block;font-weight:600;color:var(--text-main);font-size:.95rem}
.location-share-text .loc-subtitle{display:block;font-size:.75rem;color:var(--text-soft);margin-top:.1rem}
.location-toggle-icon{color:#10b981;font-size:.9rem;transition:transform .2s}

.location-share-content{padding:0 1rem 1rem;animation:slideDown .2s ease}
@keyframes slideDown{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}

.get-coords-btn{width:100%;padding:.75rem;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:10px;font-size:.9rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;margin-bottom:.75rem;transition:all .2s}
.get-coords-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(16,185,129,0.3)}

.coords-display{background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;padding:1rem;animation:fadeIn .3s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

.coords-row{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0;border-bottom:1px solid var(--card-border)}
.coords-row:last-of-type{border-bottom:none}
.coords-label{font-size:.8rem;color:var(--text-soft);display:flex;align-items:center;gap:.4rem}
.coords-label i{color:#10b981;font-size:.75rem}
.coords-value{font-weight:600;color:var(--text-main);font-size:.85rem;font-family:'Courier New',monospace}

.google-maps-link{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem;background:linear-gradient(135deg,#4285f4,#1a73e8);color:#fff;border-radius:10px;text-decoration:none;font-size:.85rem;font-weight:600;margin-top:.75rem;transition:all .2s}
.google-maps-link:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(66,133,244,0.3)}
.google-maps-link i{font-size:1rem}

.copy-coords-btn{width:100%;padding:.6rem;background:var(--surface-soft);color:var(--text-main);border:1px solid var(--card-border);border-radius:8px;font-size:.8rem;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.4rem;margin-top:.5rem;transition:all .2s}
.copy-coords-btn:hover{background:var(--card-border)}

.coords-loading{text-align:center;padding:1.5rem;color:#10b981;font-size:.9rem}
.coords-loading i{margin-right:.4rem}

/* Dark mode for location sharing */
body.dark-mode .location-share-section{background:rgba(16,185,129,0.08);border-color:rgba(16,185,129,0.3)}
body.dark-mode .location-share-header:hover{background:rgba(16,185,129,0.1)}
body.dark-mode .coords-display{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2)}
body.dark-mode .coords-row{border-color:rgba(148,163,184,0.15)}
body.dark-mode .copy-coords-btn{background:rgba(30,41,59,0.8);border-color:rgba(148,163,184,0.2)}

/* Daily Report Admin Settings */
.admin-subsection{margin-top:1rem;padding:1rem;background:var(--surface-soft);border-radius:12px;border:1px solid var(--card-border)}
.admin-subsection-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid var(--card-border)}
.admin-subsection-header span{font-size:.95rem;font-weight:600;color:var(--text-main);display:flex;align-items:center;gap:.5rem}
.admin-subsection-header span i{color:#3b82f6}

.admin-close-btn{background:transparent;border:none;color:var(--text-soft);font-size:1.2rem;cursor:pointer;padding:.5rem}
.admin-close-btn:hover{color:var(--text-main)}

.dr-settings-tabs{display:flex;gap:.5rem;margin-bottom:1rem}
.dr-settings-tab{flex:1;padding:.6rem;border:1px solid var(--card-border);border-radius:10px;background:var(--card-bg);color:var(--text-main);font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s}
.dr-settings-tab.active{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-color:#3b82f6}
.dr-settings-tab:hover:not(.active){background:var(--surface-soft)}

.dr-settings-content{padding:.5rem}
.dr-add-form{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap}
.dr-add-form input,.dr-add-form select{flex:1;min-width:120px;padding:.6rem;border:1px solid var(--card-border);border-radius:8px;background:var(--card-bg);color:var(--text-main);font-size:.85rem}
.dr-add-form button{padding:.6rem 1rem;background:#3b82f6;color:#fff;border:none;border-radius:8px;font-size:.85rem;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:.3rem}
.dr-add-form button:hover{background:#2563eb}

.dr-items-list{max-height:300px;overflow-y:auto}
.dr-item-row{display:flex;justify-content:space-between;align-items:center;padding:.6rem .75rem;background:var(--card-bg);border:1px solid var(--card-border);border-radius:8px;margin-bottom:.4rem}
.dr-item-info{display:flex;align-items:center;gap:.75rem;flex:1}
.dr-item-name{font-size:.85rem;color:var(--text-main);font-weight:500}
.dr-item-cat{font-size:.7rem;padding:.15rem .4rem;border-radius:4px;font-weight:600}
.dr-item-cat.cat-both{background:rgba(139,92,246,0.15);color:#8b5cf6}
.dr-item-cat.cat-cat{background:rgba(249,115,22,0.15);color:#f97316}
.dr-item-cat.cat-rental{background:rgba(59,130,246,0.15);color:#3b82f6}

.dr-item-actions{display:flex;gap:.35rem}
.dr-item-actions button{padding:.35rem .5rem;border:none;border-radius:6px;cursor:pointer;font-size:.75rem}
.dr-item-actions .edit-btn{background:rgba(59,130,246,0.15);color:#3b82f6}
.dr-item-actions .edit-btn:hover{background:rgba(59,130,246,0.25)}
.dr-item-actions .delete-btn{background:rgba(239,68,68,0.15);color:#ef4444}
.dr-item-actions .delete-btn:hover{background:rgba(239,68,68,0.25)}

.no-items{text-align:center;padding:2rem;color:var(--text-soft);font-size:.9rem}

/* Registry Modal */
.registry-modal{max-width:800px;max-height:90vh;overflow-y:auto}
.registry-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid var(--card-border)}
.registry-modal-header h2{font-size:1.1rem;display:flex;align-items:center;gap:.5rem}
.registry-modal-header h2 i{color:#f97316}
.registry-count{font-size:.8rem;background:var(--surface-soft);padding:.3rem .6rem;border-radius:6px;color:var(--text-soft)}

.registry-table-wrapper{overflow-x:auto}
.registry-table{width:100%;border-collapse:collapse;font-size:.8rem}
.registry-table th{background:var(--surface-soft);padding:.6rem .5rem;text-align:left;font-weight:600;color:var(--text-main);border-bottom:2px solid var(--card-border)}
.registry-table td{padding:.5rem;border-bottom:1px solid var(--card-border);color:var(--text-main)}
.registry-table tr:hover{background:var(--surface-soft)}
.table-btn{padding:.3rem .5rem;border:none;border-radius:6px;background:rgba(59,130,246,0.15);color:#3b82f6;cursor:pointer;font-size:.75rem}
.table-btn:hover{background:rgba(59,130,246,0.25)}

/* Dark mode for admin settings */
body.dark-mode .dr-settings-tab{background:rgba(15,23,42,0.8);border-color:rgba(148,163,184,0.2)}
body.dark-mode .dr-settings-tab:hover:not(.active){background:rgba(30,41,59,0.8)}
body.dark-mode .dr-add-form input,body.dark-mode .dr-add-form select{background:rgba(15,23,42,0.8);border-color:rgba(148,163,184,0.2)}
body.dark-mode .dr-item-row{background:rgba(15,23,42,0.8);border-color:rgba(148,163,184,0.2)}
body.dark-mode .registry-table th{background:rgba(30,41,59,0.8)}
body.dark-mode .registry-table tr:hover{background:rgba(30,41,59,0.6)}

/* Profile Button in Header */
.profile-btn{width:38px;height:38px;border-radius:999px;border:2px solid rgba(255,255,255,0.5);background:rgba(15,23,42,0.25);display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;transition:transform .2s,box-shadow .2s}
.profile-btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(0,0,0,0.35)}

/* Profile Modal Styles */
.profile-view-section{display:flex;flex-direction:column;align-items:center;gap:1rem;margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--card-border)}
.profile-avatar-section{display:flex;flex-direction:column;align-items:center;gap:.75rem}
.profile-avatar-large{width:100px;height:100px;border-radius:50%;background:linear-gradient(135deg,#3b82f6,#2563eb);display:flex;align-items:center;justify-content:center;overflow:hidden;border:4px solid #fff;box-shadow:0 8px 20px rgba(59,130,246,0.3)}
.profile-avatar-large i{font-size:3rem;color:#fff}
.profile-avatar-large img{width:100%;height:100%;object-fit:cover}
.change-avatar-btn{padding:.5rem 1rem;background:#f1f5f9;border:1px solid var(--card-border);border-radius:8px;font-size:.8rem;color:var(--text-main);cursor:pointer;display:flex;align-items:center;gap:.4rem}
.change-avatar-btn:hover{background:#e2e8f0}

.profile-info-readonly{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;width:100%}
.profile-field{padding:.6rem .75rem;background:var(--surface-soft);border-radius:10px}
.profile-field.readonly{background:rgba(148,163,184,0.1)}
.profile-field label{display:flex;align-items:center;gap:.4rem;font-size:.7rem;color:var(--text-soft);margin-bottom:.25rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.profile-field span{font-size:.9rem;font-weight:600;color:var(--text-main)}

.save-profile-btn{width:100%;padding:.85rem;background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;border:none;border-radius:12px;font-size:.95rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:.5rem}
.save-profile-btn:hover{background:linear-gradient(135deg,#16a34a,#15803d)}

/* Users Info Modal Styles */
.users-info-modal{max-width:600px;max-height:85vh}
.users-search-section{margin-bottom:1rem}
.users-search-input-wrapper{position:relative}
.users-search-input-wrapper i{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--text-soft)}
.users-search-input-wrapper input{width:100%;padding:.85rem 1rem .85rem 2.75rem;border:1px solid var(--card-border);border-radius:12px;background:var(--card-bg);font-size:.9rem;color:var(--text-main)}
.users-search-input-wrapper input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,0.15)}

.users-list-container{max-height:400px;overflow-y:auto;padding:.25rem}
.loading-users{text-align:center;padding:2rem;color:var(--text-soft)}

.user-card{display:flex;align-items:center;gap:.9rem;padding:.85rem;background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;margin-bottom:.6rem;cursor:pointer;transition:all .2s}
.user-card:hover{border-color:#3b82f6;box-shadow:0 4px 12px rgba(59,130,246,0.15);transform:translateX(4px)}
.user-avatar{width:50px;height:50px;border-radius:50%;background:linear-gradient(135deg,#3b82f6,#8b5cf6);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}
.user-avatar i{font-size:1.5rem;color:#fff}
.user-avatar img{width:100%;height:100%;object-fit:cover}
.user-info{flex:1;min-width:0}
.user-name{font-weight:600;font-size:.95rem;color:var(--text-main);margin-bottom:.15rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-meta{display:flex;align-items:center;gap:.75rem;font-size:.75rem;color:var(--text-soft)}
.user-meta span{display:flex;align-items:center;gap:.25rem}
.user-level-badge{padding:.2rem .5rem;border-radius:6px;font-size:.7rem;font-weight:600}
.user-level-badge.bronze{background:rgba(180,83,9,0.15);color:#b45309}
.user-level-badge.silver{background:rgba(107,114,128,0.15);color:#4b5563}
.user-level-badge.gold{background:rgba(234,179,8,0.15);color:#ca8a04}
.user-level-badge.platinum{background:rgba(168,85,247,0.15);color:#9333ea}
.user-level-badge.diamond{background:rgba(59,130,246,0.15);color:#2563eb}

.users-pagination{display:flex;justify-content:center;gap:.5rem;margin-top:1rem}
.page-btn{padding:.5rem .85rem;border:1px solid var(--card-border);border-radius:8px;background:var(--card-bg);color:var(--text-main);font-size:.85rem;cursor:pointer}
.page-btn.active{background:#3b82f6;color:#fff;border-color:#3b82f6}
.page-btn:hover:not(.active){background:var(--surface-soft)}

/* View User Profile Modal */
.view-user-profile-modal{max-width:400px;padding:0;overflow:hidden}
.view-profile-header{display:flex;flex-direction:column;align-items:center;gap:.75rem;padding:1.5rem 1rem 1rem;background:linear-gradient(135deg,#3b82f6 0%,#8b5cf6 50%,#ec4899 100%);position:relative}
.view-profile-header::after{content:'';position:absolute;bottom:-20px;left:0;right:0;height:40px;background:var(--card-bg);border-radius:20px 20px 0 0}
.view-profile-avatar{width:100px;height:100px;border-radius:50%;background:linear-gradient(135deg,#fff,#f1f5f9);display:flex;align-items:center;justify-content:center;overflow:hidden;border:4px solid #fff;box-shadow:0 8px 25px rgba(0,0,0,0.25);position:relative;z-index:1}
.view-profile-avatar i{font-size:2.8rem;color:#64748b}
.view-profile-avatar img{width:100%;height:100%;object-fit:cover}
.view-profile-name{font-size:1.25rem;font-weight:700;color:#fff;text-align:center;text-shadow:0 2px 4px rgba(0,0,0,0.2);position:relative;z-index:1}
.view-profile-role{font-size:.75rem;color:rgba(255,255,255,0.95);text-transform:capitalize;background:rgba(255,255,255,0.2);padding:.35rem 1rem;border-radius:999px;position:relative;z-index:1;white-space:nowrap;max-width:95%;text-align:center;backdrop-filter:blur(8px)}
.view-profile-body{padding:1.5rem 1rem 1rem}
.view-profile-stats{display:flex;justify-content:center;gap:.5rem;margin-bottom:1.25rem}
.view-profile-stat{text-align:center;flex:1;padding:.75rem .5rem;background:linear-gradient(135deg,rgba(59,130,246,0.08),rgba(139,92,246,0.08));border-radius:12px;border:1px solid rgba(59,130,246,0.15)}
.view-profile-stat-value{font-size:1.4rem;font-weight:800;background:linear-gradient(135deg,#3b82f6,#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.view-profile-stat-label{font-size:.65rem;color:var(--text-soft);text-transform:uppercase;font-weight:600;letter-spacing:.5px;margin-top:.15rem}

/* Level-based stat colors */
.view-profile-stat.level-bronze{background:linear-gradient(135deg,rgba(180,83,9,0.1),rgba(217,119,6,0.12));border-color:rgba(180,83,9,0.25)}
.view-profile-stat.level-bronze .view-profile-stat-value{background:linear-gradient(135deg,#b45309,#d97706);-webkit-background-clip:text;background-clip:text}
.view-profile-stat.level-silver{background:linear-gradient(135deg,rgba(107,114,128,0.1),rgba(156,163,175,0.12));border-color:rgba(107,114,128,0.25)}
.view-profile-stat.level-silver .view-profile-stat-value{background:linear-gradient(135deg,#4b5563,#6b7280);-webkit-background-clip:text;background-clip:text}
.view-profile-stat.level-gold{background:linear-gradient(135deg,rgba(234,179,8,0.1),rgba(250,204,21,0.12));border-color:rgba(234,179,8,0.25)}
.view-profile-stat.level-gold .view-profile-stat-value{background:linear-gradient(135deg,#ca8a04,#eab308);-webkit-background-clip:text;background-clip:text}
.view-profile-stat.level-platinum{background:linear-gradient(135deg,rgba(168,85,247,0.1),rgba(192,132,252,0.12));border-color:rgba(168,85,247,0.25)}
.view-profile-stat.level-platinum .view-profile-stat-value{background:linear-gradient(135deg,#9333ea,#a855f7);-webkit-background-clip:text;background-clip:text}
.view-profile-stat.level-diamond{background:linear-gradient(135deg,rgba(59,130,246,0.1),rgba(96,165,250,0.12));border-color:rgba(59,130,246,0.25)}
.view-profile-stat.level-diamond .view-profile-stat-value{background:linear-gradient(135deg,#2563eb,#3b82f6);-webkit-background-clip:text;background-clip:text}

/* Streak-based colors */
.view-profile-stat.streak-low{background:linear-gradient(135deg,rgba(107,114,128,0.1),rgba(156,163,175,0.12));border-color:rgba(107,114,128,0.2)}
.view-profile-stat.streak-low .view-profile-stat-value{background:linear-gradient(135deg,#6b7280,#9ca3af);-webkit-background-clip:text;background-clip:text}
.view-profile-stat.streak-medium{background:linear-gradient(135deg,rgba(59,130,246,0.1),rgba(96,165,250,0.12));border-color:rgba(59,130,246,0.25)}
.view-profile-stat.streak-medium .view-profile-stat-value{background:linear-gradient(135deg,#3b82f6,#60a5fa);-webkit-background-clip:text;background-clip:text}
.view-profile-stat.streak-high{background:linear-gradient(135deg,rgba(234,179,8,0.12),rgba(250,204,21,0.15));border-color:rgba(234,179,8,0.3)}
.view-profile-stat.streak-high .view-profile-stat-value{background:linear-gradient(135deg,#ca8a04,#fbbf24);-webkit-background-clip:text;background-clip:text}
.view-profile-stat.streak-fire{background:linear-gradient(135deg,rgba(239,68,68,0.12),rgba(249,115,22,0.15));border-color:rgba(239,68,68,0.3)}
.view-profile-stat.streak-fire .view-profile-stat-value{background:linear-gradient(135deg,#ef4444,#f97316);-webkit-background-clip:text;background-clip:text}
.view-profile-details{display:flex;flex-direction:column;gap:.5rem}
.view-profile-item{display:flex;align-items:center;gap:.75rem;padding:.7rem 1rem;background:var(--surface-soft);border-radius:12px;border:1px solid var(--card-border);transition:all .2s}
.view-profile-item:hover{border-color:rgba(59,130,246,0.3);background:rgba(59,130,246,0.03)}
.view-profile-item i{width:20px;font-size:.9rem;color:#3b82f6;text-align:center}
.view-profile-item span{font-size:.85rem;color:var(--text-main)}
.view-profile-item .label{color:var(--text-soft);min-width:55px;font-size:.75rem;font-weight:600;text-transform:uppercase}
.view-profile-item a.profile-link{color:#3b82f6;text-decoration:none;font-weight:600;transition:color .2s}
.view-profile-item a.profile-link:hover{color:#8b5cf6;text-decoration:underline}

.no-users-found{text-align:center;padding:2rem;color:var(--text-soft)}
.no-users-found i{font-size:2.5rem;margin-bottom:.75rem;opacity:.5}

/* Dark mode for profile/users */
body.dark-mode .profile-field{background:rgba(30,41,59,0.6)}
body.dark-mode .change-avatar-btn{background:rgba(30,41,59,0.8);border-color:rgba(148,163,184,0.3);color:#e5e7eb}
body.dark-mode .user-card{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2)}
body.dark-mode .users-search-input-wrapper input{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.3)}
body.dark-mode .page-btn{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.3)}
body.dark-mode .view-profile-item{background:rgba(30,41,59,0.6)}

/* Professional Library Document Styling */
.library-doc-list{display:flex;flex-direction:column;gap:.6rem}
.library-doc-item{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--card-bg);border:1px solid var(--card-border);border-radius:14px;cursor:pointer;transition:all .25s}
.library-doc-item:hover{border-color:#3b82f6;box-shadow:0 6px 20px rgba(59,130,246,0.12);transform:translateY(-2px)}
.library-doc-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex-shrink:0;background:linear-gradient(135deg,#3b82f6 0%,#8b5cf6 100%);color:#fff;overflow:hidden}
.library-doc-info{flex:1;min-width:0}
.library-doc-title{font-weight:600;font-size:.9rem;color:var(--text-main);margin-bottom:.2rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.library-doc-desc{font-size:.75rem;color:var(--text-soft)}
.library-doc-action{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(59,130,246,0.1),rgba(139,92,246,0.1));color:#3b82f6;font-size:.9rem;flex-shrink:0;transition:all .2s}
.library-doc-item:hover .library-doc-action{background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff}

/* Library document icons by type */
.library-doc-icon.csm{background:linear-gradient(135deg,#f97316,#ea580c)}
.library-doc-icon.tbt{background:linear-gradient(135deg,#22c55e,#16a34a)}
.library-doc-icon.jsa{background:linear-gradient(135deg,#ef4444,#dc2626)}
.library-doc-icon.walkthrough{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}

/* Position/Role badge in admin */
.position-select{width:100%;padding:.5rem;border:1px solid var(--card-border);border-radius:8px;background:var(--card-bg);color:var(--text-main);font-size:.85rem;cursor:pointer}
.position-select:focus{outline:none;border-color:#3b82f6}
.user-position{font-size:.7rem;color:#8b5cf6;font-weight:500;display:inline-block;margin-left:.35rem}

/* Header notification dots */
.news-toggle,.inbox-toggle{position:relative}
.inbox-toggle{width:38px;height:38px;border-radius:999px;border:2px solid rgba(255,255,255,0.5);background:rgba(15,23,42,0.25);display:flex;align-items:center;justify-content:center;color:#ffeaa7;cursor:pointer;transition:transform .2s,box-shadow .2s}
.inbox-toggle:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(0,0,0,0.35)}
.header-dot{position:absolute;top:4px;right:4px;width:10px;height:10px;border-radius:50%;background:#ef4444;border:2px solid #fff;animation:pulse-dot 1.5s infinite}
@keyframes pulse-dot{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.8}}

/* Inbox Modal Styles */
.inbox-modal{max-width:500px}
.inbox-tabs{display:flex;gap:.5rem;margin-bottom:1rem}
.inbox-tab{flex:1;padding:.6rem;border:none;background:rgba(148,163,184,0.2);border-radius:999px;cursor:pointer;font-weight:600;font-size:.85rem;transition:all .2s}
.inbox-tab.active{background:linear-gradient(90deg,var(--primary-start),var(--primary-end));color:#fff}
.inbox-container{max-height:400px;overflow-y:auto}
.loading-inbox{text-align:center;padding:2rem;color:var(--text-soft)}
.loading-inbox i{font-size:1.5rem;margin-bottom:.5rem}

/* Task Request Cards */
.task-request-card{background:var(--surface-soft);border:1px solid var(--card-border);border-radius:14px;padding:1rem;margin-bottom:.75rem;transition:all .2s;position:relative}
.task-request-card:hover{border-color:#3b82f6;box-shadow:0 4px 15px rgba(59,130,246,0.1)}
.task-request-card.unread{border-left:4px solid #ef4444;background:linear-gradient(90deg,rgba(239,68,68,0.05),transparent)}
.task-request-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.5rem}
.task-request-sender{font-weight:600;font-size:.9rem;color:var(--text-main)}
.task-request-time{font-size:.7rem;color:var(--text-soft)}
.task-request-message{font-size:.85rem;color:var(--text-main);line-height:1.4;margin-bottom:.75rem;padding:.75rem;background:var(--card-bg);border-radius:10px;border:1px solid var(--card-border)}
.task-request-status{display:inline-flex;align-items:center;gap:.35rem;padding:.3rem .7rem;border-radius:999px;font-size:.7rem;font-weight:600}
.task-request-status.status-pending{background:rgba(234,179,8,0.15);color:#b45309}
.task-request-status.status-in_progress{background:rgba(59,130,246,0.15);color:#2563eb}
.task-request-status.status-completed{background:rgba(34,197,94,0.15);color:#15803d}
.task-request-actions{display:flex;gap:.5rem;margin-top:.75rem}
.task-respond-btn{flex:1;padding:.55rem;border-radius:10px;border:none;background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff;font-size:.8rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.4rem;transition:all .2s}
.task-respond-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(59,130,246,0.3)}
.task-respond-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.task-response-section{margin-top:.75rem;padding:.75rem;background:rgba(34,197,94,0.08);border-radius:10px;border:1px solid rgba(34,197,94,0.2)}
.task-response-label{font-size:.7rem;color:#15803d;font-weight:600;text-transform:uppercase;margin-bottom:.35rem}
.task-response-text{font-size:.85rem;color:var(--text-main)}
.task-response-attachment{margin-top:.5rem}
.task-response-attachment a{color:#3b82f6;font-size:.8rem;text-decoration:none;display:flex;align-items:center;gap:.3rem}
.task-response-attachment a:hover{text-decoration:underline}

/* Send Task Button */
.send-task-btn{width:100%;padding:.75rem;margin-top:1rem;border-radius:12px;border:none;background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;font-size:.9rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .2s}
.send-task-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(34,197,94,0.35)}

/* Send Task Modal */
.send-task-modal{max-width:450px}
.send-task-modal .form-group{margin-bottom:1rem}
.send-task-modal .form-group label{display:flex;align-items:center;gap:.4rem;font-weight:600;margin-bottom:.5rem;font-size:.85rem}
.send-task-modal .form-group label i{color:#3b82f6}
.send-task-modal select,.send-task-modal textarea{width:100%;padding:.75rem;border:1px solid var(--card-border);border-radius:12px;font-size:.9rem;background:var(--card-bg);color:var(--text-main)}
.send-task-modal select:focus,.send-task-modal textarea:focus{outline:none;border-color:#3b82f6}
.submit-task-btn{width:100%;padding:.85rem;border-radius:12px;border:none;background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff;font-size:.95rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .2s}
.submit-task-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(59,130,246,0.35)}

/* Task Response Modal */
.task-response-modal{max-width:450px}
.task-response-modal #taskResponseDetails{background:var(--surface-soft);border-radius:12px;padding:1rem;margin-bottom:1rem;border:1px solid var(--card-border)}
.task-response-modal .form-group{margin-bottom:1rem}
.task-response-modal .form-group label{display:flex;align-items:center;gap:.4rem;font-weight:600;margin-bottom:.5rem;font-size:.85rem}
.task-response-modal .form-group label i{color:#3b82f6}
.task-response-modal textarea,.task-response-modal input[type="file"]{width:100%;padding:.75rem;border:1px solid var(--card-border);border-radius:12px;font-size:.9rem;background:var(--card-bg);color:var(--text-main)}
.submit-response-btn{width:100%;padding:.85rem;border-radius:12px;border:none;background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;font-size:.95rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .2s}
.submit-response-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(34,197,94,0.35)}

/* Empty inbox states */
.empty-inbox{text-align:center;padding:3rem 1rem;color:var(--text-soft)}
.empty-inbox i{font-size:3rem;margin-bottom:1rem;opacity:.4}
.empty-inbox p{font-size:.95rem}

/* Dark mode inbox */
body.dark-mode .task-request-card{background:rgba(30,41,59,0.6)}
body.dark-mode .task-request-message{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2)}
body.dark-mode .task-response-section{background:rgba(34,197,94,0.1);border-color:rgba(34,197,94,0.25)}
body.dark-mode .inbox-tab{background:rgba(148,163,184,0.15)}
body.dark-mode .send-task-modal select,body.dark-mode .send-task-modal textarea,body.dark-mode .task-response-modal textarea,body.dark-mode .task-response-modal input[type="file"]{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.3)}

/* ========== HAND SIGNALS REFERENCE GUIDE ========== */
.signal-category-tabs{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap}
.signal-tab{padding:.6rem 1rem;border-radius:20px;border:1px solid var(--card-border);background:var(--card-bg);font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s}
.signal-tab.active{background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff;border-color:transparent}
.signal-cards-grid{display:flex;flex-direction:column;gap:.75rem}
.signal-card{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--card-bg);border-radius:12px;border:1px solid var(--card-border);cursor:pointer;transition:all .2s}
.signal-card:hover{transform:translateX(4px);box-shadow:0 4px 15px rgba(0,0,0,0.1)}
.signal-icon{width:50px;height:50px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;flex-shrink:0;overflow:hidden}
.signal-info{flex:1;min-width:0}
.signal-name{font-weight:700;font-size:.95rem;margin-bottom:.25rem;color:var(--text-main)}
.signal-desc{font-size:.8rem;color:var(--text-soft);line-height:1.4}
.signal-print-btn{width:36px;height:36px;border-radius:10px;border:1px solid var(--card-border);background:var(--surface-soft);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;color:var(--text-soft)}
.signal-print-btn:hover{background:#3b82f6;color:#fff;border-color:#3b82f6}
.print-all-section{margin-top:1.5rem;text-align:center}

/* ========== FIRST AID RESPONSE GUIDE ========== */
.first-aid-category-tabs{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap}
.fa-tab{padding:.6rem 1rem;border-radius:20px;border:1px solid var(--card-border);background:var(--card-bg);font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s}
.fa-tab.active{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border-color:transparent}
.first-aid-scenarios-grid{display:flex;flex-direction:column;gap:.75rem}
.fa-scenario-card{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--card-bg);border-radius:12px;border:1px solid var(--card-border);cursor:pointer;transition:all .2s}
.fa-scenario-card:hover{transform:translateX(4px);box-shadow:0 4px 15px rgba(0,0,0,0.1)}
.fa-scenario-icon{width:50px;height:50px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;flex-shrink:0;overflow:hidden}
.fa-scenario-info{flex:1}
.fa-scenario-name{font-weight:700;font-size:.95rem;margin-bottom:.2rem;color:var(--text-main)}
.fa-scenario-steps{font-size:.75rem;color:var(--text-soft)}
.fa-scenario-arrow{color:var(--text-soft);font-size:.9rem}
.fa-detail-modal{position:fixed;inset:0;background:rgba(15,23,42,0.85);z-index:200;display:flex;align-items:center;justify-content:center;padding:1rem;backdrop-filter:blur(4px)}
.fa-detail-content{background:var(--card-bg);border-radius:20px;width:100%;max-width:500px;max-height:85vh;overflow-y:auto;position:relative}
.fa-detail-close{position:absolute;top:1rem;right:1rem;width:36px;height:36px;border-radius:50%;border:none;background:rgba(255,255,255,0.2);color:#fff;cursor:pointer;font-size:1rem;z-index:10}
.fa-detail-header{padding:2rem 1.5rem 1.5rem;color:#fff;display:flex;flex-direction:column;align-items:center;text-align:center;gap:.75rem}
.fa-detail-header i{font-size:3rem}
.fa-detail-header h3{font-size:1.2rem;font-weight:700}
.fa-detail-body{padding:1.5rem}
.fa-detail-body h4{font-size:.9rem;font-weight:700;margin-bottom:.75rem;display:flex;align-items:center;gap:.5rem;color:var(--text-main)}
.fa-steps-list{list-style:none;counter-reset:steps;margin-bottom:1.5rem}
.fa-steps-list li{counter-increment:steps;padding:.75rem;padding-left:3rem;position:relative;background:var(--surface-soft);border-radius:10px;margin-bottom:.5rem;font-size:.9rem;line-height:1.5}
.fa-steps-list li::before{content:counter(steps);position:absolute;left:.75rem;top:50%;transform:translateY(-50%);width:24px;height:24px;background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700}
.fa-warnings-list{list-style:none}
.fa-warnings-list li{padding:.75rem 1rem .75rem 2.5rem;position:relative;background:#fef3c7;border-radius:10px;margin-bottom:.5rem;font-size:.85rem;border-left:4px solid #f59e0b}
.fa-warnings-list li .warning-icon{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);color:#f59e0b;font-size:.8rem}

/* ========== SAFETY LIMITS QUICK REFERENCE ========== */
.limits-search-box{position:relative;margin-bottom:1rem}
.limits-search-box i{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--text-soft)}
.limits-search-box input{width:100%;padding:.75rem 1rem .75rem 2.5rem;border:1px solid var(--card-border);border-radius:12px;font-size:.9rem;background:var(--card-bg)}
.limits-category-tabs{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap}
.limits-tab{padding:.5rem .85rem;border-radius:20px;border:1px solid var(--card-border);background:var(--card-bg);font-size:.8rem;font-weight:600;cursor:pointer;transition:all .2s}
.limits-tab.active{background:linear-gradient(135deg,#3b82f6,#0ea5e9);color:#fff;border-color:transparent}
.safety-limits-grid{display:grid;gap:.75rem}
.safety-limit-card{padding:1rem;background:var(--card-bg);border-radius:12px;border:1px solid var(--card-border)}
.limit-category-tag{display:inline-block;padding:.2rem .6rem;border-radius:8px;font-size:.7rem;font-weight:600;text-transform:uppercase;margin-bottom:.5rem}
.limit-title{font-weight:700;font-size:.95rem;color:var(--text-main);margin-bottom:.35rem}
.limit-value{font-size:1.4rem;font-weight:800;color:#3b82f6;margin-bottom:.35rem}
.limit-detail{font-size:.85rem;color:var(--text-soft);line-height:1.5;margin-bottom:.5rem}
.limit-source{font-size:.75rem;color:var(--text-soft);display:flex;align-items:center;gap:.35rem;opacity:.7}

/* ========== ADAPTIVE LEARNING MODE ========== */
.adaptive-stats{display:flex;gap:1rem;margin-bottom:1.5rem}
.adaptive-stat{flex:1;text-align:center;padding:1rem;background:linear-gradient(135deg,#3b82f6,#8b5cf6);border-radius:14px;color:#fff}
.adaptive-stat .stat-num{display:block;font-size:1.8rem;font-weight:800}
.adaptive-stat .stat-label{font-size:.75rem;opacity:.9}
.adaptive-drill-container h4{font-size:.95rem;font-weight:700;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}
.adaptive-question-card{display:flex;gap:1rem;padding:1rem;background:var(--card-bg);border-radius:12px;border:1px solid var(--card-border);margin-bottom:.75rem}
.aq-number{width:32px;height:32px;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem;flex-shrink:0}
.aq-content{flex:1}
.aq-text{font-size:.9rem;font-weight:600;margin-bottom:.75rem;color:var(--text-main);line-height:1.5}
.aq-options{display:grid;gap:.5rem}
.aq-option{padding:.65rem 1rem;background:var(--surface-soft);border-radius:10px;font-size:.85rem;cursor:pointer;transition:all .2s;border:2px solid transparent}
.aq-option:hover{background:#e0f2fe;border-color:#3b82f6}
.aq-option.correct{background:#dcfce7;border-color:#22c55e;color:#15803d}
.aq-option.incorrect{background:#fee2e2;border-color:#ef4444;color:#dc2626}
.adaptive-empty-state{text-align:center;padding:3rem 1.5rem;background:var(--surface-soft);border-radius:16px}
.adaptive-empty-state i{font-size:3rem;color:#8b5cf6;margin-bottom:1rem}
.adaptive-empty-state h4{font-size:1.1rem;font-weight:700;margin-bottom:.5rem}
.adaptive-empty-state p{font-size:.9rem;color:var(--text-soft);margin-bottom:1.5rem}

/* ========== SAFETY SIGNS REFERENCE - Professional Styling ========== */
/* Design Tokens */
:root{--signs-primary:#0369a1;--signs-primary-light:#0ea5e9;--signs-primary-dark:#075985;--signs-accent:#06b6d4;--signs-surface:#f8fafc;--signs-surface-elevated:#ffffff;--signs-border:#e2e8f0;--signs-shadow-sm:0 1px 3px rgba(0,0,0,0.08);--signs-shadow-md:0 4px 12px rgba(0,0,0,0.1);--signs-shadow-lg:0 8px 30px rgba(0,0,0,0.15);--signs-shadow-xl:0 20px 50px rgba(0,0,0,0.2);--signs-radius-sm:8px;--signs-radius-md:12px;--signs-radius-lg:16px;--signs-radius-xl:24px;--signs-radius-full:9999px;--signs-spacing-xs:0.25rem;--signs-spacing-sm:0.5rem;--signs-spacing-md:1rem;--signs-spacing-lg:1.5rem;--signs-spacing-xl:2rem}

/* Category Filter Pills - Horizontal Scrollable */
.signs-category-tabs{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:nowrap;overflow-x:auto;padding:.5rem;background:linear-gradient(135deg,#f1f5f9 0%,#e2e8f0 100%);border-radius:var(--signs-radius-md);border:1px solid var(--signs-border);-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.signs-category-tabs::-webkit-scrollbar{height:4px}
.signs-category-tabs::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}
.signs-tab{padding:.45rem .85rem;border-radius:var(--signs-radius-full);border:1px solid transparent;background:var(--signs-surface-elevated);font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s;color:#475569;white-space:nowrap;flex-shrink:0}
.signs-tab:hover{background:#e0f2fe;border-color:#0ea5e9}
.signs-tab.active{background:linear-gradient(135deg,var(--signs-primary) 0%,var(--signs-primary-light) 100%);color:#fff;border-color:transparent;box-shadow:0 2px 8px rgba(3,105,161,0.3)}

/* Professional Header - Grid Row Layout */
.signs-header{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1rem;margin-bottom:1rem;padding:.85rem 1rem;background:linear-gradient(135deg,#0369a1 0%,#0ea5e9 100%);border-radius:var(--signs-radius-md);box-shadow:var(--signs-shadow-md)}
@media(max-width:768px){.signs-header{grid-template-columns:1fr;gap:.75rem}}
.signs-header-info{display:flex;align-items:center;gap:.75rem}
.signs-header-info i{font-size:1.5rem;color:#fff}
.signs-header-text{display:flex;align-items:center;gap:.5rem}
.signs-header-text h3{font-size:1.1rem;font-weight:700;color:#fff;margin:0}
.signs-count{font-size:.75rem;color:#fff;font-weight:600;background:rgba(255,255,255,0.2);padding:.25rem .6rem;border-radius:var(--signs-radius-full)}

/* Header Search - Embedded */
.signs-header-search{position:relative;max-width:280px;width:100%}
@media(max-width:768px){.signs-header-search{max-width:100%}}
.signs-header-search i{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);color:rgba(255,255,255,0.7);font-size:.85rem}
.signs-header-search input{width:100%;padding:.55rem .75rem .55rem 2.25rem;border:1px solid rgba(255,255,255,0.3);border-radius:var(--signs-radius-full);font-size:.85rem;background:rgba(255,255,255,0.15);color:#fff;transition:all .2s}
.signs-header-search input::placeholder{color:rgba(255,255,255,0.6)}
.signs-header-search input:focus{outline:none;background:rgba(255,255,255,0.25);border-color:rgba(255,255,255,0.5)}

/* Refined Pagination - Compact */
.signs-pagination{display:flex;align-items:center;gap:.4rem}
.signs-pagination span{font-size:.8rem;font-weight:600;color:#fff;padding:0 .25rem}
.signs-pagination button{width:32px;height:32px;border-radius:50%;border:none;font-size:.8rem;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}
.signs-pagination button:not(:disabled){background:rgba(255,255,255,0.9);color:var(--signs-primary)}
.signs-pagination button:not(:disabled):hover{background:#fff;transform:scale(1.1)}
.signs-pagination button:disabled{background:rgba(255,255,255,0.2);color:rgba(255,255,255,0.4);cursor:not-allowed}

/* Enhanced Card Grid */
.safety-signs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.25rem}
@media(max-width:640px){.safety-signs-grid{grid-template-columns:repeat(2,1fr);gap:1rem}}
@media(max-width:420px){.safety-signs-grid{grid-template-columns:1fr}}

/* Professional Sign Cards with 3D Shadow & Hover Lift */
.safety-sign-card{background:var(--signs-surface-elevated);border-radius:var(--signs-radius-lg);border:1px solid var(--signs-border);padding:0;text-align:center;cursor:pointer;transition:all .3s cubic-bezier(0.4,0,0.2,1);overflow:hidden;box-shadow:var(--signs-shadow-md);position:relative}
.safety-sign-card::after{content:'';position:absolute;inset:0;border-radius:var(--signs-radius-lg);box-shadow:inset 0 -1px 0 rgba(0,0,0,0.05);pointer-events:none}
.safety-sign-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:var(--signs-shadow-xl);border-color:var(--signs-primary-light)}
.safety-sign-card:active{transform:translateY(-4px) scale(1.01)}

/* Card Image Container with Overlay Badge */
.sign-image-container{width:100%;aspect-ratio:1;overflow:hidden;background:linear-gradient(145deg,#f8fafc 0%,#e2e8f0 100%);display:flex;align-items:center;justify-content:center;padding:1rem;position:relative}
.sign-image-container img{max-width:90%;max-height:90%;object-fit:contain;border-radius:var(--signs-radius-sm);transition:transform .4s cubic-bezier(0.4,0,0.2,1);filter:drop-shadow(0 4px 8px rgba(0,0,0,0.1))}
.safety-sign-card:hover .sign-image-container img{transform:scale(1.08)}

/* Top-Left Overlay Category Badge */
.sign-category-badge{position:absolute;top:.75rem;left:.75rem;padding:.3rem .65rem;border-radius:var(--signs-radius-sm);font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.4px;box-shadow:var(--signs-shadow-sm);z-index:2;backdrop-filter:blur(4px)}

/* Sign Name Styling */
.sign-name{font-size:.9rem;font-weight:700;color:var(--text-main);line-height:1.35;padding:.75rem 1rem 1rem;background:var(--signs-surface-elevated);border-top:1px solid rgba(0,0,0,0.04)}

/* Detail Modal with Glassmorphism */
.sign-detail-modal{position:fixed;inset:0;background:rgba(15,23,42,0.75);z-index:200;display:flex;align-items:center;justify-content:center;padding:1.5rem;backdrop-filter:blur(8px);animation:fadeIn .25s ease-out}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.sign-detail-content{background:var(--signs-surface-elevated);border-radius:var(--signs-radius-xl);width:100%;max-width:560px;max-height:90vh;overflow-y:auto;position:relative;text-align:center;padding:0;box-shadow:var(--signs-shadow-xl);animation:slideUp .3s ease-out;border:1px solid rgba(255,255,255,0.1)}
@keyframes slideUp{from{opacity:0;transform:translateY(20px) scale(0.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.sign-detail-close{position:absolute;top:1.25rem;right:1.25rem;width:44px;height:44px;border-radius:50%;border:none;background:rgba(255,255,255,0.95);color:#475569;cursor:pointer;font-size:1.2rem;z-index:10;box-shadow:var(--signs-shadow-md);transition:all .25s;display:flex;align-items:center;justify-content:center}
.sign-detail-close:hover{background:#fff;transform:scale(1.1) rotate(90deg);color:#dc2626}
.sign-detail-image-box{background:linear-gradient(135deg,#0369a1 0%,#0ea5e9 50%,#06b6d4 100%);padding:2.5rem;border-radius:var(--signs-radius-xl) var(--signs-radius-xl) 0 0;position:relative;overflow:hidden}
.sign-detail-image-box::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 30% 70%,rgba(255,255,255,0.15) 0%,transparent 50%)}
.sign-detail-image-box img{max-width:100%;max-height:55vh;object-fit:contain;border-radius:var(--signs-radius-md);box-shadow:var(--signs-shadow-lg);background:#fff;padding:.5rem;position:relative;z-index:1}
.sign-detail-info{padding:2rem}
.sign-detail-name{font-size:1.5rem;font-weight:800;margin-bottom:1.25rem;color:var(--text-main);letter-spacing:-0.02em}
.sign-detail-category{display:inline-block;padding:.4rem 1rem;border-radius:var(--signs-radius-full);font-size:.8rem;font-weight:700;text-transform:uppercase;margin-bottom:1.25rem;letter-spacing:.5px}
.sign-detail-meaning{font-size:.95rem;color:var(--text-soft);line-height:1.7;padding:1.25rem 1.5rem;background:linear-gradient(135deg,#f8fafc 0%,#f1f5f9 100%);border-radius:var(--signs-radius-md);text-align:left;border:1px solid var(--signs-border)}

/* Dark mode for new tools */
body.dark-mode .signal-card,body.dark-mode .fa-scenario-card,body.dark-mode .safety-limit-card,body.dark-mode .adaptive-question-card{background:rgba(30,41,59,0.6);border-color:rgba(148,163,184,0.2)}
body.dark-mode .signal-tab,body.dark-mode .fa-tab,body.dark-mode .limits-tab{background:rgba(30,41,59,0.6);border-color:rgba(148,163,184,0.2);color:#e5e7eb}
body.dark-mode .limits-search-box input{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.3);color:#e5e7eb}
body.dark-mode .fa-detail-content{background:#1e293b}
body.dark-mode .fa-steps-list li{background:rgba(30,41,59,0.8)}
body.dark-mode .fa-warnings-list li{background:rgba(251,191,36,0.15);border-color:#f59e0b}
body.dark-mode .aq-option{background:rgba(30,41,59,0.6)}
body.dark-mode .aq-option:hover{background:rgba(59,130,246,0.2)}
body.dark-mode .adaptive-empty-state{background:rgba(30,41,59,0.6)}

/* Dark mode - Safety Signs Professional */
body.dark-mode .signs-category-tabs{background:linear-gradient(135deg,rgba(30,41,59,0.8) 0%,rgba(15,23,42,0.9) 100%);border-color:rgba(148,163,184,0.2)}
body.dark-mode .signs-category-tabs::-webkit-scrollbar-thumb{background:#475569}
body.dark-mode .signs-tab{background:rgba(51,65,85,0.8);color:#e5e7eb;border-color:rgba(148,163,184,0.2)}
body.dark-mode .signs-tab:hover{background:rgba(14,165,233,0.2);border-color:rgba(14,165,233,0.5)}
body.dark-mode .signs-header-search input{background:rgba(255,255,255,0.1);border-color:rgba(255,255,255,0.2)}
body.dark-mode .safety-sign-card{background:rgba(30,41,59,0.9);border-color:rgba(148,163,184,0.15)}
body.dark-mode .safety-sign-card:hover{border-color:#0ea5e9}
body.dark-mode .sign-image-container{background:linear-gradient(145deg,rgba(51,65,85,0.6) 0%,rgba(30,41,59,0.8) 100%)}
body.dark-mode .sign-name{background:rgba(30,41,59,0.95);border-top-color:rgba(148,163,184,0.1)}
body.dark-mode .sign-detail-content{background:#1e293b;border-color:rgba(148,163,184,0.2)}
body.dark-mode .sign-detail-close{background:rgba(51,65,85,0.95);color:#e5e7eb}
body.dark-mode .sign-detail-close:hover{background:#334155;color:#f87171}
body.dark-mode .sign-detail-image-box img{background:rgba(51,65,85,0.8)}
body.dark-mode .sign-detail-meaning{background:linear-gradient(135deg,rgba(30,41,59,0.8) 0%,rgba(15,23,42,0.9) 100%);border-color:rgba(148,163,184,0.2)}

/* ========== LOCATIONS MAP TOOL - Professional Design ========== */
.locations-map-container{background:var(--card-bg);border-radius:20px;padding:0;margin-bottom:1.5rem;border:1px solid var(--card-border);box-shadow:0 10px 40px rgba(15,23,42,0.08);overflow:hidden}
.locations-map-header{background:linear-gradient(135deg,#0369a1 0%,#0ea5e9 50%,#38bdf8 100%);padding:1rem 1.25rem;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1rem}
.locations-map-header h3{font-size:1.1rem;font-weight:800;color:#fff;display:flex;align-items:center;gap:.6rem;margin:0;text-shadow:0 2px 4px rgba(0,0,0,0.15)}
.locations-map-header h3 i{font-size:1.3rem;filter:drop-shadow(0 2px 3px rgba(0,0,0,0.2))}
.locations-map-stats{display:flex;gap:.75rem;justify-content:center}
.locations-map-stat{background:rgba(255,255,255,0.2);backdrop-filter:blur(4px);padding:.35rem .75rem;border-radius:20px;display:flex;align-items:center;gap:.4rem;font-size:.75rem;font-weight:600;color:#fff}
.locations-map-stat i{font-size:.7rem;opacity:.9}
.locations-map-actions{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;justify-content:flex-end}
.locations-print-btn{padding:.5rem 1rem;background:rgba(255,255,255,0.2);backdrop-filter:blur(4px);color:#fff;border:1px solid rgba(255,255,255,0.3);border-radius:10px;font-size:.8rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.4rem;transition:all .2s}
.locations-print-btn:hover{background:rgba(255,255,255,0.35);transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,0.2)}

/* Map Drawing Toolbar */
.map-toolbar{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;background:linear-gradient(180deg,#f8fafc 0%,#f1f5f9 100%);border-bottom:1px solid rgba(148,163,184,0.2)}
.map-toolbar-group{display:flex;align-items:center;gap:.35rem;padding:.25rem;background:var(--card-bg);border-radius:10px;border:1px solid var(--card-border)}
.map-toolbar-divider{width:1px;height:28px;background:rgba(148,163,184,0.3);margin:0 .5rem}
.map-tool-btn{width:36px;height:36px;border:none;border-radius:8px;background:transparent;color:#64748b;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.9rem;transition:all .15s}
.map-tool-btn:hover{background:rgba(14,165,233,0.1);color:#0ea5e9}
.map-tool-btn.active{background:linear-gradient(135deg,#0ea5e9,#0369a1);color:#fff;box-shadow:0 4px 12px rgba(14,165,233,0.3)}
.map-tool-btn[disabled]{opacity:.4;cursor:not-allowed}
.map-tool-label{font-size:.7rem;font-weight:600;color:var(--text-soft);text-transform:uppercase;letter-spacing:.03em;margin-right:.25rem}

/* Map Container */
.facility-map-wrapper{position:relative;width:100%;overflow-x:auto;background:linear-gradient(145deg,#e0f2fe 0%,#f0f9ff 50%,#ecfeff 100%);padding:1rem;border-radius:0}
.facility-map{position:relative;width:100%;min-width:700px;aspect-ratio:16/10;background:linear-gradient(135deg,#f8fafc 0%,#e2e8f0 100%);border-radius:12px;border:2px solid rgba(148,163,184,0.4);box-shadow:inset 0 2px 8px rgba(0,0,0,0.03),0 8px 24px rgba(15,23,42,0.06)}
.map-location{position:absolute;background:linear-gradient(145deg,rgba(255,255,255,0.98),rgba(248,250,252,0.95));border:1px solid rgba(148,163,184,0.5);border-radius:6px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.55rem;font-weight:700;color:#334155;padding:3px;box-shadow:0 3px 10px rgba(0,0,0,0.08),0 1px 3px rgba(0,0,0,0.06);transition:all .2s;backdrop-filter:blur(2px)}
.map-location:hover{z-index:5;transform:scale(1.03);box-shadow:0 8px 20px rgba(0,0,0,0.12);border-color:#0ea5e9}
.map-location-name{line-height:1.15;word-break:break-word;letter-spacing:-.01em}

/* Map Elements - Roads - Realistic gray with white dashed center line */
.map-road{position:absolute;border-radius:2px;z-index:1;box-shadow:0 2px 4px rgba(0,0,0,0.15)}
.map-road.road-main{height:12px;background:#4b5563;position:relative}
.map-road.road-main::after{content:'';position:absolute;top:50%;left:0;right:0;height:2px;background:repeating-linear-gradient(90deg,#fff 0,#fff 12px,transparent 12px,transparent 20px);transform:translateY(-50%)}
.map-road.road-service{height:8px;background:#6b7280;position:relative}
.map-road.road-service::after{content:'';position:absolute;top:50%;left:0;right:0;height:1px;background:repeating-linear-gradient(90deg,#fff 0,#fff 8px,transparent 8px,transparent 14px);transform:translateY(-50%)}
.map-road.road-walkway{height:4px;background:#9ca3af;position:relative}
.map-road.road-walkway::after{content:'';position:absolute;top:50%;left:0;right:0;height:1px;background:repeating-linear-gradient(90deg,#fff 0,#fff 5px,transparent 5px,transparent 10px);transform:translateY(-50%)}
.map-road-label{position:absolute;background:rgba(255,255,255,0.95);padding:3px 8px;border-radius:4px;font-size:.65rem;font-weight:700;color:#1e293b;white-space:nowrap;left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 2px 6px rgba(0,0,0,0.15);z-index:2;letter-spacing:.02em}
.map-road-arrow{position:absolute;top:50%;transform:translateY(-50%);font-size:10px;font-weight:900;z-index:3;text-shadow:0 1px 2px rgba(0,0,0,0.3)}
.map-road-arrow.arrow-start{left:4px}
.map-road-arrow.arrow-end{right:4px}
.map-road.selected{outline:3px solid #3b82f6;outline-offset:2px}
.road-resize-handle{position:absolute;width:12px;height:12px;background:#3b82f6;border:2px solid #fff;border-radius:50%;cursor:grab;z-index:15;transform:translate(-50%,-50%)}
.road-resize-handle:hover{transform:translate(-50%,-50%) scale(1.2);background:#2563eb}
.road-resize-handle.handle-start{left:0;top:50%}
.road-resize-handle.handle-end{right:0;top:50%;transform:translate(50%,-50%)}
.road-resize-handle.handle-end:hover{transform:translate(50%,-50%) scale(1.2)}
.road-rotate-handle{position:absolute;width:16px;height:16px;background:#f59e0b;border:2px solid #fff;border-radius:50%;cursor:crosshair;z-index:15;top:-20px;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;font-size:8px;color:#fff}

/* Map Elements - Exits */
.map-exit{position:absolute;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;z-index:10}
.map-exit.exit-main{background:linear-gradient(135deg,#22c55e,#16a34a);box-shadow:0 4px 12px rgba(22,197,94,0.4)}
.map-exit.exit-emergency{background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 4px 12px rgba(239,68,68,0.4)}
.map-exit.exit-gate{background:linear-gradient(135deg,#3b82f6,#2563eb);box-shadow:0 4px 12px rgba(59,130,246,0.4)}
.map-exit i{color:#fff;font-size:.9rem}
.map-exit:hover{transform:scale(1.15)}
.map-exit-label{position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:4px;font-size:.6rem;font-weight:600;color:#475569;white-space:nowrap;background:rgba(255,255,255,0.9);padding:2px 6px;border-radius:4px}

/* Map Elements - Zones */
.map-zone{position:absolute;border-radius:8px;z-index:0;opacity:.3;pointer-events:none}
.map-zone.zone-danger{background:repeating-linear-gradient(45deg,#fecaca,#fecaca 10px,#fee2e2 10px,#fee2e2 20px);border:2px solid #ef4444}
.map-zone.zone-safe{background:#dcfce7;border:2px solid #22c55e}
.map-zone.zone-parking{background:repeating-linear-gradient(45deg,#dbeafe,#dbeafe 10px,#eff6ff 10px,#eff6ff 20px);border:2px solid #3b82f6}

/* Map Elements - Landmarks */
.map-landmark{position:absolute;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:8;transition:all .2s}
.map-landmark.landmark-assembly{background:linear-gradient(135deg,#22c55e,#16a34a);box-shadow:0 3px 10px rgba(22,197,94,0.35)}
.map-landmark.landmark-firstaid{background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 3px 10px rgba(239,68,68,0.35)}
.map-landmark.landmark-fire{background:linear-gradient(135deg,#f97316,#ea580c);box-shadow:0 3px 10px rgba(249,115,22,0.35)}
.map-landmark i{color:#fff;font-size:.75rem}
.map-landmark:hover{transform:scale(1.1)}

/* Map Legend */
.map-legend{display:flex;flex-wrap:wrap;gap:.75rem;padding:.75rem 1.25rem;background:linear-gradient(180deg,#f1f5f9 0%,#f8fafc 100%);border-top:1px solid rgba(148,163,184,0.15)}
.map-legend-item{display:flex;align-items:center;gap:.4rem;font-size:.7rem;font-weight:600;color:#64748b}
.map-legend-icon{width:16px;height:16px;border-radius:4px;display:flex;align-items:center;justify-content:center}
.map-legend-icon.legend-road{width:24px;height:4px;background:#475569;border-radius:2px}
.map-legend-icon.legend-exit{background:#22c55e;border-radius:50%}
.map-legend-icon.legend-gate{background:#3b82f6;border-radius:50%}
.map-legend-icon.legend-zone{background:rgba(239,68,68,0.3);border:1px solid #ef4444}
.map-personnel-icons{position:absolute;bottom:1px;right:1px;display:flex;gap:1px;flex-wrap:wrap;max-width:90%;justify-content:flex-end}
.map-icon{width:12px;height:12px;border-radius:50%;cursor:pointer;transition:all .2s;border:1px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,0.2)}
.map-icon:hover{transform:scale(1.2);z-index:10}
.map-icon.so-icon{background:#16a34a}
.map-icon.wpr-icon{background:#dc2626}
.map-icon-count{position:absolute;top:-2px;right:-2px;width:8px;height:8px;background:#1e293b;color:#fff;font-size:.4rem;font-weight:700;border-radius:50%;display:flex;align-items:center;justify-content:center}

.personnel-popup{position:fixed;z-index:100;background:#fff;border-radius:14px;padding:1rem;box-shadow:0 10px 40px rgba(0,0,0,0.25);min-width:260px;max-width:340px;border:1px solid var(--card-border)}
.personnel-popup-scroll{max-height:60vh;overflow-y:auto;padding-right:.25rem}
.personnel-popup-card{margin-bottom:.75rem;padding-bottom:.75rem;border-bottom:1px solid var(--card-border)}
.personnel-popup-card:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}
.personnel-popup-header{display:flex;align-items:center;gap:.75rem;margin-bottom:.5rem}
.personnel-popup-icon{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.personnel-popup-icon img{width:28px;height:28px}
.personnel-popup-title{font-weight:700;font-size:.95rem;color:var(--text-main)}
.personnel-popup-role{font-size:.75rem;color:var(--text-soft)}
.personnel-popup-details{font-size:.85rem}
.personnel-popup-row{display:flex;align-items:center;gap:.5rem;padding:.3rem 0;color:var(--text-main)}
.personnel-popup-row i{width:18px;color:var(--text-soft);flex-shrink:0}
.personnel-popup-close{position:absolute;top:.5rem;right:.5rem;width:24px;height:24px;border:none;background:var(--surface-soft);border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-soft);font-size:.7rem}
.popup-phone-link,.popup-email-link{color:#0369a1;text-decoration:none;font-weight:500}
.popup-phone-link:hover,.popup-email-link:hover{text-decoration:underline}

.personnel-schedule-section{background:var(--card-bg);border-radius:16px;padding:1rem;border:1px solid var(--card-border)}
.personnel-schedule-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;flex-wrap:wrap;gap:.5rem}
.personnel-schedule-header h4{font-size:1rem;font-weight:700;margin:0;display:flex;align-items:center;gap:.5rem}
.personnel-filter-group select{padding:.4rem .8rem;border-radius:8px;border:1px solid var(--card-border);background:var(--card-bg);color:var(--text-main);font-size:.85rem;cursor:pointer}
.personnel-schedule-section h4{font-size:1rem;font-weight:700;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}
.personnel-schedule-table{width:100%;border-collapse:collapse;font-size:.85rem;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,0.08)}
.personnel-schedule-table th{background:linear-gradient(135deg,#0369a1,#0ea5e9);color:#fff;padding:.75rem;text-align:left;font-weight:600;font-size:.75rem;text-transform:uppercase;letter-spacing:.5px}
.personnel-schedule-table th:first-child{text-align:center}
.personnel-schedule-table td{padding:.75rem;border-bottom:1px solid var(--card-border);vertical-align:middle}
.personnel-schedule-table td.row-number{text-align:center;font-weight:700;color:#0369a1;background:rgba(3,105,161,0.05);width:40px}
.personnel-schedule-table tr:hover{background:var(--surface-soft)}
.personnel-schedule-table tr:nth-child(even){background:rgba(3,105,161,0.02)}
.personnel-schedule-table tr:nth-child(even):hover{background:var(--surface-soft)}
.personnel-role-badge{display:inline-flex;align-items:center;gap:.3rem;padding:.25rem .6rem;border-radius:20px;font-size:.75rem;font-weight:600}
.personnel-role-badge.so{background:#dcfce7;color:#15803d}
.personnel-role-badge.wpr{background:#fee2e2;color:#b91c1c}
.personnel-role-badge img{width:16px;height:16px}

/* Admin Locations Management */
.admin-section-teal{border:1px solid rgba(13,148,136,0.2);background:linear-gradient(135deg,rgba(13,148,136,0.03) 0%,rgba(20,184,166,0.06) 100%);border-radius:16px;padding:1rem;margin-bottom:1rem}
.admin-badge-teal{background:linear-gradient(135deg,#0d9488,#14b8a6);color:#fff;padding:.4rem .8rem;border-radius:10px;font-size:.75rem;font-weight:600;display:inline-flex;align-items:center;gap:.4rem}
.admin-card-teal{background:linear-gradient(135deg,rgba(13,148,136,0.08),rgba(20,184,166,0.12));border:1px solid rgba(13,148,136,0.2)}
.admin-card-teal:hover{background:linear-gradient(135deg,rgba(13,148,136,0.15),rgba(20,184,166,0.2));transform:translateY(-2px)}
.admin-card-icon-img{width:32px;height:32px;margin-bottom:.3rem}
.locations-add-form{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem;padding:.75rem;background:var(--surface-soft);border-radius:12px}
.locations-add-form input,.locations-add-form select{flex:1;min-width:140px;padding:.5rem .75rem;border:1px solid var(--card-border);border-radius:8px;font-size:.85rem}
.locations-add-form button{padding:.5rem 1rem;border-radius:8px;border:none;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.3rem}
.locations-add-form button:first-of-type{background:linear-gradient(135deg,#0d9488,#14b8a6);color:#fff}
.locations-add-form .cancel-btn{background:#fee2e2;color:#dc2626}
.locations-list{max-height:400px;overflow-y:auto}
.locations-list-item{display:flex;align-items:center;justify-content:space-between;padding:.65rem .85rem;background:var(--card-bg);border:1px solid var(--card-border);border-radius:10px;margin-bottom:.5rem}
.locations-list-info{flex:1}
.locations-list-name{font-weight:600;font-size:.9rem;color:var(--text-main)}
.locations-list-details{font-size:.75rem;color:var(--text-soft);margin-top:.15rem}
.locations-list-actions{display:flex;gap:.3rem}
.locations-list-actions button{width:28px;height:28px;border-radius:6px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.75rem}
.locations-list-actions .edit-btn{background:#dbeafe;color:#2563eb}
.locations-list-actions .delete-btn{background:#fee2e2;color:#dc2626}

/* Admin Map Controls */
.locations-map-actions{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.map-admin-controls{display:flex;gap:.4rem}
.map-admin-btn{padding:.45rem .8rem;border:none;border-radius:8px;font-size:.8rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.35rem;transition:all .2s}
.map-admin-btn.add-area-btn{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff}
.map-admin-btn.add-area-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(22,163,74,0.4)}
.map-admin-btn.edit-mode-btn{background:#f1f5f9;color:#475569;border:1px solid #cbd5e1}
.map-admin-btn.edit-mode-btn:hover{background:#e2e8f0}
.map-admin-btn.edit-mode-btn.active{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-color:transparent}
.map-admin-hint{font-size:.75rem;color:#0369a1;margin-top:.5rem;padding:.5rem .75rem;background:#e0f2fe;border-radius:8px;display:flex;align-items:center;gap:.4rem}
.map-location-editable{cursor:pointer;border:2px dashed #3b82f6!important;animation:pulse-border 1.5s infinite}
.map-location-editable:hover{background:rgba(59,130,246,0.15)!important;transform:scale(1.03)}
@keyframes pulse-border{0%,100%{border-color:#3b82f6}50%{border-color:#93c5fd}}

/* Location Modal */
.location-modal{max-width:420px;width:100%}
.location-modal .modal-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:.75rem;border-bottom:1px solid var(--card-border);margin-bottom:1rem}
.location-modal .modal-header h3{font-size:1.1rem;font-weight:700;display:flex;align-items:center;gap:.5rem;color:var(--text-main)}
.location-modal .modal-header h3 i{color:#0369a1}
.location-modal .modal-close-btn{width:32px;height:32px;border:none;background:var(--surface-soft);border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-soft);font-size:.9rem}
.location-modal .modal-body{padding:0}
.location-modal .form-group{margin-bottom:.85rem}
.location-modal .form-group label{display:block;font-size:.8rem;font-weight:600;color:var(--text-main);margin-bottom:.3rem}
.location-modal .form-input{width:100%;padding:.55rem .75rem;border:1px solid var(--card-border);border-radius:8px;font-size:.9rem;background:var(--card-bg);color:var(--text-main)}
.location-modal .form-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,0.15)}
.location-modal .form-row{display:flex;gap:.75rem}
.location-modal .form-group.half{flex:1}
.location-modal .modal-footer{display:flex;gap:.5rem;justify-content:flex-end;margin-top:1.25rem;padding-top:.75rem;border-top:1px solid var(--card-border)}
.location-modal .btn-primary{padding:.5rem 1rem;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.35rem}
.location-modal .btn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(37,99,235,0.35)}
.location-modal .btn-secondary{padding:.5rem 1rem;background:#f1f5f9;color:#475569;border:1px solid #cbd5e1;border-radius:8px;font-weight:600;cursor:pointer}
.location-modal .btn-secondary:hover{background:#e2e8f0}
.location-modal .btn-danger{padding:.5rem 1rem;background:#fee2e2;color:#dc2626;border:none;border-radius:8px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.35rem}
.location-modal .btn-danger:hover{background:#fecaca}

/* Dark Mode - Locations Map Tool */
body.dark-mode .locations-map-container{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2)}
body.dark-mode .locations-map-header{background:linear-gradient(135deg,#0c4a6e 0%,#0369a1 50%,#0284c7 100%)}
body.dark-mode .map-toolbar{background:linear-gradient(180deg,rgba(30,41,59,0.98) 0%,rgba(15,23,42,0.98) 100%);border-color:rgba(148,163,184,0.15)}
body.dark-mode .map-toolbar-group{background:rgba(51,65,85,0.6);border-color:rgba(148,163,184,0.2)}
body.dark-mode .map-tool-btn{color:#94a3b8}
body.dark-mode .map-tool-btn:hover{background:rgba(14,165,233,0.15);color:#38bdf8}
body.dark-mode .map-tool-label{color:#94a3b8}
body.dark-mode .facility-map-wrapper{background:linear-gradient(145deg,rgba(12,74,110,0.2) 0%,rgba(15,23,42,0.4) 50%,rgba(8,145,178,0.15) 100%)}
body.dark-mode .facility-map{background:linear-gradient(135deg,rgba(30,41,59,0.9) 0%,rgba(51,65,85,0.8) 100%);border-color:rgba(148,163,184,0.3)}
body.dark-mode .map-location{background:linear-gradient(145deg,rgba(51,65,85,0.98),rgba(30,41,59,0.95));border-color:rgba(148,163,184,0.35);color:#e5e7eb}
body.dark-mode .map-location:hover{border-color:#0ea5e9}
body.dark-mode .map-legend{background:linear-gradient(180deg,rgba(15,23,42,0.98) 0%,rgba(30,41,59,0.95) 100%);border-color:rgba(148,163,184,0.15)}
body.dark-mode .map-legend-item{color:#94a3b8}
body.dark-mode .map-road-label{background:rgba(30,41,59,0.95);color:#e5e7eb}
body.dark-mode .map-exit-label{background:rgba(30,41,59,0.9);color:#e5e7eb}
body.dark-mode .personnel-schedule-section,body.dark-mode .personnel-popup{background:rgba(30,41,59,0.95);border-color:rgba(148,163,184,0.2)}
body.dark-mode .personnel-schedule-table td{border-color:rgba(148,163,184,0.2)}
body.dark-mode .locations-add-form{background:rgba(15,23,42,0.5)}
body.dark-mode .locations-list-item{background:rgba(30,41,59,0.6);border-color:rgba(148,163,184,0.2)}
body.dark-mode .map-admin-btn.edit-mode-btn{background:rgba(30,41,59,0.8);color:#e5e7eb;border-color:rgba(148,163,184,0.3)}
body.dark-mode .map-admin-hint{background:rgba(14,165,233,0.15);color:#7dd3fc}
body.dark-mode .location-modal .form-input{background:rgba(30,41,59,0.8);border-color:rgba(148,163,184,0.3);color:#e5e7eb}
body.dark-mode .location-modal .btn-secondary{background:rgba(30,41,59,0.8);color:#e5e7eb;border-color:rgba(148,163,184,0.3)}

/* Resize Handles */
.resize-handle{position:absolute;background:#3b82f6;border-radius:50%;width:10px;height:10px;z-index:10;opacity:0.8}
.resize-handle:hover{opacity:1;transform:scale(1.2)}
.resize-nw{top:-5px;left:-5px;cursor:nwse-resize}
.resize-ne{top:-5px;right:-5px;cursor:nesw-resize}
.resize-sw{bottom:-5px;left:-5px;cursor:nesw-resize}
.resize-se{bottom:-5px;right:-5px;cursor:nwse-resize}
.resize-n{top:-5px;left:50%;transform:translateX(-50%);cursor:ns-resize}
.resize-s{bottom:-5px;left:50%;transform:translateX(-50%);cursor:ns-resize}
.resize-e{right:-5px;top:50%;transform:translateY(-50%);cursor:ew-resize}
.resize-w{left:-5px;top:50%;transform:translateY(-50%);cursor:ew-resize}

/* HSE/WPR Worker Icons on Map - Compact size */
.map-icon-badge{position:relative;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .2s}
.map-icon-badge:hover{transform:scale(1.15)}
.map-icon-badge img{object-fit:contain;width:16px!important;height:16px!important;max-width:16px!important;max-height:16px!important}
.icon-count{position:absolute;top:-2px;right:-2px;background:#1e293b;color:#fff;font-size:8px;font-weight:700;min-width:12px;height:12px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid #fff}
.hse-icon .icon-count{background:#15803d}
.wpr-icon .icon-count{background:#dc2626}
.fe-icon .icon-count{background:#dc2626}
.worker-icon .icon-count{background:#eab308;color:#000}
.exit-icon .icon-count{background:#16a34a}
.draggable-exit-icon{transition:transform 0.1s ease;transform:translate(-50%,-50%)}
.draggable-exit-icon:hover{transform:translate(-50%,-50%) scale(1.1)}
.exit-point-icon{transform:translate(-50%,-50%)}

/* Simplified Modal */
.location-modal-simple{max-width:320px}

/* Location name in edit mode */
.map-location-editable .map-location-name{cursor:pointer;text-decoration:underline;text-decoration-style:dotted}
.map-location-editable .map-location-name:hover{background:rgba(59,130,246,0.2);border-radius:3px}

/* Personnel ID badge in admin panel */
.personnel-id-badge{display:inline-block;background:#e0f2fe;color:#0369a1;padding:2px 8px;border-radius:4px;font-size:.75rem;font-weight:600;margin-left:6px}

/* Role badges with color coding */
.role-badge{display:inline-block;padding:2px 8px;border-radius:4px;font-size:.7rem;font-weight:600;margin-left:6px}
.role-badge-green{background:#dcfce7;color:#166534}
.role-badge-red{background:#fee2e2;color:#991b1b}
.nationality-flag{font-size:1.1rem;margin-right:4px}

/* Dark mode role badges */
body.dark-mode .role-badge-green{background:#166534;color:#dcfce7}
body.dark-mode .role-badge-red{background:#991b1b;color:#fee2e2}

/* Personnel Form Grid Layout */
.personnel-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:1rem}
.personnel-form-grid .form-field{display:flex;flex-direction:column;gap:0.35rem}
.personnel-form-grid .form-field label{font-size:0.8rem;font-weight:600;color:var(--text-main)}
.personnel-form-grid .form-field input,.personnel-form-grid .form-field select{padding:0.6rem 0.75rem;border:1px solid var(--card-border);border-radius:8px;font-size:0.9rem;background:var(--card-bg);color:var(--text-main);transition:border-color 0.15s,box-shadow 0.15s}
.personnel-form-grid .form-field input:focus,.personnel-form-grid .form-field select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,0.15)}
.form-actions{display:flex;gap:0.5rem;margin-bottom:1rem}
.form-actions .btn-primary{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border:none;padding:0.6rem 1.2rem;border-radius:8px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:0.5rem;transition:transform 0.15s,box-shadow 0.15s}
.form-actions .btn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(59,130,246,0.3)}
.form-actions .btn-secondary{background:var(--card-bg);color:var(--text-main);border:1px solid var(--card-border);padding:0.6rem 1.2rem;border-radius:8px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:0.5rem;transition:background 0.15s}
.form-actions .btn-secondary:hover{background:rgba(0,0,0,0.05)}
body.dark-mode .personnel-form-grid .form-field input,body.dark-mode .personnel-form-grid .form-field select{background:rgba(30,41,59,0.8);border-color:rgba(148,163,184,0.3);color:#e5e7eb}
body.dark-mode .form-actions .btn-secondary{background:rgba(30,41,59,0.6);border-color:rgba(148,163,184,0.3)}

/* Nationality filter styles */
.nationality-filter{display:flex;align-items:center;gap:0.5rem;margin-bottom:1rem;flex-wrap:wrap}
.nationality-filter label{font-size:0.85rem;font-weight:600;color:var(--text-main)}
.nationality-filter select{padding:0.5rem 0.75rem;border:1px solid var(--card-border);border-radius:8px;font-size:0.85rem;background:var(--card-bg);color:var(--text-main)}

/* Location pills for multi-location assignments */
.locations-badges-row{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.4rem;align-items:center}
.location-pill{display:inline-flex;align-items:center;padding:3px 10px;border-radius:20px;font-size:.7rem;font-weight:600;background:#dbeafe;color:#1e40af;cursor:pointer;transition:all .15s}
.location-pill:hover{background:#fee2e2;color:#dc2626}
.location-pill.primary{background:#dcfce7;color:#166534;cursor:default}
.location-pill.primary:hover{background:#dcfce7;color:#166534}
.location-pill.unassigned{background:#f1f5f9;color:#64748b;cursor:default}
.location-pill.unassigned:hover{background:#f1f5f9;color:#64748b}
.add-location-btn{width:22px;height:22px;border-radius:50%;border:2px dashed #94a3b8;background:transparent;color:#64748b;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:10px;transition:all .15s}
.add-location-btn:hover{border-color:#0369a1;color:#0369a1;background:rgba(3,105,161,0.1)}
body.dark-mode .location-pill{background:rgba(59,130,246,0.2);color:#93c5fd}
body.dark-mode .location-pill:hover{background:rgba(239,68,68,0.3);color:#fca5a5}
body.dark-mode .location-pill.primary{background:rgba(34,197,94,0.2);color:#86efac}
body.dark-mode .location-pill.unassigned{background:rgba(100,116,139,0.3);color:#94a3b8}
body.dark-mode .add-location-btn{border-color:#64748b;color:#94a3b8}
body.dark-mode .add-location-btn:hover{border-color:#38bdf8;color:#38bdf8;background:rgba(56,189,248,0.1)}

/* Multi-location badge on map icons */
.multi-location-badge{position:absolute;top:-6px;left:-6px;background:#8b5cf6;color:#fff;font-size:9px;font-weight:700;min-width:16px;height:16px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,0.2)}

/* Emergency Contacts Admin Styles */
.emergency-admin-header{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}
.emergency-admin-filters select{padding:.5rem .75rem;border:1px solid var(--card-border);border-radius:8px;font-size:.85rem;background:var(--card-bg);color:var(--text-main)}
.emergency-admin-list{display:flex;flex-direction:column;gap:.75rem;max-height:400px;overflow-y:auto}
.emergency-admin-item{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;transition:all .15s}
.emergency-admin-item:hover{border-color:#0ea5e9;box-shadow:0 4px 12px rgba(14,165,233,0.15)}
.emergency-admin-info{flex:1;display:flex;flex-direction:column;gap:.25rem}
.emergency-admin-name{font-weight:700;font-size:.95rem;color:var(--text-main);display:flex;align-items:center;gap:.5rem}
.emergency-admin-role{font-size:.8rem;color:var(--text-soft)}
.emergency-admin-phone{font-size:.85rem;color:#0369a1;font-weight:600}
.emergency-admin-phone i{margin-right:.35rem}
.emergency-category-badge{display:inline-flex;align-items:center;gap:.3rem;padding:.25rem .6rem;border-radius:20px;font-size:.7rem;font-weight:600;color:#fff;margin-top:.35rem;width:fit-content}
.emergency-category-badge i{font-size:.65rem}
.priority-hotline-badge{display:inline-flex;align-items:center;gap:.25rem;padding:2px 8px;background:#fef3c7;color:#d97706;border-radius:20px;font-size:.65rem;font-weight:700}
.priority-hotline-badge i{font-size:.55rem}
.emergency-admin-actions{display:flex;gap:.5rem}
.emergency-admin-actions .btn-edit,.emergency-admin-actions .btn-delete{width:36px;height:36px;border-radius:8px;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s}
.emergency-admin-actions .btn-edit{background:#dbeafe;color:#2563eb}
.emergency-admin-actions .btn-edit:hover{background:#2563eb;color:#fff}
.emergency-admin-actions .btn-delete{background:#fee2e2;color:#dc2626}
.emergency-admin-actions .btn-delete:hover{background:#dc2626;color:#fff}
body.dark-mode .emergency-admin-item{background:rgba(30,41,59,0.6);border-color:rgba(148,163,184,0.2)}
body.dark-mode .emergency-admin-filters select{background:rgba(30,41,59,0.8);border-color:rgba(148,163,184,0.3);color:#e5e7eb}
body.dark-mode .emergency-admin-phone{color:#38bdf8}

/* Add location modal overlay */
.add-location-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);z-index:1000;display:flex;align-items:center;justify-content:center;padding:1rem}
.add-location-modal .modal-content{background:var(--card-bg);border-radius:12px;max-width:400px;width:100%;box-shadow:0 25px 50px rgba(0,0,0,0.25)}
.add-location-modal .modal-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;border-bottom:1px solid var(--card-border)}
.add-location-modal .modal-header h3{margin:0;font-size:1rem}
.add-location-modal .modal-close{background:none;border:none;font-size:1.5rem;color:#64748b;cursor:pointer;line-height:1}
.add-location-modal .modal-close:hover{color:#1e293b}
body.dark-mode .add-location-modal .modal-content{background:#1e293b;border:1px solid rgba(148,163,184,0.2)}
body.dark-mode .add-location-modal .modal-close:hover{color:#e5e7eb}

/* Map Icon Filters */
.map-icon-filters{display:flex;flex-wrap:wrap;gap:.4rem;padding:.5rem 1rem;background:linear-gradient(180deg,#f8fafc 0%,#f1f5f9 100%);border-bottom:1px solid rgba(148,163,184,0.15)}
.map-filter-btn{padding:.35rem .65rem;border:1px solid var(--card-border);border-radius:8px;background:var(--card-bg);color:#64748b;font-size:.7rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.35rem;transition:all .15s}
.map-filter-btn:hover{background:rgba(14,165,233,0.1);border-color:#0ea5e9}
.map-filter-btn.active{background:linear-gradient(135deg,#0ea5e9,#0369a1);color:#fff;border-color:transparent}
.map-filter-btn i{font-size:.65rem}
.map-filter-btn img{width:14px;height:14px;border-radius:2px}
body.dark-mode .map-icon-filters{background:linear-gradient(180deg,rgba(30,41,59,0.95) 0%,rgba(15,23,42,0.95) 100%);border-color:rgba(148,163,184,0.15)}
body.dark-mode .map-filter-btn{background:rgba(51,65,85,0.6);border-color:rgba(148,163,184,0.2);color:#94a3b8}
body.dark-mode .map-filter-btn:hover{background:rgba(14,165,233,0.2);color:#38bdf8}

/* Map Element Selected State */
.map-road.selected,.map-exit.selected,.map-landmark.selected{outline:3px solid #3b82f6;outline-offset:2px;animation:pulse-outline 1s infinite}
@keyframes pulse-outline{0%,100%{outline-color:#3b82f6}50%{outline-color:#93c5fd}}

/* Element Edit Popup */
.map-element-popup{position:absolute;background:var(--card-bg);border-radius:10px;padding:.75rem;box-shadow:0 8px 24px rgba(0,0,0,0.2);z-index:200;min-width:150px;border:1px solid var(--card-border)}
.map-element-popup-title{font-size:.8rem;font-weight:700;color:var(--text-main);margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem}
.map-element-popup-input{width:100%;padding:.4rem .6rem;border:1px solid var(--card-border);border-radius:6px;font-size:.8rem;margin-bottom:.5rem}
.map-element-popup-textarea{width:100%;padding:.4rem .6rem;border:1px solid var(--card-border);border-radius:6px;font-size:.75rem;margin-bottom:.5rem;resize:vertical;min-height:40px;font-family:inherit}
.map-element-popup-actions{display:flex;gap:.3rem;justify-content:flex-end}
.map-element-popup-btn{padding:.35rem .6rem;border:none;border-radius:6px;font-size:.7rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.25rem}
.map-element-popup-btn.save{background:#22c55e;color:#fff}
.map-element-popup-btn.delete{background:#fee2e2;color:#dc2626}
.map-element-popup-btn.cancel{background:#f1f5f9;color:#475569}
body.dark-mode .map-element-popup{background:rgba(30,41,59,0.98);border-color:rgba(148,163,184,0.3)}
body.dark-mode .map-element-popup-input{background:rgba(15,23,42,0.8);border-color:rgba(148,163,184,0.3);color:#e5e7eb}
body.dark-mode .map-element-popup-textarea{background:rgba(15,23,42,0.8);border-color:rgba(148,163,184,0.3);color:#e5e7eb}

/* Road Rotation & Width Controls */
.map-element-popup-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}
.map-element-popup-label{font-size:.7rem;font-weight:600;color:var(--text-soft);min-width:55px;display:flex;align-items:center;gap:.25rem}
.map-element-popup-label i{font-size:.65rem;color:#0ea5e9}
.map-element-popup-input-small{width:60px;padding:.35rem .5rem;border:1px solid var(--card-border);border-radius:6px;font-size:.75rem;text-align:center}
.map-element-popup-unit{font-size:.65rem;color:var(--text-soft)}
.map-rotation-control{display:flex;align-items:center;gap:.4rem;flex:1}
.map-rotation-slider{flex:1;height:6px;-webkit-appearance:none;appearance:none;background:linear-gradient(90deg,#e2e8f0,#0ea5e9,#e2e8f0);border-radius:3px;cursor:pointer}
.map-rotation-slider::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:linear-gradient(135deg,#0ea5e9,#0369a1);border-radius:50%;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,0.2)}
.map-rotation-slider::-moz-range-thumb{width:16px;height:16px;background:linear-gradient(135deg,#0ea5e9,#0369a1);border-radius:50%;cursor:pointer;border:none}
.map-rotation-value{font-size:.75rem;font-weight:700;color:#0ea5e9;min-width:36px;text-align:right}
.map-rotation-presets{display:flex;gap:.25rem;margin-bottom:.5rem}
.rotation-preset-btn{padding:.25rem .4rem;border:1px solid var(--card-border);border-radius:4px;background:var(--card-bg);font-size:.65rem;font-weight:600;color:var(--text-soft);cursor:pointer;transition:all .15s}
.rotation-preset-btn:hover{background:#0ea5e9;color:#fff;border-color:#0ea5e9}
body.dark-mode .map-element-popup-input-small{background:rgba(15,23,42,0.8);border-color:rgba(148,163,184,0.3);color:#e5e7eb}
body.dark-mode .map-rotation-slider{background:linear-gradient(90deg,#334155,#0ea5e9,#334155)}
body.dark-mode .rotation-preset-btn{background:rgba(51,65,85,0.6);border-color:rgba(148,163,184,0.2);color:#94a3b8}
body.dark-mode .rotation-preset-btn:hover{background:#0ea5e9;color:#fff}

/* Mobile Responsive - Locations Map */
@media(max-width:768px){
  .locations-map-header{grid-template-columns:1fr;gap:.5rem;padding:.75rem 1rem;text-align:center}
  .locations-map-header h3{justify-content:center;font-size:1rem}
  .locations-map-stats{flex-wrap:wrap;justify-content:center;gap:.4rem}
  .locations-map-stat{padding:.25rem .5rem;font-size:.65rem}
  .locations-map-actions{justify-content:center}
  .map-toolbar{display:none}
  .map-icon-filters{justify-content:center}
  .facility-map{min-width:500px;aspect-ratio:4/3}
  .map-location{font-size:.5rem}
  .map-legend{gap:.5rem;padding:.5rem .75rem;justify-content:center}
  .map-legend-item{font-size:.6rem}
  .personnel-schedule-section{overflow-x:auto}
  .personnel-schedule-table{font-size:.75rem;min-width:500px}
  .personnel-schedule-table th,.personnel-schedule-table td{padding:.4rem .5rem}
}
@media(max-width:480px){
  .locations-map-header{padding:.6rem .75rem}
  .locations-map-header h3{font-size:.9rem}
  .locations-map-stats{gap:.3rem}
  .locations-map-stat{padding:.2rem .4rem;font-size:.6rem}
  .locations-map-stat i{display:none}
  .map-admin-btn{padding:.35rem .6rem;font-size:.7rem}
  .locations-print-btn{padding:.35rem .6rem;font-size:.7rem}
  .facility-map{min-width:400px}
  .map-location{font-size:.45rem;padding:2px}
  .map-legend-item{font-size:.55rem}
  .map-icon-badge img{width:16px!important;height:16px!important}
  .icon-count{font-size:8px;min-width:12px;height:12px}
}

/* ============ SCAFFOLD SAFETY TOOL ============ */
.scaffold-form-container {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.scaffold-card {
  background: var(--card-bg);
  border-radius: var(--radius-card);
  padding: 1.25rem;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  border: 1px solid var(--card-border);
}

.scaffold-card h4 {
  margin: 0 0 1rem;
  font-size: 1rem;
  color: #003366;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.scaffold-card h4 i {
  color: #003366;
}

body.dark-mode .scaffold-card {
  background: rgba(15,23,42,0.96);
  border-color: rgba(148,163,184,0.3);
}

body.dark-mode .scaffold-card h4 {
  color: #60a5fa;
}

body.dark-mode .scaffold-card h4 i {
  color: #60a5fa;
}

.scaffold-form-group {
  margin-bottom: 1rem;
}

.scaffold-form-group:last-child {
  margin-bottom: 0;
}

.scaffold-form-group label {
  display: block;
  font-size: 0.85rem;
  font-weight: 600;
  margin-bottom: 0.4rem;
  color: var(--text-main);
}

body.dark-mode .scaffold-form-group label {
  color: #e5e7eb;
}

.scaffold-form-group input,
.scaffold-form-group select {
  width: 100%;
  padding: 0.65rem 0.85rem;
  border-radius: 10px;
  border: 1px solid #d1d5db;
  font-size: 0.9rem;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.scaffold-form-group input:focus,
.scaffold-form-group select:focus {
  outline: none;
  border-color: #003366;
  box-shadow: 0 0 0 3px rgba(0,51,102,0.12);
}

.scaffold-form-group input:disabled,
.scaffold-form-group select:disabled {
  background: #f3f4f6;
  color: #9ca3af;
  cursor: not-allowed;
}

body.dark-mode .scaffold-form-group input:disabled,
body.dark-mode .scaffold-form-group select:disabled {
  background: #1f2937;
  color: #6b7280;
}

.scaffold-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

@media (max-width: 500px) {
  .scaffold-form-row {
    grid-template-columns: 1fr;
  }
}

.scaffold-req-badge {
  display: inline-block;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-size: 0.65rem;
  font-weight: 600;
  background: #fee2e2;
  color: #991b1b;
  margin-left: 0.4rem;
}

body.dark-mode .scaffold-req-badge {
  background: rgba(239,68,68,0.2);
  color: #f87171;
}

.scaffold-muted {
  font-size: 0.75rem;
  color: #6b7280;
  font-weight: normal;
}

.scaffold-hint {
  display: block;
  font-size: 0.7rem;
  color: #6b7280;
  margin-top: 0.3rem;
}

.scaffold-eval-btn {
  width: 100%;
  padding: 1rem;
  border: none;
  border-radius: 12px;
  background: linear-gradient(135deg, #003366, #004d99);
  color: #fff;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  transition: transform 0.2s, box-shadow 0.2s;
}

.scaffold-eval-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0,51,102,0.3);
}

.scaffold-eval-btn:active {
  transform: scale(0.98);
}

.scaffold-status {
  margin-top: 1rem;
  padding: 1.25rem;
  border-radius: 14px;
  font-weight: 500;
}

.scaffold-status ul {
  margin: 0.75rem 0 0 1.2rem;
  font-weight: normal;
}

.scaffold-status li {
  margin-bottom: 0.4rem;
}

.scaffold-status-icon {
  font-size: 2rem;
  margin-bottom: 0.5rem;
}

.scaffold-status-title {
  font-size: 1.25rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}

.scaffold-status p {
  margin: 0;
  font-weight: normal;
}

.scaffold-green {
  background: linear-gradient(135deg, #d1fae5, #a7f3d0);
  color: #065f46;
  text-align: center;
}

.scaffold-green .scaffold-status-icon {
  color: #059669;
}

body.dark-mode .scaffold-green {
  background: linear-gradient(135deg, rgba(6,95,70,0.3), rgba(16,185,129,0.2));
  color: #6ee7b7;
}

.scaffold-red {
  background: linear-gradient(135deg, #fee2e2, #fecaca);
  color: #991b1b;
}

.scaffold-red .scaffold-status-icon {
  color: #dc2626;
}

body.dark-mode .scaffold-red {
  background: linear-gradient(135deg, rgba(153,27,27,0.3), rgba(220,38,38,0.2));
  color: #fca5a5;
}

.scaffold-hold {
  background: linear-gradient(135deg, #e5e7eb, #d1d5db);
  color: #111827;
}

.scaffold-hold .scaffold-status-icon {
  color: #f59e0b;
}

body.dark-mode .scaffold-hold {
  background: linear-gradient(135deg, rgba(31,41,55,0.8), rgba(55,65,81,0.6));
  color: #e5e7eb;
}

.scaffold-additional {
  margin-top: 1rem;
  font-weight: 600;
  border-top: 1px solid rgba(0,0,0,0.1);
  padding-top: 0.75rem;
}

.scaffold-notes {
  margin-top: 1rem;
  font-size: 0.85rem;
  color: #6b7280;
}

body.dark-mode .scaffold-notes {
  color: #9ca3af;
}

.scaffold-reference-table {
  margin-top: 1rem;
}

.scaffold-clearance-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}

.scaffold-clearance-table th,
.scaffold-clearance-table td {
  border: 1px solid #d1d5db;
  padding: 0.6rem 0.8rem;
  text-align: center;
}

.scaffold-clearance-table th {
  background: linear-gradient(135deg, #003366, #004d99);
  color: #fff;
  font-weight: 600;
}

.scaffold-clearance-table tbody tr:nth-child(even) {
  background: rgba(0,0,0,0.02);
}

body.dark-mode .scaffold-clearance-table th {
  background: linear-gradient(135deg, #1e3a5f, #2563eb);
}

body.dark-mode .scaffold-clearance-table td {
  border-color: rgba(148,163,184,0.3);
}

body.dark-mode .scaffold-clearance-table tbody tr:nth-child(even) {
  background: rgba(255,255,255,0.03);
}

/* Near Miss Section Styles */
.near-miss-section,.corrective-action-section{background:linear-gradient(135deg,rgba(245,158,11,0.03) 0%,rgba(251,191,36,0.08) 100%);border:1px solid rgba(245,158,11,0.2);border-radius:16px;padding:1rem;margin:1rem 0;animation:slideDown .3s ease-out}
.corrective-action-section{background:linear-gradient(135deg,rgba(59,130,246,0.03) 0%,rgba(99,102,241,0.08) 100%);border-color:rgba(59,130,246,0.2)}
@keyframes slideDown{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}

.section-header-pro{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:2px solid rgba(245,158,11,0.2)}
.section-header-pro.ca-header{border-bottom-color:rgba(59,130,246,0.2)}
.section-header-icon{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,#f59e0b,#fbbf24);display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.2rem;box-shadow:0 4px 12px rgba(245,158,11,0.3);overflow:hidden}
.section-header-icon.ca-icon{background:linear-gradient(135deg,#3b82f6,#6366f1);box-shadow:0 4px 12px rgba(59,130,246,0.3)}
.section-header-text{display:flex;flex-direction:column}
.section-title{font-weight:700;font-size:1rem;color:var(--text-main)}
.section-subtitle{font-size:.75rem;color:var(--text-soft);margin-top:.15rem}

.near-miss-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}
.form-group-pro{margin-bottom:.85rem}
.label-pro{display:flex;align-items:center;gap:.4rem;font-size:.8rem;font-weight:600;color:var(--text-main);margin-bottom:.4rem}
.label-pro i{color:#f59e0b;font-size:.85rem}
.label-pro-small{font-size:.75rem;font-weight:600;color:var(--text-soft);margin-bottom:.3rem}
.corrective-action-section .label-pro i{color:#3b82f6}

.select-pro,.input-pro,.textarea-pro{width:100%;padding:.6rem .85rem;border:1px solid var(--card-border);border-radius:10px;font-size:.85rem;background:var(--card-bg);color:var(--text-main);transition:all .2s}
.select-pro:focus,.input-pro:focus,.textarea-pro:focus{outline:none;border-color:#f59e0b;box-shadow:0 0 0 3px rgba(245,158,11,0.15)}
.corrective-action-section .select-pro:focus,.corrective-action-section .input-pro:focus,.corrective-action-section .textarea-pro:focus{border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,0.15)}
.select-pro-small{flex:1;min-width:100px;padding:.5rem;border:1px solid var(--card-border);border-radius:8px;font-size:.8rem;background:var(--card-bg);color:var(--text-main)}
.input-pro-small{width:70px;padding:.5rem;border:1px solid var(--card-border);border-radius:8px;font-size:.9rem;text-align:center;background:var(--card-bg);color:var(--text-main)}

/* Severity Buttons */
.severity-buttons{display:flex;flex-wrap:wrap;gap:.4rem}
.severity-btn{flex:1;min-width:70px;padding:.5rem .4rem;border:2px solid var(--card-border);border-radius:10px;background:var(--card-bg);cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:.25rem;font-size:.7rem;font-weight:600;transition:all .2s;color:var(--text-soft)}
.severity-btn i{font-size:1rem}
.severity-btn.low:hover,.severity-btn.low.active{background:#dcfce7;border-color:#22c55e;color:#15803d}
.severity-btn.medium:hover,.severity-btn.medium.active{background:#fef3c7;border-color:#f59e0b;color:#b45309}
.severity-btn.high:hover,.severity-btn.high.active{background:#fed7aa;border-color:#f97316;color:#c2410c}
.severity-btn.critical:hover,.severity-btn.critical.active{background:#fee2e2;border-color:#ef4444;color:#b91c1c}

/* Environmental Conditions */
.env-conditions-row{display:flex;flex-wrap:wrap;gap:.5rem}

/* Contributing Factors */
.contributing-factors-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.4rem}
.factor-checkbox{display:flex;align-items:center;gap:.4rem;padding:.45rem .6rem;border:1px solid var(--card-border);border-radius:8px;font-size:.78rem;cursor:pointer;transition:all .2s;background:var(--card-bg)}
.factor-checkbox:hover{background:rgba(245,158,11,0.1);border-color:rgba(245,158,11,0.3)}
.factor-checkbox input[type="checkbox"]{width:16px;height:16px;accent-color:#f59e0b;cursor:pointer}
.factor-checkbox input[type="checkbox"]:checked+span{color:#b45309;font-weight:600}

/* PPE Status Buttons */
.ppe-status-buttons{display:flex;flex-wrap:wrap;gap:.4rem}
.ppe-btn{flex:1;min-width:70px;padding:.5rem .5rem;border:2px solid var(--card-border);border-radius:10px;background:var(--card-bg);cursor:pointer;font-size:.72rem;font-weight:600;display:flex;align-items:center;gap:.3rem;justify-content:center;transition:all .2s;color:var(--text-soft)}
.ppe-btn:hover,.ppe-btn.active{transform:translateY(-2px)}
.ppe-btn[data-ppe="Proper PPE Worn"]:hover,.ppe-btn[data-ppe="Proper PPE Worn"].active{background:#dcfce7;border-color:#22c55e;color:#15803d}
.ppe-btn[data-ppe="Partial PPE"]:hover,.ppe-btn[data-ppe="Partial PPE"].active{background:#fef3c7;border-color:#f59e0b;color:#b45309}
.ppe-btn[data-ppe="No PPE"]:hover,.ppe-btn[data-ppe="No PPE"].active{background:#fee2e2;border-color:#ef4444;color:#b91c1c}
.ppe-btn[data-ppe="PPE Not Applicable"]:hover,.ppe-btn[data-ppe="PPE Not Applicable"].active{background:#e0e7ff;border-color:#6366f1;color:#4338ca}

/* People at Risk */
.people-at-risk-row{display:flex;align-items:center;gap:.5rem}
.people-label{font-size:.8rem;color:var(--text-soft)}

/* JSA Toggle */
.jsa-toggle-row{display:flex;flex-wrap:wrap;gap:.4rem}
.jsa-btn{flex:1;min-width:60px;padding:.5rem .6rem;border:2px solid var(--card-border);border-radius:10px;background:var(--card-bg);cursor:pointer;font-size:.78rem;font-weight:600;display:flex;align-items:center;gap:.3rem;justify-content:center;transition:all .2s;color:var(--text-soft)}
.jsa-btn[data-jsa="Yes"]:hover,.jsa-btn[data-jsa="Yes"].active{background:#dcfce7;border-color:#22c55e;color:#15803d}
.jsa-btn[data-jsa="No"]:hover,.jsa-btn[data-jsa="No"].active{background:#fee2e2;border-color:#ef4444;color:#b91c1c}
.jsa-btn[data-jsa="Partial"]:hover,.jsa-btn[data-jsa="Partial"].active{background:#fef3c7;border-color:#f59e0b;color:#b45309}
.jsa-btn[data-jsa="N/A"]:hover,.jsa-btn[data-jsa="N/A"].active{background:#f1f5f9;border-color:#64748b;color:#475569}

/* CA Dates Grid */
.ca-dates-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:500px){.ca-dates-grid{grid-template-columns:1fr}}

/* Revision Toggles */
.ca-revision-section{margin:1rem 0;padding:.85rem;background:rgba(59,130,246,0.05);border-radius:12px;border:1px solid rgba(59,130,246,0.15)}
.revision-toggles{display:flex;flex-direction:column;gap:.6rem;margin-top:.5rem}
.revision-toggle{display:flex;align-items:center;gap:.75rem;cursor:pointer;user-select:none}
.revision-toggle input[type="checkbox"]{display:none}
.toggle-slider{width:44px;height:24px;background:#cbd5e1;border-radius:24px;position:relative;transition:all .3s}
.toggle-slider::before{content:'';position:absolute;width:18px;height:18px;background:#fff;border-radius:50%;top:3px;left:3px;transition:all .3s;box-shadow:0 2px 4px rgba(0,0,0,0.2)}
.revision-toggle input:checked+.toggle-slider{background:linear-gradient(135deg,#3b82f6,#6366f1)}
.revision-toggle input:checked+.toggle-slider::before{transform:translateX(20px)}
.toggle-label{font-size:.85rem;color:var(--text-main)}

/* HSSE Review Section */
.hsse-review-section{margin-top:1rem;padding:.85rem;background:linear-gradient(135deg,rgba(16,185,129,0.05),rgba(5,150,105,0.1));border-radius:12px;border:1px solid rgba(16,185,129,0.2)}
.hsse-review-header{display:flex;align-items:center;gap:.5rem;font-weight:700;font-size:.9rem;color:#059669;margin-bottom:.75rem}
.hsse-review-header i{font-size:1rem}
.hsse-review-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:500px){.hsse-review-grid{grid-template-columns:1fr}}

/* Dark mode */
body.dark-mode .near-miss-section{background:linear-gradient(135deg,rgba(245,158,11,0.08) 0%,rgba(251,191,36,0.12) 100%);border-color:rgba(245,158,11,0.25)}
body.dark-mode .corrective-action-section{background:linear-gradient(135deg,rgba(59,130,246,0.08) 0%,rgba(99,102,241,0.12) 100%);border-color:rgba(59,130,246,0.25)}
body.dark-mode .severity-btn,body.dark-mode .ppe-btn,body.dark-mode .jsa-btn,body.dark-mode .factor-checkbox{background:rgba(30,41,59,0.6);border-color:rgba(148,163,184,0.3)}
body.dark-mode .ca-revision-section{background:rgba(59,130,246,0.1);border-color:rgba(59,130,246,0.2)}
body.dark-mode .hsse-review-section{background:rgba(16,185,129,0.1);border-color:rgba(16,185,129,0.25)}

/* Near Miss Detail View Styles */
.near-miss-detail-section{background:linear-gradient(135deg,rgba(245,158,11,0.05),rgba(251,191,36,0.1));border:1px solid rgba(245,158,11,0.2);border-radius:12px}
.near-miss-detail-section .detail-section-title{color:#b45309}
.nm-severity-badge{padding:.3rem .7rem;border-radius:20px;font-size:.8rem;font-weight:600}
.nm-severity-badge.severity-low{background:#dcfce7;color:#15803d}
.nm-severity-badge.severity-medium{background:#fef3c7;color:#b45309}
.nm-severity-badge.severity-high{background:#fed7aa;color:#c2410c}
.nm-severity-badge.severity-critical{background:#fee2e2;color:#b91c1c}
.nm-factors-list{display:flex;flex-wrap:wrap;gap:.4rem}
.nm-factor-chip{background:rgba(245,158,11,0.15);color:#b45309;padding:.25rem .6rem;border-radius:8px;font-size:.78rem;font-weight:500;border:1px solid rgba(245,158,11,0.3)}

/* CA Form Detail Section */
.ca-form-detail-section{background:linear-gradient(135deg,rgba(59,130,246,0.05),rgba(99,102,241,0.1));border:1px solid rgba(59,130,246,0.2);border-radius:12px}
.ca-form-detail-section .detail-section-title{color:#2563eb}

body.dark-mode .near-miss-detail-section{background:linear-gradient(135deg,rgba(245,158,11,0.1),rgba(251,191,36,0.15));border-color:rgba(245,158,11,0.3)}
body.dark-mode .nm-factor-chip{background:rgba(245,158,11,0.2);border-color:rgba(245,158,11,0.4)}
body.dark-mode .ca-form-detail-section{background:linear-gradient(135deg,rgba(59,130,246,0.1),rgba(99,102,241,0.15));border-color:rgba(59,130,246,0.3)}

/* Fixed vertical toggle styles for Plan Revisions */
.revision-toggles-vertical{display:flex;flex-direction:column;gap:.75rem}
.revision-toggle-full{display:flex;align-items:center;gap:.75rem;cursor:pointer;padding:.6rem .8rem;background:rgba(59,130,246,0.05);border:1px solid rgba(59,130,246,0.15);border-radius:8px;transition:all .2s}
.revision-toggle-full:hover{background:rgba(59,130,246,0.1);border-color:rgba(59,130,246,0.25)}
.revision-toggle-full input[type="checkbox"]{display:none}
.toggle-slider-full{width:44px;height:24px;background:#cbd5e1;border-radius:12px;position:relative;transition:background .2s;flex-shrink:0}
.toggle-slider-full::after{content:'';position:absolute;width:18px;height:18px;background:#fff;border-radius:50%;top:3px;left:3px;transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,0.2)}
.revision-toggle-full input:checked + .toggle-slider-full{background:#3b82f6}
.revision-toggle-full input:checked + .toggle-slider-full::after{transform:translateX(20px)}
.toggle-label-full{font-size:.9rem;color:#374151;font-weight:500}

body.dark-mode .revision-toggle-full{background:rgba(59,130,246,0.1);border-color:rgba(59,130,246,0.25)}
body.dark-mode .toggle-slider-full{background:#475569}
body.dark-mode .toggle-label-full{color:#e2e8f0}

/* Close Observation Modal Styles */
.close-obs-modal{max-width:600px}
.close-obs-modal .corrective-action-section{margin-top:1rem;display:block}

/* Themed Observation Modal Styles */
.modal-content.themed-near-miss{border-top:4px solid #f59e0b}
.modal-content.themed-near-miss h2{color:#b45309}
.modal-content.themed-near-miss h2 i{color:#f59e0b}
.modal-content.themed-near-miss .submit-btn{background:linear-gradient(135deg,#f59e0b,#d97706)}
.modal-content.themed-near-miss input:focus,.modal-content.themed-near-miss select:focus,.modal-content.themed-near-miss textarea:focus{border-color:#f59e0b;box-shadow:0 0 0 3px rgba(245,158,11,0.15)}

.modal-content.themed-unsafe-act{border-top:4px solid #ef4444}
.modal-content.themed-unsafe-act h2{color:#b91c1c}
.modal-content.themed-unsafe-act h2 i{color:#ef4444}
.modal-content.themed-unsafe-act .submit-btn{background:linear-gradient(135deg,#ef4444,#dc2626)}
.modal-content.themed-unsafe-act input:focus,.modal-content.themed-unsafe-act select:focus,.modal-content.themed-unsafe-act textarea:focus{border-color:#ef4444;box-shadow:0 0 0 3px rgba(239,68,68,0.15)}

.modal-content.themed-unsafe-condition{border-top:4px solid #f97316}
.modal-content.themed-unsafe-condition h2{color:#c2410c}
.modal-content.themed-unsafe-condition h2 i{color:#f97316}
.modal-content.themed-unsafe-condition .submit-btn{background:linear-gradient(135deg,#f97316,#ea580c)}
.modal-content.themed-unsafe-condition input:focus,.modal-content.themed-unsafe-condition select:focus,.modal-content.themed-unsafe-condition textarea:focus{border-color:#f97316;box-shadow:0 0 0 3px rgba(249,115,22,0.15)}

.modal-content.themed-positive{border-top:4px solid #10b981}
.modal-content.themed-positive h2{color:#047857}
.modal-content.themed-positive h2 i{color:#10b981}
.modal-content.themed-positive .submit-btn{background:linear-gradient(135deg,#10b981,#059669)}
.modal-content.themed-positive input:focus,.modal-content.themed-positive select:focus,.modal-content.themed-positive textarea:focus{border-color:#10b981;box-shadow:0 0 0 3px rgba(16,185,129,0.15)}

.modal-content.themed-environmental{border-top:4px solid #06b6d4}
.modal-content.themed-environmental h2{color:#0891b2}
.modal-content.themed-environmental h2 i{color:#06b6d4}
.modal-content.themed-environmental .submit-btn{background:linear-gradient(135deg,#06b6d4,#0891b2)}
.modal-content.themed-environmental input:focus,.modal-content.themed-environmental select:focus,.modal-content.themed-environmental textarea:focus{border-color:#06b6d4;box-shadow:0 0 0 3px rgba(6,182,212,0.15)}

/* Themed header icons */
.obs-type-header{display:flex;align-items:center;gap:1rem;margin-bottom:.5rem}
.obs-type-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;overflow:hidden}
.obs-type-icon.icon-near-miss{background:linear-gradient(135deg,#fef3c7,#fde68a);color:#b45309}
.obs-type-icon.icon-unsafe-act{background:linear-gradient(135deg,#fee2e2,#fecaca);color:#b91c1c}
.obs-type-icon.icon-unsafe-condition{background:linear-gradient(135deg,#ffedd5,#fed7aa);color:#c2410c}
.obs-type-icon.icon-positive{background:linear-gradient(135deg,#d1fae5,#a7f3d0);color:#047857}
.obs-type-icon.icon-environmental{background:linear-gradient(135deg,#cffafe,#a5f3fc);color:#0891b2}
.obs-type-text{display:flex;flex-direction:column}
.obs-type-title{font-size:1.3rem;font-weight:600;margin:0}
.obs-type-subtitle{font-size:.85rem;color:#6b7280;margin-top:2px}

body.dark-mode .modal-content.themed-near-miss h2{color:#fbbf24}
body.dark-mode .modal-content.themed-unsafe-act h2{color:#f87171}
body.dark-mode .modal-content.themed-unsafe-condition h2{color:#fb923c}
body.dark-mode .modal-content.themed-positive h2{color:#34d399}
body.dark-mode .modal-content.themed-environmental h2{color:#22d3ee}
body.dark-mode .obs-type-subtitle{color:#9ca3af}

/* =============================================
   NEW OBSERVATION FORM - TYPE SELECTION CARDS
   ============================================= */
.obs-modal-scroll{align-items:flex-start!important;overflow-y:auto;padding-top:1.5rem;padding-bottom:1.5rem}
.obs-type-modal{max-width:700px;padding:0;overflow-y:auto;max-height:90vh}
.obs-type-vis-row{display:flex;align-items:center;justify-content:space-between;padding:.55rem .75rem;border-radius:8px;gap:1rem;transition:background .15s}
.obs-type-vis-row:hover{background:rgba(148,163,184,0.07)}
.obs-type-vis-row+.obs-type-vis-row{border-top:1px solid rgba(148,163,184,0.12)}
.obs-type-vis-name{font-size:.88rem;font-weight:500;color:var(--text);flex:1}
.obs-type-mgmt-card{display:flex;align-items:center;gap:.75rem;padding:.85rem 1rem;background:var(--card-bg);border-radius:12px;border:2px solid rgba(148,163,184,0.15);cursor:default;transition:all .2s}
.obs-type-mgmt-card:hover{border-color:rgba(59,130,246,0.3);box-shadow:0 2px 12px rgba(59,130,246,0.08)}
.obs-type-mgmt-card.obs-type-disabled{opacity:.55;background:rgba(148,163,184,0.06);border-color:rgba(148,163,184,0.1)}
.obs-type-toggle-label{display:flex;align-items:center;cursor:pointer;flex-shrink:0}
.obs-type-toggle-label input[type="checkbox"]{display:none}
.obs-type-toggle-label input:checked + .toggle-slider-full{background:#3b82f6}
.obs-type-toggle-label input:checked + .toggle-slider-full::after{transform:translateX(20px)}
.obs-step{padding:1.5rem}
.type-selection-header{text-align:center;margin-bottom:1.5rem}
.type-selection-header h2{font-size:1.5rem;color:#1e293b;margin:0 0 .5rem}
.type-selection-header h2 i{color:#3b82f6;margin-right:.5rem}
.type-selection-subtitle{color:#64748b;font-size:.95rem;margin:0}

.obs-type-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}
.obs-type-card{display:flex;align-items:center;gap:1rem;padding:1rem 1.25rem;border-radius:12px;cursor:pointer;transition:all .2s;border:2px solid transparent}
.obs-type-card:hover{transform:translateX(4px)}
.type-card-icon{width:50px;height:50px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex-shrink:0}
.type-card-content{flex:1}
.type-card-content h3{margin:0;font-size:1.05rem;font-weight:600}
.type-card-content p{margin:.25rem 0 0;font-size:.8rem;color:#64748b;line-height:1.3}
.type-card-arrow{color:#94a3b8;font-size:1.1rem;transition:transform .2s}
.obs-type-card:hover .type-card-arrow{transform:translateX(4px)}

.near-miss-card{background:linear-gradient(135deg,#fffbeb,#fef3c7);border-color:#fbbf24}
.near-miss-card .type-card-icon{background:#f59e0b;color:#fff}
.near-miss-card:hover{background:#fef3c7;border-color:#f59e0b}

.unsafe-act-card{background:linear-gradient(135deg,#fef2f2,#fee2e2);border-color:#fca5a5}
.unsafe-act-card .type-card-icon{background:#ef4444;color:#fff}
.unsafe-act-card:hover{background:#fee2e2;border-color:#ef4444}

.unsafe-condition-card{background:linear-gradient(135deg,#fff7ed,#ffedd5);border-color:#fdba74}
.unsafe-condition-card .type-card-icon{background:#f97316;color:#fff}
.unsafe-condition-card:hover{background:#ffedd5;border-color:#f97316}

.positive-card{background:linear-gradient(135deg,#f0fdf4,#dcfce7);border-color:#86efac}
.positive-card .type-card-icon{background:#10b981;color:#fff}
.positive-card:hover{background:#dcfce7;border-color:#10b981}

.environmental-card{background:linear-gradient(135deg,#ecfeff,#cffafe);border-color:#67e8f9}
.environmental-card .type-card-icon{background:#06b6d4;color:#fff}
.environmental-card:hover{background:#cffafe;border-color:#06b6d4}

.swa-card{background:linear-gradient(135deg,#faf5ff,#f3e8ff);border-color:#c4b5fd}
.swa-card .type-card-icon{background:#8b5cf6;color:#fff}
.swa-card:hover{background:#f3e8ff;border-color:#8b5cf6}

.incident-card{background:linear-gradient(135deg,#eef2ff,#e0e7ff);border-color:#a5b4fc}
.incident-card .type-card-icon{background:#6366f1;color:#fff}
.incident-card:hover{background:#e0e7ff;border-color:#6366f1}

.accident-card{background:linear-gradient(135deg,#fef2f2,#fee2e2);border-color:#fca5a5}
.accident-card .type-card-icon{background:#dc2626;color:#fff}
.accident-card:hover{background:#fee2e2;border-color:#dc2626}

.damage-card{background:linear-gradient(135deg,#f8fafc,#f1f5f9);border-color:#cbd5e1}
.damage-card .type-card-icon{background:#64748b;color:#fff}
.damage-card:hover{background:#f1f5f9;border-color:#64748b}

.first-aid-card{background:linear-gradient(135deg,#f0f9ff,#e0f2fe);border-color:#7dd3fc}
.first-aid-card .type-card-icon{background:#0ea5e9;color:#fff}
.first-aid-card:hover{background:#e0f2fe;border-color:#0ea5e9}

.medical-card{background:linear-gradient(135deg,#eff6ff,#dbeafe);border-color:#93c5fd}
.medical-card .type-card-icon{background:#3b82f6;color:#fff}
.medical-card:hover{background:#dbeafe;border-color:#3b82f6}

.lti-card{background:linear-gradient(135deg,#fef2f2,#fecaca);border-color:#f87171}
.lti-card .type-card-icon{background:#991b1b;color:#fff}
.lti-card:hover{background:#fecaca;border-color:#991b1b}

/* Form Header */
.obs-form-header{display:flex;align-items:center;gap:1rem;padding:1rem 1.25rem;margin:-1.5rem -1.5rem 1.5rem;border-radius:0}
.back-to-types-btn{width:40px;height:40px;border-radius:10px;border:none;background:rgba(255,255,255,0.3);color:inherit;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.1rem;transition:all .2s}
.back-to-types-btn:hover{background:rgba(255,255,255,0.5);transform:translateX(-2px)}
.obs-form-header-content{display:flex;align-items:center;gap:1rem}
.obs-form-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;background:rgba(255,255,255,0.3)}
.obs-form-titles h2{margin:0;font-size:1.3rem;font-weight:700}
.obs-form-titles p{margin:.2rem 0 0;font-size:.85rem;opacity:.85}

/* Themed Headers */
.obs-form-header.near-miss-header{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}
.obs-form-header.unsafe-act-header{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}
.obs-form-header.unsafe-condition-header{background:linear-gradient(135deg,#f97316,#ea580c);color:#fff}
.obs-form-header.positive-header{background:linear-gradient(135deg,#10b981,#059669);color:#fff}
.obs-form-header.environmental-header{background:linear-gradient(135deg,#06b6d4,#0891b2);color:#fff}
.obs-form-header.swa-header{background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff}
.obs-form-header.incident-header{background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff}
.obs-form-header.accident-header{background:linear-gradient(135deg,#dc2626,#b91c1c);color:#fff}
.obs-form-header.damage-header{background:linear-gradient(135deg,#64748b,#475569);color:#fff}
.obs-form-header.first-aid-header{background:linear-gradient(135deg,#0ea5e9,#0284c7);color:#fff}
.obs-form-header.medical-header{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}
.obs-form-header.lti-header{background:linear-gradient(135deg,#991b1b,#7f1d1d);color:#fff}

/* Form Sections */
.obs-form-section{margin-bottom:1.25rem}
.section-divider{display:flex;align-items:center;margin-bottom:1rem;gap:.75rem}
.section-divider span{font-size:.85rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}
.section-divider::after{content:'';flex:1;height:1px;background:linear-gradient(to right,#e2e8f0,transparent)}

.near-miss-divider span{color:#b45309}
.unsafe-act-divider span{color:#b91c1c}
.unsafe-condition-divider span{color:#c2410c}
.positive-divider span{color:#047857}
.environmental-divider span{color:#0891b2}
.injury-divider span{color:#7c3aed}
.swa-divider span{color:#7c3aed}
.incident-divider span{color:#4f46e5}
.accident-divider span{color:#b91c1c}
.damage-divider span{color:#475569}
.first-aid-divider span{color:#0284c7}
.medical-divider span{color:#1d4ed8}
.lti-divider span{color:#7f1d1d}

/* Themed Form Inputs */
.form-group-themed{margin-bottom:1rem}
.form-group-themed label{display:block;font-size:.85rem;font-weight:600;color:#374151;margin-bottom:.4rem}
.form-group-themed label i{margin-right:.4rem;width:16px;text-align:center}
.input-themed,.select-themed,.textarea-themed{width:100%;padding:.65rem .9rem;border:2px solid #e2e8f0;border-radius:8px;font-size:.9rem;background:#fff;transition:all .2s;box-sizing:border-box}
.input-themed:focus,.select-themed:focus,.textarea-themed:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,0.1)}
.textarea-themed{resize:vertical;min-height:60px}

.form-row-themed{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.form-row-themed.triple{grid-template-columns:1fr 1fr 1fr}
@media(max-width:600px){.form-row-themed,.form-row-themed.triple{grid-template-columns:1fr}}

.add-new-btn-themed{width:36px;height:36px;border-radius:8px;border:2px solid #e2e8f0;background:#fff;color:#3b82f6;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
.add-new-btn-themed:hover{background:#3b82f6;color:#fff;border-color:#3b82f6}

/* Type-specific Field Sections */
.obs-type-fields{padding:1rem;border-radius:12px;margin-bottom:1rem}
.near-miss-themed{background:linear-gradient(135deg,rgba(245,158,11,0.08),rgba(251,191,36,0.12));border:1px solid rgba(245,158,11,0.2)}
.unsafe-act-themed{background:linear-gradient(135deg,rgba(239,68,68,0.08),rgba(252,165,165,0.12));border:1px solid rgba(239,68,68,0.2)}
.unsafe-condition-themed{background:linear-gradient(135deg,rgba(249,115,22,0.08),rgba(253,186,116,0.12));border:1px solid rgba(249,115,22,0.2)}
.positive-themed{background:linear-gradient(135deg,rgba(16,185,129,0.08),rgba(167,243,208,0.12));border:1px solid rgba(16,185,129,0.2)}
.environmental-themed{background:linear-gradient(135deg,rgba(6,182,212,0.08),rgba(165,243,252,0.12));border:1px solid rgba(6,182,212,0.2)}
.swa-themed{background:linear-gradient(135deg,rgba(139,92,246,0.08),rgba(196,181,253,0.12));border:1px solid rgba(139,92,246,0.2)}
.incident-themed{background:linear-gradient(135deg,rgba(99,102,241,0.08),rgba(165,180,252,0.12));border:1px solid rgba(99,102,241,0.2)}
.accident-themed{background:linear-gradient(135deg,rgba(220,38,38,0.08),rgba(252,165,165,0.12));border:1px solid rgba(220,38,38,0.2)}
.damage-themed{background:linear-gradient(135deg,rgba(100,116,139,0.08),rgba(203,213,225,0.12));border:1px solid rgba(100,116,139,0.2)}
.first-aid-themed{background:linear-gradient(135deg,rgba(14,165,233,0.08),rgba(125,211,252,0.12));border:1px solid rgba(14,165,233,0.2)}
.medical-themed{background:linear-gradient(135deg,rgba(59,130,246,0.08),rgba(147,197,253,0.12));border:1px solid rgba(59,130,246,0.2)}
.lti-themed{background:linear-gradient(135deg,rgba(153,27,27,0.08),rgba(248,113,113,0.12));border:1px solid rgba(153,27,27,0.2)}

/* Yes/No Button Styles */
.yesno-buttons,.status-buttons{display:flex;gap:.5rem;flex-wrap:wrap}
.yesno-btn,.status-btn{padding:.5rem 1rem;border-radius:8px;border:2px solid #e2e8f0;background:#fff;cursor:pointer;display:flex;align-items:center;gap:.4rem;font-size:.85rem;font-weight:500;transition:all .2s}
.yesno-btn:hover,.status-btn:hover{border-color:#94a3b8}
.yesno-btn.active,.status-btn.active{border-color:#3b82f6;background:#eff6ff;color:#1d4ed8}

/* Severity Buttons */
.severity-buttons-themed{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}
.severity-btn-themed{padding:.6rem .5rem;border-radius:8px;border:2px solid #e2e8f0;background:#fff;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:.3rem;transition:all .2s;font-size:.75rem;font-weight:600}
.severity-btn-themed i{font-size:1.1rem}
.severity-btn-themed.minor{color:#15803d}
.severity-btn-themed.moderate{color:#b45309}
.severity-btn-themed.serious{color:#c2410c}
.severity-btn-themed.catastrophic{color:#b91c1c}
.severity-btn-themed.active.minor{background:#dcfce7;border-color:#22c55e}
.severity-btn-themed.active.moderate{background:#fef3c7;border-color:#f59e0b}
.severity-btn-themed.active.serious{background:#ffedd5;border-color:#f97316}
.severity-btn-themed.active.catastrophic{background:#fee2e2;border-color:#ef4444}

/* Contributing Factors Grid */
.factors-grid-themed{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.5rem}
.factor-chip-themed{display:flex;align-items:center;gap:.5rem;padding:.5rem .7rem;background:#fff;border:1px solid #e2e8f0;border-radius:8px;cursor:pointer;transition:all .2s;font-size:.8rem}
.factor-chip-themed input{display:none}
.factor-chip-themed:has(input:checked){background:#f59e0b;color:#fff;border-color:#f59e0b}
.factor-chip-themed span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Awareness/Stopped/Feedback Buttons */
.awareness-buttons,.stopped-buttons,.feedback-buttons,.containment-buttons{display:flex;gap:.5rem;flex-wrap:wrap}
.awareness-btn,.stopped-btn,.feedback-btn,.containment-btn{padding:.5rem 1rem;border-radius:8px;border:2px solid #e2e8f0;background:#fff;cursor:pointer;display:flex;align-items:center;gap:.4rem;font-size:.85rem;font-weight:500;transition:all .2s}
.awareness-btn:hover,.stopped-btn:hover,.feedback-btn:hover,.containment-btn:hover{border-color:#94a3b8}
.awareness-btn.active,.stopped-btn.active,.feedback-btn.active,.containment-btn.active{border-color:#3b82f6;background:#eff6ff;color:#1d4ed8}

/* Hazard Severity Buttons */
.hazard-severity-buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}
.hazard-sev-btn{padding:.6rem .5rem;border-radius:8px;border:2px solid #e2e8f0;background:#fff;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:.3rem;transition:all .2s;font-size:.75rem;font-weight:600}
.hazard-sev-btn i{font-size:1rem}
.hazard-sev-btn.low{color:#3b82f6}
.hazard-sev-btn.medium{color:#f59e0b}
.hazard-sev-btn.high{color:#f97316}
.hazard-sev-btn.critical{color:#ef4444}
.hazard-sev-btn.active.low{background:#eff6ff;border-color:#3b82f6}
.hazard-sev-btn.active.medium{background:#fef3c7;border-color:#f59e0b}
.hazard-sev-btn.active.high{background:#ffedd5;border-color:#f97316}
.hazard-sev-btn.active.critical{background:#fee2e2;border-color:#ef4444}

/* Person Observed Row */
.person-obs-row{display:flex;gap:.75rem;align-items:center}
.person-obs-row .input-themed{flex:1}
.anonymous-check{display:flex;align-items:center;gap:.4rem;font-size:.85rem;color:#64748b;cursor:pointer;white-space:nowrap}
.anonymous-check input{width:16px;height:16px}

/* Photo Upload Themed */
.file-upload-themed{margin-bottom:1rem}
.file-upload-themed label{display:block;font-size:.85rem;font-weight:600;color:#374151;margin-bottom:.5rem}
.photo-capture-row-themed{display:flex;gap:.75rem}
.take-photo-btn-themed,.upload-photo-btn-themed{flex:1;padding:.7rem;border-radius:8px;border:2px dashed #cbd5e1;background:#f8fafc;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;font-size:.85rem;font-weight:500;color:#64748b;transition:all .2s}
.take-photo-btn-themed:hover,.upload-photo-btn-themed:hover{border-color:#3b82f6;color:#3b82f6;background:#eff6ff}

/* Submit Button Themed */
.submit-btn-themed{width:100%;padding:.9rem 1.5rem;border-radius:10px;border:none;font-size:1rem;font-weight:600;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.75rem;transition:all .2s;margin-top:1rem}
.submit-btn-themed .points-badge{background:rgba(255,255,255,0.25);padding:.2rem .6rem;border-radius:20px;font-size:.8rem}
.submit-btn-themed:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.15)}

/* Submit button colors by theme */
.near-miss-themed ~ .obs-form-section .submit-btn-themed,
#addObservationForm.near-miss-form .submit-btn-themed{background:linear-gradient(135deg,#f59e0b,#d97706)}
#addObservationForm.unsafe-act-form .submit-btn-themed{background:linear-gradient(135deg,#ef4444,#dc2626)}
#addObservationForm.unsafe-condition-form .submit-btn-themed{background:linear-gradient(135deg,#f97316,#ea580c)}
#addObservationForm.positive-form .submit-btn-themed{background:linear-gradient(135deg,#10b981,#059669)}
#addObservationForm.environmental-form .submit-btn-themed{background:linear-gradient(135deg,#06b6d4,#0891b2)}

/* Injury Section Themed */
.injury-section-themed{padding:1rem;border-radius:12px;margin-bottom:1rem;background:linear-gradient(135deg,rgba(124,58,237,0.08),rgba(167,139,250,0.12));border:1px solid rgba(124,58,237,0.2)}

/* Dark Mode for New Observation Form */
body.dark-mode .type-selection-header h2{color:#f1f5f9}
body.dark-mode .type-selection-subtitle{color:#94a3b8}
body.dark-mode .type-card-content p{color:#94a3b8}
body.dark-mode .obs-type-card{background:rgba(30,41,59,0.5)}
body.dark-mode .near-miss-card{background:linear-gradient(135deg,rgba(245,158,11,0.15),rgba(251,191,36,0.1));border-color:rgba(245,158,11,0.4)}
body.dark-mode .unsafe-act-card{background:linear-gradient(135deg,rgba(239,68,68,0.15),rgba(252,165,165,0.1));border-color:rgba(239,68,68,0.4)}
body.dark-mode .unsafe-condition-card{background:linear-gradient(135deg,rgba(249,115,22,0.15),rgba(253,186,116,0.1));border-color:rgba(249,115,22,0.4)}
body.dark-mode .positive-card{background:linear-gradient(135deg,rgba(16,185,129,0.15),rgba(167,243,208,0.1));border-color:rgba(16,185,129,0.4)}
body.dark-mode .environmental-card{background:linear-gradient(135deg,rgba(6,182,212,0.15),rgba(165,243,252,0.1));border-color:rgba(6,182,212,0.4)}
body.dark-mode .form-group-themed label{color:#e2e8f0}
body.dark-mode .input-themed,body.dark-mode .select-themed,body.dark-mode .textarea-themed{background:#1e293b;border-color:#475569;color:#f1f5f9}
body.dark-mode .section-divider span{color:#94a3b8}
body.dark-mode .section-divider::after{background:linear-gradient(to right,#475569,transparent)}
body.dark-mode .severity-btn-themed,body.dark-mode .hazard-sev-btn,body.dark-mode .awareness-btn,body.dark-mode .stopped-btn,body.dark-mode .feedback-btn,body.dark-mode .containment-btn{background:#1e293b;border-color:#475569}
body.dark-mode .factor-chip-themed{background:#1e293b;border-color:#475569;color:#e2e8f0}
body.dark-mode .take-photo-btn-themed,body.dark-mode .upload-photo-btn-themed{background:#1e293b;border-color:#475569;color:#94a3b8}
body.dark-mode .obs-type-fields{background:rgba(30,41,59,0.5)}
body.dark-mode .near-miss-themed{background:linear-gradient(135deg,rgba(245,158,11,0.1),rgba(251,191,36,0.05));border-color:rgba(245,158,11,0.3)}
body.dark-mode .unsafe-act-themed{background:linear-gradient(135deg,rgba(239,68,68,0.1),rgba(252,165,165,0.05));border-color:rgba(239,68,68,0.3)}
body.dark-mode .unsafe-condition-themed{background:linear-gradient(135deg,rgba(249,115,22,0.1),rgba(253,186,116,0.05));border-color:rgba(249,115,22,0.3)}
body.dark-mode .positive-themed{background:linear-gradient(135deg,rgba(16,185,129,0.1),rgba(167,243,208,0.05));border-color:rgba(16,185,129,0.3)}
body.dark-mode .environmental-themed{background:linear-gradient(135deg,rgba(6,182,212,0.1),rgba(165,243,252,0.05));border-color:rgba(6,182,212,0.3)}
body.dark-mode .injury-section-themed{background:linear-gradient(135deg,rgba(124,58,237,0.1),rgba(167,139,250,0.05));border-color:rgba(124,58,237,0.3)}

/* Risk Calculator Styles */
.risk-calculator-container{margin-top:.5rem}
.risk-calc-toggle{display:flex;gap:.5rem;margin-bottom:1rem}
.risk-toggle-btn{flex:1;padding:.6rem .8rem;border-radius:8px;border:2px solid #e2e8f0;background:#f8fafc;font-size:.8rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.4rem;transition:all .2s;color:#64748b}
.risk-toggle-btn.active{background:linear-gradient(135deg,#3b82f6,#2563eb);border-color:#3b82f6;color:#fff}
.risk-toggle-btn:hover:not(.active){border-color:#94a3b8;background:#f1f5f9}
.risk-calculator{background:linear-gradient(135deg,rgba(59,130,246,0.05),rgba(99,102,241,0.08));border:1px solid rgba(59,130,246,0.2);border-radius:12px;padding:1rem}
.risk-matrix-wrapper{display:flex;flex-direction:column;gap:1.25rem}
.risk-input-section{display:flex;flex-direction:column;gap:1rem}
.risk-input-group label{display:block;font-size:.85rem;font-weight:600;color:#374151;margin-bottom:.6rem}
.risk-input-group label i{margin-right:.4rem;color:#6366f1}
.risk-options{display:flex;flex-wrap:wrap;gap:.5rem}
.risk-option-btn{flex:1;min-width:calc(20% - .4rem);padding:.6rem .4rem;border-radius:8px;border:2px solid #e2e8f0;background:#fff;cursor:pointer;text-align:center;transition:all .2s}
.risk-option-btn:hover{border-color:#6366f1;background:rgba(99,102,241,0.05)}
.risk-option-btn.selected{border-color:#6366f1;background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff}
.risk-option-btn .option-label{display:block;font-size:.75rem;font-weight:700;margin-bottom:.15rem}
.risk-option-btn .option-desc{display:block;font-size:.6rem;opacity:.7}
.risk-result-section{display:flex;flex-direction:column;gap:1rem;align-items:center}
.risk-matrix-visual{background:#fff;border-radius:10px;padding:.75rem;box-shadow:0 2px 8px rgba(0,0,0,0.08)}
.matrix-header{font-size:.75rem;font-weight:700;color:#374151;text-align:center;margin-bottom:.5rem}
.risk-matrix-table{border-collapse:collapse;font-size:.65rem}
.risk-matrix-table th,.risk-matrix-table td{width:28px;height:24px;text-align:center;border:1px solid #e2e8f0;font-weight:600}
.risk-matrix-table th{background:#f1f5f9;color:#64748b}
.risk-matrix-table td:first-child{background:#f1f5f9;color:#64748b;font-weight:700}
.risk-matrix-table td.risk-low{background:#dcfce7;color:#166534}
.risk-matrix-table td.risk-med{background:#fef3c7;color:#92400e}
.risk-matrix-table td.risk-high{background:#fee2e2;color:#991b1b}
.risk-matrix-table td.highlighted{box-shadow:inset 0 0 0 3px #1e293b;transform:scale(1.1);position:relative;z-index:5}
.matrix-labels{display:flex;justify-content:space-between;font-size:.6rem;color:#64748b;margin-top:.4rem;padding:0 .25rem}
.matrix-legend{display:flex;gap:.5rem;justify-content:center;margin-top:.5rem}
.legend-item{font-size:.6rem;padding:.2rem .5rem;border-radius:4px;font-weight:600}
.legend-item.risk-low{background:#dcfce7;color:#166534}
.legend-item.risk-med{background:#fef3c7;color:#92400e}
.legend-item.risk-high{background:#fee2e2;color:#991b1b}
.calculated-risk-display{background:#fff;border-radius:10px;padding:1rem 1.5rem;text-align:center;box-shadow:0 2px 8px rgba(0,0,0,0.08);min-width:180px}
.risk-score-label{font-size:.7rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.5px;margin-bottom:.5rem}
.risk-score-value{font-size:1.4rem;font-weight:800;padding:.5rem 1rem;border-radius:8px;display:inline-block}
.risk-score-value.risk-low{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff}
.risk-score-value.risk-med{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}
.risk-score-value.risk-high{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}
.risk-score-value .placeholder-text{font-size:.85rem;font-weight:500;color:#94a3b8}
.risk-manual-select{margin-top:.5rem}

/* Dark Mode Risk Calculator */
body.dark-mode .risk-toggle-btn{background:#1e293b;border-color:#475569;color:#94a3b8}
body.dark-mode .risk-toggle-btn.active{background:linear-gradient(135deg,#3b82f6,#2563eb);border-color:#3b82f6;color:#fff}
body.dark-mode .risk-calculator{background:linear-gradient(135deg,rgba(59,130,246,0.1),rgba(99,102,241,0.15));border-color:rgba(59,130,246,0.3)}
body.dark-mode .risk-option-btn{background:#1e293b;border-color:#475569;color:#e2e8f0}
body.dark-mode .risk-option-btn:hover{border-color:#6366f1;background:rgba(99,102,241,0.15)}
body.dark-mode .risk-option-btn.selected{background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff}
body.dark-mode .risk-input-group label{color:#e2e8f0}
body.dark-mode .risk-matrix-visual{background:#1e293b}
body.dark-mode .matrix-header{color:#e2e8f0}
body.dark-mode .risk-matrix-table th,.dark-mode .risk-matrix-table td:first-child{background:#0f172a;color:#94a3b8;border-color:#475569}
body.dark-mode .risk-matrix-table td{border-color:#475569}
body.dark-mode .calculated-risk-display{background:#1e293b}
body.dark-mode .risk-score-label{color:#94a3b8}
body.dark-mode .risk-score-value .placeholder-text{color:#64748b}

/* Mobile responsive for risk calculator */
@media(max-width:480px){
  .risk-option-btn{min-width:calc(50% - .25rem);padding:.5rem .3rem}
  .risk-option-btn .option-label{font-size:.7rem}
  .risk-option-btn .option-desc{font-size:.55rem}
  .risk-matrix-table th,.risk-matrix-table td{width:24px;height:20px;font-size:.55rem}
  .calculated-risk-display{min-width:150px;padding:.75rem 1rem}
  .risk-score-value{font-size:1.1rem}
}

/* ===== CALENDAR ENHANCEMENTS ===== */
.calendar-smart-filter-bar{background:var(--card-bg);border-radius:var(--radius-card);padding:1rem;border:1px solid var(--card-border);margin-bottom:1rem}
.smart-filter-row{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:.5rem}
.smart-filter-row:last-child{margin-bottom:0}
.smart-filter-row select{flex:1;min-width:120px;padding:.5rem;border-radius:10px;border:1px solid var(--card-border);font-size:.8rem;background:var(--card-bg)}
.date-range-row{justify-content:space-between;align-items:center}
.date-range-btns{display:flex;gap:.25rem}
.date-range-btn{padding:.4rem .8rem;border-radius:8px;border:1px solid var(--card-border);background:var(--surface-soft);font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s}
.date-range-btn.active{background:linear-gradient(90deg,var(--primary-start),var(--primary-end));color:#fff;border-color:transparent}
.date-range-btn:hover:not(.active){background:rgba(59,130,246,0.1);border-color:var(--primary-start)}
.clear-filters-btn{padding:.4rem .8rem;border-radius:8px;border:1px solid #ef4444;background:none;color:#ef4444;font-size:.75rem;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:.3rem;transition:all .2s}
.clear-filters-btn:hover{background:#ef4444;color:#fff}

.view-event-badges{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.risk-level-badge{display:inline-flex;align-items:center;gap:.3rem;padding:.25rem .6rem;border-radius:999px;font-size:.75rem;font-weight:600}
.risk-level-badge.risk-low{background:#dcfce7;color:#16a34a}
.risk-level-badge.risk-medium{background:#fef3c7;color:#d97706}
.risk-level-badge.risk-high{background:#fee2e2;color:#dc2626}
.risk-level-badge i{font-size:.7rem}

.status-pill.status-planned{background:#dbeafe;color:#2563eb}
.status-pill.status-postponed{background:#fed7aa;color:#c2410c}
.status-pill.status-cancelled{background:#e2e8f0;color:#64748b}
.status-pill.status-overdue{background:#fee2e2;color:#dc2626}

.event-completion-details{background:linear-gradient(135deg,rgba(34,197,94,0.05),rgba(22,163,74,0.08));border:1px solid rgba(34,197,94,0.2);border-radius:12px;padding:1rem;margin-top:1rem}
.event-completion-details h4{font-size:.9rem;color:#16a34a;margin-bottom:.75rem;display:flex;align-items:center;gap:.4rem}
.completion-info{display:flex;flex-direction:column;gap:.5rem}
.completion-row{display:flex;gap:.5rem;font-size:.85rem}
.completion-label{font-weight:600;color:var(--text-soft);min-width:120px}
.completion-row a{color:#3b82f6;text-decoration:none}
.completion-row a:hover{text-decoration:underline}

.controls-verified-group{background:linear-gradient(135deg,rgba(239,68,68,0.05),rgba(220,38,38,0.08));border:1px solid rgba(239,68,68,0.2);border-radius:12px;padding:1rem;margin:.5rem 0}
.checkbox-label{display:flex;align-items:flex-start;gap:.6rem;cursor:pointer}
.checkbox-label input[type="checkbox"]{width:18px;height:18px;margin-top:.1rem;accent-color:#dc2626;flex-shrink:0}
.checkbox-label span{font-size:.85rem;line-height:1.4}
.high-risk-warning span{color:#dc2626}
.high-risk-warning span i{margin-right:.3rem}

.btn-postpone{flex:1;padding:.6rem 1rem;border-radius:10px;border:none;background:#f59e0b;color:#fff;font-size:.85rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.4rem}
.btn-cancel-event{flex:1;padding:.6rem 1rem;border-radius:10px;border:none;background:#6b7280;color:#fff;font-size:.85rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.4rem}
.btn-postpone:hover{background:#d97706}
.btn-cancel-event:hover{background:#4b5563}
.btn-complete-submit{background:linear-gradient(90deg,#16a34a,#22c55e)}
.btn-postpone-submit{background:linear-gradient(90deg,#d97706,#f59e0b)}
.btn-cancel-submit{background:linear-gradient(90deg,#4b5563,#6b7280)}

.calendar-event-item.has-recurrence::after{content:"\f01e";font-family:"Font Awesome 6 Free";font-weight:900;font-size:.5rem;margin-left:.2rem}
.calendar-event-item.risk-high-event{border-left:2px solid #ef4444}
.calendar-event-item.risk-medium-event{border-left:2px solid #f59e0b}

body.dark-mode .calendar-smart-filter-bar{background:rgba(15,23,42,0.96)}
body.dark-mode .smart-filter-row select{background:rgba(30,41,59,0.8);color:#e5e7eb;border-color:rgba(148,163,184,0.3)}
body.dark-mode .date-range-btn{background:rgba(30,41,59,0.8);color:#e5e7eb;border-color:rgba(148,163,184,0.3)}
body.dark-mode .date-range-btn:hover:not(.active){background:rgba(59,130,246,0.2)}
body.dark-mode .event-completion-details{background:rgba(34,197,94,0.1);border-color:rgba(34,197,94,0.3)}
body.dark-mode .controls-verified-group{background:rgba(239,68,68,0.1);border-color:rgba(239,68,68,0.3)}

@media(max-width:600px){
  .smart-filter-row select{min-width:100%;flex:none}
  .date-range-row{flex-direction:column;gap:.5rem}
  .date-range-btns{width:100%;justify-content:space-between}
  .clear-filters-btn{width:100%;justify-content:center}
  .view-event-actions{flex-direction:column}
  .view-event-actions button{width:100%}
}

/* AI Safety Assistant Styles */
.obs-analyzer-fab{position:fixed;bottom:6rem;left:1rem;width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#f97316,#ea580c);color:#fff;border:none;box-shadow:0 4px 12px rgba(249,115,22,0.35);cursor:pointer;z-index:45;display:none;align-items:center;justify-content:center;font-size:1rem;transition:transform .2s,box-shadow .2s}
.obs-analyzer-fab.visible{display:flex}
.obs-analyzer-fab:hover{transform:scale(1.1);box-shadow:0 6px 18px rgba(249,115,22,0.45)}
.obs-analyzer-fab.active{background:linear-gradient(135deg,#dc2626,#b91c1c)}
.ai-icon-text{font-family:'Poppins','Segoe UI',sans-serif;font-size:1rem;font-weight:700;letter-spacing:-0.5px;text-shadow:0 1px 2px rgba(0,0,0,0.2)}

.ai-chat-panel{position:fixed;bottom:10rem;left:1rem;width:360px;max-width:calc(100vw - 2rem);height:480px;max-height:calc(100vh - 12rem);background:#fff;border-radius:20px;box-shadow:0 20px 50px rgba(0,0,0,0.25);z-index:46;display:none;flex-direction:column;overflow:hidden}
.ai-chat-panel.open{display:flex}

body.dark-mode .ai-chat-panel{background:#1e293b;border:1px solid rgba(148,163,184,0.2)}

.ai-chat-header{background:linear-gradient(90deg,#f97316,#ea580c);color:#fff;padding:.75rem 1rem;display:flex;align-items:center;justify-content:space-between}
.ai-chat-title{display:flex;align-items:center;gap:.5rem;font-weight:600}
.ai-chat-header-actions{display:flex;align-items:center;gap:.5rem}
.ai-chat-mode-btn{padding:.25rem .6rem;border-radius:12px;border:1px solid rgba(255,255,255,0.3);background:transparent;color:#fff;font-size:.75rem;cursor:pointer;transition:all .2s}
.ai-chat-mode-btn.active{background:rgba(255,255,255,0.25);border-color:#fff}
.ai-chat-close{width:28px;height:28px;border-radius:50%;border:none;background:rgba(255,255,255,0.2);color:#fff;cursor:pointer;font-size:1.2rem;display:flex;align-items:center;justify-content:center}

.ai-chat-body{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.75rem}
.ai-chat-welcome{text-align:center;padding:1.5rem 1rem}
.ai-chat-welcome h4{margin:.5rem 0;color:var(--text-main)}
body.dark-mode .ai-chat-welcome h4{color:#e5e7eb}

.ai-quick-actions{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center}
.ai-quick-btn{padding:.4rem .7rem;border-radius:16px;border:1px solid var(--primary-start);background:transparent;color:var(--primary-start);font-size:.75rem;cursor:pointer;transition:all .2s}
.ai-quick-btn:hover{background:var(--primary-start);color:#fff}

.ai-chat-msg{max-width:85%;padding:.75rem 1rem;border-radius:16px;font-size:.85rem;line-height:1.4}
.ai-chat-msg.user{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.ai-chat-msg.assistant{background:#f1f5f9;color:#334155;align-self:flex-start;border-bottom-left-radius:4px}
body.dark-mode .ai-chat-msg.assistant{background:rgba(51,65,85,0.5);color:#e5e7eb}

.ai-msg-source{margin-top:.5rem;padding:.5rem;background:rgba(59,130,246,0.1);border-radius:8px;font-size:.75rem}
.ai-msg-source-title{font-weight:600;color:#3b82f6;margin-bottom:.25rem}
.ai-msg-source-excerpt{color:#64748b;font-style:italic}
body.dark-mode .ai-msg-source{background:rgba(59,130,246,0.15)}
body.dark-mode .ai-msg-source-excerpt{color:#94a3b8}

.ai-msg-verify{margin-top:.5rem;padding:.4rem .6rem;background:#fef3c7;border-radius:8px;font-size:.75rem;color:#92400e;display:flex;align-items:center;gap:.3rem}
.ai-msg-verify i{color:#f59e0b}

.ai-obs-result{margin-top:.75rem;padding:.75rem;background:#f0fdf4;border-radius:10px;border:1px solid #bbf7d0}
body.dark-mode .ai-obs-result{background:rgba(34,197,94,0.1);border-color:rgba(34,197,94,0.3)}
.ai-obs-type{font-weight:700;color:#16a34a;margin-bottom:.5rem}
.ai-obs-field{margin:.3rem 0;font-size:.8rem}
.ai-obs-field-label{font-weight:600;color:#166534}
body.dark-mode .ai-obs-field-label{color:#4ade80}
.ai-obs-recs{margin-top:.5rem;padding-left:1rem}
.ai-obs-recs li{font-size:.75rem;margin:.2rem 0;color:#374151}
body.dark-mode .ai-obs-recs li{color:#d1d5db}

.ai-chat-input-area{padding:.75rem;border-top:1px solid rgba(0,0,0,0.1)}
body.dark-mode .ai-chat-input-area{border-color:rgba(148,163,184,0.2)}
.ai-chat-input-row{display:flex;gap:.5rem;align-items:flex-end}
.ai-chat-input{flex:1;padding:.6rem .75rem;border-radius:12px;border:1px solid #e2e8f0;font-size:.85rem;resize:none;font-family:inherit}
body.dark-mode .ai-chat-input{background:#0f172a;border-color:rgba(148,163,184,0.3);color:#e5e7eb}
.ai-chat-send{width:40px;height:40px;border-radius:50%;border:none;background:linear-gradient(135deg,#f97316,#ea580c);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ai-chat-send:hover{background:linear-gradient(135deg,#ea580c,#c2410c)}
.ai-chat-send:disabled{background:#94a3b8;cursor:not-allowed}

.ai-typing{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;color:#64748b;font-size:.8rem}
.ai-typing-dots{display:flex;gap:3px}
.ai-typing-dots span{width:6px;height:6px;background:#f97316;border-radius:50%;animation:aiTyping 1.4s infinite ease-in-out both}
.ai-typing-dots span:nth-child(1){animation-delay:-0.32s}
.ai-typing-dots span:nth-child(2){animation-delay:-0.16s}
@keyframes aiTyping{0%,80%,100%{transform:scale(0)}40%{transform:scale(1)}}

/* AI Thinking Process - Expandable Section */
.ai-thinking-section{margin-top:8px;border-radius:8px;overflow:hidden}
.ai-thinking-toggle{display:flex;align-items:center;gap:6px;padding:8px 12px;background:linear-gradient(135deg,#fef3c7,#fde68a);color:#92400e;font-size:0.75rem;font-weight:600;cursor:pointer;border:none;border-radius:8px;transition:all 0.2s ease;width:auto}
.ai-thinking-toggle:hover{background:linear-gradient(135deg,#fde68a,#fcd34d)}
.ai-thinking-toggle i{font-size:0.65rem;transition:transform 0.2s ease}
.ai-thinking-toggle.expanded i{transform:rotate(180deg)}
.ai-thinking-content{max-height:0;overflow:hidden;transition:max-height 0.3s ease;background:#fffbeb;border:1px solid #fde68a;border-top:none;border-radius:0 0 8px 8px}
.ai-thinking-content.expanded{max-height:300px;overflow-y:auto}
.ai-thinking-content-inner{padding:10px 12px;font-size:0.75rem;color:#78350f;line-height:1.5;white-space:pre-wrap;font-family:'Courier New',monospace}
body.dark-mode .ai-thinking-toggle{background:linear-gradient(135deg,#78350f,#92400e);color:#fef3c7}
body.dark-mode .ai-thinking-toggle:hover{background:linear-gradient(135deg,#92400e,#b45309)}
body.dark-mode .ai-thinking-content{background:#451a03;border-color:#78350f}
body.dark-mode .ai-thinking-content-inner{color:#fef3c7}

/* Streaming text effect */
.ai-streaming-text{opacity:1;animation:streamFade 0.3s ease}
@keyframes streamFade{from{opacity:0.5}to{opacity:1}}

@media(max-width:480px){
  .ai-chat-panel{width:calc(100vw - 1.5rem);right:.75rem;bottom:8rem;height:calc(100vh - 10rem)}
  .obs-analyzer-fab{bottom:5.5rem;right:.75rem}
}

/* =====================================================
   USER AI ASSISTANT (Tools Tab)
   ===================================================== */
.tool-card-featured{background:linear-gradient(135deg,rgba(37,99,235,0.1),rgba(59,130,246,0.15))!important;border:2px solid #3b82f6!important;position:relative}
.tool-card-featured::after{content:'AI';position:absolute;top:6px;right:6px;background:linear-gradient(135deg,#2563eb,#3b82f6);color:#fff;font-size:.6rem;font-weight:700;padding:2px 6px;border-radius:8px}

.user-ai-container{background:#fff;border-radius:20px;padding:1.25rem;box-shadow:0 4px 20px rgba(0,0,0,0.08);max-width:100%}
body.dark-mode .user-ai-container{background:#1e293b}

.user-ai-header{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid #e2e8f0}
body.dark-mode .user-ai-header{border-color:rgba(148,163,184,0.2)}

.user-ai-header-icon{width:50px;height:50px;border-radius:14px;background:linear-gradient(135deg,#2563eb,#3b82f6);display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.5rem}

.user-ai-header-text h3{font-size:1.15rem;font-weight:700;color:#1e293b;margin:0}
body.dark-mode .user-ai-header-text h3{color:#e5e7eb}
.user-ai-header-text p{font-size:.8rem;color:#64748b;margin:.25rem 0 0 0}

.user-ai-stats-row{display:flex;gap:.75rem;margin-bottom:1rem;flex-wrap:wrap}
.user-ai-stat{display:flex;align-items:center;gap:.4rem;padding:.4rem .75rem;background:#f1f5f9;border-radius:20px;font-size:.75rem;color:#475569}
body.dark-mode .user-ai-stat{background:rgba(51,65,85,0.5);color:#94a3b8}
.user-ai-stat i{color:#3b82f6}
.user-ai-stat span{font-weight:700;color:#2563eb}
body.dark-mode .user-ai-stat span{color:#60a5fa}

.user-ai-mode-toggle{display:flex;gap:.5rem;margin-bottom:1rem}
.user-ai-mode-btn{flex:1;padding:.65rem 1rem;border:2px solid #e2e8f0;border-radius:12px;background:#fff;cursor:pointer;font-size:.85rem;font-weight:500;color:#64748b;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .2s}
body.dark-mode .user-ai-mode-btn{background:#0f172a;border-color:rgba(148,163,184,0.3);color:#94a3b8}
.user-ai-mode-btn:hover{border-color:#3b82f6}
.user-ai-mode-btn.active{border-color:#2563eb;background:rgba(37,99,235,0.1);color:#2563eb}
body.dark-mode .user-ai-mode-btn.active{background:rgba(37,99,235,0.2);color:#60a5fa}

.user-ai-quick-topics{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;margin-bottom:1rem;padding:.75rem;background:#f8fafc;border-radius:12px}
body.dark-mode .user-ai-quick-topics{background:rgba(30,41,59,0.5)}
.user-ai-quick-topics span{font-size:.75rem;color:#64748b;margin-right:.25rem}
.user-ai-quick-topics button{padding:.35rem .6rem;border-radius:16px;border:1px solid #cbd5e1;background:#fff;color:#475569;font-size:.7rem;cursor:pointer;transition:all .2s}
body.dark-mode .user-ai-quick-topics button{background:rgba(51,65,85,0.5);border-color:rgba(148,163,184,0.3);color:#94a3b8}
.user-ai-quick-topics button:hover{border-color:#3b82f6;color:#2563eb;background:rgba(37,99,235,0.05)}

.user-ai-chat-area{min-height:200px;max-height:350px;overflow-y:auto;border:1px solid #e2e8f0;border-radius:14px;padding:1rem;margin-bottom:1rem;background:#fafbfc;display:flex;flex-direction:column;gap:.75rem}
body.dark-mode .user-ai-chat-area{background:#0f172a;border-color:rgba(148,163,184,0.2)}

.user-ai-welcome{text-align:center;padding:2rem 1rem;color:#64748b}
.user-ai-welcome i{font-size:2.5rem;color:#3b82f6;margin-bottom:.75rem;display:block}
.user-ai-welcome p{margin:0;font-size:.9rem}

.user-ai-msg{padding:.75rem 1rem;border-radius:14px;font-size:.875rem;line-height:1.5;max-width:90%}
.user-ai-msg.user{background:linear-gradient(135deg,#2563eb,#3b82f6);color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.user-ai-msg.assistant{background:#fff;border:1px solid #e2e8f0;align-self:flex-start;border-bottom-left-radius:4px}
body.dark-mode .user-ai-msg.assistant{background:#1e293b;border-color:rgba(148,163,184,0.2);color:#e5e7eb}

.user-ai-thinking{background:linear-gradient(135deg,#f0f9ff,#e0f2fe);padding:.5rem .75rem;border-radius:8px;margin-bottom:.5rem;font-size:.8rem;color:#0369a1;border-left:3px solid #0ea5e9}
body.dark-mode .user-ai-thinking{background:rgba(14,165,233,0.15);color:#38bdf8}

.user-ai-answer{color:#1e293b}
body.dark-mode .user-ai-answer{color:#e5e7eb}

.user-ai-sources{margin-top:.5rem;font-size:.75rem;color:#64748b;padding-top:.5rem;border-top:1px dashed #e2e8f0}
body.dark-mode .user-ai-sources{border-color:rgba(148,163,184,0.2);color:#94a3b8}

.user-ai-obs-header{font-weight:600;color:#2563eb;margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem}
.user-ai-obs-type{margin:.5rem 0;font-weight:500}
.user-ai-violated{background:#fef2f2;padding:.5rem;border-radius:8px;color:#b91c1c;font-size:.8rem;margin:.5rem 0}
body.dark-mode .user-ai-violated{background:rgba(239,68,68,0.15);color:#fca5a5}
.user-ai-quote{background:#fffbeb;padding:.5rem;border-radius:8px;font-style:italic;font-size:.8rem;color:#92400e;margin:.5rem 0}
body.dark-mode .user-ai-quote{background:rgba(245,158,11,0.15);color:#fbbf24}
.user-ai-recs ul{margin:.25rem 0 0 1rem;padding:0;font-size:.8rem}
.user-ai-recs li{margin:.25rem 0}

.user-ai-typing{display:flex;align-items:center;gap:.5rem;color:#64748b;font-size:.8rem}

.user-ai-obs-inputs{display:flex;gap:.5rem;margin-bottom:.5rem}
.user-ai-input-field{flex:1;padding:.5rem .75rem;border:1px solid #e2e8f0;border-radius:10px;font-size:.85rem}
body.dark-mode .user-ai-input-field{background:#0f172a;border-color:rgba(148,163,184,0.3);color:#e5e7eb}

.user-ai-input-row{display:flex;gap:.5rem;align-items:flex-end}
.user-ai-textarea{flex:1;padding:.65rem .85rem;border:1px solid #e2e8f0;border-radius:12px;font-size:.9rem;resize:none;font-family:inherit}
body.dark-mode .user-ai-textarea{background:#0f172a;border-color:rgba(148,163,184,0.3);color:#e5e7eb}
.user-ai-send-btn{width:44px;height:44px;border-radius:12px;border:none;background:linear-gradient(135deg,#2563eb,#3b82f6);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;transition:all .2s}
.user-ai-send-btn:hover{transform:scale(1.05);box-shadow:0 4px 12px rgba(37,99,235,0.3)}

.user-ai-footer{display:flex;align-items:center;justify-content:space-between;margin-top:.75rem;font-size:.75rem;color:#94a3b8}
.user-ai-clear-btn{padding:.35rem .6rem;border:1px solid #e2e8f0;border-radius:8px;background:#fff;color:#64748b;font-size:.7rem;cursor:pointer;display:flex;align-items:center;gap:.3rem}
body.dark-mode .user-ai-clear-btn{background:#1e293b;border-color:rgba(148,163,184,0.2);color:#94a3b8}
.user-ai-clear-btn:hover{border-color:#ef4444;color:#ef4444}

/* =====================================================
   PROFESSIONAL OBSERVATION ANALYZER STYLES
   ===================================================== */
.obs-analyzer-container{background:#fff;border-radius:20px;padding:1.5rem;box-shadow:0 4px 20px rgba(0,0,0,0.08);margin:1rem 0}
body.dark-mode .obs-analyzer-container{background:#1e293b;border:1px solid rgba(148,163,184,0.2)}

.obs-analyzer-header{display:flex;align-items:center;gap:1rem;margin-bottom:1.25rem}
.obs-analyzer-icon{width:56px;height:56px;border-radius:16px;background:linear-gradient(135deg,#f97316,#ea580c);display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.5rem;box-shadow:0 6px 20px rgba(249,115,22,0.35)}
.obs-analyzer-title h3{font-size:1.15rem;font-weight:700;color:#1e293b;margin:0}
body.dark-mode .obs-analyzer-title h3{color:#f1f5f9}
.obs-analyzer-title p{font-size:.85rem;color:#64748b;margin:.2rem 0 0}

.obs-analyzer-intro{background:linear-gradient(135deg,#fff7ed,#ffedd5);border-left:4px solid #f97316;padding:1rem 1.25rem;border-radius:0 12px 12px 0;margin-bottom:1rem;display:flex;align-items:flex-start;gap:.75rem}
body.dark-mode .obs-analyzer-intro{background:rgba(249,115,22,0.1);border-color:#f97316}
.obs-analyzer-intro-icon{color:#ea580c;font-size:1.5rem;flex-shrink:0}
.obs-analyzer-intro p{margin:0;font-size:.9rem;color:#9a3412;line-height:1.5}
body.dark-mode .obs-analyzer-intro p{color:#fdba74}

.obs-analyzer-meta-toggle{margin-bottom:1rem}
.obs-analyzer-toggle-label{display:flex;align-items:center;gap:.5rem;cursor:pointer;font-size:.9rem;color:#475569}
body.dark-mode .obs-analyzer-toggle-label{color:#94a3b8}
.obs-analyzer-toggle-label input[type="checkbox"]{width:18px;height:18px;cursor:pointer}

.obs-analyzer-meta-fields{flex-direction:column;gap:.75rem;margin-bottom:1rem;padding:1rem;background:#f8fafc;border-radius:12px;border:1px solid #e2e8f0}
body.dark-mode .obs-analyzer-meta-fields{background:#0f172a;border-color:rgba(148,163,184,0.2)}
.obs-analyzer-meta-row{display:flex;gap:.75rem}
.obs-analyzer-meta-input{flex:1;padding:.6rem .85rem;border:1px solid #e2e8f0;border-radius:10px;font-size:.9rem;font-family:inherit}
body.dark-mode .obs-analyzer-meta-input{background:#1e293b;border-color:rgba(148,163,184,0.3);color:#e5e7eb}

.obs-analyzer-chat{min-height:280px;max-height:450px;overflow-y:auto;border:1px solid #e2e8f0;border-radius:16px;padding:1rem;margin-bottom:1rem;background:#fafbfc;display:flex;flex-direction:column;gap:1rem}
body.dark-mode .obs-analyzer-chat{background:#0f172a;border-color:rgba(148,163,184,0.2)}

.obs-analyzer-welcome{text-align:center;padding:3rem 1.5rem;color:#64748b}
.obs-analyzer-welcome i{font-size:3rem;color:#f97316;margin-bottom:1rem;display:block}
.obs-analyzer-welcome p{margin:0;font-size:.95rem;max-width:400px;margin:0 auto;line-height:1.5}

.obs-analyzer-msg{display:flex;gap:.75rem;max-width:90%}
.obs-analyzer-msg.user{align-self:flex-end;flex-direction:row-reverse}
.obs-analyzer-msg.assistant{align-self:flex-start}
.obs-analyzer-msg-avatar{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,#f97316,#ea580c);display:flex;align-items:center;justify-content:center;color:#fff;font-size:.9rem;flex-shrink:0}
.obs-analyzer-msg-content{padding:.85rem 1rem;border-radius:16px;font-size:.9rem;line-height:1.6}
.obs-analyzer-msg.user .obs-analyzer-msg-content{background:linear-gradient(135deg,#2563eb,#3b82f6);color:#fff;border-bottom-right-radius:4px}
.obs-analyzer-msg.assistant .obs-analyzer-msg-content{background:#fff;border:1px solid #e2e8f0;color:#1e293b;border-bottom-left-radius:4px}
body.dark-mode .obs-analyzer-msg.assistant .obs-analyzer-msg-content{background:#1e293b;border-color:rgba(148,163,184,0.2);color:#e5e7eb}

.obs-analyzer-typing{display:flex;flex-direction:column;gap:.5rem;padding:1rem 1.25rem;background:linear-gradient(135deg,#fff7ed,#ffedd5);border-radius:16px;font-size:.85rem;color:#9a3412;border:1px solid #fed7aa}
body.dark-mode .obs-analyzer-typing{background:linear-gradient(135deg,rgba(249,115,22,0.15),rgba(234,88,12,0.1));border-color:rgba(249,115,22,0.3);color:#fdba74}
.ai-typing-header{display:flex;align-items:center;gap:.6rem;font-weight:600}
.ai-thinking-icon{font-size:1.25rem;color:#f97316}
.ai-thinking-title{font-size:.95rem;color:#c2410c}
body.dark-mode .ai-thinking-title{color:#fb923c}
.ai-typing-progress{display:flex;align-items:center;gap:.75rem}
.ai-thinking-timer{font-weight:700;color:#ea580c;font-size:.9rem;padding:.2rem .5rem;background:rgba(249,115,22,0.15);border-radius:6px;min-width:32px;text-align:center}
body.dark-mode .ai-thinking-timer{background:rgba(249,115,22,0.25);color:#fb923c}
.streaming-text{line-height:1.6}
.streaming-text::after{content:'|';animation:blink 1s infinite;color:#f97316;font-weight:700}
@keyframes blink{0%,50%{opacity:1}51%,100%{opacity:0}}

.obs-analyzer-standards{background:linear-gradient(135deg,#f0fdf4,#dcfce7);padding:.75rem 1rem;border-radius:12px;margin-top:.5rem}
body.dark-mode .obs-analyzer-standards{background:rgba(34,197,94,0.1)}
.obs-analyzer-standards-title{font-size:.75rem;font-weight:600;color:#166534;margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem}
body.dark-mode .obs-analyzer-standards-title{color:#4ade80}
.obs-analyzer-standard-item{font-size:.8rem;color:#15803d;padding:.25rem 0}
body.dark-mode .obs-analyzer-standard-item{color:#86efac}

.obs-analyzer-actions{display:flex;gap:.75rem;margin-bottom:1rem}
.obs-analyzer-action-btn{flex:1;padding:.75rem 1rem;border-radius:12px;border:none;font-size:.9rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .2s}
.obs-analyzer-action-btn.finalize{background:linear-gradient(135deg,#f97316,#ea580c);color:#fff}
.obs-analyzer-action-btn.finalize:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(249,115,22,0.35)}
.obs-analyzer-action-btn.clear{background:#f1f5f9;color:#64748b;border:1px solid #e2e8f0}
body.dark-mode .obs-analyzer-action-btn.clear{background:#1e293b;border-color:rgba(148,163,184,0.2);color:#94a3b8}
.obs-analyzer-action-btn.clear:hover{border-color:#ef4444;color:#ef4444}

.obs-analyzer-input-row{display:flex;gap:.75rem;align-items:flex-end}
.obs-analyzer-textarea{flex:1;padding:.85rem 1rem;border:1px solid #e2e8f0;border-radius:14px;font-size:.95rem;resize:none;font-family:inherit;line-height:1.5}
body.dark-mode .obs-analyzer-textarea{background:#0f172a;border-color:rgba(148,163,184,0.3);color:#e5e7eb}
.obs-analyzer-textarea:focus{outline:none;border-color:#f97316;box-shadow:0 0 0 3px rgba(249,115,22,0.15)}
.obs-analyzer-obs-btn{width:52px;height:52px;border-radius:14px;border:none;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.15rem;flex-shrink:0;transition:all .2s}
.obs-analyzer-obs-btn:hover{transform:scale(1.05);box-shadow:0 6px 20px rgba(59,130,246,0.35)}
.obs-analyzer-send-btn{width:52px;height:52px;border-radius:14px;border:none;background:linear-gradient(135deg,#f97316,#ea580c);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.15rem;flex-shrink:0;transition:all .2s}
.obs-analyzer-send-btn:hover{transform:scale(1.05);box-shadow:0 6px 20px rgba(249,115,22,0.35)}

.obs-analyzer-footer{margin-top:1rem;font-size:.8rem;color:#94a3b8;text-align:center;display:flex;align-items:center;justify-content:center;gap:.4rem}

/* Toolbar with compact buttons */
.obs-analyzer-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem;gap:.75rem;flex-wrap:wrap}
.obs-analyzer-toolbar-left{display:flex;align-items:center}
.obs-analyzer-toolbar-actions{display:flex;gap:.5rem;align-items:center}
.obs-analyzer-compact-btn{padding:.4rem .75rem;border-radius:8px;border:none;font-size:.75rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.35rem;transition:all .2s}
.obs-analyzer-compact-btn.finalize{background:linear-gradient(135deg,#f97316,#ea580c);color:#fff}
.obs-analyzer-compact-btn.finalize:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(249,115,22,0.3)}
.obs-analyzer-compact-btn.clear{background:#f1f5f9;color:#64748b;border:1px solid #e2e8f0}
body.dark-mode .obs-analyzer-compact-btn.clear{background:#1e293b;border-color:rgba(148,163,184,0.2);color:#94a3b8}
.obs-analyzer-compact-btn.clear:hover{border-color:#ef4444;color:#ef4444}
@media(max-width:480px){.obs-analyzer-compact-btn .btn-text{display:none}}

/* CSM Question Chips */
.obs-analyzer-csm-chips{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-bottom:.75rem;padding:.6rem .75rem;background:#f8fafc;border-radius:10px;border:1px solid #e2e8f0}
body.dark-mode .obs-analyzer-csm-chips{background:#0f172a;border-color:rgba(148,163,184,0.2)}
.csm-chips-label{font-size:.7rem;font-weight:600;color:#64748b;display:flex;align-items:center;gap:.3rem;white-space:nowrap}
body.dark-mode .csm-chips-label{color:#94a3b8}
.csm-chip{padding:.35rem .6rem;border-radius:16px;border:1px solid #e2e8f0;background:#fff;font-size:.7rem;font-weight:500;color:#475569;cursor:pointer;display:flex;align-items:center;gap:.3rem;transition:all .2s;white-space:nowrap}
body.dark-mode .csm-chip{background:#1e293b;border-color:rgba(148,163,184,0.2);color:#94a3b8}
.csm-chip:hover{background:#2563eb;border-color:#2563eb;color:#fff;transform:translateY(-1px)}
.csm-chip i{font-size:.65rem}

/* CSM Response Styling */
.csm-response .obs-analyzer-msg-content{background:linear-gradient(135deg,#eff6ff,#dbeafe);border:1px solid #93c5fd}
body.dark-mode .csm-response .obs-analyzer-msg-content{background:rgba(59,130,246,0.15);border-color:rgba(59,130,246,0.3)}
.csm-avatar{background:#2563eb !important}
.csm-response-label{font-size:.7rem;font-weight:600;color:#2563eb;display:flex;align-items:center;gap:.3rem;margin-bottom:.5rem;padding-bottom:.5rem;border-bottom:1px dashed #93c5fd}
body.dark-mode .csm-response-label{color:#60a5fa;border-color:rgba(96,165,250,0.3)}
.csm-citations{background:linear-gradient(135deg,#eff6ff,#dbeafe) !important}
body.dark-mode .csm-citations{background:rgba(59,130,246,0.1) !important}
.csm-citations .obs-analyzer-standards-title{color:#2563eb !important}
body.dark-mode .csm-citations .obs-analyzer-standards-title{color:#60a5fa !important}

/* Clickable CSM Standards */
.csm-clickable{cursor:pointer;transition:all .2s;padding:.4rem .6rem;margin:.25rem 0;border-radius:8px;background:rgba(37,99,235,0.05);border:1px solid transparent}
.csm-clickable:hover{background:rgba(37,99,235,0.15);border-color:#93c5fd;transform:translateX(4px)}
body.dark-mode .csm-clickable:hover{background:rgba(96,165,250,0.15);border-color:rgba(96,165,250,0.4)}
.csm-link-icon{font-size:.65rem;color:#3b82f6;margin-right:.35rem;opacity:.7}
.csm-clickable:hover .csm-link-icon{opacity:1}
.csm-link-hint{font-size:.65rem;font-weight:400;opacity:.7;margin-left:.35rem}
body.dark-mode .csm-link-hint{color:#94a3b8}

/* Report Header Actions (Print/Download) */
.obs-report-actions{margin-left:auto;display:flex;gap:.4rem}
.obs-report-action-btn{width:32px;height:32px;border-radius:8px;border:1px solid #fed7aa;background:#fff7ed;color:#ea580c;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.85rem;transition:all .2s}
body.dark-mode .obs-report-action-btn{background:rgba(249,115,22,0.1);border-color:rgba(249,115,22,0.3)}
.obs-report-action-btn:hover{background:#f97316;border-color:#f97316;color:#fff;transform:scale(1.05)}

/* Professional Report Styles */
.obs-analyzer-report{background:#fff;border:2px solid #f97316;border-radius:16px;padding:1.25rem;margin-top:1rem}
body.dark-mode .obs-analyzer-report{background:#1e293b}
.obs-analyzer-report-header{display:flex;align-items:center;gap:.6rem;padding-bottom:.75rem;margin-bottom:1rem;border-bottom:2px solid #fed7aa}
body.dark-mode .obs-analyzer-report-header{border-color:rgba(249,115,22,0.3)}
.obs-analyzer-report-header i{font-size:1.25rem;color:#ea580c}
.obs-analyzer-report-header h4{margin:0;font-size:1.05rem;font-weight:700;color:#9a3412}
body.dark-mode .obs-analyzer-report-header h4{color:#fb923c}

.obs-report-section{margin-bottom:1rem}
.obs-report-label{font-size:.75rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.4rem;display:flex;align-items:center;gap:.4rem}
body.dark-mode .obs-report-label{color:#94a3b8}
.obs-report-content{font-size:.95rem;color:#1e293b;line-height:1.6}
body.dark-mode .obs-report-content{color:#e5e7eb}

.obs-report-type{padding:.5rem .75rem;background:#f8fafc;border-radius:8px}
body.dark-mode .obs-report-type{background:#0f172a}

.obs-report-violation{background:#fef2f2;padding:.75rem;border-radius:10px;margin-bottom:.5rem}
body.dark-mode .obs-report-violation{background:rgba(239,68,68,0.1)}
.obs-violation-citation{font-weight:700;color:#b91c1c;font-size:.85rem;margin-bottom:.35rem}
body.dark-mode .obs-violation-citation{color:#fca5a5}
.obs-violation-requirement{font-style:italic;color:#7f1d1d;font-size:.85rem;padding:.5rem;background:rgba(255,255,255,0.5);border-radius:6px;margin:.35rem 0}
body.dark-mode .obs-violation-requirement{color:#fecaca;background:rgba(0,0,0,0.2)}
.obs-violation-how{font-size:.8rem;color:#991b1b;margin-top:.35rem;display:flex;align-items:flex-start;gap:.35rem}
body.dark-mode .obs-violation-how{color:#fca5a5}

.obs-report-recs{display:flex;flex-direction:column;gap:.5rem}
.obs-report-rec{display:flex;gap:.6rem;align-items:flex-start;padding:.5rem;background:#f8fafc;border-radius:8px}
body.dark-mode .obs-report-rec{background:#0f172a}
.obs-rec-num{width:24px;height:24px;border-radius:6px;background:linear-gradient(135deg,#f97316,#ea580c);color:#fff;font-size:.75rem;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.obs-rec-content{flex:1}
.obs-rec-action{font-size:.9rem;color:#1e293b;line-height:1.4}
body.dark-mode .obs-rec-action{color:#e5e7eb}
.obs-rec-meta{font-size:.75rem;color:#64748b;margin-top:.25rem}
body.dark-mode .obs-rec-meta{color:#94a3b8}

.obs-report-lesson{padding:.75rem;background:linear-gradient(135deg,#fffbeb,#fef3c7);border-radius:10px;font-size:.9rem;color:#92400e;line-height:1.5;border-left:3px solid #f59e0b}
body.dark-mode .obs-report-lesson{background:rgba(245,158,11,0.15);color:#fcd34d}

.obs-report-followup{background:linear-gradient(135deg,#fee2e2,#fecaca);padding:.6rem 1rem;border-radius:8px;font-size:.85rem;color:#b91c1c;display:flex;align-items:center;gap:.5rem;font-weight:600;margin-top:.5rem}
body.dark-mode .obs-report-followup{background:rgba(239,68,68,0.2);color:#fca5a5}

/* ========== CSM Excavation Safety Tool Styles ========== */
.exc-tool-wrap{max-width:100%;margin:0 auto}
.exc-tool-note{color:#64748b;font-size:.8rem;line-height:1.4;margin-bottom:1rem;padding:.75rem 1rem;background:#f8fafc;border-radius:12px;border-left:3px solid #f59e0b}
body.dark-mode .exc-tool-note{background:#0f172a;color:#94a3b8}
.exc-tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:980px){.exc-tool-grid{grid-template-columns:1fr}}
.exc-tool-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:16px;padding:1rem;box-shadow:0 4px 12px rgba(15,23,42,0.06)}
body.dark-mode .exc-tool-card{background:#1e293b;border-color:rgba(148,163,184,0.2)}
.exc-tool-card h3{font-size:1rem;font-weight:700;margin:0 0 .75rem 0;display:flex;align-items:center;gap:.5rem}
.exc-tool-card h3 i{color:#f59e0b}
.exc-tool-card h4{font-size:.85rem;font-weight:600;margin:1rem 0 .5rem 0;color:#475569}
body.dark-mode .exc-tool-card h4{color:#94a3b8}
.exc-tool-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
@media(max-width:680px){.exc-tool-row{grid-template-columns:1fr}}
.exc-tool-row label{display:block;font-size:.75rem;color:#64748b;margin-bottom:.25rem}
body.dark-mode .exc-tool-row label{color:#94a3b8}
.exc-tool-row input,.exc-tool-row select{width:100%;padding:.6rem .75rem;border:1px solid #e2e8f0;border-radius:10px;font-size:.9rem;background:#fff}
body.dark-mode .exc-tool-row input,body.dark-mode .exc-tool-row select{background:#0f172a;border-color:rgba(148,163,184,0.3);color:#e5e7eb}
.exc-tool-mini{font-size:.7rem;color:#64748b;margin-top:.2rem}
body.dark-mode .exc-tool-mini{color:#94a3b8}
.exc-tool-hr{height:1px;background:#e2e8f0;margin:1rem 0}
body.dark-mode .exc-tool-hr{background:rgba(148,163,184,0.2)}
.exc-tool-status-box{border-radius:12px;border:1px dashed #e2e8f0;padding:.75rem;background:#f8fafc}
body.dark-mode .exc-tool-status-box{background:#0f172a;border-color:rgba(148,163,184,0.3)}
.exc-tool-badge{display:inline-flex;align-items:center;gap:.4rem;border-radius:999px;padding:.4rem .75rem;font-weight:700;font-size:.8rem}
.exc-badge-green{background:#dcfce7;color:#065f46}
body.dark-mode .exc-badge-green{background:rgba(34,197,94,0.2);color:#4ade80}
.exc-badge-yellow{background:#fef3c7;color:#92400e}
body.dark-mode .exc-badge-yellow{background:rgba(245,158,11,0.2);color:#fbbf24}
.exc-badge-red{background:#fee2e2;color:#991b1b}
body.dark-mode .exc-badge-red{background:rgba(239,68,68,0.2);color:#fca5a5}
.exc-badge-blue{background:#dbeafe;color:#1e40af}
body.dark-mode .exc-badge-blue{background:rgba(59,130,246,0.2);color:#60a5fa}
.exc-tool-kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin:.75rem 0}
@media(max-width:680px){.exc-tool-kpi{grid-template-columns:1fr}}
.exc-kpi-box{border:1px solid #e2e8f0;border-radius:12px;padding:.75rem;background:#fff}
body.dark-mode .exc-kpi-box{background:#1e293b;border-color:rgba(148,163,184,0.2)}
.exc-kpi-box b{display:block;font-size:.8rem;margin-bottom:.35rem;color:#475569}
body.dark-mode .exc-kpi-box b{color:#94a3b8}
.exc-tool-checklist{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}
@media(max-width:680px){.exc-tool-checklist{grid-template-columns:1fr}}
.exc-check{display:flex;gap:.6rem;align-items:flex-start;border:1px solid #e2e8f0;border-radius:10px;padding:.65rem;background:#fff}
body.dark-mode .exc-check{background:#1e293b;border-color:rgba(148,163,184,0.2)}
.exc-check input[type="checkbox"]{width:18px;height:18px;margin-top:.1rem;accent-color:#f59e0b;flex-shrink:0}
.exc-check b{font-size:.85rem;display:block}
.exc-check .exc-tool-mini{margin-top:.15rem}
.exc-tool-lock{opacity:.5;pointer-events:none}
.exc-svg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}
@media(max-width:900px){.exc-svg-grid{grid-template-columns:1fr}}
.exc-svg-card{border:1px solid #e2e8f0;border-radius:12px;background:#fff;padding:.75rem}
body.dark-mode .exc-svg-card{background:#1e293b;border-color:rgba(148,163,184,0.2)}
.exc-svg-title{display:flex;justify-content:space-between;align-items:flex-start;gap:.5rem;margin-bottom:.5rem;flex-wrap:wrap}
.exc-svg-title b{font-size:.85rem}
.exc-ar{direction:rtl;font-family:Tahoma,Arial,sans-serif;color:#64748b;font-size:.75rem;margin-top:.5rem}
body.dark-mode .exc-ar{color:#94a3b8}
.exc-tool-issues{margin:.75rem 0;padding-left:1.25rem}
.exc-tool-issues li{margin:.4rem 0;font-size:.85rem}
.exc-tool-btnbar{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:.75rem;align-items:center}
.exc-btn-primary{border:0;border-radius:12px;padding:.65rem 1rem;font-weight:700;cursor:pointer;background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;font-size:.9rem;display:flex;align-items:center;gap:.4rem}
.exc-btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(37,99,235,0.3)}
.exc-btn-ghost{border:1px solid #e2e8f0;border-radius:12px;padding:.65rem 1rem;font-weight:700;cursor:pointer;background:#fff;color:#1e293b;font-size:.9rem;display:flex;align-items:center;gap:.4rem}
body.dark-mode .exc-btn-ghost{background:#1e293b;border-color:rgba(148,163,184,0.2);color:#e5e7eb}
.exc-btn-ghost:hover{background:#f1f5f9}
body.dark-mode .exc-btn-ghost:hover{background:#334155}
.exc-btn-danger{border:0;border-radius:12px;padding:.65rem 1rem;font-weight:700;cursor:pointer;background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;font-size:.9rem;display:flex;align-items:center;gap:.4rem}
.exc-btn-danger:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(239,68,68,0.3)}
.exc-tool-textarea{width:100%;min-height:80px;padding:.75rem;border:1px solid #e2e8f0;border-radius:10px;resize:vertical;font-size:.85rem;font-family:inherit}
body.dark-mode .exc-tool-textarea{background:#0f172a;border-color:rgba(148,163,184,0.3);color:#e5e7eb}
.exc-tag-print{width:100%;max-width:860px;margin:1rem auto 0;display:none}
.exc-tag-card{border:2px solid #1e293b;border-radius:16px;padding:1rem;background:#fff}
body.dark-mode .exc-tag-card{background:#1e293b;border-color:#f59e0b}
.exc-tag-top{display:flex;justify-content:space-between;align-items:center;gap:.75rem;flex-wrap:wrap}
.exc-tag-top h3{margin:0;font-size:1.1rem}
.exc-tag-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-top:.75rem}
.exc-tag-field{border:1px solid #1e293b;border-radius:10px;padding:.75rem}
body.dark-mode .exc-tag-field{border-color:rgba(148,163,184,0.3)}
.exc-tag-field b{display:block;font-size:.75rem;color:#64748b}
body.dark-mode .exc-tag-field b{color:#94a3b8}
.exc-tag-field span{display:block;margin-top:.35rem;font-size:.9rem;word-break:break-word}
@media print{.exc-no-print{display:none !important}.exc-tag-print{display:block !important}.exc-tool-card{box-shadow:none}}

/* RTL (Right-to-Left) Support for Arabic, Urdu, and other RTL languages */
.rtl-text,.obs-analyzer-msg-content.rtl{direction:rtl;text-align:right;unicode-bidi:plaintext;font-family:Tahoma,'Segoe UI',Arial,sans-serif}
.obs-analyzer-msg-content.rtl{padding:.85rem 1.1rem;line-height:1.8}
.obs-analyzer-msg.assistant.rtl{flex-direction:row-reverse}
.obs-analyzer-msg.user.rtl{flex-direction:row}
.csm-response.rtl .obs-analyzer-msg-content{direction:rtl;text-align:right}
/* Keep citations LTR even in RTL context */
.rtl-text .csm-citation,.obs-analyzer-msg-content.rtl strong{direction:ltr;unicode-bidi:embed}
/* Mixed content handling */
.mixed-dir{unicode-bidi:plaintext}
/* RTL chat container */
.obs-analyzer-chat.rtl-mode{direction:rtl}
.obs-analyzer-chat.rtl-mode .obs-analyzer-msg.user{flex-direction:row}
.obs-analyzer-chat.rtl-mode .obs-analyzer-msg.assistant{flex-direction:row-reverse}

/* ========== MOBILE OPTIMIZATIONS ========== */
/* Comprehensive mobile-only styles for better space utilization */

@media (max-width:768px){
  /* Areas Grid - Scrollable container with limited height */
  .areas-grid-content{max-height:180px;overflow-y:auto;-webkit-overflow-scrolling:touch;scroll-behavior:smooth}
  .areas-grid-content::-webkit-scrollbar{width:4px}
  .areas-grid-content::-webkit-scrollbar-track{background:rgba(0,0,0,0.05);border-radius:4px}
  .areas-grid-content::-webkit-scrollbar-thumb{background:rgba(99,102,241,0.3);border-radius:4px}
  .areas-grid-content::-webkit-scrollbar-thumb:hover{background:rgba(99,102,241,0.5)}
  
  /* Smaller area cards on mobile */
  .areas-grid-content{grid-template-columns:repeat(auto-fill,minmax(85px,1fr));gap:.4rem;padding:.5rem}
  .area-btn{padding:.4rem .3rem;font-size:.65rem;border-radius:8px;min-height:unset}
  .area-btn .area-count{font-size:.55rem;padding:.1rem .25rem;min-width:16px;height:16px;top:-4px;right:-4px}
  
  /* Areas grid toggle compact */
  .areas-grid-toggle{padding:.5rem .6rem}
  .areas-grid-toggle-title{font-size:.75rem}
  .areas-grid-toggle-arrow{width:20px;height:20px}
  .areas-grid-toggle-arrow i{font-size:.6rem}
  .areas-grid-clear{font-size:.65rem;padding:.2rem .4rem}
  
  /* Compact filter sections - using actual class names */
  .obs-filter-row{gap:.35rem;margin-bottom:.4rem}
  .obs-filter-row select,.obs-filter-row input[type="text"]{padding:.35rem .5rem;font-size:.7rem;height:30px}
  
  /* Summary bar compact - using actual class names */
  .obs-summary-bar{gap:.4rem;margin-bottom:.6rem}
  .obs-summary-item{padding:.45rem .5rem;border-radius:12px}
  .obs-summary-value{font-size:1rem}
  .obs-summary-label{font-size:.55rem}
  
  /* Observation/Permit/Equipment list cards compact */
  .obs-list .observation-card{padding:.6rem;margin-bottom:.5rem;border-radius:10px}
  
  /* Form elements compact */
  .form-group{margin-bottom:.6rem}
  .form-group label{font-size:.75rem;margin-bottom:.25rem}
  .input-themed,.select-themed,.textarea-themed{padding:.5rem .6rem;font-size:.8rem}
  .textarea-themed{min-height:60px}
  
  /* Hero section compact */
  .home-stats-row{gap:.4rem}
  .stat-card,.home-stat-card{padding:.5rem;border-radius:10px}
  .stat-value,.home-stat-value{font-size:1.1rem}
  .stat-label,.home-stat-label{font-size:.55rem}
  
  /* Quick actions compact */
  .home-quick-actions{gap:.4rem;padding:.5rem}
  .home-quick-action{padding:.5rem;font-size:.6rem;border-radius:10px}
  .home-quick-action i{font-size:.9rem}
  
  /* Weather widget compact */
  .weather-info{padding:.5rem .75rem}
  
  /* TBT section compact */
  .tbt-widget{padding:.6rem}
  
  /* Tools tab compact */
  .tools-category{margin-bottom:.6rem}
  .tools-category-header{padding:.6rem .75rem;font-size:.75rem}
  .tools-category-header i{width:24px;height:24px;font-size:.7rem}
  .tool-card{padding:.5rem}
  .tool-card-icon-wrap{width:36px;height:36px;font-size:.85rem}
  .tool-card-title{font-size:.7rem}
  .tool-card-desc{font-size:.6rem}
  
  /* More menu compact */
  .more-menu{bottom:65px}
  .more-menu-item{padding:.6rem .75rem;font-size:.8rem}
  .more-menu-item i{width:28px;height:28px;font-size:.8rem}
  
  /* Bottom navigation spacing */
  .main-content{padding-bottom:75px}
  .tab-content{padding-bottom:20px}
}

@media (max-width:480px){
  /* Extra small screens - even more compact */
  .areas-grid-content{max-height:150px;grid-template-columns:repeat(3,1fr);gap:.35rem;padding:.4rem}
  .area-btn{padding:.35rem .25rem;font-size:.6rem;border-radius:6px}
  .area-btn .area-count{font-size:.5rem;padding:.08rem .2rem;min-width:14px;height:14px;top:-3px;right:-3px}
  
  /* Even more compact summary bar */
  .obs-summary-item{padding:.35rem .4rem;border-radius:10px}
  .obs-summary-value{font-size:.9rem}
  .obs-summary-label{font-size:.5rem}
  
  /* Filter row ultra-compact */
  .obs-filter-row select,.obs-filter-row input[type="text"]{padding:.3rem .4rem;font-size:.65rem;height:28px}
  
  /* Hero ultra-compact */
  .home-stats-row{gap:.3rem}
  .stat-card,.home-stat-card{padding:.4rem}
  .stat-value,.home-stat-value{font-size:.95rem}
  .stat-label,.home-stat-label{font-size:.5rem}
  
  /* Quick actions 2x2 grid on very small screens */
  .home-quick-actions{grid-template-columns:repeat(2,1fr)}
  .home-quick-action{padding:.4rem;font-size:.55rem}
  .home-quick-action i{font-size:.8rem}
  
  /* Tools even more compact */
  .tool-card-icon-wrap{width:32px;height:32px;font-size:.75rem}
  .tool-card-title{font-size:.65rem}
  .tool-card-desc{display:none}
}

/* Dark mode mobile scrollbar */
body.dark-mode .areas-grid-content::-webkit-scrollbar-track{background:rgba(255,255,255,0.05)}
body.dark-mode .areas-grid-content::-webkit-scrollbar-thumb{background:rgba(139,92,246,0.4)}
body.dark-mode .areas-grid-content::-webkit-scrollbar-thumb:hover{background:rgba(139,92,246,0.6)}

/* ============================================
   CSM LIFTING SAFETY TOOL
   ============================================ */
.lifting-tool-wrap{display:flex;flex-direction:column;gap:1rem}
.lifting-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:900px){.lifting-grid{grid-template-columns:1fr}}
.lifting-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius-card);padding:1.25rem;box-shadow:var(--shadow-soft)}
.lifting-card h4{font-size:1rem;font-weight:700;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem;color:var(--primary-start)}
.lifting-card h4 i{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--primary-start),var(--primary-end));color:#fff;border-radius:8px;font-size:.8rem;flex-shrink:0;overflow:hidden}
.lifting-card h5{font-size:.85rem;font-weight:600;margin:.75rem 0 .5rem;display:flex;align-items:center;gap:.4rem;color:#475569}
.lifting-card h5 i{color:var(--primary-start)}
.lifting-divider{height:1px;background:linear-gradient(90deg,transparent,var(--card-border),transparent);margin:1rem 0}
.lifting-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:.75rem}
@media(max-width:600px){.lifting-row{grid-template-columns:1fr}}
.lifting-field{display:flex;flex-direction:column;gap:.25rem}
.lifting-field label{font-size:.75rem;font-weight:600;color:#64748b}
.lifting-field input,.lifting-field select{padding:.5rem .75rem;border:1px solid rgba(148,163,184,0.3);border-radius:8px;font-size:.85rem;transition:border-color .2s,box-shadow .2s}
.lifting-field input:focus,.lifting-field select:focus{outline:none;border-color:var(--primary-start);box-shadow:0 0 0 3px rgba(0,123,143,0.1)}
.lifting-hint{font-size:.7rem;color:#94a3b8;margin-top:.15rem}
.lifting-checks{display:flex;flex-direction:column;gap:.5rem}
.lifting-check{display:flex;align-items:flex-start;gap:.5rem;cursor:pointer;padding:.4rem .6rem;border-radius:8px;transition:background .2s}
.lifting-check:hover{background:rgba(0,123,143,0.05)}
.lifting-check input[type="checkbox"]{width:18px;height:18px;margin-top:.1rem;accent-color:var(--primary-start);flex-shrink:0}
.lifting-check span{display:flex;flex-direction:column;gap:.1rem}
.lifting-check span b{font-size:.8rem;font-weight:600;color:#1e293b}
.lifting-check span small{font-size:.65rem;color:#94a3b8}
.lifting-status-box{padding:.6rem .8rem;border-radius:8px;background:#f1f5f9;font-size:.8rem;display:flex;align-items:center;gap:.5rem;margin-top:.5rem}
.lifting-status-box b{color:#475569}
.lifting-status-box.status-ok{background:#dcfce7;border:1px solid #22c55e}
.lifting-status-box.status-ok b{color:#15803d}
.lifting-status-box.status-fail{background:#fee2e2;border:1px solid #ef4444}
.lifting-status-box.status-fail b{color:#dc2626}
.text-green{color:#16a34a;font-weight:600}
.text-red{color:#dc2626;font-weight:600}
.lifting-kpi-row{display:flex;gap:.75rem;flex-wrap:wrap;margin-bottom:1rem}
.lifting-kpi-box{flex:1;min-width:100px;background:#f8fafc;border:1px solid var(--card-border);border-radius:10px;padding:.6rem .8rem;display:flex;flex-direction:column;gap:.25rem;text-align:center}
.lifting-kpi-label{font-size:.65rem;font-weight:600;color:#64748b;text-transform:uppercase}
.lifting-badge{display:inline-block;padding:.25rem .6rem;border-radius:6px;font-size:.75rem;font-weight:700;text-transform:uppercase}
.lifting-badge.pending{background:#e2e8f0;color:#64748b}
.lifting-badge.success{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff}
.lifting-badge.warning{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}
.lifting-badge.danger{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}
.lifting-badge.hold{background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff}
.lifting-actions-card{background:linear-gradient(135deg,#f0f9ff,#f5f3ff);border:2px solid rgba(99,102,241,0.2)}
.lifting-btn-bar{display:flex;gap:.75rem;flex-wrap:wrap;align-items:center;margin-bottom:1rem}
.lifting-btn{padding:.6rem 1.25rem;border-radius:10px;border:none;font-size:.85rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.4rem;transition:all .2s}
.lifting-btn.primary{background:linear-gradient(135deg,var(--primary-start),var(--primary-end));color:#fff;box-shadow:0 4px 12px rgba(0,123,143,0.3)}
.lifting-btn.primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,123,143,0.4)}
.lifting-btn.secondary{background:#fff;color:var(--primary-start);border:2px solid var(--primary-start)}
.lifting-btn.secondary:hover{background:var(--primary-start);color:#fff}
.lifting-btn.danger{background:#fff;color:#dc2626;border:2px solid #dc2626}
.lifting-btn.danger:hover{background:#dc2626;color:#fff}
.lifting-result-box{background:#fff;border:1px solid var(--card-border);border-radius:12px;padding:1rem;min-height:80px}
.lifting-result-placeholder{color:#94a3b8;font-size:.85rem;text-align:center;padding:1.5rem}
.lifting-result-section{padding:.75rem;border-radius:8px;margin-bottom:.5rem}
.lifting-result-section:last-child{margin-bottom:0}
.lifting-result-section h5{font-size:.85rem;font-weight:700;margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem}
.lifting-result-section ul{margin:0;padding-left:1.25rem}
.lifting-result-section li{font-size:.8rem;margin-bottom:.25rem}
.lifting-result-section.hold{background:#eef2ff;border:1px solid #6366f1}
.lifting-result-section.hold h5{color:#4f46e5}
.lifting-result-section.issues{background:#fef2f2;border:1px solid #ef4444}
.lifting-result-section.issues h5{color:#dc2626}
.lifting-result-section.notes{background:#fffbeb;border:1px solid #f59e0b}
.lifting-result-section.notes h5{color:#d97706}
.lifting-result-section.go{background:#dcfce7;border:1px solid #22c55e}
.lifting-result-section.go h5{color:#16a34a}
.lifting-audit-section{margin-top:1rem}
.lifting-audit-section label{font-size:.8rem;font-weight:600;color:#475569;display:flex;align-items:center;gap:.4rem;margin-bottom:.4rem}
.lifting-audit-section textarea{width:100%;padding:.75rem;border:1px solid var(--card-border);border-radius:10px;font-size:.8rem;font-family:monospace;resize:vertical;background:#f8fafc}
.lifting-svg-container{background:#f8fafc;border-radius:12px;padding:.5rem;overflow-x:auto}
.lifting-svg-container svg{display:block;max-width:100%;height:auto}
.lifting-print-area{display:none}
.lifting-tag-card{border:3px solid #0f172a;border-radius:12px;padding:1.5rem;max-width:600px;margin:0 auto;background:#fff}
.lifting-tag-header{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid #0f172a;padding-bottom:.75rem;margin-bottom:1rem}
.lifting-tag-header h2{margin:0;font-size:1.5rem;font-weight:800}
.lifting-tag-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.lifting-tag-field{padding:.5rem .75rem;background:#f1f5f9;border-radius:6px}
.lifting-tag-field b{display:block;font-size:.7rem;color:#64748b;margin-bottom:.2rem}
.lifting-tag-field span{font-size:.9rem;font-weight:600;color:#1e293b}
.lifting-tag-field.full-width{grid-column:1 / -1}

/* Orange icon wrap for Lifting tool card */
.tool-card-icon-wrap.orange{background:linear-gradient(135deg,#f97316,#ea580c);color:#fff}

/* Dark mode lifting tool */
body.dark-mode .lifting-card{background:rgba(15,23,42,0.96);border-color:rgba(148,163,184,0.2);color:#e5e7eb}
body.dark-mode .lifting-card h4{color:#38bdf8}
body.dark-mode .lifting-card h5{color:#94a3b8}
body.dark-mode .lifting-field label{color:#94a3b8}
body.dark-mode .lifting-check span b{color:#e5e7eb}
body.dark-mode .lifting-status-box{background:rgba(30,41,59,0.8);border-color:rgba(148,163,184,0.2)}
body.dark-mode .lifting-status-box b{color:#94a3b8}
body.dark-mode .lifting-kpi-box{background:rgba(30,41,59,0.8);border-color:rgba(148,163,184,0.2)}
body.dark-mode .lifting-kpi-label{color:#94a3b8}
body.dark-mode .lifting-actions-card{background:linear-gradient(135deg,rgba(30,41,59,0.9),rgba(15,23,42,0.95));border-color:rgba(99,102,241,0.3)}
body.dark-mode .lifting-result-box{background:rgba(15,23,42,0.8);border-color:rgba(148,163,184,0.2)}
body.dark-mode .lifting-result-placeholder{color:#64748b}
body.dark-mode .lifting-audit-section textarea{background:rgba(15,23,42,0.8);color:#e5e7eb;border-color:rgba(148,163,184,0.3)}
body.dark-mode .lifting-svg-container{background:rgba(30,41,59,0.8)}
body.dark-mode .lifting-svg-container svg rect:first-child{fill:#1e293b}
body.dark-mode .lifting-svg-container svg rect:nth-child(2){fill:#334155}

/* ===== Phase 1/3: pagination controls + mobile registry polish ===== */
.obs-pager{display:flex;align-items:center;justify-content:center;gap:14px;padding:16px 8px;flex-wrap:wrap}
.obs-pager-btn{display:inline-flex;align-items:center;gap:6px;background:var(--primary,#0f5cad);color:#fff;border:none;border-radius:8px;padding:9px 16px;font-size:14px;font-weight:600;cursor:pointer;min-height:40px}
.obs-pager-btn:disabled{opacity:.45;cursor:not-allowed}
.obs-pager-info{font-size:13px;color:var(--text-soft,#64748b);font-weight:600}
body.dark-mode .obs-pager-info{color:#94a3b8}

/* Registry cards: ensure comfortable tap targets and clean stacking on phones */
@media (max-width:640px){
  .obs-card{padding:14px 14px}
  .obs-card-header{flex-wrap:wrap;gap:6px}
  .obs-card-title{font-size:15px;line-height:1.3}
  .obs-card-badges{display:flex;gap:6px;flex-wrap:wrap}
  .obs-chip-row{flex-wrap:wrap;gap:6px}
  .obs-chip{font-size:11px}
  .obs-pager-btn{flex:1;justify-content:center;min-width:110px}
  .obs-pager-info{order:-1;width:100%;text-align:center}
}

/* ===== Phase 3: CAPA KPIs, expiry banner, TBT attendees, audit log ===== */
.capa-kpi-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:10px 0 4px}
.capa-kpi{background:var(--card,#fff);border:1px solid #e4eaf0;border-radius:10px;padding:12px 8px;text-align:center}
.capa-kpi-value{font-size:20px;font-weight:800;color:#12283c}
.capa-kpi-label{font-size:11px;color:#66798c;margin-top:2px}
.capa-overdue .capa-kpi-value{color:#b45309}
.capa-overdue.capa-alert{background:#fef2f2;border-color:#fca5a5}
.capa-overdue.capa-alert .capa-kpi-value{color:#b91c1c}
.capa-week .capa-kpi-value{color:#0f5cad}
.capa-done .capa-kpi-value{color:#15803d}
body.dark-mode .capa-kpi{background:#1e293b;border-color:#334155}
body.dark-mode .capa-kpi-value{color:#e5e7eb}

.chip-overdue{background:#fee2e2 !important;color:#b91c1c !important;border-color:#ef4444 !important;font-weight:700}

.expiry-banner{display:flex;align-items:center;flex-wrap:wrap;gap:8px;background:#fffbeb;border:1px solid #fcd34d;color:#92400e;border-radius:10px;padding:10px 14px;margin:0 0 14px;font-size:13px}
.exp-chip{display:inline-block;padding:2px 9px;border-radius:20px;font-weight:700;font-size:12px}
.exp-red{background:#fee2e2;color:#b91c1c}.exp-amber{background:#fef3c7;color:#92400e}.exp-blue{background:#dbeafe;color:#1e40af}
body.dark-mode .expiry-banner{background:#3b2f14;border-color:#a16207;color:#fde68a}

.tbt-attendee-row{align-items:center}
.tbt-att-del{background:none;border:none;color:#b91c1c;font-size:18px;cursor:pointer;padding:0 6px;line-height:1}
.tbt-att-form{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.tbt-att-form input{flex:1;min-width:110px;padding:8px 10px;border:1px solid #c9d5e0;border-radius:8px;font-size:13px}
.tbt-att-form button{background:var(--primary,#0f5cad);color:#fff;border:none;border-radius:8px;padding:8px 14px;font-weight:600;cursor:pointer;min-height:40px}

.ws-log-row{border:1px solid #e6edf3;border-radius:8px;padding:9px 12px;margin-bottom:7px}
.ws-log-action{font-weight:700;font-size:13px;color:#12283c;text-transform:capitalize}
.ws-log-meta{font-size:11px;color:#66798c;margin-top:2px}

@media (max-width:640px){
  .capa-kpi-bar{grid-template-columns:repeat(2,1fr)}
  .tbt-att-form input{min-width:calc(50% - 6px)}
}

/* ===== Safety Officer Performance module ===== */
.perf-subtabs{display:flex;gap:8px;margin:12px 0;flex-wrap:wrap}
.perf-subtab{background:#eef3f8;color:#0f5cad;border:none;border-radius:20px;padding:8px 16px;font-weight:600;font-size:13px;cursor:pointer;min-height:40px}
.perf-subtab.active{background:#0f5cad;color:#fff}
.perf-kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px}
.perf-kpi{background:var(--card,#fff);border:1px solid #e4eaf0;border-radius:10px;padding:14px 8px;text-align:center}
.perf-kpi-value{font-size:19px;font-weight:800;color:#12283c;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.perf-kpi-label{font-size:11px;color:#66798c;margin-top:3px}
.perf-h3{font-size:15px;margin:18px 0 10px;color:#12283c;display:flex;align-items:center;gap:8px}
.perf-row{display:flex;align-items:center;gap:12px;background:var(--card,#fff);border:1px solid #e6edf3;border-radius:10px;padding:10px 14px;margin-bottom:8px}
.perf-rank{font-size:18px;font-weight:800;min-width:34px;text-align:center;color:#334155}
.perf-officer{flex:1;min-width:0}
.perf-name{font-weight:700;font-size:14px;color:#12283c}
.perf-sub-meta{font-size:11px;color:#66798c;margin-top:2px}
.perf-right{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.perf-tier{color:#fff;font-size:10px;font-weight:700;padding:2px 10px;border-radius:20px;text-transform:uppercase}
.perf-points{font-size:18px;font-weight:800;color:#0f5cad}
.perf-chart{margin-top:6px}
.perf-bar-row{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.perf-bar-label{width:110px;font-size:12px;color:#334155;flex:0 0 auto}
.perf-bar-track{flex:1;height:16px;background:#eef3f8;border-radius:8px;overflow:hidden}
.perf-bar-fill{display:block;height:100%;border-radius:8px}
.perf-bar-val{width:70px;text-align:right;font-size:12px;font-weight:700;color:#12283c}
.perf-me-head{display:flex;align-items:center;gap:16px;background:var(--card,#fff);border:1px solid #e6edf3;border-radius:12px;padding:18px;margin-bottom:14px}
.perf-me-points{font-size:40px;font-weight:800;color:#0f5cad}
.perf-me-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.perf-me-item{background:var(--card,#fff);border:1px solid #e6edf3;border-radius:10px;padding:14px 8px;text-align:center;font-size:12px;color:#66798c}
.perf-me-num{font-size:22px;font-weight:800;color:#12283c}
.perf-settings-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:12px 0}
.perf-settings-grid label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:#334155}
.perf-settings-grid input{padding:9px 12px;border:1px solid #c9d5e0;border-radius:8px;font-size:15px}
.perf-save-btn{background:#0f5cad;color:#fff;border:none;border-radius:8px;padding:11px 20px;font-weight:600;cursor:pointer;min-height:44px}
.perf-note{font-size:12px;color:#66798c;margin-bottom:6px}
.perf-empty{text-align:center;color:#8496a8;padding:20px;font-size:13px}
body.dark-mode .perf-kpi,body.dark-mode .perf-row,body.dark-mode .perf-me-head,body.dark-mode .perf-me-item{background:#1e293b;border-color:#334155}
body.dark-mode .perf-kpi-value,body.dark-mode .perf-name,body.dark-mode .perf-me-num{color:#e5e7eb}
@media (max-width:640px){
  .perf-kpi-grid,.perf-me-grid{grid-template-columns:repeat(2,1fr)}
  .perf-settings-grid{grid-template-columns:1fr}
  .perf-bar-label{width:80px}
}

/* ===== Registration human verification ===== */
.human-check{background:#f5f8fb;border:1px solid #dbe4ee;border-radius:8px;padding:10px 12px;margin:2px 0}
.human-check-label{display:block;font-size:13px;color:#334155;font-weight:600;margin-bottom:6px}
.human-check-label #humanCheckQuestion{color:#0f5cad;font-weight:800}
.human-check input{width:100%;box-sizing:border-box}
body.dark-mode .human-check{background:#1e293b;border-color:#334155}
body.dark-mode .human-check-label{color:#cbd5e1}

/* ===== Approve-user dialog (workspace + role at approval) ===== */
#approveDlgOverlay{position:fixed;inset:0;background:rgba(4,14,24,.72);z-index:100002;display:flex;align-items:center;justify-content:center;padding:16px}
.approve-dlg{background:#fff;border-radius:14px;padding:22px;max-width:460px;width:100%;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.approve-dlg h3{margin:0 0 14px;font-size:16px;color:#12283c;display:flex;align-items:center;gap:8px}
.approve-dlg label{display:block;font-size:12px;font-weight:700;color:#334155;margin:10px 0 4px}
.approve-dlg select{width:100%;padding:10px;border:1px solid #c9d5e0;border-radius:8px;font-size:14px}
.approve-dlg-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}
.appr-ws-list{border:1px solid #c9d5e0;border-radius:8px;padding:8px 10px;max-height:140px;overflow-y:auto;display:flex;flex-direction:column;gap:4px}
.appr-ws-checkbox-label{display:flex;align-items:center;gap:8px;font-size:13px;color:#334155;cursor:pointer;padding:4px 2px;border-radius:6px}
.appr-ws-checkbox-label:hover{background:rgba(0,100,200,.06)}
.appr-ws-checkbox-label input[type=checkbox]{width:16px;height:16px;accent-color:#0ea5e9;cursor:pointer;flex-shrink:0}
.appr-ws-hint{font-size:11px;color:#64748b;margin:4px 0 0;line-height:1.4}
.appr-no-ws{font-size:12px;color:#94a3b8;margin:4px 0;font-style:italic}
.user-registered-as{display:block;font-size:11px;color:#0ea5e9;font-weight:600;margin-top:2px}
body.dark-mode .approve-dlg{background:#1e293b}
body.dark-mode .approve-dlg h3{color:#e5e7eb}
body.dark-mode .approve-dlg label{color:#cbd5e1}
body.dark-mode .appr-ws-list{border-color:#334155;background:#0f172a}
body.dark-mode .appr-ws-checkbox-label{color:#cbd5e1}
body.dark-mode .appr-ws-checkbox-label:hover{background:rgba(255,255,255,.06)}
body.dark-mode .appr-ws-hint{color:#94a3b8}
body.dark-mode .user-registered-as{color:#38bdf8}

/* =============================================
   MOBILE FIX - OBSERVATION TYPE MODAL & FORMS
   ============================================= */
@media(max-width:640px){
.obs-type-modal{max-width:100%;width:100%;max-height:92vh}
.obs-type-cards{grid-template-columns:1fr}
.obs-step{padding:1rem}
.obs-type-card{padding:.75rem 1rem;gap:.75rem}
.type-card-icon{width:42px;height:42px;font-size:1.1rem}
.type-card-content h3{font-size:.95rem}
.type-card-content p{font-size:.75rem}
.obs-type-header{gap:.75rem}
.obs-type-icon{width:40px;height:40px;font-size:1.2rem}
.obs-type-title{font-size:1.1rem}
.form-modal .form-row{flex-direction:column;gap:.5rem}
}

/* ── Officers Directory ──────────────────────────────────────────────────── */
.directory-search-wrapper{position:relative;margin:0 0 16px;}
.directory-search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--text-soft);pointer-events:none;font-size:.9rem;}
#directorySearch{width:100%;box-sizing:border-box;padding:10px 12px 10px 36px;border:1px solid var(--border-light);border-radius:8px;font-size:.9rem;background:var(--card-bg);color:var(--text);outline:none;transition:border-color .2s;}
#directorySearch:focus{border-color:var(--primary);}
.directory-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;}
.dir-card{background:var(--card-bg);border:1px solid var(--border-light);border-radius:12px;padding:16px;display:flex;align-items:flex-start;gap:14px;transition:box-shadow .15s;}
.dir-card:hover{box-shadow:0 2px 10px rgba(0,0,0,.08);}
.dir-card-avatar{flex-shrink:0;width:52px;height:52px;border-radius:50%;overflow:hidden;position:relative;}
.dir-avatar-img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
.dir-avatar-initials{width:52px;height:52px;border-radius:50%;background:var(--primary);color:#fff;font-weight:700;font-size:1.1rem;display:flex;align-items:center;justify-content:center;letter-spacing:.02em;}
.dir-card-body{flex:1;min-width:0;}
.dir-card-name{font-weight:700;font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.dir-card-empid{font-size:.75rem;color:var(--text-soft);margin-top:1px;}
.dir-card-pos{font-size:.82rem;color:var(--text-soft);margin-top:4px;}
.dir-card-area{font-size:.78rem;color:var(--text-soft);margin-top:3px;}
.dir-card-area i{width:11px;color:var(--text-soft);}
.dir-card-contacts{display:flex;flex-direction:column;gap:3px;margin-top:7px;}
.dir-contact-link{font-size:.78rem;color:var(--primary);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;}
.dir-contact-link i{width:13px;}
.dir-contact-link:hover{text-decoration:underline;}
@media(max-width:480px){.directory-grid{grid-template-columns:1fr;}}

/* Phase 1.1 Observation mobile reliability polish */
@media (max-width: 768px) {
  #ObservationsTab .section-header,
  #ObservationsTab .filters-row,
  #ObservationsTab .observations-toolbar {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: .75rem !important;
  }

  #observationsList {
    gap: .75rem !important;
  }

  .obs-card {
    padding: 14px 14px 16px 16px !important;
    border-radius: 14px !important;
    min-height: unset !important;
  }

  .obs-card-header {
    align-items: flex-start !important;
    gap: .45rem !important;
  }

  .obs-card-title {
    font-size: 15px !important;
    line-height: 1.35 !important;
    white-space: normal !important;
  }

  .obs-card-badges,
  .obs-chip-row {
    flex-wrap: wrap !important;
    gap: .35rem !important;
  }

  .obs-description {
    font-size: 13px !important;
    line-height: 1.45 !important;
    margin-top: .4rem !important;
  }

  .obs-modal-scroll .modal-content,
  #addObservationModal .modal-content {
    width: min(96vw, 760px) !important;
    max-height: 92vh !important;
    overflow-y: auto !important;
    padding: 1rem !important;
    border-radius: 14px !important;
  }

  #obsTypeSelection .obs-type-grid,
  .obs-type-grid {
    grid-template-columns: 1fr !important;
    gap: .65rem !important;
  }

  #addObservationForm .form-grid,
  #addObservationForm .obs-form-grid,
  #addObservationForm .form-row {
    grid-template-columns: 1fr !important;
  }

  #addObservationForm input,
  #addObservationForm select,
  #addObservationForm textarea,
  #addObservationForm button {
    font-size: 16px !important;
  }

  #addObservationForm .form-actions,
  .obs-form-actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }
}

/* OBS_FIX_V3_ACTIVE — Observations mobile + modal reliability polish */
@media (max-width: 768px) {
  #ObservationsTab,
  #observations,
  .observations-section {
    overflow-x: hidden !important;
  }

  #ObservationsTab .obs-summary-bar,
  .obs-summary-bar {
    grid-template-columns: 1fr !important;
    gap: .65rem !important;
  }

  #ObservationsTab .obs-filters,
  .obs-filters {
    padding: .75rem !important;
    border-radius: 14px !important;
  }

  #ObservationsTab .obs-filter-row,
  .obs-filter-row {
    flex-direction: column !important;
    gap: .55rem !important;
    margin-bottom: .55rem !important;
  }

  #ObservationsTab .obs-filter-row select,
  #ObservationsTab .obs-filter-row input[type="text"],
  .obs-filter-row select,
  .obs-filter-row input[type="text"] {
    width: 100% !important;
    box-sizing: border-box !important;
    border-radius: 12px !important;
    padding: .72rem .85rem !important;
    min-height: 44px !important;
    font-size: 15px !important;
  }

  #ObservationsTab .obs-filter-chip,
  .obs-filter-chip {
    min-height: 42px !important;
    border-radius: 12px !important;
    font-size: 14px !important;
  }

  #observationsList {
    display: flex !important;
    flex-direction: column !important;
    gap: .8rem !important;
  }

  #observationsList .obs-card {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 1rem 1rem 1rem 1.1rem !important;
    border-radius: 16px !important;
    box-shadow: 0 6px 16px rgba(15,23,42,.10) !important;
  }

  #observationsList .obs-card-header {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: .45rem !important;
  }

  #observationsList .obs-card-title {
    width: 100% !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  #observationsList .obs-card-badges {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: .4rem !important;
  }

  #observationsList .badge,
  #observationsList .status-pill,
  #observationsList .obs-chip {
    font-size: 11px !important;
    line-height: 1.2 !important;
    padding: .25rem .55rem !important;
  }

  #observationsList .obs-card-date {
    font-size: 12px !important;
    margin-top: .25rem !important;
  }

  #observationsList .obs-description {
    font-size: 13px !important;
    line-height: 1.45 !important;
    margin-top: .45rem !important;
    color: var(--text-soft) !important;
  }

  #observationsList .obs-chip-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: .35rem !important;
    margin-top: .55rem !important;
  }

  .modal.show {
    align-items: flex-start !important;
    justify-content: center !important;
    overflow-y: auto !important;
    padding: .5rem !important;
  }

  #addObservationModal .modal-content,
  #viewDetailsModal .modal-content {
    width: 100% !important;
    max-width: 100% !important;
    max-height: 94vh !important;
    margin: .5rem 0 !important;
    border-radius: 14px !important;
    padding: 1rem !important;
    box-sizing: border-box !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  #addObservationForm .form-row,
  #addObservationForm .form-grid,
  #addObservationForm .obs-form-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .7rem !important;
  }

  #addObservationForm input,
  #addObservationForm select,
  #addObservationForm textarea {
    width: 100% !important;
    box-sizing: border-box !important;
    min-height: 44px !important;
    font-size: 16px !important;
  }

  #addObservationForm textarea {
    min-height: 88px !important;
  }

  #obsTypeSelection .obs-type-cards,
  #obsTypeSelection .obs-type-grid,
  .obs-type-cards,
  .obs-type-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .7rem !important;
  }

  #obsTypeSelection .obs-type-card,
  .obs-type-card {
    min-height: 68px !important;
    padding: .85rem !important;
    border-radius: 14px !important;
  }

  .close-btn {
    min-width: 38px !important;
    min-height: 38px !important;
  }
}

/* ===== v17 mobile observation reliability + readable cards ===== */
.my-open-obs-item{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-bottom:1px solid var(--border-light,#e5e7eb);cursor:pointer;min-height:54px}
.my-open-obs-dot{flex-shrink:0;width:10px;height:10px;border-radius:50%;margin-top:6px;display:inline-block}
.my-open-obs-body{flex:1;min-width:0}
.my-open-obs-title{font-weight:700;font-size:.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text-main,#0f172a)}
.my-open-obs-desc{font-size:.8rem;color:var(--text-soft,#64748b);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.my-open-obs-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:3px;font-size:.74rem;color:var(--text-soft,#64748b)}
.my-open-obs-meta i{width:12px;text-align:center}
.my-open-obs-status{flex-shrink:0;font-size:.72rem;background:var(--badge-bg,#f1f5f9);padding:3px 8px;border-radius:999px;color:var(--text-soft,#64748b);white-space:nowrap}
.obs-card-main-title{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.obs-card-type{font-size:.92rem;font-weight:800;color:var(--text-main,#0f172a);line-height:1.25;overflow-wrap:anywhere}
.obs-card-area{font-size:.76rem;color:var(--text-soft,#64748b);font-weight:600;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.obs-chip-positive{background:#dcfce7!important;color:#15803d!important;border-color:#22c55e!important}
.obs-chip-negative{background:#fee2e2!important;color:#b91c1c!important;border-color:#ef4444!important}
.obs-card.risk-critical::before{background:#7f1d1d!important}

@media (max-width: 768px){
  #HomeTab .home-card-header{align-items:flex-start;gap:.5rem;flex-wrap:wrap}
  #myOpenObsContainer{min-height:42px}
  .my-open-obs-item{padding:11px 0;gap:9px}
  .my-open-obs-status{align-self:flex-start}
  .my-open-obs-meta{font-size:.72rem;gap:6px}
  #ObservationsTab{padding-bottom:84px;overflow-x:hidden!important}
  #ObservationsTab .obs-summary-bar{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:.55rem!important}
  #ObservationsTab .obs-summary-item{min-width:0!important;padding:.75rem .45rem!important;border-radius:14px!important}
  #ObservationsTab .obs-summary-label{font-size:.68rem!important;white-space:normal!important;line-height:1.2!important}
  #ObservationsTab .obs-summary-value{font-size:1.35rem!important}
  #ObservationsTab .obs-filters{margin:.75rem 0!important;padding:.75rem!important;border-radius:16px!important}
  #ObservationsTab .obs-filter-row{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:.55rem!important}
  #ObservationsTab .obs-filter-row:first-child{display:grid!important;grid-template-columns:1fr 1fr!important}
  #ObservationsTab .obs-filter-chip{width:100%!important;min-height:42px!important;justify-content:center!important}
  #observationsList{display:flex!important;flex-direction:column!important;gap:.75rem!important;width:100%!important}
  #observationsList .obs-card{width:100%!important;margin:0!important;border-radius:16px!important;padding:1rem 1rem 1rem 1.1rem!important;box-sizing:border-box!important;overflow:hidden!important}
  #observationsList .obs-card-header{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:.5rem!important}
  #observationsList .obs-card-main-title{width:100%!important}
  #observationsList .obs-card-type{font-size:1rem!important}
  #observationsList .obs-card-area{font-size:.78rem!important;white-space:normal!important}
  #observationsList .obs-card-badges{width:100%!important;display:flex!important;flex-wrap:wrap!important;gap:.35rem!important}
  #observationsList .obs-description{font-size:.86rem!important;line-height:1.45!important;color:var(--text-main,#0f172a)!important;margin:.45rem 0!important}
  #observationsList .obs-chip-row{display:flex!important;flex-wrap:wrap!important;gap:.35rem!important;margin-top:.5rem!important}
  #observationsList .badge,#observationsList .status-pill,#observationsList .obs-chip{font-size:.7rem!important;padding:.28rem .55rem!important;border-radius:999px!important}
  #addObservationModal.show{display:flex!important;align-items:flex-start!important;justify-content:center!important;overflow-y:auto!important;padding:.5rem!important}
  #addObservationModal .modal-content{width:100%!important;max-width:100%!important;max-height:94vh!important;margin:0!important;border-radius:16px!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important}
  #obsTypeSelection .obs-type-card{touch-action:manipulation!important;pointer-events:auto!important}
  .back-to-types-btn{min-width:44px!important;min-height:44px!important;touch-action:manipulation!important}
}

@media (max-width: 420px){
  #ObservationsTab .obs-summary-bar{grid-template-columns:1fr!important}
  #ObservationsTab .obs-filter-row:first-child{grid-template-columns:1fr 1fr!important}
}

/* ── v20 Mobile Observation Reliability Layout ───────────────────────────── */
@media (max-width: 768px) {
  body { overflow-x: hidden; }
  .app-container, .main-content, .tab-content, .home-grid, .dashboard-grid,
  .observations-layout, .content-grid { width: 100% !important; max-width: 100% !important; }

  .home-grid, .dashboard-grid, .stats-grid, .quick-actions-grid,
  .observations-layout, .obs-type-grid, .form-grid, .admin-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .home-card, .stat-card, .dashboard-card, .obs-card, .permit-card,
  .equipment-card, .tbt-card, .admin-card {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #myOpenObsContainer, .my-open-obs-item, .my-open-obs-body,
  #observationsList, #adminObservationsTable {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .my-open-obs-item {
    display: grid !important;
    grid-template-columns: 10px minmax(0, 1fr) auto !important;
    align-items: start !important;
    gap: 8px !important;
    padding: 10px !important;
    border-radius: 12px !important;
  }

  .my-open-obs-title, .my-open-obs-desc, .obs-card-title, .obs-card-desc,
  .obs-card-location, .obs-card-meta, .detail-value {
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  .obs-card {
    display: block !important;
    padding: 14px !important;
    border-radius: 14px !important;
    margin-bottom: 10px !important;
  }

  .obs-card-header, .obs-card-meta, .obs-card-footer {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    align-items: center !important;
  }

  .modal.show { display: flex !important; align-items: flex-start !important; justify-content: center !important; }
  .modal-content {
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    margin: 10px auto !important;
    max-height: calc(100vh - 24px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    box-sizing: border-box !important;
  }

  #addObservationModal .modal-content { padding: 14px !important; }
  #obsTypeSelection { display: block; width: 100%; }
  #obsTypeSelection .obs-type-card { pointer-events: auto !important; min-height: 84px !important; }
  #addObservationForm input, #addObservationForm select, #addObservationForm textarea,
  #addObservationForm button { max-width: 100% !important; box-sizing: border-box !important; }

  .table-wrapper, .admin-data-table-wrapper { overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; }
  table { max-width: 100%; }
}

/* ===== v21 final mobile observation layout + cache-safe UI ===== */
@media (max-width: 768px) {
  html, body { width: 100% !important; max-width: 100% !important; overflow-x: hidden !important; }
  .main-content, .content-section, .tab-content, .page-content { width: 100% !important; max-width: 100vw !important; overflow-x: hidden !important; }
  #ObservationsTab .section-header, #ObservationsTab .actions-row, #ObservationsTab .filter-row,
  #ObservationsTab .obs-filter-row { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 10px !important; }
  #ObservationsTab button, #ObservationsTab select, #ObservationsTab input { min-height: 44px !important; font-size: 16px !important; }
  #observationsList { display: grid !important; grid-template-columns: 1fr !important; gap: 12px !important; padding: 0 !important; }
  #observationsList .observation-card, #observationsList .obs-card, .observation-card, .obs-card {
    display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important;
    box-sizing: border-box !important; overflow: hidden !important; border-radius: 16px !important; padding: 14px !important;
  }
  #observationsList .obs-card-header, #observationsList .observation-header {
    display: grid !important; grid-template-columns: 1fr !important; gap: 8px !important; align-items: start !important;
  }
  #observationsList .obs-card-actions, #observationsList .observation-actions {
    display: flex !important; flex-wrap: wrap !important; gap: 6px !important; width: 100% !important;
  }
  #observationsList .obs-card-actions button, #observationsList .observation-actions button { flex: 1 1 auto !important; }
  #observationsList .obs-description, #observationsList .description, #observationsList p {
    white-space: normal !important; overflow-wrap: anywhere !important; word-break: break-word !important; line-height: 1.45 !important;
  }
  #addObservationModal.show { display: flex !important; align-items: flex-start !important; justify-content: center !important; }
  #addObservationModal .modal-content { width: calc(100vw - 16px) !important; max-width: calc(100vw - 16px) !important; max-height: calc(100vh - 16px) !important; margin: 8px !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch !important; }
  #obsTypeSelection, #addObservationForm { width: 100% !important; max-width: 100% !important; }
  #obsTypeSelection .obs-type-cards { grid-template-columns: 1fr !important; }
  #obsTypeSelection .obs-type-card { min-height: 76px !important; pointer-events: auto !important; touch-action: manipulation !important; }
  #addObservationForm .form-row, #addObservationForm .form-grid, #addObservationForm .obs-form-grid { grid-template-columns: 1fr !important; }
  .my-open-obs-item { grid-template-columns: 10px minmax(0, 1fr) !important; }
  .my-open-obs-status { grid-column: 2 / 3 !important; width: fit-content !important; margin-top: 4px !important; }
}

/* V23: permanently hide/remove the temporary v21 debug badge if an old script injected it. */
#obsFixVersionStamp,[data-debug-badge],.debug-version-badge,.version-debug-badge{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important}

/* Performance: custom date-range picker */
.perf-range-picker{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;background:var(--card-bg,#fff);border:1px solid var(--border-light,#e5e7eb);border-radius:10px;padding:12px 14px;margin:10px 0 16px}
.perf-range-picker label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:600;color:var(--text-soft,#64748b)}
.perf-range-picker input[type="date"]{padding:7px 10px;border:1px solid var(--border-light,#d1d5db);border-radius:8px;font-size:13px;background:var(--input-bg,#fff);color:var(--text,#111)}
.perf-range-apply{background:var(--accent,#0f5cad);color:#fff;border:none;border-radius:8px;padding:8px 18px;font-weight:600;font-size:13px;cursor:pointer}
.perf-range-apply:hover{filter:brightness(1.08)}
@media (max-width:640px){.perf-range-picker{flex-direction:column;align-items:stretch}.perf-range-picker input[type="date"]{width:100%}.perf-range-apply{width:100%;padding:11px}}

/* ============================================================================
   RESPONSIVE LAYOUT FIXES — header/footer visible on ALL devices
   (iPhone notch/home-bar, Galaxy, small phones, tablets, desktop)
   ============================================================================ */

/* 1. Use dynamic viewport height (dvh) so mobile browser chrome (address bar)
      never pushes the layout off-screen. Fallback chain for older browsers. */
.app-container{
  min-height:100vh;
  min-height:100dvh;
}

/* 2. iPhone safe areas: keep the fixed bottom nav above the home indicator,
      and the header below the notch. env() is 0 on devices without insets. */
.nav-bar{
  bottom:calc(0px + env(safe-area-inset-bottom, 0px));
  margin:.5rem;
  margin-bottom:calc(.5rem + env(safe-area-inset-bottom, 0px));
}
.app-header{
  top:calc(0px + env(safe-area-inset-top, 0px));
}

/* 3. Reserve enough space under the content so the fixed nav NEVER covers the
      last items — nav height + margins + safe area, on every screen. */
.content-area{
  padding-bottom:calc(6.5rem + env(safe-area-inset-bottom, 0px)) !important;
}

/* 4. Small phones (iPhone SE/mini, compact Androids): tighten header + nav so
      nothing overflows or clips horizontally. */
@media (max-width: 400px){
  .app-header{margin:.5rem .5rem 0;padding:.7rem .9rem;border-radius:24px}
  .app-header h1,.app-header .app-title{font-size:1rem}
  .nav-bar{margin:.4rem;padding:.3rem .35rem;gap:.15rem}
  .nav-button{padding:.45rem .35rem;font-size:.62rem;min-width:0}
  .nav-button i{font-size:1rem}
}

/* 5. Standard phones (iPhone 12-16, Galaxy S/A series) */
@media (min-width: 401px) and (max-width: 768px){
  .app-header{margin:.6rem .6rem 0;padding:.85rem 1.1rem}
  .nav-bar{margin:.5rem}
  .nav-button{font-size:.68rem}
}

/* 6. Never allow horizontal scroll/gaps from over-wide children */
html, body{max-width:100%;overflow-x:hidden}
.content-area > *{max-width:100%}
img, table, .obs-card, .home-card{max-width:100%}
table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}

/* 7. Desktop: keep nav centered and not stretched edge-to-edge */
@media (min-width: 1024px){
  .nav-bar{left:50%;right:auto;transform:translateX(-50%);width:min(720px,92vw)}
}

/* 8. Landscape phones: shrink header/nav so content still has room */
@media (max-height: 480px) and (orientation: landscape){
  .app-header{padding:.4rem .9rem;margin:.35rem .5rem 0}
  .nav-bar{padding:.2rem .4rem}
  .nav-button{padding:.3rem .4rem;font-size:.6rem}
  .content-area{padding-bottom:4.5rem !important}
}
