/* ========= Helium Explorer Frontend CSS ========= */
.hex-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 14px;
    margin: 20px 0;
}
.hex-stat-card {
    background: linear-gradient(135deg, #474DFF 0%, #29ABE2 100%);
    color: #fff;
    border-radius: 10px;
    padding: 18px 14px;
    text-align: center;
}
.hex-stat-full { grid-column: 1 / -1; background: #f5f5f5; color: #555; }
.hex-stat-number { display: block; font-size: 1.8em; font-weight: 700; }
.hex-stat-label  { display: block; font-size: .82em; opacity: .85; margin-top: 4px; }

.hex-table-wrap { overflow-x: auto; }
.hex-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .9em;
    margin: 16px 0;
}
.hex-table th {
    background: #474DFF;
    color: #fff;
    padding: 10px 12px;
    text-align: right;
    font-weight: 600;
}
.hex-table td { padding: 9px 12px; border-bottom: 1px solid #eee; }
.hex-table tr:hover td { background: #f9f9f9; }
.hex-table code { font-size: .85em; background: #f0f0f0; padding: 1px 5px; border-radius: 3px; }

.hex-badge { display:inline-block; padding:2px 9px; border-radius:10px; font-size:.8em; font-weight:600; }
.hex-online  { background:#d4edda; color:#155724; }
.hex-offline { background:#f8d7da; color:#721c24; }
.hex-iot     { background:#d1ecf1; color:#0c5460; }
.hex-mobile  { background:#fff3cd; color:#856404; }

.hex-hotspot-card { border:1px solid #ddd; border-radius:10px; padding:20px; max-width:600px; }
.hex-hotspot-card h3 { margin-top:0; color:#474DFF; }
.hex-detail-table { width:100%; border-collapse:collapse; }
.hex-detail-table th { width:40%; text-align:right; padding:7px 10px; background:#f5f5f5; font-weight:600; }
.hex-detail-table td { padding:7px 10px; border-bottom:1px solid #eee; }

.hex-widget-list { list-style:none; margin:0; padding:0; }
.hex-widget-list li { padding:6px 0; border-bottom:1px solid #eee; display:flex; justify-content:space-between; }
.hex-widget-sync { font-size:.82em; color:#888; }

.hex-error { color:#E74C3C; font-style:italic; }