.btn {
    background-color: var(--button-primary-background-color); 
    color: var(--white-color);
    border: none;
    border-radius: 8px;
    padding: 0.6em 1.2em;
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.1s ease;
}

.btn:hover {
    background-color: var(--button-primary-background-color-dark);
}

.btn:active {
    transform: scale(0.97); 
}

.btn:focus {
    outline: 2px solid var(--button-primary-focus-ring-color); 
    outline-offset: 2px;
}


table .btn{
    padding: 0.5em 0.5em;
    padding-bottom: 0.1em;
    background-color: var(--button-danger-background-color);
    align-items: center;
}

table .btn:focus {
    outline: 2px solid var(--button-danger-focus-ring-color); 
    outline-offset: 2px;
}

.btn.info {
    background-color: var(--button-info-background-color);
}

.resultreports-search-button,
.resultsv2-list-reports-button {
    border-radius: 4px;
    padding: 0.6em 1.2em;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    /* Add some basic button-like styling for consistency if needed */
    background-color: var(--button-primary-background-color); /* Assuming a primary button color */
    color: var(--white-color);
    border: none;
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.1s ease;
    text-decoration: none; /* Add this line to remove underline */
}

.resultreports-search-button:hover,
.resultsv2-list-reports-button:hover {
    background-color: var(--button-primary-background-color-dark);
}

.resultreports-search-button:active,
.resultsv2-list-reports-button:active {
    transform: scale(0.97);
}

.resultreports-search-button:focus,
.resultsv2-list-reports-button:focus {
    outline: 2px solid var(--button-primary-focus-ring-color);
    outline-offset: 2px;
}