:root {
    --navy: #001f3f;
    --green: #2ecc71;
    --light-bg: #f8f9fa;
    --gray: #808080;
    --red: #e74c3c;
}

body { font-family: 'Outfit', sans-serif; background-color: var(--light-bg); color: var(--navy); }

/* Tabla */
.color-navy { color: var(--navy); }
.bg-navy { background-color: var(--navy); }

.table thead { background-color: var(--navy); color: white; }
.table thead th { font-weight: 600; padding: 1.2rem; border: none; }
.table tbody td { padding: 1rem 1.2rem; vertical-align: middle; border-bottom: 1px solid #eee; }

/* Subtexto de IP */
.geo-ip-sub { font-size: 0.65rem; color: var(--gray); margin-top: 4px; }

/* Badges y Textos */
.badge-status { padding: 0.5em 1em; border-radius: 50px; font-size: 0.75rem; font-weight: 600; }
.status-online { background-color: #d4edda; color: #155724; }
.status-offline { background-color: #f8d7da; color: #721c24; }

.small-detail { font-size: 0.75rem; line-height: 1.3; }
.text-navy { color: var(--navy); }
a.text-primary { font-size: 0.75rem; color: #3498db !important; }
.text-link { text-decoration: none; color: #3498db; }
.text-link:hover { text-decoration: underline; }

/* Estilos de la Lista Compacta de LAN */
.clientes-scroll { max-height: 85px; overflow-y: auto; padding-right: 5px; }
.lan-list { list-style: none; padding: 0; margin: 0; }
.lan-item { display: flex; align-items: center; white-space: nowrap; margin-bottom: 3px; font-size: 0.75rem; }
.dot-green { height: 6px; width: 6px; background-color: var(--green); border-radius: 50%; margin-right: 8px; flex-shrink: 0; }
.lan-name { font-weight: 600; }
.lan-ip { font-size: 0.7rem; color: var(--gray); margin-left: 5px; font-weight: 400; }

/* Iconos de Dispositivo */
.dev-icon { 
    width: 35px; height: 35px; border-radius: 8px; 
    display: flex; align-items: center; justify-content: center; 
    font-size: 1.4rem; 
    background-color: transparent; 
    color: #2c3e50; 
    transition: transform 0.2s; 
}
.dev-icon:hover { transform: scale(1.1); }
.bg-green { background-color: var(--green) !important; color: white !important; }
.exit-node-row { background-color: rgba(46, 204, 113, 0.05) !important; }

.btn-login { background-color: var(--navy); color: white; border-radius: 50px; font-weight: 600; transition: 0.3s; }
.btn-login:hover { background-color: #003366; color: var(--green); }