/* ══════════════════════════════════════════════════════════
   ADMIN LIGHT THEME – comprehensive overrides
══════════════════════════════════════════════════════════ */

/* ── Shell layout ── */
[data-theme="light"] .admin-body    { background:#e8eef8; }
[data-theme="light"] .admin-shell   { background:#e8eef8; }
[data-theme="light"] .admin-main    { background:#e8eef8; }
[data-theme="light"] .admin-content { background:#e8eef8; }

/* ── Sidebar ── */
[data-theme="light"] .admin-sidebar {
  background:#fff; border-right:1px solid rgba(0,0,0,.13);
}
[data-theme="light"] .sidebar-header { border-bottom:1px solid rgba(0,0,0,.1); }
[data-theme="light"] .sidebar-footer { border-top:1px solid rgba(0,0,0,.1); }
[data-theme="light"] .sidebar-name   { color:#081525; }
[data-theme="light"] .sidebar-role   { color:#445878; }
[data-theme="light"] .nav-section-label { color:#607080; }
[data-theme="light"] .nav-item { color:#1e3050; }
[data-theme="light"] .nav-item:hover { background:#edf3fc; color:#081525; }
[data-theme="light"] .nav-item.active { background:rgba(0,118,168,.1); color:#0076a8; }
[data-theme="light"] .nav-item-btn:hover { background:rgba(220,38,38,.08); color:#c01a1a; }

/* ── Top bar ── */
[data-theme="light"] .admin-topbar { background:#fff; border-bottom:1px solid rgba(0,0,0,.12); }
[data-theme="light"] .topbar-title  { color:#081525; }
[data-theme="light"] .topbar-status { color:#445878; }
[data-theme="light"] .topbar-clock  { color:#445878; }

/* ── Cards ── */
[data-theme="light"] .admin-card {
  background:#fff; border:1px solid rgba(0,0,0,.13);
  box-shadow:0 2px 10px rgba(0,0,0,.06);
}
[data-theme="light"] .card-head { color:#081525; border-bottom:1px solid rgba(0,0,0,.1); }

/* ── Dashboard stats ── */
[data-theme="light"] .dash-stat-card { background:#fff; border:1px solid rgba(0,0,0,.12); }
[data-theme="light"] .dash-stat-value { color:#081525; }
[data-theme="light"] .dash-stat-label { color:#607080; }
[data-theme="light"] .meta-row span:first-child { color:#607080; }
[data-theme="light"] .meta-row span:last-child  { color:#1e3050; }
[data-theme="light"] .info-box { border:none; }
[data-theme="light"] .info-item { border-bottom:1px solid rgba(0,0,0,.08); }
[data-theme="light"] .info-key { color:#607080; }
[data-theme="light"] .info-val { color:#081525; }

/* ── Forms ── */
[data-theme="light"] .form-input {
  background:#edf3fc; border:1px solid rgba(0,0,0,.15);
  color:#081525;
}
[data-theme="light"] .form-input::placeholder { color:#778899; }
[data-theme="light"] .form-input:focus { border-color:#0076a8; box-shadow:0 0 0 3px rgba(0,118,168,.12); }
[data-theme="light"] .form-group label { color:#445878; }
[data-theme="light"] .help-text { color:#607080; }
[data-theme="light"] .toggle-label { color:#081525; }
[data-theme="light"] .toggle-desc  { color:#607080; }
[data-theme="light"] .toggle-track { background:rgba(0,0,0,.18); }

/* ── Tables ── */
[data-theme="light"] .table-wrap  { border:1px solid rgba(0,0,0,.13); }
[data-theme="light"] .data-table thead tr { background:#edf3fc; }
[data-theme="light"] .data-table th { color:#445878; }
[data-theme="light"] .data-table td { color:#081525; border-bottom:1px solid rgba(0,0,0,.07); }
[data-theme="light"] .data-table tbody tr:hover { background:rgba(0,0,0,.025); }
[data-theme="light"] .empty-row { color:#607080; }
[data-theme="light"] .table-footer { color:#607080; }

/* ── Search & selects ── */
[data-theme="light"] .search-input {
  background:#edf3fc; border:1px solid rgba(0,0,0,.15); color:#081525;
}
[data-theme="light"] .search-input:focus { border-color:#0076a8; }
[data-theme="light"] .select-sm {
  background:#edf3fc; border:1px solid rgba(0,0,0,.15); color:#081525;
}

/* ── Tag input ── */
[data-theme="light"] .tag-input-wrap {
  background:#edf3fc; border:1px solid rgba(0,0,0,.15);
}
[data-theme="light"] .tag-input { color:#081525; }
[data-theme="light"] .tag-chip  { background:rgba(0,118,168,.1); color:#0076a8; }

/* ── Buttons ── */
[data-theme="light"] .btn-secondary { background:#edf3fc; color:#1e3050; border-color:rgba(0,0,0,.15); }
[data-theme="light"] .btn-ghost     { background:transparent; color:#1e3050; border-color:rgba(0,0,0,.15); }
[data-theme="light"] .btn-ghost:hover { background:#edf3fc; }

/* ── Recent alerts list ── */
[data-theme="light"] .recent-alert-row { background:#edf3fc; }
[data-theme="light"] .rar-name { color:#081525; }
[data-theme="light"] .rar-time { color:#607080; }

/* ── Sensor panel in floor designer ── */
[data-theme="light"] .fd-panel-head { color:#607080; }
[data-theme="light"] .fd-si-name    { color:#081525; }
[data-theme="light"] .fd-placed-stat span { color:#607080; }
[data-theme="light"] .fd-attach-note { color:#607080; background:#edf3fc; }
[data-theme="light"] .fd-hint kbd  { background:#edf3fc; color:#1e3050; border-color:rgba(0,0,0,.15); }

/* ── Modal ── */
[data-theme="light"] .modal-overlay { background:rgba(0,0,0,.4); }
[data-theme="light"] .modal-box { background:#fff; border:1px solid rgba(0,0,0,.15); }
[data-theme="light"] .modal-head { color:#081525; border-bottom:1px solid rgba(0,0,0,.1); }
[data-theme="light"] .modal-foot { border-top:1px solid rgba(0,0,0,.1); }
[data-theme="light"] .modal-info-strip { border-top:1px solid rgba(0,0,0,.1); color:#607080; }
[data-theme="light"] .modal-close { color:#607080; }
[data-theme="light"] .modal-close:hover { background:#edf3fc; color:#081525; }

/* ── Login ── */
[data-theme="light"] .login-overlay { background:#e8eef8; }
[data-theme="light"] .login-card    { background:#fff; border:1px solid rgba(0,0,0,.14); }
[data-theme="light"] .login-title   { color:#081525; }
[data-theme="light"] .login-sub     { color:#607080; }
[data-theme="light"] .login-input   { background:#edf3fc; border-color:rgba(0,0,0,.15); color:#081525; }
[data-theme="light"] .login-icon-wrap { background:rgba(0,118,168,.1); border-color:rgba(0,118,168,.2); }

/* ── PLC status block ── */
[data-theme="light"] .plc-ip { color:#081525; }
[data-theme="light"] .plc-mode { color:#607080; }

/* ── System info ── */
[data-theme="light"] .asa-row { background:#edf3fc; }
[data-theme="light"] .asa-head { color:#081525; }
[data-theme="light"] .asa-bar  { background:rgba(0,0,0,.1); }

/* ── Badge/chips ── */
[data-theme="light"] .nav-badge      { background:rgba(220,38,38,.1); color:#c01a1a; }
[data-theme="light"] .nav-badge-info { background:rgba(0,118,168,.1); color:#0076a8; }
[data-theme="light"] .sev-warning    { background:rgba(196,112,0,.1); color:#c47000; }
[data-theme="light"] .sev-alarm      { background:rgba(204,88,0,.1);  color:#cc5800; }
[data-theme="light"] .sev-danger     { background:rgba(192,26,26,.1); color:#c01a1a; }
[data-theme="light"] .sev-normal     { background:rgba(4,122,90,.1);  color:#047a5a; }

/* ── Test result banners ── */
[data-theme="light"] .test-result.success { background:rgba(4,122,90,.08);  border-color:rgba(4,122,90,.2);  color:#047a5a; }
[data-theme="light"] .test-result.error   { background:rgba(192,26,26,.08); border-color:rgba(192,26,26,.2); color:#c01a1a; }

/* ── Admin toast ── */
[data-theme="light"] .toast {
  background:#fff; border-color:rgba(0,0,0,.14); color:#081525;
  box-shadow:0 4px 20px rgba(0,0,0,.14);
}

/* ─── Admin Layout ─────────────────────────────────────────────────────────── */
.admin-body { background: var(--bg-root); overflow: hidden; height: 100vh; }

.admin-shell { display: flex; height: 100vh; overflow: hidden; }

/* ─── Sidebar ──────────────────────────────────────────────────────────────── */
.admin-sidebar {
  width: 240px; min-width: 240px;
  background: #131d2e;
  border-right: 1px solid var(--border);
  display: flex; flex-direction: column;
  transition: width .25s, min-width .25s;
  overflow: hidden; z-index: 100;
}
.admin-sidebar.collapsed { width: 64px; min-width: 64px; }
.admin-sidebar.collapsed .sidebar-brand,
.admin-sidebar.collapsed .nav-section-label,
.admin-sidebar.collapsed .nav-item span,
.admin-sidebar.collapsed .nav-badge { display: none; }
.admin-sidebar.collapsed .sidebar-toggle i { transform: rotate(180deg); }
.admin-sidebar.collapsed .nav-item { justify-content: center; padding: 10px 0; }

.sidebar-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 12px; border-bottom: 1px solid var(--border);
  min-height: 64px;
}
.sidebar-logo { display: flex; align-items: center; gap: 10px; overflow: hidden; }
.sidebar-icon-wrap {
  width: 36px; height: 36px; min-width: 36px;
  background: rgba(0,180,140,.1); border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
}
.sidebar-brand { display: flex; flex-direction: column; overflow: hidden; }
.sidebar-name { font-size: 13px; font-weight: 700; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sidebar-role  { font-size: 10px; color: #8090a8; text-transform: uppercase; letter-spacing: .06em; }

.sidebar-toggle {
  background: none; border: none; cursor: pointer; padding: 4px;
  color: #8090a8; border-radius: 6px; display: flex; align-items: center;
  transition: background .2s, color .2s;
}
.sidebar-toggle:hover { background: #1c2a3e; color: var(--text-primary); }

.sidebar-nav { flex: 1; overflow-y: auto; padding: 12px 8px; display: flex; flex-direction: column; gap: 2px; }
.nav-section-label {
  font-size: 10px; text-transform: uppercase; letter-spacing: .08em;
  color: #8090a8; padding: 8px 8px 4px; margin-top: 4px;
}

.nav-item {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 10px; border-radius: 8px; cursor: pointer;
  color: var(--text-secondary); text-decoration: none;
  font-size: 13px; font-weight: 500;
  transition: background .15s, color .15s;
  white-space: nowrap; border: none; background: none; width: 100%; text-align: left;
}
.nav-item i { width: 18px; height: 18px; min-width: 18px; }
.nav-item:hover { background: #1c2a3e; color: var(--text-primary); }
.nav-item.active { background: rgba(0,180,140,.12); color: var(--accent); }
.nav-item-btn { color: #8090a8; }
.nav-item-btn:hover { background: rgba(239,68,68,.1); color: #ef4444; }

.nav-badge {
  margin-left: auto; font-size: 10px; font-weight: 700;
  background: rgba(239,68,68,.2); color: #ef4444;
  padding: 2px 7px; border-radius: 99px; min-width: 20px; text-align: center;
}
.nav-badge-info { background: rgba(99,102,241,.2); color: #818cf8; }

.sidebar-footer { padding: 8px; border-top: 1px solid var(--border); }

/* ─── Main ─────────────────────────────────────────────────────────────────── */
.admin-main { flex: 1; display: flex; flex-direction: column; overflow: hidden; min-width: 0; }

.admin-topbar {
  height: 64px; background: #131d2e; border-bottom: 1px solid var(--border);
  display: flex; align-items: center; gap: 12px; padding: 0 24px;
  flex-shrink: 0;
}
.topbar-menu-btn {
  display: none; background: none; border: none; cursor: pointer;
  color: #8090a8; padding: 4px;
}
.topbar-title { font-size: 16px; font-weight: 700; color: var(--text-primary); flex: 1; }
.topbar-right { display: flex; align-items: center; gap: 16px; }
.topbar-status { display: flex; align-items: center; gap: 7px; font-size: 12px; color: #8090a8; }
.topbar-clock { font-size: 12px; color: #8090a8; font-variant-numeric: tabular-nums; }

.dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.dot-online  { background: var(--status-normal); box-shadow: 0 0 6px var(--status-normal); }
.dot-sim     { background: var(--status-warning); box-shadow: 0 0 6px var(--status-warning); }
.dot-offline { background: #6b7280; }

.admin-content { flex: 1; overflow-y: auto; padding: 24px; }

/* ─── Sections ─────────────────────────────────────────────────────────────── */
.admin-section { animation: fadeIn .2s ease; }
@keyframes fadeIn { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:none; } }

.section-heading {
  display: flex; align-items: center; gap: 10px;
  font-size: 18px; font-weight: 700; color: var(--text-primary);
  margin-bottom: 20px;
}
.section-heading i { width: 22px; height: 22px; color: var(--accent); }

/* ─── Cards ─────────────────────────────────────────────────────────────────── */
.admin-card {
  background: #131d2e; border: 1px solid rgba(255,255,255,.16); border-radius: 14px;
  padding: 20px; margin-bottom: 20px;
}
.card-head {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 700; color: var(--text-primary);
  text-transform: uppercase; letter-spacing: .06em;
  margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--border);
}
.card-head i { width: 16px; height: 16px; color: var(--accent); }
.card-head-link { margin-left: auto; font-size: 12px; font-weight: 500; color: var(--accent); text-decoration: none; text-transform: none; letter-spacing: normal; }
.card-head-link:hover { text-decoration: underline; }

.settings-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 20px; align-items: start; }
.dash-row { display: flex; gap: 20px; flex-wrap: wrap; }
.flex-1 { flex: 1 1 0; }
.flex-2 { flex: 2 1 0; }

/* ─── Dashboard stats ──────────────────────────────────────────────────────── */
.dash-stat-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 14px;
  margin-bottom: 20px;
}
.dash-stat-card {
  background: #131d2e; border: 1px solid rgba(255,255,255,.16); border-radius: 12px;
  padding: 16px; display: flex; align-items: center; gap: 12px;
}
.dash-stat-icon { width: 44px; height: 44px; border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.dash-stat-icon i { width: 22px; height: 22px; }
.dash-stat-value { font-size: 24px; font-weight: 800; color: var(--text-primary); line-height: 1; }
.dash-stat-label { font-size: 11px; color: #8090a8; margin-top: 3px; text-transform: uppercase; letter-spacing: .05em; }

/* PLC status block */
.plc-status-block { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.plc-led { width: 16px; height: 16px; border-radius: 50%; flex-shrink: 0; }
.plc-ip { font-size: 16px; font-weight: 700; color: var(--text-primary); }
.plc-mode { font-size: 12px; color: #8090a8; margin-top: 2px; }
.plc-meta { display: flex; flex-direction: column; gap: 6px; }
.meta-row { display: flex; justify-content: space-between; font-size: 12px; }
.meta-row span:first-child { color: #8090a8; }
.meta-row span:last-child  { color: var(--text-primary); font-weight: 600; font-variant-numeric: tabular-nums; }

/* Recent alerts list */
.recent-alerts-list { display: flex; flex-direction: column; gap: 6px; max-height: 240px; overflow-y: auto; }
.recent-alert-row {
  display: flex; align-items: center; gap: 10px; padding: 8px 10px;
  background: #1c2a3e; border-radius: 8px; font-size: 12px;
}
.recent-alert-row .rar-badge { padding: 2px 8px; border-radius: 6px; font-size: 10px; font-weight: 700; text-transform: uppercase; flex-shrink: 0; }
.recent-alert-row .rar-name  { flex: 1; color: var(--text-primary); font-weight: 600; }
.recent-alert-row .rar-val   { font-variant-numeric: tabular-nums; font-weight: 700; }
.recent-alert-row .rar-time  { color: #8090a8; flex-shrink: 0; }

/* ─── Forms ─────────────────────────────────────────────────────────────────── */
.form-group { margin-bottom: 14px; }
.form-group label { display: block; font-size: 12px; font-weight: 600; color: #8090a8; margin-bottom: 6px; text-transform: uppercase; letter-spacing: .04em; }
.form-input {
  width: 100%; padding: 9px 12px; background: #1c2a3e;
  border: 1px solid rgba(255,255,255,.16); border-radius: 8px;
  color: var(--text-primary); font-size: 13px; outline: none; box-sizing: border-box;
  transition: border-color .2s, box-shadow .2s;
}
.form-input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(0,180,140,.12); }
.form-input::placeholder { color: #8090a8; }
textarea.form-input { resize: vertical; min-height: 72px; font-family: inherit; }
.field-hint { display:block; margin-top:5px; color:var(--text-muted); font-size:11px; line-height:1.35; }
[data-theme="light"] .field-hint { color:#6b7c95; }

/* Numeric inputs: keep spinner/buttons readable in dark and light themes */
.form-input[type="number"],
input[type="number"].form-input {
  color-scheme: dark;
  background-color: #1c2a3e;
  color: var(--text-primary);
  accent-color: var(--accent);
}
.form-input[type="number"]::-webkit-inner-spin-button,
.form-input[type="number"]::-webkit-outer-spin-button,
input[type="number"].form-input::-webkit-inner-spin-button,
input[type="number"].form-input::-webkit-outer-spin-button {
  opacity: 1;
}
[data-theme="light"] .form-input[type="number"],
[data-theme="light"] input[type="number"].form-input {
  color-scheme: light;
  background-color: #edf3fc;
  color: #081525;
}
[data-theme="dark"] .form-input[type="number"],
[data-theme="dark"] input[type="number"].form-input,
:root:not([data-theme="light"]) .form-input[type="number"],
:root:not([data-theme="light"]) input[type="number"].form-input {
  color-scheme: dark;
  background-color: #1c2a3e;
  color: var(--text-primary);
}

/* select chevron handled by .form-select */

.input-icon-wrap { position: relative; }
.input-icon-wrap i { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; color: #8090a8; pointer-events: none; }
.input-icon-wrap .form-input { padding-left: 34px; }
.input-icon-wrap textarea.form-input { padding-left: 34px; padding-top: 9px; }

.form-row { display: flex; gap: 12px; }
.btn-row { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 4px; }

.help-text { font-size: 11px; color: #8090a8; margin-top: 4px; display: block; }

/* Toggle switch */
.toggle-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.toggle-label { font-size: 13px; font-weight: 600; color: var(--text-primary); }
.toggle-desc  { font-size: 11px; color: #8090a8; margin-top: 2px; }
.toggle-switch { position: relative; display: inline-block; width: 44px; height: 24px; flex-shrink: 0; cursor: pointer; }
.toggle-switch input { opacity: 0; width: 0; height: 0; }
.toggle-track {
  position: absolute; inset: 0; border-radius: 99px;
  background: var(--border); transition: background .2s;
}
.toggle-track::after {
  content: ''; position: absolute; top: 3px; left: 3px;
  width: 18px; height: 18px; border-radius: 50%; background: #fff;
  transition: transform .2s; box-shadow: 0 1px 3px rgba(0,0,0,.3);
}
.toggle-switch input:checked + .toggle-track { background: var(--accent); }
.toggle-switch input:checked + .toggle-track::after { transform: translateX(20px); }

/* ─── Logo upload ──────────────────────────────────────────────────────────── */
.logo-upload-area { display: flex; flex-direction: column; gap: 14px; }
.logo-preview-wrap {
  width: 100%; height: 120px; background: #1c2a3e;
  border: 1.5px dashed var(--border); border-radius: 10px;
  display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.logo-preview-wrap img { max-width: 100%; max-height: 100%; object-fit: contain; }
.logo-placeholder { display: flex; flex-direction: column; align-items: center; gap: 8px; color: #8090a8; font-size: 12px; }
.logo-actions { display: flex; gap: 8px; }

/* ─── Tag input ──────────────────────────────────────────────────────────────── */
.tag-input-wrap {
  min-height: 44px; padding: 6px 8px;
  background: #1c2a3e; border: 1px solid rgba(255,255,255,.16); border-radius: 8px;
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  transition: border-color .2s;
}
.tag-input-wrap:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(0,180,140,.12); }
.tag-list { display: contents; }
.tag-chip {
  display: flex; align-items: center; gap: 4px;
  background: rgba(0,180,140,.12); color: var(--accent);
  padding: 3px 8px; border-radius: 6px; font-size: 12px; font-weight: 600;
}
.tag-chip button { background: none; border: none; cursor: pointer; padding: 0; color: inherit; display: flex; align-items: center; opacity: .7; }
.tag-chip button:hover { opacity: 1; }
.tag-chip button i { width: 12px; height: 12px; }
.tag-input { flex: 1; min-width: 160px; background: none; border: none; outline: none; color: var(--text-primary); font-size: 13px; }

/* ─── Info box ──────────────────────────────────────────────────────────────── */
.info-box { display: flex; flex-direction: column; gap: 0; }
.info-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 9px 0; border-bottom: 1px solid var(--border);
}
.info-item:last-child { border-bottom: none; }
.info-key { font-size: 12px; color: #8090a8; font-weight: 500; }
.info-val { font-size: 13px; color: var(--text-primary); font-weight: 600; }

/* ─── Test result banner ────────────────────────────────────────────────────── */
.test-result {
  margin-top: 12px; padding: 10px 14px; border-radius: 8px; font-size: 13px; font-weight: 500;
  display: flex; align-items: center; gap: 8px;
}
.test-result.success { background: rgba(16,185,129,.12); color: #10b981; border: 1px solid rgba(16,185,129,.25); }
.test-result.error   { background: rgba(239,68,68,.1);   color: #ef4444; border: 1px solid rgba(239,68,68,.25); }
.test-result i { width: 16px; height: 16px; }

/* ─── Tables ────────────────────────────────────────────────────────────────── */
.table-toolbar {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;
  gap: 10px; margin-bottom: 14px;
}
.search-wrap { position: relative; flex: 1; min-width: 180px; }
.search-wrap > i, .search-wrap > svg { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 15px; height: 15px; color: var(--text-muted); pointer-events:none; }
.search-input {
  width: 100%; padding: 8px 12px 8px 32px; background: #1c2a3e;
  border: 1px solid rgba(255,255,255,.16); border-radius: 8px; color: var(--text-primary);
  font-size: 13px; outline: none; box-sizing: border-box;
}
.search-input:focus { border-color: var(--accent); }
.toolbar-right { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

.select-sm {
  padding: 7px 28px 7px 10px; background: #1c2a3e;
  border: 1px solid rgba(255,255,255,.16); border-radius: 8px; color: var(--text-primary);
  font-size: 12px; outline: none; appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%23637282' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 8px center;
}

.table-wrap { overflow-x: auto; border-radius: 10px; border: 1px solid rgba(255,255,255,.16); }
.data-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.data-table thead tr { background: #1c2a3e; }
.data-table th {
  padding: 10px 12px; text-align: left; color: #8090a8;
  font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  white-space: nowrap; border-bottom: 1px solid var(--border);
}
.data-table td {
  padding: 10px 12px; color: var(--text-primary); border-bottom: 1px solid var(--border);
  vertical-align: middle;
}
.data-table tr:last-child td { border-bottom: none; }
.data-table tbody tr:hover { background: rgba(255,255,255,.02); }

.empty-row { text-align: center; color: #8090a8; padding: 32px !important; }
.empty-row i { display: inline-block; margin-right: 8px; vertical-align: middle; width: 16px; height: 16px; }

.table-footer { font-size: 12px; color: #8090a8; padding: 8px 2px; text-align: right; }

/* severity chips in table */
.sev-chip {
  display: inline-flex; align-items: center;
  padding: 3px 10px; border-radius: 6px; font-size: 10px; font-weight: 700; text-transform: uppercase;
}
.sev-warning { background: rgba(245,158,11,.15); color: var(--status-warning); }
.sev-alarm   { background: rgba(249,115,22,.15); color: var(--status-alarm); }
.sev-danger  { background: rgba(239,68,68,.15);  color: var(--status-danger); }
.sev-normal  { background: rgba(16,185,129,.12); color: var(--status-normal); }
.sev-sensorDisabled, .sev-disabled { background: rgba(100,116,139,.15); color:#94a3b8; }

/* ─── Buttons (extras) ──────────────────────────────────────────────────────── */
.btn-block { width: 100%; justify-content: center; }
.btn-sm { padding: 6px 12px; font-size: 12px; }
.btn-danger { background: rgba(239,68,68,.15); color: #ef4444; border: 1px solid rgba(239,68,68,.3); }
.btn-danger:hover { background: rgba(239,68,68,.25); }

/* ─── Sensor table extras ───────────────────────────────────────────────────── */
.sensor-table td { font-size: 12px; }
.sensor-name-cell { max-width: 160px; }
.sensor-name-cell span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sensor-enabled  { display: inline-flex; align-items: center; gap: 5px; }
.sensor-enabled .dot { width: 7px; height: 7px; }
.sensor-disabled { color: #8090a8; font-size: 11px; }
.threshold-cell  { font-variant-numeric: tabular-nums; font-weight: 600; }
.btn-icon {
  padding: 5px; background: #1c2a3e; border: 1px solid rgba(255,255,255,.16);
  border-radius: 6px; cursor: pointer; color: #8090a8;
  display: inline-flex; align-items: center; transition: background .15s, color .15s;
}
.btn-icon:hover { background: rgba(0,180,140,.1); color: var(--accent); border-color: var(--accent); }
.btn-icon i { width: 14px; height: 14px; }

/* ─── Modal ─────────────────────────────────────────────────────────────────── */
.modal-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.7); backdrop-filter: blur(4px);
  z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 20px;
}
.modal-box {
  background: #131d2e; border: 1px solid rgba(255,255,255,.16); border-radius: 16px;
  width: 100%; max-height: 90vh; display: flex; flex-direction: column; overflow: hidden;
  box-shadow: 0 24px 80px rgba(0,0,0,.5);
}
.modal-lg { max-width: 680px; }
.modal-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 22px; border-bottom: 1px solid var(--border);
  font-size: 15px; font-weight: 700; color: var(--text-primary);
}
.modal-close { background: none; border: none; cursor: pointer; color: #8090a8; padding: 4px; border-radius: 6px; display: flex; }
.modal-close:hover { background: #1c2a3e; color: var(--text-primary); }
.modal-body { padding: 20px 22px; overflow-y: auto; flex: 1; }
.modal-foot { padding: 14px 22px; border-top: 1px solid var(--border); display: flex; justify-content: flex-end; gap: 10px; }

.modal-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.full-width { grid-column: 1 / -1; }
.modal-info-strip {
  display: flex; flex-wrap: wrap; gap: 12px; margin-top: 16px; padding-top: 14px;
  border-top: 1px solid var(--border); font-size: 11px; color: #8090a8;
}
.modal-info-strip span { display: flex; align-items: center; gap: 5px; }
.modal-info-strip i  { width: 13px; height: 13px; }

/* ─── Login ─────────────────────────────────────────────────────────────────── */
.login-overlay {
  position: fixed; inset: 0; background: var(--bg-root);
  display: flex; align-items: center; justify-content: center; z-index: 2000;
}
.login-card {
  background: #131d2e; border: 1px solid rgba(255,255,255,.16); border-radius: 20px;
  padding: 40px; width: 100%; max-width: 380px; text-align: center;
  box-shadow: 0 24px 80px rgba(0,0,0,.5);
}
.login-logo { margin-bottom: 20px; display: flex; justify-content: center; }
.login-icon-wrap {
  width: 72px; height: 72px; background: rgba(0,180,140,.1); border-radius: 18px;
  display: flex; align-items: center; justify-content: center;
  border: 1.5px solid rgba(0,180,140,.2);
}
.login-title { font-size: 22px; font-weight: 800; color: var(--text-primary); margin-bottom: 4px; }
.login-sub   { font-size: 13px; color: #8090a8; margin-bottom: 28px; }
.login-form  { display: flex; flex-direction: column; gap: 14px; text-align: left; }
.field-wrap  { position: relative; }
.field-icon  { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; color: #8090a8; pointer-events: none; }
.login-input {
  width: 100%; padding: 12px 12px 12px 38px; background: #1c2a3e;
  border: 1px solid rgba(255,255,255,.16); border-radius: 10px; color: var(--text-primary);
  font-size: 14px; outline: none; box-sizing: border-box;
}
.login-input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(0,180,140,.12); }
.login-error { background: rgba(239,68,68,.1); color: #ef4444; border: 1px solid rgba(239,68,68,.25); border-radius: 8px; padding: 8px 12px; font-size: 12px; }
.login-back  { display: inline-flex; align-items: center; gap: 6px; margin-top: 20px; font-size: 12px; color: #8090a8; text-decoration: none; }
.login-back:hover { color: var(--accent); }
.login-back i { width: 14px; height: 14px; }

/* ─── Area summary (system section) ─────────────────────────────────────────── */
.area-summary-admin { display: flex; flex-direction: column; gap: 10px; }
.asa-row { background: #1c2a3e; border-radius: 10px; padding: 12px 14px; }
.asa-head { display: flex; justify-content: space-between; font-size: 12px; font-weight: 700; color: var(--text-primary); margin-bottom: 8px; }
.asa-bar { height: 5px; background: var(--border); border-radius: 99px; overflow: hidden; }
.asa-fill { height: 100%; border-radius: 99px; transition: width .4s; }

/* ─── Responsive ─────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .admin-sidebar { position: fixed; left: -240px; top: 0; bottom: 0; transition: left .25s; z-index: 200; }
  .admin-sidebar.mobile-open { left: 0; }
  .topbar-menu-btn { display: flex; }
  .settings-grid { grid-template-columns: 1fr; }
  .modal-grid { grid-template-columns: 1fr; }
  .dash-stat-grid { grid-template-columns: repeat(2, 1fr); }
  .admin-content { padding: 16px; }
}

/* ─── Admin toast (simpler variant for admin panel) ─────────────────────────── */
.toast-container { position:fixed; bottom:24px; right:24px; z-index:9999; display:flex; flex-direction:column; gap:8px; }
.toast {
  display:flex; align-items:center; gap:10px; padding:12px 16px;
  background:#131d2e; border:1px solid rgba(255,255,255,.16); border-radius:10px;
  font-size:13px; font-weight:500; color:#eef2ff;
  box-shadow:0 8px 32px rgba(0,0,0,.4);
  opacity:0; transform:translateX(24px); transition:opacity .3s, transform .3s; min-width:220px;
}
.toast i { width:16px; height:16px; flex-shrink:0; }
.toast-show { opacity:1; transform:none; }
.toast-success { border-color:rgba(16,185,129,.35); }
.toast-success i { color:#10b981; }
.toast-error { border-color:rgba(239,68,68,.35); }
.toast-error i { color:#ef4444; }
.toast-info { border-color:rgba(99,102,241,.3); }

/* ═══════════════════════════════════════════════════════
   ENHANCED FORM FIELDS  (icon inside input)
═══════════════════════════════════════════════════════ */
.input-wrap {
  position:relative; display:flex; align-items:center;
}
.input-ico {
  position:absolute; left:11px; top:50%; transform:translateY(-50%);
  display:flex; align-items:center; color:var(--text-muted); pointer-events:none; z-index:1;
}
.input-ico i { display:block; }
.input-wrap .form-input { padding-left:36px !important; }
.input-wrap textarea.form-input { padding-top:10px; }
.input-wrap .input-ico[style*="top:14px"] { top:14px; transform:none; }

/* Field label with icon */
.field-lbl-icon { width:12px; height:12px; display:inline-block; vertical-align:middle; margin-right:4px; color:var(--text-muted); }

/* Select with chevron */
.form-select {
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237a8aaa' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 10px center;
  padding-right:28px !important;
}
[data-theme="light"] .form-select {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23445878' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

/* Toggle group (label + toggle side by side) */
.toggle-group { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 0; }
.toggle-info  { flex:1; }
.toggle-label { font-size:13px; font-weight:600; color:var(--text-primary); }
.toggle-desc  { font-size:11px; color:var(--text-muted); margin-top:2px; }
.form-group .toggle-group { margin-bottom:0; }

/* ── Alert type rows ─────────────────────────────────────────────────────── */
.alert-types-grid { display:flex; flex-direction:column; gap:2px; }
.alert-type-row {
  display:flex; align-items:center; gap:12px; padding:10px 12px;
  border-radius:10px; border:1px solid transparent; cursor:default;
  transition:background .15s;
}
.alert-type-row:hover { background:var(--bg-elevated); }
.at-icon { width:32px; height:32px; border-radius:8px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.at-warning .at-icon { background:rgba(245,158,11,.12); color:var(--status-warning); }
.at-alarm   .at-icon { background:rgba(249,115,22,.12); color:var(--status-alarm); }
.at-danger  .at-icon { background:rgba(239,68,68,.12);  color:var(--status-danger); }
.at-cal     .at-icon { background:rgba(124,58,237,.12); color:#a78bfa; }
.at-offline .at-icon { background:rgba(107,114,128,.1); color:var(--text-muted); }
.at-disabled .at-icon { background:rgba(100,116,139,.12); color:#94a3b8; }
.at-info    { flex:1; }
.at-label   { font-size:13px; font-weight:600; color:var(--text-primary); }
.at-desc    { font-size:11px; color:var(--text-muted); margin-top:1px; }

/* ── Recipients list ─────────────────────────────────────────────────────── */
.recipient-add-form { margin-bottom:12px; }
.rec-add-row { display:flex; gap:8px; align-items:center; }
.rec-add-row .input-wrap { min-width:0; }
.recipient-list { display:flex; flex-direction:column; gap:6px; max-height:420px; overflow-y:auto; }
.recipient-row {
  display:flex; align-items:flex-start; gap:10px; padding:10px;
  background:var(--bg-elevated); border-radius:12px; border:1px solid var(--border);
}
.rec-avatar {
  width:34px; height:34px; border-radius:50%; background:var(--accent-dim);
  color:var(--accent); font-size:14px; font-weight:800;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
  border:1.5px solid rgba(0,212,255,.3);
}
[data-theme="light"] .rec-avatar { background:rgba(0,118,168,.1); color:#0076a8; border-color:rgba(0,118,168,.25); }
.rec-info { flex:1; min-width:0; }
.rec-main { flex:1; min-width:0; display:flex; flex-direction:column; gap:8px; }
.rec-alert-types { display:flex; flex-wrap:wrap; gap:6px; }
.rec-alert-chip { display:inline-flex; align-items:center; gap:5px; padding:4px 7px; border-radius:999px; border:1px solid var(--border); background:rgba(255,255,255,.03); color:var(--text-muted); font-size:10px; font-weight:700; cursor:pointer; user-select:none; }
.rec-alert-chip input { width:12px; height:12px; accent-color:var(--accent); }
.rec-alert-chip:has(input:checked) { background:var(--accent-dim); color:var(--accent); border-color:rgba(0,212,255,.28); }
.card-head-note { margin-left:auto; font-size:11px; font-weight:600; color:var(--text-muted); }
.rec-name  { font-size:13px; font-weight:600; color:var(--text-primary); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rec-email { font-size:11px; color:var(--text-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rec-del   { background:none; border:none; cursor:pointer; color:var(--text-muted); padding:5px; border-radius:6px; display:flex; transition:all .15s; }
.rec-del:hover { background:rgba(239,68,68,.1); color:#ef4444; }
.empty-rec { text-align:center; color:var(--text-muted); font-size:12px; padding:20px; }

/* ── User avatar cell ────────────────────────────────────────────────────── */
.user-avatar-cell { display:flex; align-items:center; gap:10px; }
.user-av {
  width:36px; height:36px; border-radius:50%; background:var(--bg-elevated);
  border:1.5px solid var(--border); display:flex; align-items:center; justify-content:center;
  font-size:15px; font-weight:800; color:var(--accent); flex-shrink:0;
}
[data-theme="light"] .user-av { background:#edf3fc; color:#0076a8; border-color:rgba(0,118,168,.2); }
.user-av + div strong { color:var(--text-primary); }
.user-av + div small  { color:var(--text-muted); }

/* ── Table cells ──────────────────────────────────────────────────────────── */
.td-id    { font-size:11px; color:var(--text-muted); font-variant-numeric:tabular-nums; }
.td-mono  { font-variant-numeric:tabular-nums; color:var(--text-muted); font-size:12px; }
.td-name  { color:var(--text-primary); }
.td-name strong { display:block; font-weight:600; }
.td-name small  { display:block; color:var(--text-muted); font-size:10px; margin-top:1px; }
.td-thresh { font-variant-numeric:tabular-nums; font-weight:700; font-size:13px; }
.td-thresh.warn   { color:var(--status-warning); }
.td-thresh.alarm  { color:var(--status-alarm); }
.td-thresh.danger { color:var(--status-danger); }
.td-actions { white-space:nowrap; display:flex; gap:4px; }

.area-badge {
  display:inline-flex; align-items:center; padding:2px 8px; border-radius:6px;
  font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.04em;
  background:var(--accent-dim); color:var(--accent);
}
[data-theme="light"] .area-badge { background:rgba(0,118,168,.1); color:#0076a8; }

.sensor-status-cell { display:flex; align-items:center; gap:6px; font-size:12px; font-variant-numeric:tabular-nums; }

.tbl-btn {
  width:28px; height:28px; border-radius:6px; border:1px solid var(--border);
  background:var(--bg-elevated); cursor:pointer; display:flex; align-items:center; justify-content:center;
  color:var(--text-muted); transition:all .15s; flex-shrink:0;
}
.tbl-btn:hover { background:var(--accent-dim); color:var(--accent); border-color:rgba(0,212,255,.3); }
.tbl-btn-del:hover  { background:rgba(239,68,68,.1); color:#ef4444; border-color:rgba(239,68,68,.3); }
[data-theme="light"] .tbl-btn { background:#edf3fc; border-color:rgba(0,0,0,.13); }
[data-theme="light"] .tbl-btn:hover { background:rgba(0,118,168,.1); color:#0076a8; border-color:rgba(0,118,168,.25); }
[data-theme="light"] .tbl-btn-del:hover { background:rgba(192,26,26,.08); color:#c01a1a; }

/* ── Login fields ─────────────────────────────────────────────────────────── */
.login-field { position:relative; }
.login-field-icon {
  position:absolute; left:13px; top:50%; transform:translateY(-50%);
  color:var(--text-muted); display:flex; align-items:center; pointer-events:none; z-index:1;
}
.login-field .login-input { padding-left:40px; }

/* ── Sidebar logo collapsed ───────────────────────────────────────────────── */
.sidebar-logo-collapsed {
  display:none; align-items:center; justify-content:center;
  padding:10px 0; border-bottom:1px solid var(--border);
}
.admin-sidebar.collapsed .sidebar-logo-collapsed { display:flex; }
.admin-sidebar.collapsed .sidebar-logo-collapsed + .sidebar-logo { display:none; }

/* ── Sidebar user badge ───────────────────────────────────────────────────── */
.sidebar-user {
  font-size:11px; font-weight:600; color:var(--text-muted);
  padding:6px 10px; border-radius:8px; background:var(--bg-elevated);
  border:1px solid var(--border); margin-bottom:6px; text-align:center;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}

/* ── Empty state ──────────────────────────────────────────────────────────── */
.empty-state { display:flex; align-items:center; gap:8px; color:var(--text-muted); font-size:13px; padding:12px; }

/* ── Sensor enable/disable toggle button colors ── */
.tbl-btn-toggle[data-enabled="true"]  { background:rgba(16,185,129,.12); color:#10b981; border-color:rgba(16,185,129,.3); }
.tbl-btn-toggle[data-enabled="false"] { background:rgba(239,68,68,.12);  color:#ef4444; border-color:rgba(239,68,68,.3); }
.tbl-btn-toggle[data-enabled="true"]:hover  { background:rgba(16,185,129,.22); border-color:rgba(16,185,129,.5); }
.tbl-btn-toggle[data-enabled="false"]:hover { background:rgba(239,68,68,.22);  border-color:rgba(239,68,68,.5); }

/* ── Fix sidebar: only show logo img, not icon, when logo exists ── */
.has-logo #sidebarIcon { display:none !important; }
.has-logo #sidebarLogo { display:block !important; }

/* ── Collapsed sidebar: show logo cleanly ── */
.admin-sidebar.collapsed .sidebar-logo-collapsed {
  display:flex !important; align-items:center; justify-content:center;
  padding:12px 0; border-bottom:1px solid var(--border);
}
.admin-sidebar.collapsed .sidebar-logo-collapsed img { width:30px; height:30px; border-radius:8px; object-fit:cover; }
/* Hide text elements when collapsed */
.admin-sidebar.collapsed #sidebarLogoFull .sidebar-brand { display:none; }
.admin-sidebar.collapsed #sidebarLogoFull .sidebar-icon-wrap { display:none; }
.admin-sidebar.collapsed #sidebarLogoFull #sidebarLogo { display:none !important; }

/* ═════════════════════════════════════════════════════════════
   UI polish update – login, logo, icon picker, light-theme inputs
═════════════════════════════════════════════════════════════ */
.login-overlay {
  background:
    radial-gradient(circle at 18% 14%, rgba(0,212,255,.20), transparent 32%),
    radial-gradient(circle at 80% 16%, rgba(16,185,129,.16), transparent 30%),
    linear-gradient(135deg, #06111f 0%, #0c1f33 46%, #07131f 100%);
}
.login-overlay::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg,rgba(255,255,255,.035) 1px, transparent 1px);
  background-size:38px 38px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.75), transparent 85%);
}
.login-card {
  position:relative; z-index:1; overflow:hidden;
  width:min(430px, calc(100vw - 32px));
  border-radius:24px;
  border:1px solid rgba(0,212,255,.22);
  background:linear-gradient(180deg, rgba(13,28,45,.96), rgba(8,18,32,.94));
  box-shadow:0 26px 80px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.08);
}
.login-card::before {
  content:''; position:absolute; left:0; right:0; top:0; height:4px;
  background:linear-gradient(90deg,#00d4ff,#10b981,#a78bfa);
}
.login-badge {
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  padding:6px 11px; margin:0 auto 14px;
  border-radius:999px; background:rgba(0,212,255,.12); color:var(--accent);
  border:1px solid rgba(0,212,255,.22); font-size:11px; font-weight:800;
}
.login-icon-wrap { box-shadow:0 14px 34px rgba(0,212,255,.18); }
.login-title { letter-spacing:-.02em; }
.login-field-icon { color:var(--accent); }
.login-input { border-radius:12px; }
[data-theme="light"] .login-overlay {
  background:
    radial-gradient(circle at 18% 14%, rgba(0,118,168,.18), transparent 32%),
    radial-gradient(circle at 80% 16%, rgba(16,185,129,.13), transparent 30%),
    linear-gradient(135deg,#eef5fb 0%,#f8fbff 100%);
}
[data-theme="light"] .login-overlay::before { background-image:linear-gradient(rgba(0,0,0,.045) 1px, transparent 1px), linear-gradient(90deg,rgba(0,0,0,.045) 1px, transparent 1px); }
[data-theme="light"] .login-card { background:rgba(255,255,255,.96); border-color:rgba(0,118,168,.18); box-shadow:0 26px 70px rgba(15,35,55,.16); }
[data-theme="light"] .login-badge { background:rgba(0,118,168,.10); color:#0076a8; border-color:rgba(0,118,168,.20); }

.sidebar-logo #sidebarLogo {
  width:30px !important; height:30px !important; object-fit:contain !important;
  border-radius:8px; background:rgba(255,255,255,.08); padding:2px;
}
.admin-sidebar.collapsed .sidebar-logo-collapsed img {
  width:34px !important; height:34px !important; object-fit:contain !important;
  border-radius:10px; background:rgba(255,255,255,.08); padding:3px;
}
[data-theme="light"] .sidebar-logo #sidebarLogo,
[data-theme="light"] .admin-sidebar.collapsed .sidebar-logo-collapsed img { background:#fff; border:1px solid rgba(0,0,0,.08); }
.admin-sidebar.collapsed #sidebarLogoFull { display:none !important; }

.input-wrap .form-select { padding-left:36px !important; }
.input-wrap .input-ico { color:var(--accent); }
[data-theme="light"] .input-wrap .input-ico { color:#0076a8; opacity:.9; }
[data-theme="light"] .form-select { background-color:#f7fbff; color:#0d1b2a; }

.admin-section .logo-preview-wrap {
  background:linear-gradient(180deg, rgba(12,26,42,.72), rgba(8,18,30,.72));
  border:1px dashed rgba(0,212,255,.28);
}
[data-theme="light"] .admin-section .logo-preview-wrap,
[data-theme="light"] .admin-section .logo-placeholder {
  background:#f7fbff !important;
  color:#43566c !important;
  border-color:rgba(0,118,168,.18) !important;
}
[data-theme="light"] .admin-section .logo-placeholder i { color:#0076a8 !important; }

.area-icon-picker {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(42px,1fr)); gap:8px;
  padding:8px; border:1px solid var(--border); border-radius:12px; background:var(--bg-elevated);
}
.area-icon-option {
  height:38px; border-radius:10px; border:1px solid var(--border);
  background:var(--bg-card); color:var(--text-secondary); cursor:pointer;
  display:flex; align-items:center; justify-content:center; transition:all .15s ease;
}
.area-icon-option:hover { color:var(--accent); border-color:rgba(0,212,255,.35); transform:translateY(-1px); }
.area-icon-option.active { color:#fff; background:linear-gradient(135deg,#0076a8,#00b48c); border-color:transparent; box-shadow:0 10px 24px rgba(0,180,140,.22); }
[data-theme="light"] .area-icon-picker { background:#f7fbff; border-color:rgba(0,0,0,.12); }
[data-theme="light"] .area-icon-option { background:#fff; color:#526173; border-color:rgba(0,0,0,.12); }
[data-theme="light"] .area-icon-option.active { color:#fff; }

/* ═════════════════════════════════════════════════════════════
   Fix pack 2 – sidebar collapse button moved to topbar + logo fit
═════════════════════════════════════════════════════════════ */
.topbar-collapse-btn {
  width:38px; height:38px; border-radius:11px;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04); color:#94a3b8;
  cursor:pointer; transition:background .18s,color .18s,border-color .18s,transform .18s;
  flex-shrink:0;
}
.topbar-collapse-btn:hover { background:rgba(0,212,255,.10); color:var(--accent); border-color:rgba(0,212,255,.28); }
.topbar-collapse-btn i { width:19px; height:19px; transition:transform .2s ease; }
.admin-sidebar.collapsed ~ .admin-main .topbar-collapse-btn i { transform:rotate(180deg); }

.sidebar-header { gap:8px; }
.sidebar-logo { min-width:0; width:100%; }
.sidebar-logo #sidebarLogo {
  width:28px !important; height:28px !important; min-width:28px !important;
  object-fit:contain !important; object-position:center !important;
  padding:2px !important; border-radius:8px !important; background:rgba(255,255,255,.08);
}
.sidebar-name { max-width:150px; }
.admin-sidebar.collapsed .sidebar-header {
  justify-content:center !important; padding:12px 0 !important; min-height:64px;
}
.admin-sidebar.collapsed #sidebarLogoFull { display:none !important; }
.admin-sidebar.collapsed .sidebar-logo-collapsed {
  display:flex !important; width:44px; height:44px; padding:0 !important;
  border:0 !important; align-items:center; justify-content:center;
}
.admin-sidebar.collapsed .sidebar-logo-collapsed img {
  width:34px !important; height:34px !important; max-width:34px !important; max-height:34px !important;
  object-fit:contain !important; object-position:center !important;
  padding:3px !important; border-radius:10px !important; background:rgba(255,255,255,.08);
}
.admin-sidebar.collapsed .sidebar-logo-collapsed:empty::before {
  content:''; width:34px; height:34px; border-radius:10px;
  background:rgba(0,180,140,.12); border:1px solid rgba(0,212,255,.20);
}
[data-theme="light"] .topbar-collapse-btn {
  background:#f7fbff; color:#526173; border-color:rgba(0,0,0,.12);
}
[data-theme="light"] .topbar-collapse-btn:hover { color:#0076a8; background:rgba(0,118,168,.08); border-color:rgba(0,118,168,.22); }
[data-theme="light"] .sidebar-logo #sidebarLogo,
[data-theme="light"] .admin-sidebar.collapsed .sidebar-logo-collapsed img { background:#fff !important; border:1px solid rgba(0,0,0,.08); }
@media(max-width:760px){ .topbar-collapse-btn{display:none;} .topbar-menu-btn{display:flex;} }

/* Add Area icon picker: icons only, theme-aware */
.area-icon-picker { grid-template-columns:repeat(auto-fit,minmax(44px,1fr)) !important; }
.area-icon-option { height:42px !important; padding:0 !important; }
.area-icon-option span { display:none !important; }
.area-icon-option i { width:20px !important; height:20px !important; stroke-width:2.2; }
.area-icon-option.active { color:#05221c !important; background:linear-gradient(135deg,#00e0b0,#00b48c) !important; }
[data-theme="light"] .area-icon-option.active { color:#fff !important; background:linear-gradient(135deg,#0076a8,#00a3c7) !important; }
[data-theme="light"] .area-icon-option:hover { color:#0076a8; border-color:rgba(0,118,168,.28); background:rgba(0,118,168,.06); }

/* ═════════════════════════════════════════════════════════════
   Fix pack 3 – profile, area page, technician role
═════════════════════════════════════════════════════════════ */
.sidebar-profile-link {
  border:1px solid rgba(0,212,255,.16) !important;
  background:rgba(0,212,255,.06) !important;
  color:var(--text-primary) !important;
  margin-bottom:6px;
}
.sidebar-profile-link:hover { color:var(--accent) !important; background:rgba(0,212,255,.12) !important; }
.sidebar-profile-link i { color:var(--accent); }
.sidebar-user {
  align-items:center; justify-content:center; gap:6px;
}
.sidebar-user i { width:13px; height:13px; color:var(--accent); flex-shrink:0; }
.admin-sidebar.collapsed .sidebar-user { display:none !important; }
.admin-sidebar.collapsed .sidebar-profile-link { justify-content:center; padding:10px 0; }

.area-page-grid {
  display:grid; grid-template-columns:2fr 1fr; gap:16px; margin-bottom:16px;
}
.area-intro-card, .area-actions-card { min-height:150px; }
.area-page-copy { margin:0 0 16px; color:var(--text-muted); font-size:13px; line-height:1.55; }
.area-page-stats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.area-page-stats div {
  padding:14px; border-radius:14px; background:var(--bg-elevated); border:1px solid var(--border);
}
.area-page-stats strong { display:block; font-size:26px; line-height:1; color:var(--accent); margin-bottom:6px; }
.area-page-stats span { font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--text-muted); font-weight:800; }
.area-actions-card .btn { width:100%; justify-content:center; margin:6px 0 10px; }
.area-name-cell { display:inline-flex; align-items:center; gap:9px; }
.area-name-cell i { width:17px; height:17px; }
.area-icon-chip {
  width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:10px; background:var(--bg-elevated); border:1px solid var(--border);
}
.area-icon-chip i { width:18px; height:18px; }
.area-color-dot { display:inline-block; width:16px; height:16px; border-radius:999px; vertical-align:middle; margin-right:8px; border:1px solid rgba(255,255,255,.25); }

.profile-card { overflow:hidden; }
.profile-hero {
  display:flex; align-items:center; gap:16px; padding:6px 0 18px; margin-bottom:14px;
  border-bottom:1px solid var(--border);
}
.profile-avatar-lg {
  width:72px; height:72px; border-radius:22px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(0,212,255,.22), rgba(16,185,129,.18));
  color:var(--accent); font-size:30px; font-weight:900;
  border:1px solid rgba(0,212,255,.25);
  box-shadow:0 16px 38px rgba(0,0,0,.18);
}
.profile-hero h3 { margin:0 0 4px; color:var(--text-primary); font-size:20px; }
.profile-hero p { margin:0 0 8px; color:var(--text-muted); font-size:13px; }
.profile-info-box .info-item { padding:12px 0; }
.sev-technician { background:rgba(0,212,255,.13); color:var(--accent); }
[data-theme="light"] .sev-technician { background:rgba(0,118,168,.10); color:#0076a8; }
[data-theme="light"] .sidebar-profile-link { background:rgba(0,118,168,.06) !important; border-color:rgba(0,118,168,.16) !important; color:#0d1b2a !important; }
[data-theme="light"] .sidebar-profile-link:hover { background:rgba(0,118,168,.10) !important; color:#0076a8 !important; }
[data-theme="light"] .area-page-stats div,
[data-theme="light"] .area-icon-chip { background:#f7fbff; border-color:rgba(0,0,0,.12); }
[data-theme="light"] .area-color-dot { border-color:rgba(0,0,0,.16); }
[data-theme="light"] .profile-avatar-lg { background:linear-gradient(135deg, rgba(0,118,168,.12), rgba(16,185,129,.10)); color:#0076a8; border-color:rgba(0,118,168,.18); box-shadow:0 16px 36px rgba(15,35,55,.12); }
@media(max-width:900px){ .area-page-grid{grid-template-columns:1fr;} }

/* Global sensor thresholds */
.threshold-global-card {
  border-color: rgba(56,189,248,.18);
  background:
    radial-gradient(circle at top left, rgba(56,189,248,.08), transparent 32%),
    var(--card-bg, var(--bg-card));
}
.global-threshold-copy {
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.45;
  margin: -4px 0 16px;
}
.global-threshold-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr)) auto;
  gap: 14px;
  align-items: end;
}
.global-threshold-action {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  padding-bottom: 2px;
}
@media (max-width: 980px) {
  .global-threshold-grid { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
  .global-threshold-action { justify-content: flex-start; }
}
@media (max-width: 640px) {
  .global-threshold-grid { grid-template-columns: 1fr; }
  .global-threshold-action .btn { width: 100%; justify-content: center; }
}

/* Profile details + SMTP test recipient clarity */
.profile-edit-note,
.smtp-test-note {
  display:flex;
  align-items:flex-start;
  gap:8px;
  margin:0 0 14px;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(56,189,248,.08);
  border:1px solid rgba(56,189,248,.18);
  color:var(--text-muted);
  line-height:1.45;
}
.profile-edit-note i,
.smtp-test-note i { flex:0 0 auto; color:var(--accent); margin-top:2px; }
.smtp-test-note { margin-top:10px; }
[data-theme="light"] .profile-edit-note,
[data-theme="light"] .smtp-test-note {
  background:rgba(0,118,168,.07);
  border-color:rgba(0,118,168,.16);
  color:#445878;
}

/* ═════════════════════════════════════════════════════════════
   Advanced Add/Edit Sensor Modal – compact, icon-rich controls
═════════════════════════════════════════════════════════════ */
.sensor-modal-overlay {
  align-items:center;
  justify-content:center;
  padding:10px;
  background:rgba(0,0,0,.62);
  backdrop-filter:blur(8px);
}
.sensor-modal-card {
  width:min(760px, calc(100vw - 20px));
  max-width:760px;
  max-height:calc(100vh - 20px);
  border-radius:16px;
  overflow:hidden;
  background:linear-gradient(145deg, rgba(30,37,56,.98), rgba(19,29,46,.99));
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 28px 70px rgba(0,0,0,.55), 0 0 26px rgba(0,212,255,.10);
  animation:sensorModalUp .28s cubic-bezier(.16,1,.3,1);
}
.sensor-modal-card::before {
  content:'';
  position:absolute;
  left:0; right:0; top:0; height:1px;
  background:linear-gradient(90deg, transparent, rgba(0,212,255,.55), transparent);
}
.sensor-modal-head {
  min-height:auto;
  padding:14px 20px;
  align-items:center;
}
.sensor-modal-title-wrap {
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.sensor-title-accent {
  width:3px;
  height:34px;
  border-radius:99px;
  background:linear-gradient(180deg, #00d4ff, #10b981);
  box-shadow:0 0 12px rgba(0,212,255,.35);
  flex-shrink:0;
}
.sensor-modal-title-wrap small {
  display:block;
  margin-top:2px;
  color:var(--text-muted);
  font-size:11px;
  font-weight:500;
  line-height:1.25;
}
.sensor-modal-title {
  display:block;
  color:var(--text-primary);
  font-size:15px;
  font-weight:800;
  letter-spacing:.01em;
}
.sensor-modal-close {
  width:32px;
  height:32px;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  border-radius:9px;
  transition:all .18s ease;
}
.sensor-modal-close:hover {
  background:rgba(239,68,68,.18);
  color:#ef4444;
  border-color:rgba(239,68,68,.35);
  transform:rotate(90deg);
}
.sensor-modal-body {
  padding:14px 20px;
  overflow-y:auto;
  scrollbar-gutter:stable;
}
.sensor-form-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px 12px;
}
.sensor-field {
  gap:4px;
  min-width:0;
}
.sensor-field label {
  display:flex;
  align-items:center;
  gap:4px;
  min-height:16px;
  color:var(--text-muted);
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.sensor-field .help-text {
  margin-top:0;
  font-size:10.5px;
  line-height:1.25;
}
.sensor-input-wrap .form-input,
.sensor-number-input,
.sensor-notes {
  height:34px;
  border-radius:9px;
  background:rgba(255,255,255,.055);
  border:1.5px solid rgba(255,255,255,.13);
  transition:border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.sensor-input-wrap .form-input:hover,
.sensor-number-wrap:hover,
.sensor-notes:hover {
  background:rgba(255,255,255,.075);
  border-color:rgba(0,212,255,.25);
}
.sensor-input-wrap .form-input:focus,
.sensor-number-wrap:focus-within,
.sensor-notes:focus {
  border-color:rgba(0,212,255,.75);
  box-shadow:0 0 0 3px rgba(0,212,255,.10);
}
.sensor-number-wrap {
  position:relative;
  display:flex;
  align-items:center;
  min-height:34px;
  border-radius:9px;
  background:rgba(255,255,255,.055);
  border:1.5px solid rgba(255,255,255,.13);
  overflow:hidden;
  transition:border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.sensor-number-icon {
  position:absolute;
  left:10px;
  top:50%;
  transform:translateY(-50%);
  width:15px;
  height:15px;
  color:var(--accent);
  opacity:.9;
  pointer-events:none;
  z-index:2;
}
.sensor-number-icon i,
.sensor-num-reset i,
.sensor-spinner-btn i { width:100%; height:100%; display:block; }
.sensor-number-input {
  width:100%;
  padding:7px 66px 7px 34px !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  outline:none;
  -moz-appearance:textfield;
}
.sensor-number-input::-webkit-outer-spin-button,
.sensor-number-input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.sensor-number-tools {
  position:absolute;
  right:4px;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  align-items:center;
  gap:4px;
  z-index:3;
}
.sensor-num-reset {
  width:22px;
  height:22px;
  border-radius:6px;
  border:1px solid rgba(255,255,255,.13);
  background:rgba(255,255,255,.045);
  color:var(--text-muted);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:5px;
  transition:all .15s ease;
}
.sensor-num-reset:hover {
  color:#ef4444;
  background:rgba(239,68,68,.14);
  border-color:rgba(239,68,68,.30);
}
.sensor-spinner-box {
  width:18px;
  height:26px;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border-radius:6px;
  border:1px solid rgba(255,255,255,.13);
}
.sensor-spinner-btn {
  flex:1;
  min-height:0;
  padding:0 4px;
  border:0;
  background:rgba(255,255,255,.045);
  color:var(--text-muted);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:all .15s ease;
}
.sensor-spinner-btn:first-child { border-bottom:1px solid rgba(255,255,255,.13); }
.sensor-spinner-btn:hover { color:var(--accent); background:rgba(0,212,255,.13); }
.sensor-spinner-btn:active { background:rgba(0,212,255,.24); }
.sensor-notes {
  min-height:44px;
  height:44px;
  padding:8px 10px !important;
  resize:vertical;
}
.sensor-toggle-section {
  margin-top:10px;
  padding:10px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  border-radius:12px;
  background:linear-gradient(90deg, rgba(0,212,255,.07), rgba(16,185,129,.055));
  border:1px solid rgba(0,212,255,.16);
}
.sensor-toggle-copy h4 {
  display:flex;
  align-items:center;
  gap:6px;
  margin:0 0 2px;
  color:var(--text-primary);
  font-size:13px;
  font-weight:800;
}
.sensor-toggle-copy h4 i { width:14px; height:14px; color:#10b981; }
.sensor-toggle-copy p {
  margin:0;
  color:var(--text-muted);
  font-size:11px;
}
.sensor-toggle-switch { flex-shrink:0; }
.sensor-info-strip {
  justify-content:center;
  gap:8px 12px;
  margin-top:10px;
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:10px;
  background:rgba(255,255,255,.045);
  font-size:10.5px;
}
.sensor-info-strip span {
  padding:2px 0;
  color:var(--text-muted);
}
.sensor-info-strip strong {
  color:var(--text-primary);
  font-family:"Cascadia Mono", "Consolas", monospace;
  font-size:10.5px;
}
.sensor-info-strip i { color:var(--accent); }
.sensor-modal-foot {
  padding:12px 20px;
  background:rgba(255,255,255,.025);
}
.sensor-modal-foot .btn {
  height:34px;
  padding:8px 16px;
  font-weight:700;
}
.sensor-field-error {
  border-color:rgba(239,68,68,.85) !important;
  box-shadow:0 0 0 3px rgba(239,68,68,.10) !important;
}
.sensor-control-flash { border-color:rgba(0,212,255,.90) !important; }
@keyframes sensorModalUp { from{opacity:0; transform:translateY(18px) scale(.985);} to{opacity:1; transform:none;} }

[data-theme="light"] .sensor-modal-overlay { background:rgba(8,21,37,.38); }
[data-theme="light"] .sensor-modal-card {
  background:linear-gradient(145deg, rgba(255,255,255,.99), rgba(247,251,255,.98));
  border-color:rgba(0,0,0,.12);
  box-shadow:0 28px 70px rgba(20,40,65,.20), 0 0 20px rgba(0,118,168,.08);
}
[data-theme="light"] .sensor-modal-close {
  background:#f2f6fb;
  border-color:rgba(0,0,0,.11);
}
[data-theme="light"] .sensor-input-wrap .form-input,
[data-theme="light"] .sensor-number-wrap,
[data-theme="light"] .sensor-notes {
  background:#edf3fc;
  border-color:rgba(0,0,0,.14);
  color:#081525;
}
[data-theme="light"] .sensor-input-wrap .form-input:hover,
[data-theme="light"] .sensor-number-wrap:hover,
[data-theme="light"] .sensor-notes:hover {
  background:#f7fbff;
  border-color:rgba(0,118,168,.25);
}
[data-theme="light"] .sensor-input-wrap .form-input:focus,
[data-theme="light"] .sensor-number-wrap:focus-within,
[data-theme="light"] .sensor-notes:focus {
  border-color:#0076a8;
  box-shadow:0 0 0 3px rgba(0,118,168,.11);
}
[data-theme="light"] .sensor-number-input { color:#081525; }
[data-theme="light"] .sensor-num-reset,
[data-theme="light"] .sensor-spinner-box,
[data-theme="light"] .sensor-spinner-btn:first-child {
  border-color:rgba(0,0,0,.12);
}
[data-theme="light"] .sensor-num-reset,
[data-theme="light"] .sensor-spinner-btn { background:rgba(255,255,255,.78); }
[data-theme="light"] .sensor-toggle-section {
  background:linear-gradient(90deg, rgba(0,118,168,.08), rgba(16,185,129,.07));
  border-color:rgba(0,118,168,.16);
}
[data-theme="light"] .sensor-info-strip {
  background:#edf3fc;
  border-color:rgba(0,0,0,.12);
}
[data-theme="light"] .sensor-modal-foot { background:#f7fbff; }

@media (max-width: 640px) {
  .sensor-form-grid { grid-template-columns:1fr; }
  .sensor-modal-title-wrap small { display:none; }
  .sensor-info-strip { justify-content:flex-start; }
  .sensor-toggle-section { align-items:flex-start; }
}
.sensor-toggle-section.sensor-disabled-preview {
  background:linear-gradient(90deg, rgba(239,68,68,.08), rgba(239,68,68,.045));
  border-color:rgba(239,68,68,.20);
}
.sensor-toggle-section.sensor-disabled-preview .sensor-toggle-copy h4 i { color:#ef4444; }
.sensor-modal-foot .btn.is-loading {
  opacity:.78;
  cursor:wait;
  pointer-events:none;
}
.sensor-modal-foot .btn.is-loading i { animation:sensorSpin .8s linear infinite; }
@keyframes sensorSpin { to { transform:rotate(360deg); } }

/* Add/Edit Sensor modal refinements - dark dropdown, compact aligned icons, blank add-mode number fields */
#sensorModal .sensor-input-wrap select.form-select,
#sensorModal .sensor-input-wrap select.form-input {
  color-scheme: dark;
  background-color: rgba(255,255,255,.055);
  color: var(--text-primary);
}
#sensorModal .sensor-input-wrap select.form-select option,
#sensorModal .sensor-input-wrap select.form-input option,
#sensorModal .sensor-input-wrap select.form-select optgroup,
#sensorModal .sensor-input-wrap select.form-input optgroup {
  background: #111827;
  color: #e5edf9;
}
#sensorModal .sensor-input-wrap select.form-select:focus option,
#sensorModal .sensor-input-wrap select.form-input:focus option {
  background: #111827;
  color: #e5edf9;
}
[data-theme="light"] #sensorModal .sensor-input-wrap select.form-select,
[data-theme="light"] #sensorModal .sensor-input-wrap select.form-input {
  color-scheme: light;
  background-color: #edf3fc;
  color: #081525;
}
[data-theme="light"] #sensorModal .sensor-input-wrap select.form-select option,
[data-theme="light"] #sensorModal .sensor-input-wrap select.form-input option,
[data-theme="light"] #sensorModal .sensor-input-wrap select.form-select optgroup,
[data-theme="light"] #sensorModal .sensor-input-wrap select.form-input optgroup {
  background: #ffffff;
  color: #081525;
}
#sensorModal .sensor-number-icon {
  left: 8px;
  top: 0;
  bottom: 0;
  width: 22px;
  height: auto;
  transform: none;
  display: flex;
  align-items: center;
  justify-content: center;
}
#sensorModal .sensor-number-icon svg {
  width: 13px !important;
  height: 13px !important;
  stroke-width: 2.2;
  display: block;
}
#sensorModal .sensor-number-input {
  padding-left: 34px !important;
}
#sensorModal .sensor-num-reset svg {
  width: 12px !important;
  height: 12px !important;
  stroke-width: 2.2;
  display: block;
}
#sensorModal .sensor-spinner-btn svg {
  width: 9px !important;
  height: 9px !important;
  stroke-width: 2.5;
  display: block;
}
#sensorModal .sensor-number-tools {
  height: 28px;
}

/* Workflow, reports, notification UI */
.alert-workflow-cards{display:grid;grid-template-columns:repeat(4,minmax(130px,1fr));gap:12px;margin-bottom:16px}.workflow-card{background:var(--card-bg);border:1px solid var(--border);border-radius:16px;padding:14px 16px;box-shadow:var(--shadow-sm)}.workflow-card strong{display:block;font-size:28px;line-height:1}.workflow-card span{font-size:12px;color:var(--text-muted);font-weight:700;text-transform:uppercase;letter-spacing:.06em}.workflow-card.new strong{color:#38bdf8}.workflow-card.ack strong{color:#f59e0b}.workflow-card.resolved strong{color:#10b981}.workflow-card.danger strong{color:#ef4444}.workflow-chip{display:inline-flex;border-radius:999px;padding:4px 9px;font-size:11px;font-weight:800;text-transform:capitalize}.wf-new{background:rgba(56,189,248,.14);color:#38bdf8}.wf-acknowledged{background:rgba(245,158,11,.14);color:#f59e0b}.wf-resolved{background:rgba(16,185,129,.14);color:#10b981}.muted-small{display:block;margin-top:3px;font-size:11px;color:var(--text-muted)}.advanced-toolbar{gap:10px;flex-wrap:wrap}.sensor-disabled-fields{background:rgba(100,116,139,.08);border:1px dashed var(--border);border-radius:16px;padding:14px;margin-top:12px}.sensor-detail-box{max-width:920px}.sensor-detail-grid{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:12px;margin-bottom:16px}.detail-card{background:rgba(148,163,184,.08);border:1px solid var(--border);border-radius:16px;padding:14px}.detail-card span{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);font-weight:800}.detail-card strong{display:block;margin-top:6px;font-size:20px}.detail-section{margin-top:16px}.detail-section h4{margin:0 0 10px;font-size:14px}.info-box.compact{grid-template-columns:repeat(2,minmax(160px,1fr))}.reports-toolbar{margin-bottom:14px}.reports-stats{margin:14px 0}.trend-canvas{width:100%;height:320px;background:rgba(15,23,42,.18);border:1px solid var(--border);border-radius:18px}.delivery-log{display:flex;flex-direction:column;gap:8px;max-height:360px;overflow:auto}.delivery-row{border:1px solid var(--border);border-radius:12px;padding:10px 12px;background:rgba(148,163,184,.08)}.delivery-row.ok{border-color:rgba(16,185,129,.35)}.delivery-row.bad{border-color:rgba(239,68,68,.35)}.delivery-row small{color:var(--text-muted)}.soft-divider{border:0;border-top:1px solid var(--border);margin:18px 0}.align-center{align-items:end}.sms-alert-types{margin:12px 0}.sev-calibrationDue,.sev-sensorDisabled,.sev-sensorOffline{background:rgba(100,116,139,.15);color:#94a3b8}.sensor-detail-body .recent-alert-row{margin-bottom:8px}.td-actions{white-space:nowrap}.tbl-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:1px solid var(--border);border-radius:10px;background:rgba(148,163,184,.08);color:var(--text);margin:0 2px;cursor:pointer}.tbl-btn:hover{border-color:var(--accent);color:var(--accent)}
@media(max-width:900px){.alert-workflow-cards,.sensor-detail-grid{grid-template-columns:repeat(2,1fr)}.toolbar-right{flex-wrap:wrap}.info-box.compact{grid-template-columns:1fr}}

.template-preview-frame{width:100%;height:420px;border:1px solid var(--border);border-radius:18px;background:#fff;box-shadow:inset 0 0 0 1px rgba(15,23,42,.05)}

/* Enhanced reports, notifications, sensor detail and web modals */
.pro-hero-card{position:relative;display:flex;align-items:center;gap:18px;padding:20px 22px;margin:0 0 18px;border:1px solid var(--border);border-radius:24px;background:linear-gradient(135deg,rgba(0,212,255,.10),rgba(124,58,237,.08) 48%,rgba(15,23,42,.16));box-shadow:0 18px 42px rgba(0,0,0,.22);overflow:hidden}.pro-hero-card:before{content:"";position:absolute;inset:-120px auto auto -120px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(0,212,255,.22),transparent 62%);pointer-events:none}.pro-hero-icon{width:64px;height:64px;border-radius:20px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(0,212,255,.22),rgba(124,58,237,.16));border:1px solid rgba(0,212,255,.25);color:var(--accent);box-shadow:0 10px 30px rgba(0,212,255,.10);flex-shrink:0}.pro-hero-icon svg{width:30px;height:30px}.pro-hero-icon.sms{color:#22c55e;background:linear-gradient(135deg,rgba(34,197,94,.18),rgba(14,165,233,.10))}.pro-hero-icon.floor{color:#a78bfa;background:linear-gradient(135deg,rgba(167,139,250,.18),rgba(0,212,255,.10))}.pro-hero-copy{position:relative;flex:1}.pro-eyebrow{display:inline-flex;align-items:center;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);margin-bottom:6px}.pro-hero-copy h3{margin:0 0 6px;font-size:24px;line-height:1.15;color:var(--text-primary)}.pro-hero-copy p{margin:0;max-width:780px;color:var(--text-secondary);font-size:14px;line-height:1.5}.pro-hero-badges{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}.hero-badge,.secure-pill,.notification-chip{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--border);border-radius:999px;padding:8px 11px;background:rgba(148,163,184,.10);color:var(--text-secondary);font-size:12px;font-weight:800}.hero-badge svg,.secure-pill svg,.notification-chip svg{width:14px;height:14px;color:var(--accent)}.hero-badge strong{color:var(--text-primary)}.split-head{display:flex!important;align-items:center;justify-content:space-between;gap:12px}.split-head>span:first-child{display:inline-flex;align-items:center;gap:8px}.pro-filter-card{padding:16px}.pro-filter-grid{display:grid;grid-template-columns:minmax(170px,1fr) minmax(210px,1.35fr) minmax(150px,1fr) minmax(170px,1fr) auto;gap:12px;align-items:end}.report-actions{white-space:nowrap;justify-content:flex-end}.reports-kpis{grid-template-columns:repeat(4,minmax(140px,1fr));gap:12px}.pro-kpi{border-radius:18px}.pro-kpi.danger .dash-stat-icon,.pro-kpi.danger .dash-stat-value{color:#ef4444}.pro-kpi.warning .dash-stat-icon,.pro-kpi.warning .dash-stat-value{color:#f59e0b}.pro-kpi.alarm .dash-stat-icon,.pro-kpi.alarm .dash-stat-value{color:#f97316}.reports-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(310px,.7fr);gap:16px;margin-top:16px}.report-chart-card,.report-insights-card,.report-table-card{border-radius:22px}.trend-canvas-pro{height:380px;background:linear-gradient(180deg,rgba(15,23,42,.30),rgba(15,23,42,.12));border-radius:20px}.report-insights{display:flex;flex-direction:column;gap:10px}.insight-row{display:flex;align-items:flex-start;gap:11px;padding:12px;border:1px solid var(--border);border-radius:15px;background:rgba(148,163,184,.08)}.insight-row svg{width:18px;height:18px;color:var(--accent);margin-top:2px}.insight-row span{display:block;color:var(--text-muted);font-size:11px;text-transform:uppercase;letter-spacing:.07em;font-weight:900}.insight-row strong{display:block;margin-top:3px;color:var(--text-primary);font-size:13px}.insight-row.danger{border-color:rgba(239,68,68,.35);background:rgba(239,68,68,.08)}.insight-row.alarm{border-color:rgba(249,115,22,.35);background:rgba(249,115,22,.08)}.insight-row.warning{border-color:rgba(245,158,11,.35);background:rgba(245,158,11,.08)}.insight-row.ok{border-color:rgba(16,185,129,.30);background:rgba(16,185,129,.07)}.mini-event-list{display:flex;flex-direction:column;gap:8px;max-height:290px;overflow:auto}.mini-event{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--border);border-radius:14px;background:rgba(148,163,184,.07)}.mini-event strong{display:block;font-size:12px;color:var(--text-primary)}.mini-event small{display:block;color:var(--text-muted);font-size:11px}.report-health{display:inline-flex;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:900;text-transform:uppercase}.report-health.normal{background:rgba(16,185,129,.13);color:#10b981}.report-health.warning{background:rgba(245,158,11,.13);color:#f59e0b}.report-health.alarm{background:rgba(249,115,22,.13);color:#f97316}.report-health.danger{background:rgba(239,68,68,.13);color:#ef4444}.notification-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(350px,.85fr);gap:16px}.right-notification-stack{display:flex;flex-direction:column;gap:16px}.notification-status-pill{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:10px 14px;border:1px solid var(--border);background:rgba(148,163,184,.10);font-size:12px;font-weight:900;color:var(--text-secondary);white-space:nowrap}.notification-status-pill.on{border-color:rgba(34,197,94,.35);background:rgba(34,197,94,.10);color:#22c55e}.notification-status-pill.off{border-color:rgba(100,116,139,.35);background:rgba(100,116,139,.10);color:#94a3b8}.sms-config-card,.escalation-card,.delivery-card,.template-preview-card{border-radius:22px}.pro-toggle-row{border:1px solid var(--border);border-radius:18px;background:rgba(148,163,184,.08);padding:14px}.card-subhead{display:flex;align-items:center;gap:8px;margin:18px 0 10px;font-weight:900;color:var(--text-primary)}.card-subhead svg{width:16px;height:16px;color:var(--accent)}.sms-recipients-box{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;line-height:1.5}.sms-preview-strip{display:flex;flex-wrap:wrap;gap:8px;margin:-4px 0 12px;min-height:34px}.sms-rec-chip,.empty-inline{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--border);border-radius:999px;padding:7px 10px;background:rgba(148,163,184,.08);font-size:12px;color:var(--text-secondary)}.sms-rec-chip strong{color:var(--text-primary)}.sms-rec-chip em{font-style:normal;color:var(--accent);font-weight:900}.sms-rec-chip svg,.empty-inline svg{width:13px;height:13px}.pro-alert-types .alert-type-row{min-height:78px;border-radius:18px}.pro-alert-types .at-icon{width:38px;height:38px}.sticky-action-row{position:sticky;bottom:0;z-index:2;margin-top:14px;padding-top:12px;background:linear-gradient(180deg,transparent,var(--bg-card) 32%)}.escalation-timeline{position:relative;display:flex;flex-direction:column;gap:10px;margin:12px 0}.esc-step{display:grid;grid-template-columns:36px minmax(0,1fr) 78px 28px;align-items:center;gap:10px;padding:12px;border:1px solid var(--border);border-radius:16px;background:rgba(148,163,184,.07)}.esc-step>span:first-child{width:30px;height:30px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:rgba(0,212,255,.12);color:var(--accent);font-weight:950}.esc-step strong{display:block;color:var(--text-primary);font-size:13px}.esc-step small{display:block;color:var(--text-muted);font-size:11px}.esc-step input{height:36px;text-align:center}.esc-step em{font-style:normal;color:var(--text-muted);font-size:11px;font-weight:900}.full-btn{width:100%;justify-content:center}.delivery-row-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.delivery-type{font-size:10px;font-weight:900;text-transform:uppercase;color:var(--accent)}.template-preview-card{margin-top:16px}.template-preview-frame{border-radius:18px}.floor-editor-shell{border-radius:24px;border-color:rgba(167,139,250,.18)}.sensor-detail-box{max-width:1040px!important}.sensor-detail-head{background:linear-gradient(135deg,rgba(0,212,255,.12),rgba(124,58,237,.08))}.enhanced-close{width:38px!important;height:38px!important;border-radius:13px!important;border:1px solid var(--border)!important;background:rgba(148,163,184,.10)!important;display:flex!important;align-items:center!important;justify-content:center!important;color:var(--text-primary)!important}.enhanced-close:hover{border-color:rgba(239,68,68,.45)!important;background:rgba(239,68,68,.10)!important;color:#ef4444!important}.sensor-detail-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px;border-radius:20px;border:1px solid var(--border);background:linear-gradient(135deg,rgba(148,163,184,.10),rgba(15,23,42,.12));margin-bottom:14px}.sensor-detail-hero.danger{border-color:rgba(239,68,68,.35);background:linear-gradient(135deg,rgba(239,68,68,.14),rgba(15,23,42,.08))}.sensor-detail-status strong{display:block;font-size:38px;line-height:1;margin:8px 0 4px;color:var(--text-primary)}.sensor-detail-status small{color:var(--text-muted)}.sensor-detail-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.pro-detail-grid{grid-template-columns:repeat(4,minmax(130px,1fr))}.sensor-detail-columns{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(230px,.6fr);gap:14px}.detail-chart-section{border:1px solid var(--border);border-radius:18px;padding:14px;background:rgba(148,163,184,.06)}.detail-chart-section h4{margin:0}.sensor-detail-trend{width:100%;height:210px;border-radius:14px;background:rgba(15,23,42,.18);border:1px solid var(--border)}.threshold-stack{display:flex;flex-direction:column;gap:10px}.threshold-stack>div{display:flex;align-items:center;justify-content:space-between;border:1px solid var(--border);border-radius:14px;padding:12px;background:rgba(148,163,184,.08)}.threshold-stack span{font-size:12px;color:var(--text-muted);font-weight:900}.threshold-stack strong{font-size:18px;color:var(--text-primary)}.pro-info-box .info-item{border-radius:14px}.pro-alert-row{border:1px solid var(--border);border-radius:14px;padding:10px;background:rgba(148,163,184,.07)}.disable-sensor-box{max-width:620px!important}.danger-head{background:linear-gradient(135deg,rgba(239,68,68,.14),rgba(245,158,11,.08));color:#fecaca}.danger-head span{display:flex;align-items:center;gap:8px}.disable-warning-panel{display:flex;gap:14px;align-items:flex-start;border:1px solid rgba(239,68,68,.28);border-radius:18px;padding:16px;background:rgba(239,68,68,.08);margin-bottom:14px}.disable-warning-icon{width:46px;height:46px;border-radius:15px;display:flex;align-items:center;justify-content:center;background:rgba(239,68,68,.16);color:#ef4444;flex-shrink:0}.disable-warning-icon svg{width:24px;height:24px}.disable-warning-panel h3{margin:0 0 5px;color:var(--text-primary)}.disable-warning-panel p{margin:0;color:var(--text-secondary);line-height:1.45}.required-dot{color:#ef4444;font-weight:900;font-size:11px}.disable-summary-strip{display:flex;gap:8px;align-items:center;border:1px solid var(--border);border-radius:14px;padding:11px 12px;background:rgba(245,158,11,.08);color:var(--text-secondary);font-size:12px;font-weight:750}.disable-summary-strip svg{width:15px;height:15px;color:#f59e0b}.sensor-field-error{border-color:#ef4444!important;box-shadow:0 0 0 3px rgba(239,68,68,.12)!important}
[data-theme="light"] .pro-hero-card{background:linear-gradient(135deg,#effaff,#f8f5ff 52%,#fff);box-shadow:0 16px 36px rgba(15,35,55,.10)}[data-theme="light"] .trend-canvas-pro,[data-theme="light"] .sensor-detail-trend{background:#f8fbff}[data-theme="light"] .sticky-action-row{background:linear-gradient(180deg,transparent,#fff 32%)}
@media(max-width:1300px){.pro-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.report-actions{grid-column:1/-1;justify-content:flex-start}.reports-layout,.notification-layout,.sensor-detail-columns{grid-template-columns:1fr}.reports-kpis{grid-template-columns:repeat(2,minmax(140px,1fr))}.pro-hero-card{align-items:flex-start;flex-direction:column}.pro-hero-badges{justify-content:flex-start}.notification-status-pill{white-space:normal}}@media(max-width:720px){.reports-kpis{grid-template-columns:1fr}.pro-filter-grid{grid-template-columns:1fr}.pro-detail-grid{grid-template-columns:repeat(2,minmax(120px,1fr))}.sensor-detail-hero{align-items:flex-start;flex-direction:column}.esc-step{grid-template-columns:34px minmax(0,1fr)}.esc-step input,.esc-step em{grid-column:2}.notification-layout{display:block}.right-notification-stack{margin-top:16px}}

/* ════════════════════════════════════════════════════════════════════════
   v36 Admin UI polish: dashboard, general, sensors, security/profile, dialogs
════════════════════════════════════════════════════════════════════════ */
.admin-content{padding:18px;scrollbar-gutter:stable;}
.admin-section{max-width:1680px;margin:0 auto;}
.card-head-sub{margin-left:8px;color:var(--text-muted);font-size:11px;font-weight:800;letter-spacing:.02em;text-transform:none;}
.admin-hero-modern{display:flex;align-items:stretch;justify-content:space-between;gap:18px;margin:0 0 16px;padding:18px;border:1px solid rgba(0,212,255,.18);border-radius:24px;background:radial-gradient(circle at top left,rgba(0,212,255,.16),transparent 35%),linear-gradient(135deg,rgba(15,23,42,.72),rgba(30,41,59,.38));box-shadow:0 18px 44px rgba(0,0,0,.16);overflow:hidden;position:relative;}
.admin-hero-modern:before{content:"";position:absolute;inset:-60% -20% auto auto;width:320px;height:320px;background:radial-gradient(circle,rgba(124,58,237,.22),transparent 65%);pointer-events:none;}
.hero-copy-modern{position:relative;z-index:1;min-width:0;}
.hero-eyebrow-modern{display:inline-flex;align-items:center;gap:7px;color:var(--accent);font-size:11px;font-weight:950;text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px;}
.hero-eyebrow-modern svg{width:14px;height:14px;}
.hero-copy-modern h2{margin:0 0 6px;font-size:clamp(21px,2vw,34px);line-height:1.05;color:var(--text-primary);}
.hero-copy-modern p{margin:0;color:var(--text-secondary);line-height:1.45;max-width:820px;font-size:13px;}
.hero-actions-modern{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;}
.hero-status-grid-modern,.security-kpis,.sensor-health-strip,.profile-mini-metrics{position:relative;z-index:1;display:grid;gap:10px;align-content:stretch;}
.hero-status-grid-modern{grid-template-columns:repeat(3,minmax(120px,1fr));min-width:420px;}
.hero-status-tile-modern,.security-kpis>div,.sensor-health-strip>div,.profile-mini-metrics>div,.general-preview-card{border:1px solid var(--border);border-radius:18px;background:rgba(148,163,184,.08);padding:13px;backdrop-filter:blur(8px);}
.hero-status-tile-modern span,.security-kpis span,.sensor-health-strip span,.profile-mini-metrics span{display:block;color:var(--text-muted);font-size:10px;font-weight:950;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px;}
.hero-status-tile-modern strong,.security-kpis strong,.sensor-health-strip strong,.profile-mini-metrics strong{display:block;color:var(--text-primary);font-size:20px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.hero-status-tile-modern small{display:block;margin-top:4px;color:var(--text-muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.dashboard-command-hero{margin-bottom:14px;}
.dashboard-grid-modern{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(320px,.65fr);gap:14px;margin-top:14px;}
.dashboard-area-risk{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.area-risk-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;border:1px solid var(--border);border-radius:16px;padding:11px;background:rgba(148,163,184,.07);position:relative;overflow:hidden;}
.area-risk-row.warning{border-color:rgba(245,158,11,.30);background:rgba(245,158,11,.07)}.area-risk-row.alarm{border-color:rgba(249,115,22,.30);background:rgba(249,115,22,.07)}.area-risk-row.danger{border-color:rgba(239,68,68,.34);background:rgba(239,68,68,.08)}.area-risk-row.offline{border-color:rgba(100,116,139,.28)}
.area-risk-main{display:flex;align-items:center;gap:10px;min-width:0}.area-risk-main>i,.area-risk-main svg{width:22px;height:22px;flex:0 0 auto}.area-risk-main strong{display:block;color:var(--text-primary);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.area-risk-main small{display:block;color:var(--text-muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.area-risk-reading{text-align:right}.area-risk-reading strong{display:block;font-size:15px;color:var(--text-primary)}.area-risk-reading span{display:block;font-size:10px;color:var(--text-muted);max-width:140px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.area-risk-bar{grid-column:1/-1;height:5px;border-radius:99px;background:rgba(148,163,184,.16);overflow:hidden}.area-risk-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--status-normal),var(--status-warning),var(--status-danger));}
.dashboard-actions-list{display:grid;gap:10px}.dash-action{display:flex;align-items:center;gap:12px;text-align:left;border:1px solid var(--border);border-radius:16px;background:rgba(148,163,184,.07);padding:12px;color:var(--text-primary);cursor:pointer;transition:.18s ease}.dash-action:hover{transform:translateY(-1px);border-color:rgba(0,212,255,.35);background:rgba(0,212,255,.08)}.dash-action svg{width:20px;height:20px;color:var(--accent);flex:0 0 auto}.dash-action strong{display:block;font-size:13px}.dash-action small{display:block;color:var(--text-muted);font-size:11px;margin-top:2px}
.dash-row{gap:14px}.dash-stat-grid{gap:10px}.dash-stat-card{min-height:74px}.plc-meta{gap:6px}.recent-alerts-list{max-height:280px;overflow:auto;}
.general-settings-layout,.profile-layout-modern,.security-layout-modern{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(340px,.8fr);gap:16px;align-items:start}.general-preview-card{display:flex;align-items:center;gap:12px;min-width:310px}.general-preview-logo{width:58px;height:58px;border-radius:18px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);background:rgba(0,212,255,.10);overflow:hidden}.general-preview-logo img{width:100%;height:100%;object-fit:contain}.general-preview-logo svg{width:28px;height:28px;color:var(--accent)}.general-preview-card strong{display:block;color:var(--text-primary);font-size:18px}.general-preview-card span{display:block;color:var(--text-muted);font-size:12px}.general-health-strip,.general-logo-tips,.password-guidance{display:flex;flex-wrap:wrap;gap:9px;margin-top:10px}.general-health-strip span,.general-logo-tips span,.password-guidance span{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);border-radius:999px;padding:7px 10px;background:rgba(148,163,184,.07);font-size:11px;color:var(--text-secondary);font-weight:800}.general-health-strip svg,.general-logo-tips svg,.password-guidance svg{width:13px;height:13px;color:var(--accent)}.logo-upload-pro{border-radius:20px;border:1px dashed rgba(0,212,255,.26);background:rgba(0,212,255,.04)}
.sensors-hero{border-color:rgba(34,197,94,.18)}.sensor-health-strip{grid-template-columns:repeat(4,minmax(92px,1fr));min-width:430px}.sensor-toolbar-pro{align-items:flex-end;gap:14px}.sensor-toolbar-pro>div:first-child{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}.sensor-toolbar-pro .compact-head{border:0;padding:0;margin:0;white-space:nowrap}.sensor-table-card-pro{border-radius:22px}.sensor-table-wrap{max-height:calc(100vh - 390px);min-height:320px;overflow:auto}.sensor-row-warning td{background:rgba(245,158,11,.025)}.sensor-row-alarm td{background:rgba(249,115,22,.035)}.sensor-row-danger td{background:rgba(239,68,68,.045)}.sensor-row-disabled{opacity:.78}.threshold-global-card-pro{margin-bottom:14px}.threshold-global-card-pro .global-threshold-grid{gap:12px}.select-sm{min-height:34px}.search-wrap{min-width:min(360px,100%)}
.profile-hero-pro{align-items:center}.profile-avatar-modern{width:82px!important;height:82px!important;font-size:30px!important;margin:0!important;flex:0 0 auto}.profile-mini-metrics{grid-template-columns:repeat(2,minmax(140px,1fr));min-width:330px}.profile-layout-modern .admin-card{border-radius:22px}.security-hero{border-color:rgba(99,102,241,.22)}.security-kpis{grid-template-columns:repeat(3,minmax(110px,1fr));min-width:390px}.role-guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.role-guide{border:1px solid var(--border);border-radius:16px;padding:12px;background:rgba(148,163,184,.07)}.role-guide strong{display:block;color:var(--text-primary);font-size:13px;margin-bottom:4px}.role-guide span{display:block;color:var(--text-muted);font-size:11px;line-height:1.35}.role-guide.admin{border-color:rgba(239,68,68,.25)}.role-guide.tech{border-color:rgba(0,212,255,.25)}.role-guide.staff{border-color:rgba(249,115,22,.25)}.role-guide.viewer{border-color:rgba(34,197,94,.25)}.security-reminder{display:flex;gap:10px;margin-top:12px;border:1px solid rgba(245,158,11,.24);border-radius:16px;padding:12px;background:rgba(245,158,11,.07);color:var(--text-secondary);font-size:12px;line-height:1.35}.security-reminder svg{width:18px;height:18px;color:#f59e0b;flex:0 0 auto}.users-card-modern{margin-top:16px;border-radius:22px}.user-avatar-cell{min-width:210px}
.app-dialog-box{max-width:560px!important;border-radius:24px!important;overflow:hidden}.app-dialog-head span{display:flex;align-items:center;gap:9px}.app-dialog-body{display:flex;gap:15px;align-items:flex-start}.app-dialog-icon{width:52px;height:52px;border-radius:17px;display:flex;align-items:center;justify-content:center;background:rgba(0,212,255,.12);color:var(--accent);flex:0 0 auto}.app-dialog-icon.danger{background:rgba(239,68,68,.12);color:#ef4444}.app-dialog-icon svg{width:25px;height:25px}.app-dialog-content{min-width:0;flex:1}.app-dialog-content p{margin:2px 0 12px;color:var(--text-secondary);line-height:1.5}.app-dialog-input{resize:vertical;min-height:96px}.app-dialog-error{margin-top:8px;color:#ef4444;font-size:12px;font-weight:850}.app-dialog-foot{justify-content:flex-end}.app-dialog-overlay{z-index:10050!important}
[data-theme="light"] .admin-hero-modern{background:radial-gradient(circle at top left,rgba(0,118,168,.13),transparent 34%),linear-gradient(135deg,#ffffff,#f2f7ff);box-shadow:0 16px 36px rgba(15,35,55,.10)}[data-theme="light"] .hero-status-tile-modern,[data-theme="light"] .security-kpis>div,[data-theme="light"] .sensor-health-strip>div,[data-theme="light"] .profile-mini-metrics>div,[data-theme="light"] .general-preview-card,[data-theme="light"] .dash-action,[data-theme="light"] .area-risk-row,[data-theme="light"] .role-guide{background:#f6f9fc}[data-theme="light"] .sensor-table-wrap{background:#fff}[data-theme="light"] .general-health-strip span,[data-theme="light"] .general-logo-tips span,[data-theme="light"] .password-guidance span{background:#f6f9fc}
@media(max-width:1450px){.admin-hero-modern{flex-direction:column}.hero-status-grid-modern,.security-kpis,.sensor-health-strip,.profile-mini-metrics{min-width:0}.dashboard-grid-modern,.general-settings-layout,.profile-layout-modern,.security-layout-modern{grid-template-columns:1fr}.dashboard-area-risk{grid-template-columns:1fr}.sensor-table-wrap{max-height:none}}
@media(max-width:900px){.admin-content{padding:12px}.hero-status-grid-modern,.security-kpis,.sensor-health-strip,.profile-mini-metrics{grid-template-columns:1fr 1fr}.sensor-toolbar-pro,.sensor-toolbar-pro>div:first-child{align-items:stretch;flex-direction:column}.sensor-toolbar-pro .toolbar-right{width:100%;justify-content:flex-start}.dashboard-grid-modern{grid-template-columns:1fr}.role-guide-grid{grid-template-columns:1fr}.general-preview-card{min-width:0}.app-dialog-body{flex-direction:column}.dash-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:560px){.hero-status-grid-modern,.security-kpis,.sensor-health-strip,.profile-mini-metrics{grid-template-columns:1fr}.hero-actions-modern{flex-direction:column}.hero-actions-modern .btn{width:100%;justify-content:center}.dash-stat-grid{grid-template-columns:1fr!important}.area-risk-row{grid-template-columns:1fr}.area-risk-reading{text-align:left}.profile-hero-pro{align-items:flex-start}.sensor-table-wrap{overflow-x:auto}.data-table{min-width:900px}}
