:root {
    --preto-profundo: #0A0A0A;
    --preto-carbono: #1A1A1A;
    --preto-grafite: #2D2D2D;
    --cinza-escuro: #4A4A4A;
    --cinza-claro: #E0E0E0;
    --cinza-gelo: #F5F5F5;
    --vermelho: rgb(173, 0, 0);
    --vermelho-escuro: rgb(112, 0, 13);
    --dourado: #C5A028;
    --dourado-suave: #B49450;
    --verde: #4CAF50;
    --verde-sucesso: #28a745;
    --verde-escuro: #218838;
    --verde-whatsapp: #25D366;
    --verde-whatsapp-dark: #128C7E;
    --verde-pix: #32BCAD;
    --verde-pix-dark: #28998D;
    --verde-claro: #40916C;
    --azul: #1E3A5F;
    --azul-claro: #2C4C6B;
    --azul-info: #17a2b8;
    --roxo: #6f42c1;
    --primary: #2563eb;
    --danger: #dc2626;
    --success: rgb(0, 0, 0);
    --warning: #f59e0b;
    --branco: #FFFFFF;
    --branco-off: #F8F8F8;
    --sombra: 0 10px 30px rgba(0, 0, 0, 0.1);
    --sombra-suave: 0 5px 15px rgba(0, 0, 0, 0.08);
    --transicao: all 0.3s ease;
}


/* Botão de Atualização */
.refresh-button {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    background-color: var(--cinza-gelo);
    color: var(--branco);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: var(--sombra);
    z-index: 9999;
    transition: all 0.3s ease;
    border: 2px solid var(--dourado);
}

.refresh-button:hover {
    background-color: var(--preto-profundo);
    transform: rotate(360deg);
    color: var(--cinza-gelo);
}


.refresh-button i {
    font-size: 20px;
    color: var(--dourado);
}

.refresh-button i:hover {
    font-size: 20px;
    color: var(--cinza-gelo);
}

.refresh-button a {
    color: inherit;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.refresh-button a:hover {
    color: var(--cinza-gelo);
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}


.btn-voltar {
    background-color: var(--cinza-escuro);
    color: var(--cinza-claro);
    border: none;
    padding: 8px 20px;
    border-radius: 15px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: var(--transicao);
    text-decoration: none;
}

.btn-voltar:hover {
    background-color: var(--preto-carbono);
    color: var(--branco);
    transform: translateY(-2px);
}