.modal-overlay {
    position: fixed; 
    top: 0; left: 0; width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.6); 
    display: flex; 
    justify-content: center;
    align-items: center;
    z-index: 9999; 
}

.modal-box {
    background-color: white;
    padding: 30px;
    border-radius: 10px;
    text-align: center;
    max-width: 400px;
    width: 90%;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
}

.modal-buttons {
    margin-top: 25px;
    display: flex;
    justify-content: space-around;
}

.btn-secundario {
    background-color: #6c757d; color: white; border: none; 
    padding: 10px 20px; border-radius: 5px; cursor: pointer; font-weight: bold;
}

.btn-principal {
    background-color: #0d6efd; color: white; border: none; 
    padding: 10px 20px; border-radius: 5px; cursor: pointer; font-weight: bold;
}

.btn-secundario:hover { background-color: #5c636a; }
.btn-principal:hover { background-color: #0b5ed7; }