body { 
    font-family: Arial, sans-serif; 
    margin: 0; 
    padding: 0; 
    color: #333; 
    background-color: #f8f9fa;
    height: 100%;
}

html {
    height: 100%;
}

h1, h2 { 
    color: #2c3e50; 
}

.container { 
    max-width: 800px; 
    margin: 0 auto; 
}

.status { 
    background-color: #f5f5f5; 
    padding: 15px; 
    border-radius: 5px; 
    margin-bottom: 20px; 
}

.urls { 
    margin-top: 20px; 
}

.url { 
    background-color: #e8f4f8; 
    padding: 10px; 
    margin-bottom: 5px; 
    border-radius: 3px; 
}

.badge { 
    padding: 5px 10px; 
    border-radius: 3px; 
    font-size: 12px; 
    font-weight: bold; 
}

.connected { 
    background-color: #27ae60; 
    color: white; 
}

.disconnected { 
    background-color: #e74c3c; 
    color: white; 
}

.tag {
    background-color: #34495e; 
    color: white; 
    padding: 2px 6px; 
    border-radius: 3px; 
    font-size: 12px;
}

.tag-url { 
    background-color: #e8f8e8; 
}

.tag-badge {
    background-color: #27ae60; 
    color: white; 
    padding: 2px 6px; 
    border-radius: 3px; 
    font-size: 12px;
}

/* Novo estilo para a página de transações */
.navbar {
    margin-bottom: 20px;
}

pre {
    background-color: #f8f9fa;
    padding: 10px;
    border-radius: 5px;
    white-space: pre-wrap;
    word-break: break-word;
    font-size: 12px;
}

.transaction-list {
    height: calc(100vh - 150px);
    overflow-y: auto;
    border: 1px solid #dee2e6;
    border-radius: .25rem;
}

.transaction-details {
    height: calc(100vh - 150px);
}

.transaction-details .card-body {
    overflow-y: auto;
    height: calc(100% - 50px);
}

.transaction-item {
    transition: all 0.2s ease;
    border-left: 3px solid transparent;
}

.transaction-item.active {
    border-left: 3px solid #0d6efd;
    background-color: rgba(13, 110, 253, 0.1);
    color: #212529 !important; /* texto escuro quando selecionado */
}

.transaction-item.active .text-muted {
    color: #495057 !important; /* texto de detalhes mais escuro quando selecionado */
}

.transaction-item:hover {
    background-color: rgba(0, 0, 0, 0.03);
}

.repeat-request {
    font-size: 0.8rem;
    padding: 0.25rem 0.5rem;
}

.badge-sm {
    font-size: 0.6rem !important;
    padding: 0.2rem 0.4rem !important;
}

.badge-sm {
    font-size: 0.6rem;
    padding: 0.2rem 0.4rem;
}