html, body {
  height: 100%;
}

body {
  margin: 0;
  padding: 0;
}

@media (prefers-color-scheme: dark) {
  body {
    background: black;
  }
}

.root {
  display: flex;
  flex-direction: column;
  height: 100%;
}

@media print {
  * {
    height: auto !important;
    overflow: visible !important;
  }
}

/* ============================================================
   Efectos "glow" estilo Tron Ares para Traccar (tema Westnet)
   ============================================================ */

:root {
  --tron-magenta: #ec1561;
  --tron-cyan: #3bb8e0;
  --tron-bg: #0d0d12;
}

body {
  background-color: var(--tron-bg) !important;
}

.MuiPaper-root {
  border: 1px solid rgba(59, 184, 224, 0.25);
  box-shadow: 0 0 12px rgba(59, 184, 224, 0.15) !important;
}

.MuiButton-containedPrimary {
  background: linear-gradient(135deg, #ec1561, #a80d44) !important;
  box-shadow: 0 0 10px rgba(236, 21, 97, 0.5);
  transition: box-shadow 0.2s ease-in-out;
}
.MuiButton-containedPrimary:hover {
  box-shadow: 0 0 20px rgba(236, 21, 97, 0.9);
}

.MuiButton-containedSecondary {
  background: linear-gradient(135deg, #3bb8e0, #1f7fa3) !important;
  box-shadow: 0 0 10px rgba(59, 184, 224, 0.5);
  transition: box-shadow 0.2s ease-in-out;
}
.MuiButton-containedSecondary:hover {
  box-shadow: 0 0 20px rgba(59, 184, 224, 0.9);
}

@keyframes tron-pulse {
  0%   { box-shadow: 0 0 4px rgba(59, 184, 224, 0.6); }
  50%  { box-shadow: 0 0 14px rgba(59, 184, 224, 1); }
  100% { box-shadow: 0 0 4px rgba(59, 184, 224, 0.6); }
}
.tron-status-online {
  animation: tron-pulse 2s infinite;
  border-radius: 50%;
}

::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-track {
  background: #0d0d12;
}
::-webkit-scrollbar-thumb {
  background: var(--tron-cyan);
  border-radius: 5px;
}