/* Custom styling for Packet Loss Test */
.bg-subtle-grid-cyan {
    background-image: radial-gradient(rgba(6, 182, 212, 0.08) 1px, transparent 1px);
    background-size: 24px 24px;
}

.apple-glass {
    background: rgba(15, 23, 42, 0.65);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.pkt-dur-btn.active {
    background-color: rgba(6, 182, 212, 0.2);
    border-color: rgba(6, 182, 212, 0.4);
    color: #ffffff;
}

.packet-node {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    transition: all 0.15s ease-in-out;
}

.packet-node.pending {
    background-color: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.15);
}

.packet-node.received {
    background-color: #34d399;
    box-shadow: 0 0 6px rgba(52, 211, 153, 0.4);
}

.packet-node.late {
    background-color: #fbbf24;
    box-shadow: 0 0 6px rgba(251, 191, 36, 0.4);
}

.packet-node.lost {
    background-color: #f43f5e;
    box-shadow: 0 0 6px rgba(244, 63, 94, 0.4);
}