/* BlackSea Sentinel — Stiluri custom (defense-grade dark) */
:root {
  --marine-900: #0a2540;
  --marine-800: #0e2d4d;
  --marine-700: #143a63;
  --marine-600: #1e3a8a;
  --alert: #dc2626;
  --success: #16a34a;
  --warning: #f59e0b;
  --investigate: #ea580c;
}

* { -webkit-tap-highlight-color: transparent; }
body { background: radial-gradient(ellipse at top, #0e2d4d 0%, #0a2540 60%); }
.font-mono { font-family: 'JetBrains Mono', monospace; }

/* Radar loader */
.radar-spinner {
  width: 64px; height: 64px; border-radius: 50%;
  border: 2px solid rgba(37, 99, 235, 0.2);
  position: relative;
}
.radar-spinner::after {
  content: ''; position: absolute; inset: -2px; border-radius: 50%;
  border: 2px solid transparent; border-top-color: #2563eb;
  animation: radar-spin 1.1s linear infinite;
}
.radar-spinner::before {
  content: ''; position: absolute; inset: 8px; border-radius: 50%;
  background: conic-gradient(from 0deg, rgba(37,99,235,0.35), transparent 60%);
  animation: radar-spin 2.2s linear infinite;
}
@keyframes radar-spin { to { transform: rotate(360deg); } }

/* Pulse pentru alerte active */
.pulse-dot { position: relative; }
.pulse-dot::after {
  content: ''; position: absolute; inset: 0; border-radius: 50%;
  background: currentColor; opacity: 0.6;
  animation: pulse-ring 1.6s cubic-bezier(0.4,0,0.6,1) infinite;
}
@keyframes pulse-ring {
  0% { transform: scale(1); opacity: 0.6; }
  100% { transform: scale(3); opacity: 0; }
}

/* MapLibre markers */
.node-marker {
  width: 18px; height: 18px; border-radius: 50%;
  border: 2px solid rgba(255,255,255,0.85);
  cursor: pointer; box-shadow: 0 0 0 2px rgba(0,0,0,0.3);
  transition: transform 0.15s;
}
.node-marker:hover { transform: scale(1.3); }
.node-marker.online { background: #16a34a; }
.node-marker.maintenance { background: #f59e0b; }
.node-marker.offline { background: #dc2626; }
.node-marker.alert {
  background: #dc2626;
  animation: marker-pulse 1.2s ease-in-out infinite;
}
@keyframes marker-pulse {
  0%,100% { box-shadow: 0 0 0 2px rgba(220,38,38,0.4), 0 0 0 0 rgba(220,38,38,0.6); }
  50% { box-shadow: 0 0 0 2px rgba(220,38,38,0.4), 0 0 0 12px rgba(220,38,38,0); }
}

.maplibregl-popup-content {
  background: #0e2d4d !important; color: #e2e8f0 !important;
  border: 1px solid #143a63; border-radius: 10px; font-family: 'Inter', sans-serif;
}
.maplibregl-popup-tip { border-top-color: #0e2d4d !important; border-bottom-color: #0e2d4d !important; }

/* Scrollbar */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #0a2540; }
::-webkit-scrollbar-thumb { background: #143a63; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #1e3a8a; }

/* Cards */
.card {
  background: rgba(14, 45, 77, 0.6);
  border: 1px solid rgba(20, 58, 99, 0.8);
  backdrop-filter: blur(8px);
  border-radius: 14px;
}
.card-hover { transition: all 0.2s; }
.card-hover:hover { border-color: #2563eb; transform: translateY(-2px); }

/* Badges */
.badge { display: inline-flex; align-items: center; gap: 4px; padding: 2px 10px; border-radius: 999px; font-size: 11px; font-weight: 600; }
.badge-green { background: rgba(22,163,74,0.15); color: #4ade80; border: 1px solid rgba(22,163,74,0.4); }
.badge-yellow { background: rgba(245,158,11,0.15); color: #fbbf24; border: 1px solid rgba(245,158,11,0.4); }
.badge-orange { background: rgba(234,88,12,0.15); color: #fb923c; border: 1px solid rgba(234,88,12,0.4); }
.badge-red { background: rgba(220,38,38,0.15); color: #f87171; border: 1px solid rgba(220,38,38,0.4); }
.badge-blue { background: rgba(37,99,235,0.15); color: #60a5fa; border: 1px solid rgba(37,99,235,0.4); }

/* Nav link */
.nav-link { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-radius: 10px; color: #94a3b8; transition: all 0.15s; font-weight: 500; font-size: 14px; }
.nav-link:hover { background: rgba(20,58,99,0.6); color: #e2e8f0; }
.nav-link.active { background: #1e3a8a; color: #fff; }
.nav-link i { width: 20px; text-align: center; }

/* Inputs */
.input { width: 100%; background: rgba(10,37,64,0.8); border: 1px solid #143a63; border-radius: 10px; padding: 10px 14px; color: #e2e8f0; font-size: 14px; transition: border 0.15s; }
.input:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,0.15); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 18px; border-radius: 10px; font-weight: 600; font-size: 14px; cursor: pointer; transition: all 0.15s; border: none; }
.btn-primary { background: #2563eb; color: #fff; }
.btn-primary:hover { background: #1d4ed8; }
.btn-danger { background: #dc2626; color: #fff; }
.btn-ghost { background: rgba(20,58,99,0.5); color: #cbd5e1; border: 1px solid #143a63; }
.btn-ghost:hover { background: rgba(20,58,99,0.9); }
.btn:disabled { opacity: 0.5; cursor: not-allowed; }

/* Toast */
.toast { min-width: 280px; max-width: 380px; padding: 14px 16px; border-radius: 12px; box-shadow: 0 10px 40px rgba(0,0,0,0.5); animation: toast-in 0.3s ease; }
@keyframes toast-in { from { transform: translateX(120%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }

/* Table */
table.data-table { width: 100%; border-collapse: collapse; }
table.data-table th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: #64748b; padding: 10px 12px; border-bottom: 1px solid #143a63; }
table.data-table td { padding: 12px; border-bottom: 1px solid rgba(20,58,99,0.4); font-size: 14px; }
table.data-table tr:hover td { background: rgba(20,58,99,0.3); }

/* Fade in */
.fade-in { animation: fadeIn 0.35s ease; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

/* Black Swan banner */
.blackswan-banner {
  background: linear-gradient(90deg, rgba(220,38,38,0.25), rgba(220,38,38,0.05));
  border: 1px solid rgba(220,38,38,0.5);
  border-left: 4px solid #dc2626;
}

/* Responsive sidebar */
@media (max-width: 1024px) {
  #sidebar { transform: translateX(-100%); transition: transform 0.25s; position: fixed; z-index: 50; height: 100%; }
  #sidebar.open { transform: translateX(0); }
}
